From 8b1f8ead88428b6ce1ab44df47ab4e44ad9e64a3 Mon Sep 17 00:00:00 2001 From: Jaifroid Date: Sun, 30 Jul 2017 21:55:02 +0100 Subject: [PATCH] Support new stylesheets Former-commit-id: 6a867f670d2f5f596eaae2dc94bbe8dffac9835c [formerly a6fc39bbff542ef0750f3944e19d7380465da307] Former-commit-id: 5b0ceefb2ae0c5b5ddb40a2b831c96494e6d7a2c --- .../css_modules/ext.tmh.thumbnail.styles.css | 2 ++ .../css_modules/mw.MediaWikiPlayer.loader.css | 6 ++++++ .../s/css_modules/mw.PopUpMediaTransform.css | 6 ++++++ www/-/s/css_modules/mw.TMHGalleryHook.js.css | 6 ++++++ www/js/app.js | 19 +++++++++++++------ www/js/lib/transformStyles.js | 4 ++++ 6 files changed, 37 insertions(+), 6 deletions(-) create mode 100644 www/-/s/css_modules/ext.tmh.thumbnail.styles.css create mode 100644 www/-/s/css_modules/mw.MediaWikiPlayer.loader.css create mode 100644 www/-/s/css_modules/mw.PopUpMediaTransform.css create mode 100644 www/-/s/css_modules/mw.TMHGalleryHook.js.css diff --git a/www/-/s/css_modules/ext.tmh.thumbnail.styles.css b/www/-/s/css_modules/ext.tmh.thumbnail.styles.css new file mode 100644 index 00000000..14b74cd2 --- /dev/null +++ b/www/-/s/css_modules/ext.tmh.thumbnail.styles.css @@ -0,0 +1,2 @@ +.mediaContainer,.PopUpMediaTransform{position:relative;display:block} +.thumb .mediaContainer,.thumb .PopUpMediaTransform{margin:0 auto} \ No newline at end of file diff --git a/www/-/s/css_modules/mw.MediaWikiPlayer.loader.css b/www/-/s/css_modules/mw.MediaWikiPlayer.loader.css new file mode 100644 index 00000000..a40ce3be --- /dev/null +++ b/www/-/s/css_modules/mw.MediaWikiPlayer.loader.css @@ -0,0 +1,6 @@ +/** + * Dummy stylesheet + * + * This sheet returns an empty css from the ZIM, so it is included here + * to prevent useless retrieval of empty data. + */ \ No newline at end of file diff --git a/www/-/s/css_modules/mw.PopUpMediaTransform.css b/www/-/s/css_modules/mw.PopUpMediaTransform.css new file mode 100644 index 00000000..a40ce3be --- /dev/null +++ b/www/-/s/css_modules/mw.PopUpMediaTransform.css @@ -0,0 +1,6 @@ +/** + * Dummy stylesheet + * + * This sheet returns an empty css from the ZIM, so it is included here + * to prevent useless retrieval of empty data. + */ \ No newline at end of file diff --git a/www/-/s/css_modules/mw.TMHGalleryHook.js.css b/www/-/s/css_modules/mw.TMHGalleryHook.js.css new file mode 100644 index 00000000..a40ce3be --- /dev/null +++ b/www/-/s/css_modules/mw.TMHGalleryHook.js.css @@ -0,0 +1,6 @@ +/** + * Dummy stylesheet + * + * This sheet returns an empty css from the ZIM, so it is included here + * to prevent useless retrieval of empty data. + */ \ No newline at end of file diff --git a/www/js/app.js b/www/js/app.js index 2f6b1e01..6a59d2e9 100644 --- a/www/js/app.js +++ b/www/js/app.js @@ -1045,6 +1045,9 @@ define(['jquery', 'zimArchiveLoader', 'util', 'uiUtil', 'cookies','abstractFiles //Set up tracking variables var countImages = 0; + //DEV: This sets the maximum number of visible images to request in a single batch (too many will slow image display) + //NB remaining visible images are shunted into prefetchSlice, which works in the background + var maxVisibleSliceSize = 10; //DEV: Set this to the number of images you want to prefetch after the on-screen images have been fetched var prefetchSliceSize = 20; //DEV: SVG images are currently very taxing: keep this number at 5 or below and test on your system with Sine.html @@ -1094,6 +1097,8 @@ define(['jquery', 'zimArchiveLoader', 'util', 'uiUtil', 'cookies','abstractFiles prepareImages(); } else { console.log("There are no images to display in this article."); + //TESTING + console.timeEnd("Time to Document Ready"); } } else { console.log("Image retrieval disabled by user"); @@ -1213,7 +1218,7 @@ define(['jquery', 'zimArchiveLoader', 'util', 'uiUtil', 'cookies','abstractFiles svgGroup1.push(images[i]); } } else { - if (i <= lastVisible) { + if (i <= lastVisible && visibleSlice.length <= maxVisibleSliceSize) { visibleSlice.push(images[i]); } else { prefetchSlice.push(images[i]); @@ -1246,18 +1251,16 @@ define(['jquery', 'zimArchiveLoader', 'util', 'uiUtil', 'cookies','abstractFiles sliceID++; //Get ready to process next slice if (sliceID == 1) { if (visibleSlice.length) { - console.log("** About to request " + visibleSlice.length + " visible image(s)..."); + console.log("** Accessing " + visibleSlice.length + " visible image(s)..."); loadImageSlice(visibleSlice, 1, visibleSlice.length, displaySlices); visibleSlice = []; - //TESTING - console.timeEnd("Time to Document Ready"); } else { //No images in this slice so move on to next sliceID++; } } if (sliceID == 2) { if (prefetchSlice.length) { - console.log("Prefetching " + prefetchSlice.length + " offscreen images..."); + console.log("** Prefetching " + prefetchSlice.length + " offscreen images..."); loadImageSlice(prefetchSlice, 2, prefetchSlice.length, displaySlices); prefetchSlice = []; } else { //No images in this slice so move on to next @@ -1265,7 +1268,11 @@ define(['jquery', 'zimArchiveLoader', 'util', 'uiUtil', 'cookies','abstractFiles } } if (sliceID == 3) { + //TESTING + if (countImages <= maxVisibleSliceSize + prefetchSliceSize) { console.timeEnd("Time to Document Ready"); } + if (svgSlice.length) { + console.log("** Slicing " + svgSlice.length + " SVG images..."); //Set up variables to hold visible image range (to check whether user scrolls during lengthy procedure) var startSVG; var endSVG; @@ -1279,7 +1286,7 @@ define(['jquery', 'zimArchiveLoader', 'util', 'uiUtil', 'cookies','abstractFiles console.log("** All images extracted from current document **") windowScroll = true; //Go back to prove this! } else { - console.log("All images extracted from requested slices\n" + + console.log("All requested image slices have been processed\n" + "** Waiting for user scroll... **"); windowScroll = true; } diff --git a/www/js/lib/transformStyles.js b/www/js/lib/transformStyles.js index d2a2225a..d8012f65 100644 --- a/www/js/lib/transformStyles.js +++ b/www/js/lib/transformStyles.js @@ -57,6 +57,10 @@ define(['uiUtil'], function (uiUtil) { zl.match(/-\/s\/css_modules\/ext.kartographer.style.css/i) || zl.match(/-\/s\/css_modules\/ext.kartographer.link.css/i) || zl.match(/-\/s\/css_modules\/ext.kartographer.frame.css/i) || + zl.match(/-\/s\/css_modules\/mw.TMHGalleryHook.js.css/i) || + zl.match(/-\/s\/css_modules\/mw.PopUpMediaTransform.css/i) || + zl.match(/-\/s\/css_modules\/mw.MediaWikiPlayer.loader.css/i) || + zl.match(/-\/s\/css_modules\/ext.tmh.thumbnail.styles.css/i) || zl.match(/-\/s\/css_modules\/content.parsoid.css/i) || zl.match(/-\/s\/css_modules\/inserted_style_mobile.css/i) || zl.match(/-\/s\/css_modules\/mobile.css/i) ||