then
/
opencoil-paracity
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

css doooone

master
Anton Linus 4 years ago
parent
b4ee73c604
commit
647fcbf67a
5 changed files with 230 additions and 167 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      website/map/historicalData.json
  2. 222
      website/map/index.php
  3. 2
      website/map/latestData.json
  4. 122
      website/map/main.css
  5. 49
      website/preshow/main.css

2
website/map/historicalData.json
View File

File diff suppressed because one or more lines are too long

222
website/map/index.php
View File

@ -203,127 +203,127 @@ function callAPI($url){
<div id="title-container"> <div id="title-container">
<h1>OPENCOIL</h1> <h1>OPENCOIL</h1>
<h2>a roaming speedshow</h2> <h2>a roaming speedshow</h2>
<p>legendary code has once been written on a cold rainy night in october. it was 2 nay 1 day before the opening of this show when i typed this silly code. it was legendary. both the situation as well as the code. thanks for reading. bye</p> <!--<p>legendary code has once been written on a cold rainy night in october. it was 2 nay 1 day before the opening of this show when i typed this silly code. it was legendary. both the situation as well as the code. thanks for reading. bye</p>-->
<div id="bottom_menu"> <div id="bottom_menu">
<a href="#" onclick="document.getElementById('infotext').style.visibility='visible';document.getElementById('infotext').style.opacity='1';">info</a> <a href="#" onclick="document.getElementById('infotext').style.visibility='visible';document.getElementById('infotext').style.opacity='1';">info</a>
<a href="#" onclick="document.getElementById('abouttext').style.visibility='visible';document.getElementById('infotext').style.opacity='1';">about</a> <a href="#" onclick="document.getElementById('abouttext').style.visibility='visible';document.getElementById('infotext').style.opacity='1';">about</a>
<a href="#" onclick="document.getElementById('contacttext').style.visibility='visible';document.getElementById('infotext').style.opacity='1';">contact</a> <a href="#" onclick="document.getElementById('contacttext').style.visibility='visible';document.getElementById('infotext').style.opacity='1';">contact</a>
</div> </div>
</div> </div>
<div id="infotext"> <div id="infotext">
<div id="infobuttons"> <div id="infobuttons">
<div id="closeButton" onclick="document.getElementById('infotext').style.visibility='hidden';document.getElementById('infotext').style.opacity='0';">X</div> <div id="closeButton" onclick="document.getElementById('infotext').style.visibility='hidden';document.getElementById('infotext').style.opacity='0';">X</div>
<div id="enButton" onclick="document.getElementById('infotext_en').style.visibility='visible';document.getElementById('infotext_en').style.opacity='1';">EN</div> <div id="enButton" onclick="document.getElementById('infotext_en').style.visibility='visible';document.getElementById('infotext_en').style.opacity='1';">EN</div>
</div> </div>
<p> <p>
OPENCOIL – a roaming Speedshow <br><br> OPENCOIL – a roaming Speedshow <br><br>
Die Ausstellung OPENCOIL setzt sich mit den Auswirkungen von Mikro-Mobilitätsdiensten auf den Stadtraum auseinander, indem sie ihre dezentrale Infrastruktur als Ausstellungsraum nutzt und gleichzeitig die Bedingungen und Auswirkungen dieser Infrastrukturen auch zum Thema macht. Die Ausstellung OPENCOIL setzt sich mit den Auswirkungen von Mikro-Mobilitätsdiensten auf den Stadtraum auseinander, indem sie ihre dezentrale Infrastruktur als Ausstellungsraum nutzt und gleichzeitig die Bedingungen und Auswirkungen dieser Infrastrukturen auch zum Thema macht.
<br><br> <br><br>
11 Künstler*innen wurden eingeladen, ihre Arbeiten auf einem kleinen Wifi Controller mit ~2MB Offline-Speicher zu präsentieren. 11 Künstler*innen wurden eingeladen, ihre Arbeiten auf einem kleinen Wifi Controller mit ~2MB Offline-Speicher zu präsentieren.
<br><br> <br><br>
Diese „digitalen Galerieräume“ werden an 11 zufällig ausgewählten E-Scootern angebracht. Diese „digitalen Galerieräume“ werden an 11 zufällig ausgewählten E-Scootern angebracht.
<br> <br>
So fährt die Ausstellung, von den Nutzer*Innen der Roller unbemerkt, als „roaming Speedshow“ durch die Stadt. So fährt die Ausstellung, von den Nutzer*Innen der Roller unbemerkt, als „roaming Speedshow“ durch die Stadt.
<br><br> <br><br>
Der aktuelle Standort der Kunstwerke kann ab dem 26. Oktober über diese Website verfolgt werden. Damit die Werke betrachtet werden können, muss die „Roller-Galerie“ im Stadtraum gefunden werden. Der aktuelle Standort der Kunstwerke kann ab dem 26. Oktober über diese Website verfolgt werden. Damit die Werke betrachtet werden können, muss die „Roller-Galerie“ im Stadtraum gefunden werden.
<br><br> <br><br>
Sobald der Roller angemietet ist, erhalten die Besucher*innen über ihr persönliches Smartphone, Zugang zu dem 2MB großen Galerieraum und den ausgestellten Werken. Sobald der Roller angemietet ist, erhalten die Besucher*innen über ihr persönliches Smartphone, Zugang zu dem 2MB großen Galerieraum und den ausgestellten Werken.
<br><br> <br><br>
Während Kapazitätsbeschränkungen und die bevorzugte Vermeidung von Zusammenkünften in geschlossenen Räumen, traditionelle Galerien und Museen vor Herausforderungen stellen, zielt OPENCOIL darauf ab, die Ortsunabhängigkeit des Online mit der Materialität des Offline (und umgekehrt) zu verbinden. Die Infrastruktur der „Mikro-Mobiltitätsdienste“ wird übernommen – klimaneutral und dezentral. Während Kapazitätsbeschränkungen und die bevorzugte Vermeidung von Zusammenkünften in geschlossenen Räumen, traditionelle Galerien und Museen vor Herausforderungen stellen, zielt OPENCOIL darauf ab, die Ortsunabhängigkeit des Online mit der Materialität des Offline (und umgekehrt) zu verbinden. Die Infrastruktur der „Mikro-Mobiltitätsdienste“ wird übernommen – klimaneutral und dezentral.
<br><br> <br><br>
Die Gehwege vieler Städte auf der ganzen Welt wurden in den letzten Jahren von sogenannten 'dockless sharing vehicles' regelrecht überflutet. Mit Versprechungen von Umweltfreundlichkeit und Elektromobilität, besetzten diese Risikokapitalismus Aktivisten die Grauzone zwischen privatem und öffentlichem Raum auf den Straßen unserer Städte. Diese gewissenlose Gewissenhaftigkeit der "Mikro-Mobilitätsdienste" wirft jedoch wichtige Fragen zu städtischem Raum, Eigentum, Agentur, Produktion, Ökologie und sehr spätem Kapitalismus auf. Die Gehwege vieler Städte auf der ganzen Welt wurden in den letzten Jahren von sogenannten 'dockless sharing vehicles' regelrecht überflutet. Mit Versprechungen von Umweltfreundlichkeit und Elektromobilität, besetzten diese Risikokapitalismus Aktivisten die Grauzone zwischen privatem und öffentlichem Raum auf den Straßen unserer Städte. Diese gewissenlose Gewissenhaftigkeit der "Mikro-Mobilitätsdienste" wirft jedoch wichtige Fragen zu städtischem Raum, Eigentum, Agentur, Produktion, Ökologie und sehr spätem Kapitalismus auf.
<br><br> <br><br>
Wie umgehen mit der Inbesitznahme öffentlichen Raums?<br> Wie umgehen mit der Inbesitznahme öffentlichen Raums?<br>
Welche Werkzeuge und Wege gibt es sich diesen zurückzuerobern?<br> Welche Werkzeuge und Wege gibt es sich diesen zurückzuerobern?<br>
<br> <br>
OPENCOIL soll nicht nur ein Pandemie-tauglicher Weg sein, um Kunst im öffentlichen Offline-Raum zu zeigen. OPENCOIL ist auch eine kreative (Um-)Nutzung von E-Scootern, ein Versuch, sich ihnen mit künstlerischen Mitteln zu nähern. OPENCOIL soll nicht nur ein Pandemie-tauglicher Weg sein, um Kunst im öffentlichen Offline-Raum zu zeigen. OPENCOIL ist auch eine kreative (Um-)Nutzung von E-Scootern, ein Versuch, sich ihnen mit künstlerischen Mitteln zu nähern.
<br> <br>
Gezeigt werden Arbeiten, die sich mit Fragen der Überschneidung von öffentlichem und privatem Raum, dem Umgang mit Ressourcen sowie mit Greenwashing, Risikokapitalismus und Vandalismus befassen. Gezeigt werden Arbeiten, die sich mit Fragen der Überschneidung von öffentlichem und privatem Raum, dem Umgang mit Ressourcen sowie mit Greenwashing, Risikokapitalismus und Vandalismus befassen.
<br><br> <br><br>
Die teilnehmenden Künstler*innen sind: Die teilnehmenden Künstler*innen sind:
<br><br> <br><br>
Aram Bartholl<br> Aram Bartholl<br>
Constant Dullaart<br> Constant Dullaart<br>
Dennis de Bel & Anton Jehle<br> Dennis de Bel & Anton Jehle<br>
JODI<br> JODI<br>
Jonas Lund<br> Jonas Lund<br>
Martin Howse<br> Martin Howse<br>
!Mediengruppe Bitnik<br> !Mediengruppe Bitnik<br>
Rosa Menkman<br> Rosa Menkman<br>
Sarah Grant<br> Sarah Grant<br>
Sofya Aleynikova<br> Sofya Aleynikova<br>
Danja Vasiliev<br> Danja Vasiliev<br>
<br><br> <br><br>
Sonstige Erläuterungen: Sonstige Erläuterungen:
<br><br> <br><br>
Die künstlerischen Beiträge sind jeweils auf einem Wifi Mikrocontroller gespeichert, welcher mit einem Tretroller verbunden ist und so, sobald der Roller ausgeliehen ist, mit Strom versorgt wird. Um die Arbeiten zu sehen verbindet man sich mit dem vom Wifi Chip gesendeten, lokalen unverschlüsselten WiFi Netzwerk. Es öffnet sich automatisch ein Webportal, indem die Arbeit zu sehen ist. Es ist keine mobile Datenverbindung notwendig. Die künstlerischen Beiträge sind jeweils auf einem Wifi Mikrocontroller gespeichert, welcher mit einem Tretroller verbunden ist und so, sobald der Roller ausgeliehen ist, mit Strom versorgt wird. Um die Arbeiten zu sehen verbindet man sich mit dem vom Wifi Chip gesendeten, lokalen unverschlüsselten WiFi Netzwerk. Es öffnet sich automatisch ein Webportal, indem die Arbeit zu sehen ist. Es ist keine mobile Datenverbindung notwendig.
Alle Arbeiten wurden von den Künstler*innen speziell für die Betrachtung auf Smartphones optimiert. Alle Arbeiten wurden von den Künstler*innen speziell für die Betrachtung auf Smartphones optimiert.
<br><br> <br><br>
OPENCOIL ist in keiner Weise mit der den „Mikro-Mobilitätsdiensten“ assoziiert, sondern bedient sich lediglich am bestehenden Rollernetzwerk. Die Umnutzung der Roller zu einem Ausstellungsort ist nach der Ausstellung komplett reversibel und schränkt den herkömmlichen Gebrauch der Roller (auch während der Ausstellung) in keiner Weise ein. Die Roller werden nicht beschädigt.<br><br> OPENCOIL ist in keiner Weise mit der den „Mikro-Mobilitätsdiensten“ assoziiert, sondern bedient sich lediglich am bestehenden Rollernetzwerk. Die Umnutzung der Roller zu einem Ausstellungsort ist nach der Ausstellung komplett reversibel und schränkt den herkömmlichen Gebrauch der Roller (auch während der Ausstellung) in keiner Weise ein. Die Roller werden nicht beschädigt.<br><br>
Die Ausstellung startet am 26. Oktober auf dem öffentlichen Platz vor dem Zentrum für Netzkunst (Haus der Statistik) und wird in der Woche bis zum 1. November täglich von unserem Team gewartet und am Laufen gehalten. Sollte eine Arbeit beschädigt oder nicht auffindbar sein bitte per Mail (<a id="infolink" href="mailto:service@opencoil.show">service@opencoil.show</a>) oder über die Telegram App (<a id="infolink" href="https://t.me/opencoil">https://t.me/opencoil</a>)<br><br> Die Ausstellung startet am 26. Oktober auf dem öffentlichen Platz vor dem Zentrum für Netzkunst (Haus der Statistik) und wird in der Woche bis zum 1. November täglich von unserem Team gewartet und am Laufen gehalten. Sollte eine Arbeit beschädigt oder nicht auffindbar sein bitte per Mail (<a id="infolink" href="mailto:service@opencoil.show">service@opencoil.show</a>) oder über die Telegram App (<a id="infolink" href="https://t.me/opencoil">https://t.me/opencoil</a>)<br><br>
</p> </p>
<div id="closeButtonbottom" onclick="document.getElementById('infotext').style.visibility='hidden';">less info</div> <div id="closeButtonbottom" onclick="document.getElementById('infotext').style.visibility='hidden';">less info</div>
</div> </div>
<div id="infotext_en"> <div id="infotext_en">
<div id="closeButton" onclick="document.getElementById('infotext_en').style.visibility='hidden'; document.getElementById('infotext').style.visibility='hidden';">X</div> <div id="closeButton" onclick="document.getElementById('infotext_en').style.visibility='hidden'; document.getElementById('infotext').style.visibility='hidden';">X</div>
<p> <p>
OPENCOIL - a roaming speed show OPENCOIL - a roaming speed show
<br><br> <br><br>
The OPENCOIL exhibition explores the impact of micro-mobility services on urban space by using its decentralised infrastructure as an exhibition space, while also addressing the conditions and effects of this infrastructure. The OPENCOIL exhibition explores the impact of micro-mobility services on urban space by using its decentralised infrastructure as an exhibition space, while also addressing the conditions and effects of this infrastructure.
<br><br> <br><br>
11 artists were invited to present their work on a small Wifi controller with ~2MB offline memory. 11 artists were invited to present their work on a small Wifi controller with ~2MB offline memory.
<br><br> <br><br>
These "digital gallery spaces" are attached to 11 randomly selected e-scooters. These "digital gallery spaces" are attached to 11 randomly selected e-scooters.
Thus the exhibition, unnoticed by the regular users of these scooters, drives through the city as a "roaming speed show". Thus the exhibition, unnoticed by the regular users of these scooters, drives through the city as a "roaming speed show".
<br><br> <br><br>
From October 26th onwards the current location of the artworks will be displayed here on this website. In order to view the works the corresponding "Scooter Gallery" must be found in the offline urban space. From October 26th onwards the current location of the artworks will be displayed here on this website. In order to view the works the corresponding "Scooter Gallery" must be found in the offline urban space.
<br><br> <br><br>
Once the scooter is rented, visitors will be able to access the 2MB gallery space and the exhibited works via their personal smartphone. Once the scooter is rented, visitors will be able to access the 2MB gallery space and the exhibited works via their personal smartphone.
<br><br> <br><br>
While capacity restrictions and the preferred avoidance of gatherings in closed spaces pose challenges on traditional galleries and museums, OPENCOIL aims to combine the independence of the online with the materiality of the offline (and vice versa). The infrastructure of "micro-mobility services" will be taken over - climate-neutral and decentralised. While capacity restrictions and the preferred avoidance of gatherings in closed spaces pose challenges on traditional galleries and museums, OPENCOIL aims to combine the independence of the online with the materiality of the offline (and vice versa). The infrastructure of "micro-mobility services" will be taken over - climate-neutral and decentralised.
<br><br> <br><br>
The pavements of many cities around the world have been flooded in recent years by so-called 'dockless sharing vehicles'. With promises of eco-friendliness and electromobility, these risk capitalism activists have occupied the grey zone between private and public space on the streets of our cities. However, this unscrupulous conscientiousness of 'micro-mobility services' raises important questions about urban space, ownership, agency, production, ecology and very late capitalism. The pavements of many cities around the world have been flooded in recent years by so-called 'dockless sharing vehicles'. With promises of eco-friendliness and electromobility, these risk capitalism activists have occupied the grey zone between private and public space on the streets of our cities. However, this unscrupulous conscientiousness of 'micro-mobility services' raises important questions about urban space, ownership, agency, production, ecology and very late capitalism.
<br><br> <br><br>
How to deal with the occupation of public space? How to deal with the occupation of public space?
What tools and ways are there to reclaim it? What tools and ways are there to reclaim it?
<br><br> <br><br>
OPENCOIL is not only meant to be a pandemic-proof way to show art in public offline space. OPENCOIL is also a creative (re)use of e-scooters, an attempt to approach them by artistic means. OPENCOIL is not only meant to be a pandemic-proof way to show art in public offline space. OPENCOIL is also a creative (re)use of e-scooters, an attempt to approach them by artistic means.
On show are works that deal with questions of the overlap between public and private space, the use of resources, as well as greenwashing, risk capitalism and vandalism. On show are works that deal with questions of the overlap between public and private space, the use of resources, as well as greenwashing, risk capitalism and vandalism.
<br><br> <br><br>
The participating artists are: The participating artists are:
<br><br> <br><br>
Aram Bartholl<br> Aram Bartholl<br>
Constant Dullaart<br> Constant Dullaart<br>
Dennis de Bel & Anton Jehle<br> Dennis de Bel & Anton Jehle<br>
JODI<br> JODI<br>
Jonas Lund<br> Jonas Lund<br>
Martin Howse<br> Martin Howse<br>
!Mediengruppe Bitnik<br> !Mediengruppe Bitnik<br>
Rosa Menkman<br> Rosa Menkman<br>
Sarah Grant<br> Sarah Grant<br>
Sofya Aleynikova<br> Sofya Aleynikova<br>
Danja Vasiliev<br> Danja Vasiliev<br>
<br><br><br> <br><br><br>
Other explanatory notes: Other explanatory notes:
<br><br> <br><br>
The artistic contributions are each stored on a Wifi microcontroller, which is connected to a scooter and is thus supplied with power as soon as the scooter is rented. To view the works, you connect to the local unencrypted WiFi network sent by the Wifi chip. A web portal opens automatically, where the work can be viewed. No mobile data connection is necessary. All works have been specially optimised by the artists to be viewed on smartphones. The artistic contributions are each stored on a Wifi microcontroller, which is connected to a scooter and is thus supplied with power as soon as the scooter is rented. To view the works, you connect to the local unencrypted WiFi network sent by the Wifi chip. A web portal opens automatically, where the work can be viewed. No mobile data connection is necessary. All works have been specially optimised by the artists to be viewed on smartphones.
<br><br> <br><br>
OPENCOIL is in no way associated with the "micro-mobility services", but only uses the existing scooter network. The conversion of the scooters into an exhibition space is completely reversible after the exhibition ends and in no way restricts the conventional use of the scooters (even during the exhibition). The scooters will not be damaged. OPENCOIL is in no way associated with the "micro-mobility services", but only uses the existing scooter network. The conversion of the scooters into an exhibition space is completely reversible after the exhibition ends and in no way restricts the conventional use of the scooters (even during the exhibition). The scooters will not be damaged.
<br><br> <br><br>
The exhibition will start on October 26th in the public space in front of Zentrum für Netzkunst (Haus der Statistik). For one week, until November 1st, the exhibition will be serviced and kept running daily by our team. Should a work be damaged or not be found, please send an e-mail (<a id="infolink" href="mailto:service@opencoil.show">service@opencoil.show</a>) or use the Telegram App (<a id="infolink" href="https://t.me/opencoil">https://t.me/opencoil</a>) The exhibition will start on October 26th in the public space in front of Zentrum für Netzkunst (Haus der Statistik). For one week, until November 1st, the exhibition will be serviced and kept running daily by our team. Should a work be damaged or not be found, please send an e-mail (<a id="infolink" href="mailto:service@opencoil.show">service@opencoil.show</a>) or use the Telegram App (<a id="infolink" href="https://t.me/opencoil">https://t.me/opencoil</a>)
</p> </p>
<div id="closeButtonbottom" onclick="document.getElementById('infotext').style.visibility='hidden'; document.getElementById('infotext_en').style.visibility='hidden';">less info</div> <div id="closeButtonbottom" onclick="document.getElementById('infotext').style.visibility='hidden'; document.getElementById('infotext_en').style.visibility='hidden';">less info</div>
</div> </div>
<script> <script>
// define icons // define icons
// prefix: glyphicon = bootstrap, list can be found here: https://getbootstrap.com/docs/3.3/components/ // prefix: glyphicon = bootstrap, list can be found here: https://getbootstrap.com/docs/3.3/components/
// prefix: fa = fontawesome, list is here: https://fontawesome.com/v4.7.0/cheatsheet/ // prefix: fa = fontawesome, list is here: https://fontawesome.com/v4.7.0/cheatsheet/

2
website/map/latestData.json
View File

@ -1 +1 @@
{"0":{"ID":0,"lastPos":"52.516922, 13.494012","lastLocationUpdate":"2020-10-15T00:51:13Z","isRentable":true,"state":"ACTIVE","name":"artist name 0","title":"title","desc":"desciption"},"1":{"ID":1,"lastPos":"52.461506, 13.321215","lastLocationUpdate":"2020-10-15T00:48:45Z","isRentable":true,"state":"ACTIVE","name":"artist name 1","title":"title","desc":"desciption"},"2":{"ID":2,"lastPos":"52.491178, 13.385457","lastLocationUpdate":"2020-10-15T00:46:28Z","isRentable":true,"state":"ACTIVE","name":"artist name 2","title":"title","desc":"desciption"},"3":{"ID":3,"lastPos":"52.474423, 13.365387","lastLocationUpdate":"2020-10-15T00:48:04Z","isRentable":false,"state":"INACTIVE","name":"artist name 3","title":"title","desc":"desciption"},"4":{"ID":4,"lastPos":"52.512192, 13.376707","lastLocationUpdate":"2020-10-15T00:46:40Z","isRentable":true,"state":"ACTIVE","name":"artist name 4","title":"title","desc":"desciption"},"5":{"ID":5,"lastPos":"52.529781, 13.401221","lastLocationUpdate":"2020-10-15T00:54:37Z","isRentable":true,"state":"ACTIVE","name":"artist name 5","title":"title","desc":"desciption"},"6":{"ID":6,"lastPos":"52.507063, 13.31256","lastLocationUpdate":"2020-10-15T00:47:27Z","isRentable":true,"state":"ACTIVE","name":"artist name 6","title":"title","desc":"desciption"},"7":{"ID":7,"lastPos":"52.545109, 13.359456","lastLocationUpdate":"2020-10-15T00:51:35Z","isRentable":true,"state":"ACTIVE","name":"artist name 7","title":"title","desc":"desciption"},"8":{"ID":8,"lastPos":"52.511562, 13.310639","lastLocationUpdate":"2020-10-13T00:02:27Z","isRentable":false,"state":"GPS_ISSUE","name":"artist name 8","title":"title","desc":"desciption"},"9":{"ID":9,"lastPos":"52.548454, 13.366208","lastLocationUpdate":"2020-10-15T00:50:36Z","isRentable":true,"state":"ACTIVE","name":"artist name 9","title":"title","desc":"desciption"}} {"0":{"ID":0,"lastPos":"52.516891, 13.493958","lastLocationUpdate":"2020-10-15T10:03:24Z","isRentable":true,"state":"ACTIVE","name":"artist name 0","title":"title","desc":"desciption"},"1":{"ID":1,"lastPos":"52.461506, 13.321215","lastLocationUpdate":"2020-10-15T10:05:54Z","isRentable":true,"state":"ACTIVE","name":"artist name 1","title":"title","desc":"desciption"},"2":{"ID":2,"lastPos":"52.491211, 13.38604","lastLocationUpdate":"2020-10-15T10:04:27Z","isRentable":true,"state":"ACTIVE","name":"artist name 2","title":"title","desc":"desciption"},"3":{"ID":3,"lastPos":"52.474423, 13.365387","lastLocationUpdate":"2020-10-15T08:25:44Z","isRentable":false,"state":"INACTIVE","name":"artist name 3","title":"title","desc":"desciption"},"4":{"ID":4,"lastPos":"52.512192, 13.376707","lastLocationUpdate":"2020-10-15T10:03:48Z","isRentable":true,"state":"ACTIVE","name":"artist name 4","title":"title","desc":"desciption"},"5":{"ID":5,"lastPos":"52.529785, 13.400977","lastLocationUpdate":"2020-10-15T10:00:25Z","isRentable":true,"state":"ACTIVE","name":"artist name 5","title":"title","desc":"desciption"},"6":{"ID":6,"lastPos":"52.507063, 13.31256","lastLocationUpdate":"2020-10-15T10:04:36Z","isRentable":true,"state":"ACTIVE","name":"artist name 6","title":"title","desc":"desciption"},"7":{"ID":7,"lastPos":"52.545063, 13.359674","lastLocationUpdate":"2020-10-15T10:04:57Z","isRentable":true,"state":"ACTIVE","name":"artist name 7","title":"title","desc":"desciption"},"8":{"ID":8,"lastPos":"52.511562, 13.310639","lastLocationUpdate":"2020-10-13T00:02:27Z","isRentable":false,"state":"GPS_ISSUE","name":"artist name 8","title":"title","desc":"desciption"},"9":{"ID":9,"lastPos":"52.533564, 13.366404","lastLocationUpdate":"2020-10-15T09:57:50Z","isRentable":true,"state":"ACTIVE","name":"artist name 9","title":"title","desc":"desciption"}}

122
website/map/main.css
View File

@ -1,28 +1,33 @@
body { body {
height: 100%; height: 100%;
width: 100%; width: 100%;
max-width: 100%;
max-height: 100%;
margin: 0; margin: 0;
overflow: hidden;
} }
#map { #map {
position: absolute; position: absolute;
height: 100%; height: 100%;
width: 100%; width: 100%;
max-height: 100%;
max-width: 100%;
border: none; border: none;
} }
#title-container { #title-container {
position: absolute; position: absolute;
pointer-events: none;
display: flex; display: flex;
flex-flow: row wrap; flex-flow: row wrap;
pointer-events: none;
z-index: 1000; z-index: 1000;
text-align: right; text-align: right;
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
h1, h2, h3, p { h1, h2, h3 {
position: absolute; position: absolute;
width: 100%; width: 100%;
pointer-events: none; pointer-events: none;
@ -52,15 +57,9 @@ h3 {
align-self: flex-start; align-self: flex-start;
} }
p {
font-size: 5vw;
padding-right: 2.5%;
align-self: flex-end;
padding-bottom: 2.5%;
}
#bottom_menu { #bottom_menu {
position: absolute; position: absolute;
pointer-events: all !important;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-self: flex-end; align-self: flex-end;
@ -73,6 +72,7 @@ p {
font-size: 2.5vw; font-size: 2.5vw;
text-align: center; text-align: center;
align-items: center; align-items: center;
border: 1px #d152b8;
} }
@ -81,29 +81,55 @@ p {
color: #d152b8; color: #d152b8;
} }
/* Hide scrollbar for Chrome, Safari and Opera */
#infotext, #infotext_en:-webkit-scrollbar {
display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
#infotext, #infotext_en { #infotext, #infotext_en {
visibility: hidden; -ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
}
#infotext, #infotext_en {
visibility: hidden;
opacity:0; opacity:0;
overflow-x: hidden !important; overflow-x: hidden !important;
overflow-y: scroll !important; overflow-y: scroll !important;
position: absolute; position: absolute;
z-index: 400; z-index: 1000;
width: 80%; width: 80%;
height: 70%; height: 70%;
max-height: 100%; max-height: 100%;
max-width: 100%; max-width: 100%;
word-wrap: break-word; word-wrap: break-word;
background-color: #d152b8; background-color: #d152b8;
color: white; color: white;
margin: 12% 20% 20% 10%; margin: 23% 20% 20% 10%;
transition: opacity 1s; transition: opacity 1s;
} }
#infotext p, #infotext_en p {
padding: 0% 10% 10% 10%;
margin: 0;
font-family: Arial;
font-weight: bold;
font-size: 2.0vw;
color: white;
}
#infotext a, #infotext_en a {
color: white;
}
#infobuttons { #infobuttons {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-between;
padding: 1vw;
} }
#closeButton { #closeButton {
@ -132,18 +158,56 @@ p {
} }
#closeButtonbottom { #closeButtonbottom {
position: relative;
font-family: Arial; font-family: Arial;
font-size:2vw; font-size: 2vw;
font-weight:bold; font-weight: bold;
text-align: center; text-align: center;
padding-bottom: 5vh; padding-bottom: 5vh;
margin: 0; margin: 0;
cursor: pointer; cursor: pointer;
} }
#infotext p, #infotext_en p { @media only screen and (max-width: 768px) {
padding: 0% 10% 10% 10%;
font-family: Arial; #infotext, #infotext_en {
font-weight: bold; visibility: hidden;
font-size: 2.0vw; overflow-x: hidden !important;
overflow-y: scroll !important;
position: absolute;
z-index: 400;
width: 90%;
height: 73%;
max-height: 100%;
max-width: 100%;
word-wrap: break-word;
background-color: #d152b8;
color: white;
margin: 28% 5% 0% 5%;
}
#closeButton, #enButton {
font-family: Arial;
font-size:4vw;
font-weight:bold;
padding:3%;
}
#closeButtonbottom {
font-size:4vw;
font-weight:bold;
}
#infotext p, #infotext_en p {
padding: 20px;
font-family: Arial;
font-weight: bold;
font-size: 4vw;
margin: 0;
}
#bottom_menu {
height: 5%;
font-size: 5vw;
}
} }

49
website/preshow/main.css
View File

@ -94,39 +94,38 @@ a {
} }
#infotext, #infotext_en { #infotext, #infotext_en {
visibility: hidden; visibility: hidden;
opacity:0; opacity:0;
overflow-x: hidden !important; overflow-x: hidden !important;
overflow-y: scroll !important; overflow-y: scroll !important;
position: absolute; position: absolute;
z-index: 400; z-index: 400;
width: 80%; width: 80%;
height: 70%; height: 70%;
max-height: 100%; max-height: 100%;
max-width: 100%; max-width: 100%;
word-wrap: break-word; word-wrap: break-word;
background-color: #d152b8; background-color: #d152b8;
color: white; color: white;
margin: 12% 20% 20% 10%; margin: 12% 20% 20% 10%;
transition: opacity 1s; transition: opacity 1s;
} }
#infobuttons { #infobuttons {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-between;
} }
#closeButton { #closeButton {
height: min-content; height: min-content;
width: min-content; width: min-content;
font-family: Arial; font-family: Arial;
font-size:2vw; font-size:2vw;
font-weight:bold; font-weight:bold;
padding:1%; padding:1%;
cursor: pointer; cursor: pointer;
margin: 0; margin: 0;
} }
#enButton { #enButton {

Write Preview
Loading…
Cancel
Save