mirror/blockbench
2
0
Fork 0
mirror of https://github.com/JannisX11/blockbench.git synced 2024-11-21 01:13:37 +08:00
Code Issues Packages Projects Releases Wiki Activity

Improve panel rearranging

Browse Source 
Add independent positioning for paint mode UV window
Fix issue with bone pivot toolbar
This commit is contained in:
JannisX11 2022-03-10 21:24:33 +01:00
parent 3d40ca5e67
commit ec5bb874a8
14 changed files with 55 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
css/panels.css
View File

@ -229,6 +229,21 @@
left: unset;
width: 3px;
}
#center[snapside=top]::before,
#center[snapside=bottom]::before {
content: "";
position: absolute;
right: 0;
top: 0;
left: 0;
background-color: var(--color-accent);
opacity: 0.1;
height: 64px;
}
#center[snapside=bottom]::before {
top: unset;
bottom: 0;
}
/*Display*/

8
css/setup.css
View File

@ -596,14 +596,6 @@
border-bottom-color: transparent !important;
border-left-color: transparent !important;
}
#nslide_head {
margin-top: 30px;
color: var(--color-light);
white-space: nowrap;
position: absolute;
z-index: 1111;
background-color: var(--color-back);
}
div.nslide_arrow {
position: absolute;
z-index: 17;

3
js/animations/animation.js
View File

@ -865,7 +865,8 @@ const Animator = {
scene.remove(Animator.motion_trail);
Animator.resetParticles(true);
Toolbars.element_origin.toPlace()
let anchor = Panels.element.node.querySelector('#element_origin_toolbar_anchor');
if (anchor) anchor.before(Toolbars.element_origin.node);
Canvas.updateAllBones()
},

3
js/animations/timeline.js
View File

@ -1327,7 +1327,6 @@ BARS.defineActions(function() {
new Action('timeline_setups', {
name: 'menu.timeline.setups',
icon: 'folder_special',
condition: {modes: ['animate'], project: true, method: () => Project.timeline_setups.length},
children() {
@ -1360,8 +1359,6 @@ BARS.defineActions(function() {
}
})
new Action('save_timeline_setup', {
name: 'menu.timeline.save_setup',
description: 'menu.timeline.save_setup.desc',
icon: 'star',
condition: {modes: ['animate']},
async click() {

8
js/blockbench.js
View File

@ -138,18 +138,18 @@ function updateSelection(options = {}) {
} else {
if (Format.bone_rig && Group.selected) {
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#panel_element').forEach(node => node.style.setProperty('visibility', 'visible'));
} else {
document.querySelectorAll('.selection_only').forEach(node => node.style.setProperty('visibility', 'hidden'));
if (Outliner.selected.length) {
document.querySelectorAll('.selection_only#element').forEach(node => node.style.setProperty('visibility', 'visible'));
document.querySelectorAll('.selection_only#panel_element').forEach(node => node.style.setProperty('visibility', 'visible'));
}
}
if (Group.selected || NullObject.selected[0]) {
document.querySelectorAll('.selection_only#bone').forEach(node => node.style.setProperty('visibility', 'visible'));
document.querySelectorAll('.selection_only#panel_bone').forEach(node => node.style.setProperty('visibility', 'visible'));
}
if (Format.single_texture && Modes.paint) {
document.querySelectorAll('.selection_only#uv').forEach(node => node.style.setProperty('visibility', 'visible'));
document.querySelectorAll('.selection_only#panel_uv').forEach(node => node.style.setProperty('visibility', 'visible'));
}
}
if (Outliner.selected.length || (Format.single_texture && Modes.paint)) {

11
js/interface/actions.js
View File

@ -133,9 +133,8 @@ class BarItem {
}
}
getNode(ignore_disconnected) {
var scope = this;
if (scope.nodes.length === 0) {
scope.nodes = [scope.node]
if (this.nodes.length === 0) {
this.nodes = [this.node]
}
for (let node of this.nodes) {
if (!node.isConnected && !ignore_disconnected) {
@ -143,11 +142,11 @@ class BarItem {
return node;
}
}
var clone = $(scope.node).clone(true, true).get(0);
var clone = $(this.node).clone(true, true).get(0);
clone.onclick = (e) => {
scope.trigger(e)
this.trigger(e)
}
scope.nodes.push(clone);
this.nodes.push(clone);
return clone;
}
toElement(destination) {

9
js/interface/interface.js
View File

@ -75,7 +75,14 @@ const Interface = {
timeline_head: Blockbench.isMobile ? 140 : 196,
left_bar: ['uv', 'textures', 'display', 'animations', 'keyframe', 'variable_placeholders'],
right_bar: ['element', 'bone', 'color', 'skin_pose', 'outliner', 'chat'],
panels: {}
panels: {
paint: {
slot: 'bottom',
float_position: [300, 0],
float_size: [500, 600],
height: 500
}
}
},
get left_bar_width() {
return Prop.show_left_bar && Interface.getLeftPanels().length ? Interface.data.left_bar_width : 0;

1
js/interface/menu.js
View File

@ -190,6 +190,7 @@ class Menu {
})
search_button.onclick = (e) => {
input.value = '';
input.oninput(e);
}
input.oninput = (e) => {
let search_term = input.value.toUpperCase();

10
js/interface/panels.js
View File

@ -178,6 +178,7 @@ class Panel {
this.position_data.float_position[1] = position_before[1] + e2.clientY - e1.clientY;
let threshold = 40;
let threshold_y = 64;
target_slot = null; target_panel = null; target_before = false;
if (e2.clientX < Math.max(Interface.left_bar_width, threshold)) {
@ -209,13 +210,13 @@ class Panel {
}
} else if (
e2.clientY < (Interface.work_screen.offsetTop + 30 + threshold) &&
e2.clientY < (Interface.work_screen.offsetTop + 30 + threshold_y) &&
e2.clientX > Interface.left_bar_width && e2.clientX < (Interface.work_screen.clientWidth - Interface.right_bar_width)
) {
target_slot = 'top'
} else if (
e2.clientY > Interface.work_screen.offsetTop + Interface.work_screen.clientHeight - Interface.status_bar.vue.$el.clientHeight - 80 &&
e2.clientY > Interface.work_screen.offsetTop + Interface.work_screen.clientHeight - Interface.status_bar.vue.$el.clientHeight - threshold_y &&
e2.clientX > Interface.left_bar_width && e2.clientX < (Interface.work_screen.clientWidth - Interface.right_bar_width)
) {
target_slot = 'bottom'
@ -483,10 +484,9 @@ class Panel {
if (!dragging && work_screen.clientWidth) {
this.position_data.float_position[0] = Math.clamp(this.position_data.float_position[0], 0, work_screen.clientWidth - this.width);
this.position_data.float_position[1] = Math.clamp(this.position_data.float_position[1], 0, work_screen.clientHeight - this.height);
this.position_data.float_size[0] = Math.clamp(this.position_data.float_size[0], 300, work_screen.clientWidth - this.position_data.float_position[0]);
this.position_data.float_size[1] = Math.clamp(this.position_data.float_size[1], 300, work_screen.clientHeight - this.position_data.float_position[1]);
this.position_data.float_size[0] = Math.clamp(this.position_data.float_size[0], 200, work_screen.clientWidth - this.position_data.float_position[0]);
this.position_data.float_size[1] = Math.clamp(this.position_data.float_size[1], 86, work_screen.clientHeight - this.position_data.float_position[1]);
}
this.node.style.left = this.position_data.float_position[0] + 'px';
this.node.style.top = this.position_data.float_position[1] + 'px';
this.width = this.position_data.float_size[0];

6
js/modes.js
View File

@ -136,6 +136,9 @@ BARS.defineActions(function() {
BarItems.slider_color_s.update();
BarItems.slider_color_v.update();
Panels.uv.handle.firstChild.textContent = tl('mode.paint');
Panels.uv.position_data = Interface.data.panels.paint;
Panels.uv.moveTo(Panels.uv.slot);
UVEditor.vue.setMode('paint');
three_grid.visible = false;
},
@ -144,6 +147,9 @@ BARS.defineActions(function() {
Outliner.elements.forEach(cube => {
if (cube.preview_controller.updatePaintingGrid) cube.preview_controller.updatePaintingGrid(cube);
})
Panels.uv.handle.firstChild.textContent = tl('panel.uv');
Panels.uv.position_data = Interface.data.panels.uv;
Panels.uv.moveTo(Panels.uv.slot);
UVEditor.vue.setMode('uv');
three_grid.visible = true;
},

2
js/outliner/group.js
View File

@ -688,7 +688,7 @@ Interface.definePanels(function() {
new Panel('bone', {
icon: 'fas.fa-bone',
condition: !Blockbench.isMobile && {modes: ['animate']},
display_condition: () => UVEditor.getMappableElements().length,
display_condition: () => Group.selected,
selection_only: true,
default_position: {
slot: 'right_bar',

1
js/outliner/outliner.js
View File

@ -1565,6 +1565,7 @@ Interface.definePanels(function() {
element_rotation: Toolbars.element_rotation,
}
})
Toolbars.element_origin.node.after(Interface.createElement('div', {id: 'element_origin_toolbar_anchor'}))
}
})

13
js/texturing/uv.js
View File

@ -1674,7 +1674,7 @@ Interface.definePanels(function() {
selection_only: true,
expand_button: true,
condition: {modes: ['edit', 'paint']},
display_condition: () => UVEditor.getMappableElements().length,
display_condition: () => UVEditor.getMappableElements().length || Modes.paint,
default_position: {
slot: 'left_bar',
float_position: [300, 0],
@ -1799,6 +1799,11 @@ Interface.definePanels(function() {
var slider = UVEditor.sliders[id];
slider.setWidth(slider_bar_width / (Project.box_uv?2:4)-1);
}
if (this.$refs.viewport && this.zoom == 1 && ((!this.$refs.viewport.scrollLeft && !this.$refs.viewport.scrollTop) || this.centered_view)) {
this.$refs.viewport.scrollLeft = this.width/2;
this.$refs.viewport.scrollTop = this.height/2;
this.centered_view = true;
}
},
setMode(mode) {
this.mode = mode;
@ -2625,12 +2630,6 @@ Interface.definePanels(function() {
Math.floor(gap_x + this.width/2),
Math.floor(gap_y + this.height/2),
];
if (this.$refs.viewport && this.zoom == 1 && ((!this.$refs.viewport.scrollLeft && !this.$refs.viewport.scrollTop) || this.centered_view)) {
this.$refs.viewport.scrollLeft = margin[0] - gap_x;
this.$refs.viewport.scrollTop = margin[1] - gap_y;
this.centered_view = true;
}
return style ? `${margin[1]}px ${margin[0]}px` : margin;
}
},

2
js/webpack/bundle.js
View File

File diff suppressed because one or more lines are too long