| // Copyright 2014 The Chromium Authors. All rights reserved. |
| // Use of this source code is governed by a BSD-style license that can be |
| // found in the LICENSE file. |
| |
| 'use strict'; |
| |
| tvcm.require('tvcm.utils'); |
| tvcm.require('tvcm.ui'); |
| tvcm.requireTemplate('ui.spy'); |
| |
| tvcm.exportTo('ui', function() { |
| /** |
| * @constructor |
| */ |
| var LogMessage = tvcm.ui.define('x-spy-log-message'); |
| |
| LogMessage.prototype = { |
| __proto__: HTMLUnknownElement.prototype, |
| |
| decorate: function() { |
| }, |
| |
| get message() { |
| return message_; |
| }, |
| |
| set message(message) { |
| this.message_ = message; |
| this.textContent = JSON.stringify(message); |
| } |
| }; |
| |
| |
| /** |
| * @constructor |
| */ |
| var Spy = tvcm.ui.define('x-spy'); |
| |
| Spy.prototype = { |
| __proto__: HTMLUnknownElement.prototype, |
| |
| decorate: function() { |
| var node = tvcm.instantiateTemplate('#x-spy-template'); |
| this.appendChild(node); |
| |
| this.channel_ = undefined; |
| this.onMessage_ = this.onMessage_.bind(this); |
| |
| var commandEl = this.querySelector('#command'); |
| commandEl.addEventListener('keydown', function(e) { |
| if (e.keyCode == 13) { |
| e.stopPropagation(); |
| this.onCommandEntered_(); |
| } |
| }.bind(this)); |
| |
| this.updateDisabledStates_(); |
| }, |
| |
| get channel() { |
| return channel_; |
| }, |
| |
| set channel(channel) { |
| if (this.channel_) |
| this.channel_.removeEventListener('message', this.onMessage_); |
| this.channel_ = channel; |
| if (this.channel_) |
| this.channel_.addEventListener('message', this.onMessage_); |
| this.updateDisabledStates_(); |
| }, |
| |
| updateDisabledStates_: function() { |
| var connected = this.channel_ !== undefined; |
| |
| this.querySelector('#command').disabled = !connected; |
| }, |
| |
| onCommandEntered_: function(cmd) { |
| var commandEl = this.querySelector('#command'); |
| this.channel_.send(JSON.stringify(commandEl.value)); |
| commandEl.value = ''; |
| }, |
| |
| onMessage_: function(message) { |
| var messageEl = new LogMessage(); |
| messageEl.message = message.data; |
| this.querySelector('messages').appendChild(messageEl); |
| } |
| |
| }; |
| |
| return { |
| Spy: Spy |
| }; |
| }); |