Skip to content

Instantly share code, notes, and snippets.

@estrattonbailey
Last active February 17, 2016 23:26
Show Gist options
  • Save estrattonbailey/8b70cec82d54718d5138 to your computer and use it in GitHub Desktop.
Save estrattonbailey/8b70cec82d54718d5138 to your computer and use it in GitHub Desktop.
requirebin sketch
// 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);
});
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]}})});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)});
{
"name": "requirebin-sketch",
"version": "1.0.0",
"dependencies": {
"lookoutjs": "0.0.4"
}
}
<!-- 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>
<!-- contents of this file will be placed inside the <head> -->
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment