Skip to content

Commit f047a1d

Browse files
ManeraKaiManeraKai
committed
Improved code
1 parent c6de68c commit f047a1d

File tree

3 files changed

+77
-78
lines changed

3 files changed

+77
-78
lines changed

‎src/pages/popup_src/Buttons.svelte

Lines changed: 19 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,9 @@
99
import SwitchInstanceIcon from "../icons/SwitchInstanceIcon.svelte"
1010
import SettingsIcon from "../icons/SettingsIcon.svelte"
1111
import { options, config } from "./stores"
12-
import ServiceIcon from "./components/ServiceIcon.svelte"
1312
import { onDestroy } from "svelte"
1413
import servicesHelper from "../../assets/javascripts/services"
15-
import Checkbox from "../components/Checkbox.svelte"
14+
import Switch from "./components/Switch.svelte"
1615
1716
let _options
1817
let _config
@@ -35,117 +34,70 @@
3534
servicesHelper.switchInstance(url).then(r => (switchInstance = r))
3635
servicesHelper.reverse(url).then(r => (redirectToOriginal = r))
3736
servicesHelper.redirectAsync(url, "main_frame", null, true).then(r => (redirect = r))
38-
currentService = await servicesHelper.computeService(url)
37+
servicesHelper.computeService(url).then(r => (currentService = r))
3938
}
4039
})
4140
</script>
4241

4342
{#if redirect}
44-
<Row class="row" on:click={() => browser.runtime.sendMessage("redirectTab")}>
43+
<Row class="interactive" on:click={() => browser.runtime.sendMessage("redirectTab")}>
4544
<Label>Redirect</Label>
4645
<RedirectIcon />
4746
</Row>
4847
{/if}
4948

5049
{#if switchInstance}
51-
<Row class="row" on:click={async () => browser.tabs.update({ url: await servicesHelper.switchInstance(url) })}>
50+
<Row
51+
class="interactive"
52+
on:click={async () => browser.tabs.update({ url: await servicesHelper.switchInstance(url) })}
53+
>
5254
<Label>Switch Instance</Label>
5355
<SwitchInstanceIcon />
5456
</Row>
5557
{/if}
5658

5759
{#if redirectToOriginal}
58-
<Row class="row" on:click={() => servicesHelper.copyRaw(url)}>
60+
<Row class="interactive" on:click={() => servicesHelper.copyRaw(url)}>
5961
<Label>Copy Original</Label>
6062
<CopyIcon />
6163
</Row>
62-
<Row class="row" on:click={() => browser.runtime.sendMessage("reverseTab")}>
64+
<Row class="interactive" on:click={() => browser.runtime.sendMessage("reverseTab")}>
6365
<Label>Redirect To Original</Label>
6466
<RedirectToOriginalIcon />
6567
</Row>
6668
{/if}
6769

68-
<hr />
70+
{#if redirect || switchInstance || redirectToOriginal}
71+
<hr />
72+
{/if}
6973

7074
{#if currentService}
71-
<Row>
72-
<div
73-
style="display: flex;justify-content: space-between;align-items: center;"
74-
class="row"
75-
on:keydown={null}
76-
on:click={() => window.open(browser.runtime.getURL(_config.services[currentService].url), "_blank")}
77-
>
78-
<ServiceIcon details={{ value: currentService, label: _config.services[currentService].name }} />
79-
<Label>{_config.services[currentService].name}</Label>
80-
</div>
81-
<div style="display: flex;align-items: center;">
82-
<Checkbox
83-
style="margin-right:5px"
84-
label="Enable"
85-
checked={_options[currentService].enabled}
86-
onChange={e => {
87-
_options[currentService].enabled = e.target.checked
88-
options.set(_options)
89-
}}
90-
/>
91-
<SwitchInstanceIcon
92-
class="row"
93-
on:click={async () => browser.tabs.update({ url: await servicesHelper.switchInstance(url, currentService) })}
94-
/>
95-
</div>
96-
</Row>
75+
<Switch serviceKey={currentService} {url} />
76+
<hr />
9777
{/if}
9878

99-
<hr />
100-
10179
{#each _options.popupServices as serviceKey}
10280
{#if currentService !== serviceKey}
103-
<Row>
104-
<div
105-
style="display: flex;align-items: center;"
106-
class="row"
107-
on:keydown={null}
108-
on:click={() => window.open(browser.runtime.getURL(_config.services[serviceKey].url), "_blank")}
109-
>
110-
<ServiceIcon details={{ value: serviceKey, label: _config.services[serviceKey].name }} />
111-
<Label>{_config.services[serviceKey].name}</Label>
112-
</div>
113-
<div style="display: flex;align-items: center;">
114-
<Checkbox
115-
style="margin-right:5px"
116-
label="Enable"
117-
checked={_options[serviceKey].enabled}
118-
onChange={e => {
119-
console.log(e.target.checked)
120-
_options[serviceKey].enabled = e.target.checked
121-
options.set(_options)
122-
}}
123-
/>
124-
<SwitchInstanceIcon
125-
class="row"
126-
on:click={async () => browser.tabs.update({ url: await servicesHelper.switchInstance(url, serviceKey) })}
127-
/>
128-
</div>
129-
</Row>
81+
<Switch {serviceKey} {url} />
13082
{/if}
13183
{/each}
13284

13385
<hr />
13486

135-
<Row class="row" on:click={() => window.open(browser.runtime.getURL("pages/options/index.html"), "_blank")}>
87+
<Row class="interactive" on:click={() => window.open(browser.runtime.getURL("pages/options/index.html"), "_blank")}>
13688
<Label>Settings</Label>
13789
<SettingsIcon />
13890
</Row>
13991

14092
<style>
141-
:global(.row) {
93+
:global(.interactive) {
14294
transition: 0.1s;
14395
}
144-
:global(.row:hover) {
96+
:global(.interactive:hover) {
14597
color: var(--active);
14698
cursor: pointer;
14799
}
148-
:global(.row:active) {
100+
:global(.interactive:active) {
149101
transform: translateY(1px);
150102
}
151103

‎src/pages/popup_src/components/PopupButton.svelte

Lines changed: 0 additions & 11 deletions
This file was deleted.

‎src/pages/popup_src/components/Switch.svelte

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
<script>
2+
let browser = window.browser || window.chrome
3+
4+
import Checkbox from "../../components/Checkbox.svelte"
5+
import Label from "../../components/Label.svelte"
6+
import SwitchInstanceIcon from "../../icons/SwitchInstanceIcon.svelte"
7+
import Row from "./Row.svelte"
8+
import ServiceIcon from "./ServiceIcon.svelte"
9+
import { onDestroy } from "svelte"
10+
import servicesHelper from "../../../assets/javascripts/services"
11+
import { options, config } from "../stores"
12+
13+
let _options
14+
let _config
15+
16+
const unsubscribeOptions = options.subscribe(val => (_options = val))
17+
const unsubscribeConfig = config.subscribe(val => (_config = val))
18+
onDestroy(() => {
19+
unsubscribeOptions()
20+
unsubscribeConfig()
21+
})
22+
23+
export let serviceKey
24+
export let url
25+
</script>
26+
27+
<Row>
28+
<div
29+
class="interactive"
30+
on:keydown={null}
31+
on:click={() => window.open(browser.runtime.getURL(_config.services[serviceKey].url), "_blank")}
32+
>
33+
<ServiceIcon details={{ value: serviceKey, label: _config.services[serviceKey].name }} />
34+
<Label>{_config.services[serviceKey].name}</Label>
35+
</div>
36+
<div>
37+
<Checkbox
38+
style="margin-right:5px"
39+
label="Enable"
40+
checked={_options[serviceKey].enabled}
41+
onChange={e => {
42+
_options[serviceKey].enabled = e.target.checked
43+
options.set(_options)
44+
}}
45+
/>
46+
<SwitchInstanceIcon
47+
class="interactive"
48+
on:click={async () => browser.tabs.update({ url: await servicesHelper.switchInstance(url, serviceKey) })}
49+
/>
50+
</div>
51+
</Row>
52+
53+
<style>
54+
div {
55+
display: flex;
56+
align-items: center;
57+
}
58+
</style>

0 commit comments

Comments
 (0)