git.r.bdr.sh - rbdr/r.bdr.sh/blob - jekyll/js/unlimited_pizza.js

   1 'use strict';
   2
   3 Class("UnlimitedPizza").inherits(Widget)({
   4
   5   /**
   6    * Gets instance, creates it if not available.
   7    */
   8   instance : function getInstance(config) {
   9     if (!this._mainInstance) {
  10       this._mainInstance = new this(config);
  11     }
  12     return this._mainInstance;
  13   },
  14
  15   prototype : {
  16     _fb : null,
  17     _loaded : false,
  18
  19     init : function (config) {
  20       Widget.prototype.init.call(this, config)
  21
  22       this._fb = new Firebase("https://guestbook-nsovocal.firebaseio.com");
  23
  24       this._bindInternalEvents();
  25     },
  26
  27     _bindInternalEvents : function bindInternalEvents() {
  28       this.bind('activate', this._onActivate.bind(this));
  29     },
  30
  31     _onActivate : function _activate() {
  32       // If this is the first time activating it... then load
  33       if (!this._loaded) {
  34         this._load();
  35       }
  36     },
  37
  38     /*
  39      * Loads everything.
  40      */
  41     _load : function _load() {
  42
  43       // Melty cheese is our header image widget.
  44       this._loadMeltyCheese();
  45
  46       // Pepperoni is our recording widget.
  47       this._loadPepperoni();
  48
  49       // Simple guestbook functionality
  50       this._loadGuestbook();
  51       this._loadPosts();
  52     },
  53
  54     _loadMeltyCheese : function () {
  55       this.element.find('.post-image').each(function (i, headerElement) {
  56
  57         // Create and activate
  58         this.appendChild(new UnlimitedPizza.MeltyCheese({
  59           element : $(headerElement),
  60           name : 'header-' + i
  61         }));
  62         this['header-' + i].activate();
  63       }.bind(this));
  64     },
  65
  66     _loadPepperoni : function () {
  67       this.element.find('.pepperoni-widget').each(function (i, widgetElement) {
  68
  69         // Create and activate
  70         this.appendChild(new UnlimitedPizza.Pepperoni({
  71           element : $(widgetElement),
  72           name : 'recorder-' + i
  73         }));
  74         this['recorder-' + i].activate();
  75       }.bind(this));
  76     },
  77
  78     _loadGuestbook : function () {
  79       var form = this.element.find('.guestbook-form form');
  80       form.on('submit', function submitPost(ev) {
  81         ev.preventDefault();
  82
  83         var formArray = form.serializeArray();
  84         var recorder = this['recorder-0'];
  85
  86         recorder.finalize(function (buffer) {
  87           var fb, arrayBuffer, fileReader;
  88
  89           if (buffer.size <= 44) {
  90             alert("You need to record something.");
  91             return;
  92           }
  93           if (formArray[0].value.length === 0) {
  94             alert("You need a name.");
  95             return;
  96           }
  97
  98           fb = this._fb;
  99
 100           fileReader = new FileReader();
 101           fileReader.onload = function() {
 102             var binary, bytes, length, i;
 103
 104             binary = '';
 105             bytes = new Uint8Array( this.result );
 106             length = bytes.byteLength;
 107             for (i = 0; i < length; i++) {
 108               binary += String.fromCharCode( bytes[ i ] );
 109             }
 110
 111             fb.push({
 112               buffer: btoa(binary),
 113               name: formArray[0].value
 114             });
 115             recorder.clear();
 116           };
 117           fileReader.readAsArrayBuffer(buffer);
 118         }.bind(this));
 119         return false;
 120       }.bind(this))
 121     },
 122
 123     _loadPosts : function () {
 124       var feed = this.element.find('.guestbook-feed');
 125
 126       console.log("Loadin", feed.length);
 127       if (feed.length > 0) {
 128         this._fb.on('value', function (data) {
 129           var posts, property, post;
 130
 131           // Clear feed
 132           feed.empty();
 133           posts = data.val();
 134
 135           for (property in posts) {
 136             if (posts.hasOwnProperty(property)) {
 137               post = posts[property];
 138
 139               feed.append($('<li>\
 140                     <div class="author">FROM: ' + post.name + '</div>\
 141                     <div class="content">\
 142                     <audio src="data:audio/wav;base64,' + post.buffer + '" controls></audio>\
 143                     </div></li>'))
 144             }
 145           }
 146         });
 147       }
 148     }
 149   }
 150 });