Change "input-tabs" id to be for the actual ul element.

Automatically disable auto-bake if more than 20 files are input.
This commit is contained in:
j433866 2019-04-01 16:15:09 +01:00
parent 7bf8467637
commit cd094d1475
3 changed files with 34 additions and 16 deletions

View File

@ -549,6 +549,10 @@ class InputWaiter {
*/
loadUIFiles(files) {
let inputNum;
if (files.length > 20) {
this.manager.controls.setAutoBake(false);
this.app.alert("Auto-Bake is disabled by default when inputting more than 20 files.", 5000);
}
for (let i = 0; i < files.length; i++) {
inputNum = this.getActiveTab();
if (i > 0) {
@ -771,16 +775,21 @@ class InputWaiter {
});
const tabsWrapper = document.getElementById("input-tabs");
const numTabs = tabsWrapper.firstElementChild.children.length;
const numTabs = tabsWrapper.children.length;
if (numTabs < this.maxTabs) {
// Create a tab element
const newTab = this.createTabElement(inputNum);
tabsWrapper.firstElementChild.appendChild(newTab);
tabsWrapper.appendChild(newTab);
if (numTabs > 0) {
tabsWrapper.style.display = "block";
tabsWrapper.parentElement.style.display = "block";
const tabButtons = document.getElementsByClassName("tab-buttons");
for (let i = 0; i < tabButtons.length; i++) {
tabButtons.item(i).style.display = "inline-block";
}
document.getElementById("input-wrapper").style.height = "calc(100% - var(--tab-height) - var(--title-height))";
document.getElementById("input-highlighter").style.height = "calc(100% - var(--tab-height) - var(--title-height))";
@ -829,8 +838,7 @@ class InputWaiter {
* @param {number} activeTab
*/
refreshTabs(activeTab) {
const tabsWrapper = document.getElementById("input-tabs");
const tabsList = tabsWrapper.firstElementChild;
const tabsList = document.getElementById("input-tabs");
let newInputs = this.getNearbyNums(activeTab, "right");
if (newInputs.length < this.maxTabs) {
newInputs = this.getNearbyNums(activeTab, "left");
@ -846,13 +854,23 @@ class InputWaiter {
}
if (newInputs.length > 1) {
tabsWrapper.style.display = "block";
tabsList.parentElement.style.display = "block";
const tabButtons = document.getElementsByClassName("tab-buttons");
for (let i = 0; i < tabButtons.length; i++) {
tabButtons.item(i).style.display = "inline-block";
}
document.getElementById("input-wrapper").style.height = "calc(100% - var(--tab-height) - var(--title-height))";
document.getElementById("input-highlighter").style.height = "calc(100% - var(--tab-height) - var(--title-height))";
document.getElementById("input-file").style.height = "calc(100% - var(--tab-height) - var(--title-height))";
} else {
tabsWrapper.style.display = "none";
tabsList.parentElement.style.display = "none";
const tabButtons = document.getElementsByClassName("tab-buttons");
for (let i = 0; i < tabButtons.length; i++) {
tabButtons.item(i).style.display = "none";
}
document.getElementById("input-wrapper").style.height = "calc(100% - var(--title-height))";
document.getElementById("input-highlighter").style.height = "calc(100% - var(--title-height))";
@ -958,7 +976,7 @@ class InputWaiter {
}
const tabsWrapper = document.getElementById("input-tabs");
const tabs = tabsWrapper.firstElementChild.children;
const tabs = tabsWrapper.children;
let found = false;
for (let i = 0; i < tabs.length; i++) {
@ -1116,7 +1134,7 @@ class InputWaiter {
* @returns {Element}
*/
getTabItem(inputNum) {
const tabs = document.getElementById("input-tabs").firstElementChild.children;
const tabs = document.getElementById("input-tabs").children;
for (let i = 0; i < tabs.length; i++) {
if (parseInt(tabs.item(i).getAttribute("inputNum"), 10) === inputNum) {
return tabs.item(i);

View File

@ -161,8 +161,8 @@ class Manager {
document.getElementById("btn-previous-tab").addEventListener("click", this.input.changeTabLeft.bind(this.input));
document.getElementById("btn-next-tab").addEventListener("click", this.input.changeTabRight.bind(this.input));
document.getElementById("btn-go-to-tab").addEventListener("click", this.input.goToTab.bind(this.input));
this.addDynamicListener("#input-tabs ul li .btn-close-tab i", "click", this.input.removeTabClick, this.input);
this.addDynamicListener("#input-tabs ul li .input-tab-content", "click", this.input.changeTabClick, this.input);
this.addDynamicListener("#input-tabs li .btn-close-tab i", "click", this.input.removeTabClick, this.input);
this.addDynamicListener("#input-tabs li .input-tab-content", "click", this.input.changeTabClick, this.input);
// Output
document.getElementById("save-to-file").addEventListener("click", this.output.saveClick.bind(this.output));

View File

@ -229,13 +229,13 @@
<div class="title no-select">
<label for="input-text">Input</label>
<span class="float-right">
<button type="button" class="btn btn-primary bmd-btn-icon" id="btn-previous-tab" data-toggle="tooltip" title="Go to the previous tab">
<button type="button" class="btn btn-primary bmd-btn-icon tab-buttons" id="btn-previous-tab" data-toggle="tooltip" title="Go to the previous tab">
<i class="material-icons">keyboard_arrow_left</i>
</button>
<button type="button" class="btn btn-primary bmd-btn-icon" id="btn-go-to-tab" data-toggle="tooltip" title="Go to a specific tab">
<button type="button" class="btn btn-primary bmd-btn-icon tab-buttons" id="btn-go-to-tab" data-toggle="tooltip" title="Go to a specific tab">
<i class="material-icons">more_horiz</i>
</button>
<button type="button" class="btn btn-primary bmd-btn-icon" id="btn-next-tab" data-toggle="tooltip" title="Go to the next tab">
<button type="button" class="btn btn-primary bmd-btn-icon tab-buttons" id="btn-next-tab" data-toggle="tooltip" title="Go to the next tab">
<i class="material-icons">keyboard_arrow_right</i>
</button>
<button type="button" class="btn btn-primary bmd-btn-icon" id="btn-new-tab" data-toggle="tooltip" title="Add a new input tab">
@ -256,8 +256,8 @@
<div class="io-info" id="input-info"></div>
<div class="io-info" id="input-selection-info"></div>
</div>
<div id="input-tabs" style="display: none;">
<ul>
<div id="input-tabs-wrapper" style="display: none;">
<ul id="input-tabs">
</ul>
</div>
<div class="textarea-wrapper no-select input-wrapper" id="input-wrapper">