backups/Fantasy-Map-Generator
1
0
Fork 0
mirror of https://github.com/Azgaar/Fantasy-Map-Generator.git synced 2025-12-17 09:41:24 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: fill-box component

Browse source
This commit is contained in:
Azgaar 2022-07-09 00:06:14 +03:00
parent 0c6eadaed3
commit 80bf0ef688
2 changed files with 5 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

2
index.html
View file

@ -112,7 +112,7 @@
<script src="/libs/jquery-3.1.1.min.js"></script> <script src="/libs/jquery-3.1.1.min.js"></script>
<script defer src="/libs/jquery-ui.min.js"></script> <script defer src="/libs/jquery-ui.min.js"></script>
<script defer src="/libs/jquery.ui.touch-punch.min.js"></script> <script defer src="/libs/jquery.ui.touch-punch.min.js"></script>
<link href="/libs/jquery-ui.css" as="style" /> <link href="/libs/jquery-ui.css" rel="stylesheet" />
<script src="/libs/define-globals.js"></script> <script src="/libs/define-globals.js"></script>
<!-- styles --> <!-- styles -->

7
src/components/fill-box.ts
View file

@ -1,4 +1,4 @@
import {tip} from "../scripts/tooltips"; import {tip} from "scripts/tooltips";
const template = document.createElement("template"); const template = document.createElement("template");
template.innerHTML = /* html */ ` template.innerHTML = /* html */ `
@ -29,6 +29,9 @@ class FillBox extends HTMLElement {
super(); super();
this.tooltip = this.dataset.tip || "Fill style. Click to change"; this.tooltip = this.dataset.tip || "Fill style. Click to change";
// cannot use Shadow DOM here as need an access to svg hatches
this.appendChild(template.content.cloneNode(true));
} }
private showTip() { private showTip() {
@ -36,8 +39,6 @@ class FillBox extends HTMLElement {
} }
connectedCallback() { connectedCallback() {
// cannot use Shadow DOM here as need an access to svg hatches
this.appendChild(template.content.cloneNode(true));
this.querySelector("rect")?.setAttribute("fill", this.fill); this.querySelector("rect")?.setAttribute("fill", this.fill);
this.querySelector("svg")?.setAttribute("width", this.size); this.querySelector("svg")?.setAttribute("width", this.size);
this.querySelector("svg")?.setAttribute("height", this.size); this.querySelector("svg")?.setAttribute("height", this.size);