js/main.js

   1 /*
   2  *      Copyright 2013  Samsung Electronics Co., Ltd
   3  *
   4  *      Licensed under the Flora License, Version 1.1 (the "License");
   5  *      you may not use this file except in compliance with the License.
   6  *      You may obtain a copy of the License at
   7  *
   8  *              http://floralicense.org/license/
   9  *
  10  *      Unless required by applicable law or agreed to in writing, software
  11  *      distributed under the License is distributed on an "AS IS" BASIS,
  12  *      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13  *      See the License for the specific language governing permissions and
  14  *      limitations under the License.
  15  */
  16
  17 /*jslint devel: true*/
  18 /*global $, Audio, window, tizen, app: true */
  19 var piano;
  20 function Piano() {
  21         "use strict";
  22 }
  23
  24 (function () {
  25         "use strict";
  26         Piano.prototype = {
  27                 touchPianoKey: [],
  28                 lockIds: {},
  29                 audio: [],
  30                 whiteCache: null,
  31                 blackCache: null
  32         };
  33
  34         Piano.prototype.bindEvents = function bindEvents() {
  35                 var self = this;
  36
  37                 $(".button").bind('touchstart touchmove', function (e) { self.onPianoKeyTouchDown(e); });
  38                 $(".button").bind('touchend', function (e) { self.onPianoKeyTouchUp(e); });
  39                 $('#back').bind('touchstart', function (event) {
  40                         event.preventDefault();
  41                         event.stopPropagation();
  42                         $(this).addClass('active');
  43                         tizen.application.getCurrentApplication().exit();
  44                 });
  45
  46                 $(window).on('tizenhwkey', function (e) {
  47                         if (e.originalEvent.keyName === "back") {
  48                                 tizen.application.getCurrentApplication().exit();
  49                         }
  50                 });
  51
  52                 $('#back').bind('touchend', function (event) {
  53                         $(this).removeClass('active');
  54                 });
  55
  56                 document.addEventListener('webkitvisibilitychange', function () {
  57                         if (document.webkitVisibilityState === 'visible') {
  58                                 self.audioInit()
  59                         }
  60                 })
  61         };
  62
  63         Piano.prototype.onPianoKeyTouchDown = function onPianoKeyTouchDown(data) {
  64                 data.originalEvent.preventDefault();
  65                 var element, touch, i, len;
  66                 for (i = 0, len = data.originalEvent.changedTouches.length; i < len; i += 1) {
  67                         touch = data.originalEvent.changedTouches[i];
  68                         element = document.elementFromPoint(touch.clientX, touch.clientY);
  69                         if (element) {
  70                                 if (this.touchPianoKey[touch.identifier] !== element.id) {
  71                                         $('#' + this.touchPianoKey[touch.identifier]).removeClass('pressed');
  72                                         this.playAudioByElement(element, touch.identifier, function () {
  73                                                 this.lockIds[element.id] = true;
  74                                         });
  75                                 }
  76                         }
  77                 }
  78         };
  79
  80         Piano.prototype.onPianoKeyTouchUp = function onPianoKeyTouchUp(data) {
  81                 var i, touchId, len, buttonId;
  82                 for (i = 0, len = data.originalEvent.changedTouches.length; i < len; i += 1) {
  83                         touchId = data.originalEvent.changedTouches[i].identifier;
  84                         buttonId = this.touchPianoKey[touchId];
  85                         setTimeout(function () {
  86                                 (function (id) {
  87                                         $('#' + id).removeClass('pressed');
  88                                 })(buttonId);
  89                         }, 100);
  90                         this.touchPianoKey[touchId] = undefined;
  91                 }
  92         };
  93
  94         Piano.prototype.audioInit = function audioInit() {
  95                 var i, self = this;
  96                 for (i = 0; i <= 13; i += 1) {
  97                         this.audio[i] = document.createElement('audio');
  98                         this.audio[i].name = i;
  99                         this.audio[i].addEventListener("playing", function(){
 100                                 self.lockIds["play" + this.name] = false;
 101                         });
 102                 }
 103         };
 104
 105         /**
 106          * Plays sound for specified element
 107          * @param {Object} element
 108          * @param {Number} touchId
 109          */
 110         Piano.prototype.playAudioByElement = function playAudioByElement(element, touchId, callback) {
 111                 var nrAudio = parseInt(element.id.substr(4), 10);
 112                 $(element).addClass('pressed');
 113                 this.touchPianoKey[touchId] = element.id;
 114                 if (this.audio[nrAudio]) {
 115                         if (this.audio[nrAudio].src) {
 116                                 try {
 117                                         this.audio[nrAudio].pause();
 118                                         this.audio[nrAudio].currentTime = 0;
 119                                 } catch (err) {
 120                                         console.error(err);
 121                                 }
 122                         } else {
 123                                 this.audio[nrAudio].src = this.audio[nrAudio].name + ".wav";
 124                         }
 125                         this.audio[nrAudio].play();
 126                         if (callback instanceof Function) {
 127                                 callback.call(this);
 128                         }
 129                 }
 130         };
 131
 132         Piano.prototype.cacheImages = function cacheImages() {
 133                 this.whiteCache = new Image();
 134                 this.whiteCache.src = "white_pressed.png";
 135                 this.blackCache = new Image();
 136                 this.blackCache.src = "black_pressed.png";
 137         };
 138
 139         Piano.prototype.init = function init() {
 140                 this.cacheImages();
 141                 this.bindEvents();
 142                 this.audioInit();
 143         };
 144 }());
 145
 146 piano = new Piano();
 147 $(document).ready(function () {
 148         "use strict";
 149         piano.init();
 150 });