kiwix/kiwix-js-pwa
1
0
Fork 0
mirror of https://github.com/kiwix/kiwix-js-pwa.git synced 2025-09-22 02:57:00 -04:00
Code Issues Packages Projects Releases Wiki Activity
kiwix-js-pwa/www/index.html
Jaifroid 6d776a4dae Update changelogs and align Privacy Policies 
Former-commit-id: c8273d2227596429d274035fd2f76d1b9df12dd5 [formerly f93bc329c6968787608b3e8b77b6d220edf6da02 [formerly 274735138e86df88625d69f66b3191c77fbcc5c7]]
Former-commit-id: d66806476f4f9eda8991c070379ea5f7f1a13abf
Former-commit-id: 6b6bcd691abf0abf1b70c891d3feb3ec35e745dd
2021-02-07 09:12:08 +00:00

845 lines
65 KiB
HTML
Raw Permalink Blame History

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Kiwix JS PWA</title>
<meta name="description" content="Offline Wikipedia reader">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Security-Policy" content="default-src http: https: file: data: blob: chrome-extension: ms-appx-web: 'unsafe-inline' 'unsafe-eval';">
<meta name="theme-color" content="black">
<!--
Kiwix (offline Wikipedia reader) - HTML5/Javascript version
Home page : https://www.kiwix.org
Main authors of this application :
Mossroy - https://github.com/mossroy - mossroy@mossroy.fr
Peter-x - https://github.com/peter-x
Jaifroid - Adapted for UWP for Windows 10 and Windows Mobile 10 : Geoffrey Kantaris egk10@cam.ac.uk
Copyright 2013-2018 Mossroy, Peter-x, Jaifroid, sharun-s and contributors
License GPL v3:
This file is part of Kiwix.
Kiwix is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
Kiwix is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with Kiwix (file LICENSE-GPLv3.txt). If not, see <https://www.gnu.org/licenses/>
-->
<link rel="manifest" href="../manifest.json" />
<link rel="stylesheet" href="css/app.css" />
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen" />
<!-- link href="css/bootstrap-theme.min.css" rel="stylesheet" media="screen" /-->
<script type="text/javascript">
// This script is needed to retrieve launch arguments when the app is started by double-clicking on a file
var launchArguments = null;
if (typeof Windows !== 'undefined' && Windows.UI && Windows.UI.WebUI && Windows.UI.WebUI.WebUIApplication) {
Windows.UI.WebUI.WebUIApplication.addEventListener('activated', function (eventArgs) {
if (eventArgs.kind === Windows.ApplicationModel.Activation.ActivationKind.file) {
console.log("App was activated with a file: " + eventArgs.files[0].name);
launchArguments = eventArgs;
}
}, false);
}
// If we're running in NWJS context, rename NWJS require and add needed functions
if (typeof window.nw !== 'undefined') {
window.requireNode = window.require;
window.require = undefined;
window.fs = requireNode('fs');
}
if ('serviceWorker' in navigator && /^http|ms-appx-web/.test(window.location.protocol)) {
console.log('Trying to activate Service Worker...');
if (navigator.serviceWorker.controller) {
console.log('Service Worker is already active');
} else {
// Register the service worker
navigator.serviceWorker.register("../pwabuilder-sw.js", {
scope: "../"
}).then(function (reg) {
console.log("Service worker has been registered for scope: " + reg.scope);
});
}
} else {
console.log('Service Worker not (re-)registered in this context...');
}
</script>
</head>
<body role="application" class="dark">
<!-- Modal info -->
<div id="myModal" class="modal">
<div class="modal-dialog modal-full">
<div id="modalTheme" class="modal-content dark">
<div id="largeModal" class="modal-body">
<button class="close" aria-hidden="true" type="button" data-dismiss="modal">&times;</button>
<img style="float:left; padding-right:1em;" alt="Kiwix icon" src="img/icons/kiwix-midnightblue-90.png">
<h2 style="font-size:32px;margin-top:10px;">
Welcome to Kiwix&nbsp;JS for Windows
</h2>
<h4>Version <span class="version">1.0</span> (<a href="#update">changes</a>)</h4>
<h3>Please read this important information</h3>
<div class="disclaimer">
<p>
<b>DISCLAIMER:</b> Please be aware that Kiwix works with offline archives. To get updated info, you will need to
download a new archive periodically. Information in archives is free, open source and provided by volunteers.<br>
<strong>Kiwix gives no guarantee as to the accuracy of information in the archives you access with this app.</strong>
</p>
</div>
<p style="padding-top:10px;">
This application (apart from the PWA version) is packaged with only a sample ZIM archive of the top 100 Wikipedia articles
so that you can get a feel for how offline Wikipedia browsing works. You will need to downloaded an offline ZIM archive and
store it on your device. You can do this from the <b>Configuration page&nbsp;<span class="glyphicon glyphicon-wrench"></span></b>,
or else see the <b>About page&nbsp;<span class="glyphicon glyphicon-info-sign"></span></b> for more information.
</p>
<p>
For the full experience you <strong>must</strong> download a ZIM archive and store it on your device! Alternatively, if you only want Wikivoyage or WikiMed in English, look for "Wikivoyage by Kiwix" or "WikiMed" in the Store and install those apps instead.
</p>
<p>
Kiwix JS is <b>free</b> and <b>open source</b>. If you like it, please leave a positive review. Constructive feedback and help with
improving the app are very welcome: see About section.
</p>
<div id="update" class="update">
<h3 style="margin-top:0;">Changes in version <span class="version">1.0</span></h3>
<ul style="padding-left: 15px;">
<li>Enable Service Worker mode in UWP app</li>
<li>New domain pwa.kiwix.org for PWA version</li>
<li>Preliminary support for ZIM archives with no namespace</li>
<li>Updated Privacy Policy to reflect PWA usage</li>
</ul>
<p><a href="https://github.com/kiwix/kiwix-js-windows/blob/master/CHANGELOG.md" target="_blank">Full changelog...<img src="I/s/Icon_External_Link.png"></a></p>
</div>
<div id="features">
<h3>Features in Version 1.0</h3>
<ul style="padding-left:15px;">
<li>Compatible with Continuum!</li>
<li>Printing the article contents is supported on mobile and desktop</li>
<li>Front page (of ZIM) cached for faster return to home page</li>
<li>Wikivoyage pages (English and German) display map location markers: tap to open Maps app</li>
<li>Last-visited page remembered between sessions (optional)</li>
<li>In-page search / highlighting (search button/Ctrl-F/Alt-F)</li>
<li>Dark-theme for UI and content</li>
<li>Equations typeset with KaTeX if original TeX string is available</li>
<li>Transform layout: Wikipedia mobile or desktop styles</li>
<li>Optionally disable images if device is slow</li>
<li>Export page to view in browser (using breakout link)</li>
</ul>
</div>
</div>
<div class="modal-footer">
<div id="extraModalFooterContent"></div>
<button class="btn btn-primary" type="button" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<div id="printModal" class="modal" tabindex="-1">
<div class="modal-dialog">
<div id="print-modal-content" class="modal-content">
<div class="modal-header">
<button class="close" aria-hidden="true" type="button" data-dismiss="modal">&times;</button>
<h3 style="margin-top:10px;">
Please choose print options
</h3>
</div>
<div class="modal-body">
<label id="printDesktopStyle" class="checkbox">
<input type="checkbox" name="printDesktop" id="printDesktopCheck" checked>
<b>Print the desktop (not mobile) style</b> (<i>default: yes</i>)
</label>
<label id="printNavBoxes" class="checkbox">
<input type="checkbox" name="printNavBox" id="printNavBoxCheck">
<b>Print navigation boxes</b> (<i>default: no</i>)
</label>
<label id="printEndNotes" class="checkbox">
<input type="checkbox" name="printEndNote" id="printEndNoteCheck">
<b>Print endnotes</b> (<i>default: no</i>)
</label>
<label id="externalLinks" class="checkbox">
<input type="checkbox" name="externalLink" id="externalLinkCheck">
<b>Print External Links / Further Reading</b> (<i>default: no</i>)
</label>
<label id="seeAlsoLinks" class="checkbox">
<input type="checkbox" name="seeAlsoLink" id="seeAlsoLinkCheck">
<b>Print See Also</b> (<i>default: no</i>)
</label>
<label id="printInfoboxes" class="checkbox">
<input type="checkbox" name="printInfobox" id="printInfoboxCheck" checked>
<b>Print infoboxes</b> (<i>default: yes</i>)
</label>
<label id="printImages" class="checkbox">
<input type="checkbox" name="printImage" id="printImageCheck" checked>
<b>Print images</b> (<i>default: yes</i>)
</label>
<label oninput="document.getElementById('zoomSliderVal').innerHTML = documentZoomSlider.value + '%';" style="width: 90%;">
<b>Resize document for printing:</b>
<input type="range" name="documentZoom" id="documentZoomSlider" min="10" max="200" step="1" value="75">
Current value: <b><span id="zoomSliderVal">75%</span></b>
</label>
</div>
<div class="modal-footer">
<button name="confirm-print" id="confirm-print-cancel" class="btn btn-warning" style="float:right; margin-left: 1em;" type="button" data-dismiss="modal">Cancel</button>
<button name="confirm-print" id="confirm-print-continue" class="btn btn-primary" style="float:right; margin-left: 1em;" type="button" data-dismiss="modal">Continue</button>
<p style="text-align:left"><b>Important:</b> This app has limited control over the printer. If there is no option to limit pages, we recommend you choose a PDF or XPS printer, and then print the file with another app.</p>
</div>
</div>
</div>
</div>
<div id="alertModal" class="modal" role="dialog">
<div id="alert-modal" class="modal-dialog modal-sm">
<div id="alert-modal-content" class="modal-content">
<div class="modal-header">
<button class="close" aria-hidden="true" type="button" data-dismiss="modal">&times;</button>
<h4 class="modal-title" style="color:#333333;">Information</h4>
</div>
<div class="modal-body">
<p style="color:#333333;" id="alert-content"></p>
</div>
<div class="modal-footer" style="padding:10px;">
<button id="alert-modal-button" class="btn btn-primary" type="button" data-dismiss="modal">OK</button>
</div>
</div>
</div>
</div>
<!-- Status indicators -->
<div id="searchingArticles" style="display: none;" class="status">
<div class="loader"></div>
<div id="cachingAssets" style="display: none;" class="message"></div>
</div>
<section id="search-article" role="region">
<header id="top" style="width:100%; transition: top 0.3s;">
<nav id="navbar" class="navbar navbar-inverse" style="" role="navigation">
<div class="container-fluid">
<div class="navbar-header" id="container">
<form id="formArticleSearch">
<div class="" id="row">
<span class="input-group">
<span class="input-group-btn">
<!-- button id="btnHome" type="button" class="btn btn-default" -->
<a id="btnHome" title="Home" class="btn btn-primary"><img id="kiwixIcon" style="margin-left:5px;" src="./img/icons/kiwix-blue-32.png" /></a>
<!--button -->
</span>
<input type="search" id="prefix" placeholder="Search or type a space..."
class="form-control" style="z-index: 0; width: 99.5%" />
<span class="input-group-btn">
<a class="btn btn-primary" title="Article Search" id="searchArticles" style="display:none;"><span class="glyphicon glyphicon-book"></span></a>
<a class="btn btn-primary" title="Alt-F: Find and highlight text in article..." id="findText"><span class="glyphicon glyphicon-search"></span></a>
<a class="btn btn-primary" title="Random Article" id="btnRandomArticle"><span class="glyphicon glyphicon-random"></span></a>
<a class="btn btn-primary" title="Settings" id="btnConfigure"><span class="glyphicon glyphicon-wrench"></span></a>
<a class="btn btn-primary" title="About" id="btnAbout" style="margin-right:5px;"><span class="glyphicon glyphicon-info-sign"></span></a>
</span>
</span>
</div>
<div class="" id="row2" style="display:none;">
<span class="input-group" style="padding-bottom: 5px; padding-left: 15px; margin-left: 5px;">
<input class="form-control" id="findInArticle" style="display:inline;" type="search" placeholder="Highlight in article...">
<span class="input-group-addon" id="matches">Full: 0</span>
<span class="input-group-addon" id="partial">Partial: 0</span>
</span>
</div>
</form>
</div>
</div>
</nav>
</header>
<article class="view-content" id="article">
<div id="scrollbox" class="container" style="position:relative;overflow:auto;width:100%;">
<div id="about" style="display: none;" class="category-padding">
<div class="returntoArticle" style="text-align:center;padding-top:30px;"></div>
<h2>
<img src="img/icons/kiwix-60.png" alt="Kiwix icon" id="kiwixIconAbout" />
Kiwix JS Windows
</h2>
<h3 style="margin-top:0;">
Offline Wikipedia Viewer <small>(Version <span class="version"></span>)</small>
</h3>
<p class="packagedInfo" style="display: none">Packaged ZIM archive: <b><span class="fileVersion"></span></b></p>
<ul style="padding-left:1em;">
<li><a href="#addingArchives">Adding archives and languages</a></li>
<li><a href="#changelog">Changelog and Features</a></li>
<li><a href="#expert">Expert or Experimental Settings</a></li>
<li><a href="#privacy">Privacy Policy</a></li>
<li><a href="#feedback">Feedback and Support</a></li>
<li><a href="#credits">Credits and Licence</a></li>
<li>Official site : <a href="https://www.kiwix.org/" target="_blank">https://www.kiwix.org/</a><img src="I/s/Icon_External_Link.png" /></li>
</ul>
<div class="disclaimer">
<p>
<b>DISCLAIMER:</b> Please be aware that Kiwix works with offline archives. To get updated info, you will need to
download a new archive periodically. Information in archives is free, open source and provided by volunteers.<br>
<strong>Kiwix gives no guarantee as to the accuracy of information in the archives you access with this app.</strong>
</p>
</div>
<br>
<p>
If your Internet access is expensive, slow, unreliable, insecure or censored, you can still gain offline access to a huge
repository of knowledge and culture.
</p>
<p>
To use this app, you will need to download one or more archives (called ZIM archives) from the Kiwix website. You will then have
offline access to Wikipedia, Wiktionary, Wikivoyage and many other sources even if you are undertaking a long plane journey, hiking,
and travelling or living in areas with weak Internet access.
</p>
<p>
You can search through article titles and read any of these articles completely offline.
</p>
<p>
You can have the entire content of Wiktionary or Wikipedia in your language (including the images) in your pocket.
</p>
<p>
Offline archives use the <a href="https://www.openzim.org//wiki/OpenZIM" target="_blank">OpenZIM format</a>, but note that this app has been only tested extensively on
Wikipedia-related archives (e.g., Wikipedia, Wikivoyage, Wikimed, Wiktionary).
</p>
<p>
On some Wikivoyage (English and German) pages
you will see a map location marker: <img src="img/icons/map_marker-18px.png" />. Tap this icon to open
the <b>Maps app</b> at the selected location. This will work offline if you have downloaded the map for the relevant country
in the Windows Settings for <b>Offline Maps</b>.
</p>
<h3 id="addingArchives">Usage</h3>
<h4>Step 1: download some content</h4>
<p>
You can browse the Kiwix repository on the <a href="#downloads" onclick="document.getElementById('btnConfigure').click();">Configuration</a> page, and it will provide instructions according to the type of file you download.
Alternatively, visit <a href="https://download.kiwix.org/zim" target="_blank">https://download.kiwix.org/zim/</a> using a regular computer.
<strong>Currently only Wikimedia contents (ZIM files in wiki* subdirectories) and Stackexchange have been tested fully</strong>.
There are known bugs when reading some other content, and dynamic content is not supported in jQuery mode.
You may need to switch the app to the experimental PWA mode (see Expert Settings in configuration) to access dynamic content.
</p>
<p>
If you have enough space, you can put several archives on your device storage. If you download the content
directly in the app, note the location of the saved file when you get the notification that it has
completed. If you downloaded via a PC, you will generally need to use a USB cable to copy the ZIM
archive(s) to an accessible location on your device, such as the SD card or the main storage area if
there is enough space there.
</p>
<h4>Step 2: copy the content onto your device</h4>
<p>
If you have enough space, you can put several archives on your device storage. If you download the content directly in the app, note the location
of the saved file when you get the notification that it has completed. If you downloaded via a PC, you will generally need to use a USB
cable to copy the ZIM archive(s) to an accessible location on your device, such as the SD card or the main storage area if there is enough
space there.
</p>
<h4>Step 3: go to the "Configure" menu and select your ZIM file (or double-click / drag-and-drop your file into the app)</h4>
<p>
On the Configuration page, tap the "Select storage" button. If you have downloaded more than one archive, or you have a
split ZIM archive consisting of several 2GB files, then you will need to pick the <b>folder</b> that contains these files
or else (in older browsers) you will need to select all the split parts. If you have just one unsplit ZIM archive, you
can instead pick the <b>file</b> directly, using the respective buttons on the
<a href="#" onclick="document.getElementById('btnConfigure').click();">Configuration</a> page (note that these buttons
only appear after you tap "Select Storage"). In most modern contexts the archive will be remembered on next launch
(Firefox and IE11 are exceptions).
</p>
<p>
Alternatively, in the UWP app you can simply <b>double-click</b> the ZIM file to launch it in the app, even if the app
is closed (your choice will be remembered on next launch). You can also <b>drag-and-drop</b> your ZIM file into the app,
but it may not be remembered on next launch in all contexts (try it if this method interests you!).
</p>
<h4>Step 4: enjoy your content offline!</h4>
<h3 id="changelog">Changes in <span class="version">0.9</span></h3>
<div id="logUpdate" class="update"></div>
<div id="logFeatures"></div>
<h3 id="privacy">Privacy policy</h3>
<p>
When installed, Kiwix JS Windows works offline, and does not collect or record any of your personal data. It
only remembers your browsing history for the duration of a session (for the purpose of returning to previously
viewed pages). This history is lost on exiting the app with the optional exception of the last-visited page.
</p>
<p>
If you access this app from a secure web server (e.g. the PWA server), it will only work offline if your browser is
capable of installing a Service Worker. If you install or bookmark the PWA version, then it will work offline, but
note that <b>by design</b> any PWA will periodically check the PWA server (in this case, https://pwa.kiwix.org/), if it
is available, to check for an updated Service Worker.
</p>
<p>
By default, this application will remember your last-visited page for each ZIM between sessions using local storage
or a cookie that is accessible only by this app on this device. If you are accessing sensitive information that you do
not wish to be displayed next time you open this app, we recommend that you <a href="#privacy"
onclick="document.getElementById('btnConfigure').click();">turn this option off</a> in the Configuration options.
</p>
<p>
This application only reads the archive files that you explicitly select on your device and files included in
its own package: it is not capable of reading any other files. It will only access the Kiwix download server if
you specifically request it to access the download library for ZIM archives on the Configuration page. If you
run the app as a PWA, it will cache its own code from the secure PWA server and then can be used offline.
Some ZIM archives contain active content (scripts) which may, in rare circumstances, attempt to
contact external servers for incidental files such as fonts. These scripts will only run if you enable Service
Worker mode in Configuration.
</p>
<p>
<b>
If you believe your Internet access is insecure, or is being observed or censored, we recommend that you completely
shut down your Internet access (Data or WiFi) before using the application.
</b>
</p>
<p>
Additionally, if you obtained this app from a Vendor Store (including extensions), then the Store operator may
track your usage of the app (e.g. download, install, uninstall, date and number of sessions) for the purpose of
providing anonymous, aggregate usage statistics to developers. If this concerns you, you should check the relevant
Store Privacy Policy for further information.
</p>
<p>
<b>Builds of this app are available that do not use a Store or an online Service Worker.</b> Please see:
<ul>
<li><a href="https://github.com/kiwix/kiwix-js-windows/releases">Releases</a></li>
<li><a href="https://kiwix.github.io/kiwix-js-windows/kiwix-js-nwjs.html">NWJS version</a> - this version is completely standalone and will never self-update.</li>
</ul>
</p>
<h3 id="expert">Expert or experimental settings</h3>
<p>
Depending on your browser or framework, this app may be capable of running in two different modes, which we call
"JQuery Mode" and "ServiceWorker Mode" for short. There is a toggle under Expert Settings
in Configuration. Here is an explanation of what these modes do:
<ul>
<li>
<b>JQuery Mode</b>: This mode (which does not in fact require JQuery) is fine for everyday use with
Wikipedia / WikiMedia archives, and is stable and safe. It is a way of inserting articles extracted from the
ZIM into the DOM (browser document) by injecting the content into an iframe or tab. We then use
native DOM methods, or sometimes JQuery, to parse the article's HTML and insert required assets
(images, stylesheets, event listeners for hyperlinks, etc.). On old devices DOM traversal can be slow,
but it is compensated for because we do not extract or run JavaScript assets (which would be technically
extremely complicated). As a result, for WikiMedia archives this mode is usually quite fast. On the downside,
ZIMs that have a proprietary dynamic UI (such as Gutenberg or TED talks) are only partially supported in this
mode: the UI does not work, but articles can be searched for and loaded from the search bar.
</li>
<li>
<b>ServiceWorker Mode</b>: This mode, as its name implies, requires that the browser or framework be capable of
installing a Service Worker. It works by intercepting the browser or framework's Fetch calls (network requests)
and supplying the requested content from the ZIM. This mode requires no DOM traversal, and the content is
read and supplied as-is from the archive. Dynamic content (e.g. JavaScript) and proprietary UIs are fully
supported in this mode. It can feel initially a little slower while commonly used assets are being cached,
but it soon equals JQuery mode in speed, at least in modern browsers. However, older browsers such as IE11 do
not support this mode, and the app must be running in a secure context (https:, localhost, or certain browser
extensions). Note that this mode also cannot run under the file: protocol (but only IE11 and old Edge allow the
app to run this way).
</li>
</ul>
</p>
<h3 id="feedback">Feedback / helping / contributing</h3>
<p>
This application is still a work in progress. There are bugs that still need fixing and improvements that
need to be implemented. Suggestions and patches/pull requests are welcome: the source code is on
<a href="https://github.com/kiwix/kiwix-js-windows" target="_blank">github</a>.
The <a href="https://github.com/kiwix/kiwix-js-windows/issues" target="_blank">Kiwix JS Windows issue tracker</a>
is on GitHub too, though also check the <a href="https://github.com/kiwix/kiwix-js/issues"
target="_blank">tracker for Kiwix JS</a> as a lot of the development is done for both apps.
</p>
<p>
Alternatively, you can send your feedback <a href="mailto:egk10@cam.ac.uk?subject=%5BKiwix%5D%20Feedback%20about%20Kiwix-JS-Windows">
by email
</a>.
</p>
<p>
In all cases, please give as much detail as you can: which device you are using, which version of Kiwix, which archive, which articles etc.
</p>
<p>If you like the Kiwix project and use it, please consider giving donations:</p>
<ul>
<li>to the Wikimedia foundation, to help maintaining their servers and article contents. See the <a href="https://donate.wikimedia.org/" target="_blank">donation page</a></li>
<li>to Kiwix, to help maintaining the ZIM files and applications. There is a donation button in the <a href="https://www.kiwix.org" target="_blank">home page of kiwix.org</a></li>
</ul>
<p>You can also help by:</p>
<ul>
<li>Adding articles or improving the existing ones, by <a href="https://en.wikipedia.org/wiki/Wikipedia:Introduction" target="_blank">editing online Wikipedia articles</a></li>
<li><a href="https://www.kiwix.org/wiki/Special:MyLanguage/Participate" target="_blank">Participating</a> in the Kiwix project</li>
</ul>
<h3 id="credits">Credits</h3>
<p>Thanks are due to:</p>
<ul>
<li>Kelson and all the Kiwix community for welcoming peter-x, mossroy, jaifroid and sharun-s onto this project</li>
<li>Wikipedia teams and contributors for helping to spread knowledge to everybody</li>
<li>All the developers of libraries and tools we use for releasing them as Free software (see Licence paragraph)</li>
</ul>
<h3>Licence information</h3>
<p>
Copyright 2013-2019 Mossroy, Peter-x, Jaifroid, sharun-s and other contributors
<br />Jaifroid for adaptation and development of the app on the Universal Windows Platform
<br />
<br />This application is licensed under the GPL v3 licence:
<br />
<i>
<br />Kiwix is free software: you can redistribute it and/or modify
<br />it under the terms of the GNU General Public Licence as published by
<br />the Free Software Foundation, either version 3 of the Licence, or
<br />(at your option) any later version.
<br />
<br />Kiwix is distributed in the hope that it will be useful,
<br />but WITHOUT ANY WARRANTY; without even the implied warranty of
<br />MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
<br />GNU General Public Licence for more details.
<br />
<br />You should have received a copy of the GNU General Public Licence
<br />along with Kiwix (file LICENSE-GPLv3.txt). If not, see <a href="https://www.gnu.org/licenses/" target="_blank">https://www.gnu.org/licenses/</a>
</i>
</p>
<p>Main libraries and resources used:</p>
<ul>
<li><a href="https://jquery.com/" target="_blank">jQuery</a> 3, released under the <a href="https://jquery.org/license" target="_blank">MIT Licence</a></li>
<li><a href="https://getbootstrap.com/" target="_blank">Bootstrap</a> 3, released under the <a href="https://www.apache.org/licenses/LICENSE-2.0" target="_blank">Apache Licence 2.0</a>, which includes icons from <a href="https://glyphicons.com/">Glyphicons</a></li>
<li><a href="https://requirejs.org/" target="_blank">RequireJS</a> 2, released under the <a href="https://github.com/jrburke/requirejs/blob/master/LICENSE" target="_blank">MIT licence or new BSD Licence</a></li>
<li><a href="https://qunitjs.com/" target="_blank">QUnit</a> 2, released under the <a href="https://jquery.org/license" target="_blank">MIT Licence</a></li>
<li>Kiwix logo from <a href="https://www.kiwix.org/" target="_blank">kiwix.org</a>, released under the <a href="https://creativecommons.org/licenses/by-sa/3.0/" target="_blank">Creative Commons Attribution Share Alike Licence</a></li>
<li>OpenZIM specifications from <a href="https://wiki.openzim.org/wiki/OpenZIM" target="_blank">www.openzim.org</a>, released under the <a href="https://creativecommons.org/licenses/by-sa/3.0/" target="_blank">Creative Commons Attribution Share Alike Licence</a></li>
<li>Emscripten to generate a XZ decompressor in javascript : <a href="https://github.com/kripken/emscripten" target="_blank">https://github.com/kripken/emscripten</a>, released under the <a href="https://github.com/kripken/emscripten" target="_blank">MIT Licence</a></li>
<li><a href="https://tukaani.org/xz/embedded.html" target="_blank">XZ Embedded</a> (the XZ library converted to Javascript with Emscripten), in public domain</li>
<li>The <a href="https://github.com/facebook/zstd" target="_blank">Zstandard library</a>, released under a <a href="https://github.com/facebook/zstd/blob/dev/LICENSE" target="_blank">BSD Licence</a> and a <a href="https://github.com/facebook/zstd/blob/dev/COPYING" target="_blank">GPLv2 Copying Licence</a></li>
<li><a href="https://katex.org/" target="_blank">KaTeX</a> for typesetting mathematical and chemical equations, released under the <a href="https://github.com/KaTeX/KaTeX/blob/master/LICENSE" target="_blank">MIT licence</a></li>
<li><a href="https://www.the-art-of-web.com/javascript/search-highlight/" target="_blank">Hilitor</a> for finding and hilighting text inside an article, released under <a href="https://www.the-art-of-web.com/copyright.html" target="_blank">this licence</a></li>
</ul>
<h3>Other platforms/versions</h3>
<p>Other Kiwix clients exist on various platforms. See the official site : <a href="https://www.kiwix.org/" target="_blank">https://www.kiwix.org/</a>.</p>
<p>&nbsp;</p>
<div class="returntoArticle" style="text-align:center;"></div>
<p>&nbsp;</p>
<p>&nbsp;</p>
</div>
<div id="configuration" style="display: none;" class="container category-padding">
<div id="returntoArticle" class="returntoArticle" style="text-align:center;padding-top:30px;"></div>
<div id="divInstall2" style="display:none; float:right;">
<button id="btnInstall2" class="btn btn-xs btn-primary">Install PWA</button>
</div>
<div class="row" style="padding-bottom:1em;">
<h2 style="margin-top:0;">Configuration</h2>
<div id="alertBoxPersistent"></div>
<p class="packagedInfo" style="display: none;">
Packaged ZIM archive: <b><span class="fileVersion"></span></b>
<button style="display:none;" id="reloadPackagedArchive" type="button" class="btn btn-primary btn-xs">Reload</button>
</p>
<p id="currentArchive" style="display: none;"></p>
<p id="downloadLinksText">
<a id="otherLangs" href="#btnRescanDeviceStorage"><i>Download more archives from the <b>Archive Library</b>.</i></a>
</p><p></p>
<p id="moreInfo">For more information see <a href="#" onclick="document.getElementById('btnAbout').click();">About tab <span class="glyphicon glyphicon-info-sign"></span></a> (top right)<br><br></p>
</div>
<div id="hideFileSelectors">
<div id="scanningForArchives" style="display: none;">
<br /> Scanning for archives... Please wait <img src="img/spinner.gif" alt="Please wait..." />
</div>
<div id="chooseArchiveFromLocalStorage" style="display: none;">
<div id="archivesFound" class="row">
<p><span id="archiveNumber">Archives found on this device (tap "Select storage" to rescan)</span>:</p>
<div class="col-xs-12">
<select id="archiveList" class="form-control" multiple></select><br />
</div>
</div>
<div id="noZIMFound" style="display: none;">
<p style="color: red;">There were no ZIM file(s) found in the selected location! Please choose a different folder.</p>
</div>
<div id="openLocalFiles" style="display: block;">
<div class="row">
<div class="col-xs-6">
<input type="button" class="btn btn-primary" value="Select file" id="archiveFile" accept=".zim" />
</div>
<div class="col-xs-6">
<input type="button" class="btn btn-primary" value="Select folder" id="archiveFiles" accept=".zim,.dat,.idx,.txt,.zimaa,.zimab,.zimac,.zimad,.zimae,.zimaf,.zimag,.zimah,.zimai,.zimaj,.zimak,.zimal,.zimam,.ziman,.zimao,.zimap,.zimaq,.zimar,.zimas,.zimat,.zimau,.zimav,.zimaw,.zimax,.zimay,.zimaz, .zimba, .zimbb, .zimbc, .zimbd, .zimbe, .zimbf, .zimbg, .zimbh, .zimbi, .zimbj, .zimbk, .zimbl, .zimbm, .zimbn, .zimbo, .zimbp, .zimbq, .zimbr, .zimbs, .zimbt, .zimbu, .zimbv, .zimbw, .zimbx, .zimby, .zimbz" />
</div>
</div>
<div id="UWPInstructions" class="row">
<div class="col-xs-6">
<p>For a single unsplit archive</p>
</div>
<div class="col-xs-6">
<p>For multiple or split archives</p>
</div>
</div>
<div id="instructions" class="row" style="display:none;">
<p>
Please choose the location of your ZIM archive or drag-and-drop the file(s) here.<br />
For a split archive (.zimaa, .zimab, etc.) you must select <b>all</b> the split parts.
</p>
</div>
<div class="row">
<input style="display:none;" type="file" class="btn btn-primary" value="Select folder with ZIM files" id="archiveFilesLegacy" multiple accept=".zim,.dat,.idx,.txt,.zimaa,.zimab,.zimac,.zimad,.zimae,.zimaf,.zimag,.zimah,.zimai,.zimaj,.zimak,.zimal,.zimam,.ziman,.zimao,.zimap,.zimaq,.zimar,.zimas,.zimat,.zimau,.zimav,.zimaw,.zimax,.zimay,.zimaz, .zimba, .zimbb, .zimbc, .zimbd, .zimbe, .zimbf, .zimbg, .zimbh, .zimbi, .zimbj, .zimbk, .zimbl, .zimbm, .zimbn, .zimbo, .zimbp, .zimbq, .zimbr, .zimbs, .zimbt, .zimbu, .zimbv, .zimbw, .zimbx, .zimby, .zimbz" />
</div>
<div class="row">
<div class="col-xs-12">
<p style="padding-top:0.5em;"><strong>Only Wikimedia contents (wiki*.zim* files)</strong> have been tested well with this app.</p>
</div>
</div>
</div>
<div id="rescanStorage" style="display:none;" class="row">
<div class="col-xs-12">
<table>
<tr>
<td><input style="float:left; margin-right:1em;" type="button" class="btn btn-primary" value="Select storage" id="btnRescanDeviceStorage" /></td>
<td style="width:100%;">Tap to select app's local storage or to select a file or folder. <b>You can also drag and drop a ZIM file into the app.</b></td>
</tr>
</table>
</div>
</div>
</div>
<div id="downloads">
<div class="row">
<h3>Download library</h3>
<div id="libraryArea" class="col-xs-12">
<p>
Get more ZIM archives here. Archives can be very large, <b>do not attempt to download using mobile data!</b>
</p>
<table>
<tr>
<td><input id="downloadTrigger" type="button" class="btn btn-primary" value="Open library" style="float:left; margin-right:1em;" /></td>
<td style="width:100%;">Opens library of archives for download:<br /><i>Warning:</i> this will use data</td>
</tr>
</table>
<label class="checkbox">
<input type="checkbox" name="allowInternetAccess" id="allowInternetAccessCheck">
<span class="checkmark"></span>
<b>Allow Internet access?</b>
</label>
</div>
<div id="downloadLinks" style="display: none;"></div>
<pre id="serverResponse" class="panel-footer" style="display:none;"></pre>
</div>
</div>
</div>
<div>
<div class="row">
<h3>Display settings</h3>
<div class="column">
<div id="displayThemeDiv" class="panel panel-info" style="clear: left;">
<div class="panel-heading">Dark mode:</div>
<div class="panel-body">
<label class="checkbox" title="Tap three times for dark | auto | light">
<input type="checkbox" name="cssUIDarkTheme" id="cssUIDarkThemeCheck">
<span class="checkmark"></span>
<b>Set dark mode for User Interface</b>: [ <b><span id="cssUIDarkThemeState"></span></b> ] (<i>auto</i> mode uses UWP system Settings if available)
</label>
<label class="checkbox" title="Tap three times for dark | auto | light">
<input type="checkbox" name="cssWikiDarkTheme" id="cssWikiDarkThemeCheck">
<span class="checkmark"></span>
<b>Set dark theme for articles</b>: [ <b><span id="cssWikiDarkThemeState"></span></b> ] (<i>experimental</i>: tested with Wikimedia ZIMs)
</label>
<label id="darkInvert" style="display:none;" class="checkbox">
<input type="checkbox" name="cssWikiDarkThemeInvert" id="cssWikiDarkThemeInvertCheck">
<span class="checkmark"></span>
<b>Use simple inversion for dark theme</b> (should work with all archive types)
</label>
</div>
</div>
<div class="panel panel-info" id="cssSettingsDiv">
<div class="panel-heading">Display style:</div>
<div class="panel-body">
<label class="radio">
<input name="cssInjectionMode" id="cssModeAutoRadio" type="radio" value="auto">
<span class="radiobtn"></span>
<b>Select style automatically</b> (<i>recommended</i>: matches the ZIM style)
</label>
<label class="radio">
<input name="cssInjectionMode" id="cssModeDesktopRadio" type="radio" value="desktop">
<span class="radiobtn"></span>
<b>Use Wikimedia desktop style</b> (and transform if necessary)
</label>
<label class="radio">
<input name="cssInjectionMode" id="cssModeMobileRadio" type="radio" value="mobile">
<span class="radiobtn"></span>
<b>Use Wikimedia mobile style</b> (and transform if necessary)
</label>
<label class="checkbox" title="Tap three times for always | auto | never">
<input name="pageMaxWidth" id="removePageMaxWidthCheck" type="checkbox" value="false">
<span class="checkmark"></span>
<b>Remove max page width restriction</b>: [ <b><span id="pageMaxWidthState"></span></b> ] (useful for recent Wikipedia archives)
</label>
</div>
</div>
<div class="panel panel-info" id="displaySettingsDiv">
<div class="panel-heading">Display options:</div>
<div class="panel-body">
<label class="checkbox">
<input type="checkbox" name="hideToolbars" id="hideToolbarsCheck" title="Tap three times for both | top | never">
<span class="checkmark"></span>
<b>Hide toolbars while scrolling:</b> [ <b><span id="hideToolbarsState"></span></b> ] (scroll slightly up to reveal)
</label>
<label oninput="document.getElementById('spinnerVal').innerHTML = relativeUIFontSizeSlider.value + '%';" style="width: 80%;">
<b>Change font size for the User Interface:</b>
<input type="range" name="relativeUIFontSize" id="relativeUIFontSizeSlider" min="60" max="200" step="1" value="100">
Current value: <b><span id="spinnerVal">100%</span></b><br />
(to change <b>article</b> font size, tap <span class="glyphicon glyphicon-zoom-in"></span> and <span class="glyphicon glyphicon-zoom-out"></span>)
</label>
<label class="checkbox">
<input type="checkbox" name="cssCacheMode" id="cssCacheModeCheck">
<span class="checkmark"></span>
<b>Use locally cached display styles</b> (<i>recommended</i> for Wikipedia ZIM)
</label>
<label class="checkbox">
<input type="checkbox" name="imageDisplayMode" id="imageDisplayModeCheck">
<span class="checkmark"></span>
<b>Display images if any</b> (if hidden, tap the <span style="background-color:lightblue; color:black;">&nbsp;blue area&nbsp;</span> to display one-by-one)
</label>
<label class="checkbox">
<input type="checkbox" name="hideActiveContentWarning" id="hideActiveContentWarningCheck">
<span class="checkmark"></span>
<b>Permanently hide active content warning</b> (for experienced users)
</label>
<label class="text">
<b>Start character</b> of alphabet:
<input type="text" name="alphaChar" id="alphaCharTxt" value="A" style="width:2em;color:steelblue;">
(use capital letters if they exist in your locale)<br />
<b>End character</b> of alphabet:&nbsp;&nbsp;
<input type="text" name="omegaChar" id="omegaCharTxt" value="Z" style="width:2em;color:steelblue;">
(these are used to set appropriate alphabet for the Archive Index)
</label>
<label class="text">
<b>Set max number of search results</b> to display:
<input type="text" name="maxResults" id="maxResults" value="20" style="width:2em;color:steelblue;">
(higher number will result in slower search performance)
</label>
<label class="checkbox">
<input type="checkbox" name="allowHTMLExtraction" id="allowHTMLExtractionCheck">
<span class="checkmark"></span>
<b>Enable opening articles in a separate browser tab</b> (slightly increases app's memory usage)
</label>
<label class="checkbox">
<input type="checkbox" name="openAllSections" id="openAllSectionsCheck">
<span class="checkmark"></span>
<b>Open all headings</b> (<i>for WikiMedia ZIMs</i>: sets the state of collapsible headings on article load)
</label>
</div>
</div>
</div>
</div>
</div>
<div class="returntoArticle" style="text-align:center;"></div>
<div>
<div class="row">
<h3 id="privacy">Privacy settings</h3>
<div class="column">
<div class="panel panel-warning" style="min-width:16em;" id="dataPersistence">
<div class="panel-heading">Persistence of data:</div>
<div class="panel-body">
<label class="checkbox">
<input type="checkbox" name="rememberLastPage" id="rememberLastPageCheck">
<span class="checkmark"></span>
<b>Reopen last-visited page</b> on next app launch
</label>
</div>
</div>
</div>
</div>
</div>
<div>
<div class="row">
<h3>Expert settings</h3>
<div class="column">
<div class="panel panel-warning" style="min-width:16em; display: none;" id="packagedAppFileSelectors">
<div class="panel-heading">Display hidden ZIM archive selectors:</div>
<div class="panel-body">
<label class="checkbox">
<input type="checkbox" name="displayFileSelectors" id="displayFileSelectorsCheck">
<span class="checkmark"></span>
<b>Display selectors</b> for files and folders : <i>This is for downloading other ZIM archives</i>.
</label>
</div>
</div>
<div class="panel panel-warning" style="min-width:16em;" id="mathsProcessingMode">
<div class="panel-heading">Mathematical and chemical equations and symbols:</div>
<div class="panel-body">
<label class="radio">
<input type="radio" name="useMathJax" id="useMathJaxRadioTrue" value="true">
<span class="radiobtn"></span>
<b>Typeset TeX equations with KaTeX</b> (<i>recommended</i>: very fast, but not all symbols may be supported in all languages; will use SVG fallbacks if TeX string not available)
</label>
<label class="radio">
<input type="radio" name="useMathJax" id="useMathJaxRadioFalse" value="false">
<span class="radiobtn"></span>
<b>Use SVG fallback images</b> (very slow and memory hungry, but will dislplay all symbols)
</label>
</div>
</div>
<div class="panel panel-danger" id="contentInjectionModeDiv">
<div class="panel-heading">Content injection mode</div>
<div class="panel-body">
<p>See <a href="#expert" id="modesLink">About (Expert Settings)</a> for an explanation of the difference between these modes:</p>
<label class="radio">
<input type="radio" name="contentInjectionMode" value="jquery" id="jQueryModeRadio" checked>
<span class="radiobtn"></span>
<strong>JQuery</strong> (stable and safe)
</label>
<label class="radio">
<input type="radio" name="contentInjectionMode" value="serviceworker" id="serviceworkerModeRadio">
<span class="radiobtn"></span>
<strong>ServiceWorker</strong> (not available on all platforms, but supports more ZIM files)
</label>
</div>
</div>
<div class="panel panel-warning" id="apiStatusDiv">
<div class="panel-heading">API Status</div>
<div class="panel-body">
<div id="serviceWorkerStatus"></div>
<div id="messageChannelStatus"></div>
</div>
</div>
</div>
</div>
</div>
<div class="returntoArticle" style="text-align:center;"></div>
<br />
<br />
<br />
</div>
<div id="welcomeText" class="container category-padding">
You can search the content of your ZIM archive by typing in the above search field.
<br />It will suggest articles starting with the letters you type.
</div>
<!-- List of articles matching the typed prefix -->
<div id="articleListWithHeader" style="display: none;" class="container">
<span id="articleListHeaderMessage"></span>
<div id="articleList" class="list-group">
</div>
</div>
</div>
<!-- Bootstrap alert box -->
<div id="alertBoxHeader" style="text-align: center; position: relative; z-index: 1; display: none;"></div>
<!-- Attribute nwdisable prevents scripts in iframe accessing the nwjs node APIs -->
<iframe id="articleContent" class="articleIFrame" nwdisable></iframe>
</article>
<footer id="footer">
<!-- Bootstrap alert box -->
<div id="alertBoxFooter"></div>
<div id="divInstall1" style="display:none">
Install app on this device?
<button id="btnInstall1" class="btn btn-xs btn-primary">Now</button>
<button id="btnLater" class="btn btn-xs btn-primary">Later</button>
</div>
<div id="navigationButtons" class="btn-group btn-group-justified">
<div class="row">
<a class="btn btn-default col-xs-2" id="btnHomeBottom" title="Home"><span class="glyphicon glyphicon-home"></span></a>
<a class="btn btn-default col-xs-1" id="btnBack" title="Back"><span class="glyphicon glyphicon-circle-arrow-left"></span></a>
<a class="btn btn-default col-xs-1" id="btnForward" title="Forward"><span class="glyphicon glyphicon-circle-arrow-right"></span></a>
<div class="dropup">
<a href="#" class="btn btn-default dropdown-toggle col-xs-4" role="button" id="dropup" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<b>&nbsp;ToC&nbsp;</b>
<span class="caret"></span>
</a>
<ul id="ToCList" class="dropdown-menu" style="overflow-y:auto;"></ul>
</div>
<a class="btn btn-default col-xs-1" id="btnZoomout" title="Zoom out"><span class="glyphicon glyphicon-zoom-out"></span></a>
<a class="btn btn-default col-xs-1" id="btnZoomin" title="Zoom in"><span class="glyphicon glyphicon-zoom-in"></span></a>
<span class="label label-default" id="lblZoom"></span>
<a class="btn btn-default col-xs-2" id="btnTop" title="Top" href="#top"><span class="glyphicon glyphicon-arrow-up"></span></a>
</div>
</div>
</footer>
</section>
<!-- Using require.js, a module system for javascript, include the
js files. This loads "main.js", which in turn can load other
files, all handled by require.js:
https://requirejs.org/docs/api.html#jsfiles -->
<script type="text/javascript"
data-main="js/init.js"
src="js/lib/require.js">
</script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink