display_overscan.js revision 2a99a7e74a7f215066514fe81d2bfa6639d9eddd 
1// Copyright (c) 2013 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
5cr.define('options', function() {
6  var OptionsPage = options.OptionsPage;
7
8  /**
9   * Encapsulated handling of the 'DisplayOverscan' page.
10   * @constructor
11   */
12  function DisplayOverscan() {
13    OptionsPage.call(this, 'displayOverscan',
14                     loadTimeData.getString('displayOverscanPageTabTitle'),
15                     'display-overscan-page');
16  }
17
18  cr.addSingletonGetter(DisplayOverscan);
19
20  DisplayOverscan.prototype = {
21    __proto__: OptionsPage.prototype,
22
23    /**
24     * The ID of the target display.
25     * @private
26     */
27    id_: null,
28
29    /**
30     * The keyboard event handler function.
31     * @private
32     */
33    keyHandler_: null,
34
35    /**
36     * Initialize the page.
37     */
38    initializePage: function() {
39      OptionsPage.prototype.initializePage.call(this);
40
41      this.keyHandler_ = this.handleKeyevent_.bind(this);
42      $('display-overscan-operation-reset').onclick = function() {
43        chrome.send('reset');
44      };
45      $('display-overscan-operation-ok').onclick = function() {
46        chrome.send('commit');
47        OptionsPage.closeOverlay();
48      };
49      $('display-overscan-operation-cancel').onclick = function() {
50        OptionsPage.cancelOverlay();
51      };
52    },
53
54    /** @override */
55    handleCancel: function() {
56      // signals the cancel event.
57      chrome.send('cancel');
58      OptionsPage.closeOverlay();
59    },
60
61    /** @override */
62    didShowPage: function() {
63      if (this.id_ == null) {
64        OptionsPage.cancelOverlay();
65        return;
66      }
67
68      window.addEventListener('keydown', this.keyHandler_);
69      // Sets up the size of the overscan dialog based on DisplayOptions dialog.
70      var displayOptionsPage = $('display-options-page');
71      var displayOverscanPage = $('display-overscan-page');
72      displayOverscanPage.style.width =
73          displayOptionsPage.offsetWidth - 20 + 'px';
74      displayOverscanPage.style.minWidth = displayOverscanPage.style.width;
75      displayOverscanPage.style.height =
76          displayOptionsPage.offsetHeight - 50 + 'px';
77
78      // Moves the table to describe operation at the middle of the contents
79      // vertically.
80      var operationsTable = $('display-overscan-operations-table');
81      var buttonsContainer = $('display-overscan-button-strip');
82      operationsTable.style.top = buttonsContainer.offsetTop / 2 -
83          operationsTable.offsetHeight / 2 + 'px';
84
85      window.addEventListener('blur', DisplayOverscan.onWindowBlur);
86      $('display-overscan-operation-cancel').focus();
87      chrome.send('start', [this.id_]);
88    },
89
90    /** @override */
91    didClosePage: function() {
92      window.removeEventListener('blur', DisplayOverscan.onWindowBlur);
93      window.removeEventListener('keydown', this.keyHandler_);
94    },
95
96    /**
97     * Called when the overscan calibration is canceled at the system level,
98     * such like the display is disconnected.
99     * @private
100     */
101    onOverscanCanceled_: function() {
102      OptionsPage.cancelOverlay();
103    },
104
105    /**
106     * Sets the target display id. This method has to be called before
107     * navigating to this page.
108     * @param {string} id The target display id.
109     */
110    setDisplayId: function(id) {
111      this.id_ = id;
112    },
113
114    /**
115     * Key event handler to make the effect of display rectangle.
116     * @param {Event} event The keyboard event.
117     * @private
118     */
119    handleKeyevent_: function(event) {
120      switch (event.keyCode) {
121        case 37: // left arrow
122          if (event.shiftKey)
123            chrome.send('move', ['horizontal', -1]);
124          else
125            chrome.send('resize', ['horizontal', -1]);
126          event.preventDefault();
127          break;
128        case 38: // up arrow
129          if (event.shiftKey)
130            chrome.send('move', ['vertical', -1]);
131          else
132            chrome.send('resize', ['vertical', -1]);
133          event.preventDefault();
134          break;
135        case 39: // right arrow
136          if (event.shiftKey)
137            chrome.send('move', ['horizontal', 1]);
138          else
139            chrome.send('resize', ['horizontal', 1]);
140          event.preventDefault();
141          break;
142        case 40: // bottom arrow
143          if (event.shiftKey)
144            chrome.send('move', ['vertical', 1]);
145          else
146            chrome.send('resize', ['vertical', 1]);
147          event.preventDefault();
148          break;
149      }
150    }
151  };
152
153  DisplayOverscan.onWindowBlur = function() {
154    DisplayOverscan.getInstance().onOverscanCanceled_();
155  };
156
157  DisplayOverscan.onOverscanCanceled = function() {
158    DisplayOverscan.getInstance().onOverscanCanceled_();
159  };
160
161  // Export
162  return {
163    DisplayOverscan: DisplayOverscan
164  };
165});
166