XPUB
/
SI21
57
0
Fork 0
Code Issues 1 Pull Requests Releases Wiki Activity

azoth azoth azoth azoth azoth azoth azoth

Browse Source
master
Stephen Kerr 1 year ago
parent 7ebec52559
commit a3feef5dc6
8 changed files with 275 additions and 50 deletions
Show Stats Download Patch File Download Diff File

2
week5/app2.py
Unescape Escape View File

@ -9,7 +9,7 @@ from shutil import copyfile, move
from datetime import datetime from datetime import datetime
UPLOAD_FOLDER = os.path.join("static", "img") UPLOAD_FOLDER = os.path.join("static", "img")
ALLOWED_EXTENSIONS = {'txt', 'pdf', 'png', 'jpg', 'jpeg', 'gif', 'mp3', 'm4a', 'ogg', 'ogv', 'mp4', 'mkv'} ALLOWED_EXTENSIONS = {'txt', 'html', 'pdf', 'png', 'jpg', 'jpeg', 'gif', 'mp3', 'm4a', 'ogg', 'ogv', 'mp4', 'mkv'}
def allowed_file(filename): def allowed_file(filename):
return '.' in filename and \ return '.' in filename and \
filename.rsplit('.', 1)[1].lower() in ALLOWED_EXTENSIONS filename.rsplit('.', 1)[1].lower() in ALLOWED_EXTENSIONS

52
week5/static/img/00/20230629154356448039.html
Unescape Escape View File

@ -0,0 +1,52 @@
---------------------------------------------------------------------------------------------------
Hexalogue
(writings by) The Computercations People to Come
---------------------------------------------------------------------------------------------------
Introduction
---------------------------------------------------------------------------------------------------
This booklet is a trace, a memory, a script, a score, a single item, a collection. Six people coincided to discuss binaries, definitions, explanations, times, circlusions, pebbles. Aglaia Petta, Boyana Stoilova, Irmak Ertaş,
Jara Rocha, Martino Morandi, Stephen Kerr. Six steps: individual writing produced six texts, collective rewriting braided them back into eachother.
Six voices separated them once more, only to be rejoined in a single audio recording. Six speakers pull the wormball apart yet again, until this publication inevitably entangles.
But there is always the ghost, there are after all seven planets in total. Your gravity pulls from a distance that we cannot close, but you will take the seventh step: continue, complete, open, adapt, forget, remember. Do you remember? Will you remember for us?
Hexalogue was produced in June 2023 as part of TTY, special issue 21 of the experimental publishing masters at piet zwart institute, rotterdam. For more see issue.xpub.nl/21
䷥

61
week5/static/img/00/20240619161156212105.html
Unescape Escape View File

@ -0,0 +1,61 @@
<html>
<head>
<link rel="stylesheet" href="http://localhost:5000/static/style.css">
<link rel="stylesheet" href="http://localhost:5000/static/style-iframe.css">
</head>
<body>
---------------------------------------------------------------------------------------------------
Hexalogue
(writings by) The Computercations People to Come
---------------------------------------------------------------------------------------------------
Introduction
---------------------------------------------------------------------------------------------------
This booklet is a trace, a memory, a script, a score, a single item, a collection. Six people coincided to discuss binaries, definitions, explanations, times, circlusions, pebbles. Aglaia Petta, Boyana Stoilova, Irmak Ertaş,
Jara Rocha, Martino Morandi, Stephen Kerr. Six steps: individual writing produced six texts, collective rewriting braided them back into eachother.
Six voices separated them once more, only to be rejoined in a single audio recording. Six speakers pull the wormball apart yet again, until this publication inevitably entangles.
But there is always the ghost, there are after all seven planets in total. Your gravity pulls from a distance that we cannot close, but you will take the seventh step: continue, complete, open, adapt, forget, remember. Do you remember? Will you remember for us?
Hexalogue was produced in June 2023 as part of TTY, special issue 21 of the experimental publishing masters at piet zwart institute, rotterdam. For more see issue.xpub.nl/21
䷥
</body>
</html>

8
week5/static/style-iframe.css
Unescape Escape View File

@ -0,0 +1,8 @@
:root{
--color2: #ffc;
--color1: #103;
}
body{
overflow: hidden;
font-size: 0.6em;
}

72
week5/static/style.css
Unescape Escape View File

@ -0,0 +1,72 @@
:root{
--color1: #ffc;
--color2: #103;
}
@font-face {
font-family: "TeleType";
src: url("./static/css/teletype.ttf");
}
body{
clear: both;
margin: 2rem;
font-family: "TeleType", 'Courier New', Courier, monospace;
line-height: 1.3;
text-transform: uppercase;
color: var(--color1);
background-color: var(--color2);
}
a{
color: var(--color1);
text-decoration: none;
}
a:hover{opacity: 0.7;}
.abraxas{
text-align: center;
}
h1,h2,h3,h4,h5,h6,p{
margin: 0 0 1rem;;
font-size: 1rem;
font-weight: normal;
}
img,video,.divaudio,audio, .abraxas,iframe{
display:inline-block;
width: calc( 100% / 7 );
margin: 0;
padding: 0;
object-fit: cover;
height: calc( 100% / 6) ;
overflow: hidden;
border: none;
}
.intro{
padding-right: 2rem;
margin: 1rem 0;
width: 100%;
flex: 1;
}
.intro-outer{
width: 100%;
display: flex;
gap: 1rem;
}
a{position:relative;
z-index:2;}
video,audio{position:relative; z-index:1;}
audio{height:auto;position:absolute;}
img:hover{
filter: invert(1);
}
::selection{
color: var(--color2);
background-color: var(--color1);
}
@media screen and (min-width: 768px){
p{font-size: 1rem;}
body{font-size: 1.5rem;}
}
@media screen and (max-width: 767px){
.intro-outer{flex-direction: column;}
body{font-size: 3rem;}
}

BIN
week5/static/teletype.ttf
View File

Binary file not shown.

82
week5/templates/mosaic2.html
Unescape Escape View File

@ -1,27 +1,26 @@
<html> <html>
<head> <head>
<style> <meta name="viewport" content="width=device-width, initial-scale=1">
body{ <title>OVERLAP</title>
clear: both; <meta name="description" content="WE HAVE A BAG FULL OF PLANETS, STARS, OUR FAVORITE MOMENTS, DARKEST FEARS, BEST INTENTIONS AND WORST FEELINGS.">
margin: 0; <link rel="stylesheet" href="./static/style.css">
} <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
img,video,.divaudio,audio{
display:inline-block;
width: calc( 100% / 7 );
margin: 0;
padding: 0;
object-fit: cover;
height: calc( 100% / 6) ;
}
a{position:relative z-index:2;}
video,audio{position:relative; z-index:1;}
audio{height:auto;position:absolute;}
img:hover{
filter: invert(1);
}
</style>
</head> </head>
<body> <body>
<div class="intro-outer">
<div class="intro">
<h1>Overlap</h1>
</div>
<div class="intro">
<p>
We have a bag full of planets, stars, our favorite moments, darkest fears, best intentions and worst feelings. We contain them and sometimes they overlap each other. Sometimes we are happy and sad; sometimes we forget why we were even mad in the beginning. But we also share some of these moments or galaxies that reside in our bags with other souls. We remember the same moment through a different window. We remember that day as cold, whereas they remember it as warm. One by one, these moments create one snapshot of the reality. The reality we create collectively. We sometimes trust our memories and our memories always trust us.
</p>
<p>
We overlap, we crawl through memory lane. We go silently through the gates of space and time, we exchange our sights with each other and for one spectacular moment, all the stars in our bags spill and we get to see through each others eyes. Our bag is now in the middle, its ready for you to discover and see the networks of our minds, make knots in the middle or intervene with what we call a collective memory of a few xpubbers.
</p>
</div>
</div>
<div class="theatre">
{% for file in range (0,42) -%} {% for file in range (0,42) -%}
{%- set filez = '%02d' % file -%} {%- set filez = '%02d' % file -%}
{%- set filename = lastfiles[file] -%} {%- set filename = lastfiles[file] -%}
@ -41,16 +40,41 @@
<source src="{{ filename }}"> <source src="{{ filename }}">
</video> </video>
{%- endif -%} {%- endif -%}
{%- if 'html' in filename -%}
<iframe src="{{ filename }}" ></iframe>
{%- endif -%}
</a> </a>
{%- endfor %} {%- endfor %}
<!-- <div class="abraxas"><h4>a</h4></div><div class="abraxas"><h4>b</h4></div><div class="abraxas"><h4>r</h4></div><div class="abraxas"><h4>a</h4></div><div class="abraxas"><h4>x</h4></div><div class="abraxas"><h4>a</h4></div><div class="abraxas"><h4>s</h4></div>
<form action="{{ url_for('upload_file') }}" method="POST" enctype="multipart/form-data"> </div>
<label for="tile">Choose an image to upload:</label> <div class="intro-outer">
<input type="file" <div class="intro">
id="tile" name="tile" required> <h1>* *<br>*</h1>
<label for="overwrite"> and a position for it to go (number from 00 to 41):</label> </div>
<input type="text" name="overwrite" required> <div class="intro">
<input type="submit" value="Upload"> <p>
</form> --> Overlap was produced in June 2023 as part of TTY, special issue 21 of the experimental publishing masters at piet zwart institute, rotterdam. For more see <a href="https://issue.xpub.nl/21" target="_blank">issue.xpub.nl/21</a>
</p>
</div>
</div>
</body> </body>
<script >
$(document).ready(function() {
$("iframe").each(function() {
var iframe = $(this);
var pos = iframe.position();
var div = document.createElement("div");
var s = div.style;
s.position = "absolute";
s.left = pos.left + "px";
s.top = pos.top + "px";
s.height = iframe.height() + "px";
s.width = iframe.width() + "px";
iframe.parent().append(div);
$(div).data("src", iframe.attr("src")).click(function() {
window.location = $(this).data("src");
});
});
});
</script>
</html> </html>

10
week5/templates/zoomreplace2.html
Unescape Escape View File

@ -1,5 +1,10 @@
<html> <html>
<head> <head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>OVERLAP</title>
<meta name="description" content="WE HAVE A BAG FULL OF PLANETS, STARS, OUR FAVORITE MOMENTS, DARKEST FEARS, BEST INTENTIONS AND WORST FEELINGS.">
<link rel="stylesheet" href="http://localhost:5000/static/style.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<style> <style>
img,video,audio{ img,video,audio{
width:25%; width:25%;
@ -17,9 +22,12 @@
{% if 'mp4' in file or 'mkv' in file or 'ogv' in file %} {% if 'mp4' in file or 'mkv' in file or 'ogv' in file %}
<video src="{{ file|replace('./', '/breadcube/overlap/') }}" controls></video> <video src="{{ file|replace('./', '/breadcube/overlap/') }}" controls></video>
{% endif %} {% endif %}
{%- if 'html' in filename -%}
<iframe src="{{ file|replace('./', '/breadcube/overlap/') }}" ></iframe>
{%- endif -%}
{% endfor %} {% endfor %}
<form action="{{ url_for('upload2_file', image=image) }}" method="POST" enctype="multipart/form-data"> <form action="{{ url_for('upload2_file', image=image) }}" method="POST" enctype="multipart/form-data">
<label for="tile">Choose an image to upload:</label> <label for="tile">Choose a file to upload:</label>
<input type="file" <input type="file"
id="tile" name="tile" required> id="tile" name="tile" required>
<input type="submit" value="Upload"> <input type="submit" value="Upload">

Write Preview
Loading…
Cancel
Save