aboutsummaryrefslogtreecommitdiff
path: root/js/components/popup-manager.reel/popup-manager.js
diff options
context:
space:
mode:
authorPierre Frisch2011-12-22 07:25:50 -0800
committerValerio Virgillito2012-01-27 11:18:17 -0800
commitb89a7ee8b956c96a1dcee995ea840feddc5d4b27 (patch)
tree0f3136ab0ecdbbbed6a83576581af0a53124d6f1 /js/components/popup-manager.reel/popup-manager.js
parent2401f05d1f4b94d45e4568b81fc73e67b969d980 (diff)
downloadninja-b89a7ee8b956c96a1dcee995ea840feddc5d4b27.tar.gz
First commit of Ninja to ninja-internal
Signed-off-by: Valerio Virgillito <rmwh84@motorola.com>
Diffstat (limited to 'js/components/popup-manager.reel/popup-manager.js')
-rw-r--r--js/components/popup-manager.reel/popup-manager.js154
1 files changed, 154 insertions, 0 deletions
diff --git a/js/components/popup-manager.reel/popup-manager.js b/js/components/popup-manager.reel/popup-manager.js
new file mode 100644
index 00000000..be3c1e8d
--- /dev/null
+++ b/js/components/popup-manager.reel/popup-manager.js
@@ -0,0 +1,154 @@
1/* <copyright>
2This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5</copyright> */
6
7////////////////////////////////////////////////////////////////////////
8//
9var Montage = require("montage/core/core").Montage,
10 Component = require("montage/ui/component").Component,
11 Popup = require("js/components/popup.reel").Popup;
12////////////////////////////////////////////////////////////////////////
13//Exporting as PopupMananger
14exports.PopupMananger = Montage.create(Component, {
15 ////////////////////////////////////////////////////////////////////
16 //
17 deserializedFromTemplate: {
18 value: function () {
19 //Setting styles to popup container
20 this.element.style.zIndex = this._getNextHighestZindex(document.body); // Highest z-index in body
21 this.element.style.position = 'absolute';
22 this.element.style.top = 0;
23 this.element.style.left = 0;
24 this.element.style.width = '100%';
25 this.element.style.height = '100%';
26 //Allowing mouse events to pass through this layer
27 this.element.style.pointerEvents = 'none';
28 }
29 },
30 ////////////////////////////////////////////////////////////////////
31 //Adding the popup object
32 addPopup: {
33 enumerable: true,
34 value: function (popup, depth, blackout) {
35 //
36 //TODO: Add blackout background
37 //Checking for manual or setting auto to next highest depth
38 if (depth) {
39 popup.style.zIndex = depth;
40 } else {
41 popup.style.zIndex = this._getNextHighestZindex(this.element);
42 }
43 //Adding pointer events (inherits none)
44 popup.style.pointerEvents = 'auto';
45 this.element.appendChild(popup);
46 //TODO: Test further (perhaps defined in CSS)
47 popup.style.opacity = 0;
48 popup.style.webkitTransitionProperty = 'opacity';
49 popup.style.webkitTransitionDuration = '150ms';
50 //TODO: Fix animation hack
51 if (popup.style.webkitTransitionDuration) {
52 setTimeout(function () {popup.style.opacity = 1}.bind(this), parseInt(popup.style.webkitTransitionDuration));
53 } else {
54 popup.style.opacity = 1;
55 }
56 }
57 },
58 ////////////////////////////////////////////////////////////////////
59 //Removing the popup object
60 removePopup: {
61 enumerable: true,
62 value: function (popup) {
63 popup.style.opacity = 0;
64 //TODO: Fix animation hack
65 if (popup.style && popup.style.webkitTransitionDuration) {
66 setTimeout(function () {this.element.removeChild(popup)}.bind(this), parseInt(popup.style.webkitTransitionDuration));
67 } else {
68 this.element.removeChild(popup);
69 }
70 }
71 },
72 ////////////////////////////////////////////////////////////////////
73 //Swapping first with second object
74 swapPopup: {
75 enumerable: true,
76 value: function (first, second) {
77 var f = first.style.zIndex, s = second.style.zIndex;
78 //Setting after storing values
79 first.style.zIndex = s;
80 second.style.zIndex = f;
81 }
82 },
83 ////////////////////////////////////////////////////////////////////
84 //Setting Popup to highest z-index
85 bringToFrontPopup: {
86 enumerable: true,
87 value: function (popup) {
88 popup.style.zIndex = this._getNextHighestZindex(this.element);
89 }
90 },
91 ////////////////////////////////////////////////////////////////////
92 //
93 createPopup: {
94 enumerable: true,
95 value: function (content, position, tooltip) {
96 //Creating container for Popup
97 var container = document.createElement('div');
98 var pop = Popup.create();
99 //Setting container and content
100 pop.element = container;
101 pop.content = content;
102 //Checking for optional parameters
103 if (position)
104 pop.position = position;
105 if (tooltip)
106 pop.tooltip = tooltip;
107 //Adding Popup to view
108 this.addPopup(container);
109 pop.needsDraw = true;
110 //Returns pop component
111 return pop;
112 }
113 },
114 ////////////////////////////////////////////////////////////////////
115 //Accepts parent to scan for z-index and returns highest children
116 _getNextHighestZindex: {
117 numerable: false,
118 value: function (parent) {
119 //Adapcted from: http://greengeckodesign.com/blog/2007/07/get-highest-z-index-in-javascript.html
120 var high = 0, current = 0, children = [], i;
121 //
122 if (parent) {
123 children = parent.getElementsByTagName('*');
124 } else {
125 children = document.getElementsByTagName('*');
126 }
127 //
128 for (i=0; children[i]; i++) {
129 if (children[i].currentStyle) {
130 current = parseFloat(children[i].currentStyle['zIndex']);
131 } else if (window.getComputedStyle) {
132 current = parseFloat(document.defaultView.getComputedStyle(children[i],null).getPropertyValue('z-index'));
133 }
134 if(!isNaN(current) && current > high){
135 high = current;
136 }
137 }
138 //
139 return (high+10);
140 }
141 },
142 ////////////////////////////////////////////////////////////////////
143 //Dispatching "Change" event
144 _dispatchpopupEvent: {
145 enumerable: false,
146 value: function() {
147 var popupEvent = document.createEvent("CustomEvent");
148 popupEvent.initEvent("change", true, true);
149 popupEvent.type = "change";
150 this.dispatchEvent(popupEvent);
151 }
152 }
153 ////////////////////////////////////////////////////////////////////
154}); \ No newline at end of file