mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/MultimediaViewer
synced 2024-09-25 11:17:54 +00:00
Reorganize UI to be...way sexier.
There's just no other adjective for this, it is _super_ nice. There may be refinements later as the designers get things together. Bug: 56499 Change-Id: I200684a19c190444587f520595186e9ae5afbea6
This commit is contained in:
Mark Holmquist
parent
2d2dc0353b
commit
5aaf1e73fe
|
|
@ -1,45 +1,70 @@
|
||||||
.mw-lightbox-title-div {
|
/**
|
||||||
text-align: left;
|
* Override multilightbox styles that don't apply to us
|
||||||
padding-left: 10px;
|
*/
|
||||||
font-weight: bold;
|
.mlb-main.mlb-fullscreened {
|
||||||
|
background-color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mlb-image-wrapper {
|
||||||
|
top: 0px;
|
||||||
|
bottom: 64px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mlb-controls {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mlb-post-image {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 0px;
|
height: auto;
|
||||||
left: 0px;
|
background-color: #e4e2e1;
|
||||||
right: 0px;
|
}
|
||||||
|
|
||||||
|
.mw-mlb-controls-position {
|
||||||
|
position: absolute;
|
||||||
|
top: -999px;
|
||||||
|
left: -999px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mw-mlb-controls-wrapper {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mw-mlb-controls {
|
||||||
|
border: none;
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
z-index: 1003;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.mobile .mw-mlb-controls,
|
||||||
|
.mw-mlb-controls-position:hover .mw-mlb-controls {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mw-mlb-controls div {
|
||||||
|
position: static;
|
||||||
|
border: none;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mw-lightbox-title-div,
|
||||||
|
.mw-lightbox-extra-info-div {
|
||||||
|
text-align: left;
|
||||||
height: 50px;
|
height: 50px;
|
||||||
|
position: absolute;
|
||||||
|
right: 0px;
|
||||||
|
left: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
/* FF 3.6+ */
|
.mw-lightbox-title-div {
|
||||||
background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
|
bottom: 0px;
|
||||||
|
|
||||||
/* Chrome, Safari 4+ */
|
|
||||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,1)));
|
|
||||||
|
|
||||||
/* Chrome 10+, Safari 5.1+ */
|
|
||||||
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%);
|
|
||||||
|
|
||||||
/* Opera 11.10+ */
|
|
||||||
background: -o-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%);
|
|
||||||
|
|
||||||
/* IE10+ */
|
|
||||||
background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%);
|
|
||||||
|
|
||||||
/* W3C */
|
|
||||||
background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%);
|
|
||||||
|
|
||||||
/* IE 6-9 */
|
|
||||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 );
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-lightbox-extra-info-div {
|
.mw-lightbox-extra-info-div {
|
||||||
height: 50px;
|
|
||||||
position: absolute;
|
|
||||||
bottom: -50px;
|
bottom: -50px;
|
||||||
right: 0px;
|
|
||||||
left: 0px;
|
|
||||||
|
|
||||||
text-align: left;
|
|
||||||
padding-left: 10px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-lightbox-extra-info-div a,
|
.mw-lightbox-extra-info-div a,
|
||||||
|
|
@ -58,10 +83,6 @@
|
||||||
right: 0px;
|
right: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mlb-fullscreen-div {
|
|
||||||
background-color: rgb( 255, 255, 255 );
|
|
||||||
}
|
|
||||||
|
|
||||||
.mlb-overlay {
|
.mlb-overlay {
|
||||||
background-color: rgba( 255, 255, 255, 0.9 );
|
background-color: rgba( 255, 255, 255, 0.9 );
|
||||||
}
|
}
|
||||||
|
|
@ -86,30 +107,35 @@
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-mlb-title {
|
.mw-mlb-title-para {
|
||||||
margin-bottom: 1px;
|
margin-bottom: 1px;
|
||||||
margin-top: 0px;
|
margin-top: 0px;
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
font-weight: bold;
|
}
|
||||||
|
|
||||||
|
.mw-mlb-title {
|
||||||
font-size: 1.2em;
|
font-size: 1.2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-mlb-author {
|
.mw-mlb-image-metadata {
|
||||||
font-weight: bold;
|
width: 100%;
|
||||||
|
background-color: #e4e2e1;
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-mlb-image-metadata {
|
.mw-mlb-image-desc-div {
|
||||||
margin-top: 30px;
|
width: 60%;
|
||||||
width: 64%;
|
overflow-y: auto;
|
||||||
margin: 30px auto;
|
}
|
||||||
position: relative;
|
|
||||||
|
.mw-mlb-image-links-div {
|
||||||
|
width: 40%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-mlb-image-desc-div,
|
.mw-mlb-image-desc-div,
|
||||||
.mw-mlb-image-links-div {
|
.mw-mlb-image-links-div {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 50%;
|
height: 150px;
|
||||||
height: 100px;
|
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -117,10 +143,6 @@
|
||||||
color: #6f7073;
|
color: #6f7073;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-mlb-image-desc-div {
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mw-mlb-image-links li {
|
.mw-mlb-image-links li {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
font-size: 0.8em;
|
font-size: 0.8em;
|
||||||
|
|
@ -161,29 +183,18 @@
|
||||||
background-image: none !important;
|
background-image: none !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-mlb-credit.empty {
|
.mw-mlb-license,
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mw-mlb-license-contain,
|
|
||||||
.mw-mlb-title-credit {
|
.mw-mlb-title-credit {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-mlb-license-contain {
|
|
||||||
width: 30%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mw-mlb-title-credit {
|
.mw-mlb-title-credit {
|
||||||
width: 70%;
|
width: 100%;
|
||||||
}
|
height: 64px;
|
||||||
|
|
||||||
.mw-mlb-title-contain {
|
|
||||||
padding-left: 10px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-mlb-license {
|
.mw-mlb-license {
|
||||||
padding-right: 10px;
|
padding-left: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mw-mlb-license.empty {
|
.mw-mlb-license.empty {
|
||||||
|
|
@ -220,9 +231,16 @@
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mw-mlb-title-para,
|
||||||
|
.mw-mlb-credit,
|
||||||
|
.mw-mlb-image-desc,
|
||||||
|
.mw-mlb-mmv-about-links {
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
.mw-mlb-mmv-about-links {
|
.mw-mlb-mmv-about-links {
|
||||||
font-size: 0.8em;
|
font-size: 0.8em;
|
||||||
padding-top: 20px;
|
padding: 20px;
|
||||||
width: 50%;
|
width: 50%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -238,3 +256,12 @@
|
||||||
.mlb-image.empty img {
|
.mlb-image.empty img {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
body.mw-mlb-lightbox-open {
|
||||||
|
/** Stop the article from scrolling in the background */
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
body.mw-mlb-lightbox-open .mlb-main {
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -109,6 +109,7 @@
|
||||||
// some src attribute to work. Will fix.
|
// some src attribute to work. Will fix.
|
||||||
viewer.lightbox.images[index].src = $thumbContain.find( 'img' ).prop( 'src' );
|
viewer.lightbox.images[index].src = $thumbContain.find( 'img' ).prop( 'src' );
|
||||||
viewer.lightbox.open();
|
viewer.lightbox.open();
|
||||||
|
$( document.body ).addClass( 'mw-mlb-lightbox-open' );
|
||||||
viewer.lightbox.iface.$imageDiv.append( $.createSpinner( {
|
viewer.lightbox.iface.$imageDiv.append( $.createSpinner( {
|
||||||
id: 'mw-mlb-loading-spinner',
|
id: 'mw-mlb-loading-spinner',
|
||||||
size: 'large'
|
size: 'large'
|
||||||
|
|
@ -120,6 +121,7 @@
|
||||||
imageEle.onload = function () {
|
imageEle.onload = function () {
|
||||||
viewer.lightbox.iface.replaceImageWith( imageEle );
|
viewer.lightbox.iface.replaceImageWith( imageEle );
|
||||||
viewer.lightbox.iface.$imageDiv.removeClass( 'empty' );
|
viewer.lightbox.iface.$imageDiv.removeClass( 'empty' );
|
||||||
|
viewer.updateControls();
|
||||||
$.removeSpinner( 'mw-mlb-loading-spinner' );
|
$.removeSpinner( 'mw-mlb-loading-spinner' );
|
||||||
viewer.setImageInfo( fileTitle, imageInfo );
|
viewer.setImageInfo( fileTitle, imageInfo );
|
||||||
};
|
};
|
||||||
|
|
@ -135,9 +137,13 @@
|
||||||
this.lightbox = new MultiLightbox( urls );
|
this.lightbox = new MultiLightbox( urls );
|
||||||
}
|
}
|
||||||
|
|
||||||
|
lightboxHooks.register( 'closeInterface', function () {
|
||||||
|
this.$mwControls.css( { top: '-999px', left: '-999px' } );
|
||||||
|
$( document.body ).removeClass( 'mw-mlb-lightbox-open' );
|
||||||
|
} );
|
||||||
|
|
||||||
lightboxHooks.register( 'imageResize', function () {
|
lightboxHooks.register( 'imageResize', function () {
|
||||||
var api = new mw.Api(),
|
var api = new mw.Api(),
|
||||||
ratio = this.isFullScreen ? 0.9 : 0.5,
|
|
||||||
density = $.devicePixelRatio(),
|
density = $.devicePixelRatio(),
|
||||||
filename = viewer.currentImageFilename,
|
filename = viewer.currentImageFilename,
|
||||||
ui = this;
|
ui = this;
|
||||||
|
|
@ -148,8 +154,8 @@
|
||||||
titles: filename,
|
titles: filename,
|
||||||
prop: 'imageinfo',
|
prop: 'imageinfo',
|
||||||
iiprop: 'url',
|
iiprop: 'url',
|
||||||
iiurlwidth: Math.floor( density * ratio * $( window ).width() * 1.1 ),
|
iiurlwidth: Math.floor( density * this.$imageWrapper.width() ),
|
||||||
iiurlheight: Math.floor( density * ratio * $( window ).height() * 1.1 )
|
iiurlheight: Math.floor( density * this.$imageWrapper.height() )
|
||||||
} ).done( function ( data ) {
|
} ).done( function ( data ) {
|
||||||
var imageInfo, innerInfo,
|
var imageInfo, innerInfo,
|
||||||
image = new Image();
|
image = new Image();
|
||||||
|
|
@ -163,6 +169,7 @@
|
||||||
|
|
||||||
image.onload = function () {
|
image.onload = function () {
|
||||||
ui.replaceImageWith( image );
|
ui.replaceImageWith( image );
|
||||||
|
viewer.updateControls();
|
||||||
};
|
};
|
||||||
|
|
||||||
image.src = innerInfo.thumburl || innerInfo.url;
|
image.src = innerInfo.thumburl || innerInfo.url;
|
||||||
|
|
@ -222,7 +229,10 @@
|
||||||
MMVP.initializeInterface = function ( ui ) {
|
MMVP.initializeInterface = function ( ui ) {
|
||||||
this.ui = ui;
|
this.ui = ui;
|
||||||
|
|
||||||
|
this.ui.$postDiv.css( 'top', ( $( window ).height() - 64 ) + 'px' );
|
||||||
|
|
||||||
this.initializeHeader();
|
this.initializeHeader();
|
||||||
|
this.initializeButtons();
|
||||||
this.initializeImage();
|
this.initializeImage();
|
||||||
this.initializeImageMetadata();
|
this.initializeImageMetadata();
|
||||||
this.initializeAboutLinks();
|
this.initializeAboutLinks();
|
||||||
|
|
@ -461,9 +471,13 @@
|
||||||
};
|
};
|
||||||
|
|
||||||
MMVP.initializeHeader = function () {
|
MMVP.initializeHeader = function () {
|
||||||
|
this.ui.$closeButton.detach();
|
||||||
|
this.ui.$fullscreenButton.detach();
|
||||||
|
|
||||||
this.ui.$titleDiv = $( '<div>' )
|
this.ui.$titleDiv = $( '<div>' )
|
||||||
.addClass( 'mw-mlb-title-contain' );
|
.addClass( 'mw-mlb-title-contain' );
|
||||||
|
|
||||||
|
this.ui.$postDiv.append( this.ui.$controlBar.detach() );
|
||||||
this.ui.$controlBar.append( this.ui.$titleDiv );
|
this.ui.$controlBar.append( this.ui.$titleDiv );
|
||||||
|
|
||||||
this.initializeTitleAndCredit();
|
this.initializeTitleAndCredit();
|
||||||
|
|
@ -481,10 +495,14 @@
|
||||||
};
|
};
|
||||||
|
|
||||||
MMVP.initializeTitle = function () {
|
MMVP.initializeTitle = function () {
|
||||||
this.ui.$title = $( '<p>' )
|
this.ui.$title = $( '<span>' )
|
||||||
.addClass( 'mw-mlb-title' );
|
.addClass( 'mw-mlb-title' );
|
||||||
|
|
||||||
this.ui.$titleAndCredit.append( this.ui.$title );
|
this.ui.$titlePara = $( '<p>' )
|
||||||
|
.addClass( 'mw-mlb-title-para' )
|
||||||
|
.append( this.ui.$title );
|
||||||
|
|
||||||
|
this.ui.$titleAndCredit.append( this.ui.$titlePara );
|
||||||
};
|
};
|
||||||
|
|
||||||
MMVP.initializeCredit = function () {
|
MMVP.initializeCredit = function () {
|
||||||
|
|
@ -514,13 +532,90 @@
|
||||||
.addClass( 'empty' )
|
.addClass( 'empty' )
|
||||||
.prop( 'href', '#' );
|
.prop( 'href', '#' );
|
||||||
|
|
||||||
this.ui.$licensePara = $( '<p>' )
|
this.ui.$titlePara.append( this.ui.$license );
|
||||||
.addClass( 'mw-mlb-license-contain' )
|
|
||||||
.append( this.ui.$license );
|
|
||||||
|
|
||||||
this.ui.$titleDiv.append( this.ui.$licensePara );
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
MMVP.initializeButtons = function () {
|
||||||
|
this.ui.$mwControls = $( '<div>' )
|
||||||
|
.addClass( 'mw-mlb-controls' )
|
||||||
|
// Note we aren't adding the fullscreen button here.
|
||||||
|
// Fullscreen causes some funky issues with UI redraws,
|
||||||
|
// and we aren't sure why, but it's not really necessary
|
||||||
|
// with the new interface anyway - it's basically fullscreen
|
||||||
|
// already!
|
||||||
|
.append(
|
||||||
|
this.ui.$closeButton
|
||||||
|
)
|
||||||
|
.appendTo( this.ui.$main );
|
||||||
|
};
|
||||||
|
|
||||||
|
MMVP.updateControls = function () {
|
||||||
|
var isOnButton = false,
|
||||||
|
isOnImage = false,
|
||||||
|
ui = this.ui,
|
||||||
|
pos = ui.$image.offset();
|
||||||
|
|
||||||
|
function fadeIn() {
|
||||||
|
isOnImage = true;
|
||||||
|
ui.$mwControls.fadeIn( 100 );
|
||||||
|
ui.$image.one( 'click', fadeOut );
|
||||||
|
}
|
||||||
|
|
||||||
|
function fadeOut() {
|
||||||
|
ui.$mwControls.fadeOut( 100 );
|
||||||
|
ui.$image.one( 'click', fadeIn );
|
||||||
|
}
|
||||||
|
|
||||||
|
function fadeOutDelayed() {
|
||||||
|
isOnImage = false;
|
||||||
|
setTimeout( function () {
|
||||||
|
if ( !isOnImage && !isOnButton ) {
|
||||||
|
fadeOut();
|
||||||
|
}
|
||||||
|
}, 500 );
|
||||||
|
}
|
||||||
|
|
||||||
|
function detectButton() {
|
||||||
|
isOnButton = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
function detectLeaveButton() {
|
||||||
|
isOnButton = false;
|
||||||
|
setTimeout( function () {
|
||||||
|
if ( !isOnImage && !isOnButton ) {
|
||||||
|
fadeOut();
|
||||||
|
}
|
||||||
|
}, 500 );
|
||||||
|
}
|
||||||
|
|
||||||
|
pos.top = ( ui.$imageWrapper.height() - ui.$image.height() ) / 2;
|
||||||
|
pos.left += ui.$image.width() - ui.$closeButton.width();
|
||||||
|
|
||||||
|
pos.top += 'px';
|
||||||
|
pos.left += 'px';
|
||||||
|
|
||||||
|
ui.$mwControls
|
||||||
|
.css( pos )
|
||||||
|
.appendTo( ui.$main )
|
||||||
|
.fadeIn( 100 )
|
||||||
|
.delay( 500 )
|
||||||
|
.fadeOut( 100 );
|
||||||
|
|
||||||
|
ui.$postDiv.css( 'top', ui.$imageWrapper.height() );
|
||||||
|
|
||||||
|
ui.$image
|
||||||
|
.off( 'mouseenter', fadeIn )
|
||||||
|
.off( 'mouseleave', fadeOutDelayed )
|
||||||
|
.one( 'click', fadeIn )
|
||||||
|
.on( 'mouseenter', fadeIn )
|
||||||
|
.on( 'mouseleave', fadeOutDelayed );
|
||||||
|
|
||||||
|
ui.$closeButton.add( ui.$fullscreenButton )
|
||||||
|
.off( 'mouseenter', detectButton )
|
||||||
|
.off( 'mouseleave', detectLeaveButton )
|
||||||
|
.on( 'mouseenter', detectButton )
|
||||||
|
.on( 'mouseleave', detectLeaveButton );
|
||||||
|
};
|
||||||
|
|
||||||
MMVP.registerLogging = function () {
|
MMVP.registerLogging = function () {
|
||||||
var viewer = this;
|
var viewer = this;
|
||||||
|
|
@ -845,7 +940,6 @@
|
||||||
|
|
||||||
var imageInfo,
|
var imageInfo,
|
||||||
filename = fileTitle.getPrefixedText(),
|
filename = fileTitle.getPrefixedText(),
|
||||||
ratio = this.lightbox.iface.isFullScreen ? 0.9 : 0.5,
|
|
||||||
density = $.devicePixelRatio(),
|
density = $.devicePixelRatio(),
|
||||||
apiArgs = {
|
apiArgs = {
|
||||||
action: 'query',
|
action: 'query',
|
||||||
|
|
@ -853,8 +947,8 @@
|
||||||
titles: filename,
|
titles: filename,
|
||||||
prop: 'imageinfo',
|
prop: 'imageinfo',
|
||||||
iiprop: iiprops.join( '|' ),
|
iiprop: iiprops.join( '|' ),
|
||||||
iiurlwidth: Math.floor( density * ratio * $( window ).width() * 1.1 ),
|
iiurlwidth: Math.floor( density * this.lightbox.iface.$imageWrapper.width() ),
|
||||||
iiurlheight: Math.floor( density * ratio * $( window ).height() * 1.1 ),
|
iiurlheight: Math.floor( density * this.lightbox.iface.$imageWrapper.height() ),
|
||||||
// Short-circuit, don't fallback, to save some tiny amount of time
|
// Short-circuit, don't fallback, to save some tiny amount of time
|
||||||
iiextmetadatalanguage: mw.config.get( 'wgUserLanguage', false ) || mw.config.get( 'wgContentLanguage', 'en' )
|
iiextmetadatalanguage: mw.config.get( 'wgUserLanguage', false ) || mw.config.get( 'wgContentLanguage', 'en' )
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -1,3 +1,3 @@
|
||||||
<?xml version="1.0" encoding="utf-8"?>
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
|
||||||
<svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="64px" height="64px" viewBox="5.5 -3.5 64 64"><circle fill="#FFFFFF" stroke="#939598" cx="37.785" cy="28.501" r="28.836"/><path d="M37.441-3.5c8.951,0,16.572,3.125,22.857,9.372c3.008,3.009,5.295,6.448,6.857,10.314c1.561,3.867,2.344,7.971,2.344,12.314c0,4.381-0.773,8.486-2.314,12.313c-1.543,3.828-3.82,7.21-6.828,10.143c-3.123,3.085-6.666,5.448-10.629,7.086c-3.961,1.638-8.057,2.457-12.285,2.457s-8.276-0.808-12.143-2.429c-3.866-1.618-7.333-3.961-10.4-7.027c-3.067-3.066-5.4-6.524-7-10.372S5.5,32.767,5.5,28.5c0-4.229,0.809-8.295,2.428-12.2c1.619-3.905,3.972-7.4,7.057-10.486C21.08-0.394,28.565-3.5,37.441-3.5z M37.557,2.272c-7.314,0-13.467,2.553-18.458,7.657c-2.515,2.553-4.448,5.419-5.8,8.6c-1.354,3.181-2.029,6.505-2.029,9.972c0,3.429,0.675,6.734,2.029,9.913c1.353,3.183,3.285,6.021,5.8,8.516c2.514,2.496,5.351,4.399,8.515,5.715c3.161,1.314,6.476,1.971,9.943,1.971c3.428,0,6.75-0.665,9.973-1.999c3.219-1.335,6.121-3.257,8.713-5.771c4.99-4.876,7.484-10.99,7.484-18.344c0-3.543-0.648-6.895-1.943-10.057c-1.293-3.162-3.18-5.98-5.654-8.458C50.984,4.844,44.795,2.272,37.557,2.272z M37.156,23.187l-4.287,2.229c-0.458-0.951-1.019-1.619-1.685-2c-0.667-0.38-1.286-0.571-1.858-0.571c-2.856,0-4.286,1.885-4.286,5.657c0,1.714,0.362,3.084,1.085,4.113c0.724,1.029,1.791,1.544,3.201,1.544c1.867,0,3.181-0.915,3.944-2.743l3.942,2c-0.838,1.563-2,2.791-3.486,3.686c-1.484,0.896-3.123,1.343-4.914,1.343c-2.857,0-5.163-0.875-6.915-2.629c-1.752-1.752-2.628-4.19-2.628-7.313c0-3.048,0.886-5.466,2.657-7.257c1.771-1.79,4.009-2.686,6.715-2.686C32.604,18.558,35.441,20.101,37.156,23.187z M55.613,23.187l-4.229,2.229c-0.457-0.951-1.02-1.619-1.686-2c-0.668-0.38-1.307-0.571-1.914-0.571c-2.857,0-4.287,1.885-4.287,5.657c0,1.714,0.363,3.084,1.086,4.113c0.723,1.029,1.789,1.544,3.201,1.544c1.865,0,3.18-0.915,3.941-2.743l4,2c-0.875,1.563-2.057,2.791-3.541,3.686c-1.486,0.896-3.105,1.343-4.857,1.343c-2.896,0-5.209-0.875-6.941-2.629c-1.736-1.752-2.602-4.19-2.602-7.313c0-3.048,0.885-5.466,2.658-7.257c1.77-1.79,4.008-2.686,6.713-2.686C51.117,18.558,53.938,20.101,55.613,23.187z" fill="#939598"/></svg>
|
<svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="64px" height="64px" viewBox="5.5 -3.5 64 64"><circle fill="none" stroke="#939598" cx="37.785" cy="28.501" r="28.836"/><path d="M37.441-3.5c8.951,0,16.572,3.125,22.857,9.372c3.008,3.009,5.295,6.448,6.857,10.314c1.561,3.867,2.344,7.971,2.344,12.314c0,4.381-0.773,8.486-2.314,12.313c-1.543,3.828-3.82,7.21-6.828,10.143c-3.123,3.085-6.666,5.448-10.629,7.086c-3.961,1.638-8.057,2.457-12.285,2.457s-8.276-0.808-12.143-2.429c-3.866-1.618-7.333-3.961-10.4-7.027c-3.067-3.066-5.4-6.524-7-10.372S5.5,32.767,5.5,28.5c0-4.229,0.809-8.295,2.428-12.2c1.619-3.905,3.972-7.4,7.057-10.486C21.08-0.394,28.565-3.5,37.441-3.5z M37.557,2.272c-7.314,0-13.467,2.553-18.458,7.657c-2.515,2.553-4.448,5.419-5.8,8.6c-1.354,3.181-2.029,6.505-2.029,9.972c0,3.429,0.675,6.734,2.029,9.913c1.353,3.183,3.285,6.021,5.8,8.516c2.514,2.496,5.351,4.399,8.515,5.715c3.161,1.314,6.476,1.971,9.943,1.971c3.428,0,6.75-0.665,9.973-1.999c3.219-1.335,6.121-3.257,8.713-5.771c4.99-4.876,7.484-10.99,7.484-18.344c0-3.543-0.648-6.895-1.943-10.057c-1.293-3.162-3.18-5.98-5.654-8.458C50.984,4.844,44.795,2.272,37.557,2.272z M37.156,23.187l-4.287,2.229c-0.458-0.951-1.019-1.619-1.685-2c-0.667-0.38-1.286-0.571-1.858-0.571c-2.856,0-4.286,1.885-4.286,5.657c0,1.714,0.362,3.084,1.085,4.113c0.724,1.029,1.791,1.544,3.201,1.544c1.867,0,3.181-0.915,3.944-2.743l3.942,2c-0.838,1.563-2,2.791-3.486,3.686c-1.484,0.896-3.123,1.343-4.914,1.343c-2.857,0-5.163-0.875-6.915-2.629c-1.752-1.752-2.628-4.19-2.628-7.313c0-3.048,0.886-5.466,2.657-7.257c1.771-1.79,4.009-2.686,6.715-2.686C32.604,18.558,35.441,20.101,37.156,23.187z M55.613,23.187l-4.229,2.229c-0.457-0.951-1.02-1.619-1.686-2c-0.668-0.38-1.307-0.571-1.914-0.571c-2.857,0-4.287,1.885-4.287,5.657c0,1.714,0.363,3.084,1.086,4.113c0.723,1.029,1.789,1.544,3.201,1.544c1.865,0,3.18-0.915,3.941-2.743l4,2c-0.875,1.563-2.057,2.791-3.541,3.686c-1.486,0.896-3.105,1.343-4.857,1.343c-2.896,0-5.209-0.875-6.941-2.629c-1.736-1.752-2.602-4.19-2.602-7.313c0-3.048,0.885-5.466,2.658-7.257c1.77-1.79,4.008-2.686,6.713-2.686C51.117,18.558,53.938,20.101,55.613,23.187z" fill="#939598"/></svg>
|
||||||
|
|
|
||||||
|
Before Width: | Height: | Size: 2.3 KiB After Width: | Height: | Size: 2.3 KiB |
|
|
@ -1 +1,195 @@
|
||||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" width="32px" height="32px"><path style="fill:none;stroke:#000000;stroke-width:4px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" d="M 8,24 24,8" /><path style="fill:none;stroke:#000000;stroke-width:4px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" d="M 8,8 24,24" /></svg>
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 15.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
|
||||||
|
<svg
|
||||||
|
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||||
|
xmlns:cc="http://creativecommons.org/ns#"
|
||||||
|
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||||
|
xmlns:svg="http://www.w3.org/2000/svg"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||||
|
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||||
|
version="1.1"
|
||||||
|
id="Layer_1"
|
||||||
|
x="0px"
|
||||||
|
y="0px"
|
||||||
|
width="34.265625"
|
||||||
|
height="34.21875"
|
||||||
|
viewBox="0 0 34.265625 34.21875"
|
||||||
|
enable-background="new 0 0 1024 768"
|
||||||
|
xml:space="preserve"
|
||||||
|
inkscape:version="0.48.2 r9819"
|
||||||
|
sodipodi:docname="close.svg"><metadata
|
||||||
|
id="metadata15"><rdf:RDF><cc:Work
|
||||||
|
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
|
||||||
|
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
|
||||||
|
id="defs13"><filter
|
||||||
|
id="filter3827"
|
||||||
|
inkscape:label="Glow"
|
||||||
|
inkscape:menu="Shadows and Glows"
|
||||||
|
inkscape:menu-tooltip="Glow of object's own color at the edges"
|
||||||
|
color-interpolation-filters="sRGB"><feGaussianBlur
|
||||||
|
id="feGaussianBlur3829"
|
||||||
|
stdDeviation="5"
|
||||||
|
result="result91" /><feComposite
|
||||||
|
id="feComposite3831"
|
||||||
|
in2="result91"
|
||||||
|
in="SourceGraphic"
|
||||||
|
operator="over" /></filter><filter
|
||||||
|
id="filter4246"
|
||||||
|
inkscape:label="Drop shadow"
|
||||||
|
width="1.5"
|
||||||
|
height="1.5"
|
||||||
|
x="-0.25"
|
||||||
|
y="-0.25"
|
||||||
|
color-interpolation-filters="sRGB"><feGaussianBlur
|
||||||
|
id="feGaussianBlur4248"
|
||||||
|
in="SourceAlpha"
|
||||||
|
stdDeviation="1"
|
||||||
|
result="blur" /><feColorMatrix
|
||||||
|
id="feColorMatrix4250"
|
||||||
|
result="bluralpha"
|
||||||
|
type="matrix"
|
||||||
|
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0.5 0 " /><feOffset
|
||||||
|
id="feOffset4252"
|
||||||
|
in="bluralpha"
|
||||||
|
dx="-2.41474e-15"
|
||||||
|
dy="-2.41474e-15"
|
||||||
|
result="offsetBlur" /><feMerge
|
||||||
|
id="feMerge4254"><feMergeNode
|
||||||
|
id="feMergeNode4256"
|
||||||
|
in="offsetBlur" /><feMergeNode
|
||||||
|
id="feMergeNode4258"
|
||||||
|
in="SourceGraphic" /></feMerge></filter><filter
|
||||||
|
id="filter4260"
|
||||||
|
inkscape:label="Drop shadow"
|
||||||
|
width="1.5"
|
||||||
|
height="1.5"
|
||||||
|
x="-0.25"
|
||||||
|
y="-0.25"
|
||||||
|
color-interpolation-filters="sRGB"><feGaussianBlur
|
||||||
|
id="feGaussianBlur4262"
|
||||||
|
in="SourceAlpha"
|
||||||
|
stdDeviation="1"
|
||||||
|
result="blur" /><feColorMatrix
|
||||||
|
id="feColorMatrix4264"
|
||||||
|
result="bluralpha"
|
||||||
|
type="matrix"
|
||||||
|
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0.5 0 " /><feOffset
|
||||||
|
id="feOffset4266"
|
||||||
|
in="bluralpha"
|
||||||
|
dx="-2.41474e-15"
|
||||||
|
dy="-2.41474e-15"
|
||||||
|
result="offsetBlur" /><feMerge
|
||||||
|
id="feMerge4268"><feMergeNode
|
||||||
|
id="feMergeNode4270"
|
||||||
|
in="offsetBlur" /><feMergeNode
|
||||||
|
id="feMergeNode4272"
|
||||||
|
in="SourceGraphic" /></feMerge></filter><filter
|
||||||
|
id="filter4285"
|
||||||
|
inkscape:label="Drop shadow"
|
||||||
|
width="1.5"
|
||||||
|
height="1.5"
|
||||||
|
x="-0.25"
|
||||||
|
y="-0.25"
|
||||||
|
color-interpolation-filters="sRGB"><feGaussianBlur
|
||||||
|
id="feGaussianBlur4287"
|
||||||
|
in="SourceAlpha"
|
||||||
|
stdDeviation="1"
|
||||||
|
result="blur" /><feColorMatrix
|
||||||
|
id="feColorMatrix4289"
|
||||||
|
result="bluralpha"
|
||||||
|
type="matrix"
|
||||||
|
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0.5 0 " /><feOffset
|
||||||
|
id="feOffset4291"
|
||||||
|
in="bluralpha"
|
||||||
|
dx="-2.41474e-15"
|
||||||
|
dy="-2.41474e-15"
|
||||||
|
result="offsetBlur" /><feMerge
|
||||||
|
id="feMerge4293"><feMergeNode
|
||||||
|
id="feMergeNode4295"
|
||||||
|
in="offsetBlur" /><feMergeNode
|
||||||
|
id="feMergeNode4297"
|
||||||
|
in="SourceGraphic" /></feMerge></filter><filter
|
||||||
|
id="filter4299"
|
||||||
|
inkscape:label="Drop shadow"
|
||||||
|
width="1.5"
|
||||||
|
height="1.5"
|
||||||
|
x="-0.25"
|
||||||
|
y="-0.25"
|
||||||
|
color-interpolation-filters="sRGB"><feGaussianBlur
|
||||||
|
id="feGaussianBlur4301"
|
||||||
|
in="SourceAlpha"
|
||||||
|
stdDeviation="1"
|
||||||
|
result="blur" /><feColorMatrix
|
||||||
|
id="feColorMatrix4303"
|
||||||
|
result="bluralpha"
|
||||||
|
type="matrix"
|
||||||
|
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0.5 0 " /><feOffset
|
||||||
|
id="feOffset4305"
|
||||||
|
in="bluralpha"
|
||||||
|
dx="-2.41474e-15"
|
||||||
|
dy="-2.41474e-15"
|
||||||
|
result="offsetBlur" /><feMerge
|
||||||
|
id="feMerge4307"><feMergeNode
|
||||||
|
id="feMergeNode4309"
|
||||||
|
in="offsetBlur" /><feMergeNode
|
||||||
|
id="feMergeNode4311"
|
||||||
|
in="SourceGraphic" /></feMerge></filter><filter
|
||||||
|
id="filter4313"
|
||||||
|
inkscape:label="Drop shadow"
|
||||||
|
width="1.5"
|
||||||
|
height="1.5"
|
||||||
|
x="-0.25"
|
||||||
|
y="-0.25"
|
||||||
|
color-interpolation-filters="sRGB"><feGaussianBlur
|
||||||
|
id="feGaussianBlur4315"
|
||||||
|
in="SourceAlpha"
|
||||||
|
stdDeviation="1"
|
||||||
|
result="blur" /><feColorMatrix
|
||||||
|
id="feColorMatrix4317"
|
||||||
|
result="bluralpha"
|
||||||
|
type="matrix"
|
||||||
|
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0.5 0 " /><feOffset
|
||||||
|
id="feOffset4319"
|
||||||
|
in="bluralpha"
|
||||||
|
dx="-2.41474e-15"
|
||||||
|
dy="-2.41474e-15"
|
||||||
|
result="offsetBlur" /><feMerge
|
||||||
|
id="feMerge4321"><feMergeNode
|
||||||
|
id="feMergeNode4323"
|
||||||
|
in="offsetBlur" /><feMergeNode
|
||||||
|
id="feMergeNode4325"
|
||||||
|
in="SourceGraphic" /></feMerge></filter></defs><sodipodi:namedview
|
||||||
|
pagecolor="#ffffff"
|
||||||
|
bordercolor="#666666"
|
||||||
|
borderopacity="1"
|
||||||
|
objecttolerance="10"
|
||||||
|
gridtolerance="10"
|
||||||
|
guidetolerance="10"
|
||||||
|
inkscape:pageopacity="0"
|
||||||
|
inkscape:pageshadow="2"
|
||||||
|
inkscape:window-width="1241"
|
||||||
|
inkscape:window-height="702"
|
||||||
|
id="namedview11"
|
||||||
|
showgrid="false"
|
||||||
|
inkscape:zoom="1.2698217"
|
||||||
|
inkscape:cx="215.48194"
|
||||||
|
inkscape:cy="-37.36922"
|
||||||
|
inkscape:window-x="15"
|
||||||
|
inkscape:window-y="0"
|
||||||
|
inkscape:window-maximized="0"
|
||||||
|
inkscape:current-layer="Layer_1"
|
||||||
|
fit-margin-top="0"
|
||||||
|
fit-margin-left="0"
|
||||||
|
fit-margin-right="0"
|
||||||
|
fit-margin-bottom="0" />
|
||||||
|
<path
|
||||||
|
style="font-size:medium;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-indent:0;text-align:start;text-decoration:none;line-height:normal;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;text-anchor:start;baseline-shift:baseline;color:#000000;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#999999;stroke-width:0.25;stroke-miterlimit:10;stroke-opacity:1;stroke-dasharray:none;marker:none;visibility:visible;display:inline;overflow:visible;filter:url(#filter4313);enable-background:accumulate;font-family:Sans;-inkscape-font-specification:Sans"
|
||||||
|
d="m 9.1796875,5.890625 -3.28125,3.28125 7.9375005,7.9375 -7.9375005,7.9375 3.28125,3.28125 7.9687495,-7.9375 7.9375,7.9375 3.28125,-3.28125 -7.9375,-7.9375 7.9375,-7.9375 -3.28125,-3.28125 -7.9375,7.9375 -7.9687495,-7.9375 z"
|
||||||
|
id="line3"
|
||||||
|
inkscape:connector-curvature="0" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</svg>
|
||||||
|
Before Width: | Height: | Size: 519 B After Width: | Height: | Size: 6.7 KiB |
|
|
@ -1 +1,199 @@
|
||||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" width="32px" height="32px"><path style="fill:none;stroke:#000000;stroke-width:3px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" d="M 14,18 8,24" /><path style="fill:none;stroke:#000000;stroke-width:3px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" d="M 18,14 24,8" /><path style="fill:none;stroke:#000000;stroke-width:3px;stroke-linecap:square;stroke-linejoin:miter;stroke-opacity:1" d="M 10,18 14,18" /><path style="fill:none;stroke:#000000;stroke-width:3px;stroke-linecap:square;stroke-linejoin:miter;stroke-opacity:1" d="M 14,22 14,18" /><path style="fill:none;stroke:#000000;stroke-width:3px;stroke-linecap:square;stroke-linejoin:miter;stroke-opacity:1" d="M 18,10 18,14" /><path style="fill:none;stroke:#000000;stroke-width:3px;stroke-linecap:square;stroke-linejoin:miter;stroke-opacity:1" d="M 22,14 18,14" /></svg>
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 15.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
|
||||||
|
<svg
|
||||||
|
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||||
|
xmlns:cc="http://creativecommons.org/ns#"
|
||||||
|
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||||
|
xmlns:svg="http://www.w3.org/2000/svg"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||||
|
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||||
|
version="1.1"
|
||||||
|
id="Layer_1"
|
||||||
|
x="0px"
|
||||||
|
y="0px"
|
||||||
|
width="29.015625"
|
||||||
|
height="29.015625"
|
||||||
|
viewBox="0 0 29.015625 29.015625"
|
||||||
|
enable-background="new 0 0 1024 768"
|
||||||
|
xml:space="preserve"
|
||||||
|
inkscape:version="0.48.2 r9819"
|
||||||
|
sodipodi:docname="expand.svg"><metadata
|
||||||
|
id="metadata15"><rdf:RDF><cc:Work
|
||||||
|
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
|
||||||
|
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
|
||||||
|
id="defs13"><filter
|
||||||
|
id="filter3827"
|
||||||
|
inkscape:label="Glow"
|
||||||
|
inkscape:menu="Shadows and Glows"
|
||||||
|
inkscape:menu-tooltip="Glow of object's own color at the edges"
|
||||||
|
color-interpolation-filters="sRGB"><feGaussianBlur
|
||||||
|
id="feGaussianBlur3829"
|
||||||
|
stdDeviation="5"
|
||||||
|
result="result91" /><feComposite
|
||||||
|
id="feComposite3831"
|
||||||
|
in2="result91"
|
||||||
|
in="SourceGraphic"
|
||||||
|
operator="over" /></filter><filter
|
||||||
|
id="filter4246"
|
||||||
|
inkscape:label="Drop shadow"
|
||||||
|
width="1.5"
|
||||||
|
height="1.5"
|
||||||
|
x="-0.25"
|
||||||
|
y="-0.25"
|
||||||
|
color-interpolation-filters="sRGB"><feGaussianBlur
|
||||||
|
id="feGaussianBlur4248"
|
||||||
|
in="SourceAlpha"
|
||||||
|
stdDeviation="1"
|
||||||
|
result="blur" /><feColorMatrix
|
||||||
|
id="feColorMatrix4250"
|
||||||
|
result="bluralpha"
|
||||||
|
type="matrix"
|
||||||
|
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0.5 0 " /><feOffset
|
||||||
|
id="feOffset4252"
|
||||||
|
in="bluralpha"
|
||||||
|
dx="-2.41474e-15"
|
||||||
|
dy="-2.41474e-15"
|
||||||
|
result="offsetBlur" /><feMerge
|
||||||
|
id="feMerge4254"><feMergeNode
|
||||||
|
id="feMergeNode4256"
|
||||||
|
in="offsetBlur" /><feMergeNode
|
||||||
|
id="feMergeNode4258"
|
||||||
|
in="SourceGraphic" /></feMerge></filter><filter
|
||||||
|
id="filter4260"
|
||||||
|
inkscape:label="Drop shadow"
|
||||||
|
width="1.5"
|
||||||
|
height="1.5"
|
||||||
|
x="-0.25"
|
||||||
|
y="-0.25"
|
||||||
|
color-interpolation-filters="sRGB"><feGaussianBlur
|
||||||
|
id="feGaussianBlur4262"
|
||||||
|
in="SourceAlpha"
|
||||||
|
stdDeviation="1"
|
||||||
|
result="blur" /><feColorMatrix
|
||||||
|
id="feColorMatrix4264"
|
||||||
|
result="bluralpha"
|
||||||
|
type="matrix"
|
||||||
|
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0.5 0 " /><feOffset
|
||||||
|
id="feOffset4266"
|
||||||
|
in="bluralpha"
|
||||||
|
dx="-2.41474e-15"
|
||||||
|
dy="-2.41474e-15"
|
||||||
|
result="offsetBlur" /><feMerge
|
||||||
|
id="feMerge4268"><feMergeNode
|
||||||
|
id="feMergeNode4270"
|
||||||
|
in="offsetBlur" /><feMergeNode
|
||||||
|
id="feMergeNode4272"
|
||||||
|
in="SourceGraphic" /></feMerge></filter><filter
|
||||||
|
id="filter4285"
|
||||||
|
inkscape:label="Drop shadow"
|
||||||
|
width="1.5"
|
||||||
|
height="1.5"
|
||||||
|
x="-0.25"
|
||||||
|
y="-0.25"
|
||||||
|
color-interpolation-filters="sRGB"><feGaussianBlur
|
||||||
|
id="feGaussianBlur4287"
|
||||||
|
in="SourceAlpha"
|
||||||
|
stdDeviation="1"
|
||||||
|
result="blur" /><feColorMatrix
|
||||||
|
id="feColorMatrix4289"
|
||||||
|
result="bluralpha"
|
||||||
|
type="matrix"
|
||||||
|
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0.5 0 " /><feOffset
|
||||||
|
id="feOffset4291"
|
||||||
|
in="bluralpha"
|
||||||
|
dx="-2.41474e-15"
|
||||||
|
dy="-2.41474e-15"
|
||||||
|
result="offsetBlur" /><feMerge
|
||||||
|
id="feMerge4293"><feMergeNode
|
||||||
|
id="feMergeNode4295"
|
||||||
|
in="offsetBlur" /><feMergeNode
|
||||||
|
id="feMergeNode4297"
|
||||||
|
in="SourceGraphic" /></feMerge></filter><filter
|
||||||
|
id="filter4299"
|
||||||
|
inkscape:label="Drop shadow"
|
||||||
|
width="1.5"
|
||||||
|
height="1.5"
|
||||||
|
x="-0.25"
|
||||||
|
y="-0.25"
|
||||||
|
color-interpolation-filters="sRGB"><feGaussianBlur
|
||||||
|
id="feGaussianBlur4301"
|
||||||
|
in="SourceAlpha"
|
||||||
|
stdDeviation="1"
|
||||||
|
result="blur" /><feColorMatrix
|
||||||
|
id="feColorMatrix4303"
|
||||||
|
result="bluralpha"
|
||||||
|
type="matrix"
|
||||||
|
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0.5 0 " /><feOffset
|
||||||
|
id="feOffset4305"
|
||||||
|
in="bluralpha"
|
||||||
|
dx="-2.41474e-15"
|
||||||
|
dy="-2.41474e-15"
|
||||||
|
result="offsetBlur" /><feMerge
|
||||||
|
id="feMerge4307"><feMergeNode
|
||||||
|
id="feMergeNode4309"
|
||||||
|
in="offsetBlur" /><feMergeNode
|
||||||
|
id="feMergeNode4311"
|
||||||
|
in="SourceGraphic" /></feMerge></filter><filter
|
||||||
|
id="filter4313"
|
||||||
|
inkscape:label="Drop shadow"
|
||||||
|
width="1.5"
|
||||||
|
height="1.5"
|
||||||
|
x="-0.25"
|
||||||
|
y="-0.25"
|
||||||
|
color-interpolation-filters="sRGB"><feGaussianBlur
|
||||||
|
id="feGaussianBlur4315"
|
||||||
|
in="SourceAlpha"
|
||||||
|
stdDeviation="1"
|
||||||
|
result="blur" /><feColorMatrix
|
||||||
|
id="feColorMatrix4317"
|
||||||
|
result="bluralpha"
|
||||||
|
type="matrix"
|
||||||
|
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0.5 0 " /><feOffset
|
||||||
|
id="feOffset4319"
|
||||||
|
in="bluralpha"
|
||||||
|
dx="-2.41474e-15"
|
||||||
|
dy="-2.41474e-15"
|
||||||
|
result="offsetBlur" /><feMerge
|
||||||
|
id="feMerge4321"><feMergeNode
|
||||||
|
id="feMergeNode4323"
|
||||||
|
in="offsetBlur" /><feMergeNode
|
||||||
|
id="feMergeNode4325"
|
||||||
|
in="SourceGraphic" /></feMerge></filter></defs><sodipodi:namedview
|
||||||
|
pagecolor="#ffffff"
|
||||||
|
bordercolor="#666666"
|
||||||
|
borderopacity="1"
|
||||||
|
objecttolerance="10"
|
||||||
|
gridtolerance="10"
|
||||||
|
guidetolerance="10"
|
||||||
|
inkscape:pageopacity="0"
|
||||||
|
inkscape:pageshadow="2"
|
||||||
|
inkscape:window-width="1241"
|
||||||
|
inkscape:window-height="702"
|
||||||
|
id="namedview11"
|
||||||
|
showgrid="false"
|
||||||
|
inkscape:zoom="1.2698217"
|
||||||
|
inkscape:cx="93.700687"
|
||||||
|
inkscape:cy="-40.611408"
|
||||||
|
inkscape:window-x="15"
|
||||||
|
inkscape:window-y="0"
|
||||||
|
inkscape:window-maximized="0"
|
||||||
|
inkscape:current-layer="Layer_1"
|
||||||
|
fit-margin-top="0"
|
||||||
|
fit-margin-left="0"
|
||||||
|
fit-margin-right="0"
|
||||||
|
fit-margin-bottom="0" />
|
||||||
|
|
||||||
|
|
||||||
|
<polygon
|
||||||
|
points="949.396,377.213 954.047,372.563 957.032,375.549 952.383,380.199 956.387,380.199 956.381,383.461 946.135,383.459 946.135,373.279 949.398,373.223 "
|
||||||
|
id="polygon7"
|
||||||
|
style="fill:#ffffff;fill-opacity:1;stroke:#999999;stroke-width:0.25;stroke-opacity:1;filter:url(#filter4299)"
|
||||||
|
transform="translate(-931.00781,-369.57031)" />
|
||||||
|
<polygon
|
||||||
|
points="944.896,384.697 944.898,395.137 941.639,395.143 941.636,390.945 936.986,395.596 934,392.609 938.65,387.959 934.66,387.959 934.716,384.697 "
|
||||||
|
id="polygon9"
|
||||||
|
style="fill:#ffffff;fill-opacity:1;stroke:#999999;stroke-width:0.25;stroke-opacity:1;filter:url(#filter4285)"
|
||||||
|
transform="translate(-931.00781,-369.57031)" />
|
||||||
|
</svg>
|
||||||
|
Before Width: | Height: | Size: 971 B After Width: | Height: | Size: 6.5 KiB |
|
|
@ -1,18 +1,3 @@
|
||||||
<?xml version="1.0" encoding="utf-8"?>
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
<!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
|
||||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="80px" height="80px" viewBox="0 0 80 80" xml:space="preserve"><path fill="#929497" d="M62.621,17.368C56.585,11.326,48.549,8,39.996,8c-8.546,0-16.582,3.326-22.632,9.368C11.322,23.411,8,31.451,8,40s3.322,16.589,9.364,22.621C23.414,68.664,31.45,72,39.996,72c8.553,0,16.589-3.336,22.625-9.379C68.666,56.589,72,48.549,72,40S68.666,23.411,62.621,17.368z M50.477,55.118L36.804,41.467V18.066h5.145v21.243L54.11,51.477L50.477,55.118z"/></svg>
|
||||||
width="80px" height="80px" viewBox="0 0 80 80" enable-background="new 0 0 80 80" xml:space="preserve">
|
|
||||||
<g>
|
|
||||||
|
|
||||||
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="326" y1="-301.0742" x2="326" y2="-329.7763" gradientTransform="matrix(1 0 0 -1 -286 -294)">
|
|
||||||
<stop offset="0" style="stop-color:#FFFFFF;stop-opacity:0.95"/>
|
|
||||||
<stop offset="0.7874" style="stop-color:#FFFFFF"/>
|
|
||||||
</linearGradient>
|
|
||||||
<rect fill="url(#SVGID_1_)" width="80" height="80"/>
|
|
||||||
<path fill="#929497" d="M62.621,17.368C56.585,11.326,48.549,8,39.996,8c-8.546,0-16.582,3.326-22.632,9.368
|
|
||||||
C11.322,23.411,8,31.451,8,40s3.322,16.589,9.364,22.621C23.414,68.664,31.45,72,39.996,72c8.553,0,16.589-3.336,22.625-9.379
|
|
||||||
C68.666,56.589,72,48.549,72,40S68.666,23.411,62.621,17.368z M50.477,55.118L36.804,41.467V18.066h5.145v21.243L54.11,51.477
|
|
||||||
L50.477,55.118z"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
|
|
||||||
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 707 B |
|
|
@ -1,47 +1,3 @@
|
||||||
<?xml version="1.0" encoding="utf-8"?>
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
<!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
|
||||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="80px" height="80px"><path fill="#929497" d="M16.436,8C8.396,8,8.014,15.667,8,16.049V72c28.596,0,50.623,0,55.562,0c8.039,0,8.422-7.667,8.438-8.049V8H16.436z"/><path fill="#FFFFFF" d="M31.202,26.303c2.565,0,4.649,2.086,4.649,4.655c0,2.573-2.084,4.653-4.649,4.653c-2.573,0-4.659-2.08-4.659-4.653C26.542,28.389,28.629,26.303,31.202,26.303z"/><circle fill="#FFFFFF" cx="50.476" cy="30.957" r="4.654"/><path fill="#FFFFFF" d="M40.835,57.729c-7.189,0-13.987-2.433-18.186-6.508c-1.057-1.025-1.082-2.714-0.056-3.771c1.025-1.056,2.714-1.082,3.771-0.056c3.226,3.131,8.636,5,14.471,5c5.749,0,11.117-1.83,14.359-4.896c1.068-1.011,2.756-0.966,3.77,0.105c1.012,1.07,0.965,2.758-0.105,3.77C54.588,55.413,48.019,57.729,40.835,57.729z"/></svg>
|
||||||
width="80px" height="80px" viewBox="0 0 80 80" enable-background="new 0 0 80 80" xml:space="preserve">
|
|
||||||
<g>
|
|
||||||
<g>
|
|
||||||
<g>
|
|
||||||
<defs>
|
|
||||||
<rect id="SVGID_1_" width="80" height="80"/>
|
|
||||||
</defs>
|
|
||||||
<clipPath id="SVGID_2_">
|
|
||||||
<use xlink:href="#SVGID_1_" overflow="visible"/>
|
|
||||||
</clipPath>
|
|
||||||
<rect clip-path="url(#SVGID_2_)" fill="#FFFFFF" width="80" height="7.074"/>
|
|
||||||
<rect y="7.074" clip-path="url(#SVGID_2_)" fill="#FFFFFF" width="80" height="22.602"/>
|
|
||||||
<rect y="29.676" clip-path="url(#SVGID_2_)" fill="#FFFFFF" width="80" height="50.324"/>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
<g>
|
|
||||||
<g>
|
|
||||||
<path fill="#929497" d="M16.436,8C8.396,8,8.014,15.667,8,16.049V72c28.596,0,50.623,0,55.562,0c8.039,0,8.422-7.667,8.438-8.049
|
|
||||||
V8H16.436z"/>
|
|
||||||
</g>
|
|
||||||
<g>
|
|
||||||
<g>
|
|
||||||
<g>
|
|
||||||
<path fill="#FFFFFF" d="M31.202,26.303c2.565,0,4.649,2.086,4.649,4.655c0,2.573-2.084,4.653-4.649,4.653
|
|
||||||
c-2.573,0-4.659-2.08-4.659-4.653C26.542,28.389,28.629,26.303,31.202,26.303z"/>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
<g>
|
|
||||||
<g>
|
|
||||||
<circle fill="#FFFFFF" cx="50.476" cy="30.957" r="4.654"/>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
<g>
|
|
||||||
<g>
|
|
||||||
<path fill="#FFFFFF" d="M40.835,57.729c-7.189,0-13.987-2.433-18.186-6.508c-1.057-1.025-1.082-2.714-0.056-3.771
|
|
||||||
c1.025-1.056,2.714-1.082,3.771-0.056c3.226,3.131,8.636,5,14.471,5c5.749,0,11.117-1.83,14.359-4.896
|
|
||||||
c1.068-1.011,2.756-0.966,3.77,0.105c1.012,1.07,0.965,2.758-0.105,3.77C54.588,55.413,48.019,57.729,40.835,57.729z"/>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
|
|
||||||
|
Before Width: | Height: | Size: 1.8 KiB After Width: | Height: | Size: 971 B |
|
|
@ -82,3 +82,8 @@ imageResize
|
||||||
Arguments: None
|
Arguments: None
|
||||||
ThisArg: LightboxInterface
|
ThisArg: LightboxInterface
|
||||||
Called: From LightboxInterface resize listener. Return false to override default behaviour.
|
Called: From LightboxInterface resize listener. Return false to override default behaviour.
|
||||||
|
|
||||||
|
closeInterface
|
||||||
|
Arguments: None
|
||||||
|
ThisArg: LightboxInterface
|
||||||
|
Called: From LightboxInterface unattach method when the interface is being unattached.
|
||||||
|
|
|
||||||
|
|
@ -26,62 +26,61 @@
|
||||||
return ele;
|
return ele;
|
||||||
};
|
};
|
||||||
|
|
||||||
LIP.autoResize = function ( ele, ratio ) {
|
// Assumes that the parent element's size is the maximum size.
|
||||||
|
LIP.autoResize = function ( ele, $parent ) {
|
||||||
function updateRatios() {
|
function updateRatios() {
|
||||||
if ( imgHeight ) {
|
if ( imgHeight ) {
|
||||||
imgHeightRatio = imgMaxHeight / imgHeight;
|
imgHeightRatio = parentHeight / imgHeight;
|
||||||
}
|
}
|
||||||
|
|
||||||
if ( imgWidth ) {
|
if ( imgWidth ) {
|
||||||
imgWidthRatio = imgMaxWidth / imgWidth;
|
imgWidthRatio = parentWidth / imgWidth;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
var imgWidthRatio, imgHeightRatio,
|
var imgWidthRatio, imgHeightRatio, parentWidth, parentHeight,
|
||||||
multRatio = ratio || 0.5,
|
|
||||||
$window = $( window ),
|
|
||||||
winWidth = $window.width(),
|
|
||||||
winHeight = $window.height(),
|
|
||||||
$img = $( ele ),
|
$img = $( ele ),
|
||||||
imgMaxWidth = winWidth * multRatio,
|
|
||||||
imgMaxHeight = winHeight * multRatio,
|
|
||||||
imgWidth = $img.width(),
|
imgWidth = $img.width(),
|
||||||
imgHeight = $img.height();
|
imgHeight = $img.height();
|
||||||
|
|
||||||
if ( this.globalMaxWidth && imgMaxWidth > this.globalMaxWidth ) {
|
$parent = $parent || $img.parent();
|
||||||
imgMaxWidth = this.globalMaxWidth;
|
parentWidth = $parent.width();
|
||||||
|
parentHeight = $parent.height();
|
||||||
|
|
||||||
|
if ( this.globalMaxWidth && parentWidth > this.globalMaxWidth ) {
|
||||||
|
parentWidth = this.globalMaxWidth;
|
||||||
}
|
}
|
||||||
|
|
||||||
if ( this.globalMaxHeight && imgMaxHeight > this.globalMaxHeight ) {
|
if ( this.globalMaxHeight && parentHeight > this.globalMaxHeight ) {
|
||||||
imgMaxHeight = this.globalMaxHeight;
|
parentHeight = this.globalMaxHeight;
|
||||||
}
|
}
|
||||||
|
|
||||||
updateRatios();
|
updateRatios();
|
||||||
|
|
||||||
if ( imgWidth > imgMaxWidth ) {
|
if ( imgWidth > parentWidth ) {
|
||||||
imgHeight *= imgWidthRatio || 1;
|
imgHeight *= imgWidthRatio || 1;
|
||||||
imgWidth = imgMaxWidth;
|
imgWidth = parentWidth;
|
||||||
updateRatios();
|
updateRatios();
|
||||||
}
|
}
|
||||||
|
|
||||||
if ( imgHeight > imgMaxHeight ) {
|
if ( imgHeight > parentHeight ) {
|
||||||
imgWidth *= imgHeightRatio || 1;
|
imgWidth *= imgHeightRatio || 1;
|
||||||
imgHeight = imgMaxHeight;
|
imgHeight = parentHeight;
|
||||||
updateRatios();
|
updateRatios();
|
||||||
}
|
}
|
||||||
|
|
||||||
if ( imgWidth < imgMaxWidth && imgHeight < imgMaxHeight ) {
|
if ( imgWidth < parentWidth && imgHeight < parentHeight ) {
|
||||||
if ( imgWidth === 0 && imgHeight === 0 ) {
|
if ( imgWidth === 0 && imgHeight === 0 ) {
|
||||||
// Only set one
|
// Only set one
|
||||||
imgWidth = imgMaxWidth;
|
imgWidth = parentWidth;
|
||||||
imgHeight = null;
|
imgHeight = null;
|
||||||
} else {
|
} else {
|
||||||
if ( imgHeightRatio > imgWidthRatio ) {
|
if ( imgHeightRatio > imgWidthRatio ) {
|
||||||
imgWidth *= imgHeightRatio;
|
imgWidth *= imgHeightRatio;
|
||||||
imgHeight = imgMaxHeight;
|
imgHeight = parentHeight;
|
||||||
} else {
|
} else {
|
||||||
imgHeight *= imgWidthRatio;
|
imgHeight *= imgWidthRatio;
|
||||||
imgWidth = imgMaxWidth;
|
imgWidth = parentWidth;
|
||||||
}
|
}
|
||||||
updateRatios();
|
updateRatios();
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -15,7 +15,8 @@
|
||||||
!document.mozFullScreenElement &&
|
!document.mozFullScreenElement &&
|
||||||
!document.webkitFullScreenElement &&
|
!document.webkitFullScreenElement &&
|
||||||
!document.msFullScreenElement) {
|
!document.msFullScreenElement) {
|
||||||
lbinterface.fullscreen();
|
lightboxHooks.callAll( 'defullscreen' );
|
||||||
|
lbinterface.$main.removeClass( 'mlb-fullscreened' );
|
||||||
} else if ( lbinterface.fullscreenButtonJustPressed ) {
|
} else if ( lbinterface.fullscreenButtonJustPressed ) {
|
||||||
lbinterface.fullscreenButtonJustPressed = false;
|
lbinterface.fullscreenButtonJustPressed = false;
|
||||||
}
|
}
|
||||||
|
|
@ -26,6 +27,11 @@
|
||||||
addToPost = [],
|
addToPost = [],
|
||||||
lbinterface = this;
|
lbinterface = this;
|
||||||
|
|
||||||
|
// Staging area for image resizes
|
||||||
|
this.$staging = $( '<div>' )
|
||||||
|
.addClass( 'mlb-staging-area' );
|
||||||
|
$( document.body ).append( this.$staging );
|
||||||
|
|
||||||
this.$overlay = $( '<div>' )
|
this.$overlay = $( '<div>' )
|
||||||
.addClass( 'mlb-overlay' );
|
.addClass( 'mlb-overlay' );
|
||||||
|
|
||||||
|
|
@ -38,6 +44,15 @@
|
||||||
this.$imageDiv = $( '<div>' )
|
this.$imageDiv = $( '<div>' )
|
||||||
.addClass( 'mlb-image' );
|
.addClass( 'mlb-image' );
|
||||||
|
|
||||||
|
// I blame CSS for this
|
||||||
|
this.$innerWrapper = $( '<div>' )
|
||||||
|
.addClass( 'mlb-image-inner-wrapper' )
|
||||||
|
.append( this.$imageDiv );
|
||||||
|
|
||||||
|
this.$imageWrapper = $( '<div>' )
|
||||||
|
.addClass( 'mlb-image-wrapper' )
|
||||||
|
.append( this.$innerWrapper );
|
||||||
|
|
||||||
this.$preDiv = $( '<div>' )
|
this.$preDiv = $( '<div>' )
|
||||||
.addClass( 'mlb-pre-image' );
|
.addClass( 'mlb-pre-image' );
|
||||||
result = lightboxHooks.callAll( 'addToPreDiv', this, addToPre );
|
result = lightboxHooks.callAll( 'addToPreDiv', this, addToPre );
|
||||||
|
|
@ -50,7 +65,7 @@
|
||||||
|
|
||||||
this.$main.append(
|
this.$main.append(
|
||||||
this.$preDiv,
|
this.$preDiv,
|
||||||
this.$imageDiv,
|
this.$imageWrapper,
|
||||||
this.$postDiv
|
this.$postDiv
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
@ -64,9 +79,6 @@
|
||||||
if ( e.keyCode === 27 ) {
|
if ( e.keyCode === 27 ) {
|
||||||
// Escape button pressed
|
// Escape button pressed
|
||||||
lbinterface.unattach();
|
lbinterface.unattach();
|
||||||
if ( lbinterface.isFullScreen ) {
|
|
||||||
lbinterface.fullscreen();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
} );
|
} );
|
||||||
|
|
||||||
|
|
@ -93,6 +105,8 @@
|
||||||
};
|
};
|
||||||
|
|
||||||
LIP.unattach = function () {
|
LIP.unattach = function () {
|
||||||
|
lightboxHooks.callAll( 'closeInterface', this );
|
||||||
|
|
||||||
this.$wrapper.detach();
|
this.$wrapper.detach();
|
||||||
this.$overlay.detach();
|
this.$overlay.detach();
|
||||||
};
|
};
|
||||||
|
|
@ -100,35 +114,24 @@
|
||||||
LIP.fullscreen = function () {
|
LIP.fullscreen = function () {
|
||||||
var fullscreen;
|
var fullscreen;
|
||||||
|
|
||||||
if ( this.isFullScreen ) {
|
if ( document.fullscreenElement ||
|
||||||
if ( !document.fullscreenElement &&
|
document.mozFullScreenElement ||
|
||||||
!document.mozFullScreenElement &&
|
document.webkitFullScreenElement ||
|
||||||
!document.webkitFullScreenElement &&
|
document.msFullScreenElement ) {
|
||||||
!document.msFullScreenElement ) {
|
if ( document.cancelFullScreen ) {
|
||||||
if ( document.cancelFullScreen ) {
|
document.cancelFullScreen();
|
||||||
document.cancelFullScreen();
|
} else if ( document.mozCancelFullScreen ) {
|
||||||
} else if ( document.mozCancelFullScreen ) {
|
document.mozCancelFullScreen();
|
||||||
document.mozCancelFullScreen();
|
} else if ( document.webkitCancelFullScreen ) {
|
||||||
} else if ( document.webkitCancelFullScreen ) {
|
document.webkitCancelFullScreen();
|
||||||
document.webkitCancelFullScreen();
|
} else if ( document.msCancelFullScreen ) {
|
||||||
} else if ( document.msCancelFullScreen ) {
|
document.msCancelFullScreen();
|
||||||
document.msCancelFullScreen();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$wrapper.html( this.$main.detach() );
|
this.$main.removeClass( 'mlb-fullscreened' );
|
||||||
this.$fullscreen = this.$fullscreen.detach();
|
|
||||||
|
|
||||||
lightboxHooks.callAll( 'defullscreen', this );
|
lightboxHooks.callAll( 'defullscreen', this );
|
||||||
} else {
|
} else {
|
||||||
this.$fullscreen = this.$fullscreen || $( '<div>' )
|
fullscreen = this.$main.get( 0 );
|
||||||
.addClass( 'mlb-fullscreen-div' );
|
|
||||||
|
|
||||||
this.$fullscreen.html( this.$main.detach() );
|
|
||||||
|
|
||||||
this.$wrapper.append( this.$fullscreen );
|
|
||||||
|
|
||||||
fullscreen = this.$fullscreen[0];
|
|
||||||
if ( fullscreen.requestFullScreen ) {
|
if ( fullscreen.requestFullScreen ) {
|
||||||
fullscreen.requestFullScreen();
|
fullscreen.requestFullScreen();
|
||||||
} else if ( fullscreen.mozRequestFullScreen ) {
|
} else if ( fullscreen.mozRequestFullScreen ) {
|
||||||
|
|
@ -139,25 +142,30 @@
|
||||||
fullscreen.msRequestFullscreen();
|
fullscreen.msRequestFullscreen();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
this.$main.addClass( 'mlb-fullscreened' );
|
||||||
lightboxHooks.callAll( 'fullscreen', this );
|
lightboxHooks.callAll( 'fullscreen', this );
|
||||||
}
|
}
|
||||||
|
|
||||||
this.isFullScreen = !this.isFullScreen;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
LIP.load = function ( image ) {
|
LIP.load = function ( image ) {
|
||||||
var ele = image.getImageElement( function () {
|
var ele = image.getImageElement( function () {
|
||||||
|
image.globalMaxWidth = ele.width;
|
||||||
|
image.globalMaxHeight = ele.height;
|
||||||
iface.$image = $( ele );
|
iface.$image = $( ele );
|
||||||
iface.$imageDiv.append( iface.$image );
|
|
||||||
image.globalMaxWidth = iface.$image.width();
|
iface.autoResizeImage();
|
||||||
image.globalMaxHeight = iface.$image.height();
|
|
||||||
image.autoResize( ele, iface.isFullScreen ? 0.9 : 0.5 );
|
|
||||||
|
|
||||||
window.addEventListener( 'resize', function () {
|
window.addEventListener( 'resize', function () {
|
||||||
var result = lightboxHooks.callAll( 'imageResize', iface );
|
var result = lightboxHooks.callAll( 'imageResize', iface ),
|
||||||
|
isFullScreen = (
|
||||||
|
document.fullscreenElement ||
|
||||||
|
document.mozFullScreenElement ||
|
||||||
|
document.webkitFullScreenElement ||
|
||||||
|
document.msFullScreenElement ),
|
||||||
|
$measurement = isFullScreen ? $( window ) : iface.$image;
|
||||||
|
|
||||||
if ( result !== false ) {
|
if ( result !== false ) {
|
||||||
image.autoResize( iface.$image.get( 0 ), iface.isFullScreen ? 0.9 : 0.5 );
|
iface.autoResizeImage();
|
||||||
}
|
}
|
||||||
} );
|
} );
|
||||||
|
|
||||||
|
|
@ -168,6 +176,12 @@
|
||||||
this.currentImage = image;
|
this.currentImage = image;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
LIP.autoResizeImage = function () {
|
||||||
|
this.$staging.append( this.$image );
|
||||||
|
this.currentImage.autoResize( this.$image.get( 0 ), this.$imageDiv );
|
||||||
|
this.$imageDiv.append( this.$image );
|
||||||
|
};
|
||||||
|
|
||||||
LIP.replaceImageWith = function ( imageEle ) {
|
LIP.replaceImageWith = function ( imageEle ) {
|
||||||
var $image = $( imageEle );
|
var $image = $( imageEle );
|
||||||
|
|
||||||
|
|
@ -178,7 +192,7 @@
|
||||||
|
|
||||||
this.currentImage.globalMaxWidth = this.$image.width();
|
this.currentImage.globalMaxWidth = this.$image.width();
|
||||||
this.currentImage.globalMaxHeight = this.$image.height();
|
this.currentImage.globalMaxHeight = this.$image.height();
|
||||||
this.currentImage.autoResize( imageEle, this.isFullScreen ? 0.9 : 0.5 );
|
this.currentImage.autoResize( imageEle );
|
||||||
};
|
};
|
||||||
|
|
||||||
LIP.setupPreDiv = function ( buildDefaults, toAdd ) {
|
LIP.setupPreDiv = function ( buildDefaults, toAdd ) {
|
||||||
|
|
|
||||||
|
|
@ -1,3 +1,9 @@
|
||||||
|
.mlb-staging-area {
|
||||||
|
position: absolute;
|
||||||
|
top: -999999px;
|
||||||
|
left: -999999px;
|
||||||
|
}
|
||||||
|
|
||||||
.mlb-overlay {
|
.mlb-overlay {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 0px;
|
top: 0px;
|
||||||
|
|
@ -18,15 +24,30 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.mlb-main {
|
.mlb-main {
|
||||||
margin-top: 20px;
|
width: 100%;
|
||||||
width: 80%;
|
height: 100%;
|
||||||
margin-right: auto;
|
|
||||||
margin-left: auto;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mlb-image {
|
.mlb-image-wrapper {
|
||||||
|
position: absolute;
|
||||||
|
top: 50px;
|
||||||
|
left: 0px;
|
||||||
|
right: 0px;
|
||||||
|
bottom: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mlb-image-inner-wrapper {
|
||||||
|
display: table;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mlb-image {
|
||||||
|
display: table-cell;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mlb-image img {
|
.mlb-image img {
|
||||||
|
|
@ -35,52 +56,49 @@
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mlb-pre-image {
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
height: 32px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mlb-post-image {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0px;
|
||||||
|
height: 32px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
.mlb-controls {
|
.mlb-controls {
|
||||||
margin-right: auto;
|
height: 32px;
|
||||||
margin-left: auto;
|
width: 100%;
|
||||||
width: 80%;
|
|
||||||
min-height: 32px;
|
|
||||||
border-bottom: 1px solid #7d7c81;
|
border-bottom: 1px solid #7d7c81;
|
||||||
margin-bottom: 40px;
|
}
|
||||||
position: relative;
|
|
||||||
|
.mlb-close,
|
||||||
|
.mlb-fullscreen {
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
cursor: pointer;
|
||||||
|
width: 32px;
|
||||||
|
height: 32px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mlb-close {
|
.mlb-close {
|
||||||
cursor: pointer;
|
left: 0px;
|
||||||
background-image: url("../img/close.svg");
|
background-image: url("../img/close.svg");
|
||||||
width: 32px;
|
|
||||||
height: 32px;
|
|
||||||
border-right: 1px solid #7d7c81;
|
border-right: 1px solid #7d7c81;
|
||||||
border-bottom: 1px solid #7d7c81;
|
|
||||||
position: absolute;
|
|
||||||
bottom: -1px;
|
|
||||||
left: -32px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.mlb-fullscreen {
|
.mlb-fullscreen {
|
||||||
cursor: pointer;
|
|
||||||
background-image: url("../img/fullscreen.svg");
|
|
||||||
width: 32px;
|
|
||||||
height: 32px;
|
|
||||||
border-left: 1px solid #7d7c81;
|
|
||||||
border-bottom: 1px solid #7d7c81;
|
|
||||||
position: absolute;
|
|
||||||
bottom: -1px;
|
|
||||||
right: -32px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mlb-fullscreen-div {
|
|
||||||
position: absolute;
|
|
||||||
top: 0px;
|
|
||||||
left: 0px;
|
|
||||||
right: 0px;
|
right: 0px;
|
||||||
bottom: 0px;
|
background-image: url("../img/fullscreen.svg");
|
||||||
z-index: 1002;
|
border-left: 1px solid #7d7c81;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mlb-fullscreen-div .mlb-main {
|
.mlb-main.mlb-fullscreened {
|
||||||
margin-top: 10px;
|
background-color: black;
|
||||||
width: 100%;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.mlb-fullscreen-div .mlb-fullscreen {
|
.mlb-fullscreen-div .mlb-fullscreen {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue