en/html5/index.html

   1 <!doctype html>
   2 <html>
   3   <head>
   4     <meta charset="utf-8">
   5     <meta name="viewport" content="width=device-width, initial-scale=1" />
   6
   7     <link rel="stylesheet" href="../style.css#" type="text/css" />
   8     <title>Html5 applications</title>
   9     <script type="text/javascript">
  10       function findLang(){
  11         let href = location.href;
  12         for(let i=href.length-1;i>0;i--){
  13           if('/'==href.charAt(i) && '/'==href.charAt(i-3))
  14             return i;
  15         }
  16         return 0;
  17       }
  18       function nav2(page){
  19         let i = findLang();
  20         location.href = location.href.substring(0,i+1)+page;
  21       }
  22       function nav2Lang(lang){
  23         let i = findLang();
  24         let href = location.href;
  25         location.href = location.href.substring(0,i-2)+lang+location.href.substring(i);
  26       }
  27     </script>
  28   </head>
  29   <body>
  30     <header class='header'>
  31       <a class="logo" href="javascript:void(0)" onclick="return nav2('index.html#')">Home</a> <a class="logo" href="javascript:void(0)" onclick="return nav2('tags/index.html#')">Tags</a>
  32
  33
  34           <a class="logo" href="javascript:void(0)" onclick="return nav2Lang('zh')">简体中文</a>
  35
  36
  37       <nav>
  38       </nav>
  39     </header>
  40     <br />
  41
  42 <div class="container">
  43   <h1 class="title">Html5 applications
  44     <br>
  45     <span class="subtitle"></span>
  46   </h1>
  47   <ul class="tags">
  48
  49   </ul>
  50   <p>This page is for <a href="../index.html#">uweb browser</a>.<br>
  51 Click to install the following html5 apps:<br>
  52 <a target="_self" href="i:0happ/txtview.html:../../zh/searchurl/txt/txtview.html">Huge markdown file viewer</a><br>
  53 <a target="_self" href="i:0happ/mdkatex.html:../../zh/searchurl/txt/mdkatex.html">Huge markdown+katex file viewer (Tex formulas)</a><br>
  54 <a target="_self" href="i:0happ/markdeep.html:../../zh/searchurl/txt/markdeep.html">Huge markdeep file viewer (markdown, latex, diagram,graphviz etc.)</a><br>
  55 <a target="_self" href="i:0happ/plyr.html:../../zh/searchurl/txt/plyr.cfg">plyr video player</a><br>
  56 <a target="_self" href="i:0happ/dplayer.html:../../zh/searchurl/txt/dplayer.html">dplayer video player</a><br>
  57 <a target="_self" href="i:0happ/pdfviewer.html:../../zh/searchurl/txt/pdfviewer.html">pdf viewer</a><br>
  58 <a target="_self" href="i:0happ/epub.html:../../zh/searchurl/txt/epub.html">epub reader (author：llili)</a><br>
  59 <a target="_self" href="i:0happ/djvu.html:../../zh/searchurl/txt/djvu.html">djvu viewer</a></p>
  60 <p>The corresponding menus can be installed with <a href="../urls/index.html#">url services</a>.</p>
  61 <h4 id="features">Features</h4>
  62 <p>The following mentioned subfolders locate in the configuration folder.</p>
  63 <ul>
  64 <li>
  65 <p>The following html5 applications are allowed to read local files referred by &quot;https://local/sdcard/...&quot; where the &quot;/sdcard/..&quot; part is the full path of the file. The below applications <span style="color:red">can auto choose any files as file objects</span>.</p>
  66 <ul>
  67 <li>Locating in a subfolder whose name begins with &quot;app&quot; (such as &quot;appPDF&quot;)</li>
  68 <li>&quot;https://local/...&quot; applications (only possible with the option &quot;<a href="../offlinecache/index.html#">use offline resources</a>&quot; and installed under the folder &quot;sitecache/local/&quot;)</li>
  69 </ul>
  70 </li>
  71 <li>
  72 <p><span style="color:red">All files under the subfolder &quot;app&quot; can be automatically choosed as file objects by any web page</span>.</p>
  73 </li>
  74 <li>
  75 <p><span style="color:red">Local files (including binary files) can be processed by appending &quot;?app=[html5 app url]&quot; to the file urls.</span> Ex. &quot;file:///..../xx.md?app=https://...../app.html&quot; loads &quot;app.html&quot; first, then &quot;app.html&quot; processes the local file.</p>
  76 </li>
  77 </ul>
  78 <p>With the first approach, the html5 application is installed locally and can read any file allowed by the OS; while in the second approach, the html5 application can be either local or remote, and only files under the subfolder &quot;app&quot; can be accessed; The third approach allows easy access of other external resources (ex. local media).</p>
  79 <h4 id="open-local-files-with-html5-apps">Open local files with html5 apps</h4>
  80 <p>Click to configure <a href="../filecap/index.html#">default.filecap</a> to open local files, and to open remote files with the option &quot;custom file handling&quot;:<br>
  81 <a target="_self" href="i:0gdefault.filecap:../../zh/searchurl/txt/filecap.cfg">use pdf.js,djvu.js,epub.js, huge markdown viewer for local files</a></p>
  82 <p>url examples are as follows:</p>
  83 <ul>
  84 <li>file:///data/user/0/info.torapp.uweb/files/app/pdfviewer.html?file=[path].pdf#page=[xxx]</li>
  85 <li>file:///data/user/0/info.torapp.uweb/files/app/djvu.html?url=...xx.pdf#page=[xxx]</li>
  86 <li>file:///data/user/0/info.torapp.uweb/files/app/txtview.html?url=[url]#page=[xxx]</li>
  87 <li>file:///data/user/0/info.torapp.uweb/files/app/txtview.html?url=[url]#offset=[xxxx]&amp;[length]</li>
  88 <li>file:///data/user/0/info.torapp.uweb/files/app/markdeep.html?url=[url]#page=[xxx]</li>
  89 <li>file:///data/user/0/info.torapp.uweb/files/app/markdeep.html?url=[url]#offset=[xxxx]&amp;[length]</li>
  90 </ul>
  91 <p>Ex. &quot;#offset=10000&amp;500&quot; will retrieve 500 bytes from offset 10000. Click the right arrow button to next page in all above file viewers.</p>
  92 <h4 id="configure-html5-app-subfolder-app-optional">Configure html5 app subfolder &quot;app&quot; (optional)</h4>
  93 <p>By default, the subfolder &quot;app&quot; is created by clicking to install any of above html5 applications.</p>
  94 <p>To make file management easier, users can symbolic link the subfolder &quot;app&quot; to any other locations as long as it is readable.</p>
  95 <p>One way to configure &quot;app&quot; subfolder is as follows:</p>
  96 <ul>
  97 <li><a href="i:15d:text/plain:toybox mkdir -p /sdcard/Download/app;toybox ln -s /sdcard/Download/app 2>&1:">Click to copy the command to the address bar</a></li>
  98 <li>Press the home screen button of uweb browser bottom toolbar, so the home screen appears.</li>
  99 <li>If you want &quot;app&quot; to be locations other than &quot;/sdcard/Download/app&quot;, modify as you like.</li>
 100 <li>Press &quot;enter&quot; on the address bar to execute the command.</li>
 101 </ul>
 102 <h4 id="mdict-dictionary-lookup-search-engines">mdict dictionary lookup search engines:</h4>
 103 <p>Note: the following two mdict.html files are different.<br>
 104 i:5ifile:///....../xxx.mdx,xxx.mdd?app=https://cdn.jsdelivr.net/gh/torappinfo/uweb/en/searchurl/mdict/mdict.html#word=%s</p>
 105 <p>in which &quot;/.../xxx.mdx,xxx.mdd&quot; is the full path for the mdict dictionary files.</p>
 106 <p>i:5ihttps://uwebzh.netlify.app/zh/searchurl/txt/mdict.html?file=mdict/xxx.mdx,mdict/xxx.mdd#word=%s</p>
 107 <p>In the above mdict search engine string, the dictionary files (mdx, mdd) must locate in the &quot;app&quot; subfolder under the configuration folder. In above example, the files &quot;xxx.mdx&quot; and &quot;xxx.mdd&quot; locate in the folder &quot;.../app/mdict&quot;.</p>
 108 <p>To make life easier, users can <a href="../acmd/index.html#">link the &quot;app&quot; subfolder</a> to any public accessible folder.</p>
 109 <p>Use the mdx scanning <a href="../bookmark/index.html#">bookmark</a> to add mdict engines automatically, then cold start uweb browser to take effect.</p>
 110
 111 </div>
 112 <p>Last Modified: 2 April 2024<br>
 113 add js function in README<br>
 114 <pre></pre>
 115 </p>
 116
 117 <script id='jsgiscus'
 118   src='https://giscus.app/client.js'
 119   data-repo="torappinfo/uweb"
 120   data-repo-id="MDEwOlJlcG9zaXRvcnkzMDIyMDU3MjE="
 121   data-category="Announcements"
 122   data-category-id="DIC_kwDOEgNLGc4CQjsh"
 123   data-mapping="title"
 124   data-strict="0"
 125   data-reactions-enabled="1"
 126   data-emit-metadata="0"
 127   data-input-position="top"
 128   data-theme="light"
 129   data-lang="en"
 130   data-loading="lazy"
 131   crossorigin="anonymous" async>
 132 </script>
 133
 134     <footer class="site-footer">
 135       <div class="container">
 136         &copy; 2018-2024 Richard H. Cao
 137       </div>
 138     </footer>
 139     <!-- This document is licensed under the GNU Free Documentation License, Version 1.3 or any later version published by the Free Software Foundation; with no Invariant Sections, no Front-Cover Texts, and no Back-Cover Texts. A copy of the license is available at <https://www.gnu.org/licenses/>. -->
 140
 141
 142   </body>
 143 </html>