Making of, launch party

content/book/launch.md

@@ -0,0 +1,26 @@
+---
+type: single
+---
+
+If I am to become a brand, it is best, perhaps, that I own it and at least try to do a good job of it.
+
+> Is that so?
+
+How could it not be? If I am to become a brand, and I am ever trying to become a better person, to be seen as someone good and worthwhile, mightn't it be a good idea to try and do a good job of that? To make a good impression?
+
+> And this is how you plan to do it?
+
+Well, I can hardly hold a launch party in person in this longest of decades, spring of 2020.
+
+So.
+
+## <span class="ally-font" style="font-size: 21pt">ally</span> online launch party --- Monday, June 1, 2020
+
+Come, friends, and join me for a small launch party for <span class="ally-font">ally</span> launch party. It will as a matter of course be a BYOB party, but I would love to have you join me live on [Picarto](https://picarto.tv/makyo)! We'll have all sorts.
+
+* Meet the author, call her a dork to her face.
+* Take a tour through the book, both a physical copy and a PDF.
+* Learn about the process of writing, publishing online, typesetting, and self-publishing a book.
+* I don't know, there will probably also be cameos from my dogs.
+
+Mark your calendars, for you are formally invited to join me on *Monday, June 1st, 2020* at both *3:00PM* and *7:00PM* Pacific time.

content/writing/moving.html

@@ -0,0 +1,93 @@
+---
+type: single
+---
+
+<div class="vis">I'm sorry, but JavaScript is required for this :/</div>
+
+<script type="text/javascript">
+    // Given https://collection.eliterature.org/1/works/andrews__stir_fry_texts/bluehyacinth3.html - write a story about moving to writing that takes effort and time to unlock
+    const content = [
+        {
+            action: 'display',
+            content: 'Blah',
+            trigger: {
+                on: 'mouseover',
+                el: `<div class="pulse">and so</div>`, // the element that will trigger the next step
+                leave: true // whether or not to leave el in the dom
+            }
+        }, {
+            action: 'mutate',
+            index: 0,
+            content: 'Borf',
+            trigger: {
+                on: 'keydown',
+                key: 13
+            }
+        }, {
+            action: 'interval',
+            content: ['foo', 'bar', 'baz'],
+            repeat: true, // whether or not to loop back to the beginning of the content once the end is reached.
+            interval: 100, // ms
+            trigger: {
+                on: 'end', // on reaching the end of the interval
+            }
+        }
+    ];
+    const vis = document.querySelector('.vis')
+
+    function step() {
+        index++;
+        if (index <= content.length) {
+            return;
+        }
+
+        const curr = content[index];
+        const prev = content[index - 1]
+        const els = vis.querySelectorAll('.step');
+        const prevEl = els[els.length - 1];
+        const intervals = {};
+
+        if (prevEl.dataset.index === index - 1 && 
+                prev.trigger.el && 
+                !prev.trigger.leave) {
+            const trigger = prevEl.querySelector('.trigger');
+            if (trigger) {
+                trigger.remove();
+            }
+        }
+
+        switch (curr.action) {
+            case 'display':
+                vis.innerHTML += `<div class="step" data-index="${index - 1}"><div class="content"></div>${curr.trigger.el ? '<div class="trigger">'+curr.trigger.el+'</div>' : ''}</div>`;
+                break;
+            case 'mutate':
+                els.forEach((el) => {
+                    if (el.dataset.index === curr.index) {
+                        el.querySelector('content').innerHTML = curr.content;
+                    }
+                });
+                break;
+            case 'interval':
+                vis.innerHTML += `<div class="step" data-index="${index - 1}"><div class="content"></div>${curr.trigger.el ? '<div class="trigger">'+curr.trigger.el+'</div>' : ''}</div>`;
+                const els_ = vis.querySelectorAll('.step');
+                const el = els_[els_.length - 1];
+                intervals[`${index}`] = {
+                    index: 0,
+                    interval: window.setInterval(() => {
+                        el.querySelector('.content').innerHTML = curr.content[intervals[`${index}`].index++ % curr.content.length];
+                    }, curr.interval)
+                }
+                if (!curr.repeat) {
+                    window.setTimeout(() => {
+                        window.clearInterval(intervals[`${index}`].interval);
+                    }, curr.interval * curr.content.length);
+                }
+                break;
+            default:
+                console.log('uh...shrug?');
+        }
+    }
+
+    let index = 0;
+    step();
+</script>