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

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

Issue 7148023: Add content-security-policy (CSP) to chrome://flags. (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src/
Patch Set: '' Created 9 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
« no previous file with comments | « chrome/browser/resources/flags.css ('k') | chrome/browser/resources/flags.js » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE HTML> 1 <!DOCTYPE HTML>
2 <html i18n-values="dir:textdirection;"> 2 <html i18n-values="dir:textdirection;">
3 <head> 3 <head>
4 <meta charset="utf-8"> 4 <meta charset="utf-8">
5 <style> 5 <!-- X-WebKit-CSP is our development name for Content-Security-Policy.
6 body { 6 The 'unsafe-eval' is required for jstemplate_compiled.js.
7 margin: 10px; 7 TODO(tsepez) rename when Content-security-policy is done.
8 min-width: 47em; 8 -->
9 } 9 <meta http-equiv="X-WebKit-CSP" content="object-src 'none';
10 10 script-src chrome://resources 'self' 'unsafe-eval'">
Evan Stade 2011/06/20 18:50:28 4 space indent for continuation lines
11 a { 11 <link rel="stylesheet" href="flags.css"/>
12 color: blue; 12 <script src="chrome://flags/flags.js"></script>
13 font-size: 103%; 13 <script src="chrome://flags/strings.js"></script>
14 } 14 <script src="chrome://resources/js/i18n_template.js"></script>
15
16 div#header {
17 margin-bottom: 1.05em;
18 /* 67px is the height of the header's background image. */
19 min-height: 67px;
20 overflow: hidden;
21 padding-bottom: 20px;
22 -webkit-padding-start: 0;
23 padding-top: 20px;
24 position: relative;
25 box-sizing: border-box;
26 }
27
28 #header h1 {
29 background: url('../../app/theme/flags_section.png') 0px 20px no-repeat;
30 display: inline;
31 margin: 0;
32 padding-bottom: 43px;
33 -webkit-padding-start: 75px;
34 padding-top: 40px;
35 }
36
37 html[dir=rtl] #header h1 {
38 background: url('../../app/theme/flags_section.png') right no-repeat;
39 }
40
41 h1 {
42 font-size: 156%;
43 font-weight: bold;
44 padding: 0;
45 margin: 0;
46 }
47
48 #blurb-container {
49 padding-bottom: 1.5em;
50 font-size: 120%;
51 }
52
53 #blurb-warning {
54 color: red;
55 font-weight: bold;
56 }
57
58 div.content {
59 font-size: 88%;
60 margin-top: 5px;
61 }
62
63 .section-header {
64 background: #ebeff9;
65 border-top: 1px solid #b5c7de;
66 font-size: 99%;
67 padding-bottom: 2px;
68 -webkit-padding-start: 5px;
69 padding-top: 3px;
70 width: 100%;
71 }
72
73 .section-header > table tr td:first-child {
74 width: 100%;
75 }
76
77 .section-header > table {
78 width: 100%;
79 }
80
81 .section-header-title {
82 font-weight: bold;
83 }
84
85 .vbox-container {
86 display: -webkit-box;
87 -webkit-box-orient: vertical;
88 }
89
90 .wbox {
91 display: -webkit-box;
92 -webkit-box-align: stretch;
93 -webkit-box-flex: 1;
94 }
95
96 #top {
97 -webkit-padding-end: 5px;
98 }
99
100 /* Disabled experiments display grey text on a grey background. The title,
101 however, should remain completely legible. */
102 .experiment-disabled > td {
103 background: #F0F0F0;
104 color: #A0A0A0;
105 }
106
107 .experiment-disabled .experiment-name {
108 color: #000;
109 }
110
111 .experiment {
112 border-bottom: 1px solid #cdcdcd;
113 }
114
115 .experiment td {
116 padding-bottom: 4px;
117 padding-top: 5px;
118 }
119
120 /* Indent the text related to each experiment. */
121 .experiment-text {
122 -webkit-padding-start: 5px;
123 }
124
125 .experiment-name {
126 font-weight: bold;
127 }
128
129 .no-experiments {
130 margin: 6em 0 0;
131 text-align: center;
132 font-size: 1.2em;
133 }
134
135 /* Match the indentation of .experiment-text. */
136 .experiment-actions {
137 -webkit-padding-start: 5px;
138 margin-top: 0.2em;
139 margin-bottom: 0.2em;
140 }
141
142 div.needs-restart {
143 padding-top: 10px;
144 -webkit-padding-start: 5px;
145 }
146
147 button {
148 font-size: 104%;
149 }
150
151 </style>
152 <script>
153
154 /**
155 * This variable structure is here to document the structure that the template
156 * expects to correctly populate the page.
157 */
158 var flagsExperimentsDataFormat = {
159 'flagsExperiments': [
160 {
161 'internal_name': 'Experiment ID string',
162 'name': 'Experiment Name',
163 'description': 'description',
164 /* enabled is only set if the experiment is single valued */
165 'enabled': true,
166 /* choices is only set if the experiment has multiple values */
167 'choices': [
168 {
169 'internal_name': 'Experiment ID string',
170 'description': 'description',
171 'selected': true
172 }
173 ]
174 }
175 ],
176 'needsRestart': false
177 };
178
179 /**
180 * Takes the |flagsExperimentsData| input argument which represents data about
181 * the currently available experiments and populates the html jstemplate
182 * with that data. It expects an object structure like the above.
183 * @param {Object} flagsExperimentsData Information about available experiments
184 */
185 function renderTemplate(flagsExperimentsData) {
186 // This is the javascript code that processes the template:
187 var input = new JsEvalContext(flagsExperimentsData);
188 var output = document.getElementById('flagsExperimentTemplate');
189 jstProcess(input, output);
190 }
191
192 /**
193 * Asks the C++ FlagsDOMHandler to get details about the available experiments
194 * and return detailed data about the configuration. The FlagsDOMHandler
195 * should reply to returnFlagsExperiments() (below).
196 */
197 function requestFlagsExperimentsData() {
198 chrome.send('requestFlagsExperiments', []);
199 }
200
201 /**
202 * Asks the C++ FlagsDOMHandler to restart the browser (restoring tabs).
203 */
204 function restartBrowser() {
205 chrome.send('restartBrowser', []);
206 }
207
208 /**
209 * Called by the WebUI to re-populate the page with data representing the
210 * current state of installed experiments.
211 */
212 function returnFlagsExperiments(flagsExperimentsData){
213 var bodyContainer = document.getElementById('body-container');
214 renderTemplate(flagsExperimentsData);
215 bodyContainer.style.visibility = 'visible';
216 }
217
218 /**
219 * Handles a 'enable' or 'disable' button getting clicked.
220 */
221 function handleEnableExperiment(node, enable) {
222 // Tell the C++ FlagsDOMHandler to enable/disable the experiment.
223 chrome.send('enableFlagsExperiment', [String(node.internal_name),
224 String(enable)]);
225 requestFlagsExperimentsData();
226 }
227
228 /**
229 * Invoked when the selection of a multi-value choice is changed to the
230 * specified index.
231 */
232 function handleSelectChoiceExperiment(node, index) {
233 // Tell the C++ FlagsDOMHandler to enable the selected choice.
234 chrome.send('enableFlagsExperiment',
235 [String(node.internal_name) + "@" + index, "true"]);
236 requestFlagsExperimentsData();
237 }
238
239 // Get data and have it displayed upon loading.
240 document.addEventListener('DOMContentLoaded', requestFlagsExperimentsData);
241
242 </script>
243 </head> 15 </head>
244 <body i18n-values=".style.fontFamily:fontfamily;.style.fontSize:fontsize"> 16 <body i18n-values=".style.fontFamily:fontfamily;.style.fontSize:fontsize">
245 <div id="body-container" style="visibility:hidden"> 17 <div id="body-container" style="visibility:hidden">
246 18
247 <div id="header"><h1 i18n-content="flagsLongTitle">TITLE</h1></div> 19 <div id="header"><h1 i18n-content="flagsLongTitle">TITLE</h1></div>
248 20
249 <div id="blurb-container"> 21 <div id="blurb-container">
250 <span id="blurb-warning" i18n-content="flagsWarningHeader">WARNING</span> 22 <span id="blurb-warning" i18n-content="flagsWarningHeader">WARNING</span>
251 <span i18n-content="flagsBlurb">WARNING TEXT</span> 23 <span i18n-content="flagsBlurb">WARNING TEXT</span>
252 </div> 24 </div>
(...skipping 30 matching lines...) Expand all
283 <tr jsvalues="class:enabled ? 'experiment-enabled' : 'experiment-disable d'"> 55 <tr jsvalues="class:enabled ? 'experiment-enabled' : 'experiment-disable d'">
284 <td valign="top"> 56 <td valign="top">
285 <div class="experiment-text"> 57 <div class="experiment-text">
286 <div> 58 <div>
287 <span class="experiment-name" 59 <span class="experiment-name"
288 jscontent="name">NAME</span> 60 jscontent="name">NAME</span>
289 <div> 61 <div>
290 <span jsvalues=".innerHTML:description"> 62 <span jsvalues=".innerHTML:description">
291 </div> 63 </div>
292 <div jsdisplay="choices && choices.length > 0"> 64 <div jsdisplay="choices && choices.length > 0">
293 <select jsvalues=".internal_name:internal_name;.disabled:!enable d" 65 <select
294 onchange="handleSelectChoiceExperiment(this, this.select edIndex)"> 66 classs="experiment-select"
67 jsvalues=".internal_name:internal_name;.disabled:!enabled">
295 <option jsvalues=".selected:selected" 68 <option jsvalues=".selected:selected"
296 jsselect="choices" 69 jsselect="choices"
297 jscontent="description">NAME 70 jscontent="description">NAME
298 </option> 71 </option>
299 </select> 72 </select>
300 </div> 73 </div>
301 </div> 74 </div>
302 </div> 75 </div>
303 <div class="experiment-actions"> 76 <div class="experiment-actions">
304 <!-- If enabled isn't set (i.e. in multi_type options), 77 <!-- If enabled isn't set (i.e. in multi_type options),
305 then both jsdisplay tests fail, and we get no 78 then both jsdisplay tests fail, and we get no
306 rendering from this section. --> 79 rendering from this section. -->
307 <span> 80 <span>
308 <a 81 <a
82 class="experiment-disable-link"
309 jsvalues=".internal_name:internal_name" 83 jsvalues=".internal_name:internal_name"
310 jsdisplay="enabled" 84 jsdisplay="enabled"
311 onclick="handleEnableExperiment(this, false)" 85 href="#"
312 href="javascript:void(0);"
313 i18n-content="disable" 86 i18n-content="disable"
314 >DISABLE</a> 87 >DISABLE</a>
315 <a 88 <a
89 class="experiment-enable-link"
316 jsvalues=".internal_name:internal_name" 90 jsvalues=".internal_name:internal_name"
317 jsdisplay="!enabled" 91 jsdisplay="!enabled"
318 onclick="handleEnableExperiment(this, true)" 92 href="#"
319 href="javascript:void(0);"
320 i18n-content="enable" 93 i18n-content="enable"
321 >ENABLE</a> 94 >ENABLE</a>
322 </span> 95 </span>
323 </div> 96 </div>
324 </td> 97 </td>
325 </tr> 98 </tr>
326 </table> 99 </table>
327 </div> 100 </div>
328 </div> 101 </div>
329 102
330 <div class="needs-restart" jsdisplay="needsRestart"> 103 <div class="needs-restart" jsdisplay="needsRestart">
331 <div i18n-content="flagsRestartNotice">NEEDS_RESTART</div> 104 <div i18n-content="flagsRestartNotice">NEEDS_RESTART</div>
332 <button type="button" 105 <button class="experiment-restart-button"
333 onclick="restartBrowser();" 106 type="button"
334 i18n-content="flagsRestartButton">RESTART</button> 107 i18n-content="flagsRestartButton">RESTART</button>
335 </div> 108 </div>
336 </div> 109 </div>
337 </div> 110 </div>
338 </div> 111 </div>
112 <script src="chrome://resources/js/i18n_process.js"></script>
113 <script src="chrome://resources/js/jstemplate_compiled.js"></script>
339 </body> 114 </body>
340 </html> 115 </html>
116
OLDNEW
« no previous file with comments | « chrome/browser/resources/flags.css ('k') | chrome/browser/resources/flags.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698