azoth azoth azoth azoth azoth azoth azoth
parent
7ebec52559
commit
a3feef5dc6
@ -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
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
䷥
|
@ -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>
|
@ -0,0 +1,8 @@
|
|||||||
|
:root{
|
||||||
|
--color2: #ffc;
|
||||||
|
--color1: #103;
|
||||||
|
}
|
||||||
|
body{
|
||||||
|
overflow: hidden;
|
||||||
|
font-size: 0.6em;
|
||||||
|
}
|
@ -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;}
|
||||||
|
}
|
Binary file not shown.
@ -1,56 +1,80 @@
|
|||||||
<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>
|
||||||
{% for file in range (0,42) -%}
|
<div class="intro-outer">
|
||||||
{%- set filez = '%02d' % file -%}
|
<div class="intro">
|
||||||
{%- set filename = lastfiles[file] -%}
|
<h1>Overlap</h1>
|
||||||
<a href="{{ url_for('zoomedimage', imgpath=filez|replace('static/img/', '')) }}">
|
</div>
|
||||||
{%- if 'png' in filename or 'jpg' in filename or 'jpeg' in filename or 'gif' in filename -%}
|
<div class="intro">
|
||||||
<img src="{{ filename }}">
|
<p>
|
||||||
{%- endif -%}
|
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.
|
||||||
{%- if 'mp3' in filename or 'm4a' in filename or 'ogg' in filename -%}
|
</p>
|
||||||
<div class="divaudio">
|
<p>
|
||||||
<audio controls>
|
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) -%}
|
||||||
|
{%- set filez = '%02d' % file -%}
|
||||||
|
{%- set filename = lastfiles[file] -%}
|
||||||
|
<a href="{{ url_for('zoomedimage', imgpath=filez|replace('static/img/', '')) }}">
|
||||||
|
{%- if 'png' in filename or 'jpg' in filename or 'jpeg' in filename or 'gif' in filename -%}
|
||||||
|
<img src="{{ filename }}">
|
||||||
|
{%- endif -%}
|
||||||
|
{%- if 'mp3' in filename or 'm4a' in filename or 'ogg' in filename -%}
|
||||||
|
<div class="divaudio">
|
||||||
|
<audio controls>
|
||||||
|
<source src="{{ filename }}">
|
||||||
|
</audio>
|
||||||
|
</div>
|
||||||
|
{%- endif -%}
|
||||||
|
{%- if 'mp4' in filename or 'mkv' in filename or 'ogv' in filename -%}
|
||||||
|
<video autoplay loop muted>
|
||||||
<source src="{{ filename }}">
|
<source src="{{ filename }}">
|
||||||
</audio>
|
</video>
|
||||||
|
{%- endif -%}
|
||||||
|
{%- if 'html' in filename -%}
|
||||||
|
<iframe src="{{ filename }}" ></iframe>
|
||||||
|
{%- endif -%}
|
||||||
|
</a>
|
||||||
|
{%- 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>
|
||||||
|
</div>
|
||||||
|
<div class="intro-outer">
|
||||||
|
<div class="intro">
|
||||||
|
<h1>* *<br>*</h1>
|
||||||
|
</div>
|
||||||
|
<div class="intro">
|
||||||
|
<p>
|
||||||
|
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>
|
||||||
{%- endif -%}
|
</div>
|
||||||
{%- if 'mp4' in filename or 'mkv' in filename or 'ogv' in filename -%}
|
|
||||||
<video autoplay loop muted>
|
|
||||||
<source src="{{ filename }}">
|
|
||||||
</video>
|
|
||||||
{%- endif -%}
|
|
||||||
</a>
|
|
||||||
{%- endfor %}
|
|
||||||
<!--
|
|
||||||
<form action="{{ url_for('upload_file') }}" method="POST" enctype="multipart/form-data">
|
|
||||||
<label for="tile">Choose an image to upload:</label>
|
|
||||||
<input type="file"
|
|
||||||
id="tile" name="tile" required>
|
|
||||||
<label for="overwrite"> and a position for it to go (number from 00 to 41):</label>
|
|
||||||
<input type="text" name="overwrite" required>
|
|
||||||
<input type="submit" value="Upload">
|
|
||||||
</form> -->
|
|
||||||
</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>
|
||||||
|
Loading…
Reference in New Issue