6 ms·

Just wanted to comment on the usability of directory listings (Apache server?). No javascript bs, no UI frameworks, no SPA garbage, just good ol folder listing

Just wanted to comment on the usability of directory listings (Apache server?). No javascript bs, no UI frameworks, no SPA garbage, just good ol folder listing in HTML. Glorious, fast and shall I say, impeccable? In 2021, this would be a "card" based page, about 6 cards visible, rounded corners, and it would have fucking infinite scroll, ofcourse with spinners to let you know its processing. God, help us. Edit: I should clarify, I like JS for form submission and a few things. If you're building Google Docs competitor, by all means, go for SPA and big JS frameworks. That's what they're designed for.

cdubzzz 6y ago
Eh. It’s pretty terrible on mobile, though. I can’t read or click anything without zooming and a page load for each directory resets the zoom. I would say the content isn’t really relevant for mobile users but the images themselves actually work pretty well on my device. Far better than the site itself.
- systemvoltage 6y ago
  It's actually pretty decent on mobile IMO. Pinch and zoom is easy to do, atleast on the iPhone. Then you just scroll naturally. The entire page doesn't move on you. I agree with you in general, its not great on mobile, but it's not terrible. Far better than hamburger menu'ed UI that I see in the wild that seems to show 1 card at a time and hijacks the scroll mechanism. A lot of "Not designed for mobile" fear stems from early days of smartphones in 2010-era which still lingers today. Things have changed. Screens have gotten much better in resolution, responsiveness has improved and touch experience on modern phones is exceptional.
- asddubs 6y ago
  all they really need is a viewport tag to fix that. Weird that no one has bothered to do that yet, seems like it would be a one line pull request
  - systemvoltage 6y ago
    Thanks. TIL: > "This virtual viewport is a way to make non-mobile-optimized sites in general look better on narrow screen devices." https://developer.mozilla.org/en-US/docs/Web/HTML/Viewport_meta_tag https://developer.mozilla.org/en-US/docs/Web/HTML/Viewport_m...
- ObsoleteNerd 6y ago
  At least for iOS: Double-tap in the white space between the directory links and the dates, it’ll fit to the screen nicely.
- kayson 6y ago
  That's so easy to solve with css. See something like https://github.com/Vestride/fancy-index https://github.com/Vestride/fancy-index Specifically: https://github.com/Vestride/fancy-index/raw/main/after_mobile.png https://github.com/Vestride/fancy-index/raw/main/after_mobil...
  - systemvoltage 6y ago
    I actually find this [1] more readable than this [2]. [1] https://github.com/Vestride/fancy-index/blob/main/before.png https://github.com/Vestride/fancy-index/blob/main/before.png [2] https://github.com/Vestride/fancy-index/blob/main/after.png https://github.com/Vestride/fancy-index/blob/main/after.png It's also not the same directory they're comparing. IMO why add padding? Why change #000000 to some grey text? Just add icons to [1] and you're good to go. May be use Sans-serif fonts if you wanna feel bit ~fancy~.
    - makeworld 6y ago
      If you look at the mobile before and after it becomes more clear why this is useful.
- mgraczyk 6y ago
  I think it's fine. The time it took me to double-tap zoom was less than the time it would have taken for an SPA to load over my weak ass T-Mobile connection
  - rbanffy 6y ago
    The whole website is probably smaller than a minimal React app...
- modeless 6y ago
  I don't know why people are terrified of zooming. Frankly, zooming to use a desktop site is better UX than 90% of mobile sites. All you have to do is ensure your text lines aren't too long, which is good practice anyway. Maybe it's because iOS don't have a one finger zoom gesture like Android? I wonder why Apple never added that one?
  - simonbw 6y ago
    On iOS you can double tap a paragraph to zoom in on it. That’s been around as long as I can remember.
    - modeless 6y ago
      Yeah it was in the first iPhone but you can't control the amount of zoom and it often guesses wrong or just doesn't work. I pretty much gave up on using it. On Android in most apps you can double tap, hold the second tap, then swipe up and down to zoom. It's a lot more natural than it sounds and it gives you precise control over both the zoom location and zoom amount. On iOS you can try the gesture in Maps, and then wonder why they never added it to Safari.
  - paxswill 6y ago
    AA sibling comment mentions double tap to zoom in on a paragraph, but there's also a single finger zoom (tap and hold, then move the held finger vertically) for Maps (and by default in MapBoxGL last I checked).
    - modeless 6y ago
      Yeah, in Android that's been available for a long time in almost all apps that support zooming, not just Maps. Most critically, Chrome.
sillysaurusx 6y ago
Does anyone know which framework they're using to load the images google-maps style? https://siliconpr0n.org/map/intel/4004/m0_200x/#x=1603&y=1451&z=5 https://siliconpr0n.org/map/intel/4004/m0_200x/#x=1603&y=145... I doubt it's a custom framework, but view source just shows uninformative compressed javascript and no info. I'd like to display my high resolution ML images in a similar way.
- adamhearn 6y ago
  Looks like LeafletJS: https://leafletjs.com/ https://leafletjs.com/
  - sillysaurusx 6y ago
    Thank you very much!
  - scq 6y ago
    Specifically, a tool called GroupXIV based on Leaflet. https://github.com/whitequark/groupXIV https://github.com/whitequark/groupXIV
    - sillysaurusx 6y ago
      Fantastic! Thank you both. Such a high quality repo, and only 28 stars. The viewer is really cool. I wonder if it'd be possible to modify it to display a folder of PNGs in a nice streamable way... (It looks like it only supports slicing a single png, whereas we usually have tens of thousands of pngs. I've been thinking of ways of letting people view lots of ML images better than e.g. how tensorboard does it.)
    - johndmcmaster 6y ago
      Even more specifically it's pr0nmap => GroupXIV => leaflet. I use GroupXIV's javascript, but my own tile cutter https://github.com/JohnDMcMaster/pr0nmap https://github.com/JohnDMcMaster/pr0nmap
airstrike 6y ago
Apache/2.4.41 (Ubuntu) Server at siliconpr0n.org Port 443, as a matter of fact
astrange 6y ago
It's pretty good, but Apache tries to cut off long filenames and isn't Unicode-aware when it does this, so it looks untidy because names come out at apparently random lengths…
- drocer88 6y ago
  See here to fix the long filenames: https://httpd.apache.org/docs/2.4/mod/mod_autoindex.html https://httpd.apache.org/docs/2.4/mod/mod_autoindex.html NameWidth=[n | *] The NameWidth keyword allows you to specify the width of the filename column in bytes.
ashas451 6y ago
Totally perfect apart from the fact I don’t have a fuckin clue what most of this shorthand and naming means. Sort of detail someone might include on of those silly cards or newfangled js dohicky
- systemvoltage 6y ago
  Lol, I empathize. Some description of what these folders mean would be helpful.
- mnem 6y ago
  If you go up to the main site, you can get to the wiki which has descriptions. For example: https://siliconpr0n.org/archive/doku.php?id=type https://siliconpr0n.org/archive/doku.php?id=type
- gorkish 6y ago
  They aren’t using it, but the Apache directory listing module does have support for descriptions that will be displayed beside the file names.
Maha-pudma 6y ago
I couldnt agree more, I use ublock in advanced mode (even on mobile) and I was expecting to have to enable multiple scripts, which nearly always consist or analitics and ads, to be able to use this thing. Nope, all first party scripts, brilliant. Better folder descriptions maybe but other than that perfect!
KronisLV 6y ago
Quick question: is there a particular reason why the table and the other elements aren't centered in the browser by default? Even this site seems to do that to some degree, which improves the usability at least somewhat. AFAIK that would require just a text-align rule for the title and margin-left: auto; and margin-right: auto; for the table, which seems a bit more readable on wide screens. Here's a screenshot: https://i.imgur.com/y447V3g.png https://i.imgur.com/y447V3g.png
- 4ad 6y ago
  I really dislike centered websites. That means that if I change the width of the browser window, the position of the website elements changes. So when I make the window bigger for ONE annoying tab that requires more width, it changes ALL other tabs. This is horrible for my muscle memory. Also, I arrange my windows such that overlapping windows don't hide important stuff underneath them. So I can see essential elements of a site even with chat windows on top. But if the website position changes on browser window width change, this invalidates ALL my other windows. It's simply awful. I want degrees of freedom to be independent, otherwise they are far less useful. People want centered websites because they are using browser windows that are far too wide, usually full screen. Just use a narrow browser window and left-aligned websites will look just fine. You'd think that with everyone having a narrow smartphone, websites would work well with narrow browser windows, but no, usually they use a different (bad!) layout on desktop browsers. I really hate this.
based2 6y ago
By default, to me, it is not sorted by date in the correct order.
johndmcmaster 6y ago
Glad you are enjoying! I've aggregated some question responses below to try to clarify a few things. Browsing the /map directory directly isn't intended to be informative in the way people are looking for. It's more of a file store that just happens to be browsable for advanced users. Rather this information is intended to be from the wiki which has more detail and is searchable etc. See for example: https://siliconpr0n.org/archive/doku.php?id=mcmaster:raspberry-pi:rp2-b0 https://siliconpr0n.org/archive/doku.php?id=mcmaster:raspber... Similarly if you can find additional information the wiki such as image conventions (https://siliconpr0n.org/archive/doku.php?id=conventions https://siliconpr0n.org/archive/doku.php?id=conventions) and additional copyright info (ex: https://siliconpr0n.org/archive/doku.php?id=tommi:start https://siliconpr0n.org/archive/doku.php?id=tommi:start) I'm looking over people's suggestions and trying to see if there is anything I can take in to improve the site. Thanks for the feedback and feel free to reach out to me directly if you want to contribute something directly! PS: yes I know there is some crufty stuff on there like search is doing weird stuff right now with the side bar. I upgraded the wiki software recently and haven't yet been

cdubzzz 6y ago

Eh. It’s pretty terrible on mobile, though. I can’t read or click anything without zooming and a page load for each directory resets the zoom. I would say the content isn’t really relevant for mobile users but the images themselves actually work pretty well on my device. Far better than the site itself.

systemvoltage 6y ago
It's actually pretty decent on mobile IMO. Pinch and zoom is easy to do, atleast on the iPhone. Then you just scroll naturally. The entire page doesn't move on you. I agree with you in general, its not great on mobile, but it's not terrible. Far better than hamburger menu'ed UI that I see in the wild that seems to show 1 card at a time and hijacks the scroll mechanism. A lot of "Not designed for mobile" fear stems from early days of smartphones in 2010-era which still lingers today. Things have changed. Screens have gotten much better in resolution, responsiveness has improved and touch experience on modern phones is exceptional.
asddubs 6y ago
all they really need is a viewport tag to fix that. Weird that no one has bothered to do that yet, seems like it would be a one line pull request
- systemvoltage 6y ago
  Thanks. TIL: > "This virtual viewport is a way to make non-mobile-optimized sites in general look better on narrow screen devices." https://developer.mozilla.org/en-US/docs/Web/HTML/Viewport_meta_tag https://developer.mozilla.org/en-US/docs/Web/HTML/Viewport_m...
ObsoleteNerd 6y ago
At least for iOS: Double-tap in the white space between the directory links and the dates, it’ll fit to the screen nicely.
kayson 6y ago
That's so easy to solve with css. See something like https://github.com/Vestride/fancy-index https://github.com/Vestride/fancy-index Specifically: https://github.com/Vestride/fancy-index/raw/main/after_mobile.png https://github.com/Vestride/fancy-index/raw/main/after_mobil...
- systemvoltage 6y ago
  I actually find this [1] more readable than this [2]. [1] https://github.com/Vestride/fancy-index/blob/main/before.png https://github.com/Vestride/fancy-index/blob/main/before.png [2] https://github.com/Vestride/fancy-index/blob/main/after.png https://github.com/Vestride/fancy-index/blob/main/after.png It's also not the same directory they're comparing. IMO why add padding? Why change #000000 to some grey text? Just add icons to [1] and you're good to go. May be use Sans-serif fonts if you wanna feel bit ~fancy~.
  - makeworld 6y ago
    If you look at the mobile before and after it becomes more clear why this is useful.
mgraczyk 6y ago
I think it's fine. The time it took me to double-tap zoom was less than the time it would have taken for an SPA to load over my weak ass T-Mobile connection
- rbanffy 6y ago
  The whole website is probably smaller than a minimal React app...
modeless 6y ago
I don't know why people are terrified of zooming. Frankly, zooming to use a desktop site is better UX than 90% of mobile sites. All you have to do is ensure your text lines aren't too long, which is good practice anyway. Maybe it's because iOS don't have a one finger zoom gesture like Android? I wonder why Apple never added that one?
- simonbw 6y ago
  On iOS you can double tap a paragraph to zoom in on it. That’s been around as long as I can remember.
  - modeless 6y ago
    Yeah it was in the first iPhone but you can't control the amount of zoom and it often guesses wrong or just doesn't work. I pretty much gave up on using it. On Android in most apps you can double tap, hold the second tap, then swipe up and down to zoom. It's a lot more natural than it sounds and it gives you precise control over both the zoom location and zoom amount. On iOS you can try the gesture in Maps, and then wonder why they never added it to Safari.
- paxswill 6y ago
  AA sibling comment mentions double tap to zoom in on a paragraph, but there's also a single finger zoom (tap and hold, then move the held finger vertically) for Maps (and by default in MapBoxGL last I checked).
  - modeless 6y ago
    Yeah, in Android that's been available for a long time in almost all apps that support zooming, not just Maps. Most critically, Chrome.

sillysaurusx 6y ago

Does anyone know which framework they're using to load the images google-maps style? https://siliconpr0n.org/map/intel/4004/m0_200x/#x=1603&y=1451&z=5 https://siliconpr0n.org/map/intel/4004/m0_200x/#x=1603&y=145... I doubt it's a custom framework, but view source just shows uninformative compressed javascript and no info. I'd like to display my high resolution ML images in a similar way.

adamhearn 6y ago
Looks like LeafletJS: https://leafletjs.com/ https://leafletjs.com/
- sillysaurusx 6y ago
  Thank you very much!
- scq 6y ago
  Specifically, a tool called GroupXIV based on Leaflet. https://github.com/whitequark/groupXIV https://github.com/whitequark/groupXIV
  - sillysaurusx 6y ago
    Fantastic! Thank you both. Such a high quality repo, and only 28 stars. The viewer is really cool. I wonder if it'd be possible to modify it to display a folder of PNGs in a nice streamable way... (It looks like it only supports slicing a single png, whereas we usually have tens of thousands of pngs. I've been thinking of ways of letting people view lots of ML images better than e.g. how tensorboard does it.)
  - johndmcmaster 6y ago
    Even more specifically it's pr0nmap => GroupXIV => leaflet. I use GroupXIV's javascript, but my own tile cutter https://github.com/JohnDMcMaster/pr0nmap https://github.com/JohnDMcMaster/pr0nmap

airstrike 6y ago

Apache/2.4.41 (Ubuntu) Server at siliconpr0n.org Port 443, as a matter of fact

astrange 6y ago

It's pretty good, but Apache tries to cut off long filenames and isn't Unicode-aware when it does this, so it looks untidy because names come out at apparently random lengths…

drocer88 6y ago
See here to fix the long filenames: https://httpd.apache.org/docs/2.4/mod/mod_autoindex.html https://httpd.apache.org/docs/2.4/mod/mod_autoindex.html NameWidth=[n | *] The NameWidth keyword allows you to specify the width of the filename column in bytes.

ashas451 6y ago

Totally perfect apart from the fact I don’t have a fuckin clue what most of this shorthand and naming means. Sort of detail someone might include on of those silly cards or newfangled js dohicky

systemvoltage 6y ago
Lol, I empathize. Some description of what these folders mean would be helpful.
mnem 6y ago
If you go up to the main site, you can get to the wiki which has descriptions. For example: https://siliconpr0n.org/archive/doku.php?id=type https://siliconpr0n.org/archive/doku.php?id=type
gorkish 6y ago
They aren’t using it, but the Apache directory listing module does have support for descriptions that will be displayed beside the file names.

Maha-pudma 6y ago

I couldnt agree more, I use ublock in advanced mode (even on mobile) and I was expecting to have to enable multiple scripts, which nearly always consist or analitics and ads, to be able to use this thing. Nope, all first party scripts, brilliant. Better folder descriptions maybe but other than that perfect!

KronisLV 6y ago

Quick question: is there a particular reason why the table and the other elements aren't centered in the browser by default? Even this site seems to do that to some degree, which improves the usability at least somewhat. AFAIK that would require just a text-align rule for the title and margin-left: auto; and margin-right: auto; for the table, which seems a bit more readable on wide screens. Here's a screenshot: https://i.imgur.com/y447V3g.png https://i.imgur.com/y447V3g.png

4ad 6y ago
I really dislike centered websites. That means that if I change the width of the browser window, the position of the website elements changes. So when I make the window bigger for ONE annoying tab that requires more width, it changes ALL other tabs. This is horrible for my muscle memory. Also, I arrange my windows such that overlapping windows don't hide important stuff underneath them. So I can see essential elements of a site even with chat windows on top. But if the website position changes on browser window width change, this invalidates ALL my other windows. It's simply awful. I want degrees of freedom to be independent, otherwise they are far less useful. People want centered websites because they are using browser windows that are far too wide, usually full screen. Just use a narrow browser window and left-aligned websites will look just fine. You'd think that with everyone having a narrow smartphone, websites would work well with narrow browser windows, but no, usually they use a different (bad!) layout on desktop browsers. I really hate this.

based2 6y ago

By default, to me, it is not sorted by date in the correct order.

johndmcmaster 6y ago

Glad you are enjoying! I've aggregated some question responses below to try to clarify a few things. Browsing the /map directory directly isn't intended to be informative in the way people are looking for. It's more of a file store that just happens to be browsable for advanced users. Rather this information is intended to be from the wiki which has more detail and is searchable etc. See for example: https://siliconpr0n.org/archive/doku.php?id=mcmaster:raspberry-pi:rp2-b0 https://siliconpr0n.org/archive/doku.php?id=mcmaster:raspber... Similarly if you can find additional information the wiki such as image conventions (https://siliconpr0n.org/archive/doku.php?id=conventions https://siliconpr0n.org/archive/doku.php?id=conventions) and additional copyright info (ex: https://siliconpr0n.org/archive/doku.php?id=tommi:start https://siliconpr0n.org/archive/doku.php?id=tommi:start) I'm looking over people's suggestions and trying to see if there is anything I can take in to improve the site. Thanks for the feedback and feel free to reach out to me directly if you want to contribute something directly! PS: yes I know there is some crufty stuff on there like search is doing weird stuff right now with the side bar. I upgraded the wiki software recently and haven't yet been