estrattonbailey · April 29, 2016 21:34
diff --git a/index.js b/index.js
 // require() some stuff from npm (like you were using browserify)
 // and then hit Run Code to run it on the right
 var observable = require('lookoutjs');

 function on(event, element, observable, property, callback){
  element.addEventListener(event, function(e){
    observable[property] = e.target.value;
    callback(observable[property])
  }, false);
 }

 var dateTime = observable({
    date: '2016-02-18',
    time: '14:12',
    output: this.date + ' @ ' + this.time
 });

 var select = document.querySelector('.js-date');

 on('change', select, dateTime, 'time', function(data){
  console.log(data);
  
 	console.dir(dateTime);
 });
diff --git a/minified.js b/minified.js
 setTimeout(function(){require=function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s}({1:[function(require,module,exports){"use strict";var isObject=require("isobject");function isObjectObject(o){return isObject(o)===true&&Object.prototype.toString.call(o)==="[object Object]"}module.exports=function isPlainObject(o){var ctor,prot;if(isObjectObject(o)===false)return false;ctor=o.constructor;if(typeof ctor!=="function")return false;prot=ctor.prototype;if(isObjectObject(prot)===false)return false;if(prot.hasOwnProperty("isPrototypeOf")===false){return false}return true}},{isobject:2}],2:[function(require,module,exports){"use strict";module.exports=function isObject(val){return val!=null&&typeof val==="object"&&!Array.isArray(val)}},{}],lookoutjs:[function(require,module,exports){(function(global){(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}(g.index||(g.index={})).js=f()}})(function(){var define,module,exports;var isObj=require("is-plain-object");var proto={listeners:{},watch:function(key,cb){var key=key||"all";if(!this.listeners[key]){this.listeners[key]={queue:[]}}this.listeners[key].queue.push(cb)},publish:function(key,val){if(!this.listeners[key])return;this.listeners[key].queue.forEach(function(fn,i){fn(val)})}};function Lookout(source){var target;if(!isObj(source))return console.log("%cPassed parameter ("+source+") is not an object.","background-color:#ff4567;color:#333333");target=Object.create(proto,{props:{value:source}});Object.keys(source).forEach(function(key){Object.defineProperty(target,key,{set:function(val){this.props[key]=val;this.publish(key,val)},get:function(){return this.props[key]},configurable:true})});return target}return Lookout})}).call(this,typeof global!=="undefined"?global:typeof self!=="undefined"?self:typeof window!=="undefined"?window:{})},{"is-plain-object":1}]},{},[]);var observable=require("lookoutjs");function on(event,element,observable,property,callback){element.addEventListener(event,function(e){observable[property]=e.target.value;callback(observable[property])},false)}var dateTime=observable({date:"2016-02-18",time:"14:12",output:this.date+" @ "+this.time});var select=document.querySelector(".js-date");on("change",select,dateTime,"time",function(data){console.log(data);console.dir(dateTime)})},0);
diff --git a/package.json b/package.json
 {
  "name": "requirebin-sketch",
  "version": "1.0.0",
  "dependencies": {
    "lookoutjs": "0.0.6"
  }
 }
diff --git a/page-body.html b/page-body.html
 <!-- contents of this file will be placed inside the <body> -->
 <select class="js-date">
  <option value="01:00">1</option>
  <option value="02:00">2</option>
  <option value="03:00">3</option>
 </select>
diff --git a/page-head.html b/page-head.html
 <!-- contents of this file will be placed inside the <head> -->
diff --git a/requirebin.md b/requirebin.md
	// require() some stuff from npm (like you were using browserify)
	// and then hit Run Code to run it on the right
	var observable = require('lookoutjs');

	function on(event, element, observable, property, callback){
	element.addEventListener(event, function(e){
	observable[property] = e.target.value;
	callback(observable[property])
	}, false);
	}

	var dateTime = observable({
	date: '2016-02-18',
	time: '14:12',
	output: this.date + ' @ ' + this.time
	});

	var select = document.querySelector('.js-date');

	on('change', select, dateTime, 'time', function(data){
	console.log(data);

	console.dir(dateTime);
	});
	{
	"name": "requirebin-sketch",
	"version": "1.0.0",
	"dependencies": {
	"lookoutjs": "0.0.6"
	}
	}
	<!-- contents of this file will be placed inside the <body> -->
	<select class="js-date">
	<option value="01:00">1</option>
	<option value="02:00">2</option>
	<option value="03:00">3</option>
	</select>