diff options
Diffstat (limited to 'mediagoblin/static')
-rw-r--r-- | mediagoblin/static/css/audio.css | 3 | ||||
-rw-r--r-- | mediagoblin/static/css/base.css | 156 | ||||
l--------- | mediagoblin/static/extlib/video-js | 2 | ||||
-rw-r--r-- | mediagoblin/static/images/small-gavroche.png | bin | 0 -> 4599 bytes | |||
-rw-r--r-- | mediagoblin/static/images/small-gavroche.xcf | bin | 0 -> 392752 bytes | |||
-rw-r--r-- | mediagoblin/static/images/type_icons/video.png | bin | 0 -> 1245 bytes | |||
l--------- | mediagoblin/static/js/extlib/html5slider.js | 1 | ||||
l--------- | mediagoblin/static/js/extlib/jquery.js | 2 | ||||
-rw-r--r-- | mediagoblin/static/js/geolocation-map.js | 6 | ||||
-rw-r--r-- | mediagoblin/static/js/header_dropdown.js | 24 | ||||
-rw-r--r-- | mediagoblin/static/js/post_comment.js | 63 |
11 files changed, 230 insertions, 27 deletions
diff --git a/mediagoblin/static/css/audio.css b/mediagoblin/static/css/audio.css index e007a0e1..5c50e727 100644 --- a/mediagoblin/static/css/audio.css +++ b/mediagoblin/static/css/audio.css @@ -1,6 +1,9 @@ .audio-spectrogram { position: relative; } +.audio-spectrogram > img { + width: 100%; +} .playhead { position: absolute; top: 0; diff --git a/mediagoblin/static/css/base.css b/mediagoblin/static/css/base.css index 0bd58738..6da19f94 100644 --- a/mediagoblin/static/css/base.css +++ b/mediagoblin/static/css/base.css @@ -25,7 +25,7 @@ src: local('Lato Regular'), local('Lato-Regular'), url('../fonts/Lato-Regular.ttf') format('truetype'); } -body { +html, body { background-color: #161616; color: #C3C3C3; padding: 0; @@ -110,6 +110,23 @@ input, textarea { /* website structure */ +#wrap { + min-height: 100%; + height: auto; + + /* This must be equal to the footer height + 5px */ + margin-bottom: -35px; +} + +#wrap:after { + content: ""; + display: block; +} + +footer, #wrap:after { + height: 30px; +} + header { width: 100%; padding: 0; @@ -154,6 +171,26 @@ header { a.logo { color: #fff; font-weight: bold; + text-decoration: none; +} + +.status_icon { + border-radius: 2px; + padding: 4px; + margin: 0px 4px; +} + +.num_queued { + background: #56446F; +} + +.num_failed { + background: #87453B; +} + +.status_icon a { + display: inline-block; + color: #C3C3C3; } .logo img { @@ -176,9 +213,7 @@ a.logo { footer { width: 100%; - height: 30px; border-top: 1px solid #333; - bottom: 0px; padding: 8px 0; text-align: center; font-size: 0.875em; @@ -196,14 +231,20 @@ footer { } .media_image_container { - display: flex; - justify-content: center; } .media_image { + display: block; + margin-left: auto; + margin-right: auto; max-width: 100%; } +.media_other_container { + display: flex; + justify-content: center; +} + .media_pane { /* in place for possible future wide view */ /* border-bottom: 1px solid #333333;*/ @@ -353,6 +394,12 @@ text-align: center; margin-right: auto; } +.form_box > h1, .form_box_xl > h1 { + /* Fix header overflowing issue. */ + overflow: hidden; + text-overflow: ellipsis +} + .form_box_xl { max-width: 460px; } @@ -416,11 +463,9 @@ text-align: center; } .form_field_label { - margin-bottom: 4px; -} - -.form_field_label { font-size:1.125em; + margin-bottom: 0; + padding: 10px 0; } .form_field_description { @@ -544,11 +589,11 @@ ul#action_to_resolve {list-style:none; margin-left:10px;} border-radius: 0 0 5px 5px; padding: 0 0 6px; text-overflow: ellipsis; - white-space: nowrap; overflow: hidden; border-color: #0D0D0D; border-style: solid; border-width: 1px 1px 2px; + position: relative; } .media_thumbnail a { @@ -566,12 +611,11 @@ a.thumb_entry_title { padding: 8px; } -/* For now, this is commented out since our thumbnails are actually 180px high. - * - * .media_thumbnail img { - * max-height: 135px; - * } - */ +.entry_type_icon { + position: absolute; + top: 2px; + left: 2px; +} .thumb_entry_last { margin-right: 0px; @@ -733,6 +777,42 @@ table.media_panel th { padding-bottom: 4px; text-align: left; } +.thumb-overlay-status { + position: absolute; + margin: auto; + top: 0; bottom: 0; left: 0; right: 0; + width: 180px; + height: 20px; + display: inline; + text-align: center; + background-color: rgba(255, 255, 255, 0.8); +} + +.thumb-processing { + color: black; + font-weight: bold; +} + +.thumb-failed { + color: red; + font-weight: bold; +} + +.thumb-wrapper { + position: relative; +/* for proportional thumb resizing */ + width: auto; + height: auto; + display: inline-block; +} + +.thumb-wrapper img { + max-height: 180px; + max-width: 180px; +} +.media_panel td { + vertical-align: middle; +} /* moderator panels */ @@ -872,7 +952,12 @@ pre { margin-left:3px; margin-right:3px; } + #thingy_view { + width:640px; + height:640px; + } } + /* Tablet Portrait size to standard 960 (devices and browsers) */ @media only screen and (min-width: 768px) and (max-width: 959px) { .container .three.columns.media_thumbnail { @@ -881,7 +966,7 @@ pre { margin-right:2px; } .media_thumbnail.thumb_entry img { - margin-left: -16.5px; + max-width:100%; } .thumb_gallery { margin-left: 0; @@ -889,7 +974,12 @@ pre { } .navigation_button { } + #thingy_view { + width:508px; + height:508px; + } } + /* All Mobile Sizes (devices and browser) */ @media screen and (max-width: 767px) { .thumb_row { @@ -931,6 +1021,22 @@ pre { } } +/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ +@media only screen and (min-width: 480px) and (max-width: 767px) { + #thingy_view { + width:420px; + height:420px; + } +} + +/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ +@media only screen and (max-width: 479px) { + #thingy_view { + width:300px; + height:300px; + } +} + p.verifier { text-align:center; font-size:50px; @@ -950,3 +1056,19 @@ table.metadata_editor tr td { table.metadata_editor tr td.form_field_input input { width:350px; } + +.application { + min-height: 30px; + margin-left: 70px; +} + +.application-icon { + position: absolute; + left: 12px; + width: 50px; + height: 50px; +} + +.application-button { + float: right; +} diff --git a/mediagoblin/static/extlib/video-js b/mediagoblin/static/extlib/video-js index 65652d6e..58401be0 120000 --- a/mediagoblin/static/extlib/video-js +++ b/mediagoblin/static/extlib/video-js @@ -1 +1 @@ -../../../extlib/video-js/
\ No newline at end of file +../../../extlib/video.js/dist/video-js
\ No newline at end of file diff --git a/mediagoblin/static/images/small-gavroche.png b/mediagoblin/static/images/small-gavroche.png Binary files differnew file mode 100644 index 00000000..13192d97 --- /dev/null +++ b/mediagoblin/static/images/small-gavroche.png diff --git a/mediagoblin/static/images/small-gavroche.xcf b/mediagoblin/static/images/small-gavroche.xcf Binary files differnew file mode 100644 index 00000000..0291d2e1 --- /dev/null +++ b/mediagoblin/static/images/small-gavroche.xcf diff --git a/mediagoblin/static/images/type_icons/video.png b/mediagoblin/static/images/type_icons/video.png Binary files differnew file mode 100644 index 00000000..83687617 --- /dev/null +++ b/mediagoblin/static/images/type_icons/video.png diff --git a/mediagoblin/static/js/extlib/html5slider.js b/mediagoblin/static/js/extlib/html5slider.js deleted file mode 120000 index feae2cb8..00000000 --- a/mediagoblin/static/js/extlib/html5slider.js +++ /dev/null @@ -1 +0,0 @@ -../../../../extlib/html5slider/html5slider.js
\ No newline at end of file diff --git a/mediagoblin/static/js/extlib/jquery.js b/mediagoblin/static/js/extlib/jquery.js index d78f5cc3..8c711f27 120000 --- a/mediagoblin/static/js/extlib/jquery.js +++ b/mediagoblin/static/js/extlib/jquery.js @@ -1 +1 @@ -../../../../extlib/jquery/jquery.js
\ No newline at end of file +../../../../extlib/jquery/dist/jquery.js
\ No newline at end of file diff --git a/mediagoblin/static/js/geolocation-map.js b/mediagoblin/static/js/geolocation-map.js index 26d94c5d..c30788f7 100644 --- a/mediagoblin/static/js/geolocation-map.js +++ b/mediagoblin/static/js/geolocation-map.js @@ -30,13 +30,11 @@ $(document).ready(function () { // Get a new map instance attached and element with id="tile-map" var map = new L.Map('tile-map'); - var mqtileUrl = 'http://otile{s}.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.jpg'; + var mqtileUrl = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'; var mqtileAttrib = '<a id="osm_license_link">see map license</a>'; var mqtile = new L.TileLayer( mqtileUrl, - {maxZoom: 18, - attribution: mqtileAttrib, - subdomains: '1234'}); + {maxZoom: 18}); map.attributionControl.setPrefix(''); var location = new L.LatLng(latitude, longitude); diff --git a/mediagoblin/static/js/header_dropdown.js b/mediagoblin/static/js/header_dropdown.js index 3ee46228..979d2690 100644 --- a/mediagoblin/static/js/header_dropdown.js +++ b/mediagoblin/static/js/header_dropdown.js @@ -17,9 +17,27 @@ */ $(document).ready(function(){ - $("#header_dropdown").hide(); - $(".header_dropdown_up").hide(); - $(".header_dropdown_down,.header_dropdown_up").click(function() { + // The header drop-down header panel defaults to open until you explicitly + // close it. After that, the panel open/closed setting will persist across + // page loads. + + // Initialise the panel status when page is loaded. + if (localStorage.getItem("panel_closed")) { + $("#header_dropdown").hide(); + $(".header_dropdown_up").hide(); + } + else { + $(".header_dropdown_down").hide(); + } + + // Toggle and persist the panel status. + $(".header_dropdown_down, .header_dropdown_up").click(function() { + if (localStorage.getItem("panel_closed")) { + localStorage.removeItem("panel_closed"); + } + else { + localStorage.setItem("panel_closed", "true"); + } $(".header_dropdown_down").toggle(); $(".header_dropdown_up").toggle(); $("#header_dropdown").slideToggle(); diff --git a/mediagoblin/static/js/post_comment.js b/mediagoblin/static/js/post_comment.js new file mode 100644 index 00000000..431c222f --- /dev/null +++ b/mediagoblin/static/js/post_comment.js @@ -0,0 +1,63 @@ +/** + * GNU MediaGoblin -- federated, autonomous media hosting + * Copyright (C) 2011, 2012 MediaGoblin contributors. See AUTHORS. + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see <http://www.gnu.org/licenses/>. + */ + +$(document).ready(function(){ + $(function() { + // Hide this button if script is enabled + $('.form_submit_buttons').find('input').hide(); + + // Include this link if script is enabled + $('.form_submit_buttons').append( + '<a class="button_action" id="post_comment" type="button">' + + 'Add this comment </a>'); + + $('#post_comment').click(function() { + $.ajax({ + url: $('#postCommentURL').val(), + data: $('#form_comment').serialize(), + type: 'POST', + success: function(response) { + var message = $(response).find('.mediagoblin_messages'); + var commentsInResponse = $($(response).find('.media_comments')).find('li'); + var commentsInPage = $('.media_comments').find('ul'); + + // Post the message + message.css({"position":"fixed", "top":"50px", "width":"100%"}); + $('body').append(message); + message.delay(1500).fadeOut(); + + // Checking if there is new comment + if(commentsInResponse.length != $(commentsInPage).find('li').length) { + // Post comment and scroll down to it + var newComment = commentsInResponse[commentsInResponse.length - 1]; + $('#form_comment').fadeOut('fast'); + $('#button_addcomment').fadeIn('fast'); + $('#comment_preview').replaceWith("<div id=comment_preview></div>"); + $(commentsInPage).append(newComment); + $('html, body').animate({ + scrollTop: $(newComment).offset().top + }, 1000); + } + }, + error: function(error) { + console.log(error); + } + }); + }); + }); +});
\ No newline at end of file |