houseofada postcard generator, html for print

main
Michael Murtaugh 1 year ago
parent c1eb1e6bec
commit f2951e76cc

@ -0,0 +1,904 @@
{
"items": [
{
"words": [
"dreamy",
"companion planting",
"pdfs",
"butter"
],
"hue": 208
},
{
"words": [
"smart",
"fertilizing",
"pdfs",
"custard"
],
"hue": 172
},
{
"words": [
"serious",
"grafting",
"stories",
"jam"
],
"hue": 159
},
{
"words": [
"focused",
"crop rotating",
"index cards",
"jam"
],
"hue": 154
},
{
"words": [
"caring",
"weeding",
"html scripts",
"cookie dough"
],
"hue": 71
},
{
"words": [
"sad",
"tilling",
"books",
"peanut butter"
],
"hue": 198
},
{
"words": [
"serious",
"fertilizing",
"etherpads",
"mozzarella"
],
"hue": 217
},
{
"words": [
"big",
"gleaning",
"hero libraries",
"mozzarella"
],
"hue": 163
},
{
"words": [
"angry",
"tilling",
"carrier bag libraries",
"camambert"
],
"hue": 113
},
{
"words": [
"sad",
"broadcasting",
"hero libraries",
"maple syrup"
],
"hue": 181
},
{
"words": [
"embarassed",
"crop rotating",
"bootleg libraries",
"honey"
],
"hue": 70
},
{
"words": [
"stressed",
"tilling",
"booklets",
"marzipan"
],
"hue": 238
},
{
"words": [
"embarassed",
"fallowing",
"pdfs",
"sour grapes"
],
"hue": 181
},
{
"words": [
"hungry",
"composting",
"texts",
"mozzarella"
],
"hue": 72
},
{
"words": [
"big",
"fertilizing",
"books",
"chocolate"
],
"hue": 93
},
{
"words": [
"angry",
"companion planting",
"texts",
"chocolate"
],
"hue": 120
},
{
"words": [
"big",
"crop rotating",
"texts",
"candy"
],
"hue": 149
},
{
"words": [
"hungry",
"gleaning",
"hero libraries",
"mozzarella"
],
"hue": 33
},
{
"words": [
"na\u00efve",
"companion planting",
"etherpads",
"custard"
],
"hue": 255
},
{
"words": [
"dreamy",
"tilling",
"index cards",
"maple syrup"
],
"hue": 43
},
{
"words": [
"caring",
"fallowing",
"e-books",
"cookie dough"
],
"hue": 124
},
{
"words": [
"smart",
"pruning",
"bootleg libraries",
"honey"
],
"hue": 60
},
{
"words": [
"moody",
"fallowing",
"stories",
"sour grapes"
],
"hue": 190
},
{
"words": [
"serious",
"fertilizing",
"e-books",
"mozzarella"
],
"hue": 82
},
{
"words": [
"fantastic",
"grafting",
"poems",
"mozzarella"
],
"hue": 237
},
{
"words": [
"caring",
"weeding",
"e-books",
"mozzarella"
],
"hue": 140
},
{
"words": [
"big",
"composting",
"index cards",
"marzipan"
],
"hue": 25
},
{
"words": [
"frustrated",
"companion planting",
"poems",
"gingerbread"
],
"hue": 132
},
{
"words": [
"serious",
"crop rotating",
"stories",
"sour grapes"
],
"hue": 216
},
{
"words": [
"na\u00efve",
"fertilizing",
"bootleg libraries",
"sour grapes"
],
"hue": 145
},
{
"words": [
"dreamy",
"companion planting",
"html scripts",
"sour grapes"
],
"hue": 146
},
{
"words": [
"silly",
"swatching",
"hero libraries",
"jam"
],
"hue": 120
},
{
"words": [
"embarassed",
"pruning",
"html scripts",
"honey"
],
"hue": 147
},
{
"words": [
"focused",
"grafting",
"etherpads",
"cookie dough"
],
"hue": 142
},
{
"words": [
"silly",
"composting",
"poems",
"gingerbread"
],
"hue": 210
},
{
"words": [
"smart",
"weeding",
"bootleg libraries",
"parmesan cheese"
],
"hue": 191
},
{
"words": [
"caring",
"companion planting",
"e-books",
"sour grapes"
],
"hue": 41
},
{
"words": [
"sad",
"composting",
"booklets",
"maple syrup"
],
"hue": 71
},
{
"words": [
"hungry",
"fertilizing",
"etherpads",
"gingerbread"
],
"hue": 96
},
{
"words": [
"na\u00efve",
"weeding",
"booklets",
"custard"
],
"hue": 133
},
{
"words": [
"focused",
"swatching",
"books",
"custard"
],
"hue": 196
},
{
"words": [
"caring",
"fallowing",
"pdfs",
"camambert"
],
"hue": 73
},
{
"words": [
"focused",
"fermenting",
"etherpads",
"parmesan cheese"
],
"hue": 127
},
{
"words": [
"frustrated",
"fermenting",
"e-books",
"gingerbread"
],
"hue": 140
},
{
"words": [
"stressed",
"companion planting",
"html scripts",
"mozzarella"
],
"hue": 0
},
{
"words": [
"focused",
"companion planting",
"index cards",
"jam"
],
"hue": 124
},
{
"words": [
"embarassed",
"fertilizing",
"carrier bag libraries",
"tomato sauce"
],
"hue": 50
},
{
"words": [
"caring",
"weeding",
"html scripts",
"parmesan cheese"
],
"hue": 252
},
{
"words": [
"frustrated",
"weeding",
"bootleg libraries",
"chocolate"
],
"hue": 181
},
{
"words": [
"hungry",
"gleaning",
"e-books",
"sour grapes"
],
"hue": 189
},
{
"words": [
"hungry",
"tilling",
"hero libraries",
"candy"
],
"hue": 183
},
{
"words": [
"smart",
"swatching",
"poems",
"peanut butter"
],
"hue": 99
},
{
"words": [
"angry",
"composting",
"bootleg libraries",
"gingerbread"
],
"hue": 62
},
{
"words": [
"focused",
"composting",
"e-books",
"cookie dough"
],
"hue": 84
},
{
"words": [
"angry",
"gleaning",
"books",
"peanut butter"
],
"hue": 153
},
{
"words": [
"sad",
"composting",
"carrier bag libraries",
"cookie dough"
],
"hue": 195
},
{
"words": [
"fantastic",
"fermenting",
"poems",
"honey"
],
"hue": 85
},
{
"words": [
"frustrated",
"companion planting",
"booklets",
"gingerbread"
],
"hue": 185
},
{
"words": [
"stressed",
"weeding",
"html scripts",
"tomato sauce"
],
"hue": 132
},
{
"words": [
"stressed",
"pruning",
"bootleg libraries",
"marzipan"
],
"hue": 141
},
{
"words": [
"smart",
"weeding",
"texts",
"chocolate"
],
"hue": 56
},
{
"words": [
"big",
"gleaning",
"texts",
"jam"
],
"hue": 225
},
{
"words": [
"silly",
"fallowing",
"html scripts",
"honey"
],
"hue": 2
},
{
"words": [
"big",
"composting",
"pdfs",
"parmesan cheese"
],
"hue": 242
},
{
"words": [
"dreamy",
"companion planting",
"hero libraries",
"sour grapes"
],
"hue": 182
},
{
"words": [
"big",
"composting",
"pdfs",
"candy"
],
"hue": 209
},
{
"words": [
"angry",
"crop rotating",
"bootleg libraries",
"camambert"
],
"hue": 144
},
{
"words": [
"smart",
"swatching",
"index cards",
"butter"
],
"hue": 116
},
{
"words": [
"caring",
"fermenting",
"e-books",
"mozzarella"
],
"hue": 112
},
{
"words": [
"focused",
"fertilizing",
"bootleg libraries",
"jam"
],
"hue": 26
},
{
"words": [
"big",
"fermenting",
"pdfs",
"tomato sauce"
],
"hue": 175
},
{
"words": [
"silly",
"crop rotating",
"texts",
"chocolate"
],
"hue": 150
},
{
"words": [
"angry",
"composting",
"etherpads",
"butter"
],
"hue": 137
},
{
"words": [
"dreamy",
"fallowing",
"poems",
"mozzarella"
],
"hue": 179
},
{
"words": [
"big",
"tilling",
"stories",
"cookie dough"
],
"hue": 181
},
{
"words": [
"big",
"companion planting",
"html scripts",
"maple syrup"
],
"hue": 44
},
{
"words": [
"na\u00efve",
"fallowing",
"carrier bag libraries",
"sour grapes"
],
"hue": 136
},
{
"words": [
"smart",
"grafting",
"texts",
"candy"
],
"hue": 172
},
{
"words": [
"silly",
"grafting",
"python scripts",
"gingerbread"
],
"hue": 36
},
{
"words": [
"smart",
"weeding",
"python scripts",
"tomato sauce"
],
"hue": 99
},
{
"words": [
"frustrated",
"gleaning",
"pdfs",
"peanut butter"
],
"hue": 100
},
{
"words": [
"focused",
"gleaning",
"carrier bag libraries",
"candy"
],
"hue": 86
},
{
"words": [
"angry",
"pruning",
"booklets",
"gingerbread"
],
"hue": 51
},
{
"words": [
"caring",
"broadcasting",
"bootleg libraries",
"honey"
],
"hue": 27
},
{
"words": [
"angry",
"fermenting",
"bootleg libraries",
"candy"
],
"hue": 145
},
{
"words": [
"moody",
"fallowing",
"books",
"chocolate"
],
"hue": 81
},
{
"words": [
"frustrated",
"swatching",
"etherpads",
"sour grapes"
],
"hue": 55
},
{
"words": [
"stressed",
"broadcasting",
"html scripts",
"candy"
],
"hue": 169
},
{
"words": [
"serious",
"companion planting",
"poems",
"sour grapes"
],
"hue": 215
},
{
"words": [
"na\u00efve",
"swatching",
"poems",
"chocolate"
],
"hue": 243
},
{
"words": [
"focused",
"crop rotating",
"booklets",
"maple syrup"
],
"hue": 146
},
{
"words": [
"caring",
"pruning",
"hero libraries",
"peanut butter"
],
"hue": 13
},
{
"words": [
"hungry",
"composting",
"python scripts",
"gingerbread"
],
"hue": 95
},
{
"words": [
"angry",
"fermenting",
"hero libraries",
"chocolate"
],
"hue": 168
},
{
"words": [
"focused",
"fertilizing",
"index cards",
"parmesan cheese"
],
"hue": 186
},
{
"words": [
"dreamy",
"tilling",
"booklets",
"camambert"
],
"hue": 43
},
{
"words": [
"caring",
"pruning",
"hero libraries",
"honey"
],
"hue": 150
},
{
"words": [
"frustrated",
"companion planting",
"html scripts",
"butter"
],
"hue": 224
},
{
"words": [
"fantastic",
"swatching",
"e-books",
"maple syrup"
],
"hue": 7
},
{
"words": [
"moody",
"composting",
"poems",
"marzipan"
],
"hue": 200
}
]
}

@ -0,0 +1,28 @@
from itertools import product
# colors = ("red", "blue", "green")
# clothes = ("shirt", "pants")
# typ = ("analog", "digital")
# print (len(list(product(colors, clothes, typ))))
import sys
from random import shuffle, randint, seed
import json
seed("house of ada, seeded 5 april 2023")
actors = ['silly', 'serious', 'naïve', 'smart', 'focused', 'dreamy','hungry','sad', 'embarassed', 'fantastic', 'stressed', 'caring','moody', 'angry', 'frustrated','big'];
action = ['pruning', 'swatching', 'grafting', 'composting', 'gleaning','fermenting','tilling','fertilizing','crop rotating','fallowing', 'weeding','companion planting','broadcasting' ];
objects = ['booklets', 'index cards', 'etherpads','books','e-books', 'html scripts', 'texts', 'python scripts', 'poems', 'stories', 'pdfs', 'carrier bag libraries', 'bootleg libraries', 'hero libraries'];
material = ['chocolate', 'marzipan', 'peanut butter', 'mozzarella', 'jam', 'butter', 'gingerbread','tomato sauce', 'candy', 'custard', 'cookie dough', 'honey', 'parmesan cheese','camambert', 'sour grapes', 'maple syrup'];
count = 100
all_possibilities = list(product(actors, action, objects, material))
print (f"wow there are {len(all_possibilities)} possible combinations, outputting a random set of {count}", file=sys.stderr)
shuffle(all_possibilities)
items = []
for combo in all_possibilities[:count]:
items.append({'words': combo, 'hue': randint(0, 255)})
print (json.dumps({'items': items}, indent=2))

@ -0,0 +1,321 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="" xml:lang="">
<head>
<meta charset="utf-8" />
<meta name="generator" content="pandoc" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
<title>XPUB</title>
<style>
:root {
--bg-color: black; /* #545454 */
--fg-color: hsl(212, 100%, 50%); /* #3584e4 */
}
@page {
size: a4 landscape;
margin: 0;
background-color: var(--bg-color);
}
body {
font-size: 18px;
background: bar(--bg-color);
margin: 0;
padding: 0;
}
/* .actors span { color: hsl(0, 80%, 0%); }
.objects span { color: hsl(90, 80%, 0%); }
.actions span { color: hsl(180, 80%, 0%); }
.materials span { color: hsl(270, 80%, 0%); }
*/
.page {
text-align: center;
break-after: page;
height: 100vh;
width: 100vw;
}
.page.front {
background: var(--bg-color);
}
span {
background: var(--fg-color);
color: white;
/* white-space: nowrap;*/
}
#card .center {
margin-left: auto;
margin-right: auto;
}
.active {
background: white;
color: var(--fg-color) !important;
}
table {
width: 100%;
height: 100%;
border: 0;
}
/* A4 210 x 297 mm */
@media print {
.page {
width: 297mm;
height: 210mm;
}
}
td {
padding: 2em;
}
.front td > span > span {
white-space: nowrap;
}
.page.reverse {
text-align: left;
padding-left: 1em;
padding-right: 1em;
padding-top: 1em;
box-sizing: border-box;
}
.page.reverse p {
font-size: 8px;
}
.page.reverse td {
vertical-align: top;
padding: 0.25em;
}
img.stamp {
max-width: 50%;
}
.page.reverse hr {
margin-top: 1.25em;
margin-bottom: 1.25em;
}
</style>
</head>
<body>
<div class="page front">
<table border="0">
<tr>
<td valign="center">
<span class="actors">
<span>silly</span>
<span>serious</span>
<span>naïve</span>
<span>smart</span>
<span>focused</span>
<span>dreamy</span>
<span>hungry</span>
<span>sad</span>
<span class="active">embarassed</span>
<span>fantastic</span>
<span>stressed</span>
<span>caring</span>
<span>moody</span>
<span>angry</span>
<span>frustrated</span>
<span>big</span>
</span>
<span>
<span class="active">little gardners are</span>
</span>
<span class="actions">
<span>pruning</span>
<span>swatching</span>
<span>grafting</span>
<span>composting</span>
<span>gleaning</span>
<span class="active">fermenting</span>
<span>tilling</span>
<span>fertilizing</span>
<span>crop rotating</span>
<span>fallowing</span>
<span>weeding</span>
<span>companion planting</span>
<span>broadcasting</span>
</span>
<span class="objects">
<span>booklets</span>
<span>index cards</span>
<span>etherpads</span>
<span class="active">books</span>
<span>e-books</span>
<span>html scripts</span>
<span>texts</span>
<span>python scripts</span>
<span>poems</span>
<span>stories</span>
<span>pdfs</span>
<span>carrier bag libraries</span>
<span>bootleg libraries</span>
<span>hero libraries</span>
</span>
<span>
<span class="active">made out of</span>
</span>
<span class="materials">
<span>chocolate</span>
<span>marzipan</span>
<span>peanut butter</span>
<span>mozzarella</span>
<span>jam</span>
<span>butter</span>
<span class="active">gingerbread</span>
<span>tomato sauce</span>
<span>candy</span>
<span>custard</span>
<span>cookie dough</span>
<span>honey</span>
<span>parmesan cheese</span>
<span>camembert</span>
<span>sour grapes</span>
<span>maple syrup</span>
</span>
</td>
</tr>
</table>
</div>
<div class="page reverse">
<table border="0">
<tr>
<td valign="top" height="50%">
<table>
<tr>
<td width="25%">
<p>XPUB is a two-year Master course that prepares students to critically engage with societal issues within the fast chaging field of art, design and cultural production.
</p>
<p>https://xpub.nl</p>
</td>
<td width="25%">
<p>XPUB'S interests in publishing are twofold:</p>
<p>First, publishing as the inquiry and participation into the technological frameworks, political context and cultural processes through which things are made public;
</p>
</td>
<td width="25%" style="border-left: 0.5px solid black">
<p>and second, publishing as the desire to expand the means of discourse circulation beyond print media and its direct digital translation, so as to create publics in the age of post-digital networks.</p>
</td>
<td width="25%" align="right">
<img src="xpub_qr.png" class="stamp">
</td>
</tr>
<tr>
<td colspan="2">&nbsp;</td>
<td colspan="2" style="">
<hr>
<hr>
<hr>
<hr>
<p style="text-align: center">Return address: XPUB studio<br>
Wijnhaven 61 (4th floor)<br>
3011 WJ Rotterdam
</p>
</td>
</tr>
<tr>
<td colspan="4">
<p>
XPUB welcomes practitioners to approach publishing from the perspective of multi-, inter- and transdiciplinary practices.
</p>
<p style="font-style: italic">
Reverse: Adaptation of <em>House of Ada</em>, homage to Allison Knowle's <em>House of Dust</em> and an exercise by first-year XPUB student Ada Varriale in the context of Special Issue #19: How Do We Library That?.
</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<script>
function choice (items) {
return items[Math.floor(Math.random()*items.length)];
}
function rp (s) {
let items = Array.from(s.querySelectorAll("span"));
items.forEach(x => x.classList.remove("active"));
let pick = choice(items);
pick.classList.add("active");
}
function sp (s, active_word) {
let items = Array.from(s.querySelectorAll("span"));
items.forEach(x => {
// console.log("checking", x.innerHTML, active_word);
if (x.innerHTML == active_word) {
x.classList.add("active");
} else {
x.classList.remove("active");
}
});
}
rp(document.querySelector(".actions"));
rp(document.querySelector(".actors"));
rp(document.querySelector(".materials"));
rp(document.querySelector(".objects"));
let page = document.querySelector(".page");
function clone_to_fill_page (page) {
let table = page.querySelector("table");
let tr = table.querySelector("tr");
let td = tr.querySelector("td");
// clone the initial td to make a full page (4)
let new_td = td.cloneNode(true);
tr.appendChild(new_td);
let new_tr = tr.cloneNode(true);
table.appendChild(new_tr);
}
clone_to_fill_page(page);
let page_rev = document.querySelector(".page.reverse");
clone_to_fill_page(page_rev);
async function layout () {
let resp = await fetch("houseofada_combinations.json?time=19:48");
let data = await resp.json();
let current_page = page;
console.log("got data", data);
for (var i=0; i<data.items.length; i+=4) {
// make a new page (if not first)
var tds = Array.from(current_page.querySelectorAll("td"));
if (!tds.length==4) { console.log("HEY THERE SHOULD BE FOUR TDS HERE!");}
for (var x=0; x<4; x++) {
let item = data.items[i+x];
// console.log("actions", tds[x].querySelector(".actions"));
let td = tds[x];
td.style.setProperty("--fg-color", `hsl(${item.hue}, 100%, 50%)`);
sp(tds[x].querySelector(".actors"), item.words[0])
sp(tds[x].querySelector(".actions"), item.words[1])
sp(tds[x].querySelector(".objects"), item.words[2])
sp(tds[x].querySelector(".materials"), item.words[3])
}
current_page = page.cloneNode(true);
document.body.appendChild(current_page);
let current_page_rev = page_rev.cloneNode(true);
document.body.appendChild(current_page_rev);
}
}
setTimeout(layout, 0);
</script>
</body>
</html>

@ -0,0 +1,2 @@
houseofada_combinations.json: houseofada_compute_combinations.py
python3 houseofada_compute_combinations.py > houseofada_combinations.json

Binary file not shown.

After

Width:  |  Height:  |  Size: 530 B

Loading…
Cancel
Save