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> <style>:host{display:block;}</style>
<div class="flex bg-red-100 rounded-lg p-4 mb-4 text-sm text-red-700"> <div class="flex bg-red-100 rounded-lg p-4 mb-4 text-sm text-red-700">
<slot></slot> <slot></slot>
<div> <div>
`,i(e)}});customElements.define("oswilno-parking-space-rents",class extends HTMLElement{constructor(){super();let e=this.attachShadow({mode:"open"});e.innerHTML=` `,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")||"")});})();
<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")||"")});})();
//# sourceMappingURL=build.js.map //# 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; pointer-events: none;
} }
.static {
position: static;
}
.absolute { .absolute {
position: absolute; position: absolute;
} }
@ -905,6 +909,10 @@ select {
width: 2rem; width: 2rem;
} }
.w-\[30\%\] {
width: 30%;
}
.w-\[48\%\] { .w-\[48\%\] {
width: 48%; width: 48%;
} }
@ -1153,15 +1161,33 @@ select {
padding-top: 4rem; padding-top: 4rem;
} }
.text-left {
text-align: left;
}
.text-center { .text-center {
text-align: center; text-align: center;
} }
.text-right {
text-align: right;
}
.text-2xl { .text-2xl {
font-size: 1.5rem; font-size: 1.5rem;
line-height: 2rem; 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 { .text-5xl {
font-size: 3rem; font-size: 3rem;
line-height: 1; line-height: 1;
@ -1237,9 +1263,9 @@ select {
color: rgb(115 115 115 / var(--tw-text-opacity)); color: rgb(115 115 115 / var(--tw-text-opacity));
} }
.text-red-400 { .text-red-600 {
--tw-text-opacity: 1; --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 { .text-red-700 {
@ -1247,14 +1273,19 @@ select {
color: rgb(185 28 28 / var(--tw-text-opacity)); 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 { .text-white {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity)); color: rgb(255 255 255 / var(--tw-text-opacity));
} }
.text-yellow-400 { .text-yellow-600 {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(250 204 21 / var(--tw-text-opacity)); color: rgb(202 138 4 / var(--tw-text-opacity));
} }
.opacity-75 { .opacity-75 {
@ -1309,31 +1340,11 @@ select {
background-color: rgb(243 244 246 / var(--tw-bg-opacity)); 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 { .hover\:text-neutral-700:hover {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(64 64 64 / var(--tw-text-opacity)); 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 { .hover\:ease-in-out:hover {
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); 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)); 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 { .dark\:text-white {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity)); color: rgb(255 255 255 / var(--tw-text-opacity));
@ -1465,36 +1486,16 @@ select {
background-color: rgb(55 65 81 / var(--tw-bg-opacity)); 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 { .dark\:hover\:text-neutral-400:hover {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(163 163 163 / var(--tw-text-opacity)); 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 { .dark\:hover\:text-white:hover {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity)); 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 { .dark\:focus\:border-blue-500:focus {
--tw-border-opacity: 1; --tw-border-opacity: 1;
border-color: rgb(59 130 246 / var(--tw-border-opacity)); border-color: rgb(59 130 246 / var(--tw-border-opacity));
@ -1627,6 +1628,10 @@ select {
.xl\:min-h-ffhl { .xl\:min-h-ffhl {
min-height: calc(100vh - 80px - 192px); min-height: calc(100vh - 80px - 192px);
} }
.xl\:w-\[48\%\] {
width: 48%;
}
} }
.\[\&\.active\]\:text-black\/90.active { .\[\&\.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("Pending", "Oczekuje na akceptację")
.add("Approved", "Zaakceptowane") .add("Approved", "Zaakceptowane")
.add("Rejected", "Odrzucone") .add("Rejected", "Odrzucone")
.add("stage", "etap")
.add("Price:", "Cena:")
.add("Price", "Cena")
.done(); .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"> <div class="max-w-md w-full p-6 bg-white text-lg">
{% include "../parking-spaces/rent_space_info.html" %} {% include "../parking-spaces/rent_space_info.html" %}
</div> </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 <form
{% if let Some(id) = form.id %} {% if let Some(id) = form.id %}
hx-put='/parking-spaces/{{parking_space.id}}/parking-space-rents/update/{{id}}' hx-put='/parking-spaces/{{parking_space.id}}/parking-space-rents/update/{{id}}'
@ -29,7 +29,7 @@
<input <input
id="price" id="price"
name="price_f" 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" type="number"
step="0.01" step="0.01"
min="0.00" min="0.00"
@ -48,7 +48,7 @@
{% else %} {% else %}
value="{{"Register parking space rent"|t(hcx)}}" value="{{"Register parking space rent"|t(hcx)}}"
{% endif %} {% 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> </div>
</form> </form>

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

@ -62,7 +62,7 @@
</section> </section>
{% endif %} {% endif %}
<oswilno-parking-space-rents> <oswilno-parking-space-rents class="xl:flex justify-between">
{% for parking_space_rent in parking_space_rents -%} {% 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 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 %} {% if parking_space.state == ParkingSpaceState::Verified || Some(parking_space.account_id.clone()) == account_id %}
@ -70,32 +70,61 @@
{% if let Some(location_id) = parking_space.location_id -%} {% if let Some(location_id) = parking_space.location_id -%}
{% if let Some(location) = location_by_id.get(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 <oswilno-parking-space
id="parking-space-{{ parking_space.id }}" id="parking-space-{{ parking_space.id }}"
{% if let Some(spot) = parking_space.spot %} spot="{{ spot }}" {% endif %} {% 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 <oswilno-parking-space-location
id="parking-space-location-{{ location.id }}" id="parking-space-location-{{ location.id }}"
name="{{ location.name }}" name="{{ location.name }}"
stage="{{ location.stage }}" stage="{{ location.stage }}"
number="{{ location.number }}" 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-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> <div>{{ account.login }}</div>
</oswilno-account> </oswilno-account>
</oswilno-parking-space> </oswilno-parking-space>
<oswilno-price
id="parking-space-rent-{{ parking_space_rent.id }}-price" <div class="xl:flex justify-between mt-6">
multiplier="100" <span>{{"Price:"|t(hcx)}}</span>
currency="PLN" <oswilno-price
price="{{ parking_space_rent.price }}" id="parking-space-rent-{{ parking_space_rent.id }}-price"
> multiplier="100"
{{ parking_space_rent.price }} currency="PLN"
</oswilno-price> price="{{ parking_space_rent.price }}"
</oswilno-parking-space-rent> >
<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 %} {% endif %}
{% endif %} {% endif %}

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

@ -1,13 +1,13 @@
{% match parking_space.state %} {% match parking_space.state %}
{% when ParkingSpaceState::Pending %} {% 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)}} {{"Pending"|t(hcx)}}
</div> </div>
{% when ParkingSpaceState::Verified %} {% when ParkingSpaceState::Verified %}
<div> <div>
</div> </div>
{% when ParkingSpaceState::Banned %} {% 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)}} {{"Rejected"|t(hcx)}}
</div> </div>
{% endmatch %} {% 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"> <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}} {{location.name}}
</span> </span>
<span class="text-white-900 truncate dark:text-black"> <span class="text-white-900 truncate dark:text-black number">
{{location.number}} {{location.number}}
</span> </span>
<span class="text-white-900 truncate dark:text-black"> <span class="text-white-900 truncate dark:text-black stage">
Etap {{location.stage}} {{"stage"|t(hcx)}} {{location.stage}}
</span> </span>
<span class="ml-1 mr-1"> <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> <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}} {{location.name}}
</span> </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}} {{location.number}}
</span> </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 stage">
Etap {{location.stage}} {{"stage"|t(hcx)}} {{location.stage}}
</span> </span>
</div> </div>
<div class="inline-flex items-center text-base font-semibold text-gray-900 dark:text-black"> <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] #[tracing::instrument]
pub fn display_price(n: &&i32) -> Result<String> { pub fn display_price(n: &i32) -> Result<String> {
let n: i32 = **n; let n: i32 = *n;
Ok(format!("{}.{}", n / 100, n % 100)) 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 { customElements.define('oswilno-parking-space-location', class extends HTMLElement {
constructor() { // static get observedAttributes() { return 'name stage number'.split(' '); }
super();
const shadow = this.attachShadow({ mode: 'open' }); // constructor() {
shadow.innerHTML = ` // super();
<style> // const shadow = this.attachShadow({ mode: 'open' });
:host { display: block; width: 100%; } // shadow.innerHTML = `
</style> // <style>
<div> // :host { display: block; width: 100%; }
<slot></slot> // #view {
</div> // 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 { customElements.define('oswilno-parking-space-rent', class extends HTMLElement {
constructor() { // constructor() {
super(); // super();
const shadow = this.attachShadow({ mode: 'open' }); // const shadow = this.attachShadow({ mode: 'open' });
shadow.innerHTML = ` // shadow.innerHTML = `
<style> // <style>
:host { display: block; width: 100%; } // :host { display: block; width: 100%; }
</style> // </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"> // <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> // <slot></slot>
</div> // </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 { customElements.define('oswilno-parking-space-rents', class extends HTMLElement {
constructor() { // constructor() {
super(); // super();
const shadow = this.attachShadow({ mode: 'open' }); // const shadow = this.attachShadow({ mode: 'open' });
shadow.innerHTML = ` // shadow.innerHTML = `
<style> // <style>
:host { // :host {
display: block; // display: block;
width: 100%; // width: 100%;
} // }
#container { // #container {
display: flex; // display: flex;
justify-content: space-between; // justify-content: space-between;
width: 100%; // width: 100%;
} // }
</style> // </style>
<div id="container"> // <div id="container">
<slot></slot> // <slot></slot>
</div> // </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 { customElements.define('oswilno-parking-space', class extends HTMLElement {
constructor() { // static get observedAttibutes() { return 'spot'; }
super(); // constructor() {
const shadow = this.attachShadow({ mode: 'open' }); // super();
shadow.innerHTML = ` // const shadow = this.attachShadow({ mode: 'open' });
<style> // shadow.innerHTML = `
:host { display: block; width: 100%; } // <style>
</style> // :host { display: block; width: 100%; }
<div> // #container {
<slot></slot> // display: flex;
</div> // 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 { customElements.define('oswilno-price', class extends HTMLElement {
constructor() { //constructor() {
super(); // super();
this.attachShadow({ mode: 'open' }); // this.attachShadow({ mode: 'open' });
} //}
connectedCallback() { //connectedCallback() {
let shadow = this.shadowRoot; // let shadow = this.shadowRoot;
let price = parseInt(this.getAttribute('price')); // let price = parseInt(this.getAttribute('price'));
if (isNaN(price)) price = 0; // if (isNaN(price)) price = 0;
const multiplier = parseInt(this.getAttribute('multiplier')); // const multiplier = parseInt(this.getAttribute('multiplier'));
let major = price; // let major = price;
let minor = 0; // let minor = 0;
if (!isNaN(multiplier)) { // if (!isNaN(multiplier)) {
major = Math.floor(price / multiplier); // major = Math.floor(price / multiplier);
minor = price % multiplier; // minor = price % multiplier;
} // }
const currency = this.getAttribute('currency') || 'PLN'; // const currency = this.getAttribute('currency') || 'PLN';
shadow.innerHTML = `<style>:host{display:block;}</style><div>${major}.${minor >= 10 ? minor : minor + '0'} ${ currency }</div>`; // shadow.innerHTML = `<style>:host{display:block;}</style><div>${major}.${minor >= 10 ? minor : minor + '0'} ${ currency }</div>`;
} //}
}); });