Skip to content

Instantly share code, notes, and snippets.

View bkardell's full-sized avatar

Brian Kardell bkardell

156 followers · 12 following
View GitHub Profile
@bkardell
bkardell / element queries.html
Last active December 16, 2015 08:29
<!doctype html>
<html>
<head>
<title>Min-width/Max-with prollyfill in JS</title>
<!-- link up the latest hitchjs -->
<script src="http://hitchjs.com/dist/hitch-0.6.3.min.js"></script>
<!-- mark a style or link tag with the data-hitch-interpret flag -->
<style data-hitch-interpret>
@bkardell
bkardell / simple-example-for-chris.html
Last active December 19, 2015 03:39
A simple example for Chris Coyier.. I think this is pretty straightfordward - it is the equivalent of a jquery selector plugin example by james padosley (below) /* from http://james.padolsey.com/javascript/extending-jquerys-selector-capabilities/ */ $.extend($.expr[':'],{ external: function(a,i,m) { if(!a.href) {return false;} return a.hostname …
<!DOCTYPE html>
<html>
<head>
<script src="//hitchjs.com/dist/hitch-0.6.3.js"></script>
<script>
/*
You can do this manually via imperative API before CSS, but generally you would
use @-hitch-requires in your CSS to keep a declarative link between the
selector implementations and the CSS
@bkardell
bkardell / example.md
Last active December 20, 2015 01:48
Very early pass on a universal parse output model for CSS based on Tab Atkin's CSS parser... This is currently functional (on my local)

given the following CSS (inside the style tags below) input...

<style>
    html, body{
        width: 100%;
        height: 100%;
        margin: 0;
        font-family: helvetica, arial, sans-serif;
    }
@bkardell
bkardell / animationTest.html
Last active December 20, 2015 19:48
<html>
<head>
<style>
@keyframes nodeInserted {
from {
clip: rect(1px, auto, auto, auto);
}
to {
clip: rect(0px, auto, auto, auto);
}
@bkardell
bkardell / worker.js
Last active December 20, 2015 20:19
var results = [];
function resultReceiver(event) {
results.push(parseInt(event.data));
if (results.length == 2) {
postMessage(results[0] + results[1]);
}
}
function errorReceiver(event) {
@bkardell
bkardell / example.html
Last active December 21, 2015 23:19
pre-domcontentloaded callbacks example
<!DOCTYPE html>
<html>
<head>
<script>
var start = Date.now(),
live,
contentLoaded,
report = function (str, cb) {
console.log(str);
@bkardell
bkardell / BufferedParseObserver.html
Last active December 22, 2015 09:38
demo for discussion
<!doctype html>
<html>
<head>
<link type="text/promised-json"
data-src="https://rawgithub.com/gnip/764239/raw/6c6a2297f3e4e29a626f07db0c57b45af7d7e5d7/Twitter+%28json+format%29.js"
data-promise="my.twitter.data">
<link type="text/promised-script"
data-src="https://rawgithub.com/wycats/handlebars.js/1.0.0/dist/handlebars.js"
@bkardell
bkardell / oasis-issue.html
Last active December 22, 2015 23:19
<!doctype html>
<html>
<head>
<title>Test</title>
<script src="../oasis/javascript/oasis.js.html"></script>
</head>
<body>
<textarea rows="40" cols="80" id="results"></textarea>
@bkardell
bkardell / FFDevToolsOutput
Last active December 23, 2015 00:09
appcache woes
Manifest URI: http://127.0.0.1/~bkardell/iframes/child.appcache
URI http://127.0.0.1/~bkardell/iframes/file1.js is referenced in multiple locations. This is not allowed: [{"line":7,"section":"CACHE","original":"file1.js"},{"line":11,"section":"NETWORK","original":"file1.js"}].
NETWORK section line 11 (file1.js) prevents caching of line 7 (file1.js) in the CACHE section.
NETWORK section line 11 (file1.js) prevents caching of line 11 (file1.js) in the NETWORK section.
NETWORK section line 12 (file2.js) prevents caching of line 12 (file2.js) in the NETWORK section.
The file http://127.0.0.1/~bkardell/iframes/file2.js was modified after http://127.0.0.1/~bkardell/iframes/child.appcache. Unless the text in the manifest file is changed the cached version will be used instead at line 12.
NETWORK section line 13 (jquery.min.js) prevents caching of line 13 (jquery.min.js) in the NETWORK section.
@bkardell
bkardell / example.html
Last active December 23, 2015 13:39
<!DOCTYPE html>
<html>
<head>
<title>simple</title>
<script src="https://rawgithub.com/x-tag/core/master/dist/x-tag-core.js"></script>
<script>
xtag.register("x-test", {
lifecycle: {
/* "Whenever a tag is recognized and parsed on load"... This won't fire in this test. */
created: function () {