mirror of
https://github.com/kiwix/kiwix-js.git
synced 2025-09-22 03:52:21 -04:00
In jQuery mode, display images, javascript and CSS dependencies.
Images seem to work fine. I could not test JS and CSS for now See #136
This commit is contained in:
parent
f9ccc51145
commit
a4feca9930
@ -25,32 +25,6 @@
|
||||
// TODO : remove requirejs if it's really useless here
|
||||
importScripts('./www/js/lib/require.js');
|
||||
|
||||
/**
|
||||
* From https://stackoverflow.com/questions/16245767/creating-a-blob-from-a-base64-string-in-javascript
|
||||
*/
|
||||
function b64toBlob(b64Data, contentType, sliceSize) {
|
||||
contentType = contentType || '';
|
||||
sliceSize = sliceSize || 512;
|
||||
|
||||
var byteCharacters = atob(b64Data);
|
||||
var byteArrays = [];
|
||||
|
||||
for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
|
||||
var slice = byteCharacters.slice(offset, offset + sliceSize);
|
||||
|
||||
var byteNumbers = new Array(slice.length);
|
||||
for (var i = 0; i < slice.length; i++) {
|
||||
byteNumbers[i] = slice.charCodeAt(i);
|
||||
}
|
||||
|
||||
var byteArray = new Uint8Array(byteNumbers);
|
||||
|
||||
byteArrays.push(byteArray);
|
||||
}
|
||||
|
||||
var blob = new Blob(byteArrays, {type: contentType});
|
||||
return blob;
|
||||
}
|
||||
|
||||
self.addEventListener('install', function(event) {
|
||||
event.waitUntil(self.skipWaiting());
|
||||
|
@ -375,7 +375,7 @@ define(['jquery', 'abstractBackend', 'util', 'cookies','geometry','osabstraction
|
||||
* @returns {Boolean} true if they're compatible
|
||||
*/
|
||||
function checkSelectedArchiveCompatibilityWithInjectionMode() {
|
||||
if (selectedArchive.needsWikimediaCSS() && contentInjectionMode === 'serviceworker') {
|
||||
if (selectedArchive && selectedArchive.needsWikimediaCSS() && contentInjectionMode === 'serviceworker') {
|
||||
alert('You seem to want to use ServiceWorker mode for an Evopedia archive : this is not supported. Please use the JQuery mode or use a ZIM file');
|
||||
$("#btnConfigure").click();
|
||||
return false;
|
||||
@ -881,6 +881,8 @@ define(['jquery', 'abstractBackend', 'util', 'cookies','geometry','osabstraction
|
||||
var regexpImageLink = /^.?\/?[^:]+:(.*)/;
|
||||
var regexpMathImageUrl = /^\/math.*\/([0-9a-f]{32})\.png$/;
|
||||
var regexpPath = /^(.*\/)[^\/]+$/;
|
||||
var regexpImageUrl = /^\.\.\/I\/(.*)$/;
|
||||
var regexpMetadataUrl = /^\.\.\/-\/(.*)$/;
|
||||
|
||||
/**
|
||||
* Display the the given HTML article in the web page,
|
||||
@ -969,14 +971,61 @@ define(['jquery', 'abstractBackend', 'util', 'cookies','geometry','osabstraction
|
||||
});
|
||||
}
|
||||
|
||||
// Load math images
|
||||
// Load images
|
||||
$('#articleContent').contents().find('body').find('img').each(function() {
|
||||
var image = $(this);
|
||||
var m = image.attr("src").match(regexpMathImageUrl);
|
||||
if (m) {
|
||||
// It's a math image (Evopedia archive)
|
||||
selectedArchive.loadMathImage(m[1], function(data) {
|
||||
image.attr("src", 'data:image/png;base64,' + data);
|
||||
});
|
||||
} else {
|
||||
// It's a standard image contained in the ZIM file
|
||||
var imageMatch = image.attr("src").match(regexpImageUrl);
|
||||
if (imageMatch) {
|
||||
selectedArchive.getTitleByName(imageMatch[1]).then(function(title) {
|
||||
selectedArchive.readBinaryFile(title, function (readableTitleName, content) {
|
||||
// TODO : add the complete MIME-type of the image (as read from the ZIM file)
|
||||
image.attr("src", 'data:image;base64,' + util.uint8ArrayToBase64(content));
|
||||
});
|
||||
}).fail(function () {
|
||||
console.error("could not find title for image:" + imageMatch[1]);
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Load CSS content
|
||||
$('#articleContent').contents().find('body').find('link[rel=stylesheet]').each(function() {
|
||||
var link = $(this);
|
||||
var hrefMatch = link.attr("href").match(regexpMetadataUrl);
|
||||
if (hrefMatch) {
|
||||
// It's a CSS file contained in the ZIM file
|
||||
selectedArchive.getTitleByName(hrefMatch[1]).then(function(title) {
|
||||
selectedArchive.readBinaryFile(title, function (readableTitleName, content) {
|
||||
link.attr("href", 'data:text/css;charset=UTF-8,' + encodeURIComponent(util.uintToString(content)));
|
||||
});
|
||||
}).fail(function () {
|
||||
console.error("could not find title for CSS : " + hrefMatch[1]);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// Load Javascript content
|
||||
$('#articleContent').contents().find('body').find('script').each(function() {
|
||||
var script = $(this);
|
||||
var srcMatch = script.attr("src").match(regexpMetadataUrl);
|
||||
// TODO check that the type of the script is text/javascript or application/javascript
|
||||
if (srcMatch) {
|
||||
// It's a Javascript file contained in the ZIM file
|
||||
selectedArchive.getTitleByName(srcMatch[1]).then(function(title) {
|
||||
selectedArchive.readBinaryFile(title, function (readableTitleName, content) {
|
||||
script.attr("src", 'data:text/javascript;charset=UTF-8,' + encodeURIComponent(util.uintToString(content)));
|
||||
});
|
||||
}).fail(function () {
|
||||
console.error("could not find title for javascript : " + srcMatch[1]);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
@ -159,6 +159,51 @@ define(['q'], function(q) {
|
||||
return mid;
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Converts a Base64 Content to a Blob
|
||||
* From https://stackoverflow.com/questions/16245767/creating-a-blob-from-a-base64-string-in-javascript
|
||||
*
|
||||
* @param {String} b64Data Base64-encoded data
|
||||
* @param {String} contentType
|
||||
* @param {Integer} sliceSize
|
||||
* @returns {Blob}
|
||||
*/
|
||||
function b64toBlob(b64Data, contentType, sliceSize) {
|
||||
contentType = contentType || '';
|
||||
sliceSize = sliceSize || 512;
|
||||
|
||||
var byteCharacters = atob(b64Data);
|
||||
var byteArrays = [];
|
||||
|
||||
for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
|
||||
var slice = byteCharacters.slice(offset, offset + sliceSize);
|
||||
|
||||
var byteNumbers = new Array(slice.length);
|
||||
for (var i = 0; i < slice.length; i++) {
|
||||
byteNumbers[i] = slice.charCodeAt(i);
|
||||
}
|
||||
|
||||
var byteArray = new Uint8Array(byteNumbers);
|
||||
|
||||
byteArrays.push(byteArray);
|
||||
}
|
||||
|
||||
var blob = new Blob(byteArrays, {type: contentType});
|
||||
return blob;
|
||||
}
|
||||
|
||||
/**
|
||||
* Converts a UInt Array to a UTF-8 encoded string
|
||||
*
|
||||
* @param {UIntArray} uintArray
|
||||
* @returns {String}
|
||||
*/
|
||||
function uintToString(uintArray) {
|
||||
var encodedString = String.fromCharCode.apply(null, uintArray),
|
||||
decodedString = decodeURIComponent(escape(encodedString));
|
||||
return decodedString;
|
||||
}
|
||||
|
||||
/**
|
||||
* Functions and classes exposed by this module
|
||||
@ -171,6 +216,8 @@ define(['q'], function(q) {
|
||||
uint8ArrayToHex : uint8ArrayToHex,
|
||||
uint8ArrayToBase64 : uint8ArrayToBase64,
|
||||
readFileSlice : readFileSlice,
|
||||
binarySearch: binarySearch
|
||||
binarySearch: binarySearch,
|
||||
b64toBlob: b64toBlob,
|
||||
uintToString: uintToString
|
||||
};
|
||||
});
|
||||
|
Loading…
x
Reference in New Issue
Block a user