bring some styling back to the colorbox and improve the event preview ability

This commit is contained in:
friendica 2015-02-09 18:58:43 -08:00
parent ad731b7c7b
commit fce51876c9
12 changed files with 70 additions and 17 deletions

BIN
images/controls.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
images/loading.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 131 B

BIN
images/overlay.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 115 B

BIN
images/redzot.xcf Normal file

Binary file not shown.

View file

@ -2,7 +2,7 @@
Colorbox Core Style:
The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:1; overflow:hidden;}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
@ -22,14 +22,14 @@
*/
#cboxOverlay{background:url(images/overlay.png) repeat 0 0; opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
#cboxTopLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -101px 0;}
/* #cboxTopLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -101px 0;}
#cboxTopRight{width:21px; height:21px; background:url(images/controls.png) no-repeat -130px 0;}
#cboxBottomLeft{width:21px; height:21px; background:url(images/controls.png) no-repeat -101px -29px;}
#cboxBottomRight{width:21px; height:21px; background:url(images/controls.png) no-repeat -130px -29px;}
#cboxMiddleLeft{width:21px; background:url(images/controls.png) left top repeat-y;}
#cboxMiddleRight{width:21px; background:url(images/controls.png) right top repeat-y;}
#cboxTopCenter{height:21px; background:url(images/border.png) 0 0 repeat-x;}
#cboxBottomCenter{height:21px; background:url(images/border.png) 0 -29px repeat-x;}
#cboxBottomCenter{height:21px; background:url(images/border.png) 0 -29px repeat-x;} */
#cboxContent{background:#fff; overflow:hidden;}
.cboxIframe{background:#fff;}
#cboxError{padding:50px; border:1px solid #ccc;}

View file

@ -85,11 +85,19 @@ function events_post(&$a) {
$onerror_url = $a->get_baseurl() . "/events/" . $action . "?summary=$summary&description=$desc&location=$location&start=$start_text&finish=$finish_text&adjust=$adjust&nofinish=$nofinish";
if(strcmp($finish,$start) < 0 && !$nofinish) {
notice( t('Event can not end before it has started.') . EOL);
if(intval($_REQUEST['preview'])) {
echo( t('Unable to generate preview.'));
killme();
}
goaway($onerror_url);
}
if((! $summary) || (! $start)) {
notice( t('Event title and start time are required.') . EOL);
if(intval($_REQUEST['preview'])) {
echo( t('Unable to generate preview.'));
killme();
}
goaway($onerror_url);
}
@ -104,6 +112,10 @@ function events_post(&$a) {
);
if(! $x) {
notice( t('Event not found.') . EOL);
if(intval($_REQUEST['preview'])) {
echo( t('Unable to generate preview.'));
killme();
}
return;
}
if($x[0]['allow_cid'] === '<' . $channel['channel_hash'] . '>'

45
view/css/colorbox.css Normal file
View file

@ -0,0 +1,45 @@
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:1; overflow:hidden;}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}
/*
User Style:
Change the following styles to modify the appearance of Colorbox. They are
ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:url(/images/overlay.png) repeat 0 0; opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
#cboxContent{background:#fff; overflow:hidden;}
.cboxIframe{background:#fff;}
#cboxError{padding:50px; border:1px solid #ccc;}
#cboxLoadedContent{margin-bottom:28px;}
#cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
#cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
#cboxLoadingOverlay{background:url(/images/loading_background.png) no-repeat center center;}
#cboxLoadingGraphic{background:url(/images/loading.gif) no-repeat center center;}
/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
#cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}
#cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
#cboxPrevious{position:absolute; bottom:0; left:0; background:url(/images/controls.png) no-repeat -75px 0; width:25px
; height:25px; text-indent:-9999px;}
#cboxPrevious:hover{background-position:-75px -25px;}
#cboxNext{position:absolute; bottom:0; left:27px; background:url(/images/controls.png) no-repeat -50px 0; width:25px;
height:25px; text-indent:-9999px;}
#cboxNext:hover{background-position:-50px -25px;}
#cboxClose{position:absolute; bottom:0; right:0; background:url(/images/controls.png) no-repeat -25px 0; width:25px;
height:25px; text-indent:-9999px;}
#cboxClose:hover{background-position:-25px -25px;}

View file

@ -1,7 +1,7 @@
function dirdetails(hash) {
$.get('dirprofile' + '?f=&hash=' + hash, function( data ) {
$.colorbox({ maxWidth: "50%", maxHeight: "75%", html: data });
$.colorbox({ maxWidth: "80%", maxHeight: "75%", scrolling: false, html: data });
});
}
@ -28,7 +28,7 @@ function doRatings(hash) {
function buildRatingForm(hash) {
var html = '<form id="ratings_form" action="prate" method="post"><input type="hidden" name="target" value="'+hash+'" /><div class="rating-desc">'+aStr['rating_desc']+'</div><input id="dir-rating-range" class="directory-slider" type="text" value="'+ratingVal+'" name="rating" style="display: none;" /><div class="rating-text-label">'+aStr['rating_text']+'<input type="text" name="rating_text" class="directory-rating-text" value="'+ratingText+'" /><br /><input name="submit" class="directory-rating-submit" type="submit" value="'+aStr['submit']+'" onclick="postRatings(); return false;"></form><div class="clear"></div><script>$("#dir-rating-range").jRange({ from: -10, to: 10, step: 1, showLabels: false, showScale: true, scale : [ "-10","-5","0","5","10" ], onstatechange: function(v) { $("#dir-rating-range").val(v); } });</script>';
$.colorbox({maxwidth: "50%", maxHeight: "50%", html: html, close: 'X' });
$.colorbox({maxwidth: "50%", maxHeight: "50%", scrolling: false, html: html, close: 'X' });
currentHash = hash;
}

View file

@ -8,9 +8,9 @@ head_add_css('library/jRange/jquery.range.css');
head_add_css('view/css/conversation.css');
head_add_css('view/css/widgets.css');
head_add_css('view/css/colorbox.css');
head_add_css('library/justifiedGallery/dist/css/justifiedGallery.css');
head_add_css('library/bootstrap-tagsinput/bootstrap-tagsinput.css');
head_add_js('jquery.js');
head_add_js('jquery-migrate-1.1.1.js');
head_add_js('library/justifiedGallery/dist/js/jquery.justifiedGallery.js');

View file

@ -575,15 +575,10 @@ footer {
#cboxContent {
color: $dirpopup_txtcol;
margin: 5px;
}
#cboxClose {
margin: 10px;
}
#colorbox {
margin: 5px;
padding: 5px;
}
#cboxContent a {
@ -974,14 +969,13 @@ nav .acpopup {
.vevent {
max-width: 100%;
margin-left: 10px;
margin-right: 10px;
margin: 10px;
padding: 10px;
border: 1px solid #CCCCCC;
}
.vevent .event-summary {
margin-left: 10px;
margin-right: 10px;
margin: 10px;
font-weight: bold;
}
@ -1027,6 +1021,7 @@ nav .acpopup {
.event-start .dtstart, .event-end .dtend {
float: right;
margin-right: 10px;
}
.event-list-date {

View file

@ -7,7 +7,7 @@
$.get(
'{{$baseurl}}/events/?id='+eventid,
function(data){
$.colorbox({ html: data });
$.colorbox({ scrolling: false, html: data, onComplete: function() { $.colorbox.resize(); }});
}
);
}
@ -17,6 +17,7 @@
$.post('events',$('#event-edit-form').serialize(), function(data) {
$.colorbox({ html: data });
});
$('#event-edit-preview').val(0);
}