Snippets

Gravitywell AwfulJS

Created by Lucian Buzzo
View revision

File awful.js Added

  • Ignore whitespace
  • Hide word diff 
+;(function () {
+  function Awful(id, value) {
+    this.container = window[id];
+    this.contentAttribute = (this.container.value === undefined ? 'innerText' : 'value');
+    value !== undefined && (this.container[contentAttribute] = value);
+  }
+  Awful.prototype.set = function(value) {
+    this.container[this.contentAttribute] = value;
+  };
+  Awful.prototype.value = function() {
+    return this.container[this.contentAttribute];
+  };
+  Awful.prototype.toggle = function() {
+    this.container.hidden = !this.container.hidden;
+  };
+  Awful.prototype.on = function(eventName, fn) {
+    if(eventName = 'on' + eventName, container.hasOwnProperty(eventName)) {
+      container[eventName] = fn;
+    } else {
+      return false;
+    }
+  };
+
+  window.Awful = Awful;
+}());

File index.html Added

  • Ignore whitespace
  • Hide word diff 
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>AwfulJS</title>
+  <style>
+    body {
+      font-family: arial, sans-serif;
+      padding: 0 15px;
+    }
+  </style>
+</head>
+<body>
+  <h1><span id="awful_output">AwfulJS</span> example</h1>
+  <div id="container">
+    <label for="awful_input">Type a value</label>
+    <input id="awful_input" type="text" value=""/>
+  </div>
+
+  <script src="awful.js"></script>
+  <script>
+    (function() {
+      var inny = new Awful('awful_input');
+      var outty = new Awful('awful_output');
+      inny.on('keyup', function(e) {
+        outty.set(inny.value());
+      });
+    }());
+  </script>
+</body>
+</html>
HTTPS SSH

You can clone a snippet to your computer for local editing. Learn more.