3e:null 3f:["$","title",null,{"children":"Block Builder Playground | Bob | Observable"}] 45:T61c,drop = { // there are 604800 seconds in a week (lane) // there are 86400 seconds in a day let offset = blockDate.getTimezoneOffset() let now = Date.now() - offset*60*1000 // (UTC -8 hours) let nowISO = new Date(now).toISOString() let todayUnix = new Date(nowISO.substring(0, 10)).setUTCMinutes(offset).valueOf() // local today with not time, date only // do we need to add a "today" index ref? Or can we use seconds to calculate? let nowIdx = new Date(todayUnix).getDay() let blockUnix = blockDate.setUTCMinutes(offset) // unix time in milliseconds let unixGap = (todayUnix - blockUnix)/1000 // sec let daysGap = unixGap / 86400 let lane = Math.floor((nowIdx - daysGap)/7) let d = new Date(blockUnix) let day = d.getDay() let dayOfWk = day let weekdays = ["Sun","Mon","Tues","Wed","Thurs","Fri","Sat"] let weekday = weekdays[day] let row = 6 - day // this week always if the "daysGap" is bigger than the "day" position + 1 // if today it Thursday (it is index 4 of the week... 0 to 6) // if we pick to a block on Mon (is index 1 of the week... 0 to 6) let curDayBlocks = blocksArray.filter(b => b.lane == lane && b.row == row).length // look up blocks by existing row & lane let stack = curDayBlocks + 1 let coords = blockCoords(row, lane, stack) blocksArray.push({x: coords.x , y: coords.y, row, lane, stack}) return { details: {now, nowISO, todayUnix, blockUnix, unixGap, daysGap, d, nowIdx, weekday}, idx: {row, lane, stack}, coords: {x: coords.x , y: coords.y} } }46:Taed,blockParty = { // from the colorMatrix we load the CSS styles for various colored blocks let cssBlockStyles = colorMatrix.map(color => color.class) // sort the block array to draw blocks in the right order blocksArray.sort((a, b) => a.lane - b.lane); blocksArray.sort((a, b) => a.row - b.row); blocksArray.sort((a, b) => a.stack - b.stack); let blocksSvg = blocksArray.map(coords => { let x = coords.x let y = coords.y return `` }) console.log(blocksSvg) return html` ` }47:T7ec, 48:T103a,

Preview Your Value Blocks

Daily Journal Entries for ${journalData.defaultCreators.join(',')}

+${journalData.statsSummary.totalBlocks}

Value Blocks

${journalData.statsSummary.totalBlocks*100}

$ Value

${journalData.statsSummary.totalBlocks*10}

Gratitude Required

+${journalData.statsSummary.totalBlocks*100}

Gratitude Reward

${journalData.date}

⬜️ good nights rest 😴 |Hlth| {VTL}

🟪 nourishing bfast 😋 |Hlth| {VTL}

🟧 bachelorette planning 🥳 |Fun|(Sa)

🟦 laundry & dishes 🧺🧼 |Joy|

🟧🟧🟧🟧🟧 Coded HTML / CSS / JS 👨🏻‍💻 Better Economy Lindsay Economy Pilot Doing Lots of extra details about why this block is so amazing here. It is really very cool and it is worth sharing with the world.

🟩🟩🟩 Coded HTML / CSS / JS 👨🏻‍💻 Better Economy L,B Economy Pilot Doing Lots of extra details about why this block is so amazing here. It is really very cool and it is worth sharing with the world.

More Details:

Story: ${journalData.emojiStory}

49:T771,blocksHtml = { let entries = reassemble //journalData.blockRecords let cubit = journalData.blockIdx let blcEmjClasses = emojiBlocksIndex.map(c => c.clrClass) // Get the container elements let ul = document.getElementById('blocksPreview') let g = document.getElementById('daily-cubit') //let style = document.getElementById('preview-styles') let entriesHTML = entries.map(row => { let frame = `${row.labels.frame}` let forWho = row.labels.forWho ? `${row.labels.forWho}` : '' var group = row.labels.group ? `${row.labels.group}` : '' let type = `Doing` let details = row.details ? `${row.details}` : '' return `

${row.main} ${frame} ${forWho} ${group} ${details}

` }) // Write over or Clear the existing lists ul.innerHTML = entriesHTML.join('') g.innerHTML = '' // Create and append elements based on the data array cubit.forEach((blc, idx) => { let use = document.createElement('use'); let classStrg = "emj-clr-" + blc.emojiIdx use.setAttribute('class', classStrg); use.setAttribute('href', '#block'); use.setAttribute('x', blc.cubitX); use.setAttribute('y', blc.cubitY); g.appendChild(use); }); const svgElement = document.getElementById('cubit'); // Get the SVG element by ID // Modify the innerHTML to trigger a redraw svgElement.innerHTML = svgElement.innerHTML; // Option #2 - Probably best for Email HTML let htmlList = entries.map(item => { return `

${item.main}

` }) return {svgHtml: svgElement.innerHTML} //{htmlList} }4a:T1b27,journalData = { // find indexOf(): // 1st "(" and optional 2nd "(" // 1st ")" and optional 2nd ")" // 1st "|" and 2nd "|" // 1st "{" // 1st "}" if(pastedBlockJournal){ var pastedDay = pastedBlockJournal } else { // Initial Sample Data var pastedDay = `(B,L) May 27, 2023 🟦🟦 Quality Sleep 🛌 |Hlth| [ce] 🟪🟪 Eating Vegan 🌱 |Veg| [ce] 🟪🟪 Car Free🚶🏻‍♀️🚶🏻‍♂️|Eco| [ce] 🟪🟪 Minimalism 🪷|Simp| [ce] 🟩 Beach Medi (L) 🧘🏻‍♀️🏝 |Peac|:: Touched my inner self and found peace 🟩🟩 Morning Walk🚶🏻‍♀️🌹|Mov|:: Beautiful AM walk where we stopped and smelled the roses 🟨 Breakfast (L) 🍊🌮 |Hlth| 🟧🟧 Notes / Draw (B) 📘✍🏼 |+E|{EP1} 🟨 Online Groceries (L) 🛒🌭 |+L| 🟪 Beach Social (L) 🌊🌞|Scl|(Jl,Jy) 🟧 Roots of Old Game (B) 📝 |+E|{EP1} 🟧 Chat with GPT (B) 🔬🧫|+E|{EP1} 🟨 Dinner (L) 🍝 |Hlth| 🟩🟩 Streaming 📺 |Play|` } let blockRecords = pastedDay.split('\n').filter(line => line != ""); let lineOne = blockRecords.shift() let lineOneLeftParIdx1 = lineOne.indexOf("("); if(lineOneLeftParIdx1 == 0){ let lineOneRightParIdx1 = lineOne.indexOf(")"); var defaultCreators = lineOne.slice(lineOneLeftParIdx1 + 1, lineOneRightParIdx1).trim().split(","); var date = lineOne.split(")")[1].trim() } else { var date = lineOne var defaultCreators = null } var regex = /|\p{Extended_Pictographic}/gu; // /[\uD800-\uDBFF][\uDC00-\uDFFF]/g; var blocksIndex = [] // blocks, text, creators, vibes, frame, who, group, type, details let parsed = blockRecords.map((row, idx) => { let blockEntry = row let firstLeftParIdx = blockEntry.indexOf("("); // returns -1 if none found let closingLeftParIdx = blockEntry.indexOf("(", firstLeftParIdx + 1) let openFrameIdx1 = blockEntry.indexOf("|"); let closeFrameIdx1 = blockEntry.indexOf("|", openFrameIdx1 + 1) let finalFrameIdx = blockEntry.lastIndexOf("|") let debug = {} // add debug info as needed // blocks let parts = row.split(" ") let raw = parts.shift().match(regex) blocksIndex.push(raw) let qty = raw.length let blocks = {raw, qty} // text let textStartPos = qty*2 let afterBlocks = blockEntry.slice(textStartPos) let fistEmojiIdx = afterBlocks.search(regex) - 1 debug.firstEmjoiIdx = fistEmojiIdx let startFrameIdx = afterBlocks.indexOf("|") let startGroupIdx = afterBlocks.indexOf("{") let nextBreakIdx if(startGroupIdx && startGroupIdx < startFrameIdx){ // group "{" comes before frame "|" nextBreakIdx = startGroupIdx } else { // typical break is at frame "|" nextBreakIdx = startFrameIdx } debug.nextBreakIdx = nextBreakIdx let textEndPos let beginVibes if(firstLeftParIdx == -1 || firstLeftParIdx > openFrameIdx1){ // use "emoji" break or "|" break if(fistEmojiIdx > 0){ textEndPos = fistEmojiIdx + 1 beginVibes = textEndPos - 1 } else { textEndPos = startFrameIdx } } else { // use "(" break textEndPos = afterBlocks.indexOf("("); beginVibes = afterBlocks.indexOf(")"); } let text = afterBlocks.slice(0, textEndPos).trim(); // vibes let vibes = beginVibes ? afterBlocks.slice(beginVibes + 1, startFrameIdx).trim() : '' // .match(regex); // creators let leftParIdx1 = blockEntry.indexOf("("); let rightParIdx1 = blockEntry.indexOf(")"); let creators if(firstLeftParIdx == -1 || firstLeftParIdx > openFrameIdx1){ // use defaultCreator creators = defaultCreators } else { creators = blockEntry.slice(leftParIdx1 + 1, rightParIdx1).trim().split(","); } // frame let frame = blockEntry.slice(openFrameIdx1 + 1, closeFrameIdx1).trim(); // who let afterFrame = blockEntry.slice(finalFrameIdx) let leftParIdx2 = afterFrame.lastIndexOf("("); let who if(leftParIdx2 == -1){ // use defaultCreator if(defaultCreators){ who = null } else { who = creators } } else { let rightParIdx2 = afterFrame.lastIndexOf(")"); who = afterFrame.slice(leftParIdx2 + 1, rightParIdx2).trim().split(","); } // group let leftCurlIdx = blockEntry.indexOf("{"); if(leftCurlIdx != -1){ let rightCurlIdx = blockEntry.indexOf("}"); var group = blockEntry.slice(leftCurlIdx + 1, rightCurlIdx).trim() //.split(","); } else { var group = null } // details let details = blockEntry.split("::") if(details.length == 2){ details = details[1].trim() } else { details = null } return {blocks, text, debug, creators, vibes, frame, who, group, details} }) let processed = parsed.map((row, idx) => { let creatorSplit = row.creators.map(creator => { let qtyCreators = row.creators.length let qtyBlocks = row.blocks.qty let counts = {qtyCreators, qtyBlocks} // only return during debugging let blocks = Math.ceil(qtyBlocks/qtyCreators) // round up on any partial block division let text = row.text let vibes = row.vibes let frame = row.frame let who = row.who let group = row.group let details = row.details return {blocks, text, creator, vibes, frame, who, group, details} }) return creatorSplit }).flat() // Block Index for Colored 3D Cubes let flatBlockIdx = blocksIndex.flat() let blockIdx = flatBlockIdx.map((blc,idx) => { let hexCode = blc.codePointAt(0).toString(16) let emojiIdx = emojiBlocksIndex.findIndex(obj => obj.hexCode === hexCode) let cubitX = cubitPositions[idx].x let cubitY = cubitPositions[idx].y return {blc, hexCode, emojiIdx, cubitX, cubitY} }) // Emoji Day Story let emojiStory = (parsed.map(e => e.vibes)).join('') // Stats let uniqueCreators = Array.from(new Set(processed.map(obj => obj.creator))); // Calculate stats summary let statsSummary = processed.reduce((summary, obj) => { const { creator, group, color, frame, type, blocks } = obj; summary.totalBlocks += blocks; summary.creators[creator] = (summary.creators[creator] || 0) + blocks; summary.groups[group] = (summary.groups[group] || 0) + blocks; // summary.colors[color] = (summary.colors[color] || 0) + blocks; summary.frames[frame] = (summary.frames[frame] || 0) + blocks; // summary.types[type] = (summary.types[type] || 0) + blocks; return summary; }, { totalBlocks: 0, creators: {}, groups: {}, // colors: {}, frames: {}, // types: {} }); return {date, defaultCreators, blockRecords, blockIdx, parsed, processed, emojiStory, uniqueCreators, statsSummary} }4b:Te87,tcColorNames = tinycolor.names = { aliceblue: "f0f8ff", antiquewhite: "faebd7", aqua: "0ff", aquamarine: "7fffd4", azure: "f0ffff", beige: "f5f5dc", bisque: "ffe4c4", black: "000", blanchedalmond: "ffebcd", blue: "00f", blueviolet: "8a2be2", brown: "a52a2a", burlywood: "deb887", burntsienna: "ea7e5d", cadetblue: "5f9ea0", chartreuse: "7fff00", chocolate: "d2691e", coral: "ff7f50", cornflowerblue: "6495ed", cornsilk: "fff8dc", crimson: "dc143c", cyan: "0ff", darkblue: "00008b", darkcyan: "008b8b", darkgoldenrod: "b8860b", darkgray: "a9a9a9", darkgreen: "006400", darkgrey: "a9a9a9", darkkhaki: "bdb76b", darkmagenta: "8b008b", darkolivegreen: "556b2f", darkorange: "ff8c00", darkorchid: "9932cc", darkred: "8b0000", darksalmon: "e9967a", darkseagreen: "8fbc8f", darkslateblue: "483d8b", darkslategray: "2f4f4f", darkslategrey: "2f4f4f", darkturquoise: "00ced1", darkviolet: "9400d3", deeppink: "ff1493", deepskyblue: "00bfff", dimgray: "696969", dimgrey: "696969", dodgerblue: "1e90ff", firebrick: "b22222", floralwhite: "fffaf0", forestgreen: "228b22", fuchsia: "f0f", gainsboro: "dcdcdc", ghostwhite: "f8f8ff", gold: "ffd700", goldenrod: "daa520", gray: "808080", green: "008000", greenyellow: "adff2f", grey: "808080", honeydew: "f0fff0", hotpink: "ff69b4", indianred: "cd5c5c", indigo: "4b0082", ivory: "fffff0", khaki: "f0e68c", lavender: "e6e6fa", lavenderblush: "fff0f5", lawngreen: "7cfc00", lemonchiffon: "fffacd", lightblue: "add8e6", lightcoral: "f08080", lightcyan: "e0ffff", lightgoldenrodyellow: "fafad2", lightgray: "d3d3d3", lightgreen: "90ee90", lightgrey: "d3d3d3", lightpink: "ffb6c1", lightsalmon: "ffa07a", lightseagreen: "20b2aa", lightskyblue: "87cefa", lightslategray: "789", lightslategrey: "789", lightsteelblue: "b0c4de", lightyellow: "ffffe0", lime: "0f0", limegreen: "32cd32", linen: "faf0e6", magenta: "f0f", maroon: "800000", mediumaquamarine: "66cdaa", mediumblue: "0000cd", mediumorchid: "ba55d3", mediumpurple: "9370db", mediumseagreen: "3cb371", mediumslateblue: "7b68ee", mediumspringgreen: "00fa9a", mediumturquoise: "48d1cc", mediumvioletred: "c71585", midnightblue: "191970", mintcream: "f5fffa", mistyrose: "ffe4e1", moccasin: "ffe4b5", navajowhite: "ffdead", navy: "000080", oldlace: "fdf5e6", olive: "808000", olivedrab: "6b8e23", orange: "ffa500", orangered: "ff4500", orchid: "da70d6", palegoldenrod: "eee8aa", palegreen: "98fb98", paleturquoise: "afeeee", palevioletred: "db7093", papayawhip: "ffefd5", peachpuff: "ffdab9", peru: "cd853f", pink: "ffc0cb", plum: "dda0dd", powderblue: "b0e0e6", purple: "800080", rebeccapurple: "663399", red: "f00", rosybrown: "bc8f8f", royalblue: "4169e1", saddlebrown: "8b4513", salmon: "fa8072", sandybrown: "f4a460", seagreen: "2e8b57", seashell: "fff5ee", sienna: "a0522d", silver: "c0c0c0", skyblue: "87ceeb", slateblue: "6a5acd", slategray: "708090", slategrey: "708090", snow: "fffafa", springgreen: "00ff7f", steelblue: "4682b4", tan: "d2b48c", teal: "008080", thistle: "d8bfd8", tomato: "ff6347", turquoise: "40e0d0", violet: "ee82ee", wheat: "f5deb3", white: "fff", whitesmoke: "f5f5f5", yellow: "ff0", yellowgreen: "9acd32" };4c:T5a3,

4d:T4d8,

Some extra words

Other text

4e:[] 43:{"id":"e675878f7c732f92","slug":null,"title":"Block Builder Playground","thumbnail":"49e3b8e7b5c25c76853ac31b4ed41e895e2facb91573182f4e68e995d0ccb899","access_level":"public","create_time":"$D2023-08-19T00:38:21.660Z","update_time":"$D2023-08-19T00:38:45.933Z","view_time":null,"first_public_time":"$D2023-08-19T00:38:21.660Z","has_unpublished_edits":null,"fork":{"id":"acf389fcf7c3e977","slug":null,"title":"Value Block Journal Portal","owner":{"id":"ea7f9b9736dc9c9e","login":"mullojo","name":"Bob"}},"stars":0,"starred":false,"owner":{"type":"team","id":"ea7f9b9736dc9c9e","login":"mullojo","name":"Bob","avatar_url":"https://avatars-next.observableusercontent.com/6e80d3c40a7d9ff9e7a39d86c93b61db0a45ab46214885739e5901cec0f01788","tier":"starter_2024","bio":"","following":false},"version":1979,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"e215b6c167225412","login":"mullojo","name":"Bob","avatar_url":"https://avatars-next.observableusercontent.com/6e80d3c40a7d9ff9e7a39d86c93b61db0a45ab46214885739e5901cec0f01788","tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"e215b6c167225412","login":"mullojo","name":"Bob","avatar_url":"https://avatars-next.observableusercontent.com/6e80d3c40a7d9ff9e7a39d86c93b61db0a45ab46214885739e5901cec0f01788","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Block Builder Playground","cells":[{"id":0,"value":"# Block Builder Playground\n\n* Create new blocks with supporting data (people, group, type, date, etc.) ✔️\n* Color blocks by type ✔️\n* Give blocks to frames ✔️\n* Generate new gratitude metrics \n* Visualize all blocks on a 3D canvas with a \"date\" slider or selector ✔️\n* Filter to see blocks under any frame\n* Filter to see blocks by contributor\n* Use local data storage\n* Create & visualize some big block stats\n* Click on a block and see block details\n\n## Notes:\n\n* For each cube, we need a \"day\", \"lane\", and \"stack\" position. The \"stack\" position is really a viewing parameter ✔️\n* Each block type should have a color matrix map (type to color correlation), this could be an array with \"type\" and \"color\" objs ✔️\n* Viewing daily blocks in a \"dense 3d block storage\", like groups of 3x3x3 scaled cubes ✔️\n* Personal view seems best as a 3D timeline (a personal stream of blocks)\n* When we click on a block it could show up in a \"single block viewer\" (same type of date preview we use to create a block)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":240,"value":"viewof blockDate = Inputs.date({label: \"Date\", value: Date.now() - new Date().getTimezoneOffset()*60*1000, submit: true})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":441,"value":"blocksArray = []","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":293,"value":"$45","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1455,"value":"cubitPositions = {\n let size = 3; // Size of the Cubit (3x3x3)\n let blocks = [];\n \n for (let stack = 1; stack <= size; stack++) {\n for (let row = 1; row <= size; row++) {\n for (let lane = 1; lane <= size; lane++) {\n blocks.push({ row, lane, stack });\n }\n }\n }\n\n blocks.forEach((b,idx) => {\n let coords = blockCoords(b.row, b.lane, b.stack)\n blocks[idx].x = coords.x\n blocks[idx].y = coords.y\n })\n \n return blocks\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":92,"value":"blockCoords = (row, lane, stack) => {\n\n // from input sliders for debug only\n // let row = rowPosition\n // let stack = stackPosition\n // let lane = lanePosition\n\n // Offsets for optimal position testing\n\n // We can update the relative viewport x, y starting block coordinates for optimal placement\n let xRef = 121 // 121 // 10\n let yRef = 112 // 112 // 100\n\n // each \"day\" represents a column position in a lane (week) (0 to 6, 1 to 7)\n let xAdjRow = - row * 21 // decreasing steps of 21\n let yAdjRow = row * 12 // increasing steps of 12\n\n // each new block is \"stacked\" per day, so we can call that \"stack position\" (0 to 26, 1 to 27)\n let yAdjStack = - stack * 24\n\n // each week is a lane position (0 to 51, 1 to 52)\n\n let xAdjLane = lane * 21\n let yAdjLane = lane * 12\n \n\n let xPosition = xRef + xAdjRow + xAdjLane \n let yPosition = yRef + yAdjRow + yAdjStack + yAdjLane\n\n return {x: xPosition, y: yPosition}\n \n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":659,"value":"$46","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":189,"value":"generatedColors = {\n\n let spinArray = []\n \n for (let i = 10; i <= 360; i += 10){\n spinArray.push(i);\n }\n\n let colors = spinArray.map(val => {\n\n let init = \"caf\" //\"#caf\" // \"#a8c\" // \"#ff0\"\n\n let color = tinycolor(init).spin(val).toHexString()\n\n // let color = tinycolor.random().toHexString()\n \n let darker5 = tinycolor(color).darken(5).toString()\n let darker10 = tinycolor(color).darken(10).toString()\n let darker15 = tinycolor(color).darken(15).toString()\n\n return [color, darker5, darker10, darker15]\n \n })\n\n return colors \n \n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":219,"value":"colorOptions = {\n\n return swatches([].concat(...generatedColors))\n \n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":224,"value":"viewof colorSelect = Inputs.color({label: \"Color\", value: '#00affa'})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":596,"value":"colorMatrix = {\n\n let blockColors = generatedColors.map((hex, idx) => {\n\n let classString = `.color-${idx}{--right: ${hex[0]}; --top: ${hex[1]}; --left: ${hex[2]}; --stroke: ${hex[3]};}`\n\n return {idx, hex, class: classString}\n\n })\n\n console.log(blockColors)\n\n return blockColors\n\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":560,"value":"$47","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":407,"value":"sampleData = {\n\n // playground for data structures\n\n // using the \"date picker\", we could push the minimal data needed to position blocks\n\n let timeCoords = {\n day: 0,\n lane: 0,\n stack: 0\n }\n\n // for each unique \"date\" (day), we should count the total \"blocks\" and give them a stack positon based on the order they were created in\n\n // maybe these are not needed if we did a \"fill\" order in some type of default position?\n let denseCoords = {\n row: 0,\n column: 0,\n vert: 0\n }\n\n return {timeCoords, denseCoords}\n \n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":856,"value":"viewof blockDetails = Inputs.form([\n Inputs.form({\n Contributors: Inputs.select(config.people, { multiple: true, label: \"Contributors\", format: x => x.name}),\n Date: Inputs.date({label: \"Date\", value: Date.now() - new Date().getTimezoneOffset()*60*1000}),\n Type: Inputs.select(config.blockTypes, { label: \"Block Type\", format: x => x.name}),\n }),\n Inputs.form({\n qty: Inputs.range([1, 10], { label: \"Blocks\", step: 1, value: 1}),\n altruism: Inputs.checkbox([\"Self\", \"Others\", \"Animals\", \"Earth\"], { multiple: true, label: \"Altruism Intention\" }),\n frame: Inputs.select(config.frames, {label: \"Intended Frame\", format: x => x.name}),\n })\n], {template: inputs => htl.html`

Main Details

${inputs[0]}

Extra Details

${inputs[1]}

`})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":971,"value":"viewof addNewBlock = Inputs.button(html`

Add Block\n

`, {value: null, reduce: () => addBlock(blockDetails)})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":990,"value":"visualizeTheseBlock = []","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1003,"value":"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":944,"value":"addBlock = (entry) => {\n\n visualizeTheseBlock.push(entry)\n\n console.log(\"this ran\", entry)\n\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":842,"value":"config = {\n\n // List of people who we'll for these value blocks\n let people = [\n {name: \"Lindsay\", location: \"Los Angeles, California\"},\n {name: \"Bob\", location: \"Los Angeles, California\"}\n ]\n\n // Block types can be added or edited here\n let blockTypes = [\n {name: \"Sleep\", group: \"Life\"},\n {name: \"Creation\", group: \"Work\"}\n ]\n\n // Add Frames here\n let frames = [\n {name: \"Health\", type: \"Cause\"},\n {name: \"Be:Cause\", type: \"Project\", links: ['Vegan', 'Health']}\n ]\n\n return {people, blockTypes, frames}\n\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1174,"value":"$48","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1267,"value":"$49","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1810,"value":"reassemble = {\n\n let parsed = journalData.parsed\n\n let rendered = parsed.map(row => {\n \n let blocks = row.blocks.raw.join('')\n let words = row.text\n let emojis = row.vibes\n\n let main = blocks + \" \" + words + \" \" + emojis\n\n\n let frame = row.frame\n let forWho = row.who ? row.who.join(',') : null\n let group = row.group\n // let type = row.type\n let labels = {frame, forWho, group}\n\n \n let details = row.details\n\n return {main, labels, details}\n })\n\n return rendered\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1256,"value":"---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1117,"value":"viewof pastedBlockJournal = Inputs.textarea({label: \"Paste Your Single Day Block Journal\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1004,"value":"$4a","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1184,"value":"//serverTestResp = (await fetch(\"https://9496-2600-1012-a001-e742-c993-9e6f-3e24-ba26.ngrok-free.app\")).text()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":211,"value":"function swatches(colors) {\n return html`${colors.map(c => `

`)}`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":182,"value":"tinycolor = require('tinycolor2')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1296,"value":"emojiBlocksIndex = {\n\n let emojiList = [\"🟥\", \"🟧\", \"🟨\", \"🟩\", \"🟦\", \"🟪\", \"⬛️\", \"⬜️\", \"🟫\"]\n let colors = [\"red\", \"darkorange\", \"gold\", \"forestgreen\", \"blue\", \"darkviolet\", \"black\", \"silver\", \"saddlebrown\"]\n let colorCodes = [\"RED\", \"ORNG\", \"YLW\", \"GRN\", \"BLU\", \"PRPL\", \"BLK\", \"SLV\", \"BRN\"]\n\n let objList = emojiList.map((emoji, idx) => {\n let color = colors[idx]\n let hexColor = tinycolor(color).toHexString()\n let colorCode = colorCodes[idx]\n let hexCode = emoji.codePointAt(0).toString(16)\n // let reDraw = String.fromCodePoint(\"0x\"+hexCode);\n\n let l10 = tinycolor(color).lighten(10).toString()\n let l20 = tinycolor(color).lighten(20).toString()\n let l30 = tinycolor(color).lighten(30).toString()\n\n let cbHxClrs = [l30, l20, l10, hexColor]\n\n let clrClass = `.emj-clr-${idx}{--right: ${cbHxClrs[0]}; --top: ${cbHxClrs[1]}; --left: ${cbHxClrs[2]}; --stroke: ${cbHxClrs[3]};}`\n \n return {emoji, color, hexColor, colorCode, hexCode, cbHxClrs, clrClass}\n })\n\n return objList\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1393,"value":"emojiColors3D = {\n return swatches([].concat(...(emojiBlocksIndex.map(c => c.cbHxClrs))))\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1474,"value":"emjBlckClasses = {\n let blcEmjClasses = emojiBlocksIndex.map(c => c.clrClass)\n let cssClasses = blcEmjClasses.join('\\n')\n return html``\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1531,"value":"$4b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1565,"value":"tinyColorPallet = {\n let tcArray = Object.values(tcColorNames)\n let hex = tcArray.map(c => '#' + c)\n return swatches(hex)\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1575,"value":"$4c","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1730,"value":"$4d","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"}],"files":"$W4e","stdlib":"1"}} 44:"$43:body"