Commit 6e3d077b authored by Eriko Kurimoto's avatar Eriko Kurimoto Committed by Commit Bot

Log Page UI automatically changes when a new type is added

By this change, developers don't need to update the log page UI when
expanding log types to store.

Bug: None
Test: None
Change-Id: I4fcd4d5f771a3f380376effa23ca1315f2d07a05
Reviewed-on: https://chromium-review.googlesource.com/1248525Reviewed-by: default avatarDavid Tseng <dtseng@chromium.org>
Reviewed-by: default avatarYuki Awano <yawano@chromium.org>
Commit-Queue: Yuki Awano <yawano@chromium.org>
Cr-Commit-Position: refs/heads/master@{#595376}
parent 0e3d484a
......@@ -11,45 +11,12 @@
<body>
<h1 class="i18n" msg="log_title">ChromeVox Log</h1>
<div id="logFilters">
<div id="header">
<button id="clearLog">Clear Log</button>
<label>Show: </label>
<label>
<input id="speechFilter" type="checkbox" class="log-filter"
name="speechFilter">
<span>speech</span>
</label>
<label>
<input id="earconFilter" type="checkbox" class="log-filter"
name="earconFilter">
<span>earcon</span>
</label>
<label>
<input id="brailleFilter" type="checkbox" class="log-filter"
name="brailleFilter">
<span>braille</span>
</label>
<label>
<input id="speechRuleFilter" type="checkbox" class="log-filter"
name="speechRuleFilter">
<span>speech rule</span>
</label>
<label>
<input id="brailleRuleFilter" type="checkbox" class="log-filter"
name="brailleRuleFilter">
<span>braille rule</span>
</label>
<label>
<input id="eventFilter" type="checkbox" class="log-filter"
name="eventFilter">
<span>event</span>
</label>
<label>
<input id="treeFilter" type="checkbox" class="log-filter"
name="treeFilter">
<span>tree</span>
</label>
<button id="saveLog">Save Log</button>
<div id="logFilters">
<label>Show: </label>
</div>
</div>
<div id="logList"></div>
</body>
......
......@@ -42,6 +42,22 @@ LogPage.init = function() {
LogPage.backgroundWindow = chrome.extension.getBackgroundPage();
LogPage.LogStore = LogPage.backgroundWindow.LogStore.getInstance();
/** Create filter checkboxes. */
for (var type of LogStore.logTypes()) {
var label = document.createElement('label');
var input = document.createElement('input');
input.id = type + 'Filter';
input.type = 'checkbox';
input.classList.add('log-filter');
label.appendChild(input);
var span = document.createElement('span');
span.textContent = type;
label.appendChild(span);
document.getElementById('logFilters').appendChild(label);
}
var clearLogButton = document.getElementById('clearLog');
clearLogButton.onclick = function(event) {
LogPage.LogStore.clearLog();
......@@ -59,7 +75,7 @@ LogPage.init = function() {
var checkboxes = document.getElementsByClassName('log-filter');
var filterEventListener = function(event) {
var target = event.target;
LogPage.setFilterTypeEnabled(target.name, String(target.checked));
LogPage.setFilterTypeEnabled(target.id, String(target.checked));
location.search = LogPage.createUrlParams();
};
for (var i = 0; i < checkboxes.length; i++)
......
......@@ -56,13 +56,16 @@ TextLog.prototype = {
},
};
/** @enum {string} */
/**
* Filter type checkboxes are shown in this order at the log page.
* @enum {string}
*/
TextLog.LogType = {
SPEECH: 'speech',
EARCON: 'earcon',
BRAILLE: 'braille',
SPEECH_RULE: 'speechRule',
BRAILLE: 'braille',
BRAILLE_RULE: 'brailleRule',
EARCON: 'earcon',
EVENT: 'event',
};
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment