More performance improvements

This commit is contained in:
JannisX11 2021-01-31 12:51:10 +01:00
parent bb5b7b4284
commit 7d65c78b43
7 changed files with 72 additions and 42 deletions

View File

@ -727,8 +727,8 @@ BARS.defineActions(function() {
Interface.definePanels(function() {
let locator_suggestion_list = $('<datalist id="locator_suggestion_list" hidden></datalist>');
$(document.body).append(locator_suggestion_list);
let locator_suggestion_list = $('<datalist id="locator_suggestion_list" hidden></datalist>').get(0);
document.body.append(locator_suggestion_list);
Interface.Panels.keyframe = new Panel({
id: 'keyframe',

View File

@ -117,20 +117,20 @@ function updateSelection(options = {}) {
}
}
if (Cube.selected.length) {
$('.selection_only').css('visibility', 'visible')
document.querySelectorAll('.selection_only').forEach(node => node.style.setProperty('visibility', 'visible'));
} else {
if (Format.bone_rig && Group.selected) {
$('.selection_only').css('visibility', 'hidden')
$('.selection_only#element').css('visibility', 'visible')
$('.selection_only#bone').css('visibility', 'visible')
document.querySelectorAll('.selection_only').forEach(node => node.style.setProperty('visibility', 'hidden'));
document.querySelectorAll('.selection_only#element').forEach(node => node.style.setProperty('visibility', 'visible'));
document.querySelectorAll('.selection_only#bone').forEach(node => node.style.setProperty('visibility', 'visible'));
} else {
$('.selection_only').css('visibility', 'hidden')
document.querySelectorAll('.selection_only').forEach(node => node.style.setProperty('visibility', 'hidden'));
if (Locator.selected.length) {
$('.selection_only#element').css('visibility', 'visible')
document.querySelectorAll('.selection_only#element').forEach(node => node.style.setProperty('visibility', 'visible'));
}
}
if (Format.single_texture && Modes.paint) {
$('.selection_only#uv').css('visibility', 'visible')
document.querySelectorAll('.selection_only#uv').forEach(node => node.style.setProperty('visibility', 'visible'));
}
}
if (Cube.selected.length || (Format.single_texture && Modes.paint)) {

View File

@ -51,20 +51,33 @@ class BarItem {
if (!action || this instanceof BarItem) {
action = this;
}
//$(action.node).attr('title', action.description)
if (in_bar) {
$(action.node).prepend('<label class="f_left toolbar_label">'+action.name+':</label>')
$(this.node).addClass('has_label')
} else {
$(action.node).prepend(
`<div class="tooltip">
${action.name}
<label class="keybinding_label">${action.keybind || ''}</label>
<div class="tooltip_description">${this.description || ''}</div>
</div>`
)
.on('mouseenter', function() {
if (in_bar) {
let label = document.createElement('label');
label.classList.add('f_left', 'toolbar_label')
label.innerText = action.name;
this.node.classList.add('has_label')
this.node.prepend(label)
} else {
let tooltip = document.createElement('div');
tooltip.className = 'tooltip';
tooltip.innerText = action.name;
let label = document.createElement('label');
label.className = 'keybinding_label';
label.innerText = action.keybind || '';
tooltip.append(label);
if (action.description) {
let description = document.createElement('div');
description.className = 'tooltip_description';
description.innerText = action.description;
tooltip.append(description);
}
action.node.prepend(tooltip);
action.node.addEventListener('mouseenter', () => {
var tooltip = $(this).find('div.tooltip');
if (!tooltip.length) return;
var description = tooltip.find('.tooltip_description');
@ -198,14 +211,28 @@ class Action extends BarItem {
if (!this.click) this.click = data.click
this.icon_node = Blockbench.getIconNode(this.icon, this.color)
this.icon_states = data.icon_states;
this.node = $(`<div class="tool ${this.id}"></div>`).get(0)
this.node = document.createElement('div');
this.node.classList.add('tool', this.id);
this.node.append(this.icon_node);
this.nodes = [this.node]
this.menus = [];
this.menu_node = $(`<li title="${this.description||''}"><span>${this.name}</span><label class="keybinding_label">${this.keybind || ''}</label></li>`).get(0)
$(this.node).add(this.menu_node).prepend(this.icon_node)
this.menu_node = document.createElement('li');
this.menu_node.title = this.description || '';
this.menu_node.append(this.icon_node.cloneNode(true));
let span = document.createElement('span');
span.innerText = this.name;
this.menu_node.append(span);
let label = document.createElement('label');
label.classList.add('keybinding_label')
label.innerText = this.keybind || '';
this.menu_node.append(label);
this.addLabel(data.label)
this.updateKeybindingLabel()
$(this.node).click(function(e) {scope.trigger(e)})
this.node.onclick = (e) => {
scope.trigger(e)
}
}
trigger(event) {
var scope = this;
@ -222,11 +249,11 @@ class Action extends BarItem {
scope.uses++;
$(scope.nodes).each(function() {
$(this).css('color', 'var(--color-light)')
this.style.setProperty('color', 'var(--color-light)')
})
setTimeout(function() {
$(scope.nodes).each(function() {
$(this).css('color', '')
this.style.setProperty('color', '')
})
}, 200)
return true;
@ -304,7 +331,9 @@ class Tool extends Action {
this.onCanvasClick = data.onCanvasClick;
this.onSelect = data.onSelect;
this.onUnselect = data.onUnselect;
$(this.node).click(function() {scope.select()})
this.node.onclick = () => {
scope.select();
}
}
select() {
if (this === Toolbox.selected) return;
@ -1923,7 +1952,7 @@ const BARS = {
})
},
updateConditions() {
var open_input = $('input[type="text"]:focus, input[type="number"]:focus, div[contenteditable="true"]:focus')[0]
var open_input = document.querySelector('input[type="text"]:focus, input[type="number"]:focus, div[contenteditable="true"]:focus');
for (var key in Toolbars) {
if (Toolbars.hasOwnProperty(key) &&
(!open_input || $(Toolbars[key].node).has(open_input).length === 0)

View File

@ -317,8 +317,9 @@ function updateInterfacePanels() {
$('.sidebar#left_bar').css('display', Prop.show_left_bar ? 'flex' : 'none');
$('.sidebar#right_bar').css('display', Prop.show_right_bar ? 'flex' : 'none');
}
let page = document.getElementById('page_wrapper');
$('#page_wrapper').css(
page.style.setProperty(
'grid-template-columns',
Interface.data.left_bar_width+'px auto '+ Interface.data.right_bar_width +'px'
)
@ -330,7 +331,7 @@ function updateInterfacePanels() {
var right_width = $('.sidebar#right_bar > .panel:visible').length ? Interface.right_bar_width : 0;
if (!left_width || !right_width) {
$('#page_wrapper').css(
page.style.setProperty(
'grid-template-columns',
left_width+'px auto '+ right_width +'px'
)

View File

@ -112,7 +112,7 @@ window.BedrockEntityManager = {
}
}).show()
$('#import_texture_list li').each((i, el) => {
$(el).css('background-image', `url("${ valid_textures_list[i].replace(/\\/g, '/').replace(/#/g, '%23') }?${Math.round(Math.random()*1e6)}")`)
el.style.setProperty('background-image', `url("${ valid_textures_list[i].replace(/\\/g, '/').replace(/#/g, '%23') }?${Math.round(Math.random()*1e6)}")`)
.click(function() {
if (selected_textures.includes(i)) {
selected_textures.remove(i)

View File

@ -165,8 +165,8 @@ class Preview {
var tag = scope.annotations[key];
if (tag.object.visible) {
var pos = tag.object.toScreenPosition(scope.camera, scope.canvas);
$(tag.node).css('left', pos.x+'px');
$(tag.node).css('top', pos.y+'px');
tag.node.style.setProperty('left', pos.x+'px');
tag.node.style.setProperty('top', pos.y+'px');
}
}
}
@ -236,7 +236,7 @@ class Preview {
this.loadBackground()
this.selection = {
box: $('<div id="selection_box", class="selection_rectangle"></div>')
box: $('<div id="selection_box" class="selection_rectangle"></div>')
}
this.raycaster = new THREE.Raycaster()
@ -868,9 +868,9 @@ class Preview {
if (this.background && this.background.image) {
if (!this.background.imgtag) this.background.imgtag = new Image();
this.background.imgtag.src = this.background.image.replace(/#/g, '%23');
$(this.canvas).css('background-image', `url("${this.background.image.replace(/\\/g, '/').replace(/#/g, '%23')}")`)
this.canvas.style.setProperty('background-image', `url("${this.background.image.replace(/\\/g, '/').replace(/#/g, '%23')}")`)
} else {
$(this.canvas).css('background-image', 'none')
this.canvas.style.setProperty('background-image', 'none')
}
this.updateBackground()
return this;
@ -890,9 +890,9 @@ class Preview {
pos_x += (bg.x * zoom) + this.width/2 - ( bg.size * zoom) / 2
pos_y += (bg.y * zoom) + this.height/2 -((bg.size / bg.ratio||1) * zoom) / 2
$(this.canvas).css('background-position-x', pos_x + 'px')
$(this.canvas).css('background-position-y', pos_y + 'px')
$(this.canvas).css('background-size', bg.size * zoom +'px')
this.canvas.style.setProperty('background-position-x', pos_x + 'px')
this.canvas.style.setProperty('background-position-y', pos_y + 'px')
this.canvas.style.setProperty('background-size', bg.size * zoom +'px')
return this;
}
clearBackground() {

View File

@ -1138,7 +1138,7 @@ class UVEditor {
updateInterface() {
for (var key in this.sliders) {
var slider = this.sliders[key]
$(slider.node).css('display', BARS.condition(slider.condition)?'block':'none')
slider.node.style.setProperty('display', BARS.condition(slider.condition)?'block':'none')
}
this.jquery.size.resizable('option', 'disabled', Project.box_uv)
}