rejetto forum

Responsive small screen template

Chris Harris · 154 · 188045

0 Members and 2 Guests are viewing this topic.


Offline LeoNeeson

  • Tireless poster
  • ****
    • Posts: 859
  • Status: On hiatus       (sporadically here)
    • View Profile
    • twitter.com/LeoNeeson
Results:
mobil-light_wo_picV3.5  Works nicely!
mobil-light_V3.7 thumb code missing, display quirk.  Not a standalone template?
mobil-light_V4.1beta mostly blank screen.  Not a standalone template?
mobil-light_V4.2beta mostly blank screen.  Not a standalone template?
I agree with you danny, most templates done by dj are great, but most of them are not standalone templates (in most cases, they are only 'diff templates' of the default template). As my suggestion, I hope dj could in the future release also standalone templates, since this way is much more easier to see the final results to the end-user. ;)
HFS in Spanish (HFS en Español) / How to compile HFS (Tutorial)
» Currently taking a break, until HFS v2.4 get his stable version.


Offline dj

  • Tireless poster
  • ****
    • Posts: 291
  • 👣 🐾
    • View Profile
    • PWAs
@danny, Add hfs.filelist.tpl from zip to folder, that contains hfs.exe
« Last Edit: March 13, 2019, 09:29:05 AM by dj »


Offline LeoNeeson

  • Tireless poster
  • ****
    • Posts: 859
  • Status: On hiatus       (sporadically here)
    • View Profile
    • twitter.com/LeoNeeson
I think that I have not installed it right.
The best thing you can do (to let one of us help you out), is use either LICEcap, ScreenToGif (both Open Source) or GifCam (Freeware), to record your template install procedure, and then upload the resulting GIF to Imgur or any other image hosting (and obviously posting the results here on the forum). This way, we can help you out installing the template (and see if you are doing some mistake when installing it). ;)
HFS in Spanish (HFS en Español) / How to compile HFS (Tutorial)
» Currently taking a break, until HFS v2.4 get his stable version.


Offline dj

  • Tireless poster
  • ****
    • Posts: 291
  • 👣 🐾
    • View Profile
    • PWAs
changelog: better readable code, added delete and sort and logout(Edge)
viewthumbs addon included, works also with dnd_upload and searchcategorie addon
 and audioplayerlight and pictureviewer (wrap script in function addon and set compatible=1)

dark_theme sets dark mode by OS and will work with FF67 and Safari 12.1-TP (untested  ;))
languages_addon works also with hfs2.4 (language-files)
« Last Edit: March 24, 2019, 11:09:48 AM by dj »


Offline dj

  • Tireless poster
  • ****
    • Posts: 291
  • 👣 🐾
    • View Profile
    • PWAs
preload addon preloads subfolders
 and shows number files in subfolders

audioplayer changelog: show duration
« Last Edit: March 24, 2019, 08:19:39 AM by dj »


Offline dj

  • Tireless poster
  • ****
    • Posts: 291
  • 👣 🐾
    • View Profile
    • PWAs
changelog: added archive
« Last Edit: April 02, 2019, 02:40:56 PM by dj »


Offline dj

  • Tireless poster
  • ****
    • Posts: 291
  • 👣 🐾
    • View Profile
    • PWAs
a new theme  ;)

V4.4.2 viewthumbs addon updated: thumbs must have the same name (frag_bunny.mp4 or frag_bunny.mp4.jpg)
« Last Edit: April 05, 2019, 06:06:44 AM by dj »


Offline LeoNeeson

  • Tireless poster
  • ****
    • Posts: 859
  • Status: On hiatus       (sporadically here)
    • View Profile
    • twitter.com/LeoNeeson
a new theme  ;)
I know this template 'mobil-light_V4.4.2beta.zip' is intended for ultra-modern browsers, but it doesn't work on some older browsers, like Chromium 31. When browsing http://127.0.0.1/ it redirects to http://127.0.0.1/~files.lst showing this result:

Code: [Select]
#04/04/2019 22:52:06,0
some-folder-here/
#,1

On Firefox v52 works almost fine (and it's super-fast! :D ), but on older browsers is not usable at all (I guess it needs some compatibility-fix). Just a suggestion... ;)
HFS in Spanish (HFS en Español) / How to compile HFS (Tutorial)
» Currently taking a break, until HFS v2.4 get his stable version.


Offline dj

  • Tireless poster
  • ****
    • Posts: 291
  • 👣 🐾
    • View Profile
    • PWAs
thanks for review

yes,
version 4 is written for modern browsers (>97%),
version 3 should be compatible with older browsers
« Last Edit: April 07, 2019, 08:53:32 AM by dj »


Offline LeoNeeson

  • Tireless poster
  • ****
    • Posts: 859
  • Status: On hiatus       (sporadically here)
    • View Profile
    • twitter.com/LeoNeeson
Now it works beautifully on old browsers! 8) (with some details)

Design/Layout .... Okay.
Search function .. OK, it works.
Login function ... OK, works fine.
Archive button ... No, it does nothing.
Delete button .... No, it doesn't delete.
Upload button .... No, nothing gets uploaded.

» Summarizing: the 'archive', 'delete' and 'upload' button doesn't work on the 'oldbrowsers.tpl' version (I already know that file selection is done clicking on the time-stamp, but even selecting a file or folder those buttons doesn't work). Otherwise than that, great work!... :)

» Researching: I noticed you used 'XMLHttpRequest GET' instead of 'fetch' to add support to legacy/old browsers. This is great, but doing this you have to release a special version for old browsers every time. My main idea/suggestion was using a 'polyfill', and after doing a search, I've found THIS:

Code: [Select]
<script src="https://unpkg.com/unfetch/polyfill"></script>
I've added that line on your normal 'mobil-light_V4.4.tpl' (you can directly embed THIS file content on your template), and the page loads fine now on old browsers. Using this polyfill the buttons loads okay, but the files and folders are not shown. Perhaps doing some small tweaks, that polyfill can work with your original 'fetch' code (and that way you get the best of both worlds: you can continue using 'fetch', and when 'fetch' is not supported by the browser, that XHR polyfill does the rest).

On my search on internet, I've also found two interesting articles: Why I still use XHR instead of the Fetch API (and how to use a Promise-based XHR). A very nice read, even for 2019 (this blog also has very nice articles!).
HFS in Spanish (HFS en Español) / How to compile HFS (Tutorial)
» Currently taking a break, until HFS v2.4 get his stable version.


Offline dj

  • Tireless poster
  • ****
    • Posts: 291
  • 👣 🐾
    • View Profile
    • PWAs
» Summarizing: the 'archive', 'delete' and 'upload' button doesn't work on the 'oldbrowsers.tpl' version

I forgot to say, you must additional add the hfs.diff_oldbrowser.tpl (or add the script at the end).
I tested it with IE11.
I also forgot to mention, that click on the clock sorts (by date) (should I add some sorting symbol like ↑  ?).

The polyfill doesn't work with IE11 (because  needs Promise is polyfilled of course!)


changelog: works with old browsers
querystringparameter ?update checks for template updates
textedit can also be used for single-comment files
« Last Edit: April 14, 2019, 03:59:46 PM by dj »


Offline LeoNeeson

  • Tireless poster
  • ****
    • Posts: 859
  • Status: On hiatus       (sporadically here)
    • View Profile
    • twitter.com/LeoNeeson
I forgot to say, you must additional add the hfs.diff_oldbrowser.tpl (or add the script at the end).
At least on Chrome 30, the problem continues (it doesn't work those 3 buttons). It's very strange (I'm doing all correct: I'm using 'hfs.diff.tpl' from "oldbrowsers_addon.zip", overwriting the files of 'mobil-light_V4.5.zip').

You can download HERE a portable version of Chrome 30 to make some tests (here you will find more portable versions to make tests). Using Chrome 30, you will see in the console some errors (for example: "Uncaught ReferenceError: del is not defined").

The polyfill doesn't work with IE11 (because  needs Promise is polyfilled of course!)
I didn't know IE11 not had Promises. Perhaps that's why on Chrome 30 fails those 3 buttons: 'archive', 'delete' and 'upload' (since Chrome 30 doesn't support promises).

I've found HERE a extremely lightweight 'Promise Polyfill' that works with IE8+, Chrome, Firefox, IOS 4+, Safari 5+ and Opera. This polyfill makes promises work on browsers that natively doesn't support it...

I've tried modifiying your 'mobil-light_V4.5.tpl' and adding the folowing (marked in red color):
Quote
<body>
<script src="https://cdn.jsdelivr.net/npm/promise-polyfill@8/dist/polyfill.min.js"></script>
<script src="https://unpkg.com/unfetch/polyfill"></script>

<header>

...and now it works on Chrome 30 :) (untested on IE11), but the 'archive', 'delete' and 'upload' buttons continues failing. There must be something else to modify (to make it work with Chrome 30).

Perhaps if you embed the content of those 2 polyfills in your code (and do some small tweaks), you can make only one version that works on any browser.
« Last Edit: April 08, 2019, 06:22:10 AM by LeoNeeson »
HFS in Spanish (HFS en Español) / How to compile HFS (Tutorial)
» Currently taking a break, until HFS v2.4 get his stable version.


Offline dj

  • Tireless poster
  • ****
    • Posts: 291
  • 👣 🐾
    • View Profile
    • PWAs
At least on Chrome 30, the problem continues

I tried it with chromium 30 and I found, when you in windows explorer copy hfs.diff.tpl in your root, it don't work (it doesn't load hfs.diff.tpl),
but when you in hfs copy the code from hfs.diff.tpl to properties-diff template it works :)
I don't know why.


« Last Edit: April 20, 2019, 04:24:22 AM by dj »


Offline LeoNeeson

  • Tireless poster
  • ****
    • Posts: 859
  • Status: On hiatus       (sporadically here)
    • View Profile
    • twitter.com/LeoNeeson
I tried it with chromium 30 and I found, when you in windows explorer copy hfs.diff.tpl in your root, it don't work (it doesn't load hfs.diff.tpl),
but when you in hfs copy the code from hfs.diff.tpl to properties-diff template it works :)
I don't know why.
Yes, it's true. I'm glad you also found this error. I've already reported that "hfs.diff.tpl" doesn't work on root HERE, but I didn't get any reply about it. The normal behavior is that "hfs.diff.tpl" should work on root too. I hope Rejetto get attention to this.
HFS in Spanish (HFS en Español) / How to compile HFS (Tutorial)
» Currently taking a break, until HFS v2.4 get his stable version.