Most file managers show you a folder’s contents as a list of filenames with tiny thumbnails. If you want to actually see your photos—to appreciate them, to compare them, to decide which ones to keep—you’re forced to open each one individually or use a dedicated photo app that you have to install and configure.
Media Viewer is different. It’s a pure browser-based gallery tool that turns any folder on your computer into a visual browsing experience—complete with masonry layouts, auto-scroll, global video playback, and a custom queue system for curating collections. And crucially: it’s read-only. It cannot delete, move, or rename a single file. It’s purely for viewing, browsing, and organizing visually.
If you’ve ever wanted to sit back and watch your vacation videos scroll by, or build a “Best of” collection without actually moving files, Media Viewer is the tool you didn’t know you needed.
What makes Media Viewer different from other Sakarto tools?
Sakarto’s toolkit includes duplicate finders, bulk delete, bulk move, and bulk rename. Those tools are for acting on files. Media Viewer is for looking at them. It serves a completely different purpose:
| Tool | Purpose | Read-only? | What it does |
|---|---|---|---|
| Find Duplicate Images & Videos | Analysis | ✅ Yes | Scans for visually similar files using 7 algorithms |
| Bulk Delete | Action | ❌ No | Permanently removes selected files |
| Bulk Move | Action | ❌ No | Moves selected files to a subfolder |
| Bulk Rename | Action | ❌ No | Renames multiple files with patterns |
| Media Viewer | Browsing & Curation | ✅ Yes | Displays and organizes files visually — no modifications allowed |
The key insight: Media Viewer opens folders with mode: "read"—not "readwrite". The browser enforces this at the OS level. You can browse, compare, queue, and enjoy your media, but you cannot change a single byte of any file. This makes it safe for any folder, regardless of its importance.
How the Media Viewer works: a technical overview
Let’s walk through what happens when you open a folder with Media Viewer.
Step 1: Choose file types and select a folder
Before you select a folder, you can choose to include Images, Videos, or both. This filters the files that are loaded, reducing memory usage and focusing the view.
When you click 📂 Select Folder, the browser’s File System Access API reads the folder recursively. Only image files (jpg, png, gif, webp, bmp) and video files (mp4, webm, mov, mkv, avi) are collected based on your file type selections. Other file types are silently skipped.
Step 2: Cards render in batches of 50
Media Viewer doesn’t wait for all files to be collected before showing anything. Cards are built synchronously and appended to the DOM in batches of 50, yielding to the event loop between batches. This means cards appear immediately as each batch completes—you can start browsing before the scan finishes.
Step 3: Lazy-load with a 300px lookahead
No image or video content is decoded at load time. Each card uses an IntersectionObserver with a 300px root margin. When a card scrolls within 300px of the viewport, its src is set and the media begins decoding. This keeps memory usage low even for folders with thousands of files.
Step 4: Aspect ratio detection
Once each image or video loads, its natural dimensions are read. The card is assigned one of three aspect ratio classes—aspect-portrait, aspect-landscape, or aspect-square—which controls its max-height in masonry mode.
Step 5: Videos auto-play on hover
Video cards have preload="none" at load time to avoid network overhead. When your mouse enters a video card, it plays. When it leaves, it pauses. Videos are muted by default so multiple hover-plays don’t create noise. Each video loops.
Layout modes: Grid vs. Masonry
Media Viewer offers two distinct layout modes, each suited to a different browsing style.
Grid layout (default)
In grid mode, cards are displayed in a uniform grid with fixed-width columns and equal-height thumbnails (200px). Images crop to fill with object-fit: cover. This is the most predictable layout—no shifting as images load.
Best for: Quick browsing of large folders, scanning through many images rapidly, and when you want consistent card sizes regardless of image proportions.
Masonry layout
In masonry mode, a CSS column-count layout preserves each image’s natural aspect ratio. Portraits display tall, landscapes display wide, and squares display perfectly square. A spacing slider (0–20px) controls the column gap.
Best for: Appreciating photos as they were composed, creating a Pinterest-style gallery, and when you want to see full images without cropping.
Tip: Combine Masonry with Hide file info and a spacing of 4–8px for a clean, edge-to-edge gallery experience.
Video features: hover-play and play-all
Media Viewer handles videos with two complementary playback modes:
Hover-play (individual)
Move your mouse over any video card and it plays immediately. Move away and it pauses. Videos are muted by default and loop when they reach the end.
Play All (global)
Click ▶️ Play All in the toolbar to start every video on the page simultaneously. Launches are staggered by 30ms per video to avoid browser throttling. Click ⏸️ Pause All to stop them all. The toolbar button toggles between Play All and Pause All based on the current playback state.
Mute toggle
Click 🔇 Videos in the toolbar to toggle global mute on all video elements. This affects both hover-play and Play All modes.
Tip: For a self-running video slideshow, set auto-scroll speed to 1–2, enable Play All, then start auto-scroll and go fullscreen on the browser tab.
Auto-scroll: hands-free browsing
Auto-scroll drives the page downward at a constant speed so you can lean back and watch images and videos scroll past without touching keyboard or mouse.
| Control | What it does |
|---|---|
| ⬇️ Auto-scroll | Starts smooth continuous downward scrolling |
| ⏸️ Stop scroll | Stops auto-scroll (button toggles) |
| Speed slider | 1–10: 1 is slowest, 10 is fastest. Speed 3–4 works well for images; speed 1–2 for videos where you want to watch each clip. |
| Manual scroll pause | Mouse wheel or trackpad input pauses auto-scroll immediately. It automatically resumes 1 second after you stop manually scrolling. |
| Stops at bottom | When the page reaches within 10px of the bottom, auto-scroll stops automatically with a “Reached bottom” toast. |
| Escape | Press Escape to stop auto-scroll and deselect all files |
Tip: Auto-scroll + Hide file info + Masonry + Play All = a self-running media gallery that feels like a curated presentation.
Custom Queues: build named collections
Queues let you curate a named collection of files from the folder—like a playlist for images and videos. Each queue gets its own tab in the sidebar with its own independent layout, spacing, and auto-scroll controls.
How to use queues
- Select files by clicking cards (blue border).
- Click 📂 Add to Queue in the toolbar.
- A modal appears. If queues already exist, you can add to an existing one or create a new one.
- Type a descriptive name—e.g., Nature, Favourites, To Print—and click Create New Queue.
- The new queue tab appears in the sidebar. Click it to view only the files you added.
Managing queues
- Remove a file: Click the ✕ on any card in the queue to remove that file.
- Delete a queue: Click the ✕ button next to the queue name in the sidebar.
- Clear a queue: Click Clear All in the queue’s toolbar.
- Add more files: Select files from the main All Files tab and add them to any existing queue.
Important: Queues are session-only
Queues exist only while the browser tab is open. Reloading the page clears all queues. Use Download List while viewing a queue to export the filenames and paths before reloading.
Queues can hold the same file in multiple queues. Select a file and add it to one queue, then select it again and add it to another. Files can appear in as many queues as you like.
Compare side-by-side
Ctrl+Click (Cmd+Click on Mac) any 2 or more cards to add them to the compare list (purple border). Click ⚖️ Compare in the toolbar. A modal opens showing each file side-by-side with:
- The file itself (image or video with native controls)
- File name
- Dimensions (if available)
- File size
- File type
- Full file path
Use it when: You have two similar shots and want to decide which one is better before adding to a queue, or you want to compare a high-quality original against a lower-quality version.
Step-by-step: Using Media Viewer
Step 1: Choose your file types
On the welcome screen, check 🖼️ Images and/or 🎬 Videos. If you only want to watch videos, uncheck Images to reduce the number of cards loaded.
Step 2: Select a folder
Click 📂 Select Folder. A native folder picker opens (Chrome/Edge). Or drag and drop a folder directly onto the page. The folder is opened read-only—nothing in it can be modified.
Step 3: Choose a layout and browse
Use the 📊 Grid / 🧱 Masonry buttons above the results to switch layout. In Masonry mode, use the Spacing slider to adjust the gap (0–20px). Check Hide file info to show only the media for an immersive look.
Step 4: Play videos and auto-scroll
Hover over any video card to play it. Click ▶️ Play All to launch every video at once. Click ⬇️ Auto-scroll and set a comfortable speed—then sit back and let the gallery scroll automatically.
Step 5: Preview full-size
Click the 🔍 or ▶️ icon on any card to open a full-size modal. Images scale to fit the screen. Videos open with native controls including fullscreen.
Step 6: Compare files side-by-side
Ctrl+Click two or more cards, then click ⚖️ Compare in the toolbar. A modal opens showing each file side-by-side with metadata.
Step 7: Create a custom queue
Select files you want to group, click 📂 Add to Queue, give the collection a name, and click Create. The new tab appears in the sidebar.
Privacy: your files never leave your device
Media Viewer is one of the most privacy-safe tools in Sakarto’s toolkit:
- Opened in read-only mode. The File System Access API call uses
mode: "read". The browser enforces this at the OS level—write operations are not possible. - Zero network activity after page load. All images and videos are decoded locally. No data leaves your device at any point.
- Folder access is scoped and session-only. Permission covers only the folder you selected, lasts only while the tab is open, and is revocable from browser site settings.
- No preferences are persisted. Media Viewer saves nothing to
localStorage. Every session starts fresh with default settings.
Frequently asked questions (Media Viewer specific)
“Can this tool delete, move, or rename my files?”
No. Media Viewer opens folders with mode: "read"—a read-only permission that the browser enforces at the OS level. No write operation of any kind is possible. For file operations, use Bulk Delete, Bulk Move, or Bulk Rename.
”My images look cropped in grid mode. Can I see them uncropped?”
Yes—switch to Masonry layout. In grid mode, images are cropped to a fixed height using object-fit: cover. Masonry mode preserves natural proportions. You can also click the 🔍 icon to see any image at full size in a modal.
”Auto-scroll stops and starts on its own. Is that a bug?”
No—that’s the manual-scroll detection working as designed. When the tool detects wheel or trackpad input, it pauses auto-scroll for 1 second to let you look at something, then resumes. To stop auto-scroll permanently, click the ⏸️ Stop scroll button or press Escape.
”Some videos won’t play even after clicking Play All.”
Browsers impose limits on the number of simultaneously active media elements. If you have dozens of videos visible, some may be blocked. Try scrolling so fewer video cards are in view when you click Play All, or hover individual video cards to play them one at a time.
”My queues disappeared when I reloaded. How do I save them?”
Queues are session-only—they live in memory and are cleared on reload. To preserve a queue’s contents, switch to the queue tab and click Download List before reloading. This exports a text file with all filenames and paths.
”Can I add the same file to multiple queues?”
Yes. Select a file and add it to one queue, then select it again and add it to another. Files can appear in as many queues as you like. The badge on the main grid card reflects only the first queue the file belongs to.
”The masonry layout looks uneven. Why?”
CSS column masonry fills top-to-bottom within each column based on alphabetical file order. Uneven column heights are normal and become more balanced as more images load. If evenness is important, use grid mode instead.
”How do I watch a video in fullscreen?”
Click the ▶️ icon on any video card to open the modal player with native browser controls. From there, use the fullscreen button in the video player controls. On desktop you can also press F while the video is focused.
”Does this work on Firefox or Safari?”
The File System Access API (folder picker, recursive reading) is only available in Chrome 86+ and Edge 86+. Firefox and Safari can use the fallback file input to select individual files, but folder selection and drag-and-drop may not work fully. The viewing experience itself works in all modern browsers.
Final thoughts
Media Viewer is the unexpected star of Sakarto’s organizer suite. It doesn’t find duplicates, delete files, or rename anything. It just lets you browse, enjoy, and curate your images and videos in a way that most file managers simply don’t.
It’s particularly effective for:
- Browsing large photo collections. Masonry layout + Hide file info = a clean, immersive gallery.
- Watching vacation videos. Play All + Auto-scroll = a self-running video slideshow.
- Curating selections. Queues let you build collections without moving files.
- Comparing similar shots. Side-by-side compare helps you decide which image to keep.
- Reviewing folders before cleanup. Browse first, then switch to Bulk Delete or Bulk Move when you’re ready to act.
And because it’s read-only, you can use it on any folder without worry. No accidental deletions, no moved files—just a pure viewing experience.
If you’ve ever wanted to sit back and scroll through your photos like a gallery, Media Viewer is the tool that makes it happen.
Ready to browse your media?
- Open Media Viewer — free, browser‑based, no install
- Explore All Organize Tools — Bulk Delete, Bulk Move, and Bulk Rename
- Find Duplicate Images & Videos — 7 algorithms to find similar files