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

Side by Side Diff: chrome/browser/resources/ssl/roadblock.html

Issue 14752005: Finch experiments on SSL, malware, and phishing interstitials (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: Browsertest trybot fix Created 7 years, 7 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
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 <title i18n-content="title"></title> 5 <title i18n-content="title"></title>
6 <style type="text/css"> 6 <style type="text/css">
7 7
8 html { 8 html {
9 background-color: rgb(92, 0, 0); 9 background-color: rgb(92, 0, 0);
10 background-image: url(ssl_roadblock_background.png); 10 background-image: url(roadblock_background.png);
11 background-repeat: repeat-x; 11 background-repeat: repeat-x;
12 height: 100%; 12 height: 100%;
13 } 13 }
14 14
15 html[dir='rtl'] #twisty-closed { 15 html[dir='rtl'] #twisty-closed {
16 -webkit-transform: scaleX(-1); 16 -webkit-transform: scaleX(-1);
17 } 17 }
18 18
19 body { 19 body {
20 font-family: Helvetica, Arial, sans-serif; 20 font-family: Helvetica, Arial, sans-serif;
21 margin: 0; 21 margin: 0;
22 } 22 }
23 23
24 .box { 24 .box {
25 -webkit-box-shadow: 3px 3px 8px #200; 25 -webkit-box-shadow: 3px 3px 8px #200;
26 background-color: white; 26 background-color: white;
27 border-radius: 5px; 27 border-radius: 5px;
28 color: black; 28 color: black;
29 font-size: 10pt; 29 font-size: 10pt;
30 line-height: 16pt; 30 line-height: 16pt;
31 margin: 40px auto auto auto; 31 margin: 40px auto auto auto;
32 max-width: 800px; 32 max-width: 800px;
33 min-width: 500px; 33 min-width: 500px;
34 padding: 20px; 34 padding: 20px;
35 position: relative; 35 position: relative;
36 width: 80%; 36 width: 80%;
37 } 37 }
38 38
39 .icon { 39 .icon {
40 position:absolute; 40 position:absolute;
41 } 41 }
42 42
43 .main { 43 .main {
44 margin: 1em 80px; 44 margin: 1em 80px;
45 } 45 }
46 46
47 .more { 47 .more {
48 border-top: 1px solid #ccc; 48 border-top: 1px solid #ccc;
49 margin: 0 80px; 49 margin: 0 80px;
50 padding-top: 6px; 50 padding-top: 6px;
51 } 51 }
52 52
(...skipping 20 matching lines...) Expand all
73 display: inline; 73 display: inline;
74 } 74 }
75 </style> 75 </style>
76 76
77 <script> 77 <script>
78 // Should match SSLBlockingPageCommands in ssl_blocking_page.cc. 78 // Should match SSLBlockingPageCommands in ssl_blocking_page.cc.
79 var CMD_DONT_PROCEED = 0; 79 var CMD_DONT_PROCEED = 0;
80 var CMD_PROCEED = 1; 80 var CMD_PROCEED = 1;
81 var CMD_FOCUS = 2; 81 var CMD_FOCUS = 2;
82 var CMD_MORE = 3; 82 var CMD_MORE = 3;
83 83
84 var showedMore = false; 84 var showedMore = false;
85 var keyPressState = 0; 85 var keyPressState = 0;
86 var gainFocus = false; 86 var gainFocus = false;
87 87
88 function $(o) { 88 function $(o) {
89 return document.getElementById(o); 89 return document.getElementById(o);
90 } 90 }
91 91
92 function sendCommand(cmd) { 92 function sendCommand(cmd) {
93 window.domAutomationController.setAutomationId(1); 93 window.domAutomationController.setAutomationId(1);
(...skipping 26 matching lines...) Expand all
120 // Supports UMA timing, which starts after the warning is first viewed. 120 // Supports UMA timing, which starts after the warning is first viewed.
121 function handleFocusEvent() { 121 function handleFocusEvent() {
122 if (gainFocus == false) { 122 if (gainFocus == false) {
123 sendCommand(CMD_FOCUS); 123 sendCommand(CMD_FOCUS);
124 gainFocus = true; 124 gainFocus = true;
125 } 125 }
126 } 126 }
127 127
128 // UI modifications and event listeners that take place after load. 128 // UI modifications and event listeners that take place after load.
129 function setupEvents() { 129 function setupEvents() {
130 if ($('error-type').textContent != '') { 130 if (templateData.errorType == "overridable") {
131 // This is the blocking page you can click through. 131 // This is the blocking page you can click through.
132 $('proceed-button').hidden = false; 132 $('proceed-button').hidden = false;
133 $('proceed-button').addEventListener('click', function() { 133 $('proceed-button').addEventListener('click', function() {
134 sendCommand(CMD_PROCEED); 134 sendCommand(CMD_PROCEED);
135 }); 135 });
136 } else { 136 } else {
137 document.addEventListener('keypress', keyPressHandler); 137 document.addEventListener('keypress', keyPressHandler);
138 } 138 }
139 139
140 if ($('more-info-title').textContent == '') { 140 if ($('more-info-title').textContent == '') {
141 // Malware warning currently doesn't have more info. 141 // Malware warning currently doesn't have more info.
142 $('more-info-short').hidden = true; 142 $('more-info-short').hidden = true;
143 $('more-info-long').hidden = true; 143 $('more-info-long').hidden = true;
144 $('twisty-closed').style.display = 'none'; 144 $('twisty-closed').style.display = 'none';
145 } else { 145 } else {
146 $('more-info-short').addEventListener('click', function() { 146 $('more-info-short').addEventListener('click', function() {
147 toggleMoreInfo(false); 147 toggleMoreInfo(false);
148 }); 148 });
149 $('more-info-long').addEventListener('click', function() { 149 $('more-info-long').addEventListener('click', function() {
150 toggleMoreInfo(true); 150 toggleMoreInfo(true);
151 }); 151 });
152 } 152 }
153 153
154 $('exit-button').addEventListener('click', function() { 154 $('exit-button').addEventListener('click', function() {
155 sendCommand(CMD_DONT_PROCEED); 155 sendCommand(CMD_DONT_PROCEED);
156 }); 156 });
157 157
158 document.addEventListener('contextmenu', function(e) { 158 document.addEventListener('contextmenu', function(e) {
159 e.preventDefault(); 159 e.preventDefault();
160 }); 160 });
161 } 161 }
162 162
163 window.addEventListener('focus', handleFocusEvent); 163 window.addEventListener('focus', handleFocusEvent);
164 document.addEventListener('DOMContentLoaded', setupEvents); 164 document.addEventListener('DOMContentLoaded', setupEvents);
165 </script> 165 </script>
166 </head> 166 </head>
167 <body> 167 <body>
168 <div class="box"> 168 <div class="box">
169 <div class="icon"> 169 <div class="icon">
170 <img src="ssl_roadblock_icon.png" alt="SSL Error Icon"> 170 <img src="roadblock_icon.png" alt="SSL Error Icon" id="roadblock-icon">
171 </div> 171 </div>
172 <div class="title" i18n-content="headLine"></div> 172 <div class="title" i18n-content="headLine"></div>
173 <div class="main" i18n-values=".innerHTML:description;dir:textdirection"></d iv> 173 <div class="main" i18n-values=".innerHTML:description;dir:textdirection"></d iv>
174 <div class="main" i18n-values=".innerHTML:reasonForNotProceeding"></div> 174 <div class="main" i18n-values=".innerHTML:reasonForNotProceeding"></div>
175 <div class="main"> 175 <div class="main">
176 <button i18n-content="proceed" id="proceed-button" hidden></button> 176 <button i18n-content="proceed" id="proceed-button" hidden></button>
177 <button i18n-content="exit" id="exit-button"></button> 177 <button i18n-content="exit" id="exit-button"></button>
178 </div> 178 </div>
179 <div class="more" id="more-info-short"> 179 <div class="more" id="more-info-short">
180 <span class="more-link"> 180 <span class="more-link">
181 <img id="twisty-closed" class="twisty" src="twisty_closed.png" 181 <img id="twisty-closed" class="twisty" src="twisty_closed.png"
182 border="0"><span i18n-content="moreInfoTitle" id="more-info-title" 182 border="0"><span i18n-content="moreInfoTitle" id="more-info-title"
183 class="show-more-info-title"></span> 183 class="show-more-info-title"></span>
184 </span> 184 </span>
185 </div> 185 </div>
186 <div class="more" id="more-info-long" hidden> 186 <div class="more" id="more-info-long" hidden>
187 <span class="more-link"> 187 <span class="more-link">
188 <img class="twisty" src="twisty_open.png" border="0"><span 188 <img class="twisty" src="twisty_open.png" border="0"><span
189 i18n-content="moreInfoTitle" class="more-info-title"></span> 189 i18n-content="moreInfoTitle" class="more-info-title"></span>
190 </span> 190 </span>
191 <p i18n-values=".innerHTML:moreInfo1"></p> 191 <p i18n-values=".innerHTML:moreInfo1"></p>
192 <p i18n-values=".innerHTML:moreInfo2"></p> 192 <p i18n-values=".innerHTML:moreInfo2"></p>
193 <p i18n-values=".innerHTML:moreInfo3"></p> 193 <p i18n-values=".innerHTML:moreInfo3"></p>
194 <p i18n-values=".innerHTML:moreInfo4"></p> 194 <p i18n-values=".innerHTML:moreInfo4"></p>
195 <p i18n-values=".innerHTML:moreInfo5"></p> 195 <p i18n-values=".innerHTML:moreInfo5"></p>
196 </div> 196 </div>
197 </div> 197 </div>
198 <span id="error-type" i18n-content="errorType" hidden></span>
199 </table> 198 </table>
200 </body> 199 </body>
201 </html> 200 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698