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 blend transition curve editor

Browse Source
This commit is contained in:
JannisX11 2024-09-13 23:00:57 +02:00
parent 070e863bb4
commit 47ab8c3d39
3 changed files with 51 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
css/panels.css
View File

@ -1821,6 +1821,17 @@
.controller_transition .controller_item_drag_handle {
background-color: var(--color-marker);
}
.blend_transition_curve_button {
margin-left: 4px;
cursor: pointer;
display: flex;
width: 42px;
justify-content: start;
align-items: center;
}
.blend_transition_curve_button > span {
color: var(--color-subtle_text);
}
span.controller_state_section_info {
margin: 0 8px;
color: var(--color-subtle_text);

44
js/animations/animation_controllers.js
View File

@ -469,6 +469,26 @@ class AnimationControllerState {
min: 0.05,
step: 0.05,
type: 'number',
},
buttons: {
type: 'buttons', buttons: [
'generic.reset',
tl('dialog.blend_transition_edit.ease_in_out', [6]),
tl('dialog.blend_transition_edit.ease_in_out', [10]),
tl('dialog.blend_transition_edit.ease_in_out', [16])
],
click(index) {
let point_amount = ([2, 6, 10, 16])[index];
function hermiteBlend(t) {
return 3*(t**2) - 2*(t**3);
}
points.empty();
for (let i = 0; i < point_amount; i++) {
let time = i / (point_amount-1);
points.push({time, value: 1-hermiteBlend(time), uuid: guid()})
}
dialog.content_vue.updateGraph();
}
}
},
component: {
@ -588,12 +608,16 @@ class AnimationControllerState {
onFormChange(result) {
this.content_vue.duration = result.duration;
},
onConfirm() {
onConfirm(result) {
clearInterval(preview_loop);
Undo.initEdit({animation_controller_state: state});
state.blend_transition = result.duration;
state.blend_transition_curve = {};
for (let point of points) {
state.blend_transition_curve[Math.clamp(point.time, 0, 1)] = point.value;
let is_linear = points.length == 2 && points.find(p => p.time == 0 && p.value == 1) && points.find(p => p.time == 1 && p.value == 0);
if (!is_linear) {
for (let point of points) {
state.blend_transition_curve[Math.clamp(point.time, 0, 1)] = point.value;
}
}
Undo.finishEdit('Change blend transition curve');
},
@ -1651,6 +1675,9 @@ Interface.definePanels(() => {
Undo.finishEdit('Change animation controller audio file')
})
},
editStateBlendTime(state) {
state.controller.saved = false;
},
updateLocatorSuggestionList() {
Locator.updateAutocompleteList();
@ -1966,9 +1993,14 @@ Interface.definePanels(() => {
</ul>
<div class="controller_state_input_bar">
<label>${tl('animation_controllers.state.blend_transition')}</label>
<numeric-input style="width: 70px;" v-model.number="state.blend_transition" :min="0" :step="0.05" />
<div class="tool" title="${tl('animation_controllers.state.blend_transition_curve')}" @click="state.editTransitionCurve()">
<i class="fas fa-chart-line icon" style="font-size: 19px;"></i>
<numeric-input style="width: 70px; flex-grow: 0;" v-model.number="state.blend_transition" :min="0" :step="0.05" @input="editStateBlendTime(state)" />
<div
class="tool blend_transition_curve_button"
title="${tl('animation_controllers.state.blend_transition_curve')}"
@click="state.editTransitionCurve()"
>
<i class="fas fa-chart-line icon"></i>
<span v-if="Object.keys(state.blend_transition_curve).length">{{ Object.keys(state.blend_transition_curve).length }}</span>
</div>
</div>
<div class="controller_state_input_bar">

2
lang/en.json
View File

@ -625,6 +625,8 @@
"dialog.optimize_animation.thresholds": "Threshold values",
"dialog.merge_animation.merge_target": "Merge into",
"dialog.blend_transition_edit.ease_in_out": "Ease-in-out (%0)",
"dialog.create_texture.folder": "Folder",
"dialog.create_texture.type": "Type",
"dialog.create_texture.type.blank": "Blank",