mirror of
https://github.com/loot/libloot.git
synced 2026-07-27 14:16:01 -07:00
Editable tables now use paper inputs.
This commit is contained in:
Oliver Hamlet
@@ -1,76 +1,127 @@
|
||||
<link rel="import" href="../bower_components/polymer/polymer.html">
|
||||
<link rel="import" href="../bower_components/paper-input/paper-input.html">
|
||||
<link rel="import" href="../bower_components/paper-input/paper-input-decorator.html">
|
||||
<link rel="import" href="../bower_components/paper-item/paper-item.html">
|
||||
<link rel="import" href="../bower_components/paper-icon-button/paper-icon-button.html">
|
||||
<link rel="import" href="../bower_components/core-icons/core-icons.html">
|
||||
<link rel="import" href="../bower_components/core-input/core-input.html">
|
||||
|
||||
<link rel="import" href="loot-dropdown-menu.html">
|
||||
|
||||
<template id="fileRow">
|
||||
<tr>
|
||||
<td><input class="name" type="text" required></td>
|
||||
<td><input class="display" type="text"></td>
|
||||
<td><input class="condition" type="text"></td>
|
||||
<td>
|
||||
<paper-input-decorator error="A filename is required.">
|
||||
<input is="core-input" class="name" required>
|
||||
</paper-input-decorator>
|
||||
</td>
|
||||
<td><paper-input class="display"></paper-input></td>
|
||||
<td><paper-input class="condition"></paper-input></td>
|
||||
<td><paper-icon-button class="delete" icon="delete"></paper-icon-button></td>
|
||||
</tr>
|
||||
</template>
|
||||
<template id="messageRow">
|
||||
<tr>
|
||||
<td><select class="type">
|
||||
<option value="say">Note</option>
|
||||
<option value="warn">Warning</option>
|
||||
<option value="error">Error</option>
|
||||
</select>
|
||||
<td>
|
||||
<loot-dropdown-menu class="type" valueattr="value">
|
||||
<paper-item value="say">Note</paper-item>
|
||||
<paper-item value="warn">Warning</paper-item>
|
||||
<paper-item value="error">Error</paper-item>
|
||||
</loot-dropdown-menu>
|
||||
</td>
|
||||
<td><input class="content" type="text" required></td>
|
||||
<td><input class="condition" type="text"></td>
|
||||
<td><select class="language">
|
||||
<td>
|
||||
<paper-input-decorator error="A content string is required.">
|
||||
<input is="core-input" class="content" required>
|
||||
</paper-input-decorator>
|
||||
</td>
|
||||
<td><paper-input class="condition"></paper-input></td>
|
||||
<td>
|
||||
<loot-dropdown-menu class="language" valueattr="value">
|
||||
<!-- Language <option> elements go here. -->
|
||||
</select>
|
||||
</loot-dropdown-menu>
|
||||
</td>
|
||||
<td><paper-icon-button class="delete" icon="delete"></paper-icon-button></td>
|
||||
</tr>
|
||||
</template>
|
||||
<template id="tagRow">
|
||||
<tr>
|
||||
<td><select class="type">
|
||||
<option value="add">Add</option>
|
||||
<option value="remove">Remove</option>
|
||||
</select>
|
||||
<td>
|
||||
<loot-dropdown-menu class="type" valueattr="value">
|
||||
<paper-item value="add">Add</paper-item>
|
||||
<paper-item value="remove">Remove</paper-item>
|
||||
</loot-dropdown-menu>
|
||||
</td>
|
||||
<td><input class="name" type="text" required></td>
|
||||
<td><input class="condition" type="text"></td>
|
||||
<td>
|
||||
<paper-input-decorator error="A name is required.">
|
||||
<input is="core-input" class="name" required>
|
||||
</paper-input-decorator></td>
|
||||
<td><paper-input class="condition"></paper-input></td>
|
||||
<td><paper-icon-button class="delete" icon="delete"></paper-icon-button></td>
|
||||
</tr>
|
||||
</template>
|
||||
<template id="dirtyInfoRow">
|
||||
<tr>
|
||||
<td><input class="crc" type="text" maxlength="8" minlength="8" pattern="[0-9A-Fa-f]{8}" required></td>
|
||||
<td><input class="itm" type="number" min="0" step="1" value="0"></td>
|
||||
<td><input class="udr" type="number" min="0" step="1" value="0"></td>
|
||||
<td><input class="nav" type="number" min="0" step="1" value="0"></td>
|
||||
<td><input class="util" type="text" required></td>
|
||||
<td>
|
||||
<paper-input-decorator error="A CRC is required.">
|
||||
<input is="core-input" class="crc" maxlength="8" minlength="8" pattern="[0-9A-Fa-f]{8}" required>
|
||||
</paper-input-decorator>
|
||||
</td>
|
||||
<td>
|
||||
<paper-input-decorator>
|
||||
<input is="core-input" class="itm" type="number" min="0" step="1" value="0">
|
||||
</paper-input-decorator>
|
||||
</td>
|
||||
<td>
|
||||
<paper-input-decorator>
|
||||
<input is="core-input" class="udr" type="number" min="0" step="1" value="0">
|
||||
</paper-input-decorator>
|
||||
</td>
|
||||
<td>
|
||||
<paper-input-decorator>
|
||||
<input is="core-input" class="nav" type="number" min="0" step="1" value="0">
|
||||
</paper-input-decorator>
|
||||
</td>
|
||||
<td>
|
||||
<paper-input-decorator error="A utility name is required.">
|
||||
<input is="core-input" class="util" required>
|
||||
</paper-input-decorator>
|
||||
</td>
|
||||
<td><paper-icon-button class="delete" icon="delete"></paper-icon-button></td>
|
||||
</tr>
|
||||
</template>
|
||||
<template id="locationRow">
|
||||
<tr>
|
||||
<td><input class="link" type="text" required></td>
|
||||
<td><input class="ver" type="text"></td>
|
||||
<td>
|
||||
<paper-input-decorator error="A link is required.">
|
||||
<input is="core-input" class="link" required>
|
||||
</paper-input-decorator>
|
||||
</td>
|
||||
<td><paper-input class="ver"></paper-input></td>
|
||||
<td><paper-icon-button class="delete" icon="delete"></paper-icon-button></td>
|
||||
</tr>
|
||||
</template>
|
||||
<template id="gameRow">
|
||||
<tr>
|
||||
<td><input class="name" type="text" required></td>
|
||||
<td>
|
||||
<select class="type">
|
||||
<!-- Game <option> elements go here. -->
|
||||
</select>
|
||||
<paper-input-decorator error="A name is required.">
|
||||
<input is="core-input" class="name" required>
|
||||
</paper-input-decorator>
|
||||
</td>
|
||||
<td><input class="folder" type="text" required></td>
|
||||
<td><input class="master" type="text"></td>
|
||||
<td><input class="repo" type="text"></td>
|
||||
<td><input class="branch" type="text"></td>
|
||||
<td><input class="path" type="text"></td>
|
||||
<td><input class="registry" type="text"></td>
|
||||
<td>
|
||||
<loot-dropdown-menu class="type" valueattr="value">
|
||||
<!-- Game <option> elements go here. -->
|
||||
</loot-dropdown-menu>
|
||||
</td>
|
||||
<td>
|
||||
<paper-input-decorator error="A folder is required.">
|
||||
<input is="core-input" class="folder" required>
|
||||
</paper-input-decorator>
|
||||
</td>
|
||||
<td><paper-input class="master"></paper-input></td>
|
||||
<td><paper-input class="repo"></paper-input></td>
|
||||
<td><paper-input class="branch"></paper-input></td>
|
||||
<td><paper-input class="path"></paper-input></td>
|
||||
<td><paper-input class="registry"></paper-input></td>
|
||||
<td><paper-icon-button class="delete" icon="delete"></paper-icon-button></td>
|
||||
</tr>
|
||||
</template>
|
||||
@@ -143,16 +194,11 @@ td paper-icon-button.hidden {
|
||||
if (trash.length > 0 && (!writableOnly || !trash[0].classList.contains('hidden'))) {
|
||||
var rowData = {};
|
||||
|
||||
var inputs = rows[i].querySelectorAll('input, paper-input');
|
||||
var inputs = rows[i].querySelectorAll('input, paper-input, loot-dropdown-menu');
|
||||
for (var j = 0; j < inputs.length; ++j) {
|
||||
rowData[inputs[j].className] = inputs[j].value;
|
||||
}
|
||||
|
||||
var selects = rows[i].getElementsByTagName('select');
|
||||
for (var j = 0; j < selects.length; ++j) {
|
||||
rowData[selects[j].className] = selects[j].value;
|
||||
}
|
||||
|
||||
writableRows.push(rowData);
|
||||
}
|
||||
}
|
||||
@@ -176,39 +222,17 @@ td paper-icon-button.hidden {
|
||||
trash.classList.toggle('hidden', readOnly);
|
||||
}
|
||||
|
||||
var inputs = row.querySelectorAll('input, paper-input');
|
||||
var inputs = row.querySelectorAll('input, paper-input, loot-dropdown-menu');
|
||||
for (var i = 0; i < inputs.length; ++i) {
|
||||
if (classMask) {
|
||||
for (var j = 0; j < classMask.length; ++j) {
|
||||
if (inputs[i].classList.contains(classMask[j])) {
|
||||
if (inputs[i].tagName == 'PAPER-INPUT') {
|
||||
inputs[i].disabled = readOnly;
|
||||
} else {
|
||||
inputs[i].readOnly = readOnly;
|
||||
}
|
||||
inputs[i].disabled = readOnly;
|
||||
break;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (inputs[i].tagName == 'PAPER-INPUT') {
|
||||
inputs[i].disabled = readOnly;
|
||||
} else {
|
||||
inputs[i].readOnly = readOnly;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var selects = row.getElementsByTagName('select');
|
||||
for (var i = 0; i < selects.length; ++i) {
|
||||
if (classMask) {
|
||||
for (var j = 0; j < classMask.length; ++j) {
|
||||
if (selects[i].classList.contains(classMask[j])) {
|
||||
selects[i].disabled = readOnly;
|
||||
break;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
selects[i].disabled = readOnly;
|
||||
inputs[i].disabled = readOnly;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1304,9 +1304,9 @@ function initVars() {
|
||||
/* Fill in game row template's game type options. */
|
||||
var select = document.querySelector('link[rel="import"][href$="editable-table.html"]');
|
||||
if (select) {
|
||||
select = select.import.querySelector('#gameRow').content.querySelector('select')
|
||||
select = select.import.querySelector('#gameRow').content.querySelector('.type')
|
||||
} else {
|
||||
select = document.querySelector('#gameRow').content.querySelector('select');
|
||||
select = document.querySelector('#gameRow').content.querySelector('.type');
|
||||
}
|
||||
for (var j = 0; j < loot.gameTypes.length; ++j) {
|
||||
var option = document.createElement('option');
|
||||
|
||||
Reference in New Issue
Block a user