From b68a850750a1cd17e10978182fe8b93690b2ef89 Mon Sep 17 00:00:00 2001 From: Jiiks Date: Wed, 25 May 2016 22:14:03 +0300 Subject: [PATCH] Added loading/update splash base and quit modal --- Installers/Electron/src/data/css/main.css | 92 +++++++++++++++++++++++ Installers/Electron/src/data/index.html | 33 ++++++-- Installers/Electron/src/data/js/main.js | 31 +++++++- Installers/Electron/src/data/js/splash.js | 4 + Installers/Electron/src/data/splash.html | 15 ++++ Installers/Electron/src/main.js | 38 +++++++--- 6 files changed, 193 insertions(+), 20 deletions(-) create mode 100644 Installers/Electron/src/data/js/splash.js create mode 100644 Installers/Electron/src/data/splash.html diff --git a/Installers/Electron/src/data/css/main.css b/Installers/Electron/src/data/css/main.css index 651d90c..6c357e5 100644 --- a/Installers/Electron/src/data/css/main.css +++ b/Installers/Electron/src/data/css/main.css @@ -222,4 +222,96 @@ input.path { border-width: 1px 0px 0px 1px; border-style: solid; border-color: #111; +} + +.modal { + position: absolute; + background: rgba(29, 29, 29, 0.71); + top: 0; + left: 0; + right: 0; + bottom: 0; + z-index: 900000; +} + +.modal-container { + background: #212229; + width: 600px; + height: 200px; + position: relative; + margin: auto; + top: 100px; + box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.39); +} + +.modal-header { + height: 30px; + line-height: 30px; + background: #212229; + padding-left: 10px; + border-bottom: 1px solid #000; + box-shadow: 0 1px 0 0 #303030; +} + +.modal-body { + padding:30px; +} + +.modal-footer { + position: absolute; + bottom: 0; + left:0; + right: 0; + height: 35px; + padding-top:10px; + background:#212229; + box-shadow: 0 1px 0 0 #303030 inset; + border-top: 1px solid #000; +} + +.modal-footer button { + margin-right:5px; + float: right; +} + +.splash { + width:300px !important; + height:100px !important; +} +.splash .wrapper { + top:20px; + width:40px; + margin:auto; + position:relative; +} +.splash .wrapper .spinner { + width:30px; + height:30px; + border-radius:30px; + border-width:5px; + border-color:#121212 #404040 #404040 #404040; + border-style:solid; + animation: spin 0.7s linear infinite; +} +.splash .spinnertext { + position: absolute; + bottom: 0; + width: 100%; + display: block; + text-align: center; + bottom: 10px; + color: rgb(171, 171, 171); + -webkit-animation: spinnertext-opacity 2s linear 0s infinite; +} + +@-webkit-keyframes spin { + 100% { + transform: rotate(360deg); + } +} +@-webkit-keyframes spinnertext-opacity { + 0% {opacity: 0} + 20% {opacity: 0} + 50% {opacity: 1} + 100%{opacity: 0} } \ No newline at end of file diff --git a/Installers/Electron/src/data/index.html b/Installers/Electron/src/data/index.html index 12f0c23..e7ad2a3 100644 --- a/Installers/Electron/src/data/index.html +++ b/Installers/Electron/src/data/index.html @@ -1,8 +1,6 @@ - -
@@ -17,10 +15,10 @@
    -
  • Introduction
    • -
  • License
    • -
  • Destination
    • -
  • Installation
    • + + + +
@@ -74,6 +72,27 @@
+ - + + \ No newline at end of file diff --git a/Installers/Electron/src/data/js/main.js b/Installers/Electron/src/data/js/main.js index 8f171cf..026b82a 100644 --- a/Installers/Electron/src/data/js/main.js +++ b/Installers/Electron/src/data/js/main.js @@ -7,7 +7,6 @@ $(function() { var currentPanel = 0; $("#accept").on("change", function() { - console.log("WTF"); $("#next").prop("disabled", true); if($(this).prop("checked")) { $("#next").prop("disabled", false); @@ -40,6 +39,8 @@ $(function() { } }); + $("#cancel").on("click", quit); + $("#licensetext").on("scroll", function() { var e = $(this); if(e.height() + e.scrollTop() >= e[0].scrollHeight) { @@ -59,20 +60,48 @@ $(function() { $("#next").show(); $("#next").text("Next"); $("#next").prop("disabled", false); + $(".navli").removeClass("active").removeClass("visited"); + $("#li-0").addClass("active").removeClass("visited"); + $("#li-1").removeClass("active").removeClass("visited"); break; case 1: $("#back").show(); $("#next").text("Next"); $("#next").prop("disabled", !$("#accept").prop("checked")); + $("#li-0").addClass("visited").removeClass("active"); + $("#li-1").addClass("active").removeClass("visited"); + $("#li-2").removeClass("active").removeClass("visited"); break; case 2: $("#back").show(); $("#next").show(); $("#next").text("Install"); + $("#li-1").addClass("visited").removeClass("active"); + $("#li-2").addClass("active").removeClass("visited"); + $("#li-3").removeClass("active"); + break; + case 3: + $("#li-2").removeClass("active").addClass("visited"); + $("#li-3").addClass("active"); break; } } + $(".modal").on("click", function(e) { + if(e.target.className != "modal") return; + $(this).hide(); + }); + $("#modal-cancel").on("click", function() { + $(".modal").hide(); + }); + $("#modal-exit").on("click", function() { + ipcRenderer.send('sync', 'quit'); + }); + + function quit() { + $("#quit").show(); + } + $("#discordPath").val(ipcRenderer.sendSync('sync', 'getInstallPath')); })(); \ No newline at end of file diff --git a/Installers/Electron/src/data/js/splash.js b/Installers/Electron/src/data/js/splash.js new file mode 100644 index 0000000..58a3bca --- /dev/null +++ b/Installers/Electron/src/data/js/splash.js @@ -0,0 +1,4 @@ +'use strict'; + +const ipcRenderer = require('electron').ipcRenderer; + diff --git a/Installers/Electron/src/data/splash.html b/Installers/Electron/src/data/splash.html new file mode 100644 index 0000000..23e0745 --- /dev/null +++ b/Installers/Electron/src/data/splash.html @@ -0,0 +1,15 @@ + + + + + + + + + +
+ +
+ Checking for updates... + + \ No newline at end of file diff --git a/Installers/Electron/src/main.js b/Installers/Electron/src/main.js index fd3c368..22b7f49 100644 --- a/Installers/Electron/src/main.js +++ b/Installers/Electron/src/main.js @@ -11,23 +11,34 @@ const {dialog} = require('electron'); var installPath = process.platform == "win32" ? process.env.LOCALAPPDATA + "\\Discord\\app-0.0.290\\" : process.platform == "darwin" ? "\\Applications\\Discord.app\\" : ""; -function createWindow() { +function loadMain() { var width = 800; var height = 400; + mainWindow.setSize(width, height); + mainWindow.center(); + mainWindow.loadURL('file://' + __dirname + '/data/index.html'); +} + +function createSplash() { + var width = 300; + var height = 100; mainWindow = new BrowserWindow({ width: width, - height: height, - maxWidth: width, - maxHeight: height, - minWidth: width, - minHeight: height, + height: height, fullscreenable: false, maximizable: false, - frame: false + frame: false, + resizable: false, + alwaysOnTop: true }); - mainWindow.loadURL('file://' + __dirname + '/data/index.html'); + mainWindow.loadURL('file://' + __dirname + '/data/splash.html'); + loadMain(); +} + +function quit() { + app.quit(); } ipcMain.on('sync', function(event, arg) { @@ -44,10 +55,13 @@ ipcMain.on('sync', function(event, arg) { case "getInstallPath": event.returnValue = installPath; break; + case "loadMain": + loadMain(); + break; + case 'quit': + quit(); + break; } }); - - - -app.on('ready', createWindow); \ No newline at end of file +app.on('ready', createSplash); \ No newline at end of file