briki quick quack quack

gesture/.env

@@ -0,0 +1,2 @@
+GESTURE_APPLICATION_ROOT=/breadcube/gesture
+GESTURE_PORTNUMBER=5002

gesture/Makefile

@@ -0,0 +1,10 @@
+include .env
+export
+
+default: local
+
+local:
+	@flask run --debug
+
+breadcube: 
+	@SCRIPT_NAME=${GESTURE_APPLICATION_ROOT} gunicorn -b localhost:${GESTURE_PORTNUMBER} --reload app:app

gesture/app.py

@@ -0,0 +1,74 @@
+from flask import Flask, request, redirect, render_template
+import os
+
+app = Flask(__name__)
+app.config.from_pyfile('settings.py')
+
+UPLOAD_FOLDER = os.path.join("static", "media")
+media = {
+    "beer.gif": ["beer"],
+    "bell.gif": ["beer", "cafe de bel", "bell"],
+    "birds.gif": ["birds", "lasercut", "book making"],
+    "book-end.gif": ["book", "finished book"],
+    "book-reading.gif": ["book", "reading", "unfinished book"],
+    "box.gif": ["box"],
+    "bridge.gif": ["bridge", "book making"],
+    "cafe-de-bel.gif": ["coffee", "bell", "beer", "cafe de bel"],
+    "cards.gif": ["cards"],
+    "cloud-storm.gif": ["cloud", "storm"],
+    "cloud.gif": ["cloud"],
+    "coffee.gif": ["coffee", "cafe de bel"],
+    "coffee-reading.gif": ["coffee reading", "reading", "coffee"],
+    "collective.gif": ["collective", "studio", "xpub", "community", "bubble"],
+    "elevator.gif": ["elevator", "collective", "xpub"],
+    "er-beer.gif": ["emergency beer"],
+    "femcare.gif": ["care", "feminism", "woman", "collective", "community"],
+    "gilotine.gif": ["gilotine", "book making", "book"],
+    "glue-machine.gif": ["book making", "glue binding machine", "machine", "book binding", "book"],
+    "gyozleme.gif": ["gozleme", "food", "xpub"],
+    "hands.gif": ["joking", "okay", "sure"],
+    "hurry.gif": ["time", "hurry", "pebbles"],
+    "iloveu.gif": ["i love you", "i see you", "i feel you", "i miss you"],
+    "invisible.gif": ["invisible", "worker", "operator"],
+    "lasercut.gif": ["lasercutter", "book making", "book"],
+    "oper-strike.gif": ["operator", "worker", "woman", "strike"],
+    "operator.gif": ["operator", "worker", "woman"],
+    "paper.gif": ["paper", "book", "reading", "printer"],
+    "pdf-impose.gif": ["pdf impose", "makarena"],
+    "pebbles.gif": ["time", "clockwise"],
+    "printer.gif": ["printer", "book", "paper", "book making"],
+    "reverse-pebbles.gif": ["time", "anticlockwise"],
+    "sea.gif": ["sea", "printer"],
+    "stairs.gif": ["stairs", "studio"],
+    "strike.gif": ["strike", "worker", "woman", "operator"],
+    "studio.gif": ["studio", "xpub", "community", "collective"],
+    "teletype.gif": ["teletype", "printer", "book", "xpub", "operator", "collective", "worker", "paper", "cloud"],
+    "visible.gif": ["visible", "i see you", "worker", "strike", "operator", "woman"],
+    "whosfirst.gif": ["who is first", "collective", "xpub", "community"],
+    "whosnext.gif": ["who is next", "collective", "xpub", "community", "time"]
+
+}
+
+@app.route("/")
+def home():
+    text = []
+    for x in media:
+        for y in media[x]:
+            print(y)
+            if y not in text:
+                text.append(y)
+                # print("added")
+                # print(text)
+            else:
+                print("already there")
+    return render_template("template-index.html", text=text)
+
+@app.route("/<word>")
+def word(word):
+    wordmedia = []
+    for item in media:
+        if word in media[item]:
+            wordmedia.append(item)
+    print("wordmedia: ")
+    print(wordmedia)
+    return render_template("template-word.html", word=word, wordmedia=wordmedia, media=media, path=UPLOAD_FOLDER)

gesture/settings.py

@@ -0,0 +1,10 @@
+import os
+from dotenv import main
+
+# Load environment variables from the .env file
+main.load_dotenv()
+
+# Bind them to Python variables
+APPLICATION_ROOT = os.environ.get('GESTURE_APPLICATION_ROOT', '/')
+PORTNUMBER = int(os.environ.get('GESTURE_PORTNUMBER', 5001))
+

gesture/static/style.css

@@ -0,0 +1,75 @@
+:root{
+    --color1: #418;
+    --color2: #ff0;
+}
+
+a{text-decoration: none;}
+
+body{
+    font-family: monospace;
+    background-color: var(--color1);
+    color: var(--color2);
+    margin: 2rem auto;
+    max-width: 60rem;
+    padding: 1rem;
+}
+.button{
+    font-family: monospace;
+    padding: 0.5em 1em;
+    border-radius: 2em;
+    background: var(--color2);
+    color: var(--color1);
+    border: none;
+    margin: 0 0.25rem 0.25rem 0;
+}
+button:after{
+    content: " →";
+    break-before: avoid;
+}
+h1.button{font-size: 1.4rem;}
+.button:hover{opacity: 0.7; cursor: pointer;}
+.close{float: right; text-decoration: none;}
+.close:hover{opacity: 0.7}
+img{width: 100%; margin-bottom: 1rem;}
+input{
+    margin: 0 0 0.5rem;
+}
+input[type="submit"]{
+    background-color: var(--color2);
+    color:var(--color1);
+    font-size: 1.5rem;
+    padding: 0.5rem;
+    font-family: monospace;
+    font-weight: 600;
+    width: 100%;
+}
+#floating-form{
+    position: fixed;
+    z-index: 2;
+    background-color: var(--color2);
+    color:var(--color1);
+    width: 20rem;
+    padding: 2rem;
+    display: none;
+}
+
+h4{margin: 0;}
+textarea{
+    width: 100%;
+    min-height: 20rem;
+    margin: 0 0 0.5rem;
+}
+
+.two-col{
+    float: left;
+    padding-right: 2rem;
+    margin: 1rem 0;
+}
+@media screen and (min-width: 768px){
+    .two-col{max-width: calc(50% - 4rem);}
+    p{font-size: 1rem;}
+    body{font-size: 1.5rem;}
+
+@media screen and (max-width: 767px){
+    body{font-size: 3rem;}
+}

gesture/templates/template-index.html

@@ -0,0 +1,18 @@
+<html>
+    <head>
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+        <link rel="stylesheet" href="./static/style.css" />
+    </head>
+    <body>
+        <h1>gesture glossary ✌️</h1>
+        <div class="two-col">
+            <h4>This is the gesture glossary. Click a word to see the gestures related to it. </h4>
+            <p>The aim is to see if a gesture glossary works and how it will work best. Also to see what kind of different interpretations there will be on gestures of our memory. To test the gesture glossary idea, and see what different meanings appear or already exist in the current vocabulary. Putting next to each other different agreements on linguistic and body units, testing what makes sense. Investigating and playing with communicational channels in between us, how a body language is documented, how it expands, how it is capable of creating or enhancing identities. To be an xpub means to speak/perform the xpub language?</p>
+        </div>
+        <div class="two-col">
+            {% for word in text 
+                %}<a href="{{word}}"><button class="button">{{word}}</button></a>{%         
+            endfor %}
+        </div>
+    </body>
+</html>

gesture/templates/template-word.html

@@ -0,0 +1,19 @@
+<html>
+    <head>
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+        <link rel="stylesheet" href="./static/style.css" />
+    </head>
+    <body>
+        <a href="/breadcube/gesture/" ><h1 class="button">{{word}} <span class="close">x</span></h1></a>
+        {% for file in wordmedia %}
+        <div class="two-col">
+            <!-- <h2>Video {{file}}</h2> -->
+            <!-- This file path might need to change -->
+            <img src="{{path}}/{{file}}" />
+            {% for tag in media[file] 
+                %}<a href="{{tag}}"><button id="{{ loop.index - 1 }}" class="button">{{tag}}</button></a>{%         
+            endfor %}
+        </div>
+        {% endfor %}
+    </body>
+</html>