[MS] File viewer specifications

[NicoTuxx]

File Viewer Specifications

Table of Contents

1. File Viewers
2. Sections
   1. Topbar
   2. Viewer
   3. Controls
3. Features
   1. Features by section
      1. Topbar section
      2. Viewer section
      3. Controls section
   2. Features Usage by File Viewers
4. Technical components
   1. Components to develop
      1. Generic Components (megashark-lib)
      2. Basic Components
      3. Specific Components
   2. Feature with respective components

File Viewers

• 🎧 Audio Player
• 📄 Word Document
• 🏞️ Image
• 📑 PDF
• 📊 Spreadsheet
• 📝 Text
• 🎬 Video Player

Sections

Topbar

Contains file details and some global actions.

Viewer

Displays the content of the file being viewed.

• 🎧 Audio: Audio illustration to fill the void
• 📄 Word Document: "White page" style layout with vertical scroll management
• 🏞️ Image: Image rendering
• 📑 PDF: "White page" style layout with vertical scroll management
• 📊 Spreadsheet: Spreadsheet style layout
• 📝 Text: Code editor style layout
• 🎬 Video: Video player without controls

Controls

Provides interactive elements to manipulate the file being viewed.

Features

Features by section

Topbar section

• ⭐ File details
• ⭐ Open with system

Viewer section

• ⭐ Accurate rendering (fonts, tables, images, graphics…)
• ⭐ Illustration to fill the void if no rendering
• 🔵 Pages / Sheets Preview

Controls section

• ⭐ Play / Pause
• ⭐ Stream control
• ⭐ Volume control
• ⭐ Full screen mode
• ⭐ Zoom
• ⭐ Page navigation
• ⭐ Sheet navigation
• ⚪ Settings
• ⚪ Playback speed (0.5x, 1.5x, 2x, etc.)
• ⚪ Fast forward and rewind (-10s, +10s)
• ⚪ Search
• 🔵 Picture-in-Picture mode
• 🔵 Quality selection
• 🔵 Subtitle selection
• 🔵 Audio language selection

Features Usage by File Viewers

Feature / Viewer	Audio Player	Video Player	Word Document	Image	PDF	Spreadsheet	Text
File Details	✔️	✔️	✔️	✔️	✔️	✔️	✔️
Open with system	✔️	✔️	✔️	✔️	✔️	✔️	✔️
Accurate file rendering	❌	✔️	✔️	✔️	✔️	✔️	✔️
Viewer illustration	✔️	❌	❌	❌	❌	❌	❌
Play / Pause	✔️	✔️	❌	❌	❌	❌	❌
Stream control	✔️	✔️	❌	❌	❌	❌	❌
Volume control	✔️	✔️	❌	❌	❌	❌	❌
Full screen mode	✔️	✔️	✔️	✔️	✔️	✔️	✔️
Zoom	❌	❌	✔️	✔️	✔️	✔️	✔️
Page navigation	❌	❌	✔️	❌	✔️	❌	❌
Sheet navigation	❌	❌	❌	❌	❌	✔️	❌
Settings	✔️	✔️	❌	❌	❌	❌	❌
Playback speed	✔️	✔️	❌	❌	❌	❌	❌
Fast forward and rewind	✔️	✔️	❌	❌	❌	❌	❌
Search	❌	❌	✔️	❌	✔️	✔️	✔️
Pages / Sheets Preview	❌	❌	✔️	❌	✔️	✔️	❌
Picture-in-Picture mode	❌	✔️	❌	❌	❌	❌	❌
Quality selection	❌	✔️	❌	❌	❌	❌	❌
Subtitle selection	❌	✔️	❌	❌	❌	❌	❌
Audio language selection	❌	✔️	❌	❌	❌	❌	❌

Technical components

Components to develop

Generic Components (megashark-lib)

• ⭐ MsSlider

Basic Components

• ⭐ FileControls (current FileViewerActionBar)
• ⭐ FileControlsInput
• ⭐ FileControlsText
• ⭐ FileControlsButton
• ⭐ FileControlsDropdown
  • ⭐ FileControlsDropdownItem (Option or Toggle)
  • ⚪ FileControlsDropdownOptionList (an option must be able to update the list of options (like a submenu))

Specific Components

• ⭐ FileControlsVolume
  • MsSlider
  • FileControlsButton (mute/unmute)
• ⭐ FileControlsFlux
  • FileControlsText
  • MsSlider
  • FileControlsButton (fast forward)
• ⭐ FileControlsZoom
  • FileControlsButton x2
  • FileControlsInput
• ⭐ FileControlsPagination
  • FileControlsButton x2
  • FileControlsInput
• ⚪ FileControlsSettings
  • FileControlsDropdown
  • FileControlsDropdownItem (Option or Toggle)
  • FileControlsDropdownOptionList
• 🔵 FileViewerPreview

Features with respective components

Features	Section	Component Name
File Details	Topbar	simple text
Open with system	Topbar	simple button
Accurate file rendering	Viewer	specific viewer components
Viewer illustration	Viewer	specific viewer illustration
Play / Pause	Controls	FileControlsButton
Stream control	Controls	FileControlsFlux
Volume control	Controls	FileControlsVolume
Full screen mode	Controls	FileControlsButton
Zoom	Controls	FileControlsZoom
Page navigation	Controls	FileControlsPagination
Sheet navigation	Controls	FileControlsDropdown
Settings	Controls	FileControlsSettings
Playback speed	Controls	FileControlsDropdownOptionList
Fast forward and rewind	Controls	FileControlsButton
Search	Controls	FileControlsInput
Pages / Sheets Preview	Viewer	FileViewerPreview
Picture-in-Picture mode	Controls	FileControlsDropdownItem
Quality selection	Controls	FileControlsDropdownOptionList
Subtitle selection	Controls	FileControlsDropdownItem
Audio language selection	Controls	FileControlsDropdownOptionList

[NicoTuxx]

Components development:

• MsSlider component
• [MS] FileControls component #9014
• [MS] FileControlsInput component #9015
• [MS] FileControlsText component #9016
• [MS] FileControlsButton component #9017
• [MS] FIleControlsDropdown component #9018
  • [MS] FileControlsDropdownItem component #9019
  • [MS] FileControlsDropdownOptionList component #9020
• [MS] FileControlsVolume component #9021
• [MS] FileControlsFlux component #9022
• [MS] FileControlsZoom component #9023
• [MS] FileControlsPagination component #9024
• [MS] FileControlsSettings component #9025
• [MS] FileViewerPreview component #9026

[NicoTuxx]

Features to develop:

• [MS] (File viewer features) Topbar section - File details #9029
• [MS] (File viewer features) Topbar section - Open with system #9030
• [MS] (File viewer features) Viewer section - Accurate rendering (fonts, tables, images, graphics…) #9031
• [MS] (File viewer features) Viewer Section - Illustration to fill the void if no rendering #9032
• [MS] (File viewer features) Viewer Section - Pages / Sheets Preview #9033
• [MS] (File viewer features) Controls section - Play / Pause #9034
• [MS] (File viewer features) Controls section - Stream control #9035
• [MS] (File viewer features) Controls section - Volume control #9036
• [MS] (File viewer features) Controls section - Full screen mode #9037
• [MS] (File viewer features) Controls section - Zoom #9038
• [MS] (File viewer features) Controls section - Page navigation #9039
• [MS] (File viewer features) Controls section - Sheet navigation #9040
• [MS] (File viewer features) Controls section - Settings #9041
• [MS] (File viewer features) Controls section - Playback speed #9042
• [MS] (File viewer features) Controls section - Fast forward and rewind #9043
• [MS] (File viewer features) Controls section - Search #9044
• [MS] (File viewer features) Controls section - Picture-in-Picture mode #9045
• [MS] (File viewer features) Controls section - Quality selection #9046
• [MS] (File viewer features) Controls section - Subtitle selection #9047
• [MS] (File viewer features) Controls section - Audio language selection #9048