mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
fix metadata manager layout
This commit is contained in:
Luke Pulverenti
parent
994b8ec70b
commit
a878877550
26 changed files with 2939 additions and 500 deletions
|
|
@ -737,55 +737,6 @@ $.ui.plugin = {
|
|||
|
||||
(function( $, window, undefined ) {
|
||||
|
||||
// Subtract the height of external toolbars from the page height, if the page does not have
|
||||
// internal toolbars of the same type. We take care to use the widget options if we find a
|
||||
// widget instance and the element's data-attributes otherwise.
|
||||
var compensateToolbars = function( page, desiredHeight ) {
|
||||
var pageParent = page.parent(),
|
||||
toolbarsAffectingHeight = [],
|
||||
|
||||
// We use this function to filter fixed toolbars with option updatePagePadding set to
|
||||
// true (which is the default) from our height subtraction, because fixed toolbars with
|
||||
// option updatePagePadding set to true compensate for their presence by adding padding
|
||||
// to the active page. We want to avoid double-counting by also subtracting their
|
||||
// height from the desired page height.
|
||||
noPadders = function() {
|
||||
var theElement = $( this ),
|
||||
widgetOptions = $.mobile.toolbar && theElement.data( "mobile-toolbar" ) ?
|
||||
theElement.toolbar( "option" ) : {
|
||||
position: theElement.attr( "data-" + $.mobile.ns + "position" ),
|
||||
updatePagePadding: ( theElement.attr( "data-" + $.mobile.ns +
|
||||
"update-page-padding" ) !== false )
|
||||
};
|
||||
|
||||
return !( widgetOptions.position === "fixed" &&
|
||||
widgetOptions.updatePagePadding === true );
|
||||
},
|
||||
externalHeaders = pageParent.children( ":jqmData(role='header')" ).filter( noPadders ),
|
||||
internalHeaders = page.children( ":jqmData(role='header')" ),
|
||||
externalFooters = pageParent.children( ":jqmData(role='footer')" ).filter( noPadders ),
|
||||
internalFooters = page.children( ":jqmData(role='footer')" );
|
||||
|
||||
// If we have no internal headers, but we do have external headers, then their height
|
||||
// reduces the page height
|
||||
if ( internalHeaders.length === 0 && externalHeaders.length > 0 ) {
|
||||
toolbarsAffectingHeight = toolbarsAffectingHeight.concat( externalHeaders.toArray() );
|
||||
}
|
||||
|
||||
// If we have no internal footers, but we do have external footers, then their height
|
||||
// reduces the page height
|
||||
if ( internalFooters.length === 0 && externalFooters.length > 0 ) {
|
||||
toolbarsAffectingHeight = toolbarsAffectingHeight.concat( externalFooters.toArray() );
|
||||
}
|
||||
|
||||
$.each( toolbarsAffectingHeight, function( index, value ) {
|
||||
desiredHeight -= $( value ).outerHeight();
|
||||
});
|
||||
|
||||
// Height must be at least zero
|
||||
return Math.max( 0, desiredHeight );
|
||||
};
|
||||
|
||||
$.extend( $.mobile, {
|
||||
// define the window and the document objects
|
||||
window: $( window ),
|
||||
|
|
@ -803,17 +754,7 @@ $.ui.plugin = {
|
|||
ypos = $.mobile.defaultHomeScroll;
|
||||
}
|
||||
|
||||
// prevent scrollstart and scrollstop events
|
||||
$.event.special.scrollstart.enabled = false;
|
||||
|
||||
setTimeout(function() {
|
||||
window.scrollTo( 0, ypos );
|
||||
$.mobile.document.trigger( "silentscroll", { x: 0, y: ypos });
|
||||
}, 20 );
|
||||
|
||||
setTimeout(function() {
|
||||
$.event.special.scrollstart.enabled = true;
|
||||
}, 150 );
|
||||
window.scrollTo(0, ypos);
|
||||
},
|
||||
|
||||
getClosestBaseUrl: function( ele ) {
|
||||
|
|
@ -916,8 +857,7 @@ $.ui.plugin = {
|
|||
pageHeight = page.height(),
|
||||
pageOuterHeight = page.outerHeight( true );
|
||||
|
||||
height = compensateToolbars( page,
|
||||
( typeof height === "number" ) ? height : $.mobile.getScreenHeight() );
|
||||
height = (typeof height === "number") ? height : $.mobile.getScreenHeight();
|
||||
|
||||
// Remove any previous min-height setting
|
||||
page.css( "min-height", "" );
|
||||
|
|
@ -1621,7 +1561,7 @@ var dataPropertyName = "virtualMouseBindings",
|
|||
clickBlockList = [],
|
||||
blockMouseTriggers = false,
|
||||
blockTouchTriggers = false,
|
||||
eventCaptureSupported = "addEventListener" in document,
|
||||
eventCaptureSupported = false,
|
||||
$document = $( document ),
|
||||
nextTouchID = 1,
|
||||
lastTouchID = 0, threshold,
|
||||
|
|
@ -2028,395 +1968,8 @@ function getSpecialEventObject( eventType ) {
|
|||
for ( i = 0; i < virtualEventNames.length; i++ ) {
|
||||
$.event.special[ virtualEventNames[ i ] ] = getSpecialEventObject( virtualEventNames[ i ] );
|
||||
}
|
||||
|
||||
// Add a capture click handler to block clicks.
|
||||
// Note that we require event capture support for this so if the device
|
||||
// doesn't support it, we punt for now and rely solely on mouse events.
|
||||
if ( eventCaptureSupported ) {
|
||||
document.addEventListener( "click", function( e ) {
|
||||
var cnt = clickBlockList.length,
|
||||
target = e.target,
|
||||
x, y, ele, i, o, touchID;
|
||||
|
||||
if ( cnt ) {
|
||||
x = e.clientX;
|
||||
y = e.clientY;
|
||||
threshold = $.vmouse.clickDistanceThreshold;
|
||||
|
||||
// The idea here is to run through the clickBlockList to see if
|
||||
// the current click event is in the proximity of one of our
|
||||
// vclick events that had preventDefault() called on it. If we find
|
||||
// one, then we block the click.
|
||||
//
|
||||
// Why do we have to rely on proximity?
|
||||
//
|
||||
// Because the target of the touch event that triggered the vclick
|
||||
// can be different from the target of the click event synthesized
|
||||
// by the browser. The target of a mouse/click event that is synthesized
|
||||
// from a touch event seems to be implementation specific. For example,
|
||||
// some browsers will fire mouse/click events for a link that is near
|
||||
// a touch event, even though the target of the touchstart/touchend event
|
||||
// says the user touched outside the link. Also, it seems that with most
|
||||
// browsers, the target of the mouse/click event is not calculated until the
|
||||
// time it is dispatched, so if you replace an element that you touched
|
||||
// with another element, the target of the mouse/click will be the new
|
||||
// element underneath that point.
|
||||
//
|
||||
// Aside from proximity, we also check to see if the target and any
|
||||
// of its ancestors were the ones that blocked a click. This is necessary
|
||||
// because of the strange mouse/click target calculation done in the
|
||||
// Android 2.1 browser, where if you click on an element, and there is a
|
||||
// mouse/click handler on one of its ancestors, the target will be the
|
||||
// innermost child of the touched element, even if that child is no where
|
||||
// near the point of touch.
|
||||
|
||||
ele = target;
|
||||
|
||||
while ( ele ) {
|
||||
for ( i = 0; i < cnt; i++ ) {
|
||||
o = clickBlockList[ i ];
|
||||
touchID = 0;
|
||||
|
||||
if ( ( ele === target && Math.abs( o.x - x ) < threshold && Math.abs( o.y - y ) < threshold ) ||
|
||||
$.data( ele, touchTargetPropertyName ) === o.touchID ) {
|
||||
// XXX: We may want to consider removing matches from the block list
|
||||
// instead of waiting for the reset timer to fire.
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
return;
|
||||
}
|
||||
}
|
||||
ele = ele.parentNode;
|
||||
}
|
||||
}
|
||||
}, true);
|
||||
}
|
||||
})( jQuery, window, document );
|
||||
|
||||
|
||||
(function( $, window, undefined ) {
|
||||
var $document = $( document ),
|
||||
supportTouch = $.mobile.support.touch,
|
||||
scrollEvent = "touchmove scroll",
|
||||
touchStartEvent = supportTouch ? "touchstart" : "mousedown",
|
||||
touchStopEvent = supportTouch ? "touchend" : "mouseup",
|
||||
touchMoveEvent = supportTouch ? "touchmove" : "mousemove";
|
||||
|
||||
// setup new event shortcuts
|
||||
$.each( ( "touchstart touchmove touchend " +
|
||||
"tap taphold " +
|
||||
"swipe swipeleft swiperight " +
|
||||
"scrollstart scrollstop" ).split( " " ), function( i, name ) {
|
||||
|
||||
$.fn[ name ] = function( fn ) {
|
||||
return fn ? this.bind( name, fn ) : this.trigger( name );
|
||||
};
|
||||
|
||||
// jQuery < 1.8
|
||||
if ( $.attrFn ) {
|
||||
$.attrFn[ name ] = true;
|
||||
}
|
||||
});
|
||||
|
||||
function triggerCustomEvent( obj, eventType, event, bubble ) {
|
||||
var originalType = event.type;
|
||||
event.type = eventType;
|
||||
if ( bubble ) {
|
||||
$.event.trigger( event, undefined, obj );
|
||||
} else {
|
||||
$.event.dispatch.call( obj, event );
|
||||
}
|
||||
event.type = originalType;
|
||||
}
|
||||
|
||||
// also handles scrollstop
|
||||
$.event.special.scrollstart = {
|
||||
|
||||
enabled: true,
|
||||
setup: function() {
|
||||
|
||||
var thisObject = this,
|
||||
$this = $( thisObject ),
|
||||
scrolling,
|
||||
timer;
|
||||
|
||||
function trigger( event, state ) {
|
||||
scrolling = state;
|
||||
triggerCustomEvent( thisObject, scrolling ? "scrollstart" : "scrollstop", event );
|
||||
}
|
||||
|
||||
// iPhone triggers scroll after a small delay; use touchmove instead
|
||||
$this.bind( scrollEvent, function( event ) {
|
||||
|
||||
if ( !$.event.special.scrollstart.enabled ) {
|
||||
return;
|
||||
}
|
||||
|
||||
if ( !scrolling ) {
|
||||
trigger( event, true );
|
||||
}
|
||||
|
||||
clearTimeout( timer );
|
||||
timer = setTimeout( function() {
|
||||
trigger( event, false );
|
||||
}, 50 );
|
||||
});
|
||||
},
|
||||
teardown: function() {
|
||||
$( this ).unbind( scrollEvent );
|
||||
}
|
||||
};
|
||||
|
||||
// also handles taphold
|
||||
$.event.special.tap = {
|
||||
tapholdThreshold: 750,
|
||||
emitTapOnTaphold: true,
|
||||
setup: function() {
|
||||
var thisObject = this,
|
||||
$this = $( thisObject ),
|
||||
isTaphold = false;
|
||||
|
||||
$this.bind( "vmousedown", function( event ) {
|
||||
isTaphold = false;
|
||||
if ( event.which && event.which !== 1 ) {
|
||||
return false;
|
||||
}
|
||||
|
||||
var origTarget = event.target,
|
||||
timer;
|
||||
|
||||
function clearTapTimer() {
|
||||
clearTimeout( timer );
|
||||
}
|
||||
|
||||
function clearTapHandlers() {
|
||||
clearTapTimer();
|
||||
|
||||
$this.unbind( "vclick", clickHandler )
|
||||
.unbind( "vmouseup", clearTapTimer );
|
||||
$document.unbind( "vmousecancel", clearTapHandlers );
|
||||
}
|
||||
|
||||
function clickHandler( event ) {
|
||||
clearTapHandlers();
|
||||
|
||||
// ONLY trigger a 'tap' event if the start target is
|
||||
// the same as the stop target.
|
||||
if ( !isTaphold && origTarget === event.target ) {
|
||||
triggerCustomEvent( thisObject, "tap", event );
|
||||
} else if ( isTaphold ) {
|
||||
event.preventDefault();
|
||||
}
|
||||
}
|
||||
|
||||
$this.bind( "vmouseup", clearTapTimer )
|
||||
.bind( "vclick", clickHandler );
|
||||
$document.bind( "vmousecancel", clearTapHandlers );
|
||||
|
||||
timer = setTimeout( function() {
|
||||
if ( !$.event.special.tap.emitTapOnTaphold ) {
|
||||
isTaphold = true;
|
||||
}
|
||||
triggerCustomEvent( thisObject, "taphold", $.Event( "taphold", { target: origTarget } ) );
|
||||
}, $.event.special.tap.tapholdThreshold );
|
||||
});
|
||||
},
|
||||
teardown: function() {
|
||||
$( this ).unbind( "vmousedown" ).unbind( "vclick" ).unbind( "vmouseup" );
|
||||
$document.unbind( "vmousecancel" );
|
||||
}
|
||||
};
|
||||
|
||||
// Also handles swipeleft, swiperight
|
||||
$.event.special.swipe = {
|
||||
|
||||
// More than this horizontal displacement, and we will suppress scrolling.
|
||||
scrollSupressionThreshold: 30,
|
||||
|
||||
// More time than this, and it isn't a swipe.
|
||||
durationThreshold: 1000,
|
||||
|
||||
// Swipe horizontal displacement must be more than this.
|
||||
horizontalDistanceThreshold: 30,
|
||||
|
||||
// Swipe vertical displacement must be less than this.
|
||||
verticalDistanceThreshold: 30,
|
||||
|
||||
getLocation: function ( event ) {
|
||||
var winPageX = window.pageXOffset,
|
||||
winPageY = window.pageYOffset,
|
||||
x = event.clientX,
|
||||
y = event.clientY;
|
||||
|
||||
if ( event.pageY === 0 && Math.floor( y ) > Math.floor( event.pageY ) ||
|
||||
event.pageX === 0 && Math.floor( x ) > Math.floor( event.pageX ) ) {
|
||||
|
||||
// iOS4 clientX/clientY have the value that should have been
|
||||
// in pageX/pageY. While pageX/page/ have the value 0
|
||||
x = x - winPageX;
|
||||
y = y - winPageY;
|
||||
} else if ( y < ( event.pageY - winPageY) || x < ( event.pageX - winPageX ) ) {
|
||||
|
||||
// Some Android browsers have totally bogus values for clientX/Y
|
||||
// when scrolling/zooming a page. Detectable since clientX/clientY
|
||||
// should never be smaller than pageX/pageY minus page scroll
|
||||
x = event.pageX - winPageX;
|
||||
y = event.pageY - winPageY;
|
||||
}
|
||||
|
||||
return {
|
||||
x: x,
|
||||
y: y
|
||||
};
|
||||
},
|
||||
|
||||
start: function( event ) {
|
||||
var data = event.originalEvent.touches ?
|
||||
event.originalEvent.touches[ 0 ] : event,
|
||||
location = $.event.special.swipe.getLocation( data );
|
||||
return {
|
||||
time: ( new Date() ).getTime(),
|
||||
coords: [ location.x, location.y ],
|
||||
origin: $( event.target )
|
||||
};
|
||||
},
|
||||
|
||||
stop: function( event ) {
|
||||
var data = event.originalEvent.touches ?
|
||||
event.originalEvent.touches[ 0 ] : event,
|
||||
location = $.event.special.swipe.getLocation( data );
|
||||
return {
|
||||
time: ( new Date() ).getTime(),
|
||||
coords: [ location.x, location.y ]
|
||||
};
|
||||
},
|
||||
|
||||
handleSwipe: function( start, stop, thisObject, origTarget ) {
|
||||
if ( stop.time - start.time < $.event.special.swipe.durationThreshold &&
|
||||
Math.abs( start.coords[ 0 ] - stop.coords[ 0 ] ) > $.event.special.swipe.horizontalDistanceThreshold &&
|
||||
Math.abs( start.coords[ 1 ] - stop.coords[ 1 ] ) < $.event.special.swipe.verticalDistanceThreshold ) {
|
||||
var direction = start.coords[0] > stop.coords[ 0 ] ? "swipeleft" : "swiperight";
|
||||
|
||||
triggerCustomEvent( thisObject, "swipe", $.Event( "swipe", { target: origTarget, swipestart: start, swipestop: stop }), true );
|
||||
triggerCustomEvent( thisObject, direction,$.Event( direction, { target: origTarget, swipestart: start, swipestop: stop } ), true );
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
|
||||
},
|
||||
|
||||
// This serves as a flag to ensure that at most one swipe event event is
|
||||
// in work at any given time
|
||||
eventInProgress: false,
|
||||
|
||||
setup: function() {
|
||||
var events,
|
||||
thisObject = this,
|
||||
$this = $( thisObject ),
|
||||
context = {};
|
||||
|
||||
// Retrieve the events data for this element and add the swipe context
|
||||
events = $.data( this, "mobile-events" );
|
||||
if ( !events ) {
|
||||
events = { length: 0 };
|
||||
$.data( this, "mobile-events", events );
|
||||
}
|
||||
events.length++;
|
||||
events.swipe = context;
|
||||
|
||||
context.start = function( event ) {
|
||||
|
||||
// Bail if we're already working on a swipe event
|
||||
if ( $.event.special.swipe.eventInProgress ) {
|
||||
return;
|
||||
}
|
||||
$.event.special.swipe.eventInProgress = true;
|
||||
|
||||
var stop,
|
||||
start = $.event.special.swipe.start( event ),
|
||||
origTarget = event.target,
|
||||
emitted = false;
|
||||
|
||||
context.move = function( event ) {
|
||||
if ( !start || event.isDefaultPrevented() ) {
|
||||
return;
|
||||
}
|
||||
|
||||
stop = $.event.special.swipe.stop( event );
|
||||
if ( !emitted ) {
|
||||
emitted = $.event.special.swipe.handleSwipe( start, stop, thisObject, origTarget );
|
||||
if ( emitted ) {
|
||||
|
||||
// Reset the context to make way for the next swipe event
|
||||
$.event.special.swipe.eventInProgress = false;
|
||||
}
|
||||
}
|
||||
// prevent scrolling
|
||||
if ( Math.abs( start.coords[ 0 ] - stop.coords[ 0 ] ) > $.event.special.swipe.scrollSupressionThreshold ) {
|
||||
event.preventDefault();
|
||||
}
|
||||
};
|
||||
|
||||
context.stop = function() {
|
||||
emitted = true;
|
||||
|
||||
// Reset the context to make way for the next swipe event
|
||||
$.event.special.swipe.eventInProgress = false;
|
||||
$document.off( touchMoveEvent, context.move );
|
||||
context.move = null;
|
||||
};
|
||||
|
||||
$document.on( touchMoveEvent, context.move )
|
||||
.one( touchStopEvent, context.stop );
|
||||
};
|
||||
$this.on( touchStartEvent, context.start );
|
||||
},
|
||||
|
||||
teardown: function() {
|
||||
var events, context;
|
||||
|
||||
events = $.data( this, "mobile-events" );
|
||||
if ( events ) {
|
||||
context = events.swipe;
|
||||
delete events.swipe;
|
||||
events.length--;
|
||||
if ( events.length === 0 ) {
|
||||
$.removeData( this, "mobile-events" );
|
||||
}
|
||||
}
|
||||
|
||||
if ( context ) {
|
||||
if ( context.start ) {
|
||||
$( this ).off( touchStartEvent, context.start );
|
||||
}
|
||||
if ( context.move ) {
|
||||
$document.off( touchMoveEvent, context.move );
|
||||
}
|
||||
if ( context.stop ) {
|
||||
$document.off( touchStopEvent, context.stop );
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
$.each({
|
||||
scrollstop: "scrollstart",
|
||||
taphold: "tap",
|
||||
swipeleft: "swipe.left",
|
||||
swiperight: "swipe.right"
|
||||
}, function( event, sourceEvent ) {
|
||||
|
||||
$.event.special[ event ] = {
|
||||
setup: function() {
|
||||
$( this ).bind( sourceEvent, $.noop );
|
||||
},
|
||||
teardown: function() {
|
||||
$( this ).unbind( sourceEvent );
|
||||
}
|
||||
};
|
||||
});
|
||||
|
||||
})( jQuery, this );
|
||||
|
||||
(function( $, undefined ) {
|
||||
var props = {
|
||||
"animation": {},
|
||||
|
|
@ -4545,18 +4098,11 @@ $.fn.grid = function( options ) {
|
|||
},
|
||||
|
||||
scrollPage: function() {
|
||||
// By using scrollTo instead of silentScroll, we can keep things better in order
|
||||
// Just to be precautios, disable scrollstart listening like silentScroll would
|
||||
$.event.special.scrollstart.enabled = false;
|
||||
//if we are hiding the url bar or the page was previously scrolled scroll to hide or return to position
|
||||
|
||||
//if we are hiding the url bar or the page was previously scrolled scroll to hide or return to position
|
||||
if ( $.mobile.hideUrlBar || this.toScroll !== $.mobile.defaultHomeScroll ) {
|
||||
window.scrollTo( 0, this.toScroll );
|
||||
}
|
||||
|
||||
// reenable scrollstart listening like silentScroll would
|
||||
setTimeout( function() {
|
||||
$.event.special.scrollstart.enabled = true;
|
||||
}, 150 );
|
||||
},
|
||||
|
||||
startIn: function( screenHeight, reverseClass, none, preventFocus ) {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue