src/mojo/spy/ui/spy.js

   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 });