From 1cc8b0576e5741d1308078838f039bf83c50c972 Mon Sep 17 00:00:00 2001 From: Dark Steveneq Date: Mon, 22 Sep 2025 02:54:26 +0200 Subject: [PATCH] ...Dlaczego? --- assets/css/baza.css | 2 +- assets/css/js-warunkowe.css | 141 ++++++++++++++++++++++++++++++++++++ assets/js/akordeon.js | 39 +++++----- assets/js/js-podstawy.js | 13 ---- assets/js/js-warunkowe.js | 25 +++++++ assets/js/js-wspolne.js | 69 ++++++++++++++++++ assets/js/nawigacja.js | 2 +- js-podstawy.html | 15 +--- js-warunkowe.html | 78 ++++++++++++++++++++ 9 files changed, 340 insertions(+), 44 deletions(-) create mode 100644 assets/css/js-warunkowe.css create mode 100644 assets/js/js-warunkowe.js create mode 100644 assets/js/js-wspolne.js create mode 100644 js-warunkowe.html diff --git a/assets/css/baza.css b/assets/css/baza.css index 26901aa..f90586a 100644 --- a/assets/css/baza.css +++ b/assets/css/baza.css @@ -45,7 +45,7 @@ body { user-select: none; } -h1, h2, h3, h4, h5, h6 { +h1, h2, h3, h4, h5, h6, p { margin: 0%; } diff --git a/assets/css/js-warunkowe.css b/assets/css/js-warunkowe.css new file mode 100644 index 0000000..0f0219c --- /dev/null +++ b/assets/css/js-warunkowe.css @@ -0,0 +1,141 @@ +#pornhub-nieaktywne { + display: none; +} + +#pornhub * { + color: #fff; + font-family: Arial,Helvetica,sans-serif; + font-size: 12px; + margin: 0; + padding: 0; +} + +#pornhub { + display: inline-block !important; + background: #000; + z-index: 1000002; + overflow: auto; + bottom: 0; + left: 0; + position: fixed; + right: 0; + top: 0; + text-align: center; + margin: 0; + padding: 0; +} + +#pornhub img { + color: #fff; + font-family: Arial,Helvetica,sans-serif; + font-size: 12px; + text-align: center; + margin: 0; + padding: 0; + width: 150px; +} + +#pornhub #pierwszy { + max-width: 750px; + display: inline-block; + padding: 4rem 2rem; + box-shadow: 0 0 40px 5px rgba(255,255,255,.15); + background-color: #000; + border: 1px solid #2e2e2e; + position: relative; + top: 100px; + text-align: center; + color: #fff; + font-family: Arial,Helvetica,sans-serif; + font-size: 12px; +} + +#pornhub #pierwszy div h3 { + font-size: 2.5rem; + margin: 1.5rem 0 1rem; + font-weight: 700; + color: #fff; + background-color: initial; + line-height: initial; + padding: 0; + text-transform: none; +} + +#pornhub #pierwszy div h4 { + font-size: 1.2rem; + margin: 1.5rem 0 1rem; + margin-top: 2.5rem; + margin-left: .25rem; + text-align: left; + font-weight: 700; + color: #fff; + background-color: initial; + line-height: initial; + padding: 0; + text-transform: none; +} + +#pornhub #pierwszy div p { + font-size: 1.25rem; + margin: 0; + color: #ccc; +} + + +#pornhub span { + background-color: rgb(0,0,0); + color: rgb(204,204,204); + font-family: Arial, Helvetica, sans-serif; + margin: 0; + padding: 0; + font-size: 1rem; +} + +#pornhub button { + appearance: none; + vertical-align: top; + text-decoration: none; + cursor: pointer; + position: relative; + outline: 0 none; + text-align: center; + margin: 0; + border-radius: 4px; + display: inline-block; + font-family: inherit; + background: #1f1f1f; + margin-top: 1rem; + font-size: 1.25rem; + width: 21rem; + max-width: 100%; + padding: 1rem; + font-weight: 700; + color: #fff; + border: 3px solid #ff9000; +} + +#pornhub input { + margin: 0; + border: 3px solid #ff9000; + height: .5rem; + background: #1f1f1f; +} + +#pornhub input::-webkit-slider-thumb { + -webkit-appearance: none; + appearance: none; + width: 1rem; + height: 1rem; + border-width: 0px; + border-radius: 100%; + cursor: pointer; + background-color: #ff9000; +} + +#pornhub input::-moz-range-thumb { + width: 1rem; + height: 1rem; + border-radius: 100%; + cursor: pointer; + background-color: #ff9000; +} \ No newline at end of file diff --git a/assets/js/akordeon.js b/assets/js/akordeon.js index 8e18d52..e4a1342 100644 --- a/assets/js/akordeon.js +++ b/assets/js/akordeon.js @@ -1,13 +1,17 @@ class Akordeon extends HTMLElement { constructor() { super(); + this._internals = this.attachInternals(); - this.otwarte = this.getAttribute("otwarte") == "true"; this.shadow = this.attachShadow({ mode: "open" }); - this.shadow.onslotchange = ev => { - console.log(ev); + + this.przycisk = document.createElement("button"); + this.przycisk.onclick = () => { + this.otwarte = !this.otwarte; }; + + this.contents = document.createElement("slot"); } get otwarte() { @@ -17,12 +21,19 @@ class Akordeon extends HTMLElement { set otwarte(flag) { if (flag) { this._internals.states.add("otwarte"); + this.przycisk.className = "otwarte"; + this.contents.className = "otwarte"; } else { this._internals.states.delete("otwarte"); + this.przycisk.className = ""; + this.contents.className = ""; } } connectedCallback() { + this.przycisk.innerText = this.getAttribute("title") ?? "Nowy akordeon"; + this.otwarte = this.getAttribute("otwarte") == "true"; + const styl = document.createElement("style"); styl.textContent = ` @import url('/assets/css/baza.css'); @@ -48,32 +59,24 @@ class Akordeon extends HTMLElement { text-align: left; } - ::part(button)(:state(otwarte)) { + button.otwarte { border-bottom-color: var(--colorSurface2); - scale: 1.005; + scale: 1.006; } slot { + display: none; + } + + slot.otwarte { display: inline; padding: .5rem; } `; this.shadow.appendChild(styl); - - const przycisk = document.createElement("button"); - przycisk.innerText = this.getAttribute("title") ?? "Nowy akordeon"; - przycisk.onclick = () => { - this.otwarte = !this.otwarte; - }; - this.shadow.appendChild(przycisk); - - this.contents = document.createElement("slot"); + this.shadow.appendChild(this.przycisk); this.shadow.appendChild(this.contents); } - - attributeChangedCallback(atrybut, poprzednio, obecnie) { - - } } customElements.define("akordeon-comp", Akordeon); \ No newline at end of file diff --git a/assets/js/js-podstawy.js b/assets/js/js-podstawy.js index 25fc80f..d615f13 100644 --- a/assets/js/js-podstawy.js +++ b/assets/js/js-podstawy.js @@ -80,8 +80,6 @@ const rozmiary = { }; document.addEventListener("DOMContentLoaded", () => { - zad1Zsumuj(); - zad3Inicjalizacja(); document.getElementById('zad4-tekst').style.fontSize = '30pt'; @@ -90,17 +88,6 @@ document.addEventListener("DOMContentLoaded", () => { document.getElementById('zad4-tekst').style.borderRadius = '1rem'; }); -function zad1Zsumuj() { - const elX = document.getElementById("zad1-x"); - const elY = document.getElementById("zad1-y"); - const elOut = document.getElementById("zad1-output"); - - const x = typeof elX.value == "string" ? Number(elX.value) : 0; - const y = typeof elY.value == "string" ? Number(elY.value) : 0; - - elOut.innerText = `${x} + ${y} = ${x + y}` -} - function zad2UstawImie() { const imie = prompt("Podaj imię"); const elOut = document.getElementById("zad2-output"); diff --git a/assets/js/js-warunkowe.js b/assets/js/js-warunkowe.js new file mode 100644 index 0000000..8f0dbac --- /dev/null +++ b/assets/js/js-warunkowe.js @@ -0,0 +1,25 @@ +document.addEventListener("DOMContentLoaded", () => { + zad4SprawdzParzystosc(); + zad7Przesun(); +}) + +function zad4SprawdzParzystosc() { + document.getElementById("zad4-wynik").innerText = document.getElementById("zad4-liczba").valueAsNumber % 2 == 1 ? "Nieparzysta" : "Parzysta"; +} + +function zad7Przesun() { + const wiek = Number(document.getElementById("zad7-slider").value); + document.getElementById("zad7-wiek").innerHTML = "Wiek: " + (wiek >= 18 ? "18+" : wiek); +} + +function zad7Koniec() { + const wiek = Number(document.getElementById("zad7-slider").value); + if (wiek > 18) { + alert("Jesteś dorosły, ile wspólnych lat masz już na karku?"); + } else if (wiek >= 11 && wiek < 17) { + alert("Jesteś nastolatkiem, dopiero zaczynasz czy już kolejny raz?"); + } else if (wiek < 11) { + alert("Jesteś dzieckiem! Akysz, nie niszcz sobie życia"); + } + document.getElementById('pornhub').id = 'pornhub-nieaktywne'; +} \ No newline at end of file diff --git a/assets/js/js-wspolne.js b/assets/js/js-wspolne.js new file mode 100644 index 0000000..4833d70 --- /dev/null +++ b/assets/js/js-wspolne.js @@ -0,0 +1,69 @@ +// Obliczanie +class Obliczanie extends HTMLElement { + elementy = {}; + dzialanie = ""; + constructor() { + super(); + this.shadow = this.attachShadow({ mode: "open" }); + } + + wylicz() { + let operacja = this.dzialanie; + for (const znak in this.elementy) + { + const element = this.shadow.getElementById(znak); + if (element == null) { + return; + } + operacja = operacja.replaceAll(znak, element == null ? "" : element.value); + } + try { + this.wynik.innerText = eval(operacja); + } catch { + this.wynik.innerText = "Nieprawidłowa operacja"; + } + } + + connectedCallback() { + const styl = document.createElement("style"); + styl.textContent = ` + @import url('/assets/css/baza.css'); + `; + + this.dzialanie = this.getAttribute("dzialanie") ?? ""; + if (this.dzialanie == "") { + this.shadow.innerHTML = "

Nieustawione działanie!

"; + return; + } + + let html = this.dzialanie; + const matche = this.dzialanie.match(/[a-z]/gi); + if (matche != null) { + matche.forEach(znak => { + if (!this.elementy[znak]) { + this.elementy[znak] = true; + const element = document.createElement("input"); + element.id = znak; + html = html.replaceAll(znak, element.outerHTML); + } + }) + } + + this.wynik = document.createElement("span"); + this.shadow.innerHTML = html + " = "; + this.shadow.appendChild(this.wynik); + this.shadow.appendChild(styl); + + for (const child of this.shadow.children) { + if (child.id != "") { + child.type = "number"; + child.oninput = () => { + this.wylicz(); + } + } + } + this.wylicz(); + } +}; + +customElements.define("obliczanie-comp", Obliczanie); \ No newline at end of file diff --git a/assets/js/nawigacja.js b/assets/js/nawigacja.js index 46580d5..bfe15e0 100644 --- a/assets/js/nawigacja.js +++ b/assets/js/nawigacja.js @@ -7,7 +7,7 @@ const linki = [ ], [ { nazwa: "JS. Podstawowe Zad.", link: "/js-podstawy.html" }, - { nazwa: "JS. Warunkowe Zad.", link: "/js-warunkowe.html" }, + { nazwa: "JS. Zad. Warunkowe", link: "/js-warunkowe.html" }, ] ]; diff --git a/js-podstawy.html b/js-podstawy.html index 9eee016..87188ef 100644 --- a/js-podstawy.html +++ b/js-podstawy.html @@ -9,6 +9,7 @@ + @@ -20,15 +21,7 @@

  • Sumowanie liczb

    - -
    - - -
    - -
    -
    - Wynik: 2 + 2 = 4 +

  • @@ -87,8 +80,8 @@

  • Akordeon

    - -

    After polling after pooling nightshaft

    + +

    Teraz będzie lepiej

    • diff --git a/js-warunkowe.html b/js-warunkowe.html new file mode 100644 index 0000000..d81de31 --- /dev/null +++ b/js-warunkowe.html @@ -0,0 +1,78 @@ + + + + + + JS Zad. Warunkowe - MaszToZadanieDomowe.com + + + + + + + + + + +
    +

    JavaScript Zadania Warunkowe

    +
    +
      +
    1. +

      Dzielenie liczb

      +
      + +
      2. +
      +
    2. +

      Sumowanie ułamków liczb

      +
      + +
      3. +
      +
    3. +

      Sumowanie, odejmowanie i dzielenie ze stałymi liczb

      +
      + +
      4. +
      +
    4. +

      Parzystość liczb

      +
      + + +
      +

      Parzysta

      +
      5. +
      +
    5. +

      Klasyfikacja wieku

      +
      + +
      6. +
      +
    +
    + + +
    +
    +
    + MaszToZadanieDomowe logo +

    To jest strona dla furasów

    +

    +

    + Ta strona zawiera treści nieodpowiednie dla normików, takie jak protogeny i liski. Wchodząc na tą strone, potwierdzasz że jesteś wystarczająco dojrzały żeby nie być anty-furry. +

    +

    + Nie ma tutaj porno i nigdy go nie będzie! Furry porno to zło które sprowadza złą sławę fandomowi Furry. +

    +

    +

    Wiek: 10

    + + +
    +
    +
    + +