| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316 |
- From fc3d6b0bf16133a67c2824cba1a38ffb77531040 Mon Sep 17 00:00:00 2001
- From: DHMike57 <14224881+DHMike57@users.noreply.github.com>
- Date: Thu, 26 Aug 2021 12:31:53 +0100
- Subject: [PATCH] fix for linux web interface
- ---
- Cargo.toml | 4 +-
- build.rs | 12 ++-
- web/index-linux.html | 55 +++++++++++++
- web/script-linux.js | 179 +++++++++++++++++++++++++++++++++++++++++++
- 4 files changed, 247 insertions(+), 3 deletions(-)
- create mode 100644 web/index-linux.html
- create mode 100644 web/script-linux.js
- diff --git a/Cargo.toml b/Cargo.toml
- index 1074e6d..c14b218 100644
- --- a/Cargo.toml
- +++ b/Cargo.toml
- @@ -19,7 +19,7 @@ quick-xml = "0.17"
- rand = "0.7"
- lazy_static = "1.4"
- crossbeam = "0.7.3"
- -web-view = "0.6"
- +web-view = "0.7"
- tinyfiledialogs = "3.3.9"
- getopts = "0.2"
- webbrowser = "0.5.2"
- @@ -45,4 +45,4 @@ panic = "abort"
- opt-level = 0
-
- [package.metadata.winres]
- -LegalCopyright = "© 2019-2020 prixt"
- \ No newline at end of file
- +LegalCopyright = "© 2019-2020 prixt"
- diff --git a/build.rs b/build.rs
- index 3a77902..7cf57b3 100644
- --- a/build.rs
- +++ b/build.rs
- @@ -15,12 +15,22 @@ fn main() -> Result<(), Box<dyn Error>> {
- #[cfg(all(target_os="windows", feature = "edge"))]
- let range_css = include_str!("web/range-windows-edge.css");
-
- + #[cfg(target_os="linux")]
- + let index_html = include_str!("web/index-linux.html")
- + .replace("{comment_start}" , "<!--")
- + .replace("{comment_end}" , "-->")
- + .replace("{range}" , range_css)
- + .replace("{w3}" , include_str!("web/w3.css"))
- + .replace("{js}" , include_str!("web/script-linux.js"));
- +
- + #[cfg(not(target_os="linux"))]
- let index_html = include_str!("web/index.html")
- .replace("{comment_start}" , "<!--")
- .replace("{comment_end}" , "-->")
- .replace("{range}" , range_css)
- .replace("{w3}" , include_str!("web/w3.css"))
- .replace("{js}" , include_str!("web/script.js"));
- +
- let index_html = html_minifier::minify(index_html)?;
-
- File::create(dest_dir)?
- @@ -32,4 +42,4 @@ fn main() -> Result<(), Box<dyn Error>> {
- .compile()?;
-
- Ok(())
- -}
- \ No newline at end of file
- +}
- diff --git a/web/index-linux.html b/web/index-linux.html
- new file mode 100644
- index 0000000..a219257
- --- /dev/null
- +++ b/web/index-linux.html
- @@ -0,0 +1,55 @@
- +<!doctype html>
- +<html>
- +<head>
- +<!--{comment_end}
- + <style type="text/css">{w3}</style>
- + <style type="text/css">{range}</style>
- + <script type="text/javascript">{js}</script>
- +{comment_start}-->
- +</head>
- +<body onload="main()">
- +<header class='w3-bar w3-light-grey w3-small'>
- + <div class='w3-dropdown-hover'>
- + <button class='w3-button'>Load</button>
- + <div class='w3-dropdown-content w3-bar-block w3-border'>
- + <button class='w3-bar-item w3-button'
- + onclick="window.webkit.messageHandlers.external.postMessage('load_gamelog')">Load gamelog.txt</button>
- + <button class='w3-bar-item w3-button'
- + onclick="window.webkit.messageHandlers.external.postMessage('load_soundpack')">Load soundpack</button>
- + <button class='w3-bar-item w3-button'
- + onclick="window.webkit.messageHandlers.external.postMessage('load_ignore_list')">Load ignore.txt</button>
- + </div>
- + </div>
- + <div class='w3-dropdown-hover'>
- + <button class='w3-button'>Settings</button>
- + <div class='w3-dropdown-content w3-bar-block w3-border'>
- + <button class='w3-bar-item w3-button'
- + onclick="window.webkit.messageHandlers.external.postMessage('set_default_paths')">Set current paths as default</button>
- + <button class='w3-bar-item w3-button'
- + onclick="window.webkit.messageHandlers.external.postMessage('remove_default_paths')">Delete default paths setting</button>
- + <button class='w3-bar-item w3-button'
- + onclick="window.webkit.messageHandlers.external.postMessage('set_default_volumes')">Set current volumes as default</button>
- + <button class='w3-bar-item w3-button'
- + onclick="window.webkit.messageHandlers.external.postMessage('remove_default_volumes')">Delete default volumes setting</button>
- + </div>
- + </div>
- + <div class='w3-dropdown-hover w3-right'>
- + <button class='w3-button'>Options</button>
- + <div class='w3-dropdown-content w3-bar-block w3-border' style='right:0'>
- + <button class='w3-bar-item w3-button'
- + onclick="window.webkit.messageHandlers.external.postMessage('link_original')">🔗 - zwei's original SoundSense & soundpack</button>
- + <button class='w3-bar-item w3-button'
- + onclick="window.webkit.messageHandlers.external.postMessage('link_fork')">🔗 - jecowa's soundpack fork</button>
- + <button class='w3-bar-item w3-button'
- + onclick="window.webkit.messageHandlers.external.postMessage('link_source')">🔗 - SoundSense-RS Github repository</button>
- + <button class='w3-bar-item w3-button'
- + onclick="window.webkit.messageHandlers.external.postMessage('show_about')">ℹ - About</button>
- + </div>
- + </div>
- +</header>
- +<div class="w3-block" id="channels"></div>
- +<div class="w3-block" id="settings" style="display:none"></div>
- +<footer class='w3-bottom' id='alerts'></footer>
- +<footer class="w3-bottom" id='errors'></footer>
- +</body>
- +</html>
- diff --git a/web/script-linux.js b/web/script-linux.js
- new file mode 100644
- index 0000000..a60cc1c
- --- /dev/null
- +++ b/web/script-linux.js
- @@ -0,0 +1,179 @@
- +"use strict";
- +
- +let is_windows = null;
- +let channels = null;
- +
- +function addSlider(channel_name) {
- + channels.insertAdjacentElement(
- + 'beforeend',
- + createSlider(channel_name)
- + );
- + document.getElementById(channel_name+"_slider")
- + .addEventListener(is_windows?'change':'input',function(){
- + window.webkit.messageHandlers.external.postMessage("change_volume:"+channel_name+":"+this.value);
- + },
- + false
- + );
- + document.getElementById(channel_name+"_skip_button")
- + .addEventListener('click',function(){
- + window.webkit.messageHandlers.external.postMessage("skip_current_sound:"+channel_name);
- + },
- + false
- + );
- + document.getElementById(channel_name+"_play_pause_button")
- + .addEventListener('click',function(){
- + window.webkit.messageHandlers.external.postMessage("play_pause:"+channel_name);
- + },
- + false
- + );
- +}
- +function createSlider(channel_name) {
- + let slider = document.createElement("div");
- + slider.className="w3-cell-row w3-border-bottom";
- + slider.insertAdjacentHTML(
- + 'afterbegin',
- + "<div class='w3-cell w3-cell-middle w3-center w3-padding-small overlay-container' style='width:10%;min-width:90px'"+
- + "id='"+channel_name+"_head'>"+
- + "<div class='overlay-content w3-container w3-padding-small w3-animate-opacity w3-grey w3-center'>"+
- + "<span>Threshold</span><br>"+
- + "<select id='"+channel_name+"_selector' onchange='thresholdSelect(\""+channel_name+"\",this.value)'>"+
- + "<option value='4'>Everything</option>"+
- + "<option value='3'>Fluff</option>"+
- + "<option value='2'>Important</option>"+
- + "<option value='1'>Critical</option>"+
- + "<option value='0'>Nothing</option>"+
- + "</select>"+
- + "</div>"+
- + "<h4>"+channel_name+"</h4>"+
- + "</div>"+
- + "<div class='w3-cell w3-cell-middle w3-rest w3-container w3-padding-small'>"+
- + "<input type='range' id='"+channel_name+"_slider'"+
- + "min='0' max='100' value='100'>"+
- + "</div>"+
- + "<div class='w3-cell w3-cell-middle w3-center w3-small w3-padding-small' style='width:2%;min-width:10px;'>"+
- + "<div class='w3-button w3-block w3-round w3-small w3-padding-small'"+
- + "title='Skip "+channel_name+"'"+
- + "id='"+channel_name+"_skip_button'>"+
- + "⏭"+
- + "</div>"+
- + "<div class='w3-button w3-block w3-round w3-small w3-padding-small'"+
- + "title='Play/Pause "+channel_name+"'"+
- + "id='"+channel_name+"_play_pause_button'>"+
- + "⏯"+
- + "</div>"+
- + "</div>"
- + );
- + return slider;
- +}
- +function setSliderValue(channel_name, value) {
- + let slider = document.getElementById(channel_name+"_slider");
- + if (slider != null) slider.value = value;
- +}
- +function clearSliders() {
- + while (channels.firstChild)
- + channels.removeChild(channels.firstChild);
- +}
- +function setSliderHead(channel_name, is_paused) {
- + let slider_head = document.getElementById(channel_name+"_head");
- + let slider = document.getElementById(channel_name+"_slider");
- + if (is_paused) {
- + slider_head.classList.add("w3-opacity-max");
- + slider.classList.add("w3-opacity-max");
- + }
- + else {
- + slider_head.classList.remove("w3-opacity-max");
- + slider.classList.remove("w3-opacity-max");
- + }
- +}
- +
- +let alerts_footer = null;
- +let alerts = null;
- +function addAlert(name, color, text) {
- + removeAlert(name);
- + let new_alert = createAlert(name, color, text);
- + alerts[name] = new_alert;
- + alerts_footer.insertAdjacentElement('beforeend', new_alert);
- + if (alerts_footer.childElementCount > 10)
- + removeAlert(alerts_footer.firstChild.name);
- +}
- +function removeAlert(name) {
- + let alert = document.getElementById("alert_"+name);
- + if (alert != null) {
- + alerts_footer.removeChild(alert);
- + alerts.delete(name);
- + }
- +}
- +function createAlert(name, color, text) {
- + let alert=document.createElement("div");
- + alert.name = name;
- + alert.id="alert_"+name;
- + alert.className="w3-bar w3-animate-bottom w3-"+color;
- + alert.style.cssText="padding: 2px 15px 2px 15px;";
- + alert.innerHTML=text;
- + alert.timer = 4.0;
- +
- + let cross = document.createElement("span");
- + cross.className="w3-closebtn";
- + cross.setAttribute("onclick", "removeAlert('"+name+"')");
- + cross.innerHTML="×";
- +
- + alert.insertAdjacentElement('afterbegin',cross);
- +
- + return alert;
- +}
- +
- +let error_footer = null;
- +function addError(name, text) {
- + let new_error = createError(name, text);
- + error_footer.insertAdjacentElement('afterbegin', new_error);
- +}
- +function removeError(id) {
- + let error = document.getElementById(id);
- + if (error != null) {
- + error_footer.removeChild(error);
- + }
- +}
- +function createError(name, text) {
- + let error=document.createElement("div");
- + error.name=name;
- + error.id="error_"+name+toString(Math.floor(Math.random()*100000));
- + error.className="w3-bar w3-animate-bottom w3-red";
- + error.style.cssText="padding: 10px 15px 10px 15px;";
- + error.innerHTML="<h3>"+name+"</h3><p>"+text+"</p>";
- +
- + let cross = document.createElement("span");
- + cross.className="w3-closebtn";
- + cross.setAttribute("onclick", "removeError('"+error.id+"')");
- + cross.innerHTML="×";
- +
- + error.insertAdjacentElement('afterbegin',cross);
- +
- + return error;
- +}
- +
- +function thresholdSelect(channel_name, value) {
- + window.webkit.messageHandlers.external.postMessage("change_threshold:"+channel_name+":"+value);
- +
- +}
- +
- +function main() {
- + channels = document.getElementById('channels');
- + is_windows = /MSIE|Trident|Edge/.test(window.navigator.userAgent);
- + alerts_footer = document.getElementById('alerts');
- + error_footer = document.getElementById('errors');
- + alerts = new Map();
- +
- + let prev = null;
- + function step(now) {
- + let dt = (prev!=null) ? (now-prev)*0.001 : 0.0;
- + prev = now;
- + for (let key in alerts) {
- + let alert = alerts[key];
- + alert.timer -= dt;
- + if (alert.timer <= 1.0) alert.style.opacity = alert.timer;
- + if (alert.timer <= 0.0) removeAlert(alert.name);
- + }
- + window.requestAnimationFrame(step);
- + }
- + window.requestAnimationFrame(step);
- +}
|
