diff --git a/src/viewer/scripts/discord.js b/src/viewer/scripts/discord.js index b80311d..7c065d9 100644 --- a/src/viewer/scripts/discord.js +++ b/src/viewer/scripts/discord.js @@ -57,7 +57,7 @@ var DISCORD = (function(){ templateMessage = new TEMPLATE([ "
", - "

{user.name}{timestamp}{edit}

", + "

{user.name}{timestamp}{edit}{jump}

", "
{contents}{embeds}{attachments}
", "
" ].join("")); @@ -172,6 +172,9 @@ var DISCORD = (function(){ else if (property === "edit"){ return value ? "Edited" + (value > 1 ? " " + getHumanReadableTime(value) : "") + "" : ""; } + else if (property === "jump"){ + return STATE.hasActiveFilter ? "Jump to message" : ""; + } }); } }; diff --git a/src/viewer/scripts/gui.js b/src/viewer/scripts/gui.js index d3942ad..93c1a50 100644 --- a/src/viewer/scripts/gui.js +++ b/src/viewer/scripts/gui.js @@ -70,7 +70,14 @@ var GUI = (function(){ var inputUploadedFile = DOM.id("uploaded-file"); var inputMessageFilter = DOM.id("opt-messages-filter"); var containerFilterList = DOM.id("opt-filter-list"); - + + var resetActiveFilter = function(){ + inputMessageFilter.value = ""; + inputMessageFilter.dispatchEvent(new Event("change")); + + DOM.id("opt-filter-contents").value = ""; + }; + DOM.id("btn-upload-file").addEventListener("click", () => { inputUploadedFile.click(); }); @@ -78,11 +85,7 @@ var GUI = (function(){ inputUploadedFile.addEventListener("change", () => { if (eventOnFileUploaded && eventOnFileUploaded(inputUploadedFile.files)){ inputUploadedFile.value = null; - - inputMessageFilter.value = ""; - inputMessageFilter.dispatchEvent(new Event("change")); - - DOM.id("opt-filter-contents").value = ""; + resetActiveFilter(); } }); @@ -122,6 +125,17 @@ var GUI = (function(){ showInfoModal(); }); + DOM.id("messages").addEventListener("click", e => { + var jump = e.target.getAttribute("data-jump"); + + if (jump){ + resetActiveFilter(); + + var index = STATE.navigateToMessage(jump); + DOM.id("messages").children[index].scrollIntoView(); + } + }); + DOM.id("overlay").addEventListener("click", () => { DOM.id("modal").classList.remove("visible"); DOM.id("dialog").innerHTML = ""; diff --git a/src/viewer/scripts/state.js b/src/viewer/scripts/state.js index 0011772..573d689 100644 --- a/src/viewer/scripts/state.js +++ b/src/viewer/scripts/state.js @@ -139,15 +139,34 @@ var STATE = (function(){ "contents": ("m" in message) ? message.m : null, "embeds": message.e, "attachments": message.a, - "edit": ("te" in message) ? message.te : (message.f & 1) === 1 + "edit": ("te" in message) ? message.te : (message.f & 1) === 1, + "jump": key }; }); }; + + ROOT.navigateToMessage = function(id){ + if (!MSGS){ + return 0; + } + + var index = MSGS.indexOf(id); + + if (index == -1){ + return 0; + } + + currentPage = Math.max(1, Math.min(ROOT.getPageCount(), 1 + Math.floor(index / messagesPerPage))); + triggerMessagesRefreshed(); + return index % messagesPerPage; + }; // ---------- // Filtering // ---------- + ROOT.hasActiveFilter = false; + ROOT.setActiveFilter = function(filter){ switch(filter ? filter.type : ""){ case "user": @@ -175,6 +194,8 @@ var STATE = (function(){ break; } + ROOT.hasActiveFilter = filterFunction != null; + triggerChannelsRefreshed(selectedChannel); if (selectedChannel){ diff --git a/src/viewer/styles/messages.css b/src/viewer/styles/messages.css index 0a72d29..16ffa9f 100644 --- a/src/viewer/styles/messages.css +++ b/src/viewer/styles/messages.css @@ -38,6 +38,12 @@ width: 14px; } +#messages .jump { + cursor: pointer; + text-decoration: underline; + text-underline-offset: 2px; +} + .message { margin-top: 6px; color: rgba(255, 255, 255, 0.7);