1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
|
// Copyright 2013 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
/**
* WebUI to monitor File Metadata per Extension ID.
*/
var FileMetadata = (function() {
'use strict';
var FileMetadata = {};
/**
* Gets extension data so the select drop down can be filled.
*/
function getExtensions() {
chrome.send('getExtensions');
}
/**
* Renders result of getFileMetadata as a table.
* @param {Array} list of dictionaries containing 'extensionName',
* 'extensionID', 'status'.
*/
FileMetadata.onGetExtensions = function(extensionStatuses) {
var select = $('extensions-select');
// Record existing drop down extension ID. If it's still there after the
// refresh then keep it as the selected value.
var oldSelectedExtension = getSelectedExtensionId();
select.textContent = '';
for (var i = 0; i < extensionStatuses.length; i++) {
var originEntry = extensionStatuses[i];
var tr = document.createElement('tr');
var title = originEntry.extensionName + ' [' + originEntry.status + ']';
select.options.add(new Option(title, originEntry.extensionID));
// If option was the previously only selected, make it selected again.
if (originEntry.extensionID != oldSelectedExtension)
continue;
select.options[select.options.length - 1].selected = true;
}
// After drop down has been loaded with options, file metadata can be loaded
getFileMetadata();
}
/**
* @return {string} extension ID that's currently selected in drop down box.
*/
function getSelectedExtensionId() {
var dropDown = $('extensions-select').options;
if (dropDown.selectedIndex >= 0)
return dropDown[dropDown.selectedIndex].value;
return null;
}
/**
* Get File Metadata depending on which extension is selected from the drop down
* if any.
*/
function getFileMetadata() {
var dropDown = $('extensions-select');
if (dropDown.options.length === 0) {
$('file-metadata-header').textContent = '';
$('file-metadata-entries').textContent = 'No file metadata available.';
return;
}
var selectedExtensionId = getSelectedExtensionId();
chrome.send('getFileMetadata', [selectedExtensionId]);
}
/**
* Renders result of getFileMetadata as a table.
*/
FileMetadata.onGetFileMetadata = function(fileMetadataMap) {
var header = $('file-metadata-header');
// Only draw the header if it hasn't been drawn yet
if (header.children.length === 0) {
var tr = document.createElement('tr');
tr.appendChild(createElementFromText('td', 'Type'));
tr.appendChild(createElementFromText('td', 'Status'));
tr.appendChild(createElementFromText('td', 'Title'));
tr.appendChild(createElementFromText('td', 'Details'));
header.appendChild(tr);
}
// Add row entries.
var itemContainer = $('file-metadata-entries');
itemContainer.textContent = '';
for (var i = 0; i < fileMetadataMap.length; i++) {
var metadatEntry = fileMetadataMap[i];
var tr = document.createElement('tr');
tr.appendChild(createFileIconCell(metadatEntry.type));
tr.appendChild(createElementFromText('td', metadatEntry.status));
tr.appendChild(createElementFromText('td', metadatEntry.title));
tr.appendChild(createElementFromDictionary('td', metadatEntry.details));
itemContainer.appendChild(tr);
}
}
/**
* @param {string} file type string.
* @return {HTMLElement} TD with file or folder icon depending on type.
*/
function createFileIconCell(type) {
var td = createElementFromText('td', type);
td.setAttribute('class', type.toLowerCase() + '-icon');
return td;
}
// TODO(calvinlo): Move to helper file so it doesn't need to be duplicated.
/**
* Creates an element with |tagName| containing the content |text|.
* @param {string} elementName Name of the new element to be created.
* @param {string} text Text to be contained in the new element.
* @return {HTMLElement} The newly created HTML element.
*/
function createElementFromText(tagName, text) {
var element = document.createElement(tagName);
element.appendChild(document.createTextNode(text));
return element;
}
/**
* Creates an element with |tagName| containing the content |dict|.
* @param {string} elementName Name of the new element to be created.
* @param {Object.<string, string>} dict Dictionary to be contained in the new
* element.
* @return {HTMLElement} The newly created HTML element.
*/
function createElementFromDictionary(tagName, dict) {
var element = document.createElement(tagName);
for (var key in dict) {
element.appendChild(document.createTextNode(key + ': ' + dict[key]));
element.appendChild(document.createElement('br'));
}
return element;
}
function main() {
getExtensions();
$('refresh-metadata-button').addEventListener('click', getExtensions);
$('extensions-select').addEventListener('change', getFileMetadata);
}
document.addEventListener('DOMContentLoaded', main);
return FileMetadata;
})();
|