Adds the guestbook functionality.

[rbdr/r.bdr.sh] / jekyll / js / unlimited_pizza.js

diff --git a/jekyll/js/unlimited_pizza.js b/jekyll/js/unlimited_pizza.js
index 2dc7a7c0001e6cc8bf446208a56abba182bbdce1..af650ee3a52229399820678dd4e68c82a62977a4 100644 (file)
--- a/jekyll/js/unlimited_pizza.js
+++ b/jekyll/js/unlimited_pizza.js
@@ -13,11 +13,14 @@ Class("UnlimitedPizza").inherits(Widget)({
   },
 
   prototype : {
+    _fb : null,
     _loaded : false,
 
     init : function (config) {
       Widget.prototype.init.call(this, config)
 
+      this._fb = new Firebase("https://guestbook-nsovocal.firebaseio.com");
+
       this._bindInternalEvents();
     },
 
@@ -39,9 +42,16 @@ Class("UnlimitedPizza").inherits(Widget)({
 
       // Melty cheese is our header image widget.
       this._loadMeltyCheese();
+
+      // Pepperoni is our recording widget.
+      this._loadPepperoni();
+
+      // Simple guestbook functionality
+      this._loadGuestbook();
+      this._loadPosts();
     },
 
-    _loadMeltyCheese : function() {
+    _loadMeltyCheese : function () {
       this.element.find('.post-image').each(function (i, headerElement) {
 
         // Create and activate
@@ -51,6 +61,90 @@ Class("UnlimitedPizza").inherits(Widget)({
         }));
         this['header-' + i].activate();
       }.bind(this));
+    },
+
+    _loadPepperoni : function () {
+      this.element.find('.pepperoni-widget').each(function (i, widgetElement) {
+
+        // Create and activate
+        this.appendChild(new UnlimitedPizza.Pepperoni({
+          element : $(widgetElement),
+          name : 'recorder-' + i
+        }));
+        this['recorder-' + i].activate();
+      }.bind(this));
+    },
+
+    _loadGuestbook : function () {
+      var form = this.element.find('.guestbook-form form');
+      form.on('submit', function submitPost(ev) {
+        ev.preventDefault();
+
+        var formArray = form.serializeArray();
+        var recorder = this['recorder-0'];
+
+        recorder.finalize(function (buffer) {
+          var fb, arrayBuffer, fileReader;
+
+          if (buffer.size <= 44) {
+            alert("You need to record something.");
+            return;
+          }
+          if (formArray[0].value.length === 0) {
+            alert("You need a name.");
+            return;
+          }
+
+          fb = this._fb;
+
+          fileReader = new FileReader();
+          fileReader.onload = function() {
+            var binary, bytes, length, i;
+
+            binary = '';
+            bytes = new Uint8Array( this.result );
+            length = bytes.byteLength;
+            for (i = 0; i < length; i++) {
+              binary += String.fromCharCode( bytes[ i ] );
+            }
+
+            fb.push({
+              buffer: btoa(binary),
+              name: formArray[0].value
+            });
+            recorder.clear();
+          };
+          fileReader.readAsArrayBuffer(buffer);
+        }.bind(this));
+        return false;
+      }.bind(this))
+    },
+
+    _loadPosts : function () {
+      var feed = this.element.find('.guestbook-feed');
+
+      console.log("Loadin", feed.length);
+      if (feed.length > 0) {
+        this._fb.on('value', function (data) {
+          var posts, property, post;
+
+          // Clear feed
+          feed.empty();
+          posts = data.val();
+
+          for (property in posts) {
+            if (posts.hasOwnProperty(property)) {
+              post = posts[property];
+
+              feed.append($('<li>\
+                    <div class="author">FROM: ' + post.name + '</div>\
+                    <div class="content">\
+                    <audio src="data:audio/wav;base64,' + post.buffer + '" controls></audio>\
+                    </div></li>'))
+            }
+          }
+        });
+      }
     }
   }
 });