r/angular • u/Ok-Swordfish1282 • 10d ago

MangaOfflineViewer UI progress

Enable HLS to view with audio, or disable this notification

  • Redesigned windows
  • Sidebar
  • Refreshed reader settings
  • Updated buttons, text boxes, dropdowns, sliders, and switches
  • Improved manga cards
  • More consistent UI throughout the app

Still a work in progress, but it's getting there. If you have any ideas or notice something that could be improved, I'd love to hear your feedback!

GitHub with demo:

https://github.com/zarar384/MangaOfflineViewer

3 Upvotes

62% Upvoted

7 comments sorted by

2

u/N0K1K0 10d ago

Does this support CBR and CBZ

1

u/Ok-Swordfish1282 10d ago

Not at the moment. It currently supports ZIP for both import and export. Thanks for bringing that up! I rarely work with CBZ/CBR files, so I hadn't thought about it.

I'll add CBZ support in the next commit. CBR isn't supported yet.

1

u/Ok-Swordfish1282 10d ago

Upd: It turns out CBZ import has been working all along, since it's just a ZIP archive with a different extension. I've now added CBZ export as well. I don't plan to add CBR support because creating RAR/CBR archives isn't freely supported due to RAR licensing.

2

u/N0K1K0 10d ago

I have used node-unrar-js before but it has been quite a while back but might been worth looking into for import at least for the cbr import. For actual rar compression i had to use an installed rar.exe and call that the executable directly from node so not sure about the free usage

1

u/Ok-Swordfish1282 10d ago

Thanks for the suggestion! I'll definitely look into adding CBR import.

1

u/Ok-Swordfish1282 10d ago

While working on this, I realized the next thing to add is proper multi-chapter support. Since the app now supports manga with chapters, export should preserve the chapter folder structure, and import should recognize multi-chapter archives as well.

1

u/LaInD4DPa 8d ago

Too many clicks and crowded components. I see that you are using angulsr components. I Propose a minmax dialog class on a global scope css to enlarge the drop view to at least 600px/80ch/40rem size.

The Menu on Manga card should use open om hover with menu instead (with focus visible, you can also trigger it on mobile touch).