added external link button and changed string

"Info" -> "View", along with a button in the previewer to open the mod
page in the browser if you so choose.

5 files changed, 20 insertions, 6 deletions

diff --git a/src/app/browser.js b/src/app/browser.js
index 5a5a752..138aef8 100644
--- a/src/app/browser.js
+++ b/src/app/browser.js
@@ -244,6 +244,10 @@ var Browser = {
 	}
 }
 
+function openExternal(url) {
+	require("electron").shell.openExternal(url);
+}
+
 var view = document.querySelector(".popup#preview webview");
 var Preview = {
 	show: () => {
@@ -255,6 +259,7 @@ var Preview = {
 	set: (url, autoshow) => {
 		if (autoshow != false) {Preview.show()}
 		view.src = url;
+		document.querySelector("#preview #external").setAttribute("onclick", `openExternal("${url}")`);
 	}
 }
 
@@ -340,7 +345,7 @@ function BrowserEl(properties) {
 			<div class="title">${properties.title}</div>
 			<div class="description">${properties.description}</div>
 			<button class="install" onclick='installFromURL("${properties.download}", ${JSON.stringify(properties.dependencies)}, true)'>${installstr}</button>
-			<button class="info" onclick="Preview.set('${properties.url}')">${lang('gui.browser.info')}</button>
+			<button class="info" onclick="Preview.set('${properties.url}')">${lang('gui.browser.view')}</button>
 			<button class="visual">${properties.version}</button>
 			<button class="visual">${lang("gui.browser.madeby")} ${properties.author}</button>
 		</div>
diff --git a/src/app/icons/external.png b/src/app/icons/external.png
new file mode 100644
index 0000000..0b4f99e
--- /dev/null
+++ b/src/app/icons/external.png
diff --git a/src/app/index.html b/src/app/index.html
index b146ba3..f67a7a8 100644
--- a/src/app/index.html
+++ b/src/app/index.html
@@ -134,10 +134,13 @@
 			</div>
 		</div>
 		<div class="popup small" id="preview">
-			<div class="misc fixed">
+			<div class="misc fixed vertical">
 				<button id="close" onclick="Preview.hide()">
 					<img src="icons/close.png">
 				</button>
+				<button id="external" onclick="">
+					<img src="icons/external.png">
+				</button>
 			</div>
 			<webview></webview>
 		</div>
diff --git a/src/app/main.css b/src/app/main.css
index e4c6a2c..903c03e 100644
--- a/src/app/main.css
+++ b/src/app/main.css
@@ -123,10 +123,6 @@ button {
 	width: calc(50% - var(--spacing) * 4);
 }
 
-.popup#preview #close {
-	margin: var(--spacing) var(--spacing) 0 auto !important;
-}
-
 .popup .misc, .popup #search, .option .actions input {
 	--height: var(--mischeight);
 }
@@ -135,6 +131,10 @@ button {
 	display: flex;
 }
 
+.popup .misc.vertical {
+	display: block;
+}
+
 .popup .misc.fixed {
 	width: 100%;
 	position: fixed;
@@ -177,6 +177,11 @@ button {
 	margin-left: 0px !important;
 }
 
+.popup#preview #close,
+.popup .misc.vertical button {
+	margin: var(--spacing) var(--spacing) 0 auto !important;
+}
+
 .popup .loading {
 	width: 100%;
 	color: white;
diff --git a/src/lang/en.json b/src/lang/en.json
index 345a83c..2c068ac 100644
--- a/src/lang/en.json
+++ b/src/lang/en.json
@@ -71,6 +71,7 @@
 	"gui.mods.confirmdependencies": "This package has dependencies, shown below, clicking \"Ok\" will install the package and the dependencies.\n\n",
 
 	"gui.browser.info": "Info",
+	"gui.browser.view": "View",
 	"gui.browser.madeby": "by",
 	"gui.browser.search": "Search...",
 	"gui.browser.update": "Update",