diff --git a/resen/cent/index.html b/resen/cent/index.html index 232981d..3347050 100644 --- a/resen/cent/index.html +++ b/resen/cent/index.html @@ -18,9 +18,8 @@ "Cent visions de guerre" (1916).

+ 
 
-    

-    
 1.
 
 גּוּפוֹת סְבִיב שׁוּחוֹת
@@ -89,8 +88,8 @@
 עִם הָאֲדָמָה
 הַגְּוִיּוֹת חוֹגְגוֹת
 אֵרוּסֵי דָּמִים
+
 

-    

     

         Translated from French from "Cent visions de guerre" (1916).
     

diff --git a/resen/exceeding/FiraCode-Light.ttf b/resen/exceeding/FiraCode-Light.ttf
new file mode 100644
index 0000000..87ff012
Binary files /dev/null and b/resen/exceeding/FiraCode-Light.ttf differ
diff --git a/resen/exceeding/FireCode_license.txt b/resen/exceeding/FireCode_license.txt
new file mode 100644
index 0000000..9ac82c1
--- /dev/null
+++ b/resen/exceeding/FireCode_license.txt
@@ -0,0 +1,93 @@
+Copyright 2014-2020 The Fira Code Project Authors (https://github.com/tonsky/FiraCode)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.
diff --git a/resen/exceeding/index.html b/resen/exceeding/index.html
index 8dff145..95831af 100644
--- a/resen/exceeding/index.html
+++ b/resen/exceeding/index.html
@@ -4,18 +4,18 @@
     
     
     
-    
-    
+    
+    
     
+    
     
     
-    
     
     
 
 
     
-    

+    

     

         על המסך מוצגים שלושה מונים הסופרים את השעות מאז נולדנו, שלושת בני המשפחה.
         מספר המקומות המוקצה לספירת השעות הוא שישה בלבד, כך שהספירה מתאפשרת רק עד 999,999 שעות, שהן כ־114 שנים. כאשר תעבור שעה מעבר לכך,  המונה כולו יתאפס והספירה תתחיל מחדש. המצב הזה של הגעה לגבול והתאפסות מעבר לו נקרא בצרפתית trop-plein, שמשמעותו המילולית "מעבר לשלם".
@@ -24,6 +24,6 @@
         בפריכות הקיום הנוכחית, כל שנייה יכולה להפוך להרת גורל. "מעבר לשלם" מגלמת בתוכה את האיום שבסופניות כמו גם את הנחמה שבהמשכיות. השניות שעוברות במעין מקצב מדיטטיבי הן בה בעת אשליה מנחמת של סדירות והנכחה מתמדת של האִבחה הבלתי נמנעת של הקץ הקרב ובא.
     

     
-    
+    
 
 
\ No newline at end of file
diff --git a/resen/exceeding/sketch.js b/resen/exceeding/script.js
similarity index 78%
rename from resen/exceeding/sketch.js
rename to resen/exceeding/script.js
index 5617b30..e65fc08 100644
--- a/resen/exceeding/sketch.js
+++ b/resen/exceeding/script.js
@@ -1,11 +1,11 @@
 //  Exceeding the Entirety 2023 by Mika and Avi Milgrom
-// let Fira;
+let Fira;
 let digitSize;
+function preload() {
+  Fira = loadFont("FiraCode-Light.ttf");
+}
 const bg = getComputedStyle(document.documentElement).getPropertyValue('--bg');
 const sketch = document.getElementById("sketch")
-// function preload() {
-//   Fira = loadFont("FiraCode-Light.ttf");
-// }
 
 // Birthdays, Month is zero-based
 let startDateAvi = new Date(1978, 10, 27, 22, 10, 10);
@@ -28,15 +28,10 @@ function drawDigit(digit, x, y) {
   stroke(0);
   strokeWeight(1);
   fill(255);
-  // rect(x, y, digitSize, digitSize + 7);
   rect(x, y, digitSize, digitSize * 1.1);
   noStroke();
   fill(40);
-  // textFont(Fira);
-  textSize(digitSize);
-  textAlign(CENTER, CENTER);
-  //text(digit, x + digitSize / 2, y + digitSize / 2);
-  text(digit, x + digitSize/2, y + digitSize*.63);
+  text(digit, x + digitSize/2, y + digitSize*.4);
 }
 
 // Present time on the screen
@@ -64,10 +59,11 @@ function drawTime(index, PersonDate) {
   // Split time into digits
   let digits = formattedTime.split("");
 
+  digitSize = height / 6;
+  textSize(digitSize)
+
   // Calculate starting positions for each clock
-  //let startX = width / 2 - (digits.length * digitSize + digitSize) / 2;
   let startX = width / 2 - (digits.length * digitSize) / 2;
-  // let startY = height / 6 + (index * height) / 6;
   let startY = height/2 - (digitSize*1.1)*(2.5-index*2);
 
   // Draw each digit with a square
@@ -77,12 +73,10 @@ function drawTime(index, PersonDate) {
 }
 
 function setup() {
-  // const myCanvas = createCanvas(windowWidth, windowHeight);
   const myCanvas = createCanvas(sketch.clientWidth, sketch.clientWidth * 5 / 12);
   myCanvas.parent("sketch");
-  // digitSize = min(width, height) / 20;
-  digitSize = height / 6;
-  textFont("Fira Code");
+  textFont(Fira);
+  textAlign(CENTER, CENTER);
 }
 
 function draw() {
@@ -93,7 +87,5 @@ function draw() {
 }
 
 function windowResized() {
-  // resizeCanvas(windowWidth, windowWidth)
   resizeCanvas(sketch.clientWidth, sketch.clientWidth * 5 / 12);
-  digitSize = height / 6;
 }
\ No newline at end of file
diff --git a/resen/exceeding/style.css b/resen/exceeding/style.css
index 50988e5..a7be97a 100644
--- a/resen/exceeding/style.css
+++ b/resen/exceeding/style.css
@@ -2,5 +2,5 @@
     aspect-ratio: 12 / 5;
     margin-inline: auto;
     max-height: 45vh;
-    margin-bottom: 4rem;
+    margin-block: 10rem;
 }
\ No newline at end of file
diff --git a/resen/imagine/index.html b/resen/imagine/index.html
index 7f4d5fa..7bd0558 100644
--- a/resen/imagine/index.html
+++ b/resen/imagine/index.html
@@ -14,7 +14,7 @@
 
     
     

-        אוסף בקשות ליצירת תמונה שנשלחו על ידי אנשים לא ידועים לתוכנת Midjourney בתקופת מלחמת חרבות ברזל:
+        אוסף בקשות ליצירת תמונה שנשלחו על ידי אנשים לא ידועים לתוכנת Midjourney בתקופת מלחמת חרבות ברזל (מתורגם לעברית):
     

     
נערה פלסטינית צעירה עומדת בביטחון בגבול ישראל-עזה שהשתנה, דומה כעת לכניסה לקניון יוקרתי. היא לובשת תלבושת בסגנון בריטי של שנות ה־60, כולל שמלה עד הברך, מעיל מסוגנן וכובע מעוטר בסרט, משלימים ארנק קטן. השיער שלה מעוצב בקפידה, משדר חן. הגבול שמסביב נוצץ עם עיטורים מפוארים, שטיח אדום המוביל אל הכניסה, תחת שמיים שלווים ובהירים. האווירה סוריאליסטית אך אלגנטית. איור, אומנות דיגיטלית, --ar 16:9 --v 5.0

     
אימא אוחזת בזרועותיה ילד שאוחז בידו של חייל ישראלי שאוחז ביד של גבר חרדי אוחז ביד של אישה וכלב הולכים יד ביד כולם עם הגב אלינו הולכים לכיוון אופק, שקיעה יפה בשמיים עם כמה ענני סתיו ולראות רק את פני הילד על ידיה של האם מוארות באותו אור כמו השמש השוקעת

diff --git a/resen/journal.html b/resen/journal.html
index d0de880..c4adf24 100644
--- a/resen/journal.html
+++ b/resen/journal.html
@@ -19,7 +19,7 @@
         של יצירות מן העולם וכן מאמרים ומסות בנושאי יצירה אילוצית וחישובית.
     

     
כתב העת רֶסֶן הופק בסיוע מועצת הפיס לתרבות ולאומנות (20,000 ש"ח), ובסיוע מענק מיוחד מטעם קרן יהושע רבינוביץ לאומנויות תל-אביב (8,000 ש"ח).

-    

+    

         לוגו מפעל הפיס
         לוגו קרן רבינוביץ
     

diff --git a/resen/media/rabinovich.png b/resen/media/rabinovich.png
index 62d27dd..b58cc5e 100644
Binary files a/resen/media/rabinovich.png and b/resen/media/rabinovich.png differ
diff --git a/resen/pages.js b/resen/pages.js
index d70c933..3007de6 100644
--- a/resen/pages.js
+++ b/resen/pages.js
@@ -1,19 +1,18 @@
 const pages = {
     "/": {title: "רֶסֶן", alt: "Resen", author: "oulipoh", skip: true},
 
-    "achshav/": {title: "אָח־שָׁב – עַכְ־שָׁו", alt: "Ach-Shav", author: "brunogrife", kw: ["issue 0", "sound"]},
-    "cent/": {title: "מתוך \"מאה תמונות מלחמה\"", alt: "From \"One hundred visions of war\"", author: ["julienvocance", "rotematar"], kw: ["issue 0", "poem"]},
-    "disappearance/": {title: "היעלמות", alt: "Disappearance", author: "rotematar", kw: ["issue 0", "text"]},
-    "exceeding/": {title: "מֵעֵבר לַשלם", alt: "Exceeding the entirety", author: ["mikamilgrom", "avimilgrom"], kw: ["issue 0", "audiovisual", "live code", "open source", "software"]},
-    "imagine/": {title: "דמיין", alt: "/imagine", author: "liorzalmanson", kw: ["issue 0", "poem"]},
-    "petri/": {title: "פואטיקת פטרי פטריוטית", alt: "Patriotic Petri Poetry", author: "eyalgruss", kw: ["issue 0", "audiovisual", "live code", "open source", "poem", "software"]},
-    "things/": {title: "קורים עכשיו דברים עם השפה", alt: "Things are happening now with the language", author: "noashaham", kw: ["issue 0", "poem"]},
-    "systems/": {title: "מערכות", alt: "Systems", author: "noashaham", kw: ["issue 0", "poem"]},
+    "achshav/": {title: "אָח־שָׁב – עַכְ־שָׁו", alt: "Ach-Shav", author: "brunogrife", kw: [0, "sound"]},
+    "cent/": {title: "מתוך \"מאה תמונות מלחמה\"", alt: "From \"One hundred visions of war\"", author: ["julienvocance", "rotematar"], kw: [0, "poem"]},
+    "disappearance/": {title: "היעלמות", alt: "Disappearance", author: "rotematar", kw: [0, "text"]},
+    "exceeding/": {title: "מֵעֵבר לַשלם", alt: "Exceeding the entirety", author: ["mikamilgrom", "avimilgrom"], kw: [0, "audiovisual", "live code", "open source", "software"]},
+    "imagine/": {title: "דמיין", alt: "/imagine", author: "liorzalmanson", kw: [0, "poem"]},
+    "petri/": {title: "פואטיקת פטרי פטריוטית", alt: "Patriotic Petri Poetry", author: "eyalgruss", kw: [0, "audiovisual", "live code", "open source", "poem", "software"]},
+    "things/": {title: "קורים עכשיו דברים עם השפה", alt: "Things are happening now with the language", author: "noashaham", kw: [0, "poem"]},
+    "systems/": {title: "מערכות", alt: "Systems", author: "noashaham", kw: [0, "poem"]},
     "journal": {title: "אודות כתב העת", alt: "About this journal", author: "oulipoh"}
 }
 
-const kw_trans = {
-    "issue 0": "גיליון 0",
+const kw_labels = {
     "2d 3d": "רב־ממדי",
     "audiovisual": "אורקולי",
     "biblical": "תורני",
@@ -113,9 +112,11 @@ function get_lang() {
 }
 
 
-function reorder(list_of_strings, lang='', trans=kw_trans) {
-    const issue = Object.values(ui).map(x => x.issue)
-    return [...new Set(list_of_strings)].filter(n => n).sort((a, b) => {if (!lang) {a = trans[a] || a, b = trans[b] || b} return issue.includes(b.split(' ')[0]) - issue.includes(a.split(' ')[0]) || a.localeCompare(b, document.documentElement.lang, {numeric: true})})
+const collator = Intl.Collator(document.documentElement.lang, {numeric: true})
+
+
+function reorder(list_of_strings, lang='', labels=kw_labels) {
+    return [...new Set(list_of_strings)].map(String).sort((a, b) => {if (!lang) {a = labels[a] || a, b = labels[b] || b} return collator.compare(a, b)})
 }
 
 
@@ -172,21 +173,21 @@ function make_link(url, label, cls, title, new_tab=false, force_new_tab_for_mail
 
 
 function get_set_titles(page, lang='', elem) {
-    const titles = {title: pages[page]?.title ?? page.split('/')[0], alt: ''}
+    const titles = {label: pages[page]?.title ?? page.split('/')[0], alt: ''}
     if (pages[page]?.alt) {
         titles.alt = pages[page].alt
         if (lang)
-            [titles.title, titles.alt] = [titles.alt, titles.title]
+            [titles.label, titles.alt] = [titles.alt, titles.label]
     }
     if (elem) {
         if (page) {
             const suffix = elem.title.match(/\[.*/)
             if (suffix) {
-                titles.title += ' ' + suffix
+                titles.label += ' ' + suffix
                 titles.alt += ' ' + suffix
             }
         }
-        elem.title = titles.title
+        elem.title = titles.label
     }
     return titles
 }
@@ -211,7 +212,7 @@ function open_internal_link(elem) {
 
 
 function sanitize(kw) {
-    return kw.replace(/[^\w]/g, '').toLowerCase()
+    return String(kw).replace(/[^\w]/g, '').toLowerCase()
 }
 
 
@@ -228,11 +229,11 @@ function make_contents(show_snippet=default_show_snippet, show_author=default_sh
             continue
 
         const titles = get_set_titles(page, lang)
-        const a = make_link(page2url(page, lang, contents), titles.title, null, titles.alt)
+        const a = make_link(page2url(page, lang, contents), titles.label, null, titles.alt)
 
         if (show_snippet && page.endsWith('/')) {
             const img = new Image()
-            img.alt = 'תצוגה מקדימה של ' + titles.title
+            img.alt = 'תצוגה מקדימה של ' + titles.label
             img.onload = () => a.prepend(img)
             img.src = page + 'snippet'
         }
@@ -246,7 +247,7 @@ function make_contents(show_snippet=default_show_snippet, show_author=default_sh
 
         const p = document.createElement('p')
         p.classList.add(...all_keywords.filter(kw => !pages[page].kw?.includes(kw)).map(kw => 'non_' + sanitize(kw)))
-        p.id = div.children.length
+        p.id = 'page_' + div.children.length
         p.appendChild(a)
 
         if (show_author) {
@@ -313,11 +314,8 @@ function shortcut(elem, key) {
 
 function add_nav_element(nav, url, label, cls, delta=null, key) {
     const elem = nav.appendChild(make_link(url, label, ['nowrap', cls], key ? `[${key}]` : ''))
-    if (delta !== null) {
+    if (delta !== null)
         elem.style.marginInlineEnd = 1.5 + Math.max(delta, 0) + 'em'
-        if (delta)
-            nav.appendChild(document.createElement('wbr'))
-    }
     shortcut(elem, key)
     return elem
 }
@@ -373,8 +371,8 @@ function make_header(reorder_contents=default_reorder_contents) {
     const lang = get_lang()
     const all_keywords_stats = get_all_keywords(lang, page)
     const titles = get_set_titles(page, lang)
-    document.title = titles.title
-    let index_title = get_set_titles('/', lang).title
+    document.title = titles.label
+    let index_title = get_set_titles('/', lang).label
     let is_mobile = false;
     if (matchMedia('(hover: none), (max-device-width: 500px), (max-device-height: 500px)').matches) {
         index_title = index_title.split(' ').slice(0, lang ? 1 : 2).join(' ')
@@ -383,15 +381,15 @@ function make_header(reorder_contents=default_reorder_contents) {
     const parent_title = decodeURI(location).split('/').slice(-3)[0]
     const nav = document.body.appendChild(document.createElement('nav'))
     let diff = get_width(index_title, nav) - get_width(parent_title, nav)
-    let back, keywords, trans
+    let span, back, keywords, trans
     const desc = []
     if (page == '/') {
-        const span = document.createElement('span')
+        span = document.createElement('span')
         span.dir = 'ltr'
         span.innerHTML = parent_title
         add_nav_element(nav, parent_title ? '..' : '', span, 'back', diff, shortcuts.back)
         keywords = Object.keys(all_keywords_stats)
-        const en_title = lang == 'en' ? titles.title : titles.alt
+        const en_title = lang == 'en' ? titles.label : titles.alt
         if (en_title)
             desc.push(en_title)
     } else {
@@ -405,8 +403,10 @@ function make_header(reorder_contents=default_reorder_contents) {
     if (page != '/' && url_kw)
         keywords.unshift(keywords.splice(keywords.map(sanitize).indexOf(url_kw), 1)[0])
 
-    const next = add_nav_element(nav, '', ui[lang].next, 'next', 0, shortcuts.next)
-    const prev = add_nav_element(nav, '', ui[lang].prev, 'prev', 0, shortcuts.prev)
+    span = document.createElement('span')
+    const next = add_nav_element(span, '', ui[lang].next, 'next', 0, shortcuts.next)
+    const prev = add_nav_element(span, '', ui[lang].prev, 'prev', 0, shortcuts.prev)
+    nav.appendChild(span)
     set_next_prev_page(page, next, prev, lang, url_kw)
 
     const alt_langs = Object.keys(ui).filter(x => x != lang)
@@ -450,23 +450,31 @@ function make_header(reorder_contents=default_reorder_contents) {
             const fg_rgb = `rgb(${getComputedStyle(document.documentElement).getPropertyValue('--fg_rgb').replace(/ /g, ', ')})`
             page_items.forEach(p => {const enabled = getComputedStyle(p).color == fg_rgb; p.querySelectorAll('a').forEach(a => {if (enabled) a.removeAttribute('aria-disabled'); else a.ariaDisabled = 'true'})})
             if (reorder_contents)
-                document.querySelector('.contents').append(...[...page_items].sort((a, b) => (getComputedStyle(b).color == fg_rgb) - (getComputedStyle(a).color == fg_rgb) || a.id - b.id))
-            if (on && this.id.startsWith('kw_issue'))
-                buttons_on.forEach(e => {if (e != this && e.id.startsWith('kw_issue')) e.click()})
+                document.querySelector('.contents').append(...[...page_items].sort((a, b) => (getComputedStyle(b).color == fg_rgb) - (getComputedStyle(a).color == fg_rgb) || a.id.split('_')[1] - b.id.split('_')[1]))
+            if (on && this.id.match(/^kw_\d+$/))
+                buttons_on.forEach(e => {if (e != this && e.id.match(/^kw_\d+$/)) e.click()})
         }
 
         keywords.forEach((kw, button_index) => {
             button = document.createElement(page == '/' ? 'button' : 'a')
             button.id = 'kw_' + sanitize(kw)
-            let kw_title
-            if (lang) {
-                button.innerHTML = kw
-                kw_title = kw_trans[kw] || kw
-            } else {
-                button.innerHTML = kw_trans[kw] || kw
-                kw_title = kw
+            let label = kw_labels[kw] || kw
+            if (kw.match(/\d+/))
+                label = ui[lang].issue + ' ' + kw
+
+            let alt = ''
+            if (trans) {
+                alt = kw
+                if (kw.match(/\d+/))
+                    alt = ui[alt_langs[0]].issue + ' ' + kw
+                else if (lang)
+                    [label, alt] = [alt, label]
+                if (alt == label)
+                    alt = ''
             }
-            button.title = `[pages=${all_keywords_stats[kw].count} info=${(all_keywords_stats[kw].info * 100).toFixed(1)}%] ${kw_title}`
+
+            button.innerHTML = label
+            button.title = `[pages=${all_keywords_stats[kw].count} info=${(all_keywords_stats[kw].info * 100).toFixed(1)}%] ${alt}`.trim()
             if (page == '/')
                 button.onclick = kw_handler
             else {
@@ -488,7 +496,7 @@ function make_header(reorder_contents=default_reorder_contents) {
     }
     const h1 = document.createElement('h1')
     h1.id = 'h1'
-    h1.innerHTML = harden(titles.title)
+    h1.innerHTML = harden(titles.label)
     if (titles.alt)
         h1.title = titles.alt
     header.appendChild(h1)
@@ -496,17 +504,14 @@ function make_header(reorder_contents=default_reorder_contents) {
         nav.dir = ui[lang].dir
     document.body.appendChild(header)
     if (pages[page].author) {
-        const cur_authors = get_make_author(page, lang, true)
-        if (page == '/') {
-            const en_authors = cur_authors[lang != 'en' & !!cur_authors[1].length].join(', ')
-            if (en_authors)
-                desc.push('by ' + en_authors)
-        }
+        const current_authors = get_make_author(page, lang, true)[lang != 'en' | 0].join(', ')
+        if (page == '/' && current_authors)
+            desc.push(current_authors)
     }
     if (desc.length) {
         meta = document.createElement('meta')
         meta.name = 'description'
-        meta.content = desc.join(' ')
+        meta.content = desc.join(', ')
         document.head.appendChild(meta)
     }
     if (page == '/')
@@ -519,7 +524,7 @@ function make_header(reorder_contents=default_reorder_contents) {
         })
     else
         delete sessionStorage.kw
-    return titles.title
+    return titles.label
 }
 
 
@@ -543,16 +548,15 @@ function get_make_author(page, lang, make=false, author_pages_folder=default_aut
                 h2.className = 'author'
             }
 
+            let alt_name
             if (names) {
                 name = names[lang] || names[''] || Object.values(names)[0] || name
-                const alt_names = Object.entries(names).filter(([k, v]) => k != lang && v).map(x => x[1])
-                if (lang in names && alt_names.length) {
-                    if (make)
-                        h2.title = alt_names[0]
-                    all_alt_names.push(alt_names[0])
-                }
+                alt_name = Object.entries(names).filter(([k, v]) => k != lang && v).map(x => x[1])[0]
+                if (make && lang in names && alt_name)
+                    h2.title = alt_name
             }
             all_names.push(name)
+            all_alt_names.push(alt_name || name)
 
             if (make) {
                 const a = make_link('', name)
diff --git a/resen/petri/index.html b/resen/petri/index.html
index b748261..d9f37f1 100644
--- a/resen/petri/index.html
+++ b/resen/petri/index.html
@@ -7,8 +7,8 @@
     
     
     
-    
     
+    
     
     
 
@@ -34,6 +34,6 @@
         
Owen Lynch, Petri Nets in Action (2019).

     

     
-    
+    
 
 
\ No newline at end of file
diff --git a/resen/petri/petri.js b/resen/petri/script.js
similarity index 100%
rename from resen/petri/petri.js
rename to resen/petri/script.js
diff --git a/resen/petri/style.css b/resen/petri/style.css
index 08f8eb0..604b9aa 100644
--- a/resen/petri/style.css
+++ b/resen/petri/style.css
@@ -1,9 +1,8 @@
 .petri {
-    --background: black;
+    background: black;
     --color: white;
     --enabled: #ffff64;
     --firing: #64ff64;
-    background: var(--background);
     color: var(--color);
     display: grid;
     font-size: initial;
@@ -11,8 +10,6 @@
     overflow-x: auto;
     outline-style: none;
     padding-bottom: 3em;
-    user-select: none;
-    -webkit-user-select: none;
 }
 
 .fullscreen petri {
diff --git a/resen/style.css b/resen/style.css
index b80b11b..f29ce0b 100644
--- a/resen/style.css
+++ b/resen/style.css
@@ -1,4 +1,4 @@
-:root {
+:root, ::backdrop {  /* In Chrome ::backdrop does not inherit from :root. See: https://bugs.chromium.org/p/chromium/issues/detail?id=827397 */
     --bg: #f6e5d5;
     --fg_rgb: 0 0 0;
     --fg: rgb(var(--fg_rgb));
@@ -15,9 +15,7 @@
     --nav_lh: 2rem;
     --nav_pad_top: 4px;
     --nav_pad_bottom: 16px;
-    --rem_margin: 2rem;
-    --vw_margin: 5vw;
-    --main_margin: max(var(--rem_margin), var(--vw_margin));
+    --main_margin: max(2rem, 5vw);
     --anti_margin: calc(-1 * var(--main_margin));
 }
 
@@ -129,19 +127,19 @@ button, cite, footer, nav, .sliders {
         color: var(--fg_highlight);
     }
 
-    nav > .back[href]:is(:hover, :focus-visible)::before, .mail:is(:hover, :focus-visible) {
+    nav .back[href]:is(:hover, :focus-visible)::before, .mail:is(:hover, :focus-visible) {
         animation: var(--icon_dur) infinite alternate sideways;
     }
 
-    nav > .prev[href]:is(:hover, :focus-visible)::before {
+    nav .prev[href]:is(:hover, :focus-visible)::before {
         animation: var(--icon_dur) infinite alternate up;
     }
 
-    nav > .next[href]:is(:hover, :focus-visible)::before {
+    nav .next[href]:is(:hover, :focus-visible)::before {
         animation: var(--icon_dur) infinite alternate down;
     }
 
-    nav > .trans:is(:hover, :focus-visible)::before {
+    nav .trans:is(:hover, :focus-visible)::before {
         animation: 1.2s linear infinite globe;
     }
 
@@ -192,6 +190,10 @@ a {
     text-underline-position: under;
 }
 
+nav * {
+    display: inline-block;
+}
+
 nav a:not([href]) {
     color: var(--fg_verydim);
 }
@@ -276,7 +278,7 @@ cite {
 
 .rows_first {
     display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(max(250px, (var(--media_width) - (var(--columns) - 1) * var(--column-gap)) / var(--columns)), 1fr));
+    grid-template-columns: repeat(auto-fit, minmax(min(max(250px, (var(--media_width) - (var(--columns) - 1) * var(--column-gap)) / var(--columns)), 100%), 1fr));
     row-gap: 3em;
 }
 
@@ -367,7 +369,7 @@ nav[dir=rtl] ~ .contents {
     width: 100%;
 }
 
-.fg_filter, input:is([type=range], [type=checkbox]), .social, nav > .trans::before {
+.fg_filter, input:is([type=range], [type=checkbox]), .social, nav .trans::before {
     filter: var(--fg_filter);
 }
 
@@ -419,6 +421,10 @@ nav[dir=rtl] ~ footer > div {
     justify-items: center;
 }
 
+.fullscreen::backdrop {
+    background-color: var(--bg);
+}
+
 .fullscreen > :first-child {
     margin-top: auto !important;
     padding-top: 0 !important;
@@ -498,7 +504,7 @@ iframe {
 
 .images {  /* Note you should order images vertically and use dir to control the horizontal order */
     display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
+    grid-template-columns: repeat(auto-fit, minmax(min(var(--min_width, 300px), 100%), 1fr));
     margin-inline: auto;
     place-items: center;
     width: var(--media_width);
@@ -506,6 +512,7 @@ iframe {
 
 .images img {
     height: 90%;  /* Assumes difference between images aspect ratios is less than 10% */
+    max-height: var(--max_height);
     object-fit: contain;
     width: 100%;
 }
@@ -595,48 +602,48 @@ nav {
     }
 }
 
-nav > a::before {
+nav a::before {
     display: inline-block;
     line-height: 0;
     margin-inline-end: .3rem;
 }
 
-nav > a:not(.trans)::before {
+nav a:not(.trans)::before {
     text-align: end;
     width: 1.1rem;
 }
 
-nav > .back::before {
+nav .back::before {
     content: '\2192';
 }
 
-nav[dir=ltr] > .back::before {
+nav[dir=ltr] .back::before {
     content: '\2190';
 }
 
-nav > .back:not([href])::before {
+nav .back:not([href])::before {
     visibility: hidden;
 }
 
-nav > .prev::before {
+nav .prev::before {
     content: '\2191';
 }
 
-nav > .next::before {
+nav .next::before {
     content: '\2193';
 }
 
-nav > .trans::before {
+nav .trans::before {
     content: '\1f310\fe0e';
     font-size: .7em;
 }
 
-nav[dir=ltr] > .trans {
+nav[dir=ltr] .trans {
     direction: rtl;
     float: right;
 }
 
-nav > .trans {
+nav .trans {
     direction: ltr;
     float: left;
 }
@@ -674,7 +681,7 @@ button#play.on::before {
 }
 
 .poem {
-    margin-block: 4em;
+    margin-block: 4ex 4rem;
     margin-inline: auto;
     max-width: fit-content;
 }
@@ -794,10 +801,6 @@ nav[dir=rtl] ~ :nth-last-child(1 of .refs):not([data-title]) {
     flex-grow: 1;
 }
 
-#size_slider {
-    width: 4.5em;
-}
-
 .social {
     display: inline-block;
 }
diff --git a/whom.html b/whom.html
index 663ac87..818d8da 100644
--- a/whom.html
+++ b/whom.html
@@ -18,7 +18,7 @@ 
אוליפֹה

             'Meytar Moran': {name: 'מיתר מורן', url: 'https://www.meytarmoran.com'},
             'Noam Dovev': {name: 'נעם דובב', url: 'https://palindromist.art'},
             'Eyal Gruss': {name: 'איל גרוּס', url: 'https://eyalgruss.com'},
-            'Savyon': {name: 'סביון', url: 'https://fisha67.wixsite.com/savyon'},
+            'Savyon': {name: 'סביון', url: 'https://www.savyonshenhar.com/'},
             'Alex Ben-Ari': {name: 'אלכס בן־ארי', url: 'https://alexbenari.com'},
             'Eran Hadas': {name: 'ערן הדס', url: 'https://eranhadas.com'},
             'Rotem Atar': {name: 'רותם עטר', url: 'https://he.wikipedia.org/wiki/%D7%A8%D7%95%D7%AA%D7%9D_%D7%A2%D7%98%D7%A8'},