30:T6e1,shimmerer = () => { let object = 0, replacement = 1; let indexOfObjectLetter = randInt(letters[object].length); let objectLetter = letters[object].substr(indexOfObjectLetter, 1); if (mutable rindex == 0) shuffle(shuffledArray); mutable rindex = mutable rindex + 1; if (mutable rindex >= shimmeringArray.length) { mutable rindex = 0; } let wordIndex = shuffledArray[rindex]; let shimmeringWord = shimmeringArray[wordIndex]; let len = shimmeringWord.length; let indexOfLetterToReplace = -1; // do nothing if we are surfacing and we've already got the supply word if (mutable surface && shimmeringWord === supplyArray[wordIndex]) return; if (heads()) { // search for letter from beginning or up to halfway thru the word let indexSearchStart = randInt(Math.floor(len / 2)); indexOfLetterToReplace = shimmeringWord.indexOf( objectLetter, indexSearchStart ); } else { // search for letter from end or down to halfway thru the word let indexSearchStart = randIntBetween(Math.ceil(len / 2), len); indexOfLetterToReplace = shimmeringWord.lastIndexOf( objectLetter, indexSearchStart ); } if (indexOfLetterToReplace != -1) { let letterInWord = shimmeringWord.substr(indexOfLetterToReplace, 1); let modelLetter = supplyArray[wordIndex].substr(indexOfLetterToReplace, 1); let replacementLetter = letters[replacement].substr(indexOfObjectLetter, 1); if (!mutable surface || (mutable surface && letterInWord != modelLetter)) { shimmeringArray[wordIndex] = shimmeringWord.replace( shimmeringArray[wordIndex].substr(indexOfLetterToReplace, 1), replacementLetter ); mutable shimmeringText = shimmeringArray.join(' '); } } }31:[{"id":"86a9cff37274b7d660a0ff5f7816d984bd7d7e4974ff80220256a0d0e60befd4dcdb0ea0270df3c17e1e52aacd404f9c79e85173bdbd65027c34bc72305cdcd0","href":"https://static.observableusercontent.com/files/86a9cff37274b7d660a0ff5f7816d984bd7d7e4974ff80220256a0d0e60befd4dcdb0ea0270df3c17e1e52aacd404f9c79e85173bdbd65027c34bc72305cdcd0","name":"MinionPro-Regular.otf","type":"font/otf","lastModified":1618764232447.455,"size":218640}] 2e:{"title":"shimmer","cells":[{"id":0,"value":"html`

shimmer

JOHN CAYLEY, FEB 2021

${LAOB} / THE WORK

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":732,"value":"md`*shimmer* is a prose-poetic text which ‘shimmers.’ Cyclical phases of letter substitutions produce effects intended to suggest those that we see in reflections on the surface of moving water, here, a shimmering reflection of the moon on lake water. Every half minute – according to the period of its ‘swell’ – the text of *shimmer* shifts back and forth from settling to shimmering. When shimmering, o’s may replace e’s, n’s replace r’s, t’s f’s, and vice versa. These are the letters of the lowercase Roman alphabet most similar in graphic form, and in their representation of vowel or consonant. When settling, the letter substitutions tend, eventually, to render the text as it is spelt in standard English.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":731,"value":"md`The behavior of *shimmer* produces a moving typographic image with a concrete, visual poetics. This is a variety of concrete poetry that could not be realized in print.
\n Despite minimal letter substitutions which are designed, more or less, to retain the overall form of every constituent word and the shape of the text as a whole, the challenge to reading, in this piece’s shimmering state, is all but immediate. Over time, we may learn to read the text as we ‘read’ reflections in water. We understand what the moving forms suggest to us and what causes them to arise. And we take pleasure in their shimmering forms.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":2,"value":"shimmerEmbeddable = md`

${addBackLineEndings(\n shimmeringText\n)}

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":491,"value":"md`The above cell should be doing roughly what the final piece will do, but without styling and for notebook purposes only.\n\nThe following cell reports on the current state of the piece:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":489,"value":"md`

A half-minute ‘\\`secondhand\\`’ reads \\`${\n mutable secondhand < 10 ? '0' + secondhand : secondhand\n}\\`,
with a letter change every \\`${seconds} second${\n seconds == 1 ? '' : 's'\n}\\`,
while \\`surface\\` alternates \\`${\n mutable surface ? 'TRUE/false' : 'true/FALSE'\n}\\` every \\`${minutes}\\` minute${minutes == 1 ? '' : 's'}.

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":520,"value":"md`This \\`seconds\\` constant sets the rate at which letter replacements are made.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":487,"value":"seconds = .04\n/*\n[ these were experiments tweaking the seconds ]\nsurface ? .02 : .03;\nif (surface && seconds > 10) seconds = .01;\nif (surface && seconds > 20) seconds = .005;\n*/","pinned":false,"hidden":false,"mode":"ojs"},{"id":434,"value":"md`The following cell, \\`ticker\\`, is *shimmer*’s engine, and requires embedding in any reader-facing version.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":6,"value":"ticker = {\n while (true) {\n yield await Promises.tick(seconds * 1000).then(shimmerer);\n }\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":496,"value":"md`But most of the work is done in the following cell.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":485,"value":"$30","pinned":true,"hidden":false,"mode":"ojs"},{"id":517,"value":"md`The following is the actual, composed supply text for the piece. This version of *shimmer* has been developed to respect line endings in the composed text:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":221,"value":"supplyText = md`

shimmer. The moor at our back and the moon\nbefore us. The moon’s reflection,\nreaching out from the east and extending, with\nepicyclic recession, from below the darkened\nevergreens of the farther shore. A surface must\nbe smooth to reflect or see through.\ndeformations elongate, compress\nand interweave. Roughened edges\nliterally catch the light.\nEmbrace the moon

`","pinned":true,"hidden":false,"mode":"ojs"},{"id":442,"value":"md`In a \\`fork\\` or copy of this notebook, edit the above Markdown text above to make your own composition ‘shimmer.’\n\nHere we capture the positions of line endings:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":801,"value":"lineEndings = {\n // an array of indexes to words at the end of lines:\n let s = supplyText.innerText;\n let set = new Set();\n let i = 0;\n let wordEnd = s.match(/\\s/);\n while (wordEnd != null) {\n if (wordEnd == \"\\n\") set.add(i);\n i++;\n s = s.slice(s.search(/\\s/) + 1);\n wordEnd = s.match(/\\s/);\n }\n return set;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":798,"value":"md`\\`supplyArray\\`, below, is used for reference in the cell \\`shimmerer\\`:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":143,"value":"supplyArray = supplyText.innerText.split(/[ \\n]/)","pinned":false,"hidden":false,"mode":"ojs"},{"id":78,"value":"shimmeringArray = supplyText.innerText.split(/[ \\n]/)","pinned":false,"hidden":false,"mode":"ojs"},{"id":452,"value":"md`The above variables are derived from \\`supplyText\\`. We will use one \\`mutable\\` variable:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":322,"value":"mutable shimmeringText = shimmeringArray.join(' ')","pinned":false,"hidden":false,"mode":"ojs"},{"id":821,"value":"addBackLineEndings = text => {\n let sa = text.split(\" \");\n let fontInc = \"103%\";\n text = `

`; // insert below after
if wanted:

\n sa.forEach(\n (word, index) =>\n (text += lineEndings.has(index)\n ? \"\" +\n word +\n \"\" +\n `

`\n : \"\" + word + \"\" + \" \")\n );\n return text + \"

\".repeat(lineEndings.size + 2); // .repeat(lineEndings.size + 2);\n} //

","pinned":true,"hidden":false,"mode":"ojs"},{"id":824,"value":"addBackLineEndings(mutable shimmeringText)","pinned":true,"hidden":false,"mode":"ojs"},{"id":72,"value":"mutable rindex = 0","pinned":false,"hidden":false,"mode":"ojs"},{"id":704,"value":"md`The following Array is being shuffled ‘in place’ (it’s effectively \\`mutable\\`) whenever \\`rindex\\` is 0. \\`rindex\\` changes at a rate determined by the value of \\`seconds\\`, currently ${seconds} seconds.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":245,"value":"shuffledArray = shuffle([...shimmeringArray.keys()])","pinned":false,"hidden":false,"mode":"ojs"},{"id":266,"value":"minutes = .5","pinned":false,"hidden":false,"mode":"ojs"},{"id":194,"value":"swell = {\n while (true) {\n Promises.tick(1000).then(() => {\n mutable secondhand = (secondhand + 1) % 30;\n });\n yield Promises.tick(minutes * 60 * 1000).then(() => {\n mutable secondhand = 0;\n mutable surface = !surface;\n let m = `\\`swell\\` is computed in this cell and has a period of \\`${minutes}\\` minute${\n minutes != 1 ? 's' : ''\n }.`;\n return md`${m} The state of *shimmer* changes from \\`surface = true\\`, i.e. smoothing-out, to shimmering (and back) after this length of time.`;\n });\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":199,"value":"mutable surface = false","pinned":false,"hidden":false,"mode":"ojs"},{"id":337,"value":"mutable secondhand = 0","pinned":false,"hidden":false,"mode":"ojs"},{"id":8,"value":"letters = [\"efnotr\", \"otrefn\"]","pinned":false,"hidden":false,"mode":"ojs"},{"id":456,"value":"md`An array with two string constants. Each string contains all the letters which are swapped to generate the *shimmer*ing, but in positions of correspondance and oppostion. These are the lower case letters of the Roman character set considered as pairs of letters which are most similar in form and which also match in terms of both members of the pair representing a vowel or a consonant.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":460,"value":"md`#### Utility functions`","pinned":false,"hidden":false,"mode":"ojs"},{"id":535,"value":"heads = () => {\n return randInt(2) == 0;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":14,"value":"randInt = maxPlusOne => (maxPlusOne * Math.random()) | 0","pinned":false,"hidden":false,"mode":"ojs"},{"id":352,"value":"randIntBetween = (min, max) => {\n return Math.floor(Math.random() * (max - min) + min);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":239,"value":"shuffle = arr => {\n for (let i = arr.length - 1; i >= 0; i--) {\n let randomIndex = randInt(i + 1); // Math.floor(Math.random() * (i + 1));\n let itemAtIndex = arr[randomIndex];\n arr[randomIndex] = arr[i];\n arr[i] = itemAtIndex;\n }\n return arr;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":499,"value":"md`#### Imports`","pinned":false,"hidden":false,"mode":"ojs"},{"id":463,"value":"md`Importing a monospaced font for use in the CSS below:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":314,"value":"import { andaleMono } from \"@shadoof/sifther\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":484,"value":"import { Button } from \"@observablehq/inputs\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":502,"value":"md`#### CSS Styling`","pinned":false,"hidden":false,"mode":"ojs"},{"id":467,"value":"md`You can add CSS to a notebook by coding it as an html \\`\n` // perspective(2400px)\n// #plane {\n// perspective: 200px;\n// transform: rotateX(70deg);\n// }\n\n// .cards {\n// display: inline-block;\n// color: red;\n// transform: rotateX(0deg);\n// }","pinned":true,"hidden":false,"mode":"ojs"},{"id":917,"value":"html`test`","pinned":true,"hidden":false,"mode":"ojs"},{"id":740,"value":"import { laob_notebook_css, LAOB } from \"@laob/imports\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":749,"value":"laob_notebook_css","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}