Skip to content

Instantly share code, notes, and snippets.

View nelsonpecora's full-sized avatar

Nelson Pecora nelsonpecora

View GitHub Profile
@nelsonpecora
nelsonpecora / rethinking_kiln_v2.md
Last active January 4, 2017 17:32
Rethinking Kiln v2: Templates and Models

Templates

Handlebars CAN do

  • auto-escaping data (use {{{ }}} to safe html)
  • built-in helpers: if/else/unless, each, with, lookup, log
  • comments
  • auto-trim whitespace (see notes)

Handlebars CANNOT do

@nelsonpecora
nelsonpecora / time logs
Created December 8, 2016 20:12
time logs for component GETs only (not resolving child components)
ad: 1ms
ad: 1ms
ad: 1ms
interactive-tile-topic: 1ms
interactive-tile-topic: 2ms
interactive-tile-topic: 1ms
interactive-tile-topic: 1ms
interactive-tile-topic: 1ms
interactive-tile-topic: 0ms
interactive-tile-topic: 1ms

Rethinking Kiln

Caching Schemas

currently: data + schema fetched every time and bound together to create forms

future: schema should be fetched once on load, data fetched and cached as needed

  • because schema doesn’t change until server restart, it can be heavily cached
  • could even be stored in localStorage, as long as we have some cachebusting mechanism (like the server generating a nonce key when it’s started)
@nelsonpecora
nelsonpecora / es6-controller-example.js
Last active September 9, 2016 16:42
This is an example of a component controller, written in ES6 module syntax and using the event module
import events from 'some-cool-name-for-events-library'; // formerly events.add()
import openNewPage from './services/panes/new-page'; // some internal service
import { get } from './services/state'; // some internal service
// some functions that are shared between component instances,
// same as dollar-slice controllers had before
// example referencing event handlers directly, with no arguments
function createPage(e) {
e.stopPropagation();
@nelsonpecora
nelsonpecora / ideal-layout.yaml
Last active August 25, 2016 21:50
Ideal layout areas
_description: |
A two column layout with special styling for our articles. Used for:
* regular article pages
* sponsored posts
* featured articles
head:
_componentList:
page: true

Components vs Head Components

Components Head Components
elements w/ data-uri attribute comments w/ data-uri
inside component list elements component list comments before and after
contains child components NO child components
inline, overlay, settings forms ONLY settings form
reloadComponent reloadHeadComponent
component-edit controller head-component-edit controller
@nelsonpecora
nelsonpecora / filterable-list-api.md
Last active August 5, 2016 20:23
Ideas for an api around filterable lists

Creating Filterable Lists

Pass in items and options

createFilterList(items, options);

Items can either be an array of strings (it uses label() to display them), or objects

Keybase proof

I hereby claim:

  • I am nelsonpecora on github.
  • I am keats (https://keybase.io/keats) on keybase.
  • I have a public key whose fingerprint is F2DC F699 0E2A 86CC 44A0 71B1 C9E9 E903 5B37 0065

To claim this, I am signing this object:

/*
* Quiz Text
* ==========================
*
* Generates JSON-formatted quiz questions from plaintext
*/
QuizText
= q:Question* { return q; }
{
"provider_url": "https://www.reddit.com/",
"version": "1.0",
"author_url": "https://www.reddit.com/user/Viper007Bond",
"title": "Viper007Bond's comment from discussion \"Devs: reddit now supports oEmbed for comment embeds\"",
"provider_name": "reddit",
"type": "rich",
"html": "<div class=\"reddit-embed\" data-embed-media=\"www.redditmedia.com\" data-embed-parent=\"false\" data-embed-live=\"false\" data-embed-uuid=\"17433fa0-4944-11e6-b462-0ed39e408755\" data-embed-created=\"2016-07-13T21:52:27.720982+00:00\"><a href=\"https://www.reddit.com/r/redditdev/comments/34c0pm/devs_reddit_now_supports_oembed_for_comment_embeds/cqtl26d\">Comment</a> from discussion <a href=\"https://www.reddit.com/r/redditdev/comments/34c0pm/devs_reddit_now_supports_oembed_for_comment_embeds/\">Viper007Bond's comment from discussion &quot;Devs: reddit now supports oEmbed for comment embeds&quot;</a>.</div>",
"author_name": "Viper007Bond"
}