Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(856)

Side by Side Diff: chrome/browser/resources/options.html

Issue 2781005: Option dialog DOM UI - ChromeOS System page. (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src/
Patch Set: '' Created 10 years, 6 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
OLDNEW
(Empty)
1 <!DOCTYPE HTML>
2 <html i18n-values="dir:textdirection;" id="t">
3 <head>
4 <meta charset="utf-8">
5 <title i18n-content="title"></title>
6 <link rel="icon" href="../../app/theme/history_favicon.png">
7 <script src="shared/js/local_strings.js"></script>
8 <script>
9 ///////////////////////////////////////////////////////////////////////////////
10 // Globals:
11
12 function $(o) {return document.getElementById(o);}
13
14 // Extracts preference value out of reponse callback of fetchPrefs call.
15 function getPref(dict, name) {
16 return eval('dict.'+name);
arv (Not doing code reviews) 2010/06/17 22:53:18 Do not use eval return dict[name];
zel 2010/06/18 02:07:05 dict[name] actually does not work. Something funny
17 }
18
19 // Sets new value for preference.
20 function setBooleanPref(name, value) {
21 chrome.send('setBooleanPref', [name, String(value)]);
22 }
23
24 function setIntegerPref(name, value) {
25 chrome.send('setIntegerPref', [name, String(value)]);
26 }
27
28 function setStringPref(name, value) {
29 chrome.send('setStringPref', [name, value]);
30 }
31 ///////////////////////////////////////////////////////////////////////////////
32 // Document Functions:
33 /**
34 * Window onload handler, sets up the page.
35 */
36 function load() {
37 localStrings = new LocalStrings();
38 loadSystemPrefs();
39
40 selectPage('system');
41 // TODO(zelidrag): preserve first that needs to be shown.
42 }
43
44 function selectPage(name) {
45 var page = $(name+'Page');
arv (Not doing code reviews) 2010/06/17 22:53:18 ws around binops
zel 2010/06/18 02:07:05 Done.
46 var nav = $(name+'PageNav');
47 page.style.visibility = 'visible';
48 nav.class = 'navbar_item navbar_item_selected';
arv (Not doing code reviews) 2010/06/17 22:53:18 use dashes (-) for css class names and ids
zel 2010/06/18 02:07:05 Done.
49 }
50
51 ///////////////////////////////////////////////////////////////////////////////
52 // System (ChromeOS) Functions:
53
54 var kTimeZone = 'settings.datetime.timezone';
arv (Not doing code reviews) 2010/06/17 22:53:18 No k in the name. If you want const use const con
55 var kTapToClickEnabled = 'settings.touchpad.enable_tap_to_click';
56 var kVertEdgeScrollEnabled = 'settings.touchpad.enable_vert_edge_scroll';
57 var kTouchpadSpeedFactor = 'settings.touchpad.speed_factor';
58 var kTouchpadSensitivity = 'settings.touchpad.sensitivity';
59 var kAccessibilityEnabled = 'settings.accessibility';
60
61 /**
62 * Loads ChromeOS System preferences.
63 */
64 function loadSystemPrefs() {
65 chrome.send("fetchPrefs", ['systemPrefsFetched', '',
arv (Not doing code reviews) 2010/06/17 22:53:18 Use single quotes in JS for consistence.
zel 2010/06/18 02:07:05 Done.
66 kTimeZone,
67 kTapToClickEnabled,
68 kVertEdgeScrollEnabled,
69 kTouchpadSpeedFactor,
70 kTouchpadSensitivity,
71 kAccessibilityEnabled]);
72 }
73
74 function setupTimezones(selectedValue) {
75 timezoneSel = $('timezoneSel');
arv (Not doing code reviews) 2010/06/17 22:53:18 missing var
zel 2010/06/18 02:07:05 Done.
76 for (key in templateData.timezoneMap) {
77 var selected = key == selectedValue;
78 timezoneSel.options[timezoneSel.options.length] =
79 new Option(templateData.timezoneMap[key], key, false, selected);
arv (Not doing code reviews) 2010/06/17 22:53:18 or timezoneSel.appendChild(new Option(...));
zel 2010/06/18 02:07:05 Done.
80 }
81 }
82
83 function systemPrefsFetched(context, dict) {
84 $('tapToClickChk').checked = getPref(dict, kTapToClickEnabled);
85 $('vertScrollChk').checked = getPref(dict, kVertEdgeScrollEnabled);
86 $('sensitivityRng').value = getPref(dict, kTouchpadSensitivity);
87 $('speedRng').value = getPref(dict, kTouchpadSpeedFactor);
88 $('accesibilityChk').checked = getPref(dict, kAccessibilityEnabled);
89 setupTimezones(getPref(dict, kTimeZone));
90 }
91
92 function selectChanged(control) {
93 if (control.id == 'timezoneSel') {
94 setStringPref(kTimeZone, control.options[control.selectedIndex].value);
95 }
96 }
97
98 function checkboxChanged(control) {
99 if (control.id == 'tapToClickChk') {
arv (Not doing code reviews) 2010/06/17 22:53:18 Use a switch
zel 2010/06/18 02:07:05 Done.
100 setBooleanPref(kTapToClickEnabled, control.checked);
101 } else if (control.id == 'vertScrollChk') {
102 setBooleanPref(kVertEdgeScrollEnabled, control.checked);
103 } else if (control.id == 'vertScrollChk') {
104 setBooleanPref(kTapToClickEnabled, control.checked);
105 } else if (control.id == 'accesibilityChk') {
106 setBooleanPref(kAccessibilityEnabled, control.checked);
107 }
108 }
109
110 function rangeChanged(control) {
111 if (control.id == 'sensitivityRng') {
112 setIntegerPref(kTouchpadSensitivity, control.value);
113 } else if (control.id == 'speedRng') {
114 setIntegerPref(kTouchpadSpeedFactor, control.value);
115 }
116 }
117
118 function buttonClicked(control) {
119 if (conrol.id == 'languageBtn') {
120 // TODO: Open ChromeOS language settings page.
121 }
122 }
123
124
125 </script>
126 <link rel="stylesheet" href="dom_ui.css">
127 <!-- TODO(zelidrag) just a temp style placeholder until redesign -->
128 <style>
129 .navbar_container {
arv (Not doing code reviews) 2010/06/17 22:53:18 Put an empty line between each rule
zel 2010/06/18 02:07:05 Done.
130 border: 1px solid black;
131 background-color: #dfdfdf;
132 cursor:pointer;
arv (Not doing code reviews) 2010/06/17 22:53:18 ws after :
zel 2010/06/18 02:07:05 Done.
133 font-weight: bold;
134 float:left;
arv (Not doing code reviews) 2010/06/17 22:53:18 rtl?
zel 2010/06/18 02:07:05 Not sure I get this one.
135 height: 400px;
136 padding: 10px;
137 position:relative;
138 width: 200px;
139 }
140 .navbar_item, .navbar_item2 {
141 margin: 5px;
142 padding: 5px;
143 }
144 .navbar_item_selected {
145 background-color: #000000;
146 }
147 .navbar_item_normal {
148 background-color: #dfdfdf;
149 }
150 #mainview {
151 border: 1px solid black;
152 float:left;
153 height: 400px;
154 width: 600px;
155 padding: 10px;
156 position:relative;
157 }
158 .section {
159 margin-top: 10px;
160 }
161 .option {
162 margin-top: 5px;
163 }
164 .section_title {
165 font-weight: bold;
166 }
167 .option_control_table {
168 padding-left:10px;
169 }
170 .navbar2 {
171 visibility: hidden;
172 }
173 .page {
174 visibility: hidden;
175 }
176 </style>
177 </head>
178 <body onload="load();" i18n-values=".style.fontFamily:fontfamily;.style.fontSize :fontsize">
arv (Not doing code reviews) 2010/06/17 22:53:18 Long line
zel 2010/06/18 02:07:05 Done.
179 <div class="header">
180 </div>
181 <div class="main">
182 <div class="navbar_container">
183 <ul class="navbar">
184 <li class="navbar_item navbar_item_normal" id="systemPageNav" i18n-values =".innerText:systemPage"></li>
arv (Not doing code reviews) 2010/06/17 22:53:18 Use i18n-content="systemPage"
arv (Not doing code reviews) 2010/06/17 22:53:18 Use dashes for word seperators s/systemPageNav/sy
zel 2010/06/18 02:07:05 Done.
zel 2010/06/18 02:07:05 Done.
185 <li class="navbar_item navbar_item_normal" id="internetPageNav" i18n-valu es=".innerText:internetPage"></li>
186 <li class="navbar_item navbar_item_normal" id="basicsPageNav" i18n-values =".innerText:basicsPage"></li>
187 <li class="navbar_item navbar_item_normal" id="personalStuffPageNav" i18n -values=".innerText:personalStuffPage"></li>
188 <li class="navbar_item navbar_item_normal" id="underHoodPageNav" i18n-val ues=".innerText:underHoodPage"></li>
189 </ul>
190 <hr/>
191 <ul class="navbar2">
192 </ul>
193 </div>
194 <div id="mainview">
195 <div class="page" id="systemPage">
196 <div class="section">
197 <div class="section_title" i18n-values=".innerText:datetime_title"></d iv>
198 <div class="option">
199 <table class="option_control_table">
200 <tr>
201 <td class="option_name" i18n-values=".innerText:timezone"></td>
202 <td class="option_value">
203 <select id="timezoneSel" class="control timezone_dropdown" onch ange="selectChanged(this)"></select>
204 </td>
205 </tr>
206 </table>
207 </div>
208 </div>
209 <div class="section">
210 <div class="section_title" i18n-values=".innerText:touchpad"></div>
211 <div class="option">
212 <table class="option_control_table">
213 <tr>
214 <td class="option_name" i18n-values=".innerText:sensitivity"></td >
215 <td class="option_value">
216 <input id="sensitivityRng" type="range" min="1" max="10" class= "touchSlider" style="-webkit-appearance:slider-horizontal;" onchange="rangeChang ed(this)">
arv (Not doing code reviews) 2010/06/17 22:53:18 move css to the style element I don't see why you
zel 2010/06/18 02:07:05 Done.
217 </td>
218 </tr>
219 <tr>
220 <td class="option_name" i18n-values=".innerText:speed_factor"></t d>
221 <td class="option_value">
222 <input id="speedRng" type="range" min="1" max="10" class="touch Slider" style="-webkit-appearance:slider-horizontal;" onchange="rangeChanged(thi s)">
223 </td>
224 </tr>
225 <tr>
226 <td class="option_name" colspan="2"><input id="tapToClickChk" typ e="checkbox" onchange="checkboxChanged(this)"/><span i18n-values=".innerText:en able_tap_to_click"></span></td>
227 </tr>
228 <tr>
229 <td class="option_name" colspan="2"><input id="vertScrollChk" typ e="checkbox" onchange="checkboxChanged(this)"/><span i18n-values=".innerText:en able_vert_edge_scroll"></span></td>
230 </tr>
231 </table>
232 </div>
233 </div>
234 <div class="section">
235 <div class="section_title" i18n-values=".innerText:language"></div>
236 <div class="option">
237 <table class="option_control_table">
238 <tr>
239 <td class="option_name"><button id="languageBtn" onclick="buttonC licked" i18n-values=".innerText:language_customize"></button></td>
240 </tr>
241 </table>
242 </div>
243 </div>
244 <div class="section">
245 <div class="section_title" i18n-values=".innerText:accessibility_title "></div>
246 <div class="option">
247 <table class="option_control_table">
248 <tr>
249 <td class="option_name"><input id="accesibilityChk" onchange="che ckboxChanged(this)" type="checkbox"/><span i18n-values=".innerText:accessibilit y"></span></td>
250 </tr>
251 </table>
252 </div>
253 </div>
254 </div>
255 </div>
256 </div>
257 </body>
258 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698