Skip to content

Instantly share code, notes, and snippets.

Browserify and HTML

Today most people include bundle.js into their html:

<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
 javascript first
@anvaka
anvaka / index.js
Created September 10, 2014 02:42
requirebin sketch
var q = require('q');
doSomething().then(function(result) {
console.log('i am done', result);
});
function doSomething() {
return q.nfcall(ldap, 'jeff');
}
@anvaka
anvaka / index.js
Last active August 29, 2015 13:57
requirebin sketch
document.onload = function () {
require('typeahead.an'); // we are going to use typeahead in this demo
require('an').controller(DemoCtrl);
var module = require('an').flush(); // flush and bootstrap angular app
angular.bootstrap(document.body, [module.name]);
function DemoCtrl($scope, $http) {
$scope.getLocation = function(val) {
return $http.get('http://maps.googleapis.com/maps/api/geocode/json', {
@anvaka
anvaka / index.js
Created March 15, 2014 04:28
requirebin sketch
var Benchmark = require('benchmark');
var suite = new Benchmark.Suite;
var totalPropertiesOnObjectWithProto = 0;
var totalPropertiesOnObjectWithoutProto = 0;
var hasPrototype = {};
addStuff(hasPrototype);
var noPrototype = Object.create(null);
@anvaka
anvaka / index.js
Created March 14, 2014 20:19
requirebin sketch
var graph = require('ngraph.generators').noLinks(142);
graph.forEachNode(assignNiceColor);
var svg = require('ngraph.vivasvg')(graph);
svg.nodeTemplate("<circle r='5' fill='{{node.color}}'></circle>");
svg.linkTemplate("<arrow></arrow>'");
svg.run();
function assignNiceColor(node) {
var niceColors = ['#1f77b4', '#aec7e8', '#ff7f0e', '#ffbb78', '#2ca02c', '#98df8a', '#d62728', '#ff9896', '#9467bd', '#c5b0d5', '#8c564b', '#c49c94', '#e377c2', '#f7b6d2', '#7f7f7f', '#c7c7c7', '#bcbd22', '#dbdb8d', '#17becf', '#9edae5'];
@anvaka
anvaka / index.js
Created March 14, 2014 20:06
requirebin sketch
var graph = require('ngraph.generators').grid(10, 10);
var svg = require('ngraph.vivasvg')(graph);
svg.nodeTemplate(["<text y='-5'>{{id}}</text>",
"<circle r='5' fill='#00BFFF'></circle>"].join('\n'));
svg.linkTemplate("<arrow stroke='#D3D3D3' from='{{pos.from}}' to='{{pos.to}}' offset='8'></arrow>'");
svg.run();
@anvaka
anvaka / option1.js
Last active January 1, 2016 19:59
Imagine you have graph layout algorithm, which uses a physical engine. The engine has dozens of configuration options. What do you think is the best way to expose these options?
// engine is injected into layout:
var layout = forceBasedLayout(engine);
// Modify global gravity force:
engine.gravity(9.8);
// Modify drag coefficient:
engine.drag(0.1);
// ... you can also chain code above
// engine.gravity(9.8).drag(0.1);
@anvaka
anvaka / 0.nodes.js
Last active December 26, 2015 12:18
Trying to come up with API for graph traversal. API delays calculation of actual traversal as much as it can. That is, you do not actually starting graph traversal, until you call forEach() method.
// How to get all nodes?
traverse(graph)
.nodes()
.forEach(function(node) {
// node is here
});
// how to get all neighbors of startNodeId?
var grandChildren = traverse(graph)
.nodes()
🌀 🌁 🌂 🌃 🌄 🌅 🌆 🌇 🌈 🌉 🌊 🌋 🌌 🌍 🌎 🌏
🌐 🌑 🌒 🌓 🌔 🌕 🌖 🌗 🌘 🌙 🌚 🌛 🌜 🌝 🌞 🌟
🌠 🌡 🌢 🌣 🌤 🌥 🌦 🌧 🌨 🌩 🌪 🌫 🌬 🌭 🌮 🌯
🌰 🌱 🌲 🌳 🌴 🌵 🌶 🌷 🌸 🌹 🌺 🌻 🌼 🌽 🌾 🌿
🍀 🍁 🍂 🍃 🍄 🍅 🍆 🍇 🍈 🍉 🍊 🍋 🍌 🍍 🍎 🍏
🍐 🍑 🍒 🍓 🍔 🍕 🍖 🍗 🍘 🍙 🍚 🍛 🍜 🍝 🍞 🍟
🍠 🍡 🍢 🍣 🍤 🍥 🍦 🍧 🍨 🍩 🍪 🍫 🍬 🍭 🍮 🍯
🍰 🍱 🍲 🍳 🍴 🍵 🍶 🍷 🍸 🍹 🍺 🍻 🍼 🍽 🍾 🍿
🎀 🎁 🎂 🎃 🎄 🎅 🎆 🎇 🎈 🎉 🎊 🎋 🎌 🎍 🎎 🎏
🎐 🎑 🎒 🎓 🎔 🎕 🎖 🎗 🎘 🎙 🎚 🎛 🎜 🎝 🎞 🎟