commit 82005f45cd1298b2e8bddf2087813ce173f123a3 Author: Stefan Schallerl Date: Tue Dec 17 08:16:39 2024 +0100 Initial commit diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..ecb4ac8 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +bilder \ No newline at end of file diff --git a/README.md b/README.md new file mode 100644 index 0000000..e8f3f2a --- /dev/null +++ b/README.md @@ -0,0 +1,12 @@ +# Kleines Büro Graz + +Website des Kulturvereins "Kleines Büro Graz" + +## Farben + +see https://colorhunt.co/palette/78b3cec9e6f0fbf8eff96e2a + +* #78B3CE +* #C9E6F0 +* #FBF8EF +* #F96E2A diff --git a/htdocs/alfabeth.js b/htdocs/alfabeth.js new file mode 100644 index 0000000..babeabc --- /dev/null +++ b/htdocs/alfabeth.js @@ -0,0 +1,81 @@ +// [[], []], +const alphabet = { + " ": [], + "A": [ + [[1.5, 1], [1, 2]], + [[1.5, 1], [2, 2]], + [[1, 2], [2, 2]], + [[1, 2], [1, 3]], + [[2, 2], [2, 3]], + ], + "B": [ + [[1, 1], [1, 3]], + [[1, 1], [2, 1.2]], + [[1, 2], [2, 2]], + [[1, 3], [2, 2.8]], + [[2, 1.2], [2, 2.8]], + + ], + "C": [ + [[1, 1], [2, 1]], + [[1, 1], [1, 3]], + [[1, 3], [2, 3]], + ], + "D": [ + [[1, 1], [1, 3]], + [[1, 1], [1.5, 1]], + [[1, 3], [1.5, 3]], + [[1.5, 1], [2, 1.5]], + [[1.5, 3], [2, 2.5]], + [[2, 1.5], [2, 2.5]], + ], + "F": [ + [[1, 1], [1, 3]], + [[1, 1], [2, 1]], + [[1, 2], [1.5, 2]], + ], + "E": [ + [[1, 1], [1, 3]], + [[1, 1], [2, 1]], + [[1, 2], [2, 2]], + [[1, 3], [2, 3]]], + "K": [ + [[1, 1], [1, 3]], + [[1, 2], [2, 1]], + [[1, 2], [2, 3]]], + + "L": [ + [[1, 1], [1, 3]], + [[1, 3], [2, 3]]], + + "I": [ + [[1, 1], [1, 3]] + ], + "N": [ + [[1, 1], [1, 3]], + [[1, 1], [2, 3]], + [[2, 1], [2, 3]]], + "S": [ + [[1, 1], [2, 1]], + [[1, 1], [1, 2]], + [[1, 2], [2, 2]], + [[2, 2], [2, 3]], + [[2, 3], [1, 3]]], + "Ü": [ + [[1, 1], [1, 3]], + [[1, 3], [2, 3]], + [[2, 3], [2, 1]], + [[1, 0.5], [1, 0.8]], + [[2, 0.5], [2, 0.8]]], + "R": [ + [[1, 1], [1, 3]], + [[1, 1], [2, 1]], + [[2, 1], [2, 2]], + [[2, 2], [1, 2]], + [[1, 2], [2, 3]]], + "O": [ + [[1, 1], [1, 3]], + [[1, 1], [2, 1]], + [[1, 3], [2, 3]], + [[2, 1], [2, 3]]], +} \ No newline at end of file diff --git a/htdocs/favicon.png b/htdocs/favicon.png new file mode 100644 index 0000000..4cb08ce Binary files /dev/null and b/htdocs/favicon.png differ diff --git a/htdocs/img/waszaehltbistdu/1.jpg b/htdocs/img/waszaehltbistdu/1.jpg new file mode 100644 index 0000000..5aead0e Binary files /dev/null and b/htdocs/img/waszaehltbistdu/1.jpg differ diff --git a/htdocs/img/waszaehltbistdu/10.jpg b/htdocs/img/waszaehltbistdu/10.jpg new file mode 100644 index 0000000..d1fc3d1 Binary files /dev/null and b/htdocs/img/waszaehltbistdu/10.jpg differ diff --git a/htdocs/img/waszaehltbistdu/11.jpg b/htdocs/img/waszaehltbistdu/11.jpg new file mode 100644 index 0000000..fe43e43 Binary files /dev/null and b/htdocs/img/waszaehltbistdu/11.jpg differ diff --git a/htdocs/img/waszaehltbistdu/12.jpg b/htdocs/img/waszaehltbistdu/12.jpg new file mode 100644 index 0000000..f11fca2 Binary files /dev/null and b/htdocs/img/waszaehltbistdu/12.jpg differ diff --git a/htdocs/img/waszaehltbistdu/13.jpg b/htdocs/img/waszaehltbistdu/13.jpg new file mode 100644 index 0000000..96d7268 Binary files /dev/null and b/htdocs/img/waszaehltbistdu/13.jpg differ diff --git a/htdocs/img/waszaehltbistdu/14.jpg b/htdocs/img/waszaehltbistdu/14.jpg new file mode 100644 index 0000000..063adae Binary files /dev/null and b/htdocs/img/waszaehltbistdu/14.jpg differ diff --git a/htdocs/img/waszaehltbistdu/15.jpg b/htdocs/img/waszaehltbistdu/15.jpg new file mode 100644 index 0000000..b10a727 Binary files /dev/null and b/htdocs/img/waszaehltbistdu/15.jpg differ diff --git a/htdocs/img/waszaehltbistdu/2.jpg b/htdocs/img/waszaehltbistdu/2.jpg new file mode 100644 index 0000000..f23188a Binary files /dev/null and b/htdocs/img/waszaehltbistdu/2.jpg differ diff --git a/htdocs/img/waszaehltbistdu/3.jpg b/htdocs/img/waszaehltbistdu/3.jpg new file mode 100644 index 0000000..063adae Binary files /dev/null and b/htdocs/img/waszaehltbistdu/3.jpg differ diff --git a/htdocs/img/waszaehltbistdu/4.jpg b/htdocs/img/waszaehltbistdu/4.jpg new file mode 100644 index 0000000..b10a727 Binary files /dev/null and b/htdocs/img/waszaehltbistdu/4.jpg differ diff --git a/htdocs/img/waszaehltbistdu/5.jpg b/htdocs/img/waszaehltbistdu/5.jpg new file mode 100644 index 0000000..4e74cc6 Binary files /dev/null and b/htdocs/img/waszaehltbistdu/5.jpg differ diff --git a/htdocs/img/waszaehltbistdu/6.jpg b/htdocs/img/waszaehltbistdu/6.jpg new file mode 100644 index 0000000..96d7268 Binary files /dev/null and b/htdocs/img/waszaehltbistdu/6.jpg differ diff --git a/htdocs/img/waszaehltbistdu/7.jpg b/htdocs/img/waszaehltbistdu/7.jpg new file mode 100644 index 0000000..716d372 Binary files /dev/null and b/htdocs/img/waszaehltbistdu/7.jpg differ diff --git a/htdocs/img/waszaehltbistdu/8.jpg b/htdocs/img/waszaehltbistdu/8.jpg new file mode 100644 index 0000000..ae61d34 Binary files /dev/null and b/htdocs/img/waszaehltbistdu/8.jpg differ diff --git a/htdocs/img/waszaehltbistdu/9.jpg b/htdocs/img/waszaehltbistdu/9.jpg new file mode 100644 index 0000000..cdddf65 Binary files /dev/null and b/htdocs/img/waszaehltbistdu/9.jpg differ diff --git a/htdocs/img/waszaehltbistdu/Schöbitz_Was zählt bist du_E5H_13.tiff b/htdocs/img/waszaehltbistdu/Schöbitz_Was zählt bist du_E5H_13.tiff new file mode 100644 index 0000000..6c8b2a9 Binary files /dev/null and b/htdocs/img/waszaehltbistdu/Schöbitz_Was zählt bist du_E5H_13.tiff differ diff --git a/htdocs/img/waszaehltbistdu/Schöbitz_Was zählt bist du_E5H_24.tiff b/htdocs/img/waszaehltbistdu/Schöbitz_Was zählt bist du_E5H_24.tiff new file mode 100644 index 0000000..0d45831 Binary files /dev/null and b/htdocs/img/waszaehltbistdu/Schöbitz_Was zählt bist du_E5H_24.tiff differ diff --git a/htdocs/img/waszaehltbistdu/book-1.jpg b/htdocs/img/waszaehltbistdu/book-1.jpg new file mode 100644 index 0000000..744eb3e Binary files /dev/null and b/htdocs/img/waszaehltbistdu/book-1.jpg differ diff --git a/htdocs/img/waszaehltbistdu/book-2.jpg b/htdocs/img/waszaehltbistdu/book-2.jpg new file mode 100644 index 0000000..a1d7044 Binary files /dev/null and b/htdocs/img/waszaehltbistdu/book-2.jpg differ diff --git a/htdocs/img/waszaehltbistdu/book-3.jpg b/htdocs/img/waszaehltbistdu/book-3.jpg new file mode 100644 index 0000000..478ede4 Binary files /dev/null and b/htdocs/img/waszaehltbistdu/book-3.jpg differ diff --git a/htdocs/impressum.html b/htdocs/impressum.html new file mode 100644 index 0000000..de1f04f --- /dev/null +++ b/htdocs/impressum.html @@ -0,0 +1,89 @@ + + + + + + kleines • büro | graz | kunst • verein + + + + + + + +
+ +
+
+
+

Impressum, Offenlegung

+

+ Medieninhaber:
+ Kulturverein Kleines Büro
+ Körösistraße 5/2
+ 8010 Graz
+ kleinesbuerograz@gmail.com
+ kleinesburero.at; kleinesbuero.org +

+ +

Rechtsform: Verein (ZVR: 1992767384)

+ + +

Zweck des Vereins:
+ Der Verein ist nicht auf Gewinn ausgerichtet und verfolgt ausschließlich und unmittelbar gemeinnützige + Zwecke im Sinne der §§ 34ff BAO: Förderung von Kunst und Kultur für alle Menschen (europaweit)
+ -Durchführung kultureller Veranstaltungen: Theater, Lesungen, Konzerte, Ausstellungen
+ -Vorträge und Versammlungen, Exkursionen, Diskussionsabende
+ -Herausgabe von (periodischen) Publikationen: Produktion, Herausgabe, Verlag und Vertrieb von + Publikationen, Medien und Medieninhalten
+ -Produktion von Tonträgern, Katalogen und Infomaterial über Künstler:innen
+ -Veranstaltung von Workshop und Seminaren
+ -Öffentlichkeitsarbeit und Dokumentation
+ Der Verein ist berechtigt, sich weisungsgebundener Erfüllungsgehilf:innen zu bedienen, sofern auf diese + Weise der Vereinszweck besser erreicht werden kann. Der Verein kann auch für andere als + Erfüllungsgehilfe tätig werden, sofern dadurch der Vereinszweck besser erreicht werden kann.

+ +

Jedes Mitglied des Leitungsorgans ist berechtigt, den Verein nach außen zu vertreten (Einzelvertretung). +

+ +

Erklärung über die grundlegende Richtung:
+ Diese Website dient der Information und Servicierung der Vereinsmitglieder sowie der interessierten + Öffentlichkeit

+ + +

Disclaimer und Offenlegung lt. § 25 Mediengesetz:
+ Eine Haftung oder Garantie für die Aktualität, Richtigkeit und Vollständigkeit der zur Verfügung + gestellten Informationen kann nicht übernommen werden. Für Schäden materieller oder ideeller Art, die + durch die Nutzung oder Nichtnutzung der dargebotenen Informationen bzw. durch die Nutzung fehlerhafter + und unvollständiger Informationen verursacht wurden, übernimmt der Kulturverein Kleines Büro keine + Haftung, außer bei nachweislich vorsätzlichem oder grob fahrlässigem Verschulden. Der Kulturverein + Kleines Büro behält es sich vor, Teile des Webangebots oder das gesamte Angebot ohne gesonderte + Ankündigung zu verändern, zu ergänzen, zu löschen oder die Veröffentlichung zeitweise oder endgültig + einzustellen. Trotz sorgfältiger inhaltlicher Kontrolle übernehmen wir keine Haftung für die Inhalte + externer Links, die grafisch extra gekennzeichnet sind. Für den Inhalt dieser Seiten sind ausschließlich + deren Betreiber*innen verantwortlich. Namentlich gekennzeichnete Artikel und Beiträge müssen nicht + unbedingt die Meinung der Betreiber*innen widerspiegeln.

+ +

Vereinsbehörde:
+ Landespolizeidirektion Steiermark, SVA 3

+
+
+
+ +
+ + + \ No newline at end of file diff --git a/htdocs/index.html b/htdocs/index.html new file mode 100644 index 0000000..b955e9a --- /dev/null +++ b/htdocs/index.html @@ -0,0 +1,115 @@ + + + + + + kleines • büro | graz | kunst • verein + + + + + + + + + +
+ +
+
+
+

Was zählt, bist du

+ +
+
+
+
    +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • + +
  • +
  • +
  • +
+
+
+
+ +

Was zählt, bist du + +

Erzähl-/Musik-/Tanz-Theater für alle ab 3 Jahren

+

nach dem gleichnamigen Bilderbuch von Magda Hassan und Raffaela Schöbitz

+

Spür mal, hinter den Bäumen, zwischen den Blättern wartet ein Tier. Es ist groß und stark und + ungeheuerlich – ich glaube: Es ist wie ich. Schau mal, ich möchte dir von uns erzählen. Von tanzenden + Tatzen. Vom Ausruhen in weichem Fell. Von springenden Punkten. Von dem, wie ich zähle. Und wie ich 1, 2, + 3, 249 selbst groß und stark und alles sein kann – und du auch.

+

Ein Kind, eine Tänzerin und ein Musiker begegnen auf einer Bühne einem Gepard. Spielerisch, musikalisch, + in poetischen Bildern und Sprachen und immer mit Unterstützung der (jungen) Zuschauer:innen erwecken sie + Punkt für Punkt das einfühlsame und kunstvoll illustrierte Bilderbuch WAS ZÄHLT, BIST DU von Magda + Hassan und Raffaela Schöbitz zum Leben, das 2022 von einer Fachjury als „Eines der schönsten Bücher + Österreichs“ ausgezeichnet wurde.

+ +

Regie: Anna Spitzbart
+ Musik und Spiel: Alexander Lainer
+ Tanz/Performance: Anna und Frida Spitzbart
+ Bühnen- und Kostümbild: Lena Winkler-Hermaden
+ Dramaturgische Begleitung: Dagmar Stehring
+ Foto/Technik: Patricia Messina
+ Video: Tobias Pichler
+ Uraufführung am 19. September 2024 im Tanzsaal des Salon Stolz in Graz

+
+
+
+
+

Wer wir sind

+

«Kleines Büro» besteht aus Alexander Lainer (Musik und Schauspiel), Anna Spitzbart (Regie, Tanz- und + Theaterpädagogik) und Lena Winkler-Hermaden (Bühnen-, Kostümbild und Organisation).

+

Der im April 2024 gegründete Grazer Kulturverein hat sich die Durchführung von «kleinen», niederschwellig + zugänglichen Kulturveranstaltungen groß auf die Fahnen geschrieben. Dazu gehören neben + Theateraufführungen für die Kleinsten, Diskussionsveranstaltungen und Workshops in Kindergärten, Schulen + oder anderen Einrichtungen.

+

«Kleines Büro» bemüht sich um Publikumsschichten, die von bestehenden Kultureinrichtungen nicht erreicht + werden. Die Arbeit der drei Kulturschaffenden mit Bildern, Musik und Tanz machen Theater zugänglich für + alle - egal welcher Generation oder aus welchem Sprachraum das Publikum entstammt.

+
+
+
+ +
+ + + + \ No newline at end of file diff --git a/htdocs/kleinesbuero.css b/htdocs/kleinesbuero.css new file mode 100644 index 0000000..dfb4caa --- /dev/null +++ b/htdocs/kleinesbuero.css @@ -0,0 +1,82 @@ +/** + https://colorhunt.co/palette/364f6b3fc1c9f5f5f5fc5185 + */ + + :root { + --primary-color: #364F6B; + --secondary-color: #C9E6F0; + --contrast: #F96E2A; + --background: #FBF8EF; + --text-color: rgba(0, 0, 0, 0.75); + } + +#werwirsind { + background-color: var(--secondary-color); +} + +BODY { + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; + line-height: 150%; + color: var(--text-color); + background-color: var(--background); + margin: 0; +} + +H1, H2, H3, H4, H5, H6 { + font-family: Haettenschweiler, 'Arial Narrow Bold', sans-serif; + color: var(--contrast); +} + +A { + color: #364F6B; + text-decoration: none; + border: 1px dotted var(--primary-color); + border-width: 0px 0px 1px 0px; +} + +FOOTER { +/* position: fixed; + left: 0px; + right: 0px; + bottom: 0px; + height: 100px; + */ + height: 100px; + background-color: var(--contrast); +} + +FOOTER H2 { + color: var(--primary-color); +} + +#header { + margin: 0 auto; + display: block; +} + +.content { + margin: 0 auto; + max-width: 1024px; + padding: 4px; +} + +NAV { + text-align: center; + color: var(--secondary-color) +} +NAV A { + color: var(--secondary-color) +} + +.splide__slide IMG { + max-height: 512px; +} + +.splide__slide { + text-align: center; +} + +#waszaehltbistdu_images { + background-color: var(--secondary-color); + padding: 16px 0px; +} \ No newline at end of file diff --git a/htdocs/kleinesbuero.js b/htdocs/kleinesbuero.js new file mode 100644 index 0000000..ef5d9d3 --- /dev/null +++ b/htdocs/kleinesbuero.js @@ -0,0 +1,215 @@ +// import Glide, { Controls, Breakpoints } from '/js/glide.modular.esm' + +class Wiggler { + constructor(canvas, target) { + console.log("start init") + + this.canvas = canvas; + this.ctx = canvas.getContext("2d"); + this.target = target; + + this.width = this.canvas.width; + this.height = this.canvas.height; + + + // this.initRandom(); + // this.initCorners(); + this.current = this.initEdges(); + } + + initRandom() { + return this.target.map(l => { + const px = Math.random() * this.width; + const py = Math.random() * this.height; + const r = Math.PI * 2; + const tx = px + Math.cos(r) * 10; + const ty = py + Math.sin(r) * 10; + + return [[px, py], [tx, ty]]; + }); + } + + initCorners() { + return this.target.map(l => { + const px = Math.random() < .5 ? 0 : this.width; + const py = Math.random() < .5 ? 0 : this.height; + const r = Math.PI * 2; + const tx = px + Math.cos(r) * 10; + const ty = py + Math.sin(r) * 10; + + return [[px, py], [tx, ty]]; + }); + } + + initEdges() { + return this.target.map(() => { + var px, py; + if (Math.random() < .5) { + px = Math.random() < .5 ? 0 : this.width; + py = Math.random() * this.height; + } else { + px = Math.random() * this.width; + py = Math.random() < .5 ? 0 : this.height; + } + return [[px, py], [px, py]]; + }); + } + + start() { + console.log("start"); + if (!this.running) { + this.running = true; + this.animate(); + } + } + + stop() { + console.log("stop"); + if (this.running) { + this.running = false; + } + } + + toggle() { + this.running = !this.running; + if (this.running) { + this.animate(); + } else { + console.log("stop"); + } + } + + animate() { + if (this.running) { + this.update(); + this.draw(); + window.requestAnimationFrame(() => { this.animate(); }) + } + } + + dist(p1, p2) { + const dx = p1[0] - p2[0]; + const dy = p1[1] - p2[1]; + return Math.sqrt(dx * dx + dy * dy); + } + + mv(d) { return Math.random() * d - (d / 2.0); } + + update() { + var changed = false; + + for (var l = 0; l < this.current.length; l++) { + for (var p = 0; p < 2; p++) { + const cp = this.current[l][p]; + const tp = this.target[l][p]; + + if (this.dist(cp, tp) > .5) { + changed = true; + const dist = this.dist(cp, tp); + var np; + var ndist; + + do { + const dx = this.mv(Math.sqrt(dist) + 2); + const dy = this.mv(Math.sqrt(dist) + 2); + np = [cp[0] + dx, cp[1] + dy]; + ndist = this.dist(np, tp); + } while (ndist > dist); + + this.current[l][p] = np; + + } + } + } + + if (!changed) { + this.running = false; + } + } + + draw() { + this.fillStyle = "white"; + this.ctx.clearRect(0, 0, 800, 600); + + this.ctx.strokeStyle = "black"; + + this.current.forEach(l => { + this.ctx.beginPath(); + this.ctx.moveTo(l[0][0], l[0][1]); + this.ctx.lineTo(l[1][0], l[1][1]); + this.ctx.stroke(); + }); + } + + mash() { + // randomize completely + // this.current = this.current.map(l => l.map(p => [p[0] + Math.random() * 300 - 150, p[1] + Math.random() * 300 - 150])); + + this.current = this.current.map(l => { + const px = l[0][0] + this.mv(this.width / 5); + const py = l[0][1] + this.mv(this.height / 5); + const r = Math.PI * 2; + const tx = px + Math.cos(r) * 10; + const ty = py + Math.sin(r) * 10; + + return [[px, py], [px, py]]; + }); + + if (!this.running) { + this.running = true; + this.animate(); + } + } +} + +Array.__prototype + +const textToCoords = (text, scale, alphabet) => { + var base = 0; + + var output = Array.from(text).flatMap(c => { + const g = alphabet[c].map(l => + l.map(p => [p[0] * scale + base, p[1] * scale]) + ); + + const maxx = alphabet[c].map(l => Math.max(l[0][0], l[1][0])); + + // width of character plus + const inc = (Math.max(1, Math.max(...maxx)) + 0.2) * scale; + base += inc; + + return g; + }); + + return output; + + /* + for (var i = 0; i < text.length; i++) { + const char = text[i]; + const co = alphabet[char]; + co.forEach(l => output.push(l.map(p => p.map()))); + } + */ +}; + +document.addEventListener('DOMContentLoaded', () => { + console.log("kleines büro ready ..."); + + const canvas = document.getElementById("header"); + const target = textToCoords("KLEINES BÜRO", 10, alphabet); + const wiggler = new Wiggler(canvas, target); + + wiggler.start(); + + canvas.addEventListener("click", () => { wiggler.mash(); }); + + // document.addEventListener("DOMContentLoaded", function () { + // new Glide('.glide').mount({Controls}); + // new Glide('.glide').mount(); + // }); + + new Splide('.splide', { + padding: '5rem', + }).mount(); + +}); \ No newline at end of file