From d5691ad264c292cc4f724913787324156069b21f Mon Sep 17 00:00:00 2001 From: felix Date: Tue, 31 May 2022 22:41:46 +0000 Subject: [PATCH] update according to webpack changes, replace collapsable navbar with simple links, add download button, import socket.io.client from bundle, fix weird styling issues after dependencies update --- src/frontend/app.js | 7 ++++--- src/frontend/common.js | 1 + src/frontend/index.ejs | 10 +++++----- src/frontend/scss/app.scss | 11 +++++++++-- src/frontend/sheets.ejs | 6 +++--- src/frontend/views/head.html | 3 +-- src/frontend/views/menu.html | 31 ++++++++++++++----------------- src/main.js | 16 ++++++++++------ 8 files changed, 47 insertions(+), 38 deletions(-) diff --git a/src/frontend/app.js b/src/frontend/app.js index 95fe22c..ab76775 100644 --- a/src/frontend/app.js +++ b/src/frontend/app.js @@ -211,10 +211,10 @@ function updateDownloadLink(){ } function tableClickListener(){ - $( "tbody tr").unbind(); - $( "tbody tr").hover(function(){ + $( "tbody tr td").unbind(); + $( "tbody tr td").hover(function(){ let selected = $(this).hasClass("ui-state-highlight"); - $("tbody tr").removeClass("ui-state-highlight"); + $("tbody tr td").removeClass("ui-state-highlight"); if (!selected) { $(this).addClass("ui-state-highlight"); } @@ -278,6 +278,7 @@ Player.prototype = { requestAnimationFrame(self.step.bind(self)); }, onload: function() { + console.log(sound.duration()) $( '#txt-duration' ).text(self.formatTime(Math.round(sound.duration()))); $( '#playBtn' ).prop("disabled", false); $( '#downloadBtn' ).prop("disabled", false); diff --git a/src/frontend/common.js b/src/frontend/common.js index b21f990..80b1af1 100644 --- a/src/frontend/common.js +++ b/src/frontend/common.js @@ -1,5 +1,6 @@ import './scss/app.scss'; import 'bootstrap'; +const io = require('socket.io-client') //adding the fontawesome icons import { library, dom } from "@fortawesome/fontawesome-svg-core"; diff --git a/src/frontend/index.ejs b/src/frontend/index.ejs index 0f464f9..4025998 100644 --- a/src/frontend/index.ejs +++ b/src/frontend/index.ejs @@ -2,17 +2,17 @@ SlowDowner - ${require ('./views/head.html')} + <%= require('./views/head.html').default %> - ${require ('./views/menu.html')} + <%= require('./views/menu.html').default %>
- +
@@ -27,7 +27,7 @@

0:00

-

0:00

+

0:00

@@ -66,7 +66,7 @@
- ${require ('./views/footer.html')} + <%= require('./views/footer.html').default %> diff --git a/src/frontend/scss/app.scss b/src/frontend/scss/app.scss index 53ac571..df05d9f 100644 --- a/src/frontend/scss/app.scss +++ b/src/frontend/scss/app.scss @@ -5,6 +5,7 @@ /* Colors */ $secondary-color: #456632; $bg-dark: #343a40; +$bg-grey: #fefefe; /* scss */ @@ -25,6 +26,7 @@ $bg-dark: #343a40; body { font: 13px Helvetica, Arial; + background-color: $bg-grey; } .container-fluid { @@ -32,6 +34,10 @@ body { min-width: 25em; } +.nav-link{ + color: $bg-grey; +} + .info-txt{ font-size: 1.5em; } @@ -41,7 +47,8 @@ body { } .btn{ - font-size: 1.8em; + font-size: 1.8em; + width: 2em; } #txt-duration-label { @@ -123,6 +130,6 @@ body { } .ui-state-highlight { - color: #FFFFFF !important; + color: #FFF !important; background: $bg-dark !important; } diff --git a/src/frontend/sheets.ejs b/src/frontend/sheets.ejs index 92a34df..fb8e742 100644 --- a/src/frontend/sheets.ejs +++ b/src/frontend/sheets.ejs @@ -2,10 +2,10 @@ Noten - ${require ('./views/head.html')} + <%= require('./views/head.html').default %> - ${require ('./views/menu.html')} + <%= require('./views/menu.html').default %>
@@ -30,7 +30,7 @@
- ${require ('./views/footer.html')} + <%= require('./views/footer.html').default %>
diff --git a/src/frontend/views/head.html b/src/frontend/views/head.html index 7822926..d00b992 100644 --- a/src/frontend/views/head.html +++ b/src/frontend/views/head.html @@ -1,4 +1,3 @@ - - \ No newline at end of file + \ No newline at end of file diff --git a/src/frontend/views/menu.html b/src/frontend/views/menu.html index e9531f2..ee795e6 100644 --- a/src/frontend/views/menu.html +++ b/src/frontend/views/menu.html @@ -1,20 +1,17 @@ -
Stücke