New: Open file location in context menu

Author: ollm

.github/FUNDING.yml

@@ -1,6 +1,6 @@
 # These are supported funding model platforms
 
-github: # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, user2]
+github: ["ollm"]
 patreon: # Replace with a single Patreon username
 open_collective: # Replace with a single Open Collective username
 ko_fi: # Replace with a single Ko-fi username

CHANGELOG.md

@@ -8,11 +8,12 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ### 🚀 New Features
 
+- Open file location in context menu
 
 ### 🐛 Bug Fixes
 
 - Gamepad icons not showing in distribution version [`249640d`](https://github.com/ollm/OpenComic/commit/249640d57f3d5768661b63c0ddf8525a02e44d25)
-- Go back in gamepad menus
+- Go back in gamepad menus [`b2719e5`](https://github.com/ollm/OpenComic/commit/b2719e5e782659f249ce7a6ba6c8b94fe40a3407)
 
 ## [v1.0.0-beta.2](https://github.com/ollm/OpenComic/releases/tag/v1.0.0-beta.2) (03-09-2023)
 

README.md

@@ -1,44 +1,44 @@
 ## Download beta `v1.0.0-beta.2`
 
 ###### All packages
-* [v1.0.0-beta.2](https://github.com/ollm/OpenComic/releases/tag/v1.0.0-beta.2)
+- [v1.0.0-beta.2](https://github.com/ollm/OpenComic/releases/tag/v1.0.0-beta.2)
 
 ## Download `v0.2.1`
 ###### Windows
-* [.exe](https://github.com/ollm/OpenComic/releases/download/v0.2.1/OpenComic.Setup.0.2.1.exe)
+- [.exe](https://github.com/ollm/OpenComic/releases/download/v0.2.1/OpenComic.Setup.0.2.1.exe)
 ###### macOS
-* [.7z](https://github.com/ollm/OpenComic/releases/download/v0.2.1/OpenComic-0.2.1-mac-build2.7z)
+- [.7z](https://github.com/ollm/OpenComic/releases/download/v0.2.1/OpenComic-0.2.1-mac-build2.7z)
 ###### Linux
-* [.deb](https://github.com/ollm/OpenComic/releases/download/v0.2.1/opencomic_0.2.1_amd64.deb)
-* [.rpm](https://github.com/ollm/OpenComic/releases/download/v0.2.1/opencomic-0.2.1.x86_64.rpm)
-* [.snap](https://github.com/ollm/OpenComic/releases/download/v0.2.1/opencomic_0.2.1_amd64.snap)
-* [.7z](https://github.com/ollm/OpenComic/releases/download/v0.2.1/opencomic-0.2.1.7z)
-* [.AppImage](https://github.com/ollm/OpenComic/releases/download/v0.2.1/OpenComic-0.2.1.AppImage)
-* `snap install opencomic`
-* [AUR](https://aur.archlinux.org/packages/opencomic-bin/)
+- [.deb](https://github.com/ollm/OpenComic/releases/download/v0.2.1/opencomic_0.2.1_amd64.deb)
+- [.rpm](https://github.com/ollm/OpenComic/releases/download/v0.2.1/opencomic-0.2.1.x86_64.rpm)
+- [.snap](https://github.com/ollm/OpenComic/releases/download/v0.2.1/opencomic_0.2.1_amd64.snap)
+- [.7z](https://github.com/ollm/OpenComic/releases/download/v0.2.1/opencomic-0.2.1.7z)
+- [.AppImage](https://github.com/ollm/OpenComic/releases/download/v0.2.1/OpenComic-0.2.1.AppImage)
+- `snap install opencomic`
+- [AUR](https://aur.archlinux.org/packages/opencomic-bin/)
 ###### Linux Arm64
-* [arm64.deb](https://github.com/ollm/OpenComic/releases/download/v0.2.1/opencomic_0.2.1_arm64.deb)
-* [arm64.rpm](https://github.com/ollm/OpenComic/releases/download/v0.2.1/opencomic-0.2.1.aarch64.rpm)
-* [arm64.7z](https://github.com/ollm/OpenComic/releases/download/v0.2.1/opencomic-0.2.1-arm64.7z)
-* [arm64.AppImage](https://github.com/ollm/OpenComic/releases/download/v0.2.1/OpenComic-0.2.1-arm64.AppImage)
+- [arm64.deb](https://github.com/ollm/OpenComic/releases/download/v0.2.1/opencomic_0.2.1_arm64.deb)
+- [arm64.rpm](https://github.com/ollm/OpenComic/releases/download/v0.2.1/opencomic-0.2.1.aarch64.rpm)
+- [arm64.7z](https://github.com/ollm/OpenComic/releases/download/v0.2.1/opencomic-0.2.1-arm64.7z)
+- [arm64.AppImage](https://github.com/ollm/OpenComic/releases/download/v0.2.1/OpenComic-0.2.1-arm64.AppImage)
 
 ## ScreenShot
 
 ![Screenshot](https://i.ibb.co/vPKbpyQ/Open-Comic-Screen-Shot.png "Screenshot")
 
 ## Features
 
-* Support this image formats: JPG, PNG, APNG, AVIF, WEBP, GIF, SVG, BMP, ICO
-* Support this compressed formats: PDF, RAR, ZIP, 7Z, TAR, CBR, CBZ, CB7, CBT
-* Manga read mode
-* Webtoon read mode
-* Double page view
-* Bookmarks and continue reading
-* Floating magnifying glass
-* Reading in scroll or slide
-* 🎮 Gamepad navigation
-
-You can see the changes between versions in the [Changelog](https://github.com/ollm/OpenComic/blob/master/CHANGELOG.md)
+- 🖼 Support this image formats: `JPG`, `PNG`, `APNG`, `AVIF`, `WEBP`, `GIF`, `SVG`, `BMP`, `ICO`
+- 🗄 Support this compressed formats: `PDF`, `RAR`, `ZIP`, `7Z`, `TAR`, `CBR`, `CBZ`, `CB7`, `CBT`
+- 🇯🇵 Manga read mode
+- 🇰🇷 Webtoon read mode
+- 📖 Double page view
+- 🔖 Bookmarks and continue reading
+- 🔍 Floating magnifying glass
+- 🖱 Reading in scroll or slide
+- 🎮 Gamepad navigation
+
+You can see the changes between versions in the [Changelog 📝](https://github.com/ollm/OpenComic/blob/master/CHANGELOG.md)
 
 ## Installation and Starting for development
 __Requirements__: Git, Node and NPM

languages/ca.json

@@ -21,6 +21,7 @@
 		},
 		"contextMenu": {
 			"remove": "Retirar",
+			"openFileLocation": "Obre la ubicació del fitxer",
 			"closeApp": "Tancar OpenComic"
 		},
 		"back": "Enrere",

languages/en.json

@@ -21,6 +21,7 @@
 		},
 		"contextMenu": {
 			"remove": "Remove",
+			"openFileLocation": "Open file location",
 			"closeApp": "Close OpenComic"
 		},
 		"back": "Back",

languages/es.json

@@ -21,6 +21,7 @@
 		},
 		"contextMenu": {
 			"remove": "Retirar",
+			"openFileLocation": "Abrir localización de archivo",
 			"closeApp": "Cerrar OpenComic"
 		},
 		"back": "Atrás",

scripts/dom.js

@@ -1079,6 +1079,8 @@ function changeLanguage(lan)
 	template.loadContentLeft('index.content.left.html', false);
 	template.loadHeader('languages.header.html', false);
 	storage.updateVar('config', 'language', lan);
+
+	gamepad.updateBrowsableItems(gamepad.currentKey());
 }
 
 /* Page - Settings */
@@ -1363,9 +1365,22 @@ function nightMode()
 }
 
 // Show the comic contet menu
-function comicContextMenu(path)
+function comicContextMenu(path, fromIndex = true)
 {	
-	$('#index-context-menu .context-menu-remove').attr('onclick', 'dom.removeComic(\''+escapeQuotes(escapeBackSlash(path), 'simples')+'\');');
+	// Remove
+	let remove = document.querySelector('#index-context-menu .context-menu-remove');
+
+	if(fromIndex)
+		remove.style.display = 'block';
+	else
+		remove.style.display = 'none';
+
+	remove.setAttribute('onclick', 'dom.removeComic(\''+escapeQuotes(escapeBackSlash(path), 'simples')+'\');');
+
+	// Open file location
+	let openFileLocation = document.querySelector('#index-context-menu .context-menu-open-file-location');
+	openFileLocation.setAttribute('onclick', 'electron.shell.showItemInFolder(\''+escapeQuotes(escapeBackSlash(fileManager.firstCompressedFile(path)), 'simples')+'\');');
+
 	events.activeContextMenu('#index-context-menu');
 }
 

templates/index.content.right.list.html

@@ -8,7 +8,7 @@
 {{/if}}
 <div class="content-view-list">
 	{{#each comics}}
-	<div class="medium-list body-medium{{#unless folder}} sha-{{sha}}{{/unless}} gamepad-item{{#if @first}} gamepad-to-highlight{{/if}}" onclick="{{#if folder}}dom.loadIndexPage(true, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' path}}', false, false, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' mainPath}}'){{else}}dom.openComic(true, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' path}}', '{{chain 'escapeBackSlash' 'escapeQuotesSimples' mainPath}}');{{/if}}"{{#if @root.comicsIndex}} oncontextmenu="dom.comicContextMenu('{{chain 'escapeBackSlash' 'escapeQuotesSimples' mainPath}}')"{{/if}}>
+	<div class="medium-list body-medium{{#unless folder}} sha-{{sha}}{{/unless}} gamepad-item{{#if @first}} gamepad-to-highlight{{/if}}" onclick="{{#if folder}}dom.loadIndexPage(true, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' path}}', false, false, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' mainPath}}'){{else}}dom.openComic(true, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' path}}', '{{chain 'escapeBackSlash' 'escapeQuotesSimples' mainPath}}');{{/if}}" oncontextmenu="dom.comicContextMenu('{{chain 'escapeBackSlash' 'escapeQuotesSimples' path}}', {{#if @root.comicsIndex}}true{{else}}false{{/if}})">
 		<div class="{{#if folder}}icon-24 material-icon{{else}}medium-list-image{{/if}} item-image"{{#unless folder}} style="background-image: url({{chain 'escapeBackSlash' 'escapeQuotesSimples' thumbnail}});"{{/unless}}>{{#if folder}}folder{{/if}}</div>
 		<div class="medium-list-text">{{name}}</div>
 	</div>

templates/index.content.right.module.html

@@ -8,7 +8,7 @@
 {{/if}}
 <div class="content-view-module">
 	{{#each comics}}
-	<div class="sha-{{sha}} gamepad-item{{#if @first}} gamepad-to-highlight{{/if}}" onclick="{{#if folder}}dom.loadIndexPage(true, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' path}}', false, false, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' mainPath}}'){{else}}dom.openComic(true, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' path}}', '{{chain 'escapeBackSlash' 'escapeQuotesSimples' mainPath}}');{{/if}}"{{#if @root.comicsIndex}} oncontextmenu="dom.comicContextMenu('{{chain 'escapeBackSlash' 'escapeQuotesSimples' mainPath}}')"{{/if}}>
+	<div class="sha-{{sha}} gamepad-item{{#if @first}} gamepad-to-highlight{{/if}}" onclick="{{#if folder}}dom.loadIndexPage(true, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' path}}', false, false, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' mainPath}}'){{else}}dom.openComic(true, '{{chain 'escapeBackSlash' 'escapeQuotesSimples' path}}', '{{chain 'escapeBackSlash' 'escapeQuotesSimples' mainPath}}');{{/if}}" oncontextmenu="dom.comicContextMenu('{{chain 'escapeBackSlash' 'escapeQuotesSimples' path}}', {{#if @root.comicsIndex}}true{{else}}false{{/if}})">
 		{{#if folder}}
 		<div class="v-folder item-image">
 			{{#if poster}}

templates/index.elements.menus.html

@@ -39,9 +39,15 @@
 </div>
 
 <div class="menu" id="index-context-menu">
-	<div class="menu-simple elevation-2" style="width: 164px;" onclick="events.desactiveMenu('#index-context-menu');">
+	<div class="menu-simple elevation-2" onclick="events.desactiveMenu('#index-context-menu');">
 		<div class="menu-simple-content">
-			<div class="menu-simple-element context-menu-remove">
+
+			<div class="menu-simple-element menu-simple-element-little context-menu-open-file-location">
+				<i class="material-icon menu-simple-icon-first">folder_open</i>
+				{{language.global.contextMenu.openFileLocation}}
+			</div>
+
+			<div class="menu-simple-element menu-simple-element-little context-menu-remove">
 				<i class="material-icon menu-simple-icon-first">delete</i>
 				{{language.global.contextMenu.remove}}
 			</div>

templates/reading.elements.menus.tracking.sites.html

@@ -10,10 +10,10 @@
 		<span>{{language.reading.tracking.favoriteSites}}</span>
 	</div>
 	{{#each favoriteTrackingSites}}
-		<div class="menu-tracking-sites menu-simple-element menu-simple-element-medium gamepad-item" onclick="tracking.configTracking('{{key}}')">
+		<div class="menu-tracking-sites menu-simple-element menu-simple-element-medium gamepad-item{{#if config.favorite}} favorite{{/if}}" onclick="tracking.configTracking('{{key}}')">
 			<div class="menu-simple-element-image" style="background-image: url({{logo}})"></div>
 			<span>{{name}}</span>
-			<i class="material-icon menu-simple-icon-last" onclick="reading.trackingSiteToFavorite('{{key}}'); event.stopPropagation();">{{#if config.favorite}}favorite{{else}}favorite_border{{/if}}</i>
+			<i class="material-icon menu-simple-icon-last" onclick="reading.trackingSiteToFavorite('{{key}}'); event.stopPropagation();">favorite</i>
 			{{#if tracking.id}}<i class="material-icon">{{#if tracking.active}}sync{{else}}sync_disabled{{/if}}</i>{{/if}}
 		</div>
 	{{else}}
@@ -24,10 +24,10 @@
 		<span>{{language.reading.tracking.sites}}</span>
 	</div>
 	{{#each trackingSites}}
-		<div class="menu-tracking-sites menu-tracking-sites--{{key}} menu-simple-element menu-simple-element-medium gamepad-item" onclick="tracking.configTracking('{{key}}')">
+		<div class="menu-tracking-sites menu-tracking-sites--{{key}} menu-simple-element menu-simple-element-medium gamepad-item{{#if config.favorite}} favorite{{/if}}" onclick="tracking.configTracking('{{key}}')">
 			<div class="menu-simple-element-image" style="background-image: url({{logo}})"></div>
 			<span>{{name}}</span>
-			<i class="material-icon menu-simple-icon-last" onclick="reading.trackingSiteToFavorite('{{key}}'); event.stopPropagation();">{{#if config.favorite}}favorite{{else}}favorite_border{{/if}}</i>
+			<i class="material-icon menu-simple-icon-last" onclick="reading.trackingSiteToFavorite('{{key}}'); event.stopPropagation();">favorite</i>
 			{{#if tracking.id}}<i class="material-icon">{{#if tracking.active}}sync{{else}}sync_disabled{{/if}}</i>{{/if}}
 		</div>
 	{{/each}}

themes/material-design/actions.css

@@ -359,7 +359,7 @@
 	z-index: 12;
 	/*box-shadow: 0 0px 3px 1px rgba(0,0,0,0.14), 0 2px 3px rgba(0,0,0,0.14);*/
 	display: none;
-	padding: 12px 0px;
+	padding: 8px 0px;
 	font-size: 15px;
 	overflow: auto;
 	overflow-x: hidden;
@@ -416,9 +416,9 @@
 
 .menu-simple-element
 {
-	height: 32px;
+	height: 40px;
 	padding: 0px 24px;
-	line-height: 32px;
+	line-height: 40px;
 	cursor: pointer;
 	transition: 0.2s;
 	text-overflow: ellipsis;
@@ -431,19 +431,23 @@
 .menu-simple-element i
 {
 	float: right;
-	padding: 4px 0px 4px 8px;	
+	padding: 8px 0px 8px 8px;	
 }
 
 .menu-simple-element i.menu-simple-icon-last
 {
 	margin-right: -8px;
+	position: relative;
+	z-index: 2;
 }
 
 .menu-simple-element i.menu-simple-icon-first
 {
 	margin: 0px 0px 0px -2px;
-	padding: 4px 20px 4px 0px;
+	padding: 8px 12px 8px 0px;
 	float: left;
+	position: relative;
+	z-index: 2;
 }
 
 .menu-simple-element-icon2
@@ -500,11 +504,11 @@
 {
 	height: 24px;
 	width: 24px;
-	border-radius: 4px;
+	border-radius: 6px;
 	background-repeat: no-repeat;
 	background-position: center;
 	background-size: cover;
-	margin: 4px 6px 0px 0px;
+	margin: 8px 6px 0px 0px;
 	float: left;
 }
 
@@ -522,11 +526,11 @@
 {
 	height: 32px;
 	width: 32px;
-	border-radius: 4px;
+	border-radius: 8px;
 	background-repeat: no-repeat;
 	background-position: center;
 	background-size: cover;
-	margin: 0px 6px 0px 0px;
+	margin: 4px 6px 0px 0px;
 	float: left;
 }
 
@@ -822,7 +826,7 @@
 	font-size: 20px;
 	line-height: 28px;
 	padding: 0px 0px;
-	color: rgba(0, 0, 0, 0.87);
+	color: var(--md-sys-color-on-surface);
 	font-weight: 500;
 	padding: 24px 24px 16px 24px;
 }
@@ -832,7 +836,7 @@
 	font-size: 16px;
 	line-height: 24px;
 	padding: 0px 0px;
-	color: rgba(0, 0, 0, 0.6);
+	color: var(--md-sys-color-on-surface);
 	font-weight: 500;
 	padding: 0px 24px 0px 24px;
 }
@@ -1043,6 +1047,7 @@
 	transition: all 0.3s cubic-bezier(0.4, 0.0, 0.2, 1);
 	outline: none;
 	background-color: transparent;
+	color: var(--md-sys-color-on-surface);
 }
 
 .input:focus

themes/material-design/reading.css

@@ -321,22 +321,27 @@
 .reading-bookmark, .menu-tracking-sites, .menu-tracking-sites-empty
 {
 	padding: 0px 24px;
-	color: #777;
+	color: color-mix(in srgb, var(--md-sys-color-on-surface), transparent 50%);
 	text-overflow: ellipsis;
 	overflow: hidden;
 	white-space: nowrap;
 	word-wrap: normal;
 }
 
+.reading-bookmark
+{
+	padding: 4px 24px;
+}
+
 .menu-tracking-sites
 {
-	padding: 8px 24px;
+	padding: 6px 24px;
 }
 
 .reading-bookmark > span, .menu-tracking-sites > span, .menu-tracking-sites-empty > span
 {
 	padding-right: 6px;
-	color: #333;
+	color: var(--md-sys-color-on-surface);
 }
 
 .menu-tracking-sites > span
@@ -365,6 +370,11 @@
 	float: left;
 }
 
+.menu-tracking-sites.favorite i.menu-simple-icon-last
+{
+	font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
+}
+
 /* Tracking */
 
 .tracking-search

themes/material-design/theme.css

@@ -882,7 +882,7 @@ body .preload
 .menu-simple-separator-min
 {
 	margin-left: 24px;
-	width: calc(100% - 24px)
+	width: calc(100% - 48px)
 }
 
 .dialog-text .menu-simple-separator