From d4cb2b3a80ac2aa9fa83ce872d978bc4977c6409 Mon Sep 17 00:00:00 2001 From: rafapaezbas Date: Mon, 26 Feb 2024 14:57:24 +0100 Subject: [PATCH 1/3] implemented update button --- lib/system-status.js | 24 ++++++++++++++++++++++-- 1 file changed, 22 insertions(+), 2 deletions(-) diff --git a/lib/system-status.js b/lib/system-status.js index 6497771..489ef96 100644 --- a/lib/system-status.js +++ b/lib/system-status.js @@ -73,6 +73,8 @@ customElements.define('system-status', class extends HTMLElement { this.shellProfiles = null this.root = this.attachShadow({ mode: 'open' }) this.#render() + this.updateButton = this.shadowRoot.querySelector('#update-button') + this.update = null } #render () { @@ -98,6 +100,12 @@ customElements.define('system-status', class extends HTMLElement { #tip { margin-top: 3rem; } + #update-button { + position: fixed; + left: 975px; + top: 170px; + display: none; + } h1 { padding: 0.5rem; display: inline-block; @@ -110,6 +118,7 @@ customElements.define('system-status', class extends HTMLElement { }

System Status

+ ${ this.#installed() ? '' @@ -120,14 +129,21 @@ customElements.define('system-status', class extends HTMLElement {

To finish installing Pear Runtime set your system path to

${BIN}

${!isWin? ' or click the button.' : ''}

- ${!isWin ? '

' : ''} + ${!isWin ? '

' : ''} ` } ` - this.shadowRoot.querySelector('button')?.addEventListener('click', () => { + this.shadowRoot.querySelector('#setup-button')?.addEventListener('click', () => { this.#install().then(() => this.#render()).catch((err) => this.#error(err)) }) + + Pear.updates((update) => { + this.update = update + this.updateButton.style.display = '' + this.updateButton.removeEventListener('click', this.#updateButtonListener) + this.updateButton.addEventListener('click', this.#updateButtonListener) + }) } #error (err) { @@ -200,4 +216,8 @@ customElements.define('system-status', class extends HTMLElement { process.env.PATH = `${BIN}:${process.env.PATH}` return Promise.resolve() } + + #updateButtonListener () { + Pear.restart({ platform: this.update.app === false }).catch(console.error) + } }) From cda87f7124bd8d4ee9d95b28bbf17530fae951a5 Mon Sep 17 00:00:00 2001 From: rafapaezbas Date: Mon, 26 Feb 2024 17:40:12 +0100 Subject: [PATCH 2/3] update button changes text on hover --- lib/system-status.js | 18 ++++++++++++++---- 1 file changed, 14 insertions(+), 4 deletions(-) diff --git a/lib/system-status.js b/lib/system-status.js index 489ef96..b0c1dff 100644 --- a/lib/system-status.js +++ b/lib/system-status.js @@ -72,9 +72,8 @@ customElements.define('system-status', class extends HTMLElement { this.stmtrx = new RegExp(`^export PATH="${BIN}":\\$PATH$`, 'm') this.shellProfiles = null this.root = this.attachShadow({ mode: 'open' }) - this.#render() - this.updateButton = this.shadowRoot.querySelector('#update-button') this.update = null + this.#render() } #render () { @@ -102,8 +101,9 @@ customElements.define('system-status', class extends HTMLElement { } #update-button { position: fixed; - left: 975px; + left: 893px; top: 170px; + width: 171px; display: none; } h1 { @@ -118,7 +118,7 @@ customElements.define('system-status', class extends HTMLElement { }

System Status

- + ${ this.#installed() ? '' @@ -134,6 +134,16 @@ customElements.define('system-status', class extends HTMLElement { } ` + + this.updateButton = this.shadowRoot.querySelector('#update-button') + + this.updateButton.addEventListener('mouseenter', (e) => { + e.target.innerText = 'Click to Restart' + }) + this.updateButton.addEventListener('mouseout', (e) => { + e.target.innerText = 'Update Available' + }) + this.shadowRoot.querySelector('#setup-button')?.addEventListener('click', () => { this.#install().then(() => this.#render()).catch((err) => this.#error(err)) }) From 29fee92e7ebaafeaa8032da9bb261a04a69a6133 Mon Sep 17 00:00:00 2001 From: rafapaezbas Date: Mon, 26 Feb 2024 18:37:18 +0100 Subject: [PATCH 3/3] fixed update button functionality --- lib/system-status.js | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/lib/system-status.js b/lib/system-status.js index b0c1dff..c7147a0 100644 --- a/lib/system-status.js +++ b/lib/system-status.js @@ -104,7 +104,6 @@ customElements.define('system-status', class extends HTMLElement { left: 893px; top: 170px; width: 171px; - display: none; } h1 { padding: 0.5rem; @@ -136,6 +135,7 @@ customElements.define('system-status', class extends HTMLElement { ` this.updateButton = this.shadowRoot.querySelector('#update-button') + this.updateButton.style.display = 'none' this.updateButton.addEventListener('mouseenter', (e) => { e.target.innerText = 'Click to Restart' @@ -151,8 +151,13 @@ customElements.define('system-status', class extends HTMLElement { Pear.updates((update) => { this.update = update this.updateButton.style.display = '' - this.updateButton.removeEventListener('click', this.#updateButtonListener) - this.updateButton.addEventListener('click', this.#updateButtonListener) + + if (this.updateButtonListener) { + this.updateButton.removeEventListener('click', this.updateButtonListener) + } + + this.updateButtonListener = () => Pear.restart({ platform: this.update.app === false }).catch(console.error) + this.updateButton.addEventListener('click', this.updateButtonListener) }) } @@ -226,8 +231,4 @@ customElements.define('system-status', class extends HTMLElement { process.env.PATH = `${BIN}:${process.env.PATH}` return Promise.resolve() } - - #updateButtonListener () { - Pear.restart({ platform: this.update.app === false }).catch(console.error) - } })