Home | History | Annotate | Download | only in ui 
      1 // Copyright 2014 The Chromium Authors. All rights reserved.
      2 // Use of this source code is governed by a BSD-style license that can be
      3 // found in the LICENSE file.
      4 
      5 'use strict';
      6 
      7 tvcm.require('tvcm.utils');
      8 tvcm.require('tvcm.ui');
      9 tvcm.requireTemplate('ui.spy');
     10 
     11 tvcm.exportTo('ui', function() {
     12   /**
     13    * @constructor
     14    */
     15   var LogMessage = tvcm.ui.define('x-spy-log-message');
     16 
     17   LogMessage.prototype = {
     18     __proto__: HTMLUnknownElement.prototype,
     19 
     20     decorate: function() {
     21     },
     22 
     23     get message() {
     24       return message_;
     25     },
     26 
     27     set message(message) {
     28       this.message_ = message;
     29       this.textContent = JSON.stringify(message);
     30     }
     31   };
     32 
     33 
     34   /**
     35    * @constructor
     36    */
     37   var Spy = tvcm.ui.define('x-spy');
     38 
     39   Spy.prototype = {
     40     __proto__: HTMLUnknownElement.prototype,
     41 
     42     decorate: function() {
     43       var node = tvcm.instantiateTemplate('#x-spy-template');
     44       this.appendChild(node);
     45 
     46       this.channel_ = undefined;
     47       this.onMessage_ = this.onMessage_.bind(this);
     48 
     49       var commandEl = this.querySelector('#command');
     50       commandEl.addEventListener('keydown', function(e) {
     51         if (e.keyCode == 13) {
     52           e.stopPropagation();
     53           this.onCommandEntered_();
     54         }
     55       }.bind(this));
     56 
     57       this.updateDisabledStates_();
     58     },
     59 
     60     get channel() {
     61       return channel_;
     62     },
     63 
     64     set channel(channel) {
     65       if (this.channel_)
     66         this.channel_.removeEventListener('message', this.onMessage_);
     67       this.channel_ = channel;
     68       if (this.channel_)
     69         this.channel_.addEventListener('message', this.onMessage_);
     70       this.updateDisabledStates_();
     71     },
     72 
     73     updateDisabledStates_: function() {
     74       var connected = this.channel_ !== undefined;
     75 
     76       this.querySelector('#command').disabled = !connected;
     77     },
     78 
     79     onCommandEntered_: function(cmd) {
     80       var commandEl = this.querySelector('#command');
     81       this.channel_.send(JSON.stringify(commandEl.value));
     82       commandEl.value = '';
     83     },
     84 
     85     onMessage_: function(message) {
     86       var messageEl = new LogMessage();
     87       messageEl.message = message.data;
     88       this.querySelector('messages').appendChild(messageEl);
     89     }
     90 
     91   };
     92 
     93   return {
     94     Spy: Spy
     95   };
     96 });
     97