cotugno/jellyfin-web
2
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web.git synced 2024-11-18 03:18:19 -07:00
Code Issues Packages Projects Releases Wiki Activity

update image loader

Browse Source
This commit is contained in:
Luke Pulverenti 2016-01-20 20:05:14 -05:00
parent 8212c8d713
commit c1524a86f7
9 changed files with 140 additions and 152 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
dashboard-ui/bower_components/emby-apiclient/.bower.json vendored
View File

@ -16,12 +16,12 @@
},
"devDependencies": {},
"ignore": [],
"version": "1.0.27",
"_release": "1.0.27",
"version": "1.0.30",
"_release": "1.0.30",
"_resolution": {
"type": "version",
"tag": "1.0.27",
"commit": "c8758fe411230a36326a0bd72e8d4d5971f506f7"
"tag": "1.0.30",
"commit": "9f144d506da6c01cd99f2421953a9f2c5c96e295"
},
"_source": "git://github.com/MediaBrowser/Emby.ApiClient.Javascript.git",
"_target": "~1.0.3",

74
dashboard-ui/bower_components/emby-apiclient/connectionmanager.js vendored
View File

@ -488,6 +488,10 @@
});
}
function getConnectUrl(handler) {
return 'https://connect.emby.media/service/' + handler;
}
function getConnectUser(userId, accessToken) {
if (!userId) {
@ -1529,6 +1533,76 @@
}
}
function addAppInfoToConnectRequest(request) {
request.headers = request.headers || {};
request.headers['X-Application'] = appName + '/' + appVersion;
}
self.createPin = function () {
var request = {
type: 'POST',
url: getConnectUrl('pin'),
data: {
deviceId: deviceId
},
dataType: 'json'
};
addAppInfoToConnectRequest(request);
return ajax(request);
};
self.getPinStatus = function (pinInfo) {
var queryString = {
deviceId: pinInfo.DeviceId,
pin: pinInfo.Pin
};
var request = {
type: 'GET',
url: getConnectUrl('pin') + '?' + paramsToString(queryString),
dataType: 'json'
};
addAppInfoToConnectRequest(request);
return ajax(request);
};
function exchangePin(pinInfo) {
var request = {
type: 'POST',
url: getConnectUrl('pin/authenticate'),
data: {
deviceId: pinInfo.DeviceId,
pin: pinInfo.Pin
},
dataType: 'json'
};
addAppInfoToConnectRequest(request);
return ajax(request);
}
self.exchangePin = function (pinInfo) {
return exchangePin(pinInfo).then(function (result) {
var credentials = credentialProvider.credentials();
credentials.ConnectAccessToken = result.AccessToken;
credentials.ConnectUserId = result.UserId;
credentialProvider.credentials(credentials);
return ensureConnectUser(credentials);
});
};
return self;
};

8
dashboard-ui/bower_components/emby-webcomponents/.bower.json vendored
View File

@ -15,12 +15,12 @@
},
"devDependencies": {},
"ignore": [],
"version": "1.0.21",
"_release": "1.0.21",
"version": "1.0.23",
"_release": "1.0.23",
"_resolution": {
"type": "version",
"tag": "1.0.21",
"commit": "dd73237b9d554d45a664e820042804c6d129d280"
"tag": "1.0.23",
"commit": "1e7c56cf54a657d72d35d36f37937231942a2685"
},
"_source": "git://github.com/MediaBrowser/emby-webcomponents.git",
"_target": "~1.0.0",

0
dashboard-ui/bower_components/emby-webcomponents/images/basicimageloader.js → dashboard-ui/bower_components/emby-webcomponents/images/basicimagefetcher.js vendored
View File

46
dashboard-ui/bower_components/emby-webcomponents/images/imagehelper.js vendored
View File

@ -1,4 +1,4 @@
define(['visibleinviewport', 'imageloader'], function (visibleinviewport, imageLoader) {
define(['visibleinviewport', 'imageFetcher'], function (visibleinviewport, imageFetcher) {
var thresholdX = screen.availWidth;
var thresholdY = screen.availHeight;
@ -9,14 +9,33 @@ define(['visibleinviewport', 'imageloader'], function (visibleinviewport, imageL
return visibleinviewport(elem, true, thresholdX, thresholdY);
}
var self = {};
function fillImage(elem) {
var source = elem.getAttribute('data-src');
if (source) {
imageLoader.loadImage(elem, source);
if (self.enableFade) {
imageFetcher.loadImage(elem, source).then(fadeIn);
} else {
imageFetcher.loadImage(elem, source);
}
elem.setAttribute("data-src", '');
}
}
function fadeIn(elem) {
if (elem.classList.contains('noFade')) {
return;
}
var keyframes = [
{ opacity: '0', offset: 0 },
{ opacity: '1', offset: 1 }];
var timing = { duration: 300, iterations: 1 };
elem.animate(keyframes, timing);
}
function cancelAll(tokens) {
for (var i = 0, length = tokens.length; i < length; i++) {
@ -167,9 +186,24 @@ define(['visibleinviewport', 'imageloader'], function (visibleinviewport, imageL
return result;
}
return {
lazyChildren: lazyChildren,
getPrimaryImageAspectRatio: getPrimaryImageAspectRatio
};
function fillImages(elems) {
for (var i = 0, length = elems.length; i < length; i++) {
var elem = elems[0];
fillImage(elem);
}
}
function lazyImage(elem, url) {
elem.setAttribute('data-src', url);
fillImage(elem);
}
self.fillImages = fillImages;
self.lazyImage = lazyImage;
self.lazyChildren = lazyChildren;
self.getPrimaryImageAspectRatio = getPrimaryImageAspectRatio;
return self;
});

0
dashboard-ui/bower_components/emby-webcomponents/images/persistentimageloader.js → dashboard-ui/bower_components/emby-webcomponents/images/persistentimagefetcher.js vendored
View File

9
dashboard-ui/scripts/librarymenu.js
View File

@ -50,7 +50,9 @@
document.body.appendChild(viewMenuBar);
ImageLoader.lazyChildren(document.querySelector('.viewMenuBar'));
require(['imageLoader'], function (imageLoader) {
imageLoader.lazyChildren(document.querySelector('.viewMenuBar'));
});
document.dispatchEvent(new CustomEvent("headercreated", {}));
bindMenuEvents();
@ -323,7 +325,10 @@
var userHeader = drawer.querySelector('.userheader');
userHeader.innerHTML = html;
ImageLoader.fillImages(userHeader.getElementsByClassName('lazy'));
require(['imageLoader'], function (imageLoader) {
imageLoader.fillImages(userHeader.getElementsByClassName('lazy'));
});
}
function refreshLibraryInfoInDrawer(user, drawer) {

17
dashboard-ui/scripts/site.js
View File

@ -1855,15 +1855,16 @@ var AppInfo = {};
browser: embyWebComponentsBowerPath + "/browser",
qualityoptions: embyWebComponentsBowerPath + "/qualityoptions",
connectservice: apiClientBowerPath + '/connectservice',
hammer: bowerPath + "/hammerjs/hammer.min"
hammer: bowerPath + "/hammerjs/hammer.min",
imageLoader: embyWebComponentsBowerPath + "/images/imagehelper"
};
if (navigator.webkitPersistentStorage) {
paths.imageloader = embyWebComponentsBowerPath + "/images/persistentimageloader";
paths.imageFetcher = embyWebComponentsBowerPath + "/images/persistentimagefetcher";
} else if (Dashboard.isRunningInCordova()) {
paths.imageloader = 'cordova/imagestore';
paths.imageFetcher = 'cordova/imagestore';
} else {
paths.imageloader = embyWebComponentsBowerPath + "/images/basicimageloader";
paths.imageFetcher = embyWebComponentsBowerPath + "/images/basicimagefetcher";
}
paths.hlsjs = bowerPath + "/hls.js/dist/hls.min";
@ -2152,7 +2153,6 @@ var AppInfo = {};
var promises = [];
deps = [];
deps.push('scripts/mediaplayer');
deps.push('thirdparty/jquery.unveil-custom.js');
deps.push('emby-icons');
deps.push('paper-icon-button');
deps.push('paper-button');
@ -2219,6 +2219,8 @@ var AppInfo = {};
var deps = [];
deps.push('imageLoader');
if (!(AppInfo.isNativeApp && browserInfo.android)) {
document.documentElement.classList.add('minimumSizeTabs');
}
@ -2263,7 +2265,10 @@ var AppInfo = {};
deps.push('css!css/card.css');
require(deps, function () {
require(deps, function (imageLoader) {
imageLoader.enableFade = browserInfo.animate && !browserInfo.mobile;
window.ImageLoader = imageLoader;
$.mobile.filterHtml = Dashboard.filterHtml;

130
dashboard-ui/thirdparty/jquery.unveil-custom.js vendored
View File

@ -1,130 +0,0 @@
define(['visibleinviewport', 'imageloader'], function (visibleInViewport, imageLoader) {
var wheelEvent = (document.implementation.hasFeature('Event.wheel', '3.0') ? 'wheel' : 'mousewheel');
var thresholdX = screen.availWidth;
var thresholdY = screen.availHeight;
function isVisible(elem) {
return visibleInViewport(elem, true, thresholdX, thresholdY);
}
function fillImage(elem) {
var source = elem.getAttribute('data-src');
if (source) {
imageLoader.loadImage(elem, source).then(fadeIn);
elem.setAttribute("data-src", '');
}
}
function fadeIn(elem) {
if (!browserInfo.animate || browserInfo.mobile) {
return;
}
if (elem.classList.contains('noFade')) {
return;
}
var keyframes = [
{ opacity: '0', offset: 0 },
{ opacity: '1', offset: 1 }];
var timing = { duration: 300, iterations: 1 };
elem.animate(keyframes, timing);
}
function cancelAll(tokens) {
for (var i = 0, length = tokens.length; i < length; i++) {
tokens[i] = true;
}
}
function unveilElements(images) {
if (!images.length) {
return;
}
var cancellationTokens = [];
function unveilInternal(tokenIndex) {
var remaining = [];
var anyFound = false;
var out = false;
// TODO: This out construct assumes left to right, top to bottom
for (var i = 0, length = images.length; i < length; i++) {
if (cancellationTokens[tokenIndex]) {
return;
}
var img = images[i];
if (!out && isVisible(img)) {
anyFound = true;
fillImage(img);
} else {
if (anyFound) {
out = true;
}
remaining.push(img);
}
}
images = remaining;
if (!images.length) {
document.removeEventListener('focus', unveil, true);
document.removeEventListener('scroll', unveil, true);
document.removeEventListener(wheelEvent, unveil, true);
window.removeEventListener('resize', unveil, true);
}
}
function unveil() {
cancelAll(cancellationTokens);
var index = cancellationTokens.length;
cancellationTokens.length++;
setTimeout(function () {
unveilInternal(index);
}, 1);
}
document.addEventListener('scroll', unveil, true);
document.addEventListener('focus', unveil, true);
document.addEventListener(wheelEvent, unveil, true);
window.addEventListener('resize', unveil, true);
unveil();
}
function fillImages(elems) {
for (var i = 0, length = elems.length; i < length; i++) {
var elem = elems[0];
fillImage(elem);
}
}
function lazyChildren(elem) {
unveilElements(elem.getElementsByClassName('lazy'), elem);
}
function lazyImage(elem, url) {
elem.setAttribute('data-src', url);
fillImages([elem]);
}
window.ImageLoader = {
fillImages: fillImages,
lazyImage: lazyImage,
lazyChildren: lazyChildren
};
});