1 <html> |
|
2 <head> |
|
3 <script type="text/javascript"> |
|
4 |
|
5 // Do any snippet initialization in a handler for the chrome.loadComplete signal. |
|
6 // Note that chrome may not be fully initialized when the html <body onload> event |
|
7 // is invoked, whereas chrome initialization is guaranteed to be complete when |
|
8 // this signal is invoked. |
|
9 |
|
10 function onChromeComplete() { |
|
11 window.chrome.setBackgroundColor(0xDD,0x66,0x33); |
|
12 window.snippets.BottomChromeId.setVisibilityAnimator("G_VISIBILITY_FLYOUT_ANIMATOR"); |
|
13 window.snippets.TopChromeId.setVisibilityAnimator("G_VISIBILITY_SLIDE_ANIMATOR"); |
|
14 } |
|
15 |
|
16 window.chrome.loadComplete.connect( |
|
17 function(){ |
|
18 onChromeComplete(); |
|
19 } |
|
20 ); |
|
21 |
|
22 function newStyle(style){ |
|
23 var styleLink = document.getElementById("CSSLink"); |
|
24 styleLink.href = style; |
|
25 window.snippets.SettingsChromeId.toggleVisibility(); |
|
26 } |
|
27 |
|
28 function chromeSelect(){ |
|
29 var p = document.getElementsByName("ChromeSelection"); |
|
30 for(i = 0; i < p.length; i ++){ |
|
31 if(p[i].checked == true){ |
|
32 |
|
33 return p[i].value; |
|
34 } |
|
35 } |
|
36 } |
|
37 |
|
38 function styleSelect() { |
|
39 var p = document.getElementsByName("StyleSelection"); |
|
40 for(i = 0; i < p.length; i ++){ |
|
41 if(p[i].checked == true){ |
|
42 return p[i].value; |
|
43 } |
|
44 } |
|
45 } |
|
46 |
|
47 |
|
48 function animatorSelect(){ |
|
49 var p = document.getElementsByName("AnimatorSelection"); |
|
50 for(i = 0; i < p.length; i++){ |
|
51 if(p[i].checked == true){ |
|
52 return p[i].value; |
|
53 } |
|
54 } |
|
55 } |
|
56 |
|
57 window.pageController.loadStarted.connect( |
|
58 function() { |
|
59 window.chrome.alert("handleLoadStart"); |
|
60 document.getElementById("PBar").style.width = "0%"; |
|
61 } |
|
62 ); |
|
63 |
|
64 window.pageController.loadProgress.connect( |
|
65 function(percent) { |
|
66 var parentWidth = document.getElementById("PBarWrapper").offsetWidth; |
|
67 document.getElementById("PBar").style.width = (parentWidth * percent)/100 + "px"; |
|
68 } |
|
69 ); |
|
70 |
|
71 window.pageController.loadFinished.connect( |
|
72 function(ok) { |
|
73 window.chrome.alert("handleLoadFinished: " + ok); |
|
74 document.getElementById("PBar").style.width = "0%"; |
|
75 } |
|
76 ); |
|
77 |
|
78 window.pageController.networkRequestError.connect( |
|
79 function(reply) { |
|
80 window.chrome.alert("onNetworkRequestError: " + reply.error()); |
|
81 } |
|
82 ); |
|
83 |
|
84 window.pageController.titleChanged.connect( |
|
85 function(title) { |
|
86 // TBD |
|
87 } |
|
88 ); |
|
89 |
|
90 window.pageController.currentPageUrlChanged.connect( |
|
91 function(url){ |
|
92 document.getElementById("urlBox").value = url; |
|
93 window.chrome.toggleAttention("Button6"); |
|
94 } |
|
95 ); |
|
96 |
|
97 </script> |
|
98 |
|
99 <link id="CSSLink" rel="stylesheet" type="text/css" href="css/chromeStyleTransparent.css" /> |
|
100 |
|
101 </head> |
|
102 <body> |
|
103 <div class ="InitialChrome"> |
|
104 <div class = "GinebraSnippet" id="TopChromeId" data-GinebraVisible="true" data-GinebraAnchor="AnchorTop" data-GinebraHidesContent="true"> |
|
105 <form name = "gotoUrlForm"> |
|
106 <span style="width: 300px; height: 24px; position: absolute; left: 4px"> |
|
107 <span id="PBarWrapper" class="ProgressBarWrapper" style="position: absolute; top: 3px; height:24px"> |
|
108 <span id="PBar" class="ProgressBar" style="position:absolute; left: 1px; height: 20px;"> |
|
109 </span> |
|
110 <span> |
|
111 <input type ="text" |
|
112 class = "Text" |
|
113 id = "urlBox" |
|
114 name = "textBox" |
|
115 style = "position: absolute; width: 300px; height: 18px" |
|
116 value="http://news.google.com"/> |
|
117 </span> |
|
118 |
|
119 <image src = "./images/carrot.gif" height="36px" width="36px" style = "top: -3px; position: relative; left: 280px;" onclick="loadToMainWindow(document.gotoUrlForm.textBox.value)"/> |
|
120 |
|
121 <image src = "./images/tomato.gif" height="36px" width="36px" |
|
122 style = "top: -3px; position: relative; left: 280px;" onclick = "window.chrome.toggleVisibility('BottomChromeId');"/> |
|
123 </span> |
|
124 </span> |
|
125 </form> |
|
126 </div> |
|
127 |
|
128 <div class = "GinebraSnippet" id="BottomChromeId" data-GinebraVisible="true" data-GinebraAnchor="AnchorBottom" data-GinebraHidesContent="true"> |
|
129 <img id="Button1" class="GinebraButtonSnippet" src="./images/lettuce.gif" height="36px" width="36px" style="position: relative; left:30px" onclick="window.pageController.currentBack()"/> |
|
130 <img id="Button2" class="GinebraButtonSnippet" src="./images/onion.gif" height="36px" width="36px" style="position: relative; left:40px" onclick="window.pageController.currentForward()"/> |
|
131 <img id="Button3" class="GinebraButtonSnippet" src="./images/corn.gif" height="36px" width="36px" style="position: relative; left:50px" onclick="window.pageController.currentStop()"/> |
|
132 <img id="Button4" class="GinebraButtonSnippet" src="./images/cuke.gif" height="36px" width="36px" style="position: relative; left:60px" onclick="window.pageController.currentReload()"/> |
|
133 <img id="Button5" class="GinebraButtonSnippet" src="./images/pepper.gif" height="36px" width="36px" style="position: relative; left:70px" onclick="window.snippets.SettingsChromeId.toggleVisibility()"> |
|
134 </div> |
|
135 </div> |
|
136 |
|
137 |
|
138 <div class = "GinebraSnippet" id="SettingsChromeId" data-GinebraAnchor="AnchorCenter"> |
|
139 <h3>Chrome settings</h3> |
|
140 <hr/> |
|
141 Chrome: |
|
142 <br/> |
|
143 Simple |
|
144 <input type ="radio" |
|
145 name = "ChromeSelection" |
|
146 value="s60-chrome.html"/> |
|
147 <button type="button" class="Button" onclick="window.chrome.loadChrome('file:///C:/data/Others/chrome/demochrome/' + chromeSelect());">Update</button> |
|
148 <br/> |
|
149 Veggie |
|
150 <input type ="radio" |
|
151 checked = "checked" |
|
152 name = "ChromeSelection" |
|
153 value="s60-veggie-chrome.html"/> |
|
154 |
|
155 <hr/> |
|
156 Animations: |
|
157 <br/> |
|
158 Fadeout |
|
159 <input type ="radio" |
|
160 checked = "checked" |
|
161 name = "AnimatorSelection" |
|
162 value="G_VISIBILITY_FADE_ANIMATOR"/> |
|
163 |
|
164 |
|
165 <button type="button" class="Button" onclick="window.snippets.BottomChromeId.setVisiblityAnimator(animatorSelect())">Update</button> |
|
166 |
|
167 |
|
168 <br/> |
|
169 Flyout |
|
170 <input type ="radio" |
|
171 checked = "checked" |
|
172 name = "AnimatorSelection" |
|
173 value="G_VISIBILITY_FLYOUT_ANIMATOR"/> |
|
174 |
|
175 <br/> |
|
176 Malstrom |
|
177 <input type ="radio" |
|
178 name = "AnimatorSelection" |
|
179 value="G_VISIBILITY_MALSTROM_ANIMATOR"/> |
|
180 <hr/> |
|
181 </div> |
|
182 </body> |
|
183 </html> |
|
184 |
|