updated index based on xpub1 feedback

main
Michael Murtaugh 1 week ago
parent d320f23bb6
commit a2c7987159

@ -39,6 +39,7 @@ div.caption .corner {
div.caption div.captiontext {
/* height: 4em; */
width: 100%;
background: white;
border: 1px solid black;
/* top | right | bottom | left */
padding: 0 0.3em 0.3em 0.3em;

@ -16,6 +16,9 @@ h1 {
margin: 0 0 10px 0;
padding: 0;
}
h2 {
font-size: 28px;
}
#root {
max-width: 512px;
/* white-space: nowrap; */

@ -1,7 +1,48 @@
{% extends "call/base.html" %}
{% load static %}
{% block extrahead %}
<link rel="stylesheet" href="{% static 'call/guestbook.css'%}">
<style>
body {
background: hsl({{bg_hue|default:"0"}}deg {{bg_sat|default:"0"}}% {{bg_lightness|default:"66"}}%);
margin: 0;
}
@page {
/* size: 2160px 3840px; */
size: 432px 768px;
margin: 0;
}
.flex-container {
height: 100%;
padding: 0;
margin: 0;
display: flex;
align-items: center;
justify-content: center;
}
#page {
position: absolute;
left: 0; right: 0;
top: 0; bottom: 0;
}
div.caption div.captiontext {
font-size: 24px;
}
div.caption {
/* border: 1px solid black; */
position: absolute;
/* left: -480px;
width: 960px; */
left: -120px;
width: 240px;
}
</style>
{% endblock %}
{% block content %}
<img src="{{object.image.url}}">
<img src="{% url 'creature_frame' object.id %}">
<p>{{object.caption}}</p>
<div id="page">
<div class="flex-container">
<div class="creature"><img src="{% url 'creature_frame' creature.id %}?cell={{cell}}"><div class="centerbottom"><div class="caption"><div class="corner"></div><div class="captiontext">{{creature.caption}}</div></div></div></div>
</div>
</div>
{% endblock %}

@ -6,9 +6,37 @@
{% block content %}
<h1>XPUB Community Builder...</h1>
<h1>Study @ XPUB!</h1>
<span id=loading>loading...</span>
<div id=root class=rootloading>
<div id="info" style="font-family: serif !important">
<p>
The <a href="https://xpub.nl/" target="extern">Master Experimental Publishing (XPUB)</a> at the <a href="https://pzwart.nl/" target="extern">Piet Zwart Institute</a> in Rotterdam (NL) is a two-year master focused on the acts of making things public and creating publics in the age of post-digital networks.
</p>
<p>XPUB is looking for new students! Come & join us!<p>
<p>Use the <em>XPUB Community Builder</em> below to put yourself on our digital guestbook, join an upcoming open day either online or in-person, and APPLY!</p>
<p><a href="https://www.pzwart.nl/application/deadlines/" target="extern">Application deadlines</a>:</p>
<p>
<ul>
<li>March 4, 2024 (non-EU final + EU priority deadline)</li>
<li>May 8, 2024 (final EU deadline)</li>
</ul>
</p>
<p><a href="https://www.pzwart.nl/blog/open-day/" target="extern">Open days</a>:</p>
<p>
<ul>
<li>ONLINE: <a href="mailto:pzi.coordinators@hr.nl?subject=XPUB Open Day (online)&amp;body=Hello, I will join the online open day on the February 11th on 10:00 CET or 16:00 CET" target="_blank">February 11, 2024, 10:00 + 16:00 CEST</a></li>
<li>IN PERSON:<a href="https://www.pzwart.nl/blog/open-day/" target="extern">February 15, 2025</a></li>
</ul>
</p>
<p>
<button style="background: yellow" id="apply" onclick="window.open('https://www.pzwart.nl/experimental-publishing/apply/', 'extern')">Apply</button>
</p>
</div>
<h2>XPUB Community Builder</h2>
<canvas id=c width=16 height=16></canvas>
<!-- <div id=caption>HERE CAPTION</div> -->
<div class="caption"><div class="corner"></div><textarea placeholder="Your messsage" autofocus id="caption"></textarea></div>
@ -75,28 +103,6 @@
</p>
</div>
<div id="info" style="font-family: serif !important">
<p>
The <a href="https://xpub.nl/" target="extern">Master Experimental Publishing (XPUB)</a> at the <a href="https://pzwart.nl/" target="extern">Piet Zwart Institute</a> in Rotterdam (NL) is a two-year master focused on the acts of making things public and creating publics in the age of post-digital networks.
</p>
<p><a href="https://www.pzwart.nl/application/deadlines/" target="extern">Application deadlines</a>:</p>
<p>
<ul>
<li>March 4, 2024 (non-EU final + EU priority deadline)</li>
<li>May 8, 2024 (final EU deadline)</li>
</ul>
</p>
<p><a href="https://www.pzwart.nl/blog/open-day/" target="extern">Open days</a>:</p>
<p>
<ul>
<li>ONLINE: <a href="mailto:pzi.coordinators@hr.nl?subject=XPUB Open Day (online)&amp;body=Hello, I will join the online open day on the February 11th on 10:00 CET or 16:00 CET" target="_blank">February 11, 2024, 10:00 + 16:00 CEST</a></li>
<li>IN PERSON:<a href="https://www.pzwart.nl/blog/open-day/" target="extern">February 15, 2025</a></li>
</ul>
</p>
<p>
<button style="background: yellow" id="apply" onclick="window.open('https://www.pzwart.nl/experimental-publishing/apply/', 'extern')">Apply</button>
</p>
</div>
<div style="display: none"><a href="{% static 'call/terms.json'%}" id="terms-data-source"></a></div>

@ -17,14 +17,14 @@ Including another URLconf
from django.contrib import admin
from django.urls import path, include
from call import views
from .views import Guestbook, CreatureList, CreatureDetail, creature_frame
from .views import Guestbook, CreatureList, creature_detail, creature_frame
urlpatterns = [
path("guestbook/", Guestbook.as_view(), name="guestbook"),
# path("creatures/<int:pk>/s/", Statement.as_view(), name="statement"),
# path("creatures/<int:pk>/w/", Walk.as_view(), name="walk"),
path("creatures/", CreatureList.as_view(), name="creature_list"),
path("creatures/<int:pk>/", CreatureDetail.as_view(), name="creature_detail"),
path("creatures/<int:creature_id>/", creature_detail, name="creature_detail"),
path("creatures/<int:creature_id>/frame/", creature_frame, name="creature_frame"),
path('', views.index)
]

@ -5,6 +5,7 @@ from .models import Creature
from django.urls import reverse
# from io import StringIO
from PIL import Image
from random import randint, seed
def index(request):
@ -40,15 +41,29 @@ class CreatureList(generic.ListView):
template_name = "call/creature_list.html"
queryset = Creature.objects.filter(published=True)
class CreatureDetail(generic.DetailView):
def creature_detail(request, creature_id):
""" Generates Pixelated PNG of creature """
model = Creature
template_name = "call/creature_detail.html"
context = {}
context['creature'] = get_object_or_404(Creature, pk=creature_id)
context['cell'] = int(request.GET.get("cell", "0"))
seed(creature_id)
context['bg_hue'] = randint(0, 360)
context['bg_sat'] = 100
context['bg_lightness'] = randint(50, 100)
return render(request, "call/creature_detail.html", context)
def creature_frame (request, creature_id):
""" Generates Pixelated PNG of creature """
cell = int(request.GET.get("cell", "0"))
creature = get_object_or_404(Creature, pk=creature_id)
im = Image.open(creature.image.path)
response = HttpResponse(content_type="image/png")
scale = 6 # 24
im = im.crop((16*cell, 0, (16*cell)+16, 16))
w, h = im.size
im = im.resize((w*scale,h*scale), resample=Image.NEAREST)
im.save(response, "PNG")
#im_with_background = Image.new("RGBA", (w*scale, h*scale), (128,0,0))
#im_with_background.paste(im, mask=im)
#im_with_background.save(response, "PNG")
return response

Loading…
Cancel
Save