view.js revision 731df977c0511bca2206b5f333555b1205ff1f43
1c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch// Copyright (c) 2010 The Chromium Authors. All rights reserved. 2c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch// Use of this source code is governed by a BSD-style license that can be 3c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch// found in the LICENSE file. 4c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 5c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch/** 6c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch * Base class to represent a "view". A view is an absolutely positioned box on 7c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch * the page. 8c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch * 9c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch * @constructor 10c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch */ 11c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdochfunction View() { 12c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch this.isVisible_ = true; 13c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch} 14c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 15c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch/** 16c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch * Called to reposition the view on the page. Measurements are in pixels. 17c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch */ 18c407dc5cd9bdc5668497f21b26b09d988ab439deBen MurdochView.prototype.setGeometry = function(left, top, width, height) { 19c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch this.left_ = left; 20c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch this.top_ = top; 21c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch this.width_ = width; 22c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch this.height_ = height; 23c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch}; 24c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 25c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch/** 26c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch * Called to show/hide the view. 27c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch */ 28c407dc5cd9bdc5668497f21b26b09d988ab439deBen MurdochView.prototype.show = function(isVisible) { 29c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch this.isVisible_ = isVisible; 30c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch}; 31c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 32c407dc5cd9bdc5668497f21b26b09d988ab439deBen MurdochView.prototype.isVisible = function() { 33c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch return this.isVisible_; 34c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch}; 35c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 36731df977c0511bca2206b5f333555b1205ff1f43Iain Merrick/** 37731df977c0511bca2206b5f333555b1205ff1f43Iain Merrick * Method of the observer class. 38731df977c0511bca2206b5f333555b1205ff1f43Iain Merrick * 39731df977c0511bca2206b5f333555b1205ff1f43Iain Merrick * Called to check if an observer needs the data it is 40731df977c0511bca2206b5f333555b1205ff1f43Iain Merrick * observing to be actively updated. 41731df977c0511bca2206b5f333555b1205ff1f43Iain Merrick */ 42731df977c0511bca2206b5f333555b1205ff1f43Iain MerrickView.prototype.isActive = function() { 43731df977c0511bca2206b5f333555b1205ff1f43Iain Merrick return this.isVisible(); 44731df977c0511bca2206b5f333555b1205ff1f43Iain Merrick}; 45731df977c0511bca2206b5f333555b1205ff1f43Iain Merrick 46c407dc5cd9bdc5668497f21b26b09d988ab439deBen MurdochView.prototype.getLeft = function() { 47c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch return this.left_; 48c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch}; 49c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 50c407dc5cd9bdc5668497f21b26b09d988ab439deBen MurdochView.prototype.getTop = function() { 51c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch return this.top_; 52c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch}; 53c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 54c407dc5cd9bdc5668497f21b26b09d988ab439deBen MurdochView.prototype.getWidth = function() { 55c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch return this.width_; 56c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch}; 57c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 58c407dc5cd9bdc5668497f21b26b09d988ab439deBen MurdochView.prototype.getHeight = function() { 59c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch return this.height_; 60c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch}; 61c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 62c407dc5cd9bdc5668497f21b26b09d988ab439deBen MurdochView.prototype.getRight = function() { 63c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch return this.getLeft() + this.getWidth(); 64c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch}; 65c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 66c407dc5cd9bdc5668497f21b26b09d988ab439deBen MurdochView.prototype.getBottom = function() { 67c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch return this.getTop() + this.getHeight(); 68c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch}; 69c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 70731df977c0511bca2206b5f333555b1205ff1f43Iain MerrickView.prototype.setParameters = function(params) {}; 71c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 72c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch//----------------------------------------------------------------------------- 73c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 74c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch/** 75c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch * DivView is an implementation of View that wraps a DIV. 76c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch * 77c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch * @constructor 78c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch */ 79c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdochfunction DivView(divId) { 80c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch View.call(this); 81c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 82c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch this.node_ = document.getElementById(divId); 83c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 84c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch // Initialize the default values to those of the DIV. 85c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch this.width_ = this.node_.offsetWidth; 86c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch this.height_ = this.node_.offsetHeight; 87c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch this.isVisible_ = this.node_.style.display != 'none'; 88c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch} 89c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 90c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdochinherits(DivView, View); 91c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 92c407dc5cd9bdc5668497f21b26b09d988ab439deBen MurdochDivView.prototype.setGeometry = function(left, top, width, height) { 93c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch DivView.superClass_.setGeometry.call(this, left, top, width, height); 94c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 95731df977c0511bca2206b5f333555b1205ff1f43Iain Merrick this.node_.style.position = 'absolute'; 96c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch setNodePosition(this.node_, left, top, width, height); 97c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch}; 98c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 99c407dc5cd9bdc5668497f21b26b09d988ab439deBen MurdochDivView.prototype.show = function(isVisible) { 100c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch DivView.superClass_.show.call(this, isVisible); 101c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch setNodeDisplay(this.node_, isVisible); 102c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch}; 103c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 104c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch/** 105c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch * Returns the wrapped DIV 106c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch */ 107c407dc5cd9bdc5668497f21b26b09d988ab439deBen MurdochDivView.prototype.getNode = function() { 108c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch return this.node_; 109c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch}; 110c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 111c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch//----------------------------------------------------------------------------- 112c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 113c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch/** 114c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch * Implementation of View that sizes its child to fit the entire window. 115c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch * 116c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch * @param {!View} childView 117c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch * 118c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch * @constructor 119c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch */ 120c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdochfunction WindowView(childView) { 121c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch View.call(this); 122c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch this.childView_ = childView; 123731df977c0511bca2206b5f333555b1205ff1f43Iain Merrick window.addEventListener('resize', this.resetGeometry.bind(this), true); 124c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch} 125c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 126c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdochinherits(WindowView, View); 127c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 128c407dc5cd9bdc5668497f21b26b09d988ab439deBen MurdochWindowView.prototype.setGeometry = function(left, top, width, height) { 129c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch WindowView.superClass_.setGeometry.call(this, left, top, width, height); 130c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch this.childView_.setGeometry(left, top, width, height); 131c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch}; 132c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 133c407dc5cd9bdc5668497f21b26b09d988ab439deBen MurdochWindowView.prototype.show = function() { 134c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch WindowView.superClass_.show.call(this, isVisible); 135c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch this.childView_.show(isVisible); 136c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch}; 137c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 138c407dc5cd9bdc5668497f21b26b09d988ab439deBen MurdochWindowView.prototype.resetGeometry = function() { 139c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch this.setGeometry(0, 0, window.innerWidth, window.innerHeight); 140c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch}; 141c407dc5cd9bdc5668497f21b26b09d988ab439deBen Murdoch 142