<!doctype html>
<html>
<head>
<!-- TODO(wnwen): Investigate using widgets from ui/webui/resources -->
<link rel="stylesheet" type="text/css" href="../res/setup.css">
<style type="text/css">
* {
font-family: Arial, Helvetica, sans-serif;
font-size: 10pt;
}
</style>
<script type="text/javascript" src="common.js"></script>
<script type="text/javascript" src="storage.js"></script>
<script type="text/javascript" src="matrix.js"></script>
<script type="text/javascript" src="cvd_type.js"></script>
<script type="text/javascript" src="cvd.js"></script>
<script type="text/javascript" src="popup.js"></script>
</head>
<body>
<h2><span i18n-content="color_enhancer_appname"><span></h2>
<table>
<tr>
<th><span i18n-content="color_enhancer_enable"></span></th>
<th>
<span i18n-content="color_enhancer_adjustment_factor">
</span>
</th>
</tr>
<tr>
<td><input id="enable" type="checkbox"></td>
<td>
<input id="delta" type="range" min=0 max=1.0 step=0.1
defaultValue="0.5">
</td>
<td>
<button id="setup" i18n-content="color_enhancer_setup_button"></button>
</td>
<td>
<button id="advanced-toggle" i18n-content="color_enhancer_advanced" disabled></button>
</td>
</tr>
</table>
</div>
<div id="setup-panel" class="collapsed">
<h3><span i18n-content="color_enhancer_setup_heading"></span></h3>
<section id="step-1">
<div>
<span i18n-content="color_enhancer_type_choice">
</span>
</div>
<div class="template swatch">
<span>⋆</span>
</div>
<div id="swatches">
<div id="row-highlight" hidden></div>
<!-- Auto populated by initialize() -->
</div>
</section>
<section id="step-2">
<div>
<span i18n-content="color_enhancer_severity">
</span>
<input id="severity" type="range" min=0 max=1.0 step=0.1 value="0">
</div>
</section>
<section id="step-3" class="advanced">
<div>
<span i18n-content="color_enhancer_axis">
</span>
</div>
<div id="row-axis" class="row">
<label>
<input type="radio" class="axis" id="axis-default" name="CvdAxis" value="DEFAULT">
<span i18n-content="color_enhancer_axis_default"> </span></input>
</label>
<label>
<input type="radio" class="axis" id="axis-red" name="CvdAxis" value="RED">
<span i18n-content="color_enhancer_axis_red"> </span></input>
</label>
<label>
<input type="radio" class="axis" id="axis-green" name="CvdAxis" value="GREEN">
<span i18n-content="color_enhancer_axis_green"> </span></input>
</label>
<label>
<input type="radio" class="axis" id="axis-blue" name="CvdAxis" value="BLUE">
<span i18n-content="color_enhancer_axis_blue"> </span></input>
</label>
</div>
</section>
<div id="setup-button-strip" class="row">
<button id="reset" i18n-content="color_enhancer_reset"></button>
<button id="ok" i18n-content="color_enhancer_ok"></button>
<button id="cancel" i18n-content="color_enhancer_cancel"></button>
</div>
</div>
</body>
</html>