Tsumanu/oswilno
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

better display

Browse Source
This commit is contained in:
Adrian Woźniak 2023-10-12 16:25:26 +02:00
parent bd61bee720
commit de03009257
15 changed files with 232 additions and 186 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
assets/build.js
View File

@ -1,43 +1,7 @@
(()=>{var h=Object.create;var l=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var u=Object.getPrototypeOf,w=Object.prototype.hasOwnProperty;var f=(e=>typeof require<"u"?require:typeof Proxy<"u"?new Proxy(e,{get:(t,s)=>(typeof require<"u"?require:t)[s]}):e)(function(e){if(typeof require<"u")return require.apply(this,arguments);throw Error('Dynamic require of "'+e+'" is not supported')});var y=(e,t,s,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of m(t))!w.call(e,r)&&r!==s&&l(e,r,{get:()=>t[r],enumerable:!(o=p(t,r))||o.enumerable});return e};var g=(e,t,s)=>(s=e!=null?h(u(e)):{},y(t||!e||!e.__esModule?l(s,"default",{value:e,enumerable:!0}):s,e));customElements.define("oswilno-price",class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){let e=this.shadowRoot,t=parseInt(this.getAttribute("price"));isNaN(t)&&(t=0);let s=parseInt(this.getAttribute("multiplier")),o=t,r=0;isNaN(s)||(o=Math.floor(t/s),r=t%s);let n=this.getAttribute("currency")||"PLN";e.innerHTML=`<style>:host{display:block;}</style><div>${o}.${r>=10?r:r+"0"} ${n}</div>`}});var i=e=>{let t="";for(let o=0;o<document.styleSheets.length;o++){let r=document.styleSheets[o];for(let n=0;n<r.rules.length;n++)t+=r.rules[n].cssText}let s=new CSSStyleSheet;s.replaceSync(t),e.adoptedStyleSheets=[s]};customElements.define("oswilno-error",class extends HTMLElement{constructor(){super();let e=this.attachShadow({mode:"open"});e.innerHTML=`
(()=>{var m=Object.create;var l=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var h=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var E=(e=>typeof require<"u"?require:typeof Proxy<"u"?new Proxy(e,{get:(t,s)=>(typeof require<"u"?require:t)[s]}):e)(function(e){if(typeof require<"u")return require.apply(this,arguments);throw Error('Dynamic require of "'+e+'" is not supported')});var g=(e,t,s,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of f(t))!u.call(e,n)&&n!==s&&l(e,n,{get:()=>t[n],enumerable:!(o=p(t,n))||o.enumerable});return e};var S=(e,t,s)=>(s=e!=null?m(h(e)):{},g(t||!e||!e.__esModule?l(s,"default",{value:e,enumerable:!0}):s,e));customElements.define("oswilno-price",class extends HTMLElement{});var a=e=>{let t="";for(let o=0;o<document.styleSheets.length;o++){let n=document.styleSheets[o];for(let r=0;r<n.rules.length;r++)t+=n.rules[r].cssText}let s=new CSSStyleSheet;s.replaceSync(t),e.adoptedStyleSheets=[s]};customElements.define("oswilno-error",class extends HTMLElement{constructor(){super();let e=this.attachShadow({mode:"open"});e.innerHTML=`
<style>:host{display:block;}</style>
<div class="flex bg-red-100 rounded-lg p-4 mb-4 text-sm text-red-700">
<slot></slot>
<div>
`,i(e)}});customElements.define("oswilno-parking-space-rents",class extends HTMLElement{constructor(){super();let e=this.attachShadow({mode:"open"});e.innerHTML=`
<style>
:host {
display: block;
width: 100%;
}
#container {
display: flex;
justify-content: space-between;
width: 100%;
}
</style>
<div id="container">
<slot></slot>
</div>
`}});customElements.define("oswilno-parking-space-rent",class extends HTMLElement{constructor(){super();let e=this.attachShadow({mode:"open"});e.innerHTML=`
<style>
:host { display: block; width: 100%; }
</style>
<div class="w-[48%] p-4 bg-white border border-white-200 rounded-lg shadow sm:p-8 dark:bg-white-800 dark:border-white-700 mt-6">
<slot></slot>
</div>
`}});customElements.define("oswilno-parking-space",class extends HTMLElement{constructor(){super();let e=this.attachShadow({mode:"open"});e.innerHTML=`
<style>
:host { display: block; width: 100%; }
</style>
<div>
<slot></slot>
</div>
`}});customElements.define("oswilno-parking-space-location",class extends HTMLElement{constructor(){super();let e=this.attachShadow({mode:"open"});e.innerHTML=`
<style>
:host { display: block; width: 100%; }
</style>
<div>
<slot></slot>
</div>
`}});import("https://unpkg.com/htmx.org@1.9.4/dist/htmx.min.js");var a="Authorization",S="ACX-Authorization",c="ACX-Refresh",d=document.body;d.addEventListener("htmx:beforeOnLoad",function(e){let t=e.detail,s=t.xhr,o=s.status,r=t.successful;if(o===200){let n=s.getResponseHeader(a);n&&(console.log(s),localStorage.setItem("jwt",n.replace(/^Bearer /i,""))),s.getResponseHeader(c)&&localStorage.setItem("refresh",n.replace(/^Bearer /i,""))}else o===401&&localStorage.removeItem("jwt");(o===422||o===400)&&(t.shouldSwap=!0,t.isError=!1)});d.addEventListener("htmx:configRequest",function(e){localStorage.getItem("jwt")&&(e.detail.headers[S]="Bearer "+(localStorage.getItem("jwt")||""),e.detail.headers[a]="Bearer "+(localStorage.getItem("jwt")||""),e.detail.headers[c]=localStorage.getItem("refresh")||"")});})();
`,a(e)}});customElements.define("oswilno-parking-space-rents",class extends HTMLElement{});customElements.define("oswilno-parking-space-rent",class extends HTMLElement{});customElements.define("oswilno-parking-space",class extends HTMLElement{});customElements.define("oswilno-parking-space-location",class extends HTMLElement{});import("https://unpkg.com/htmx.org@1.9.4/dist/htmx.min.js");var c="Authorization",w="ACX-Authorization",i="ACX-Refresh",d=document.body;d.addEventListener("htmx:beforeOnLoad",function(e){let t=e.detail,s=t.xhr,o=s.status,n=t.successful;if(o===200){let r=s.getResponseHeader(c);r&&(console.log(s),localStorage.setItem("jwt",r.replace(/^Bearer /i,""))),s.getResponseHeader(i)&&localStorage.setItem("refresh",r.replace(/^Bearer /i,""))}else o===401&&localStorage.removeItem("jwt");(o===422||o===400)&&(t.shouldSwap=!0,t.isError=!1)});d.addEventListener("htmx:configRequest",function(e){localStorage.getItem("jwt")&&(e.detail.headers[w]="Bearer "+(localStorage.getItem("jwt")||""),e.detail.headers[c]="Bearer "+(localStorage.getItem("jwt")||""),e.detail.headers[i]=localStorage.getItem("refresh")||"")});})();
//# sourceMappingURL=build.js.map

6
assets/build.js.map
View File

File diff suppressed because one or more lines are too long

93
assets/style.css
View File

@ -750,6 +750,10 @@ select {
pointer-events: none;
}
.static {
position: static;
}
.absolute {
position: absolute;
}
@ -905,6 +909,10 @@ select {
width: 2rem;
}
.w-\[30\%\] {
width: 30%;
}
.w-\[48\%\] {
width: 48%;
}
@ -1153,15 +1161,33 @@ select {
padding-top: 4rem;
}
.text-left {
text-align: left;
}
.text-center {
text-align: center;
}
.text-right {
text-align: right;
}
.text-2xl {
font-size: 1.5rem;
line-height: 2rem;
}
.text-3xl {
font-size: 1.875rem;
line-height: 2.25rem;
}
.text-4xl {
font-size: 2.25rem;
line-height: 2.5rem;
}
.text-5xl {
font-size: 3rem;
line-height: 1;
@ -1237,9 +1263,9 @@ select {
color: rgb(115 115 115 / var(--tw-text-opacity));
}
.text-red-400 {
.text-red-600 {
--tw-text-opacity: 1;
color: rgb(248 113 113 / var(--tw-text-opacity));
color: rgb(220 38 38 / var(--tw-text-opacity));
}
.text-red-700 {
@ -1247,14 +1273,19 @@ select {
color: rgb(185 28 28 / var(--tw-text-opacity));
}
.text-red-800 {
--tw-text-opacity: 1;
color: rgb(153 27 27 / var(--tw-text-opacity));
}
.text-white {
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}
.text-yellow-400 {
.text-yellow-600 {
--tw-text-opacity: 1;
color: rgb(250 204 21 / var(--tw-text-opacity));
color: rgb(202 138 4 / var(--tw-text-opacity));
}
.opacity-75 {
@ -1309,31 +1340,11 @@ select {
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
}
.hover\:bg-red-200:hover {
--tw-bg-opacity: 1;
background-color: rgb(254 202 202 / var(--tw-bg-opacity));
}
.hover\:bg-yellow-200:hover {
--tw-bg-opacity: 1;
background-color: rgb(254 240 138 / var(--tw-bg-opacity));
}
.hover\:text-neutral-700:hover {
--tw-text-opacity: 1;
color: rgb(64 64 64 / var(--tw-text-opacity));
}
.hover\:text-red-900:hover {
--tw-text-opacity: 1;
color: rgb(127 29 29 / var(--tw-text-opacity));
}
.hover\:text-yellow-900:hover {
--tw-text-opacity: 1;
color: rgb(113 63 18 / var(--tw-text-opacity));
}
.hover\:ease-in-out:hover {
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
@ -1440,6 +1451,16 @@ select {
color: rgb(229 229 229 / var(--tw-text-opacity));
}
.dark\:text-neutral-300 {
--tw-text-opacity: 1;
color: rgb(212 212 212 / var(--tw-text-opacity));
}
.dark\:text-red-400 {
--tw-text-opacity: 1;
color: rgb(248 113 113 / var(--tw-text-opacity));
}
.dark\:text-white {
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
@ -1465,36 +1486,16 @@ select {
background-color: rgb(55 65 81 / var(--tw-bg-opacity));
}
.dark\:hover\:bg-red-800:hover {
--tw-bg-opacity: 1;
background-color: rgb(153 27 27 / var(--tw-bg-opacity));
}
.dark\:hover\:bg-yellow-800:hover {
--tw-bg-opacity: 1;
background-color: rgb(133 77 14 / var(--tw-bg-opacity));
}
.dark\:hover\:text-neutral-400:hover {
--tw-text-opacity: 1;
color: rgb(163 163 163 / var(--tw-text-opacity));
}
.dark\:hover\:text-red-300:hover {
--tw-text-opacity: 1;
color: rgb(252 165 165 / var(--tw-text-opacity));
}
.dark\:hover\:text-white:hover {
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}
.dark\:hover\:text-yellow-300:hover {
--tw-text-opacity: 1;
color: rgb(253 224 71 / var(--tw-text-opacity));
}
.dark\:focus\:border-blue-500:focus {
--tw-border-opacity: 1;
border-color: rgb(59 130 246 / var(--tw-border-opacity));
@ -1627,6 +1628,10 @@ select {
.xl\:min-h-ffhl {
min-height: calc(100vh - 80px - 192px);
}
.xl\:w-\[48\%\] {
width: 48%;
}
}
.\[\&\.active\]\:text-black\/90.active {

3
crates/oswilno-parking-space/src/lib.rs
View File

@ -55,6 +55,9 @@ pub fn translations(l10n: &mut oswilno_view::TranslationStorage) {
.add("Pending", "Oczekuje na akceptację")
.add("Approved", "Zaakceptowane")
.add("Rejected", "Odrzucone")
.add("stage", "etap")
.add("Price:", "Cena:")
.add("Price", "Cena")
.done();
}

6
crates/oswilno-parking-space/templates/parking-space-rents/form.html
View File

@ -3,7 +3,7 @@
<div class="max-w-md w-full p-6 bg-white text-lg">
{% include "../parking-spaces/rent_space_info.html" %}
</div>
<div class="max-w-md w-full p-6 bg-white rounded-lg shadow-lg">
<div class="max-w-md w-full p-6 bg-white shadow-lg">
<form
{% if let Some(id) = form.id %}
hx-put='/parking-spaces/{{parking_space.id}}/parking-space-rents/update/{{id}}'
@ -29,7 +29,7 @@
<input
id="price"
name="price_f"
class="px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-cyan-500"
class="px-4 py-2 border focus:outline-none focus:ring-2 focus:ring-cyan-500"
type="number"
step="0.01"
min="0.00"
@ -48,7 +48,7 @@
{% else %}
value="{{"Register parking space rent"|t(hcx)}}"
{% endif %}
class="w-64 bg-cyan-600 text-white py-2 rounded-lg mx-auto block focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-cyan-500 mb-2"
class="w-64 bg-cyan-600 text-white py-2 mx-auto block focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-cyan-500 mb-2"
/>
</div>
</form>

37
crates/oswilno-parking-space/templates/parking-spaces/all-partial.html
View File

@ -62,7 +62,7 @@
</section>
{% endif %}
<oswilno-parking-space-rents>
<oswilno-parking-space-rents class="xl:flex justify-between">
{% for parking_space_rent in parking_space_rents -%}
{% if let Some(parking_space) = parking_space_by_id.get(parking_space_rent.parking_space_id) %}
{% if parking_space.state == ParkingSpaceState::Verified || Some(parking_space.account_id.clone()) == account_id %}
@ -70,31 +70,60 @@
{% if let Some(location_id) = parking_space.location_id -%}
{% if let Some(location) = location_by_id.get(location_id) -%}
<oswilno-parking-space-rent id="parking-space-rent-{{ parking_space_rent.id }}">
<oswilno-parking-space-rent
id="parking-space-rent-{{ parking_space_rent.id }}"
class="xl:w-[48%] p-4 bg-white border border-white-200 rounded-lg shadow sm:p-8 dark:bg-white-800 dark:border-white-700 mt-6"
>
<oswilno-parking-space
id="parking-space-{{ parking_space.id }}"
{% if let Some(spot) = parking_space.spot %} spot="{{ spot }}" {% endif %}
class="flex justify-between"
>
<span class='spot text-4xl font-bold w-[30%] text-left'>
{% if let Some(spot) = parking_space.spot %}
{{ spot }}
{% else %}
&nbsp;
{% endif %}
</span>
<oswilno-parking-space-location
id="parking-space-location-{{ location.id }}"
name="{{ location.name }}"
stage="{{ location.stage }}"
number="{{ location.number }}"
class="w-[30%] text-3xl"
>
<span class="name">{{ location.name }}</span>
<span class="number">{{ location.number }}</span>
<span class="stage-label text-sm mr-1 ml-1">
&nbsp;{{"stage"|t(hcx)}}&nbsp;
</span>
<span class="stage">
{{ location.stage }}
</span>
</oswilno-parking-space-location>
<oswilno-account id="account-{{ account.id }}">
<oswilno-account
id="account-{{ account.id }}"
class="w-[30%] text-right font-bold uppercase text-red-800 dark:text-red-400"
>
<div>{{ account.login }}</div>
</oswilno-account>
</oswilno-parking-space>
<div class="xl:flex justify-between mt-6">
<span>{{"Price:"|t(hcx)}}</span>
<oswilno-price
id="parking-space-rent-{{ parking_space_rent.id }}-price"
multiplier="100"
currency="PLN"
price="{{ parking_space_rent.price }}"
>
{{ parking_space_rent.price }}
<span class="price text-3xl">{{ parking_space_rent.price|display_price }}</span>
<span class="currency text-base text-neutral-500 dark:text-neutral-300">PLN</span>
</oswilno-price>
</div>
</oswilno-parking-space-rent>
{% endif %}

4
crates/oswilno-parking-space/templates/parking-spaces/parking_space_state.html
View File

@ -1,13 +1,13 @@
{% match parking_space.state %}
{% when ParkingSpaceState::Pending %}
<div class="inline-flex items-center text-base text-center p-1 text-sm text-yellow-400 bg-transparent rounded-sm hover:bg-yellow-200 hover:text-yellow-900 dark:hover:bg-yellow-800 dark:hover:text-yellow-300">
<div class="inline-flex items-center text-base text-center p-1 text-sm text-yellow-600 bg-transparent rounded-sm">
{{"Pending"|t(hcx)}}
</div>
{% when ParkingSpaceState::Verified %}
<div>
</div>
{% when ParkingSpaceState::Banned %}
<div class="inline-flex items-center text-base text-center p-1 text-sm text-red-400 bg-transparent rounded-sm hover:bg-red-200 hover:text-red-900 dark:hover:bg-red-800 dark:hover:text-red-300">
<div class="inline-flex items-center text-base text-center p-1 text-sm text-red-600 bg-transparent rounded-sm">
{{"Rejected"|t(hcx)}}
</div>
{% endmatch %}

8
crates/oswilno-parking-space/templates/parking-spaces/rent_space_info.html
View File

@ -1,12 +1,12 @@
<div class="text-lg font-bold">
<span class="text-white-900 truncate dark:text-black">
<span class="text-white-900 truncate dark:text-black name">
{{location.name}}
</span>
<span class="text-white-900 truncate dark:text-black">
<span class="text-white-900 truncate dark:text-black number">
{{location.number}}
</span>
<span class="text-white-900 truncate dark:text-black">
Etap {{location.stage}}
<span class="text-white-900 truncate dark:text-black stage">
{{"stage"|t(hcx)}} {{location.stage}}
</span>
<span class="ml-1 mr-1">
-

8
crates/oswilno-parking-space/templates/parking-spaces/single_parking_space.html
View File

@ -1,12 +1,12 @@
<div>
<span class="text-sm font-medium text-white-900 truncate dark:text-black">
<span class="text-sm font-medium text-white-900 truncate dark:text-black name">
{{location.name}}
</span>
<span class="text-sm font-medium text-white-900 truncate dark:text-black">
<span class="text-sm font-medium text-white-900 truncate dark:text-black number">
{{location.number}}
</span>
<span class="text-sm font-medium text-white-900 truncate dark:text-black">
Etap {{location.stage}}
<span class="text-sm font-medium text-white-900 truncate dark:text-black stage">
{{"stage"|t(hcx)}} {{location.stage}}
</span>
</div>
<div class="inline-flex items-center text-base font-semibold text-gray-900 dark:text-black">

4
crates/oswilno-view/src/filters.rs
View File

@ -17,7 +17,7 @@ pub fn skip_if<T: std::fmt::Display + PartialEq + Copy>(n: &T, skip: T) -> Resul
}
#[tracing::instrument]
pub fn display_price(n: &&i32) -> Result<String> {
let n: i32 = **n;
pub fn display_price(n: &i32) -> Result<String> {
let n: i32 = *n;
Ok(format!("{}.{}", n / 100, n % 100))
}

57
crates/web-assets/assets/elements/oswilno-parking-space-location.js
View File

@ -1,14 +1,47 @@
customElements.define('oswilno-parking-space-location', class extends HTMLElement {
constructor() {
super();
const shadow = this.attachShadow({ mode: 'open' });
shadow.innerHTML = `
<style>
:host { display: block; width: 100%; }
</style>
<div>
<slot></slot>
</div>
`;
}
// static get observedAttributes() { return 'name stage number'.split(' '); }
// constructor() {
// super();
// const shadow = this.attachShadow({ mode: 'open' });
// shadow.innerHTML = `
// <style>
// :host { display: block; width: 100%; }
// #view {
// display: flex;
// }
// #view span {
// margin-right: 0.1rem;
// font-size: 0.875rem;
// line-height: 1.25rem;
// }
// </style>
// <div id="view">
// </div>
// <div id="container">
// <slot></slot>
// </div>
// `;
// }
// get name() { return this.getAttribute('name'); }
// set name(s) { this.setAttribute('name',s); }
// get stage() { return this.getAttribute('stage'); }
// set stage(s) { this.setAttribute('stage',s); }
// get number() { return this.getAttribute('number'); }
// set number(s) { this.setAttribute('number',s); }
// connectedCallback() { this.render(); }
// attributeChangedCallback(name, oV, nV) { console.log({name,oV,nV}); this.render(); }
// render() {
// const view = this.shadowRoot.querySelector('#view');
// const { name, stage, number } = this;
// view.innerHTML = `
// <span>${name}</span>
// <span>${number}</span>
// <span>${stage}</span>
// `;
// }
});

25
crates/web-assets/assets/elements/oswilno-parking-space-rent.js
View File

@ -1,14 +1,15 @@
customElements.define('oswilno-parking-space-rent', class extends HTMLElement {
constructor() {
super();
const shadow = this.attachShadow({ mode: 'open' });
shadow.innerHTML = `
<style>
:host { display: block; width: 100%; }
</style>
<div class="w-[48%] p-4 bg-white border border-white-200 rounded-lg shadow sm:p-8 dark:bg-white-800 dark:border-white-700 mt-6">
<slot></slot>
</div>
`;
}
// constructor() {
// super();
// const shadow = this.attachShadow({ mode: 'open' });
// shadow.innerHTML = `
// <style>
// :host { display: block; width: 100%; }
// </style>
// <div class="w-[48%] p-4 bg-white border border-white-200 rounded-lg shadow sm:p-8 dark:bg-white-800 dark:border-white-700 mt-6">
// <slot></slot>
// </div>
// `;
// this.classList = "w-[48%] p-4 bg-white border border-white-200 rounded-lg shadow sm:p-8 dark:bg-white-800 dark:border-white-700 mt-6";
// }
});

40
crates/web-assets/assets/elements/oswilno-parking-space-rents.js
View File

@ -1,23 +1,23 @@
customElements.define('oswilno-parking-space-rents', class extends HTMLElement {
constructor() {
super();
const shadow = this.attachShadow({ mode: 'open' });
shadow.innerHTML = `
<style>
:host {
display: block;
width: 100%;
}
#container {
display: flex;
justify-content: space-between;
width: 100%;
}
</style>
<div id="container">
<slot></slot>
</div>
`;
}
// constructor() {
// super();
// const shadow = this.attachShadow({ mode: 'open' });
// shadow.innerHTML = `
// <style>
// :host {
// display: block;
// width: 100%;
// }
// #container {
// display: flex;
// justify-content: space-between;
// width: 100%;
// }
// </style>
// <div id="container">
// <slot></slot>
// </div>
// `;
// }
});

35
crates/web-assets/assets/elements/oswilno-parking-space.js
View File

@ -1,14 +1,25 @@
customElements.define('oswilno-parking-space', class extends HTMLElement {
constructor() {
super();
const shadow = this.attachShadow({ mode: 'open' });
shadow.innerHTML = `
<style>
:host { display: block; width: 100%; }
</style>
<div>
<slot></slot>
</div>
`;
}
// static get observedAttibutes() { return 'spot'; }
// constructor() {
// super();
// const shadow = this.attachShadow({ mode: 'open' });
// shadow.innerHTML = `
// <style>
// :host { display: block; width: 100%; }
// #container {
// display: flex;
// justify-content: space-between;
// }
// </style>
// <div id="container">
// <div id="view"></div>
// <slot></slot>
// </div>
// `;
// this.render();
// }
// render() {
// const spot = this.getAttribute('spot');
// this.shadowRoot.textContent = `${spot}`;
// }
});

36
crates/web-assets/assets/elements/oswilno-price.js
View File

@ -1,20 +1,20 @@
customElements.define('oswilno-price', class extends HTMLElement {
constructor() {
super();
this.attachShadow({ mode: 'open' });
}
connectedCallback() {
let shadow = this.shadowRoot;
let price = parseInt(this.getAttribute('price'));
if (isNaN(price)) price = 0;
const multiplier = parseInt(this.getAttribute('multiplier'));
let major = price;
let minor = 0;
if (!isNaN(multiplier)) {
major = Math.floor(price / multiplier);
minor = price % multiplier;
}
const currency = this.getAttribute('currency') || 'PLN';
shadow.innerHTML = `<style>:host{display:block;}</style><div>${major}.${minor >= 10 ? minor : minor + '0'} ${ currency }</div>`;
}
//constructor() {
// super();
// this.attachShadow({ mode: 'open' });
//}
//connectedCallback() {
// let shadow = this.shadowRoot;
// let price = parseInt(this.getAttribute('price'));
// if (isNaN(price)) price = 0;
// const multiplier = parseInt(this.getAttribute('multiplier'));
// let major = price;
// let minor = 0;
// if (!isNaN(multiplier)) {
// major = Math.floor(price / multiplier);
// minor = price % multiplier;
// }
// const currency = this.getAttribute('currency') || 'PLN';
// shadow.innerHTML = `<style>:host{display:block;}</style><div>${major}.${minor >= 10 ? minor : minor + '0'} ${ currency }</div>`;
//}
});