| OLD | NEW |
| (Empty) |
| 1 <!DOCTYPE html> | |
| 2 <html i18n-values="dir:textdirection"> | |
| 3 <head> | |
| 4 <meta charset="utf-8"> | |
| 5 <title i18n-content="title"></title> | |
| 6 <style type="text/css"> | |
| 7 | |
| 8 html { | |
| 9 background-color: rgb(92, 0, 0); | |
| 10 background-image: url(ssl_roadblock_background.png); | |
| 11 background-repeat: repeat-x; | |
| 12 height: 100%; | |
| 13 } | |
| 14 | |
| 15 html[dir='rtl'] #twisty-closed { | |
| 16 -webkit-transform: scaleX(-1); | |
| 17 } | |
| 18 | |
| 19 body { | |
| 20 font-family: Helvetica, Arial, sans-serif; | |
| 21 margin: 0; | |
| 22 } | |
| 23 | |
| 24 .box { | |
| 25 -webkit-box-shadow: 3px 3px 8px #200; | |
| 26 background-color: white; | |
| 27 border-radius: 5px; | |
| 28 color: black; | |
| 29 font-size: 10pt; | |
| 30 line-height: 16pt; | |
| 31 margin: 40px auto auto auto; | |
| 32 max-width: 800px; | |
| 33 min-width: 500px; | |
| 34 padding: 20px; | |
| 35 position: relative; | |
| 36 width: 80%; | |
| 37 } | |
| 38 | |
| 39 .icon { | |
| 40 position:absolute; | |
| 41 } | |
| 42 | |
| 43 .main { | |
| 44 margin: 1em 80px; | |
| 45 } | |
| 46 | |
| 47 .more { | |
| 48 border-top: 1px solid #ccc; | |
| 49 margin: 0 80px; | |
| 50 padding-top: 6px; | |
| 51 } | |
| 52 | |
| 53 .more-info-title { | |
| 54 margin-left: 5px; | |
| 55 margin-right: 5px; | |
| 56 } | |
| 57 | |
| 58 .more-link { | |
| 59 color: #0000FF; | |
| 60 cursor: pointer; | |
| 61 text-decoration: underline; | |
| 62 } | |
| 63 | |
| 64 .title { | |
| 65 color: #660000; | |
| 66 font-size: 18pt; | |
| 67 font-weight: bold; | |
| 68 line-height: 140%; | |
| 69 margin: 0 77px 6pt; | |
| 70 } | |
| 71 | |
| 72 .twisty { | |
| 73 display: inline; | |
| 74 } | |
| 75 </style> | |
| 76 | |
| 77 <script> | |
| 78 // Should match SSLBlockingPageCommands in ssl_blocking_page.cc. | |
| 79 var CMD_DONT_PROCEED = 0; | |
| 80 var CMD_PROCEED = 1; | |
| 81 var CMD_FOCUS = 2; | |
| 82 var CMD_MORE = 3; | |
| 83 | |
| 84 var showedMore = false; | |
| 85 var keyPressState = 0; | |
| 86 var gainFocus = false; | |
| 87 | |
| 88 function $(o) { | |
| 89 return document.getElementById(o); | |
| 90 } | |
| 91 | |
| 92 function sendCommand(cmd) { | |
| 93 window.domAutomationController.setAutomationId(1); | |
| 94 window.domAutomationController.send(cmd); | |
| 95 } | |
| 96 | |
| 97 function toggleMoreInfo(collapse) { | |
| 98 $('more-info-long').hidden = collapse; | |
| 99 $('more-info-short').hidden = !collapse; | |
| 100 if (!collapse && !showedMore) { | |
| 101 sendCommand(CMD_MORE); | |
| 102 showedMore = true; | |
| 103 } | |
| 104 } | |
| 105 | |
| 106 // This allows errors to be skippped by typing "proceed" into the page. | |
| 107 function keyPressHandler(e) { | |
| 108 var sequence = 'proceed'; | |
| 109 if (sequence.charCodeAt(keyPressState) == e.keyCode) { | |
| 110 keyPressState++; | |
| 111 if (keyPressState == sequence.length) { | |
| 112 sendCommand(CMD_PROCEED); | |
| 113 keyPressState = 0; | |
| 114 } | |
| 115 } else { | |
| 116 keyPressState = 0; | |
| 117 } | |
| 118 } | |
| 119 | |
| 120 // Supports UMA timing, which starts after the warning is first viewed. | |
| 121 function handleFocusEvent() { | |
| 122 if (gainFocus == false) { | |
| 123 sendCommand(CMD_FOCUS); | |
| 124 gainFocus = true; | |
| 125 } | |
| 126 } | |
| 127 | |
| 128 // UI modifications and event listeners that take place after load. | |
| 129 function setupEvents() { | |
| 130 if ($('error-type').textContent != '') { | |
| 131 // This is the blocking page you can click through. | |
| 132 $('proceed-button').hidden = false; | |
| 133 $('proceed-button').addEventListener('click', function() { | |
| 134 sendCommand(CMD_PROCEED); | |
| 135 }); | |
| 136 } else { | |
| 137 document.addEventListener('keypress', keyPressHandler); | |
| 138 } | |
| 139 | |
| 140 if ($('more-info-title').textContent == '') { | |
| 141 // Malware warning currently doesn't have more info. | |
| 142 $('more-info-short').hidden = true; | |
| 143 $('more-info-long').hidden = true; | |
| 144 $('twisty-closed').style.display = 'none'; | |
| 145 } else { | |
| 146 $('more-info-short').addEventListener('click', function() { | |
| 147 toggleMoreInfo(false); | |
| 148 }); | |
| 149 $('more-info-long').addEventListener('click', function() { | |
| 150 toggleMoreInfo(true); | |
| 151 }); | |
| 152 } | |
| 153 | |
| 154 $('exit-button').addEventListener('click', function() { | |
| 155 sendCommand(CMD_DONT_PROCEED); | |
| 156 }); | |
| 157 | |
| 158 document.addEventListener('contextmenu', function(e) { | |
| 159 e.preventDefault(); | |
| 160 }); | |
| 161 } | |
| 162 | |
| 163 window.addEventListener('focus', handleFocusEvent); | |
| 164 document.addEventListener('DOMContentLoaded', setupEvents); | |
| 165 </script> | |
| 166 </head> | |
| 167 <body> | |
| 168 <div class="box"> | |
| 169 <div class="icon"> | |
| 170 <img src="ssl_roadblock_icon.png" alt="SSL Error Icon"> | |
| 171 </div> | |
| 172 <div class="title" i18n-content="headLine"></div> | |
| 173 <div class="main" i18n-values=".innerHTML:description;dir:textdirection"></d
iv> | |
| 174 <div class="main" i18n-values=".innerHTML:reasonForNotProceeding"></div> | |
| 175 <div class="main"> | |
| 176 <button i18n-content="proceed" id="proceed-button" hidden></button> | |
| 177 <button i18n-content="exit" id="exit-button"></button> | |
| 178 </div> | |
| 179 <div class="more" id="more-info-short"> | |
| 180 <span class="more-link"> | |
| 181 <img id="twisty-closed" class="twisty" src="twisty_closed.png" | |
| 182 border="0"><span i18n-content="moreInfoTitle" id="more-info-title" | |
| 183 class="show-more-info-title"></span> | |
| 184 </span> | |
| 185 </div> | |
| 186 <div class="more" id="more-info-long" hidden> | |
| 187 <span class="more-link"> | |
| 188 <img class="twisty" src="twisty_open.png" border="0"><span | |
| 189 i18n-content="moreInfoTitle" class="more-info-title"></span> | |
| 190 </span> | |
| 191 <p i18n-values=".innerHTML:moreInfo1"></p> | |
| 192 <p i18n-values=".innerHTML:moreInfo2"></p> | |
| 193 <p i18n-values=".innerHTML:moreInfo3"></p> | |
| 194 <p i18n-values=".innerHTML:moreInfo4"></p> | |
| 195 <p i18n-values=".innerHTML:moreInfo5"></p> | |
| 196 </div> | |
| 197 </div> | |
| 198 <span id="error-type" i18n-content="errorType" hidden></span> | |
| 199 </table> | |
| 200 </body> | |
| 201 </html> | |
| OLD | NEW |