<!DOCTYPE html>
<html id="template_root">
<head>
<title i18n-content="title"></title>
<style>
body {
  background-color:#500;
  font-family:Helvetica,Arial,sans-serif;
  margin:0px;
}
.background {
  position:absolute;
  width:100%;
  height:100%;
}
.cell {
  padding:40px;
}
.box {
  width:80%;
  background-color:white;
  color:black;
  font-size:10pt;
  line-height:16pt;
  text-align:left;
  padding:20px;
  position:relative;
  -webkit-box-shadow:3px 3px 8px #200;
  border-radius:5px;
}
html[dir='rtl'] .box {
  text-align:right;
}

.icon {
  position:absolute;
}
.title {
  margin:0px 87px 0px;
  font-size:18pt;
  line-height: 140%;
  margin-bottom:6pt;
  font-weight:bold;
  color:#660000;
}
.main {
  margin:0px 90px 0px;
}
.submission {
  margin:15px 5px 15px 0px;
  padding:0px;
}
input {
  margin:0px;
}
.proceedbutton {
}
.helpbutton {
  float:right;
}
.example {
  margin: 30px 90px 0px;
  border-top:1px solid #ccc;
  padding-top:6px;
}
.moreinfotitle {
  margin-left:5px;
  margin-right:5px;
}

.errorlist {
  background-color:white;
  color:black;
  font-size:10pt;
  line-height:16pt;
  text-align:left;
}
</style>

<script>
function agreed(form) {
  form.continue_button.disabled = !form.continue_button.disabled;
}

function sendCommand(command) {
  window.domAutomationController.setAutomationId(1);
  window.domAutomationController.send(command);
}

function learnMore() {
  sendCommand('learnMore');
}

function proceed() {
  sendCommand('proceed');
}

function takeMeBack() {
  sendCommand('takeMeBack');
}

/**
 * Called when the user clicks the link to show the diagnostic or report a
 * malware site, depending on the threat type.
 * @param {MouseEvent} event The mouse event that triggered this call.
 */
function showOrReport(event) {
  var id = event.currentTarget.getAttribute('chromiumID');
  var isMalware = event.currentTarget.getAttribute('chromiumIsMalware');
  var cmd = isMalware ? 'showDiagnostic:' : 'reportError:';
  sendCommand(cmd + id);
  return false;
}
</script>
</head>

<body oncontextmenu="return false;">
<div class="background">
  <img src="ssl/roadblock_background.png" width="100%" height="100%"
      alt="background" onmousedown="return false;">
</div>
<table width="100%" cellspacing="0" cellpadding="0">
  <td class="cell" valign="middle" align="center">
    <div class="box">
      <div class="icon">
        <img src="../../../ui/webui/resources/images/phishing_icon.png" alt="Malware Icon"
            onmousedown="return false;">
      </div>
      <div class="title" i18n-content="headLine"></div>
      <div class="main" i18n-values=".innerHTML:description1"></div>
      <div class="main" i18n-content="description2"></div>
      <div class="main">
        <table cellpadding="5" jsvalues="$counter:{value: 0}">
          <tr jsselect="errors" class="errorlist">
            <td jscontent="typeLabel"></td>
            <td jscontent="url"></td>
            <td><a href="" onclick="showOrReport(event)"
                jsvalues="chromiumID:$counter.value;chromiumIsMalware:type=='malware'"
                jscontent="errorLink" jseval="$counter.value++"></a></td>
          </tr>
        </table>
      </div>

      <div class="main">
        <a href="" i18n-content="description3" onmousedown="return false;"
            onclick="learnMore(); return false;"></a>
      </div>
      <div class="main">
        <form class="submission">
          <input id="checky" name="checky" type="checkbox"
              jsdisplay="!proceedDisabled"
              onclick="agreed(this.form)">&nbsp;
          <label for="checky" i18n-content="confirm_text"
              jsdisplay="!proceedDisabled"></label>
          <button name="continue_button" i18n-content="continue_button"
              disabled="true" jsdisplay="!proceedDisabled"
              onclick="proceed();"></button><br>
          <button name="back_button" i18n-content="back_button"
              onclick="takeMeBack()"></button>
        </form>
      </div>
    </div>
  </td>
</table>
</body>
</html>