mirror of
https://github.com/anticensority/runet-censorship-bypass.git
synced 2025-10-02 18:06:47 +03:00
Implement html frontend on duplicated templates
This commit is contained in:
parent
06813f6c34
commit
60b89ec6bc
|
@ -183,23 +183,97 @@
|
|||
<nav>
|
||||
<form id="pacChooserForm">
|
||||
<menu id="radios">
|
||||
<template id="pacRecordTemplate">
|
||||
<div>
|
||||
<span id="attributes" hidden>
|
||||
<my-li>
|
||||
<template shadowrootmode="open">
|
||||
<slot name="pacRecords">PAC_RECORDS</slot>
|
||||
</template>
|
||||
<pac-record slot="pacRecords">
|
||||
<template shadowrootmode="open">
|
||||
<span class="template-inputs" hidden>
|
||||
<slot name="id">ID</slot>
|
||||
<slot name="value">VALUE</slot>
|
||||
<slot name="for">FOR</slot>
|
||||
</span>
|
||||
<slot name="input">INPUT</slot>
|
||||
<label data-attrs="for">
|
||||
<slot name="label">LABEL</slot>
|
||||
</label>
|
||||
<a href title="Обновить">[обновить]</a>
|
||||
<a href title="Приостановить">[⏸]</a>
|
||||
<a href title="Информация о PAC-скрипте" style="float: right">[ℹ]</a>
|
||||
<div class="template-body">
|
||||
<slot name="inputElement">INPUT_ELEMENT</slot>
|
||||
<label for="for">
|
||||
<slot name="label">LABEL</slot>
|
||||
</label>
|
||||
<a href title="Обновить">[обновить]</a>
|
||||
<a href title="Приостановить">[⏸]</a>
|
||||
<a href title="Информация о PAC-скрипте" style="float: right">[ℹ]</a>
|
||||
</div>
|
||||
</template>
|
||||
<my-input slot="inputElement">
|
||||
<template shadowrootmode="open">
|
||||
<span class="template-inputs" hidden>
|
||||
<slot name="id">ID</slot>
|
||||
<slot name="value">VALUE</slot>
|
||||
</span>
|
||||
<slot name="input"></slot>
|
||||
</template>
|
||||
<input slot="input" type="radio" name="pacScript" form="pacChooserForm" id="id1" value="value1" />
|
||||
<span slot="id">antizapret</span>
|
||||
<span slot="value">antizapret</span>
|
||||
</my-input>
|
||||
<span slot="label">Антизапрет</span>
|
||||
</pac-record>
|
||||
<pac-record slot="pacRecords">
|
||||
<template shadowrootmode="open">
|
||||
<span class="template-inputs" hidden>
|
||||
<slot name="id">ID</slot>
|
||||
<slot name="value">VALUE</slot>
|
||||
<slot name="for">FOR</slot>
|
||||
</span>
|
||||
<div class="template-body">
|
||||
<slot name="inputElement">INPUT_ELEMENT</slot>
|
||||
<label for="for">
|
||||
<slot name="label">LABEL</slot>
|
||||
</label>
|
||||
<a href title="Обновить">[обновить]</a>
|
||||
<a href title="Приостановить">[⏸]</a>
|
||||
<a href title="Информация о PAC-скрипте" style="float: right">[ℹ]</a>
|
||||
</div>
|
||||
</template>
|
||||
<my-input slot="inputElement">
|
||||
<template shadowrootmode="open">
|
||||
<span id="templateInputs" hidden>
|
||||
<slot name="id">ID</slot>
|
||||
<slot name="value">VALUE</slot>
|
||||
</span>
|
||||
<slot name="input"></slot>
|
||||
</template>
|
||||
<input slot="input" type="radio" name="pacScript" form="pacChooserForm" id="id2" value="value2" />
|
||||
<span slot="id">anticensority</span>
|
||||
<span slot="value">anticensority</span>
|
||||
</my-input>
|
||||
<span slot="label">Антицензорити</span>
|
||||
</pac-record>
|
||||
<!--script src="./repeat.mjs?times=2" type="module"></script-->
|
||||
<!--Light DOM>
|
||||
<div>
|
||||
<span slot="label">Антизапрет</span>
|
||||
<span slot="id">antizapret</span>
|
||||
<span slot="value">antizapret</span>
|
||||
<span slot="for">antizapret</span>
|
||||
<input slot="input" type="radio" name="pacScript" form="pacChooserForm" data-attrs="id value" />
|
||||
</div>
|
||||
<div>
|
||||
<span slot="label">Антицензорити</span>
|
||||
<span slot="id">anticensority</span>
|
||||
<span slot="value">anticensority</span>
|
||||
<span slot="for">anticensority</span>
|
||||
<input slot="input" type="radio" name="pacScript" form="pacChooserForm" data-attrs="id value" />
|
||||
</div>
|
||||
<!--
|
||||
<div>
|
||||
<my-input slot="input" name="first" />
|
||||
<my-input slot="input" name="second" />
|
||||
</div>
|
||||
<!--/Light DOM>
|
||||
</pac-record>
|
||||
</template>
|
||||
<li>
|
||||
<!--li>
|
||||
<pac-record>
|
||||
<span slot="label">Антизапрет</span>
|
||||
<span slot="id">antizapret</span>
|
||||
|
@ -215,7 +289,8 @@
|
|||
<span slot="value">anticensority</span>
|
||||
<span slot="for">anticensority</span>
|
||||
</pac-record>
|
||||
</li>
|
||||
</li-->
|
||||
</my-li>
|
||||
<li>
|
||||
<input type="radio" value="own" name="pacScript" id="ownRadio" disabled>
|
||||
<label for="ownRadio">Свой:</label>
|
||||
|
@ -252,9 +327,9 @@
|
|||
</form>
|
||||
</nav>
|
||||
<footer style="text-align: center">
|
||||
<a id="donate" target="_blank" data-localize="__MSG_Donate__"
|
||||
href="https://github.com/anticensority/runet-censorship-bypass/wiki/Поддержать"
|
||||
>Donate ❤</a>
|
||||
<a id="donate" target="_blank" data-localize="__MSG_Donate__"
|
||||
href="https://github.com/anticensority/runet-censorship-bypass/wiki/Поддержать"
|
||||
>Donate ❤</a>
|
||||
</footer>
|
||||
<script src="./index.mjs" type="module"></script>
|
||||
</body>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
console.log('Options page is opening...');
|
||||
|
||||
/*
|
||||
customElements.define('pac-record',
|
||||
class extends HTMLElement {
|
||||
static formAssociated = true;
|
||||
|
@ -18,10 +18,10 @@ customElements.define('pac-record',
|
|||
(da) => {
|
||||
da.dataset.attrs.split(' ').forEach(
|
||||
(attr) => {
|
||||
console.log(shadow.querySelector(`#attributes > slot[name=${attr}]`));
|
||||
console.log(shadow.querySelector(`#VARIABLES > slot[name=${attr}]`));
|
||||
da.setAttribute(
|
||||
attr,
|
||||
shadow.querySelector(`#attributes > slot[name=${attr}]`).assignedNodes()?.[0]?.textContent,
|
||||
shadow.querySelector(`#VARIABLES > slot[name=${attr}]`).assignedNodes()?.[0]?.textContent,
|
||||
);
|
||||
},
|
||||
);
|
||||
|
@ -57,13 +57,14 @@ customElements.define('pac-record',
|
|||
})
|
||||
});
|
||||
|
||||
/*
|
||||
/
|
||||
const input = fragment.querySelector('div > input');
|
||||
const label = fragment.querySelector('div > label');
|
||||
/*const node = pacRecordTemplate.content.cloneNode(true);
|
||||
const input = node.querySelector('div > input');
|
||||
const label = node.querySelector('div > label');
|
||||
input.id = input.value = label.htmlFor = this.dataset.id;*/
|
||||
input.id = input.value = label.htmlFor = this.dataset.id;
|
||||
/
|
||||
|
||||
}
|
||||
attributeChangedCallback(name, oldValue, newValue) {
|
||||
|
|
12
src/pages/options/repeat.mjs
Normal file
12
src/pages/options/repeat.mjs
Normal file
|
@ -0,0 +1,12 @@
|
|||
console.log('HELLO FROM REPEATER');
|
||||
console.log('IMPORT META URL:', import.meta.url);
|
||||
const times = new URL(import.meta.url).searchParams.get("times");
|
||||
console.log(`REPEAT ${times} TIMES`);
|
||||
const htmlFile = window.location.pathname;
|
||||
console.log('HTML FILE IS:', htmlFile);
|
||||
console.log('DOCUMENT', document);
|
||||
console.log('DOC CURRENT SCRIPT:', document.currentScript);
|
||||
console.log('DOC.SCRIPTS', document.scripts);
|
||||
const thisScript = document.scripts[0];
|
||||
const scriptHost = thisScript.parentElement;
|
||||
console.log('SCRIPT HOST', scriptHost);
|
Loading…
Reference in New Issue
Block a user