From 0f45414a0128415f29aaeb16f04af64a0ab15f75 Mon Sep 17 00:00:00 2001 From: Matt Thompson Date: Fri, 21 Oct 2022 09:33:56 -0500 Subject: [PATCH 01/23] add robohash avatar set to config options --- index.html | 8 ++++---- js/main.js | 22 ++++++++++++++-------- 2 files changed, 18 insertions(+), 12 deletions(-) diff --git a/index.html b/index.html index 4222111..06d89fb 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,7 @@ - + @@ -541,9 +541,9 @@

Playlist Import Machine

- - - + + + diff --git a/js/main.js b/js/main.js index 7dcace1..43878e8 100644 --- a/js/main.js +++ b/js/main.js @@ -3,6 +3,7 @@ var firetable = { loggedIn: false, uid: null, uname: null, + avatarset: "set1", pvCount: 0, playdex: 0, users: {}, @@ -182,6 +183,8 @@ firetable.init = function() { $("#idtitle").text(ftconfigs.roomName); $("#welcomeName").text(ftconfigs.roomName); +if (ftconfigs.avatarset) firetable.avatarset = ftconfigs.avatarset; + if (ftconfigs.facebookURL){ $(".sociallogo.facebook").attr("href", ftconfigs.facebookURL); $(".sociallogo.facebook").css("display", "inline-block"); @@ -457,6 +460,9 @@ firetable.actions = { } if (data.image == "img/idlogo.png" && ftconfigs.defaultAlbumArtUrl.length) data.image = ftconfigs.defaultAlbumArtUrl; + var set = "set1"; + if (data.avatarset) set = data.avatarset; + var canvas = document.getElementById('cardMaker' + chatid); if (canvas.getContext) { @@ -534,7 +540,7 @@ firetable.actions = { }; picboy2.src = data.image; }; - picboy.src = 'https://indiediscotheque.com/robots/' + data.djid + data.djname + '.png?size=175x175'; + picboy.src = 'https://indiediscotheque.com/robots/' + data.djid + data.djname + '.png?size=175x175&set='+set; }; @@ -612,7 +618,7 @@ firetable.actions = { }; picboy.src = 'img/id9.png'; }; - eight.src = 'https://indiediscotheque.com/robots/' + data.djid + data.djname + '.png?size=110x110'; + eight.src = 'https://indiediscotheque.com/robots/' + data.djid + data.djname + '.png?size=110x110&set='+set; }; cake.src = 'img/arnold.png'; } @@ -1309,7 +1315,7 @@ firetable.utilities = { Notification.requestPermission(); } else { var notification = new Notification(namebo, { - icon: "https://indiediscotheque.com/robots/" + chatData.id + namebo + ".png?size=110x110", + icon: "https://indiediscotheque.com/robots/" + chatData.id + namebo + ".png?size=110x110&set="+firetable.avatarset, body: chatData.txt, }); } @@ -1977,7 +1983,7 @@ firetable.ui = { cnt = countr; var removeMe = ""; if (data[key].removeAfter) removeMe = "departure_board" - ok1 += "
" + countr + ". " + data[key].name + " " + removeMe + "
"; + ok1 += "
" + countr + ". " + data[key].name + " " + removeMe + "
"; countr++; } } @@ -1994,7 +2000,7 @@ firetable.ui = { var removeMe = ""; if (data[key].removeAfter) removeMe = "departure_board" - ok1 += "
" + removeMe + " " + data[key].name + "
" + data[key].plays + "/" + firetable.playlimit + "
"; + ok1 += "
" + removeMe + " " + data[key].name + "
" + data[key].plays + "/" + firetable.playlimit + "
"; countr++; } } @@ -2091,7 +2097,7 @@ firetable.ui = { var newUserToAddX = $("
"); newUserToAddX.addClass("prson " + block); newUserToAddX.attr("id", "user" + data.userid); - newUserToAddX.html("
" + blockcon + "" + herecon + "
" + data.username + "" + rolename + "joined " + firetable.utilities.format_date(data.joined) + ""); + newUserToAddX.html("
" + blockcon + "" + herecon + "
" + data.username + "" + rolename + "joined " + firetable.utilities.format_date(data.joined) + ""); firetable.utilities.chatAt(newUserToAddX); // adds the click event to @ the user $(destination).append(newUserToAddX); }); @@ -2133,7 +2139,7 @@ firetable.ui = { destination = "#usersBot"; } - $("#user" + data.userid).html("
" + blockcon + "" + herecon + "
" + data.username + "" + rolename + "joined " + firetable.utilities.format_date(data.joined) + ""); + $("#user" + data.userid).html("
" + blockcon + "" + herecon + "
" + data.username + "" + rolename + "joined " + firetable.utilities.format_date(data.joined) + ""); }); ftapi.events.on("usersChanged", function(okdata) { if ($("#loggedInName").text() == ftapi.uid) { @@ -2223,7 +2229,7 @@ firetable.ui = { } else { var $chatthing = $chatTemplate.clone(); $chatthing.attr('id', "chat" + chatData.chatID); - $chatthing.find('.botson').css('background-image', "url(https://indiediscotheque.com/robots/" + chatData.id + namebo + ".png?size=110x110"); + $chatthing.find('.botson').css('background-image', "url(https://indiediscotheque.com/robots/" + chatData.id + namebo + ".png?size=110x110&set="+firetable.avatarset); $chatthing.find('.utitle').html(utitle); $chatthing.find('.chatTime').attr('id', "chatTime" + chatData.chatID).html(firetable.utilities.format_time(chatData.time)); if (badoop) $chatthing.addClass('badoop'); From 005fdaa1a3abbca093dc1ea9d15706c2c2fe59bc Mon Sep 17 00:00:00 2001 From: Matt Thompson Date: Fri, 21 Oct 2022 09:48:10 -0500 Subject: [PATCH 02/23] tweak trading card avatar set val name --- index.html | 8 ++++---- js/main.js | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/index.html b/index.html index 06d89fb..b62cf96 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,7 @@ - + @@ -541,9 +541,9 @@

Playlist Import Machine

- - - + + + diff --git a/js/main.js b/js/main.js index 43878e8..b95f6ef 100644 --- a/js/main.js +++ b/js/main.js @@ -461,7 +461,7 @@ firetable.actions = { if (data.image == "img/idlogo.png" && ftconfigs.defaultAlbumArtUrl.length) data.image = ftconfigs.defaultAlbumArtUrl; var set = "set1"; - if (data.avatarset) set = data.avatarset; + if (data.set) set = data.avatarset; var canvas = document.getElementById('cardMaker' + chatid); From 6982440318eb9a486937e45e8c4ef156e8648da0 Mon Sep 17 00:00:00 2001 From: Matt Thompson Date: Fri, 21 Oct 2022 09:52:39 -0500 Subject: [PATCH 03/23] upversion --- index.html | 8 ++++---- js/main.js | 2 +- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/index.html b/index.html index b62cf96..5c2e405 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,7 @@ - + @@ -541,9 +541,9 @@

Playlist Import Machine

- - - + + + diff --git a/js/main.js b/js/main.js index b95f6ef..6d2101c 100644 --- a/js/main.js +++ b/js/main.js @@ -461,7 +461,7 @@ firetable.actions = { if (data.image == "img/idlogo.png" && ftconfigs.defaultAlbumArtUrl.length) data.image = ftconfigs.defaultAlbumArtUrl; var set = "set1"; - if (data.set) set = data.avatarset; + if (data.set) set = data.set; var canvas = document.getElementById('cardMaker' + chatid); From 97c58176ef20acc6739210528ccaf1d220db671a Mon Sep 17 00:00:00 2001 From: CJ Yancey Date: Mon, 9 Jan 2023 15:43:29 -0800 Subject: [PATCH 04/23] Change the twitter emoji CDN The MaxCDN link broke. --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index 5c2e405..3fcb15a 100644 --- a/index.html +++ b/index.html @@ -527,7 +527,7 @@

Playlist Import Machine

- + From 270d35d7a2924f0522bfc740bda0ae1093e0d036 Mon Sep 17 00:00:00 2001 From: Matt Thompson Date: Mon, 9 Jan 2023 18:11:58 -0600 Subject: [PATCH 05/23] hello twemoji --- index.html | 2 +- js/twemoji.js | 2 ++ 2 files changed, 3 insertions(+), 1 deletion(-) create mode 100644 js/twemoji.js diff --git a/index.html b/index.html index 3fcb15a..5e27597 100644 --- a/index.html +++ b/index.html @@ -527,7 +527,7 @@

Playlist Import Machine

- + diff --git a/js/twemoji.js b/js/twemoji.js new file mode 100644 index 0000000..a95ab20 --- /dev/null +++ b/js/twemoji.js @@ -0,0 +1,2 @@ +/*! Copyright Twitter Inc. and other contributors. Licensed under MIT */ +var twemoji=function(){"use strict";var twemoji={base:"https://cdn.jsdelivr.net/gh/twitter/twemoji/assets/",ext:".png",size:"72x72",className:"emoji",convert:{fromCodePoint:fromCodePoint,toCodePoint:toCodePoint},onerror:function onerror(){if(this.parentNode){this.parentNode.replaceChild(createText(this.alt,false),this)}},parse:parse,replace:replace,test:test},escaper={"&":"&","<":"<",">":">","'":"'",'"':"""},re=/(?:\ud83d\udc68\ud83c\udffb\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc68\ud83c\udffc\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc68\ud83c\udffd\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc68\ud83c\udffe\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc68\ud83c\udfff\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udffb\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udffb\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d\udc69\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udffc\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udffc\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d\udc69\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udffd\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udffd\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d\udc69\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udffe\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udffe\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d\udc69\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udfff\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udfff\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d\udc69\ud83c[\udffb-\udfff]|\ud83e\uddd1\ud83c\udffb\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83e\uddd1\ud83c[\udffc-\udfff]|\ud83e\uddd1\ud83c\udffc\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83e\uddd1\ud83c[\udffb\udffd-\udfff]|\ud83e\uddd1\ud83c\udffd\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83e\uddd1\ud83c[\udffb\udffc\udffe\udfff]|\ud83e\uddd1\ud83c\udffe\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83e\uddd1\ud83c[\udffb-\udffd\udfff]|\ud83e\uddd1\ud83c\udfff\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83e\uddd1\ud83c[\udffb-\udffe]|\ud83d\udc68\ud83c\udffb\u200d\u2764\ufe0f\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc68\ud83c\udffb\u200d\ud83e\udd1d\u200d\ud83d\udc68\ud83c[\udffc-\udfff]|\ud83d\udc68\ud83c\udffc\u200d\u2764\ufe0f\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc68\ud83c\udffc\u200d\ud83e\udd1d\u200d\ud83d\udc68\ud83c[\udffb\udffd-\udfff]|\ud83d\udc68\ud83c\udffd\u200d\u2764\ufe0f\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc68\ud83c\udffd\u200d\ud83e\udd1d\u200d\ud83d\udc68\ud83c[\udffb\udffc\udffe\udfff]|\ud83d\udc68\ud83c\udffe\u200d\u2764\ufe0f\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc68\ud83c\udffe\u200d\ud83e\udd1d\u200d\ud83d\udc68\ud83c[\udffb-\udffd\udfff]|\ud83d\udc68\ud83c\udfff\u200d\u2764\ufe0f\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc68\ud83c\udfff\u200d\ud83e\udd1d\u200d\ud83d\udc68\ud83c[\udffb-\udffe]|\ud83d\udc69\ud83c\udffb\u200d\u2764\ufe0f\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udffb\u200d\u2764\ufe0f\u200d\ud83d\udc69\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udffb\u200d\ud83e\udd1d\u200d\ud83d\udc68\ud83c[\udffc-\udfff]|\ud83d\udc69\ud83c\udffb\u200d\ud83e\udd1d\u200d\ud83d\udc69\ud83c[\udffc-\udfff]|\ud83d\udc69\ud83c\udffc\u200d\u2764\ufe0f\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udffc\u200d\u2764\ufe0f\u200d\ud83d\udc69\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udffc\u200d\ud83e\udd1d\u200d\ud83d\udc68\ud83c[\udffb\udffd-\udfff]|\ud83d\udc69\ud83c\udffc\u200d\ud83e\udd1d\u200d\ud83d\udc69\ud83c[\udffb\udffd-\udfff]|\ud83d\udc69\ud83c\udffd\u200d\u2764\ufe0f\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udffd\u200d\u2764\ufe0f\u200d\ud83d\udc69\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udffd\u200d\ud83e\udd1d\u200d\ud83d\udc68\ud83c[\udffb\udffc\udffe\udfff]|\ud83d\udc69\ud83c\udffd\u200d\ud83e\udd1d\u200d\ud83d\udc69\ud83c[\udffb\udffc\udffe\udfff]|\ud83d\udc69\ud83c\udffe\u200d\u2764\ufe0f\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udffe\u200d\u2764\ufe0f\u200d\ud83d\udc69\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udffe\u200d\ud83e\udd1d\u200d\ud83d\udc68\ud83c[\udffb-\udffd\udfff]|\ud83d\udc69\ud83c\udffe\u200d\ud83e\udd1d\u200d\ud83d\udc69\ud83c[\udffb-\udffd\udfff]|\ud83d\udc69\ud83c\udfff\u200d\u2764\ufe0f\u200d\ud83d\udc68\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udfff\u200d\u2764\ufe0f\u200d\ud83d\udc69\ud83c[\udffb-\udfff]|\ud83d\udc69\ud83c\udfff\u200d\ud83e\udd1d\u200d\ud83d\udc68\ud83c[\udffb-\udffe]|\ud83d\udc69\ud83c\udfff\u200d\ud83e\udd1d\u200d\ud83d\udc69\ud83c[\udffb-\udffe]|\ud83e\uddd1\ud83c\udffb\u200d\u2764\ufe0f\u200d\ud83e\uddd1\ud83c[\udffc-\udfff]|\ud83e\uddd1\ud83c\udffb\u200d\ud83e\udd1d\u200d\ud83e\uddd1\ud83c[\udffb-\udfff]|\ud83e\uddd1\ud83c\udffc\u200d\u2764\ufe0f\u200d\ud83e\uddd1\ud83c[\udffb\udffd-\udfff]|\ud83e\uddd1\ud83c\udffc\u200d\ud83e\udd1d\u200d\ud83e\uddd1\ud83c[\udffb-\udfff]|\ud83e\uddd1\ud83c\udffd\u200d\u2764\ufe0f\u200d\ud83e\uddd1\ud83c[\udffb\udffc\udffe\udfff]|\ud83e\uddd1\ud83c\udffd\u200d\ud83e\udd1d\u200d\ud83e\uddd1\ud83c[\udffb-\udfff]|\ud83e\uddd1\ud83c\udffe\u200d\u2764\ufe0f\u200d\ud83e\uddd1\ud83c[\udffb-\udffd\udfff]|\ud83e\uddd1\ud83c\udffe\u200d\ud83e\udd1d\u200d\ud83e\uddd1\ud83c[\udffb-\udfff]|\ud83e\uddd1\ud83c\udfff\u200d\u2764\ufe0f\u200d\ud83e\uddd1\ud83c[\udffb-\udffe]|\ud83e\uddd1\ud83c\udfff\u200d\ud83e\udd1d\u200d\ud83e\uddd1\ud83c[\udffb-\udfff]|\ud83d\udc68\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d\udc68|\ud83d\udc69\u200d\u2764\ufe0f\u200d\ud83d\udc8b\u200d\ud83d[\udc68\udc69]|\ud83e\udef1\ud83c\udffb\u200d\ud83e\udef2\ud83c[\udffc-\udfff]|\ud83e\udef1\ud83c\udffc\u200d\ud83e\udef2\ud83c[\udffb\udffd-\udfff]|\ud83e\udef1\ud83c\udffd\u200d\ud83e\udef2\ud83c[\udffb\udffc\udffe\udfff]|\ud83e\udef1\ud83c\udffe\u200d\ud83e\udef2\ud83c[\udffb-\udffd\udfff]|\ud83e\udef1\ud83c\udfff\u200d\ud83e\udef2\ud83c[\udffb-\udffe]|\ud83d\udc68\u200d\u2764\ufe0f\u200d\ud83d\udc68|\ud83d\udc69\u200d\u2764\ufe0f\u200d\ud83d[\udc68\udc69]|\ud83e\uddd1\u200d\ud83e\udd1d\u200d\ud83e\uddd1|\ud83d\udc6b\ud83c[\udffb-\udfff]|\ud83d\udc6c\ud83c[\udffb-\udfff]|\ud83d\udc6d\ud83c[\udffb-\udfff]|\ud83d\udc8f\ud83c[\udffb-\udfff]|\ud83d\udc91\ud83c[\udffb-\udfff]|\ud83e\udd1d\ud83c[\udffb-\udfff]|\ud83d[\udc6b-\udc6d\udc8f\udc91]|\ud83e\udd1d)|(?:\ud83d[\udc68\udc69]|\ud83e\uddd1)(?:\ud83c[\udffb-\udfff])?\u200d(?:\u2695\ufe0f|\u2696\ufe0f|\u2708\ufe0f|\ud83c[\udf3e\udf73\udf7c\udf84\udf93\udfa4\udfa8\udfeb\udfed]|\ud83d[\udcbb\udcbc\udd27\udd2c\ude80\ude92]|\ud83e[\uddaf-\uddb3\uddbc\uddbd])|(?:\ud83c[\udfcb\udfcc]|\ud83d[\udd74\udd75]|\u26f9)((?:\ud83c[\udffb-\udfff]|\ufe0f)\u200d[\u2640\u2642]\ufe0f)|(?:\ud83c[\udfc3\udfc4\udfca]|\ud83d[\udc6e\udc70\udc71\udc73\udc77\udc81\udc82\udc86\udc87\ude45-\ude47\ude4b\ude4d\ude4e\udea3\udeb4-\udeb6]|\ud83e[\udd26\udd35\udd37-\udd39\udd3d\udd3e\uddb8\uddb9\uddcd-\uddcf\uddd4\uddd6-\udddd])(?:\ud83c[\udffb-\udfff])?\u200d[\u2640\u2642]\ufe0f|(?:\ud83d\udc68\u200d\ud83d\udc68\u200d\ud83d\udc66\u200d\ud83d\udc66|\ud83d\udc68\u200d\ud83d\udc68\u200d\ud83d\udc67\u200d\ud83d[\udc66\udc67]|\ud83d\udc68\u200d\ud83d\udc69\u200d\ud83d\udc66\u200d\ud83d\udc66|\ud83d\udc68\u200d\ud83d\udc69\u200d\ud83d\udc67\u200d\ud83d[\udc66\udc67]|\ud83d\udc69\u200d\ud83d\udc69\u200d\ud83d\udc66\u200d\ud83d\udc66|\ud83d\udc69\u200d\ud83d\udc69\u200d\ud83d\udc67\u200d\ud83d[\udc66\udc67]|\ud83d\udc68\u200d\ud83d\udc66\u200d\ud83d\udc66|\ud83d\udc68\u200d\ud83d\udc67\u200d\ud83d[\udc66\udc67]|\ud83d\udc68\u200d\ud83d\udc68\u200d\ud83d[\udc66\udc67]|\ud83d\udc68\u200d\ud83d\udc69\u200d\ud83d[\udc66\udc67]|\ud83d\udc69\u200d\ud83d\udc66\u200d\ud83d\udc66|\ud83d\udc69\u200d\ud83d\udc67\u200d\ud83d[\udc66\udc67]|\ud83d\udc69\u200d\ud83d\udc69\u200d\ud83d[\udc66\udc67]|\ud83c\udff3\ufe0f\u200d\u26a7\ufe0f|\ud83c\udff3\ufe0f\u200d\ud83c\udf08|\ud83d\ude36\u200d\ud83c\udf2b\ufe0f|\u2764\ufe0f\u200d\ud83d\udd25|\u2764\ufe0f\u200d\ud83e\ude79|\ud83c\udff4\u200d\u2620\ufe0f|\ud83d\udc15\u200d\ud83e\uddba|\ud83d\udc3b\u200d\u2744\ufe0f|\ud83d\udc41\u200d\ud83d\udde8|\ud83d\udc68\u200d\ud83d[\udc66\udc67]|\ud83d\udc69\u200d\ud83d[\udc66\udc67]|\ud83d\udc6f\u200d\u2640\ufe0f|\ud83d\udc6f\u200d\u2642\ufe0f|\ud83d\ude2e\u200d\ud83d\udca8|\ud83d\ude35\u200d\ud83d\udcab|\ud83e\udd3c\u200d\u2640\ufe0f|\ud83e\udd3c\u200d\u2642\ufe0f|\ud83e\uddde\u200d\u2640\ufe0f|\ud83e\uddde\u200d\u2642\ufe0f|\ud83e\udddf\u200d\u2640\ufe0f|\ud83e\udddf\u200d\u2642\ufe0f|\ud83d\udc08\u200d\u2b1b)|[#*0-9]\ufe0f?\u20e3|(?:[©®\u2122\u265f]\ufe0f)|(?:\ud83c[\udc04\udd70\udd71\udd7e\udd7f\ude02\ude1a\ude2f\ude37\udf21\udf24-\udf2c\udf36\udf7d\udf96\udf97\udf99-\udf9b\udf9e\udf9f\udfcd\udfce\udfd4-\udfdf\udff3\udff5\udff7]|\ud83d[\udc3f\udc41\udcfd\udd49\udd4a\udd6f\udd70\udd73\udd76-\udd79\udd87\udd8a-\udd8d\udda5\udda8\uddb1\uddb2\uddbc\uddc2-\uddc4\uddd1-\uddd3\udddc-\uddde\udde1\udde3\udde8\uddef\uddf3\uddfa\udecb\udecd-\udecf\udee0-\udee5\udee9\udef0\udef3]|[\u203c\u2049\u2139\u2194-\u2199\u21a9\u21aa\u231a\u231b\u2328\u23cf\u23ed-\u23ef\u23f1\u23f2\u23f8-\u23fa\u24c2\u25aa\u25ab\u25b6\u25c0\u25fb-\u25fe\u2600-\u2604\u260e\u2611\u2614\u2615\u2618\u2620\u2622\u2623\u2626\u262a\u262e\u262f\u2638-\u263a\u2640\u2642\u2648-\u2653\u2660\u2663\u2665\u2666\u2668\u267b\u267f\u2692-\u2697\u2699\u269b\u269c\u26a0\u26a1\u26a7\u26aa\u26ab\u26b0\u26b1\u26bd\u26be\u26c4\u26c5\u26c8\u26cf\u26d1\u26d3\u26d4\u26e9\u26ea\u26f0-\u26f5\u26f8\u26fa\u26fd\u2702\u2708\u2709\u270f\u2712\u2714\u2716\u271d\u2721\u2733\u2734\u2744\u2747\u2757\u2763\u2764\u27a1\u2934\u2935\u2b05-\u2b07\u2b1b\u2b1c\u2b50\u2b55\u3030\u303d\u3297\u3299])(?:\ufe0f|(?!\ufe0e))|(?:(?:\ud83c[\udfcb\udfcc]|\ud83d[\udd74\udd75\udd90]|[\u261d\u26f7\u26f9\u270c\u270d])(?:\ufe0f|(?!\ufe0e))|(?:\ud83c[\udf85\udfc2-\udfc4\udfc7\udfca]|\ud83d[\udc42\udc43\udc46-\udc50\udc66-\udc69\udc6e\udc70-\udc78\udc7c\udc81-\udc83\udc85-\udc87\udcaa\udd7a\udd95\udd96\ude45-\ude47\ude4b-\ude4f\udea3\udeb4-\udeb6\udec0\udecc]|\ud83e[\udd0c\udd0f\udd18-\udd1c\udd1e\udd1f\udd26\udd30-\udd39\udd3d\udd3e\udd77\uddb5\uddb6\uddb8\uddb9\uddbb\uddcd-\uddcf\uddd1-\udddd\udec3-\udec5\udef0-\udef6]|[\u270a\u270b]))(?:\ud83c[\udffb-\udfff])?|(?:\ud83c\udff4\udb40\udc67\udb40\udc62\udb40\udc65\udb40\udc6e\udb40\udc67\udb40\udc7f|\ud83c\udff4\udb40\udc67\udb40\udc62\udb40\udc73\udb40\udc63\udb40\udc74\udb40\udc7f|\ud83c\udff4\udb40\udc67\udb40\udc62\udb40\udc77\udb40\udc6c\udb40\udc73\udb40\udc7f|\ud83c\udde6\ud83c[\udde8-\uddec\uddee\uddf1\uddf2\uddf4\uddf6-\uddfa\uddfc\uddfd\uddff]|\ud83c\udde7\ud83c[\udde6\udde7\udde9-\uddef\uddf1-\uddf4\uddf6-\uddf9\uddfb\uddfc\uddfe\uddff]|\ud83c\udde8\ud83c[\udde6\udde8\udde9\uddeb-\uddee\uddf0-\uddf5\uddf7\uddfa-\uddff]|\ud83c\udde9\ud83c[\uddea\uddec\uddef\uddf0\uddf2\uddf4\uddff]|\ud83c\uddea\ud83c[\udde6\udde8\uddea\uddec\udded\uddf7-\uddfa]|\ud83c\uddeb\ud83c[\uddee-\uddf0\uddf2\uddf4\uddf7]|\ud83c\uddec\ud83c[\udde6\udde7\udde9-\uddee\uddf1-\uddf3\uddf5-\uddfa\uddfc\uddfe]|\ud83c\udded\ud83c[\uddf0\uddf2\uddf3\uddf7\uddf9\uddfa]|\ud83c\uddee\ud83c[\udde8-\uddea\uddf1-\uddf4\uddf6-\uddf9]|\ud83c\uddef\ud83c[\uddea\uddf2\uddf4\uddf5]|\ud83c\uddf0\ud83c[\uddea\uddec-\uddee\uddf2\uddf3\uddf5\uddf7\uddfc\uddfe\uddff]|\ud83c\uddf1\ud83c[\udde6-\udde8\uddee\uddf0\uddf7-\uddfb\uddfe]|\ud83c\uddf2\ud83c[\udde6\udde8-\udded\uddf0-\uddff]|\ud83c\uddf3\ud83c[\udde6\udde8\uddea-\uddec\uddee\uddf1\uddf4\uddf5\uddf7\uddfa\uddff]|\ud83c\uddf4\ud83c\uddf2|\ud83c\uddf5\ud83c[\udde6\uddea-\udded\uddf0-\uddf3\uddf7-\uddf9\uddfc\uddfe]|\ud83c\uddf6\ud83c\udde6|\ud83c\uddf7\ud83c[\uddea\uddf4\uddf8\uddfa\uddfc]|\ud83c\uddf8\ud83c[\udde6-\uddea\uddec-\uddf4\uddf7-\uddf9\uddfb\uddfd-\uddff]|\ud83c\uddf9\ud83c[\udde6\udde8\udde9\uddeb-\udded\uddef-\uddf4\uddf7\uddf9\uddfb\uddfc\uddff]|\ud83c\uddfa\ud83c[\udde6\uddec\uddf2\uddf3\uddf8\uddfe\uddff]|\ud83c\uddfb\ud83c[\udde6\udde8\uddea\uddec\uddee\uddf3\uddfa]|\ud83c\uddfc\ud83c[\uddeb\uddf8]|\ud83c\uddfd\ud83c\uddf0|\ud83c\uddfe\ud83c[\uddea\uddf9]|\ud83c\uddff\ud83c[\udde6\uddf2\uddfc]|\ud83c[\udccf\udd8e\udd91-\udd9a\udde6-\uddff\ude01\ude32-\ude36\ude38-\ude3a\ude50\ude51\udf00-\udf20\udf2d-\udf35\udf37-\udf7c\udf7e-\udf84\udf86-\udf93\udfa0-\udfc1\udfc5\udfc6\udfc8\udfc9\udfcf-\udfd3\udfe0-\udff0\udff4\udff8-\udfff]|\ud83d[\udc00-\udc3e\udc40\udc44\udc45\udc51-\udc65\udc6a\udc6f\udc79-\udc7b\udc7d-\udc80\udc84\udc88-\udc8e\udc90\udc92-\udca9\udcab-\udcfc\udcff-\udd3d\udd4b-\udd4e\udd50-\udd67\udda4\uddfb-\ude44\ude48-\ude4a\ude80-\udea2\udea4-\udeb3\udeb7-\udebf\udec1-\udec5\uded0-\uded2\uded5-\uded7\udedd-\udedf\udeeb\udeec\udef4-\udefc\udfe0-\udfeb\udff0]|\ud83e[\udd0d\udd0e\udd10-\udd17\udd20-\udd25\udd27-\udd2f\udd3a\udd3c\udd3f-\udd45\udd47-\udd76\udd78-\uddb4\uddb7\uddba\uddbc-\uddcc\uddd0\uddde-\uddff\ude70-\ude74\ude78-\ude7c\ude80-\ude86\ude90-\udeac\udeb0-\udeba\udec0-\udec2\uded0-\uded9\udee0-\udee7]|[\u23e9-\u23ec\u23f0\u23f3\u267e\u26ce\u2705\u2728\u274c\u274e\u2753-\u2755\u2795-\u2797\u27b0\u27bf\ue50a])|\ufe0f/g,UFE0Fg=/\uFE0F/g,U200D=String.fromCharCode(8205),rescaper=/[&<>'"]/g,shouldntBeParsed=/^(?:iframe|noframes|noscript|script|select|style|textarea)$/,fromCharCode=String.fromCharCode;return twemoji;function createText(text,clean){return document.createTextNode(clean?text.replace(UFE0Fg,""):text)}function escapeHTML(s){return s.replace(rescaper,replacer)}function defaultImageSrcGenerator(icon,options){return"".concat(options.base,options.size,"/",icon,options.ext)}function grabAllTextNodes(node,allText){var childNodes=node.childNodes,length=childNodes.length,subnode,nodeType;while(length--){subnode=childNodes[length];nodeType=subnode.nodeType;if(nodeType===3){allText.push(subnode)}else if(nodeType===1&&!("ownerSVGElement"in subnode)&&!shouldntBeParsed.test(subnode.nodeName.toLowerCase())){grabAllTextNodes(subnode,allText)}}return allText}function grabTheRightIcon(rawText){return toCodePoint(rawText.indexOf(U200D)<0?rawText.replace(UFE0Fg,""):rawText)}function parseNode(node,options){var allText=grabAllTextNodes(node,[]),length=allText.length,attrib,attrname,modified,fragment,subnode,text,match,i,index,img,rawText,iconId,src;while(length--){modified=false;fragment=document.createDocumentFragment();subnode=allText[length];text=subnode.nodeValue;i=0;while(match=re.exec(text)){index=match.index;if(index!==i){fragment.appendChild(createText(text.slice(i,index),true))}rawText=match[0];iconId=grabTheRightIcon(rawText);i=index+rawText.length;src=options.callback(iconId,options);if(iconId&&src){img=new Image;img.onerror=options.onerror;img.setAttribute("draggable","false");attrib=options.attributes(rawText,iconId);for(attrname in attrib){if(attrib.hasOwnProperty(attrname)&&attrname.indexOf("on")!==0&&!img.hasAttribute(attrname)){img.setAttribute(attrname,attrib[attrname])}}img.className=options.className;img.alt=rawText;img.src=src;modified=true;fragment.appendChild(img)}if(!img)fragment.appendChild(createText(rawText,false));img=null}if(modified){if(i")}return ret})}function replacer(m){return escaper[m]}function returnNull(){return null}function toSizeSquaredAsset(value){return typeof value==="number"?value+"x"+value:value}function fromCodePoint(codepoint){var code=typeof codepoint==="string"?parseInt(codepoint,16):codepoint;if(code<65536){return fromCharCode(code)}code-=65536;return fromCharCode(55296+(code>>10),56320+(code&1023))}function parse(what,how){if(!how||typeof how==="function"){how={callback:how}}return(typeof what==="string"?parseString:parseNode)(what,{callback:how.callback||defaultImageSrcGenerator,attributes:typeof how.attributes==="function"?how.attributes:returnNull,base:typeof how.base==="string"?how.base:twemoji.base,ext:how.ext||twemoji.ext,size:how.folder||toSizeSquaredAsset(how.size||twemoji.size),className:how.className||twemoji.className,onerror:how.onerror||twemoji.onerror})}function replace(text,callback){return String(text).replace(re,callback)}function test(text){re.lastIndex=0;var result=re.test(text);re.lastIndex=0;return result}function toCodePoint(unicodeSurrogates,sep){var r=[],c=0,p=0,i=0;while(i Date: Wed, 15 Feb 2023 22:00:02 -0600 Subject: [PATCH 06/23] add newMusic (fresh produce) feed to ftapi --- js/firetable.js | 9 +++++++++ js/main.js | 14 +++++++------- 2 files changed, 16 insertions(+), 7 deletions(-) diff --git a/js/firetable.js b/js/firetable.js index 3fb7e84..e4ff7ba 100644 --- a/js/firetable.js +++ b/js/firetable.js @@ -127,6 +127,15 @@ ftapi.init = function(firebaseConfig) { ftapi.events.emit("newHistory", data); }); + // new songs emitter + var freshproduce = firebase.app("firetable").database().ref("newNewMusic"); + freshproduce.on('child_added', function(dataSnapshot, prev) { + var data = dataSnapshot.val(); + data.histID = dataSnapshot.key; + ftapi.events.emit("newHistory", data); + }); + + // table change emitter var tbl = firebase.app("firetable").database().ref("table"); tbl.on('value', function(dataSnapshot) { diff --git a/js/main.js b/js/main.js index 6d2101c..7408c44 100644 --- a/js/main.js +++ b/js/main.js @@ -58,7 +58,7 @@ chatScroll.getScrollElement().addEventListener('scroll', function() { if (firetable.utilities.isChatPrettyMuchAtBottom()) $('#morechats').removeClass('show'); }); -firetable.version = "01.09.05"; +firetable.version = "01.09.06"; var player, $playlistItemTemplate; @@ -1328,13 +1328,13 @@ firetable.utilities = { $('body').addClass('screen'); }, isChatPrettyMuchAtBottom: function() { - var scrollable = chatScroll.contentEl.scrollHeight - chatScroll.el.clientHeight; - var scrolled = chatScroll.contentWrapperEl.scrollTop; - console.log('near bottom?', scrollable, scrolled); - return (Math.abs(scrollable - scrolled) <= 25); + var scrollable = chatScroll.contentEl.scrollHeight - chatScroll.el.clientHeight; + var scrolled = chatScroll.contentWrapperEl.scrollTop; + console.log('near bottom?', scrollable, scrolled); + return (Math.abs(scrollable - scrolled) <= 25); }, scrollToBottom: function() { - chatScroll.contentWrapperEl.scrollTop = chatScroll.contentEl.scrollHeight; + chatScroll.contentWrapperEl.scrollTop = chatScroll.contentEl.scrollHeight; }, htmlEscape: function(s, preserveCR) { preserveCR = preserveCR ? ' ' : '\n'; @@ -2283,7 +2283,7 @@ firetable.ui = { } if (atBottom || ftapi.uid == chatData.id) firetable.utilities.scrollToBottom(); - else $('#morechats').addClass('show'); + //else $('#morechats').addClass('show'); }); ftapi.events.on("chatRemoved", function(data) { From 3524194c7d76b610d12351c12daa0b3b5d489b2b Mon Sep 17 00:00:00 2001 From: Matt Thompson Date: Thu, 11 Jan 2024 11:54:15 -0600 Subject: [PATCH 07/23] tag edit thank you --- css/looks.css | 2 +- index.html | 11 ++-- js/firetable.js | 64 +++++++++----------- js/main.js | 152 +++++++++++++++++++++++++----------------------- 4 files changed, 112 insertions(+), 117 deletions(-) diff --git a/css/looks.css b/css/looks.css index 4211a6a..a1e61cc 100644 --- a/css/looks.css +++ b/css/looks.css @@ -1116,7 +1116,7 @@ div#filterMachine { padding: var(--pad2); } -#mainqueue .material-icons { +#mainqueue .material-icons, #thehistory .material-icons { margin: 0 var(--pad1); font-size: 1.2rem; } diff --git a/index.html b/index.html index 5e27597..e0df781 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,7 @@ - + @@ -275,7 +275,6 @@
vertical_align_top vertical_align_bottom - edit close delete @@ -284,7 +283,6 @@
- link
Edit the song tag + hit enter to save

@@ -332,6 +330,7 @@
played by on at
+ edit
@@ -541,9 +540,9 @@

Playlist Import Machine

- - - + + + diff --git a/js/firetable.js b/js/firetable.js index e4ff7ba..7d9d3ed 100644 --- a/js/firetable.js +++ b/js/firetable.js @@ -7,6 +7,7 @@ var ftapi = { started: false, loggedIn: false, banned: false, + isMod: false, presenceDetectRef: null, presenceDetectEvent: null, blockEvent: null, @@ -127,6 +128,12 @@ ftapi.init = function(firebaseConfig) { ftapi.events.emit("newHistory", data); }); + recentz.on('child_changed', function(dataSnapshot) { + var data = dataSnapshot.val(); + data.histID = dataSnapshot.key; + ftapi.events.emit("editedHistory", data); + }); + // new songs emitter var freshproduce = firebase.app("firetable").database().ref("newNewMusic"); freshproduce.on('child_added', function(dataSnapshot, prev) { @@ -226,6 +233,11 @@ ftapi.init = function(firebaseConfig) { if (data) { returnData.user = data; if (data.username) ftapi.uname = data.username; + console.log("LOOK HERE",data) + if (data.mod || data.supermod){ + ftapi.isMod = true; + ftapi.events.emit("modCheck", true); + } } ftapi.events.emit("loggedIn", returnData); @@ -504,42 +516,6 @@ ftapi.actions = { var removeThis = ftapi.queueRef.child(trackID + "/flagged"); removeThis.remove(); }, - editTrackTag: function(trackID, cid, newTag) { - if (ftapi.queue[trackID]) { - if (ftapi.queue[trackID].cid == cid) { - var changeref = ftapi.queueRef.child(trackID); - var trackObj = ftapi.queue[trackID]; - trackObj.name = newTag; - changeref.set(trackObj); - } else { - //song appears to have moved since the editing began, let's try and find it... - for (var key in ftapi.queue) { - if (ftapi.queue.hasOwnProperty(key)) { - if (ftapi.queue[key].cid == cid) { - var changeref = ftapi.queueRef.child(key); - var trackObj = ftapi.queue[key]; - trackObj.name = newTag; - changeref.set(trackObj); - return; - } - } - } - } - } else { - //song appears to have moved since the editing began, let's try and find it... - for (var key in ftapi.queue) { - if (ftapi.queue.hasOwnProperty(key)) { - if (ftapi.queue[key].cid == cid) { - var changeref = ftapi.queueRef.child(key); - var trackObj = ftapi.queue[key]; - trackObj.name = newTag; - changeref.set(trackObj); - return; - } - } - } - } - }, deleteList: function(listID) { var removeThis = firebase.app("firetable").database().ref("playlists/" + ftapi.uid + "/" + listID); removeThis.remove(); @@ -778,6 +754,20 @@ ftapi.actions = { deleteChat: function(feedID) { var feedEntry = firebase.app("firetable").database().ref("chatFeed/" + feedID + "/hidden"); feedEntry.set(true); + }, + editTag: function(type, cid, tag, histID){ + console.log(type+" "+cid+" "+tag+ " "+histID); + var yargo = tag.split(" - "); + var theartist = yargo[0]; + var thetitle = yargo[1]; + //UPDATE HISTORY + var histRef = firebase.app("firetable").database().ref("songHistory/" + histID); + histRef.child("artist").set(theartist); + histRef.child("title").set(thetitle); + //UPDATE GLOBAL + var globalRef = firebase.app("firetable").database().ref("globalTracks/" + type + "" +cid); + globalRef.child("artist").set(theartist); + globalRef.child("title").set(thetitle); } }; @@ -988,4 +978,4 @@ EventEmitter.prototype.once = function(event, listener) { }); }; -ftapi.ready(); +ftapi.ready(); \ No newline at end of file diff --git a/js/main.js b/js/main.js index 7408c44..f27997d 100644 --- a/js/main.js +++ b/js/main.js @@ -49,7 +49,7 @@ var firetable = { atUsersFiltered: [], atString: "", debug: false -} +}; if (typeof ftconfigs == "undefined") throw "config.js is missing! Copy config.js.example and rename to config.js. Edit this file and add your own app's information."; @@ -58,7 +58,7 @@ chatScroll.getScrollElement().addEventListener('scroll', function() { if (firetable.utilities.isChatPrettyMuchAtBottom()) $('#morechats').removeClass('show'); }); -firetable.version = "01.09.06"; +firetable.version = "01.10.3"; var player, $playlistItemTemplate; @@ -183,34 +183,34 @@ firetable.init = function() { $("#idtitle").text(ftconfigs.roomName); $("#welcomeName").text(ftconfigs.roomName); -if (ftconfigs.avatarset) firetable.avatarset = ftconfigs.avatarset; + if (ftconfigs.avatarset) firetable.avatarset = ftconfigs.avatarset; -if (ftconfigs.facebookURL){ - $(".sociallogo.facebook").attr("href", ftconfigs.facebookURL); - $(".sociallogo.facebook").css("display", "inline-block"); -} + if (ftconfigs.facebookURL) { + $(".sociallogo.facebook").attr("href", ftconfigs.facebookURL); + $(".sociallogo.facebook").css("display", "inline-block"); + } -if (ftconfigs.redditURL){ - $(".sociallogo.reddit").attr("href", ftconfigs.redditURL); - $(".sociallogo.reddit").css("display", "inline-block"); -} + if (ftconfigs.redditURL) { + $(".sociallogo.reddit").attr("href", ftconfigs.redditURL); + $(".sociallogo.reddit").css("display", "inline-block"); + } -if (ftconfigs.lastfmURL){ - $(".sociallogo.lastfm").attr("href", ftconfigs.lastfmURL); - $(".sociallogo.lastfm").css("display", "inline-block"); -} + if (ftconfigs.lastfmURL) { + $(".sociallogo.lastfm").attr("href", ftconfigs.lastfmURL); + $(".sociallogo.lastfm").css("display", "inline-block"); + } -if (ftconfigs.discordURL){ - $(".sociallogo.discord").attr("href", ftconfigs.discordURL); - $(".sociallogo.discord").css("display", "inline-block"); -} + if (ftconfigs.discordURL) { + $(".sociallogo.discord").attr("href", ftconfigs.discordURL); + $(".sociallogo.discord").css("display", "inline-block"); + } -if (ftconfigs.soundcloudURL){ - $(".sociallogo.soundcloud").attr("href", ftconfigs.soundcloudURL); - $(".sociallogo.soundcloud").css("display", "inline-block"); -} + if (ftconfigs.soundcloudURL) { + $(".sociallogo.soundcloud").attr("href", ftconfigs.soundcloudURL); + $(".sociallogo.soundcloud").css("display", "inline-block"); + } - if (ftconfigs.logoImage) $("#roomlogo").css("background-image", "url("+ftconfigs.logoImage+")") + if (ftconfigs.logoImage) $("#roomlogo").css("background-image", "url(" + ftconfigs.logoImage + ")") document.title = ftconfigs.roomName + " | firetable"; if (ftconfigs.roomInfoUrl.length) $("#roomInfo").attr("href", ftconfigs.roomInfoUrl); $("#version").text("You're running firetable v" + firetable.version + "."); @@ -540,7 +540,7 @@ firetable.actions = { }; picboy2.src = data.image; }; - picboy.src = 'https://indiediscotheque.com/robots/' + data.djid + data.djname + '.png?size=175x175&set='+set; + picboy.src = 'https://indiediscotheque.com/robots/' + data.djid + data.djname + '.png?size=175x175&set=' + set; }; @@ -618,7 +618,7 @@ firetable.actions = { }; picboy.src = 'img/id9.png'; }; - eight.src = 'https://indiediscotheque.com/robots/' + data.djid + data.djname + '.png?size=110x110&set='+set; + eight.src = 'https://indiediscotheque.com/robots/' + data.djid + data.djname + '.png?size=110x110&set=' + set; }; cake.src = 'img/arnold.png'; } @@ -940,31 +940,16 @@ firetable.actions = { $("#mergeCompleted").show(); $("#mergeHappening").hide(); }, - editTagsPrompt: function(songid) { - var song = firetable.queue[songid]; - var $pvbar = $('#mainqueue .pvbar[data-key="' + songid + '"]'); - $('#mainqueue .pvbar.editing').removeClass('editing'); + editTagsPrompt: function(songid, tag, type, cid) { + var $pvbar = $('#thehistory .pvbar[data-key="' + songid + '"]'); + $('#thehistory .pvbar.editing').removeClass('editing'); $('.tagPromptBox').remove(); $pvbar.addClass('editing'); var $tags = $tagEditorTemplate.clone().appendTo($pvbar); - $tags.find(".tagMachine").val(song.name); - if (song.type == 1) { - $tags.find(".tagSongLink").attr("href", "https://youtube.com/watch?v=" + song.cid); - } else if (song.type == 2) { - firetable.actions.scGet('tracks', song.cid, function(tracks) { - if (tracks.permalink_url) { - $tags.find(".tagSongLink").attr("href", tracks.permalink_url); - } else { - $tags.find(".tagSongLink").attr("href", "http://howtojointheindiediscothequewaitlist.com/ThisSongIsBroken?thanks=true"); - } - }); - } - + $tags.find(".tagMachine").val(tag); + firetable.debug && console.log('edit tags song id:', songid); - firetable.songToEdit = { - song: song, - key: songid - }; + }, importList(id, name, type) { //time to IMPORT SOME LISTS! @@ -1246,7 +1231,7 @@ firetable.utilities = { firetable.emojiMap[emojisArr[i].slug] = emojisArr[i].emoji; var words = ""; words += (data[2][emojisArr[i].emoji] !== undefined) ? data[2][emojisArr[i].emoji].join(',') : ""; - words += (oldmojis[emojisArr[i].emoji] !== undefined) ? ','+oldmojis[emojisArr[i].emoji] : ""; + words += (oldmojis[emojisArr[i].emoji] !== undefined) ? ',' + oldmojis[emojisArr[i].emoji] : ""; $("#picker" + catid).append('' + emojisArr[i].emoji + ''); } for (let i in oldmojis) { @@ -1315,7 +1300,7 @@ firetable.utilities = { Notification.requestPermission(); } else { var notification = new Notification(namebo, { - icon: "https://indiediscotheque.com/robots/" + chatData.id + namebo + ".png?size=110x110&set="+firetable.avatarset, + icon: "https://indiediscotheque.com/robots/" + chatData.id + namebo + ".png?size=110x110&set=" + firetable.avatarset, body: chatData.txt, }); } @@ -1328,13 +1313,13 @@ firetable.utilities = { $('body').addClass('screen'); }, isChatPrettyMuchAtBottom: function() { - var scrollable = chatScroll.contentEl.scrollHeight - chatScroll.el.clientHeight; - var scrolled = chatScroll.contentWrapperEl.scrollTop; - console.log('near bottom?', scrollable, scrolled); - return (Math.abs(scrollable - scrolled) <= 25); + var scrollable = chatScroll.contentEl.scrollHeight - chatScroll.el.clientHeight; + var scrolled = chatScroll.contentWrapperEl.scrollTop; + console.log('near bottom?', scrollable, scrolled); + return (Math.abs(scrollable - scrolled) <= 25); }, scrollToBottom: function() { - chatScroll.contentWrapperEl.scrollTop = chatScroll.contentEl.scrollHeight; + chatScroll.contentWrapperEl.scrollTop = chatScroll.contentEl.scrollHeight; }, htmlEscape: function(s, preserveCR) { preserveCR = preserveCR ? ' ' : '\n'; @@ -1733,6 +1718,13 @@ firetable.ui = { } } var $historyItem = $('#thehistory .pvbar').remove(); + ftapi.events.on('editedHistory', function(data) { + console.log("HIST EDIT", data); + $("#"+data.histID).text(data.artist+ " - " + data.title); + }); + ftapi.events.on('modCheck', function(data) { + if (data) $(".edittags").show(); + }); ftapi.events.on('newHistory', function(data) { if (data.img == "img/idlogo.png" && ftconfigs.defaultAlbumArtUrl.length) data.img = ftconfigs.defaultAlbumArtUrl; var firstpart = "yt"; @@ -1741,6 +1733,7 @@ firetable.ui = { var $histItem = $historyItem.clone(); $histItem.attr('id', "pvbar" + pkey); $histItem.attr("data-key", pkey); + $histItem.attr("data-histid", data.histID); $histItem.attr("data-cid", data.cid); $histItem.attr("data-type", data.type); @@ -1754,8 +1747,19 @@ firetable.ui = { }); $histItem.find('.histlink').attr({ 'href': data.url, - 'tabindex': "-1" + 'tabindex': "-1", + 'id': data.histID }).text(data.artist + " - " + data.title); + $histItem.find('.edittags').on('click', function() { + firetable.actions.editTagsPrompt($(this).closest('.pvbar').attr('data-key'),data.artist + " - " + data.title) + }); + try{ + + if (!ftapi.isMod) $histItem.find('.edittags').hide(); + } catch (e){ + console.log(e); + } + $histItem.find('.histdj').text(data.dj); $histItem.find('.histdate').text(firetable.utilities.format_date(data.when)); $histItem.find('.histtime').text(firetable.utilities.format_time(data.when)); @@ -1983,7 +1987,7 @@ firetable.ui = { cnt = countr; var removeMe = ""; if (data[key].removeAfter) removeMe = "departure_board" - ok1 += "
" + countr + ". " + data[key].name + " " + removeMe + "
"; + ok1 += "
" + countr + ". " + data[key].name + " " + removeMe + "
"; countr++; } } @@ -2000,7 +2004,7 @@ firetable.ui = { var removeMe = ""; if (data[key].removeAfter) removeMe = "departure_board" - ok1 += "
" + removeMe + " " + data[key].name + "
" + data[key].plays + "/" + firetable.playlimit + "
"; + ok1 += "
" + removeMe + " " + data[key].name + "
" + data[key].plays + "/" + firetable.playlimit + "
"; countr++; } } @@ -2097,7 +2101,7 @@ firetable.ui = { var newUserToAddX = $("
"); newUserToAddX.addClass("prson " + block); newUserToAddX.attr("id", "user" + data.userid); - newUserToAddX.html("
" + blockcon + "" + herecon + "
" + data.username + "" + rolename + "joined " + firetable.utilities.format_date(data.joined) + ""); + newUserToAddX.html("
" + blockcon + "" + herecon + "
" + data.username + "" + rolename + "joined " + firetable.utilities.format_date(data.joined) + ""); firetable.utilities.chatAt(newUserToAddX); // adds the click event to @ the user $(destination).append(newUserToAddX); }); @@ -2139,7 +2143,7 @@ firetable.ui = { destination = "#usersBot"; } - $("#user" + data.userid).html("
" + blockcon + "" + herecon + "
" + data.username + "" + rolename + "joined " + firetable.utilities.format_date(data.joined) + ""); + $("#user" + data.userid).html("
" + blockcon + "" + herecon + "
" + data.username + "" + rolename + "joined " + firetable.utilities.format_date(data.joined) + ""); }); ftapi.events.on("usersChanged", function(okdata) { if ($("#loggedInName").text() == ftapi.uid) { @@ -2229,7 +2233,7 @@ firetable.ui = { } else { var $chatthing = $chatTemplate.clone(); $chatthing.attr('id', "chat" + chatData.chatID); - $chatthing.find('.botson').css('background-image', "url(https://indiediscotheque.com/robots/" + chatData.id + namebo + ".png?size=110x110&set="+firetable.avatarset); + $chatthing.find('.botson').css('background-image', "url(https://indiediscotheque.com/robots/" + chatData.id + namebo + ".png?size=110x110&set=" + firetable.avatarset); $chatthing.find('.utitle').html(utitle); $chatthing.find('.chatTime').attr('id', "chatTime" + chatData.chatID).html(firetable.utilities.format_time(chatData.time)); if (badoop) $chatthing.addClass('badoop'); @@ -2352,9 +2356,6 @@ firetable.ui = { }); } - $newli.find('.edittags').on('click', function() { - firetable.actions.editTagsPrompt($(this).closest('.pvbar').attr('data-key')) - }); $newli.find('.deletesong').on('click', function() { firetable.actions.deleteSong($(this).closest('.pvbar').attr('data-key')) }); @@ -2548,7 +2549,7 @@ firetable.ui = { }); if (!firetable.pickerInit) { - const makeRequest = async () => { + const makeRequest = async() => { twemoji.parse(document.getElementById("pickerResults")); return true; } @@ -2760,17 +2761,22 @@ firetable.ui = { }); $(document).on("keyup", ".tagMachine", function(e) { if (e.which == 13) { - var songKey = $(this).closest('.tagPromptBox').prev('.pvbar').attr('data-key'); - if (firetable.songToEdit) { + var thetype = $(this).closest('.pvbar').attr('data-type'); + var songCid = $(this).closest('.pvbar').attr('data-cid'); + var histID = $(this).closest('.pvbar').attr('data-histid'); var val = $(this).val(); if (val != "") { - var obj = firetable.songToEdit; - ftapi.actions.editTrackTag(obj.key, obj.song.cid, val); - firetable.songToEdit = null; - $(this).closest('.editing').removeClass('editing').next('.tagPromptBox').remove(); + var yargo = val.split(" - "); + var theartist = yargo[0]; + var thetitle = yargo[1]; + if (!theartist || !thetitle){ + alert("check yr tags"); + } else { + ftapi.actions.editTag(thetype, songCid, val, histID); + $(this).closest('.editing').removeClass('editing').next('.tagPromptBox').remove(); + } } - } - } + } }); $("#changeUsername").bind("keyup", function(e) { if (e.which == 13) { @@ -3722,4 +3728,4 @@ class Glitch { } -if (!firetable.started) firetable.init(); +if (!firetable.started) firetable.init(); \ No newline at end of file From f702633052097ed9e0ffe2f4c68b5785aa0a1637 Mon Sep 17 00:00:00 2001 From: Matt Thompson Date: Thu, 11 Jan 2024 12:22:33 -0600 Subject: [PATCH 08/23] chris wants to be able to close the edit box --- css/looks.css | 4 ---- index.html | 8 ++++---- js/main.js | 15 +++++++++------ 3 files changed, 13 insertions(+), 14 deletions(-) diff --git a/css/looks.css b/css/looks.css index a1e61cc..bb3d0ad 100644 --- a/css/looks.css +++ b/css/looks.css @@ -1297,10 +1297,6 @@ a.importLinkCheck { float: right; } -.closeeditor { - display: none; -} - .tagsNlink { display: flex; } diff --git a/index.html b/index.html index e0df781..9713284 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,7 @@ - + @@ -540,9 +540,9 @@

Playlist Import Machine

- - - + + + diff --git a/js/main.js b/js/main.js index f27997d..6ff6734 100644 --- a/js/main.js +++ b/js/main.js @@ -58,7 +58,7 @@ chatScroll.getScrollElement().addEventListener('scroll', function() { if (firetable.utilities.isChatPrettyMuchAtBottom()) $('#morechats').removeClass('show'); }); -firetable.version = "01.10.3"; +firetable.version = "01.10.4"; var player, $playlistItemTemplate; @@ -1751,7 +1751,13 @@ firetable.ui = { 'id': data.histID }).text(data.artist + " - " + data.title); $histItem.find('.edittags').on('click', function() { - firetable.actions.editTagsPrompt($(this).closest('.pvbar').attr('data-key'),data.artist + " - " + data.title) + if ($(this).hasClass("editing")){ + $(this).removeClass("editing"); + $(this).closest('.pvbar').find('.tagPromptBox').remove(); + } else { + $(this).addClass("editing"); + firetable.actions.editTagsPrompt($(this).closest('.pvbar').attr('data-key'),data.artist + " - " + data.title) + } }); try{ @@ -2526,10 +2532,7 @@ firetable.ui = { firetable.actions.cardCase(); $("#plMachine").val(""); }); - $(document).on("click", ".closeeditor", function() { - $(this).closest('.pvbar').removeClass('editing').find('.tagPromptBox').remove(); - firetable.songToEdit = null; - }); + $("#cardCaseButton").bind("click", function() { firetable.actions.cardCase(); $("#cardsOverlay").show(); From ef7f1f7e97c160a70162ab159db821f9db16bd45 Mon Sep 17 00:00:00 2001 From: Matt Thompson Date: Thu, 11 Jan 2024 13:07:17 -0600 Subject: [PATCH 09/23] remove old tag editor close button --- index.html | 1 - 1 file changed, 1 deletion(-) diff --git a/index.html b/index.html index 9713284..1335dfb 100644 --- a/index.html +++ b/index.html @@ -275,7 +275,6 @@
vertical_align_top vertical_align_bottom - close delete From 99740f26bf724d35ae4db213b51b0ddbff1c6143 Mon Sep 17 00:00:00 2001 From: Matt Thompson Date: Thu, 11 Jan 2024 15:44:09 -0600 Subject: [PATCH 10/23] produce on login screen --- css/looks.css | 67 +++++++++++++++++++++++++++++++++++++++++++++---- index.html | 29 ++++++++++++++++++--- js/firetable.js | 4 +-- js/main.js | 58 ++++++++++++++++++++++++++++++++++++++++++ 4 files changed, 147 insertions(+), 11 deletions(-) diff --git a/css/looks.css b/css/looks.css index bb3d0ad..77778b8 100644 --- a/css/looks.css +++ b/css/looks.css @@ -523,7 +523,8 @@ div#roomlogo { #mainGrid.mmusrs #queuebox, #mainGrid.mmusrs #thehistoryWrap, #mainGrid.mmusrs #actualChat, -#mainGrid.mmusrs #login { +#mainGrid.mmusrs #login, +#mainGrid.mmusrs #discover { display: none; } @@ -539,7 +540,8 @@ div#roomlogo { #mainGrid.mmqueue #usersbox, #mainGrid.mmqueue #thehistoryWrap, #mainGrid.mmqueue #actualChat, -#mainGrid.mmqueue #login { +#mainGrid.mmqueue #login, +#mainGrid.mmusrs #discover { display: none; } @@ -555,7 +557,8 @@ div#roomlogo { #mainGrid.mmchat #usersbox, #mainGrid.mmchat #queuebox, #mainGrid.mmchat #thehistoryWrap, -#mainGrid.mmchat #login { +#mainGrid.mmchat #login, +#mainGrid.mmusrs #discover { display: none; } @@ -1735,13 +1738,62 @@ img.emoji { flex: 1; } +/* Discover */ +#discover { + grid-area: login; + padding: var(--pad5); + background: #151515; + overflow: auto; + height: 100%; + text-align: center; +} + +#discover h2{ + font-size: 2.5rem; + font-weight: 700; + padding: var(--pad4); + +} +#discover p{ + padding: var(--pad2); +} + +#thediscovers .pvbar { + display: inline-block; + width: 300px; + height: 400px; + padding:20px; + margin-top:50px; +} + +.discart { + display: flex; + align-items: center; + justify-content: center; + margin-bottom: var(--pad2); + width: 300px; + height: 300px; + background-size: cover; + background-position: center; +} + +#thediscovers .qtxt { + display: block; + flex: 1; +} + +#thediscovers .pvbarWrap { + display: flex; + flex-wrap: wrap; +} + /* Login */ #welcomeInfo { padding-bottom: var(--pad4); } #login { - grid-area: login; + grid-area: queues; padding: var(--pad5); background: #151515; overflow: auto; @@ -2028,6 +2080,11 @@ div#blog { cursor: none; pointer-events: none; } + + #login { + grid-area: login !important; +} + } @media only screen and (min-width: 800px) { @@ -2092,7 +2149,7 @@ div#blog { #mainGrid.login #queuebox, #mainGrid.login #thehistoryWrap { - display: block; + display: none; } #mainGrid.login .histeal, diff --git a/index.html b/index.html index 1335dfb..0127df1 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,7 @@ - + @@ -336,6 +336,27 @@ +
+

We Are Indie Discotheque

+

You've found the home of Indie Discotheque, The Alternative Dance Collective.

+

We're spinning h0t alt dance / nu disco / synth trax 24/7. Here's some of the freshest produce we've gathered recently.

+ +
+
+
+
+ +
+
+
+
played by on at
+
+
+
+
+
+ +

Welcome To Firetable!

@@ -539,9 +560,9 @@

Playlist Import Machine

- - - + + + diff --git a/js/firetable.js b/js/firetable.js index 7d9d3ed..fca8433 100644 --- a/js/firetable.js +++ b/js/firetable.js @@ -135,11 +135,11 @@ ftapi.init = function(firebaseConfig) { }); // new songs emitter - var freshproduce = firebase.app("firetable").database().ref("newNewMusic"); + var freshproduce = firebase.app("firetable").database().ref("newMusic"); freshproduce.on('child_added', function(dataSnapshot, prev) { var data = dataSnapshot.val(); data.histID = dataSnapshot.key; - ftapi.events.emit("newHistory", data); + ftapi.events.emit("newProduce", data); }); diff --git a/js/main.js b/js/main.js index 6ff6734..831d74b 100644 --- a/js/main.js +++ b/js/main.js @@ -1717,6 +1717,64 @@ firetable.ui = { } } } + var $discoverItem = $('#thediscovers .pvbar').remove(); + ftapi.events.on('newProduce', function(data) { + if (data.img == "img/idlogo.png" && ftconfigs.defaultAlbumArtUrl.length) data.img = ftconfigs.defaultAlbumArtUrl; + var firstpart = "yt"; + if (data.type == 2) firstpart == "sc"; + var pkey = firstpart + "cid" + data.cid; + var $histItem = $discoverItem.clone(); + $histItem.attr('id', "pvbar" + pkey); + $histItem.attr("data-key", pkey); + $histItem.attr("data-histid", data.histID); + $histItem.attr("data-cid", data.cid); + $histItem.attr("data-type", data.type); + + $histItem.find('.previewicon').attr('id', "pv" + pkey).on('click', function() { + firetable.actions.pview( + $(this).closest('.pvbar').attr('data-key'), + true, + $(this).closest('.pvbar').attr('data-type'), + true + ); + }); + $histItem.find('.histlink').attr({ + 'href': data.url, + 'tabindex': "-1", + 'id': data.histID + }).text(data.artist + " - " + data.title); + $histItem.find('.edittags').on('click', function() { + if ($(this).hasClass("editing")){ + $(this).removeClass("editing"); + $(this).closest('.pvbar').find('.tagPromptBox').remove(); + } else { + $(this).addClass("editing"); + firetable.actions.editTagsPrompt($(this).closest('.pvbar').attr('data-key'),data.artist + " - " + data.title) + } + }); + try{ + + if (!ftapi.isMod) $histItem.find('.edittags').hide(); + } catch (e){ + console.log(e); + } + + $histItem.find('.histdj').text(data.dj); + $histItem.find('.histdate').text(firetable.utilities.format_date(data.when)); + $histItem.find('.histtime').text(firetable.utilities.format_time(data.when)); + $histItem.find('.histeal').attr('id', "apv" + data.type + data.cid).on('click', function() { + firetable.actions.queueTrack( + $(this).closest('.pvbar').attr('data-cid'), + firetable.utilities.htmlEscape($(this).closest('.pvbar').find('.histlink').text()), + $(this).closest('.pvbar').attr('data-type'), + true + ); + }); + $histItem.find('.discart').css('background-image', 'url(' + data.img + ')'); + $histItem.prependTo("#thediscovers"); + // simplebar scroll update? + }); + var $historyItem = $('#thehistory .pvbar').remove(); ftapi.events.on('editedHistory', function(data) { console.log("HIST EDIT", data); From aa5c969d358801cbbf6651613a9616a756ef03b2 Mon Sep 17 00:00:00 2001 From: Matt Thompson Date: Thu, 11 Jan 2024 16:04:19 -0600 Subject: [PATCH 11/23] kill produce on small screens for now --- css/looks.css | 3 +++ index.html | 2 +- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/css/looks.css b/css/looks.css index 77778b8..ea2441f 100644 --- a/css/looks.css +++ b/css/looks.css @@ -2080,6 +2080,9 @@ div#blog { cursor: none; pointer-events: none; } + #discover{ + display:none; + } #login { grid-area: login !important; diff --git a/index.html b/index.html index 0127df1..559ff8f 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,7 @@ - + From 8b292cd6eaf51974cec31442bbb4beb817bc4943 Mon Sep 17 00:00:00 2001 From: Matt Thompson Date: Thu, 11 Jan 2024 16:27:18 -0600 Subject: [PATCH 12/23] make it so people in medium mode can see their queue again --- css/looks.css | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/css/looks.css b/css/looks.css index ea2441f..aad78f7 100644 --- a/css/looks.css +++ b/css/looks.css @@ -540,6 +540,7 @@ div#roomlogo { #mainGrid.mmqueue #usersbox, #mainGrid.mmqueue #thehistoryWrap, #mainGrid.mmqueue #actualChat, +#mainGrid.mmqueue #discover #mainGrid.mmqueue #login, #mainGrid.mmusrs #discover { display: none; @@ -1739,7 +1740,7 @@ img.emoji { } /* Discover */ -#discover { +#mainGrid.login #discover { grid-area: login; padding: var(--pad5); background: #151515; @@ -1748,6 +1749,11 @@ img.emoji { text-align: center; } +#mainGrid.mmqueue #discover{ + display: none !important; +} + + #discover h2{ font-size: 2.5rem; font-weight: 700; @@ -2151,7 +2157,8 @@ div#blog { } #mainGrid.login #queuebox, - #mainGrid.login #thehistoryWrap { + #mainGrid.login #thehistoryWrap +{ display: none; } From fda5412a89eb80b348141f405b520c40c55c11a8 Mon Sep 17 00:00:00 2001 From: Matt Thompson Date: Fri, 12 Jan 2024 09:36:38 -0600 Subject: [PATCH 13/23] discover lite on mobile thank you --- css/looks.css | 50 ++++++++++++++++++++++++++++++++++++++++++++++---- index.html | 13 ++++++++----- js/main.js | 11 +++++++++++ 3 files changed, 65 insertions(+), 9 deletions(-) diff --git a/css/looks.css b/css/looks.css index aad78f7..248ba9d 100644 --- a/css/looks.css +++ b/css/looks.css @@ -1742,7 +1742,7 @@ img.emoji { /* Discover */ #mainGrid.login #discover { grid-area: login; - padding: var(--pad5); + padding: var(--pad4); background: #151515; overflow: auto; height: 100%; @@ -1753,6 +1753,15 @@ img.emoji { display: none !important; } +.miniLoginNavOnly{ + display: none; +} + +#minidiscover, #minijoin{ + color: var(--orange); + cursor: pointer; +} + #discover h2{ font-size: 2.5rem; @@ -2086,14 +2095,47 @@ div#blog { cursor: none; pointer-events: none; } - #discover{ - display:none; - } + +/* TEMPORARY TERRIBLE MOBILE DISCOVER */ + +.miniLoginInvisible{ + display: none !important; +} + +.miniLoginNavOnly{ + display: block !important; +} + +#thediscovers .pvbar { + display: inline-block; + width: 150px; + height: 300px; + padding: 10px; + margin-top: 25px; +} + +#discover h2 { + font-size: 2rem !important; +} + +#mainGrid.login #discover { + padding: var(--pad2) !important; + +} + +.discart { + + width: 150px !important; + height: 150px !important; + +} #login { grid-area: login !important; } +/* END TEMPORARY MOBILE DISCOVER */ + } @media only screen and (min-width: 800px) { diff --git a/index.html b/index.html index 559ff8f..5341b1c 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,7 @@ - + @@ -340,6 +340,7 @@

We Are Indie Discotheque

You've found the home of Indie Discotheque, The Alternative Dance Collective.

We're spinning h0t alt dance / nu disco / synth trax 24/7. Here's some of the freshest produce we've gathered recently.

+

If you like what you hear, join us by creating an account or logging in!

@@ -357,10 +358,12 @@

We Are Indie Discotheque

-
+

Welcome To Firetable!

Want to jump on the DJ table and pick some h0t tunes to play? Just want to join the conversation?

+


Or learn more about Indie Discotheque.

+
+
+ +
@@ -563,9 +566,9 @@

Playlist Import Machine

- - - + + + diff --git a/js/main.js b/js/main.js index 3908df0..aa654e9 100644 --- a/js/main.js +++ b/js/main.js @@ -58,7 +58,7 @@ chatScroll.getScrollElement().addEventListener('scroll', function() { if (firetable.utilities.isChatPrettyMuchAtBottom()) $('#morechats').removeClass('show'); }); -firetable.version = "01.10.4"; +firetable.version = "01.10.7"; var player, $playlistItemTemplate; @@ -210,6 +210,122 @@ firetable.init = function() { $(".sociallogo.soundcloud").css("display", "inline-block"); } + firetable.lastfm = { + sk: false, + key: "e86f3b80e48769c03f2b4e0609e12924", + songStart: null, + duration: null, + timer: null, + newSession: function(xhr) { + + return function() { + console.log(xhr.responseText); + jsonResponse = JSON.parse(xhr.responseText); + firetable.lastfm.sk = jsonResponse.session.key; + localStorage["ftLastfmSession"] = firetable.lastfm.sk; + $("#scrobtoggle").html("Disconnect Lastfm Scrobbling"); + + }; + }, + scrobble: function() { + var artist = firetable.song.artist; + var track = firetable.song.title; + + var params = { + artist: artist, + track: track, + timestamp: firetable.lastfm.songStart, + api_key: firetable.lastfm.key, + sk: firetable.lastfm.sk, + method: "track.scrobble" + }; + + var sig = firetable.lastfm.getApiSignature(params); + params.api_sig = sig; + + var request_url = 'https://ws.audioscrobbler.com/2.0/?' + serialize(params); + var xhr = new XMLHttpRequest(); + xhr.open('POST', request_url, true); + xhr.onload = console.log("scrobbled"); + xhr.onerror = firetable.lastfm._onAjaxError; + xhr.send(); + + }, + love: function() { + var artist = firetable.song.artist; + var track = firetable.song.title; + + var params = { + artist: artist, + track: track, + api_key: firetable.lastfm.key, + sk: firetable.lastfm.sk, + method: "track.love" + }; + + var sig = firetable.lastfm.getApiSignature(params); + params.api_sig = sig; + + var request_url = 'https://ws.audioscrobbler.com/2.0/?' + serialize(params); + var xhr = new XMLHttpRequest(); + xhr.open('POST', request_url, true); + xhr.onload = console.log("loved"); + xhr.onerror = firetable.lastfm._onAjaxError; + xhr.send(); + + }, + _onAjaxError: function(xhr, status, error) { + console.log(xhr); + console.log(status); + console.log(error); + }, + nowPlaying: function() { + var artist = firetable.song.artist; + var track = firetable.song.title; + + var params = { + artist: artist, + track: track, + duration: firetable.lastfm.duration, + api_key: firetable.lastfm.key, + sk: firetable.lastfm.sk, + method: "track.updateNowPlaying" + }; + + var sig = firetable.lastfm.getApiSignature(params); + params.api_sig = sig; + + var request_url = 'https://ws.audioscrobbler.com/2.0/?' + serialize(params); + var xhr = new XMLHttpRequest(); + xhr.open('POST', request_url, true); + xhr.onload = console.log("nowplayd"); + xhr.onerror = firetable.lastfm._onAjaxError; + + xhr.send(); + + }, + getApiSignature: function(params) { + var i, key, keys, max, paramString; + + keys = []; + paramString = ""; + + for (key in params) { + if (params.hasOwnProperty(key)) { + keys.push(key); + } + } + keys.sort(); + + for (i = 0, max = keys.length; i < max; i += 1) { + key = keys[i]; + paramString += key + params[key]; + } + + return calcMD5(paramString + "838d63e62b556f74176656640b75e33e"); + } + }; + if (ftconfigs.logoImage) $("#roomlogo").css("background-image", "url(" + ftconfigs.logoImage + ")") document.title = ftconfigs.roomName + " | firetable"; if (ftconfigs.roomInfoUrl.length) $("#roomInfo").attr("href", ftconfigs.roomInfoUrl); @@ -947,7 +1063,7 @@ firetable.actions = { $pvbar.addClass('editing'); var $tags = $tagEditorTemplate.clone().appendTo($pvbar); $tags.find(".tagMachine").val(tag); - + firetable.debug && console.log('edit tags song id:', songid); }, @@ -1631,7 +1747,7 @@ firetable.ui = { $("#login").addClass("miniLoginInvisible"); }); - $("#minijoin").bind("click", function() { + $("#minijoin").bind("click", function() { $("#discover").addClass("miniLoginInvisible"); $("#login").removeClass("miniLoginInvisible"); }); @@ -1650,6 +1766,47 @@ firetable.ui = { firetable.actions.updateQueue(); } }); + + //CHECK FOR LASTFM TOKEN + + var thingo = localStorage["ftLastfmSession"]; + if (thingo == "false") thingo = false; + if (thingo) { + firetable.lastfm.sk = thingo; + $("#scrobtoggle").html("Disconnect Lastfm Scrobbling"); + } else { + $("#scrobtoggle").html("Set up last.fm scrobbling"); + } + + var pattern = /[?&]token=/; + var URL = location.search; + + if (pattern.test(URL) && !firetable.lastfm.sk) { + var queries = {}; + $.each(document.location.search.substr(1).split('&'), function(c, q) { + var i = q.split('='); + queries[i[0].toString()] = i[1].toString(); + }); + //token time + var params = { + api_key: firetable.lastfm.key, + token: queries.token, + method: "auth.getSession" + }; + + var sig = firetable.lastfm.getApiSignature(params); + params.api_sig = sig; + + var request_url = 'https://ws.audioscrobbler.com/2.0/?' + serialize(params) + "&format=json"; + var xhr = new XMLHttpRequest(); + xhr.open('POST', request_url, true); + xhr.onload = firetable.lastfm.newSession(xhr); + xhr.onerror = firetable.lastfm._onAjaxError; + + xhr.send(); + } + + //GET SETTINGS FROM LOCALSTORAGE var disableMediaPlayback = localStorage["firetableDisableMedia"]; if (typeof disableMediaPlayback == "undefined") { @@ -1754,22 +1911,22 @@ firetable.ui = { 'tabindex': "-1", 'id': data.histID }).text(data.artist + " - " + data.title); - $histItem.find('.edittags').on('click', function() { - if ($(this).hasClass("editing")){ - $(this).removeClass("editing"); - $(this).closest('.pvbar').find('.tagPromptBox').remove(); - } else { - $(this).addClass("editing"); - firetable.actions.editTagsPrompt($(this).closest('.pvbar').attr('data-key'),data.artist + " - " + data.title) - } - }); - try{ - - if (!ftapi.isMod) $histItem.find('.edittags').hide(); - } catch (e){ - console.log(e); - } - + $histItem.find('.edittags').on('click', function() { + if ($(this).hasClass("editing")) { + $(this).removeClass("editing"); + $(this).closest('.pvbar').find('.tagPromptBox').remove(); + } else { + $(this).addClass("editing"); + firetable.actions.editTagsPrompt($(this).closest('.pvbar').attr('data-key'), data.artist + " - " + data.title) + } + }); + try { + + if (!ftapi.isMod) $histItem.find('.edittags').hide(); + } catch (e) { + console.log(e); + } + $histItem.find('.histdj').text(data.dj); $histItem.find('.histdate').text(firetable.utilities.format_date(data.when)); $histItem.find('.histtime').text(firetable.utilities.format_time(data.when)); @@ -1788,8 +1945,8 @@ firetable.ui = { var $historyItem = $('#thehistory .pvbar').remove(); ftapi.events.on('editedHistory', function(data) { - console.log("HIST EDIT", data); - $("#"+data.histID).text(data.artist+ " - " + data.title); + console.log("HIST EDIT", data); + $("#" + data.histID).text(data.artist + " - " + data.title); }); ftapi.events.on('modCheck', function(data) { if (data) $(".edittags").show(); @@ -1819,22 +1976,22 @@ firetable.ui = { 'tabindex': "-1", 'id': data.histID }).text(data.artist + " - " + data.title); - $histItem.find('.edittags').on('click', function() { - if ($(this).hasClass("editing")){ - $(this).removeClass("editing"); - $(this).closest('.pvbar').find('.tagPromptBox').remove(); - } else { - $(this).addClass("editing"); - firetable.actions.editTagsPrompt($(this).closest('.pvbar').attr('data-key'),data.artist + " - " + data.title) - } - }); - try{ - - if (!ftapi.isMod) $histItem.find('.edittags').hide(); - } catch (e){ - console.log(e); - } - + $histItem.find('.edittags').on('click', function() { + if ($(this).hasClass("editing")) { + $(this).removeClass("editing"); + $(this).closest('.pvbar').find('.tagPromptBox').remove(); + } else { + $(this).addClass("editing"); + firetable.actions.editTagsPrompt($(this).closest('.pvbar').attr('data-key'), data.artist + " - " + data.title) + } + }); + try { + + if (!ftapi.isMod) $histItem.find('.edittags').hide(); + } catch (e) { + console.log(e); + } + $histItem.find('.histdj').text(data.dj); $histItem.find('.histdate').text(firetable.utilities.format_date(data.when)); $histItem.find('.histtime').text(firetable.utilities.format_time(data.when)); @@ -1872,6 +2029,8 @@ firetable.ui = { if (firetable.song.cid == data.cid && data.adamData.track_name) { $("#track").text(firetable.ui.strip(data.adamData.track_name)); $("#artist").text(firetable.ui.strip(data.adamData.artist)); + firetable.song.title = firetable.ui.strip(data.adamData.track_name); + firetable.song.artist = firetable.ui.strip(data.adamData.artist); var nicename = firetable.song.djname; var showPlaycount = false; if (data.adamData.playcount) { @@ -1948,6 +2107,21 @@ firetable.ui = { firetable.song = data; firetable.debug && console.log("NEW TRACK", data); firetable.debug && console.log('time since:', timeSince); + + if (firetable.lastfm.timer != null) { + clearTimeout(firetable.lastfm.timer); + firetable.lastfm.timer = null; + } + if (firetable.lastfm.sk) { + firetable.lastfm.duration = Math.floor(timeLeft); + firetable.lastfm.songStart = Math.floor((new Date()).getTime() / 1000); + firetable.lastfm.timer = setTimeout(function() { + firetable.lastfm.timer = null; + firetable.lastfm.scrobble(); + }, (timeLeft * 1000) - 3000); + firetable.lastfm.nowPlaying(); + } + if (data.type == 1) { $("#scScreen").hide(); $("#songlink").html(''); @@ -2621,7 +2795,7 @@ firetable.ui = { }); if (!firetable.pickerInit) { - const makeRequest = async() => { + const makeRequest = async () => { twemoji.parse(document.getElementById("pickerResults")); return true; } @@ -2655,6 +2829,14 @@ firetable.ui = { //SETTINGS TOGGLES + + let killLastfm = function() { + autoDub.lastfm.sk = false; + localStorage["ftLastfmSession"] = firetable.lastfm.sk; + $("#scrobtoggle").html("Set up last.fm scrobbling"); + + } + $('#badoopToggle').change(function() { if (this.checked) { firetable.debug && console.log("badoop on"); @@ -2836,19 +3018,19 @@ firetable.ui = { var thetype = $(this).closest('.pvbar').attr('data-type'); var songCid = $(this).closest('.pvbar').attr('data-cid'); var histID = $(this).closest('.pvbar').attr('data-histid'); - var val = $(this).val(); - if (val != "") { - var yargo = val.split(" - "); - var theartist = yargo[0]; - var thetitle = yargo[1]; - if (!theartist || !thetitle){ - alert("check yr tags"); - } else { - ftapi.actions.editTag(thetype, songCid, val, histID); - $(this).closest('.editing').removeClass('editing').next('.tagPromptBox').remove(); - } + var val = $(this).val(); + if (val != "") { + var yargo = val.split(" - "); + var theartist = yargo[0]; + var thetitle = yargo[1]; + if (!theartist || !thetitle) { + alert("check yr tags"); + } else { + ftapi.actions.editTag(thetype, songCid, val, histID); + $(this).closest('.editing').removeClass('editing').next('.tagPromptBox').remove(); } - } + } + } }); $("#changeUsername").bind("keyup", function(e) { if (e.which == 13) { @@ -3800,4 +3982,188 @@ class Glitch { } +/* + * A JavaScript implementation of the RSA Data Security, Inc. MD5 Message + * Digest Algorithm, as defined in RFC 1321. + * Copyright (C) Paul Johnston 1999 - 2000. + * Updated by Greg Holt 2000 - 2001. + * See http://pajhome.org.uk/site/legal.html for details. + */ + +/* + * Convert a 32-bit number to a hex string with ls-byte first + */ +var hex_chr = "0123456789abcdef"; + +function rhex(num) { + str = ""; + for (j = 0; j <= 3; j++) + str += hex_chr.charAt((num >> (j * 8 + 4)) & 0x0F) + + hex_chr.charAt((num >> (j * 8)) & 0x0F); + return str; +} + +/* + * Convert a string to a sequence of 16-word blocks, stored as an array. + * Append padding bits and the length, as described in the MD5 standard. + */ +function str2blks_MD5(str) { + nblk = ((str.length + 8) >> 6) + 1; + blks = new Array(nblk * 16); + for (i = 0; i < nblk * 16; i++) blks[i] = 0; + for (i = 0; i < str.length; i++) + blks[i >> 2] |= str.charCodeAt(i) << ((i % 4) * 8); + blks[i >> 2] |= 0x80 << ((i % 4) * 8); + blks[nblk * 16 - 2] = str.length * 8; + return blks; +} + +/* + * Add integers, wrapping at 2^32. This uses 16-bit operations internally + * to work around bugs in some JS interpreters. + */ +function add(x, y) { + var lsw = (x & 0xFFFF) + (y & 0xFFFF); + var msw = (x >> 16) + (y >> 16) + (lsw >> 16); + return (msw << 16) | (lsw & 0xFFFF); +} + +/* + * Bitwise rotate a 32-bit number to the left + */ +function rol(num, cnt) { + return (num << cnt) | (num >>> (32 - cnt)); +} + +/* + * These functions implement the basic operation for each round of the + * algorithm. + */ +function cmn(q, a, b, x, s, t) { + return add(rol(add(add(a, q), add(x, t)), s), b); +} + +function ff(a, b, c, d, x, s, t) { + return cmn((b & c) | ((~b) & d), a, b, x, s, t); +} + +function gg(a, b, c, d, x, s, t) { + return cmn((b & d) | (c & (~d)), a, b, x, s, t); +} + +function hh(a, b, c, d, x, s, t) { + return cmn(b ^ c ^ d, a, b, x, s, t); +} + +function ii(a, b, c, d, x, s, t) { + return cmn(c ^ (b | (~d)), a, b, x, s, t); +} + +/* + * Take a string and return the hex representation of its MD5. + */ +function calcMD5(str) { + x = str2blks_MD5(str); + a = 1732584193; + b = -271733879; + c = -1732584194; + d = 271733878; + + for (i = 0; i < x.length; i += 16) { + olda = a; + oldb = b; + oldc = c; + oldd = d; + + a = ff(a, b, c, d, x[i + 0], 7, -680876936); + d = ff(d, a, b, c, x[i + 1], 12, -389564586); + c = ff(c, d, a, b, x[i + 2], 17, 606105819); + b = ff(b, c, d, a, x[i + 3], 22, -1044525330); + a = ff(a, b, c, d, x[i + 4], 7, -176418897); + d = ff(d, a, b, c, x[i + 5], 12, 1200080426); + c = ff(c, d, a, b, x[i + 6], 17, -1473231341); + b = ff(b, c, d, a, x[i + 7], 22, -45705983); + a = ff(a, b, c, d, x[i + 8], 7, 1770035416); + d = ff(d, a, b, c, x[i + 9], 12, -1958414417); + c = ff(c, d, a, b, x[i + 10], 17, -42063); + b = ff(b, c, d, a, x[i + 11], 22, -1990404162); + a = ff(a, b, c, d, x[i + 12], 7, 1804603682); + d = ff(d, a, b, c, x[i + 13], 12, -40341101); + c = ff(c, d, a, b, x[i + 14], 17, -1502002290); + b = ff(b, c, d, a, x[i + 15], 22, 1236535329); + + a = gg(a, b, c, d, x[i + 1], 5, -165796510); + d = gg(d, a, b, c, x[i + 6], 9, -1069501632); + c = gg(c, d, a, b, x[i + 11], 14, 643717713); + b = gg(b, c, d, a, x[i + 0], 20, -373897302); + a = gg(a, b, c, d, x[i + 5], 5, -701558691); + d = gg(d, a, b, c, x[i + 10], 9, 38016083); + c = gg(c, d, a, b, x[i + 15], 14, -660478335); + b = gg(b, c, d, a, x[i + 4], 20, -405537848); + a = gg(a, b, c, d, x[i + 9], 5, 568446438); + d = gg(d, a, b, c, x[i + 14], 9, -1019803690); + c = gg(c, d, a, b, x[i + 3], 14, -187363961); + b = gg(b, c, d, a, x[i + 8], 20, 1163531501); + a = gg(a, b, c, d, x[i + 13], 5, -1444681467); + d = gg(d, a, b, c, x[i + 2], 9, -51403784); + c = gg(c, d, a, b, x[i + 7], 14, 1735328473); + b = gg(b, c, d, a, x[i + 12], 20, -1926607734); + + a = hh(a, b, c, d, x[i + 5], 4, -378558); + d = hh(d, a, b, c, x[i + 8], 11, -2022574463); + c = hh(c, d, a, b, x[i + 11], 16, 1839030562); + b = hh(b, c, d, a, x[i + 14], 23, -35309556); + a = hh(a, b, c, d, x[i + 1], 4, -1530992060); + d = hh(d, a, b, c, x[i + 4], 11, 1272893353); + c = hh(c, d, a, b, x[i + 7], 16, -155497632); + b = hh(b, c, d, a, x[i + 10], 23, -1094730640); + a = hh(a, b, c, d, x[i + 13], 4, 681279174); + d = hh(d, a, b, c, x[i + 0], 11, -358537222); + c = hh(c, d, a, b, x[i + 3], 16, -722521979); + b = hh(b, c, d, a, x[i + 6], 23, 76029189); + a = hh(a, b, c, d, x[i + 9], 4, -640364487); + d = hh(d, a, b, c, x[i + 12], 11, -421815835); + c = hh(c, d, a, b, x[i + 15], 16, 530742520); + b = hh(b, c, d, a, x[i + 2], 23, -995338651); + + a = ii(a, b, c, d, x[i + 0], 6, -198630844); + d = ii(d, a, b, c, x[i + 7], 10, 1126891415); + c = ii(c, d, a, b, x[i + 14], 15, -1416354905); + b = ii(b, c, d, a, x[i + 5], 21, -57434055); + a = ii(a, b, c, d, x[i + 12], 6, 1700485571); + d = ii(d, a, b, c, x[i + 3], 10, -1894986606); + c = ii(c, d, a, b, x[i + 10], 15, -1051523); + b = ii(b, c, d, a, x[i + 1], 21, -2054922799); + a = ii(a, b, c, d, x[i + 8], 6, 1873313359); + d = ii(d, a, b, c, x[i + 15], 10, -30611744); + c = ii(c, d, a, b, x[i + 6], 15, -1560198380); + b = ii(b, c, d, a, x[i + 13], 21, 1309151649); + a = ii(a, b, c, d, x[i + 4], 6, -145523070); + d = ii(d, a, b, c, x[i + 11], 10, -1120210379); + c = ii(c, d, a, b, x[i + 2], 15, 718787259); + b = ii(b, c, d, a, x[i + 9], 21, -343485551); + + a = add(a, olda); + b = add(b, oldb); + c = add(c, oldc); + d = add(d, oldd); + } + return rhex(a) + rhex(b) + rhex(c) + rhex(d); +} + + +var serialize = function(obj, prefix) { + var str = []; + for (var p in obj) { + if (obj.hasOwnProperty(p)) { + var k = prefix ? prefix + "[" + p + "]" : p, + v = obj[p]; + str.push(typeof v == "object" ? + serialize(v, k) : + encodeURIComponent(k) + "=" + encodeURIComponent(v)); + } + } + return str.join("&"); +} + if (!firetable.started) firetable.init(); \ No newline at end of file From 62c880724583f4a7854f5fe34bbc84c0d3e8dc96 Mon Sep 17 00:00:00 2001 From: Joe Woods Date: Fri, 24 May 2024 20:34:54 -0400 Subject: [PATCH 16/23] last.fm: be less official thanks Otherwise, one may need to manually go in and remove (Official Audio)s from one's scrobble history --- js/main.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/js/main.js b/js/main.js index aa654e9..1031045 100644 --- a/js/main.js +++ b/js/main.js @@ -279,9 +279,12 @@ firetable.init = function() { console.log(status); console.log(error); }, + _cleanForScrobble: function(title) { + return title.replace(/ \([oO]fficial (?:[aA]udio|[vV]ideo)\)/, "") + }, nowPlaying: function() { var artist = firetable.song.artist; - var track = firetable.song.title; + var track = firetable.lastfm._cleanForScrobble(firetable.song.title); var params = { artist: artist, From 615e9991c7ae1fc29f42056e09d9f3f950ec5af7 Mon Sep 17 00:00:00 2001 From: Matt Thompson Date: Sat, 25 May 2024 14:31:02 -0500 Subject: [PATCH 17/23] also add tag clean to scrobble and love lastfm functions --- js/main.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/js/main.js b/js/main.js index 1031045..a114ac3 100644 --- a/js/main.js +++ b/js/main.js @@ -58,7 +58,7 @@ chatScroll.getScrollElement().addEventListener('scroll', function() { if (firetable.utilities.isChatPrettyMuchAtBottom()) $('#morechats').removeClass('show'); }); -firetable.version = "01.10.7"; +firetable.version = "01.10.8"; var player, $playlistItemTemplate; @@ -229,7 +229,7 @@ firetable.init = function() { }, scrobble: function() { var artist = firetable.song.artist; - var track = firetable.song.title; + var track = firetable.lastfm._cleanForScrobble(firetable.song.title); var params = { artist: artist, @@ -253,7 +253,7 @@ firetable.init = function() { }, love: function() { var artist = firetable.song.artist; - var track = firetable.song.title; + var track = firetable.lastfm._cleanForScrobble(firetable.song.title); var params = { artist: artist, From e866544a63547f8417c2a3676c8631d60d8ca2bc Mon Sep 17 00:00:00 2001 From: Matt Thompson Date: Fri, 29 Nov 2024 22:43:17 -0600 Subject: [PATCH 18/23] lights never go away --- index.html | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/index.html b/index.html index 842618a..395da70 100644 --- a/index.html +++ b/index.html @@ -11,7 +11,7 @@ - + @@ -58,11 +58,7 @@
-
-
-
-
-
    +
      • @@ -106,6 +102,10 @@
    +
    +
    +
    +
    @@ -566,9 +566,9 @@

    Playlist Import Machine

    - - - + + + From 25eb9128c0944127bc6d6916bb1a649d0b18f2fb Mon Sep 17 00:00:00 2001 From: Matt Thompson Date: Fri, 3 Jan 2025 10:09:14 -0600 Subject: [PATCH 19/23] update the xmas lights --- js/main.js | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/js/main.js b/js/main.js index a114ac3..30291dc 100644 --- a/js/main.js +++ b/js/main.js @@ -216,6 +216,11 @@ firetable.init = function() { songStart: null, duration: null, timer: null, + killSession: function() { + firetable.lastfm.sk = false; + localStorage["ftLastfmSession"] = firetable.lastfm.sk; + $("#scrobtoggle").html("Set up last.fm scrobbling"); + }, newSession: function(xhr) { return function() { @@ -223,7 +228,7 @@ firetable.init = function() { jsonResponse = JSON.parse(xhr.responseText); firetable.lastfm.sk = jsonResponse.session.key; localStorage["ftLastfmSession"] = firetable.lastfm.sk; - $("#scrobtoggle").html("Disconnect Lastfm Scrobbling"); + $("#scrobtoggle").html("Disconnect Lastfm Scrobbling"); }; }, @@ -1776,7 +1781,7 @@ firetable.ui = { if (thingo == "false") thingo = false; if (thingo) { firetable.lastfm.sk = thingo; - $("#scrobtoggle").html("Disconnect Lastfm Scrobbling"); + $("#scrobtoggle").html("Disconnect Lastfm Scrobbling"); } else { $("#scrobtoggle").html("Set up last.fm scrobbling"); } @@ -2833,12 +2838,6 @@ firetable.ui = { //SETTINGS TOGGLES - let killLastfm = function() { - autoDub.lastfm.sk = false; - localStorage["ftLastfmSession"] = firetable.lastfm.sk; - $("#scrobtoggle").html("Set up last.fm scrobbling"); - - } $('#badoopToggle').change(function() { if (this.checked) { From 22f00091940e754cbcaa8c6092ecefab617bead8 Mon Sep 17 00:00:00 2001 From: Matt Thompson Date: Wed, 25 Jun 2025 23:45:11 -0500 Subject: [PATCH 20/23] yt embed api needs a video id on init now --- js/main.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/main.js b/js/main.js index 30291dc..d2d342a 100644 --- a/js/main.js +++ b/js/main.js @@ -91,7 +91,7 @@ function onYouTubeIframeAPIReady() { 'autoplay': 1, 'controls': 0 }, - videoId: '0', + videoId: '5mGuCdlCcNM', events: { onReady: initialize, onStateChange: function() { From 2ee46a0703c8273425e0b51802ac33dec0cf2db0 Mon Sep 17 00:00:00 2001 From: Andrew Tibbetts Date: Sun, 12 Apr 2026 01:49:26 -0500 Subject: [PATCH 21/23] today's work, mostly ui tweaks --- css/looks.css | 446 ++++++++++++++++++++++++++++++++++++++----------- index.html | 114 +++++++------ js/init.js | 26 ++- js/playlist.js | 37 +++- js/popover.js | 35 ++++ js/room.js | 14 +- js/ui.js | 171 ++++++++++++++++--- 7 files changed, 654 insertions(+), 189 deletions(-) create mode 100644 js/popover.js diff --git a/css/looks.css b/css/looks.css index 321ee8e..d7c748d 100644 --- a/css/looks.css +++ b/css/looks.css @@ -36,13 +36,14 @@ --color-bg-s2: #111111; --color-bg-t1: #222222; --color-bg-t2: #282828; + --color-bg-t3: #2E2E2E; --color-orange: #f4810b; --color-orangelite: #f6993c; --color-orange66: #f4810b66; --color-orange33: #f4810b33; --color-accent: var(--color-orange); - --color-text: #bbbbbb; - --color-text-light: #eee; + --color-text: #e3e3e3; + --color-text-light: #fff; --color-text-muted: #888; --color-text-dim: #666; @@ -63,7 +64,7 @@ --radius-pill: 999px; /* Typography */ - --font-family: "Open Sans", helvetica, arial, sans-serif; + --font-family: "Inter", "Open Sans", helvetica, arial, sans-serif; /* Shadows */ --shadow-drop: 0 0.25rem 0.5rem -0.25rem black; @@ -120,6 +121,10 @@ a { :focus { outline: none; +} + +:focus-visible { + outline: none; box-shadow: 0 0 0.5rem var(--color-orange); } @@ -127,8 +132,7 @@ input:not([type="checkbox"]):not([type="radio"]), select, button { height: 2rem; - padding: var(--pad1) var(--pad2); - font-size: 0.9rem; + padding: var(--pad1) var(--pad3); font-family: var(--font-family); color: var(--color-text-light); background-color: rgba(255, 255, 255, 0.05); @@ -139,6 +143,64 @@ button { box-shadow: var(--shadow-drop); } +select { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background-color: var(--color-bg-t3); + background-image: url("data:image/svg+xml;utf8,"); + background-repeat: no-repeat; + background-position: right 0.65rem center; + background-size: 16px 16px; + padding-right: 2rem; +} + +select::-ms-expand { + display: none; +} + +/* ── Progressive enhancement: appearance: base-select (Chrome 135+) ── */ +@supports (appearance: base-select) { + select { + appearance: base-select; + /* Keep the SVG bg caret — just let base-select handle the picker */ + background-color: var(--color-bg-t3); + padding-right: var(--pad3); + } + + /* The open dropdown surface */ + select::picker(select) { + background-color: var(--color-bg-t2); + color: var(--color-text-light); + border: 1px solid rgba(255, 255, 255, 0.1); + border-radius: var(--radius-md); + box-shadow: 0 0.5rem 2rem -0.25rem black; + padding: var(--pad1) 0; + } + + /* Individual options */ + select option { + padding-block: var(--pad1); + padding-inline: var(--pad2); + color: var(--color-text-light); + background-color: var(--color-bg-t2); + } + + select option:is(:hover, :focus-visible, :checked) { + background-color: var(--color-bg-t3); + } + + /* Checkmark next to the selected item */ + select::checkmark { + color: var(--color-accent); + } + + /* Hide the native picker-icon — our background-image caret replaces it */ + select::picker-icon { + display: none; + } +} + input:not([type="checkbox"]):not([type="radio"]) { background-color: rgba(0, 0, 0, 0.5); border-top-color: rgba(0, 0, 0, 0.85); @@ -162,10 +224,10 @@ option { background-color: #333; } -input:focus, -select:focus, -textarea:focus, -button:focus { +input:focus-visible, +select:focus-visible, +textarea:focus-visible, +button:focus-visible { outline: none; } @@ -234,12 +296,14 @@ code { display: flex; align-items: center; width: 100%; - border-radius: 20px; overflow: hidden; } .tab { flex: 1 1 auto; + display: flex; + align-items: center; + justify-content: center; height: auto; min-height: 2.5rem; padding: 0.5em; @@ -250,15 +314,28 @@ code { letter-spacing: .05em; color: #999; text-align: center; - background-color: var(--color-bg); - border: 0; + background: none; + border: none; + border-radius: 0; box-shadow: none; } .tab.on { + position: relative; z-index: 1; color: #ffffff; - background: linear-gradient(var(--color-bg), black); + + &::after { + content: ""; + position: absolute; + left: 0; + right: 0; + bottom: 0; + height: 3px; + background-color: var(--color-accent); + border-radius: 99px; + opacity: 0.5; + } } .logoutButt { @@ -283,6 +360,7 @@ code { color: rgba(255, 255, 255, 0.4); cursor: pointer; border-radius: var(--radius-sm); + box-shadow: none; } .djplaque .deckRemoveBtn:hover { color: #fff; @@ -334,7 +412,7 @@ code { background: rgba(255, 255, 255, 0.1); } -.graybutt:focus { +.graybutt:focus-visible { background: rgba(255, 255, 255, 0.1); } @@ -436,6 +514,7 @@ code { .pvbarWrap { display: flex; + position: relative; &:hover { background-color: var(--color-bg-t1); @@ -453,7 +532,8 @@ code { margin-left: var(--pad3); } -#viewnav .header_icon .material-icons { +#viewnav .header_icon .material-icons, +#viewnav .header_icon .material-symbols-outlined { font-size: 1.75rem; } @@ -502,6 +582,11 @@ a.sociallogo[href] { fill: var(--color-text-muted); } +.sociallogo.facebook svg { + width: 0.95rem; + height: 0.95rem; +} + #roomlogo { background-image: url(../img/idlogo2.png); background-size: contain; @@ -538,16 +623,19 @@ a.sociallogo[href] { box-shadow: none; } -.header_icon .material-icons { +.header_icon .material-icons, +.header_icon .material-symbols-outlined { font-size: 1.2rem; color: var(--color-text-muted); } -.header_icon:hover .material-icons { +.header_icon:hover .material-icons, +.header_icon:hover .material-symbols-outlined { color: white; } -.header_icon.on .material-icons { +.header_icon.on .material-icons, +.header_icon.on .material-symbols-outlined { color: white; } @@ -642,6 +730,7 @@ a.sociallogo[href] { #mainGrid.mmqueue.view-playlists #queuebox { display: flex; } #mainGrid.mmqueue.view-history #thehistoryWrap { display: flex; } #mainGrid.mmqueue.view-cards #cardsWrap { display: block; } +#mainGrid.mmqueue.view-discover #discover { display: flex; } #mainGrid.mmusrs #actualChat { display: none; } #mainGrid.mmusrs #usersbox { display: flex; } @@ -695,7 +784,8 @@ a.sociallogo[href] { /* Mobile: view selector lives in the mini-nav, not the header */ #playlists, #history, -#cardcase { +#cardcase, +#discover-nav { display: none; } @@ -753,7 +843,7 @@ a.sociallogo[href] { display: grid; grid-template-columns: auto auto 1fr; align-items: center; - gap: var(--pad3) var(--pad2); + gap: var(--pad2); padding: var(--pad4); } @@ -783,7 +873,7 @@ a.sociallogo[href] { display: flex; align-items: center; margin-left: 0.25rem; - font-size: 1rem; + font-size: 0.875rem; font-weight: 400; } .prson.blockd .prsnNameRole { @@ -863,8 +953,8 @@ a.sociallogo[href] { display: flex; align-items: center; position: relative; - width: 2rem; - height: 2rem; + width: 1.5rem; + height: 1.5rem; background-position: 50% 72%; } @@ -904,7 +994,7 @@ a.sociallogo[href] { #albumArt { grid-area: art; - margin: var(--pad1) var(--pad3) 0 var(--pad1); + margin: 0 var(--pad3) 0 var(--pad1); width: 4rem; height: 4rem; background-size: cover; @@ -913,15 +1003,17 @@ a.sociallogo[href] { #track { grid-area: track; - font-size: 1.25rem; + font-size: 1.125rem; + line-height: 1.1; color: white; } #timr { grid-area: timrvol; padding-top: 0.15em; + font-family: "Open Sans", helvetica, arial, sans-serif; font-size: 0.85rem; - font-weight: 700; + font-weight: 500; letter-spacing: 0.05em; text-align: right; color: rgba(255, 255, 255, 0.66); @@ -931,7 +1023,7 @@ a.sociallogo[href] { grid-area: artist; margin-bottom: var(--pad2); font-size: 0.875rem; - font-weight: 700; + font-weight: 500; overflow: hidden; color: white; white-space: nowrap; @@ -941,7 +1033,7 @@ a.sociallogo[href] { #source, #plays { font-size: 0.75rem; - font-weight: 700; + font-weight: 300; color: rgba(255, 255, 255, 0.8); } @@ -1011,27 +1103,25 @@ a.sociallogo[href] { #stealContain { display: none; position: fixed; + top: 0; + left: 0; z-index: 59; - top: 50%; - left: 50%; - box-shadow: 0 0.25rem 1rem -0.25rem black; } #stealBox { width: 16rem; padding: var(--pad3); - background-color: #333; + background-color: var(--color-bg-t1); border-radius: var(--radius-md); + box-shadow: 0 0.25rem 1rem -0.25rem black; } -#stealArrow { - margin-top: -0.5rem; - margin-left: 1.15rem; - width: 0; - height: 0; - border-left: 1rem solid transparent; - border-right: 1rem solid transparent; - border-bottom: 1rem solid #333; +.ft-arrow { + position: absolute; + width: 8px; + height: 8px; + background: var(--color-bg-t1); + transform: rotate(45deg); } #stealpicker { @@ -1039,12 +1129,50 @@ a.sociallogo[href] { font-size: 1rem; border: none; font-family: var(--font-family); - background-color: var(--color-bg-t1); - padding-left: var(--pad1); + background-color: var(--color-bg-t3); + padding-left: var(--pad3); color: var(--color-text-light); white-space: nowrap; } +/* ─── Reusable Popover Component ───────────────────────────────────────────── + Usage:
    ... + Position is set via JS in the toggle event handler. + ───────────────────────────────────────────────────────────────────────── */ +[popover].ft-popover { + position: fixed; + inset: auto; /* reset UA :popover-open { inset: 0 } so right/bottom don't stretch the element */ + top: 0; + left: 0; + margin: 0; + padding: 0; + border: none; + background: transparent; + overflow: visible; + color: inherit; +} + +.ft-popover-box { + background-color: var(--color-bg-t1); + border-radius: var(--radius-md); + box-shadow: 0 0.25rem 1rem -0.25rem black; + padding: var(--pad3); +} + +#socialPopover .ft-popover-box { + display: flex; + flex-direction: column; + align-items: center; + gap: var(--pad3); +} + +#socialPopover .sociallogo[href] { + display: flex; + align-items: center; + justify-content: center; + margin: 0; +} + #addToQueueBttn { margin-left: 1em; } @@ -1178,7 +1306,7 @@ html .ui-button.ui-state-disabled:active { /* ============================================ The Stage ============================================ */ -#djStage > div:not(#screenBox) { +#djStage > div:not(#screenBox):not(#ft-eq) { position: relative; z-index: 2; } @@ -1251,12 +1379,12 @@ html .ui-button.ui-state-disabled:active { text-align: center; color: #fff; background-image: linear-gradient(to bottom, var(--color-bg-t2), rgb(21,21,21)); - border-top: 1px solid rgba(255,255,255,0.25); + box-shadow: inset 0 1px rgba(255,255,255,0.2); border-top-left-radius: var(--radius-md); border-top-right-radius: var(--radius-md); } .djActive { - background-image: linear-gradient(to top, var(--color-bg-t2), var(--color-accent)); + background-image: linear-gradient(to top, color-mix(in srgb, var(--color-bg-t2) 50%, var(--color-accent) 50%), var(--color-accent)); } .djname { @@ -1268,24 +1396,7 @@ html .ui-button.ui-state-disabled:active { } .playcount { - position: absolute; - bottom: calc(100% + 0.4rem); - left: 50%; - transform: translateX(-50%); - padding: 0.2rem 0.5rem; - font-size: 0.7rem; - white-space: nowrap; - color: var(--color-text-light); - background: var(--color-bg-t2); - border-radius: var(--radius-sm); - pointer-events: none; - opacity: 0; - transition: opacity 150ms ease; - z-index: 10; -} - -.djplaque:hover .playcount { - opacity: 1; + display: none; } .addmeButt { @@ -1299,13 +1410,13 @@ html .ui-button.ui-state-disabled:active { top: 0; left: 0; right: 0; - height: 2px; + height: 3px; z-index: 1; } #prgbarbar { position: absolute; left: 0; - height: 2px; + height: 3px; } #screenBox { position: absolute; @@ -1317,6 +1428,50 @@ html .ui-button.ui-state-disabled:active { pointer-events: none; } +@keyframes ft-eq-bounce { + 0%, 100% { height: 15%; } + 50% { height: 85%; } +} + +#ft-eq { + position: absolute; + inset: 0; + display: none; + align-items: flex-end; + justify-content: space-around; + gap: 5px; + padding: 5px; + box-sizing: border-box; + z-index: 1; +} + +body:not(.screen) #ft-eq { + display: flex; +} + +.ft-eq-bar { + flex: 1; + min-height: 15%; + background-color: var(--color-accent); + opacity: 0.25; + animation: ft-eq-bounce 10s ease-in-out infinite; + transform: scaleX(2) scaleY(2); + filter: blur(50px); +} + +.ft-eq-bar:nth-child(1) { animation-duration: 11s; animation-delay: 0s; background-color: color-mix(in srgb, var(--color-accent) 80%, rebeccapurple 20%); } +.ft-eq-bar:nth-child(2) { animation-duration: 07s; animation-delay: -03s; background-color: color-mix(in srgb, var(--color-accent) 80%, cyan 20%); } +.ft-eq-bar:nth-child(3) { animation-duration: 13s; animation-delay: -06s; background-color: color-mix(in srgb, var(--color-accent) 80%, deepskyblue 20%); } +.ft-eq-bar:nth-child(4) { animation-duration: 08s; animation-delay: -01s; background-color: color-mix(in srgb, var(--color-accent) 80%, lime 20%); } +.ft-eq-bar:nth-child(5) { animation-duration: 10s; animation-delay: -04.5s; background-color: color-mix(in srgb, var(--color-accent) 80%, orange 20%); } +.ft-eq-bar:nth-child(6) { animation-duration: 06s; animation-delay: -02s; background-color: color-mix(in srgb, var(--color-accent) 80%, yellow 20%); } +.ft-eq-bar:nth-child(7) { animation-duration: 12s; animation-delay: -05.5s; background-color: color-mix(in srgb, var(--color-accent) 80%, magenta 20%); } +.ft-eq-bar:nth-child(8) { animation-duration: 07.5s; animation-delay: -03.5s; background-color: color-mix(in srgb, var(--color-accent) 80%, deeppink 20%); } +.ft-eq-bar:nth-child(9) { animation-duration: 10.5s; animation-delay: -01.5s; background-color: color-mix(in srgb, var(--color-accent) 80%, violet 20%); } +.ft-eq-bar:nth-child(10) { animation-duration: 08.5s; animation-delay: -05s; background-color: color-mix(in srgb, var(--color-accent) 80%, indigo 20%); } +.ft-eq-bar:nth-child(11) { animation-duration: 11.5s; animation-delay: -02.5s; background-color: color-mix(in srgb, var(--color-accent) 80%, blue 20%); } +.ft-eq-bar:nth-child(12) { animation-duration: 06.5s; animation-delay: -04s; background-color: color-mix(in srgb, var(--color-accent) 80%, navy 20%); } + #scScreen, #playerArea { position: absolute; @@ -1366,7 +1521,11 @@ html .ui-button.ui-state-disabled:active { #mainqueue { padding: var(--pad1) 0.75rem; - padding-right: 0; +} +@media only screen and (hover: hover) { + #mainqueue { + padding-right: 0; + } } #mainqueue.emptyList:before, #mainqueue.loading:before, @@ -1392,14 +1551,30 @@ html .ui-button.ui-state-disabled:active { font-size: 1.2rem; } +#mainqueue .previewicon { + position: absolute; + z-index: 1; + left: 0.2rem; +} + #queuelist .pvbar { margin: var(--pad1) 0; - padding: var(--pad2); + padding-right: var(--pad2); background-color: var(--color-bg-t1); border-top: 1px solid var(--color-bg-t2); border-bottom: 1px solid var(--color-bg); border-radius: var(--radius-md); cursor: grab; + overflow: hidden; +} + +#queuelist .q-art { + flex-shrink: 0; + width: 2.25rem; + height: 2.25rem; + background-size: cover; + background-position: center; + background-color: var(--color-bg-t2); } #queuelist .pvbarWrap { @@ -1416,7 +1591,10 @@ html .ui-button.ui-state-disabled:active { #queuelist .listwords { flex: 1; - margin-left: var(--pad2); + margin-left: var(--pad3); + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; } #listpickerWrap { @@ -1425,7 +1603,6 @@ html .ui-button.ui-state-disabled:active { #listpicker { width: 100%; - padding-left: var(--pad2); } #qControlButtons { @@ -1456,6 +1633,7 @@ html .ui-button.ui-state-disabled:active { #qsearch { margin: var(--pad2); + margin-bottom: 0; } #queuelist { @@ -1551,7 +1729,7 @@ a.importLinkCheck { } .tagPromptBox { - padding: var(--pad3) 0 var(--pad1) var(--pad2); + padding: 0 var(--pad3) var(--pad3) var(--pad3); font-size: 0.875rem; } @@ -1703,12 +1881,8 @@ a.importLinkCheck { position: relative; z-index: 2; width: 100%; - padding: var(--pad1); color: var(--color-text-muted); font-size: 0.75rem; - text-align: center; - background-color: var(--color-bg-t1); - border-radius: var(--pad1); } .npmsg { @@ -1757,7 +1931,6 @@ a.importLinkCheck { margin-right: var(--pad1); font-size: 0.75rem; font-weight: 500; - letter-spacing: 0.05em; color: rgba(255, 255, 255, 0.4); cursor: pointer; } @@ -1782,7 +1955,7 @@ a.importLinkCheck { .chatText { position: relative; - font-size: 0.875rem; + font-size: 0.75rem; grid-column: 1 / -1; } @@ -2078,19 +2251,24 @@ img.emoji, box-sizing: border-box; } -#histFilter:focus { +#histFilter:focus-visible { border-color: var(--color-accent); } #thehistory { + flex: 1; display: flex; flex-direction: column; - flex: 1; + gap: var(--pad2); overflow-y: auto; - padding-top: 0; + margin-left: var(--pad3); + padding-top: var(--pad2); .pvbarWrap { - padding: var(--pad2) var(--pad3); + margin-right: var(--pad1); + padding: var(--pad2) var(--pad2) var(--pad2) var(--pad3); + background-color: var(--color-bg-s1); + border-radius: var(--radius-md); } } @@ -2126,14 +2304,25 @@ img.emoji, Discover ============================================ */ -#mainGrid.login #discover { - grid-area: login; - padding: var(--pad4); +#discover { + grid-area: content; + display: none; + flex-direction: column; overflow: auto; + width: 100%; height: 100%; } -#mainGrid.mmqueue #discover { +#mainGrid.view-discover #discover { + display: flex; +} + +#mainGrid.login.view-discover #discover { + grid-area: login; + display: flex; +} + +#mainGrid.login.view-discover #login { display: none; } @@ -2150,23 +2339,40 @@ img.emoji, cursor: pointer; } +#thediscovers { + display: flex; + flex-wrap: wrap; + gap: var(--pad2); + padding: var(--pad3); + width: 100%; + box-sizing: border-box; +} + #thediscovers .pvbar { - display: inline-block; - width: 300px; - height: 400px; - padding: 20px; - margin-top: 50px; + display: flex; + flex-direction: column; + flex: 1 1 160px; + min-width: 160px; + max-width: 240px; + padding: var(--pad2); + background-color: var(--color-bg-t1); + border-radius: var(--radius-md); } .discart { + width: 100%; + aspect-ratio: 1; + background-size: cover; + background-position: center; + border-radius: var(--radius-sm); + margin-bottom: var(--pad2); display: flex; align-items: center; justify-content: center; - margin-bottom: var(--pad2); - width: 300px; - height: 300px; - background-size: cover; - background-position: center; +} + +#thediscovers .pvbarWrap { + display: contents; } #thediscovers .qtxt { @@ -2174,9 +2380,20 @@ img.emoji, flex: 1; } -#thediscovers .pvbarWrap { - display: flex; - flex-wrap: wrap; +#thediscovers .listwords { + font-size: 0.8rem; + font-weight: 500; + line-height: 1.3; + overflow: hidden; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; +} + +#thediscovers .histmoreinfo { + font-size: 0.7rem; + color: var(--color-text-dim); + margin-top: var(--pad1); } /* ============================================ @@ -2504,6 +2721,31 @@ body.blog { background-color: var(--color-bg-t2); } +/* ============================================ + Floating UI Tooltip + ============================================ */ +#ft-tooltip { + position: fixed; + top: 0; + left: 0; + z-index: 9999; + background-color: var(--color-bg-s2); + color: var(--color-text-light); + padding: 0.2rem 0.5rem; + border-radius: var(--radius-sm); + font-size: 0.8rem; + pointer-events: none; + white-space: nowrap; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5); + visibility: hidden; + opacity: 0; + transition: opacity 120ms ease; +} + +#ft-tooltip.is-visible { + opacity: 1; +} + /* ============================================ Initially Hidden Elements ============================================ */ @@ -2527,17 +2769,20 @@ body.blog { #actualChat { grid-area: chat; } #queuebox, #thehistoryWrap, - #cardsWrap { grid-area: view; } + #cardsWrap, + #discover { grid-area: view; } /* Header view buttons are now visible */ #playlists, #history, - #cardcase { display: block; } + #cardcase, + #discover-nav { display: block; } /* Mini-nav view tabs are redundant at this size */ #mm-playlists, #mm-history, - #mm-cards { display: none; } + #mm-cards, + #mm-discover { display: none; } /* Grid templates */ #mainGrid, @@ -2571,6 +2816,7 @@ body.blog { #mainGrid.view-playlists #queuebox { display: flex; } #mainGrid.view-history #thehistoryWrap { display: flex; } #mainGrid.view-cards #cardsWrap { display: block; } + #mainGrid.view-discover #discover { display: flex; } /* Re-show secondary panels suppressed by mobile rules */ #mainGrid.mmqueue #actualChat, diff --git a/index.html b/index.html index 534cd84..b01e422 100644 --- a/index.html +++ b/index.html @@ -9,6 +9,7 @@ + @@ -24,44 +25,20 @@ - - + - - - - -
    +
    @@ -71,6 +48,20 @@
    +
    @@ -147,7 +138,7 @@ link -
    @@ -172,7 +163,8 @@
    - + + @@ -261,7 +253,7 @@

    People

    @@ -282,11 +274,11 @@

    People

    arrow_right_alt
    @@ -309,15 +301,14 @@

    People

    -
    - +
    vertical_align_top vertical_align_bottom - edit + close playlist_add delete @@ -353,7 +344,7 @@

    People

    - +
    YoutubeSoundcloud @@ -372,11 +363,11 @@

    People

    -
    +
    - +
    -
    +
    @@ -402,7 +393,7 @@

    People

    -
    +
    @@ -418,7 +409,7 @@

    People

    -
    +

    Welcome To Firetable!

    @@ -652,20 +643,45 @@

    Playlist Import Machine

    + +
    -
    +
    + + + + diff --git a/js/init.js b/js/init.js index 964e899..b792438 100644 --- a/js/init.js +++ b/js/init.js @@ -49,13 +49,25 @@ firetable.init = function () { { cls: "soundcloud", url: ftconfigs.soundcloudURL } ]; socialLinks.forEach(function (link) { - if (link.url) { - $(".sociallogo." + link.cls) - .attr("href", link.url) - .css("display", "inline-block"); - } + if (link.url) $(".sociallogo." + link.cls).attr("href", link.url); }); + // Social popover: position anchored to trigger, swap icon on toggle + var socialPopoverEl = document.getElementById('socialPopover'); + if (socialPopoverEl) { + socialPopoverEl.addEventListener('toggle', function (e) { + var btn = document.getElementById('socialTrigger'); + var icon = btn && btn.querySelector('.material-icons'); + if (e.newState === 'open') { + if (icon) icon.textContent = 'close'; + socialPopoverEl.style.visibility = 'hidden'; + firetable.ui.positionPopover(btn, socialPopoverEl, document.getElementById('socialArrow')); + } else { + if (icon) icon.textContent = 'share'; + } + }); + } + if (ftconfigs.logoImage) { $("#roomlogo").css("background-image", "url(" + ftconfigs.logoImage + ")"); } @@ -75,10 +87,6 @@ firetable.init = function () { $('#playerArea, #scScreen') .width($('#djStage').outerWidth()) .height($('#djStage').outerHeight()); - $("#stealContain").css({ - 'top': $('#grab').offset().top + $('#grab').height(), - 'left': $('#grab').offset().left - 16 - }); setup(); // Re-create the p5.js canvas at the new size }, 500)); diff --git a/js/playlist.js b/js/playlist.js index dccc375..426a6e0 100644 --- a/js/playlist.js +++ b/js/playlist.js @@ -417,6 +417,12 @@ firetable.ui.setupPlaylistEvents = function () { .attr("data-type", thisone.type) .attr("data-cid", thisone.cid); + // Album art thumbnail + var artUrl = thisone.type === MEDIA_YOUTUBE + ? 'https://i.ytimg.com/vi/' + thisone.cid + '/mqdefault.jpg' + : ''; + if (artUrl) $newli.find('.q-art').css('background-image', 'url(' + artUrl + ')'); + // Preview button $newli.find('.previewicon').attr('id', "pv" + key).on('click', function () { firetable.actions.pview( @@ -474,6 +480,27 @@ firetable.ui.setupPlaylistEvents = function () { firetable.actions.deleteSong($(this).closest('.pvbar').attr('data-key')); }); + // Edit tags button + $newli.find('.edittags').on('click', function () { + if ($(this).hasClass("editing")) { + $(this).removeClass("editing"); + $(this).closest('.pvbar').find('.tagPromptBox').remove(); + } else { + $(this).addClass("editing"); + firetable.actions.editTagsPrompt( + $(this).closest('.pvbar').attr('data-key'), + $(this).closest('.pvbar').find('.listwords').text() + ); + } + }); + + // Close editor button + $newli.find('.closeeditor').on('click', function () { + $(this).closest('.pvbar').removeClass('editing').find('.tagPromptBox').remove(); + }); + + if (!ftapi.isMod) $newli.find('.edittags, .closeeditor').hide(); + // Add-to-playlist button $newli.find('.histeal').on('click', function () { var $btn = $(this); @@ -507,10 +534,10 @@ firetable.ui.setupPlaylistEvents = function () { firetable.stealSourceBtn = $btn; firetable.stealTarget = { cid: btnCid, type: btnType, title: btnTitle }; $btn.addClass('on'); - $("#stealContain").css({ - top: $btn.offset().top + $btn.outerHeight(), - left: $btn.offset().left - 16 - }).show(); + var stealContainEl = document.getElementById('stealContain'); + stealContainEl.style.visibility = 'hidden'; + $("#stealContain").show(); + firetable.ui.positionPopover($btn[0], stealContainEl, document.getElementById('stealArrow'), 'left'); }); }); @@ -653,7 +680,7 @@ firetable.ui.setupPlaylistEvents = function () { $(this).closest('.pvbar').attr('data-type'), songCid, val, histID ); - $(this).closest('.editing').removeClass('editing').next('.tagPromptBox').remove(); + $(this).closest('.pvbar').removeClass('editing').find('.tagPromptBox').remove(); } }); }; diff --git a/js/popover.js b/js/popover.js new file mode 100644 index 0000000..b5c9204 --- /dev/null +++ b/js/popover.js @@ -0,0 +1,35 @@ +// ─── Floating UI Popover Positioning ──────────────────────────────────────── +// Shared utility: positions a floating element anchored to a reference element. +// arrowEl is optional (pass null for no arrow). + +firetable.ui.positionPopover = function (anchorEl, floatingEl, arrowEl) { + var middleware = [ + FloatingUIDOM.offset(8), + FloatingUIDOM.flip(), + FloatingUIDOM.shift({ padding: 8 }) + ]; + if (arrowEl) { + middleware.push(FloatingUIDOM.arrow({ element: arrowEl })); + } + FloatingUIDOM.computePosition(anchorEl, floatingEl, { + placement: 'bottom-start', + strategy: 'fixed', + middleware: middleware + }).then(function (pos) { + floatingEl.style.left = pos.x + 'px'; + floatingEl.style.top = pos.y + 'px'; + + if (arrowEl && pos.middlewareData.arrow) { + var ax = pos.middlewareData.arrow.x; + var ay = pos.middlewareData.arrow.y; + var staticSide = { top: 'bottom', bottom: 'top', left: 'right', right: 'left' }[pos.placement.split('-')[0]]; + Object.assign(arrowEl.style, { + left: ax != null ? ax + 'px' : '', + top: ay != null ? ay + 'px' : '', + right: '', + bottom: '', + [staticSide]: '-4px' + }); + } + }); +}; diff --git a/js/room.js b/js/room.js index e069095..ece1a99 100644 --- a/js/room.js +++ b/js/room.js @@ -156,10 +156,10 @@ function renderHistoryItem(data, $template, containerSel, artClass) { firetable.stealTarget = { cid: btnCid, type: btnType, title: btnTitle }; $btn.addClass('on'); - $("#stealContain").css({ - top: $btn.offset().top + $btn.outerHeight(), - left: $btn.offset().left - 16 - }).show(); + var stealContainEl = document.getElementById('stealContain'); + stealContainEl.style.visibility = 'hidden'; + $("#stealContain").show(); + firetable.ui.positionPopover($btn[0], stealContainEl, document.getElementById('stealArrow'), 'left'); }); }); @@ -516,14 +516,14 @@ firetable.ui.setupRoomEvents = function () { } // Fill empty spots if (countr < 4) { - html += '
    '; + html += '
    '; countr++; for (var i = countr; i < 4; i++) { html += '
     
    '; } } } else { - html += '
    '; + html += '
    '; for (var i = 0; i < 3; i++) { html += '
     
    '; } @@ -614,7 +614,7 @@ firetable.ui.setupRoomEvents = function () { $('.customColorStyles').remove(); $("head").append( "