JannisX11/blockbench
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

New UV editor initial setup

Browse Source
This commit is contained in:
JannisX11 2021-08-17 22:02:23 +02:00
parent b8b98a22c4
commit 3bbd7007cf
24 changed files with 643 additions and 783 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
css/dialogs.css
View File

@ -883,35 +883,6 @@
margin-top: 5px;
}
/*UV*/
#uv_dialog {
width: 1108px;
}
#uv_dialog .tab {
width: 14.28%;
}
#uv_dialog_all .UVEditor {
float: left;
padding: 8px;
padding-top: 0px;
border: 1px solid var(--color-border);
margin-right: -1px;
margin-bottom: -1px;
}
#uv_dialog_toolbar {
clear: both;
padding: 12px;
height: 42px;
padding-top: 5px;
}
#uv_dialog_all .UVEditor .uv_transform_info {
top: 30px;
}
#uv_dialog #uv_viewport {
margin-left: -8px;
}
/*Toolbar Dialog*/
dialog#toolbar_edit .search_bar {

3
css/general.css
View File

@ -223,9 +223,6 @@
left: 0px;
pointer-events: none;
}
#uv_dialog_all .uv_message_box {
top: 60px;
}
.selection_rectangle {
position: absolute;
display: block;

3
css/panels.css
View File

@ -1092,7 +1092,7 @@
margin-left: -8px;
margin-right: -8px;
}
#uv_dialog_all .UVEditor.selected {
#UVEditor_all .UVEditor.selected {
border-color: var(--color-accent);
z-index: 21;
}
@ -1123,6 +1123,7 @@
margin-bottom: 0;
position: relative;
border: 4px solid var(--color-ui);
box-shadow: 0 0 0 800px var(--color-back);
box-sizing: content-box;
}

60
index.html
View File

@ -308,34 +308,6 @@
<div class="dialog_close_button" onclick="hideDialog()"><i class="material-icons">clear</i></div>
</dialog>
<dialog class="dialog draggable" id="uv_dialog">
<div class="dialog_handle tl">uv_editor.title</div>
<div class="dialog_bar borderless tab_bar" id="uv_tab_bar">
<div onclick="uv_dialog.openTab('all')" id="all" class="tab open tl">uv_editor.all_faces</div>
<div onclick="uv_dialog.openTab('north')" id="north" class="tab tl">face.north</div>
<div onclick="uv_dialog.openTab('south')" id="south" class="tab tl">face.south</div>
<div onclick="uv_dialog.openTab('west')" id="west" class="tab tl">face.west</div>
<div onclick="uv_dialog.openTab('east')" id="east" class="tab tl">face.east</div>
<div onclick="uv_dialog.openTab('up')" id="up" class="tab tl">face.up</div>
<div onclick="uv_dialog.openTab('down')" id="down" class="tab tl">face.down</div>
</div>
<div id="uv_dialog_all" class="uv_dialog_content uv_dialog_all_only">
</div>
<div id="uv_dialog_single" class="uv_dialog_content">
</div>
<div class="bar" id="uv_dialog_toolbar">
<div class="toolbar_wrapper uv_dialog"></div>
</div>
<div class="dialog_bar button_bar">
<button type="button" onclick="hideDialog()" class="confirm_btn cancel_btn hidden">dialog.close</button>
</div>
<div class="dialog_close_button" onclick="hideDialog()"><i class="material-icons">clear</i></div>
</dialog>
<dialog class="dialog draggable" id="text_input">
<div class="dialog_handle">
<div class="dialog_title tl">dialog.input.title</div>
@ -472,37 +444,9 @@
</ul>
<div class="toolbar_wrapper narrow mobile_side"></div>
</div>
<div id="left_bar" class="sidebar">
<div id="left_bar" class="sidebar"></div>
<div id="uv" class="panel selection_only">
<div class="panel_inside">
<div class="bar next_to_title" id="uv_title_bar">
<div id="project_resolution_status" onclick="BarItems.project_window.trigger()"></div>
</div>
<div id="uv_panel_sides" onclick="main_uv.loadSelectedFace()" class="bar tabs_small">
<input type="radio" name="side" id="north_radio" checked>
<label class="tl" for="north_radio">face.north</label>
<input type="radio" name="side" id="south_radio">
<label class="tl" for="south_radio">face.south</label>
<input type="radio" name="side" id="west_radio">
<label class="tl" for="west_radio">face.west</label>
<input type="radio" name="side" id="east_radio">
<label class="tl" for="east_radio">face.east</label>
<input type="radio" name="side" id="up_radio">
<label class="tl" for="up_radio">face.up</label>
<input type="radio" name="side" id="down_radio">
<label class="tl" for="down_radio">face.down</label>
</div>
</div>
</div>
</div>
<div id="right_bar" class="sidebar">
<div id="element" class="panel selection_only">

12
js/blockbench.js
View File

@ -16,7 +16,6 @@ const Pressing = {
alt: false,
}
}
var main_uv;
var Prop = {
active_panel : 'preview',
view_mode : 'textured',
@ -130,9 +129,8 @@ function updateSelection(options = {}) {
document.querySelectorAll('.selection_only#uv').forEach(node => node.style.setProperty('visibility', 'visible'));
}
}
if (Cube.selected.length || (Format.single_texture && Modes.paint)) {
main_uv.jquery.size.find('.uv_mapping_overlay').remove()
main_uv.loadData()
if (Outliner.selected.length || (Format.single_texture && Modes.paint)) {
UVEditor.loadData()
}
if (Modes.animate) {
updateKeyframeSelection();
@ -201,9 +199,9 @@ const TickUpdates = {
delete TickUpdates.selection;
updateSelection()
}
if (TickUpdates.main_uv) {
delete TickUpdates.main_uv;
main_uv.loadData()
if (TickUpdates.UVEditor) {
delete TickUpdates.UVEditor;
UVEditor.loadData()
}
if (TickUpdates.texture_list) {
delete TickUpdates.texture_list;

3
js/boot_loader.js
View File

@ -90,9 +90,6 @@ setInterval(function() {
framespersecond = 0;
}, 1000)
main_uv = new UVEditor('main_uv', false, true)
main_uv.setToMainSlot()
onVueSetup.funcs.forEach((func) => {
if (typeof func === 'function') {
func()

16
js/copy_paste.js
View File

@ -3,7 +3,6 @@ const Clipbench = {
elements: [],
types: {
text: 'text',
face_dialog: 'face_dialog',
display_slot: 'display_slot',
keyframe: 'keyframe',
face: 'face',
@ -24,9 +23,6 @@ const Clipbench = {
if (Painter.selection.canvas && Toolbox.selected.id == 'copy_paste_tool') {
return Clipbench.types.texture_selection;
}
if (open_dialog == 'uv_dialog') {
return Clipbench.types.face_dialog
}
if (display_mode) {
return Clipbench.types.display_slot
}
@ -48,9 +44,6 @@ const Clipbench = {
case 'text':
Clipbench.setText(window.getSelection()+'');
break;
case 'face_dialog':
uv_dialog.copy(event);
break;
case 'display_slot':
DisplayMode.copy();
break;
@ -63,7 +56,7 @@ const Clipbench = {
}
break;
case 'face':
main_uv.copy(event);
UVEditor.copy(event);
break;
case 'texture':
Clipbench.setTexture(Texture.selected);
@ -91,10 +84,7 @@ const Clipbench = {
Clipbench.setText(window.getSelection()+'');
break;
case 'texture_selection':
main_uv.addPastingOverlay();
break;
case 'face_dialog':
uv_dialog.paste(event)
UVEditor.addPastingOverlay();
break;
case 'display_slot':
DisplayMode.paste();
@ -103,7 +93,7 @@ const Clipbench = {
Clipbench.pasteKeyframes()
break;
case 'face':
main_uv.paste(event);
UVEditor.paste(event);
break;
case 'texture':
Clipbench.pasteTextures();

20
js/interface/actions.js
View File

@ -1761,8 +1761,8 @@ const BARS = {
]
})
//UV
Toolbars.main_uv = new Toolbar({
id: 'main_uv',
Toolbars.uv_editor = new Toolbar({
id: 'uv_editor',
children: [
'uv_grid',
'uv_apply_all',
@ -1775,8 +1775,9 @@ const BARS = {
'toggle_mirror_uv',
]
})
Toolbars.uv_dialog = new Toolbar({
id: 'uv_dialog',
/*
Toolbars.UVEditor = new Toolbar({
id: 'UVEditor',
children: [
'uv_grid',
'_',
@ -1804,7 +1805,7 @@ const BARS = {
'uv_rotation'
],
default_place: true
})
})*/
//Animations
Toolbars.animations = new Toolbar({
id: 'animations',
@ -1908,8 +1909,8 @@ const BARS = {
}
BarItems.move_tool.select()
BarItems.uv_dialog.toElement('#uv_title_bar')
BarItems.uv_dialog_full.toElement('#uv_title_bar')
//BarItems.UVEditor.toElement('#uv_title_bar')
//BarItems.UVEditor_full.toElement('#uv_title_bar')
},
@ -2167,9 +2168,10 @@ const BARS = {
Toolbars[key].update()
}
}
uv_dialog.all_editors.forEach((editor) => {
/*
UVEditor.all_editors.forEach((editor) => {
editor.updateInterface()
})
})*/
}
}
const ActionControl = {

4
js/interface/interface.js
View File

@ -436,14 +436,14 @@ function setProjectTitle(title) {
//Zoom
function setZoomLevel(mode) {
if (Prop.active_panel === 'uv') {
var zoom = main_uv.zoom
var zoom = UVEditor.zoom
switch (mode) {
case 'in': zoom *= 1.5; break;
case 'out': zoom *= 0.66; break;
case 'reset': zoom = 1; break;
}
zoom = limitNumber(zoom, 1, 4)
main_uv.setZoom(zoom)
UVEditor.setZoom(zoom)
} else if (Prop.active_panel == 'timeline') {

9
js/interface/settings.js
View File

@ -200,8 +200,8 @@ const Settings = {
new Setting('preview_checkerboard', {category: 'interface', value: true, onChange() {
$('#center').toggleClass('checkerboard', settings.preview_checkerboard.value);
}});
new Setting('uv_checkerboard', {category: 'interface', value: true, onChange() {
$('.UVEditor').toggleClass('checkerboard_trigger', settings.uv_checkerboard.value);
new Setting('uv_checkerboard', {category: 'interface', value: true, onChange(val) {
UVEditor.vue.checkerboard = val;
}});
new Setting('timecode_frame_number',{category: 'interface', value: false, onChange() {
Timeline.vue.updateTimecodes();
@ -304,11 +304,6 @@ const Settings = {
new Setting('animation_sample_rate',{category: 'export', value: 24, type: 'number'});
new Setting('sketchfab_token', {category: 'export', value: '', type: 'password'});
new Setting('credit', {category: 'export', value: 'Made with Blockbench', type: 'text'});
Blockbench.onUpdateTo('3.8', () => {
settings.preview_checkerboard.value = true;
settings.uv_checkerboard.value = true;
})
},
addCategory(id, data) {
if (!data) data = 0;

4
js/io/format.js
View File

@ -70,10 +70,8 @@ class ModelFormat {
preview.loadAnglePreset(DefaultCameraPresets[preview.angle+1])
}
})
uv_dialog.all_editors.forEach(editor => {
editor.img.style.objectFit = Format.animated_textures ? 'cover' : 'fill';
})
Interface.Panels.animations.inside_vue._data.animation_files_enabled = this.animation_files;
// Todo: toggle animated textures in UV editor
for (var key in ModelProject.properties) {
if (Project[key] == undefined) {
ModelProject.properties[key].reset(Project);

4
js/io/formats/java_block.js
View File

@ -73,7 +73,7 @@ var codec = new Codec('java_block', {
if (s.faces[face].enabled !== false) {
tag.uv = s.faces[face].uv.slice();
tag.uv.forEach((n, i) => {
tag.uv[i] = n * 16 / main_uv.getResolution(i%2);
tag.uv[i] = n * 16 / UVEditor.getResolution(i%2);
})
}
if (s.faces[face].rotation) {
@ -349,7 +349,7 @@ var codec = new Codec('java_block', {
if (typeof read_face.uv === 'object') {
new_face.uv.forEach((n, i) => {
new_face.uv[i] = read_face.uv[i] * main_uv.getResolution(i%2) / 16;
new_face.uv[i] = read_face.uv[i] * UVEditor.getResolution(i%2) / 16;
})
}
if (read_face.texture === '#missing') {

11
js/io/project.js
View File

@ -26,6 +26,7 @@ class ModelProject {
this.groups = [];
this.selected_elements = [];
this.selected_group = null;
this.selected_faces = [null];
this.textures = [];
this.selected_texture = null;
this.outliner = [];
@ -170,6 +171,10 @@ class ModelProject {
Outliner.root = this.outliner;
Interface.Panels.outliner.inside_vue.root = this.outliner;
UVEditor.vue.elements = this.selected_elements;
UVEditor.vue.selected_vertices = this.selected_vertices;
UVEditor.vue.selected_faces = this.selected_faces;
Interface.Panels.textures.inside_vue.textures = Texture.all;
scene.add(this.model_3d);
@ -348,11 +353,13 @@ function setProjectResolution(width, height, modify_uv) {
Undo.finishEdit('Changed project resolution')
Canvas.updateAllUVs()
if (selected.length) {
main_uv.loadData()
UVEditor.loadData()
}
}
function updateProjectResolution() {
document.querySelector('#project_resolution_status').textContent = `${Project.texture_width} ⨉ ${Project.texture_height}`;
if (Interface.Panels.uv) {
UVEditor.vue.project_resolution.replace([Project.texture_width, Project.texture_height]);
}
if (Texture.selected) {
// Update animated textures
Texture.selected.height++;

6
js/modes.js
View File

@ -187,8 +187,7 @@ BARS.defineActions(function() {
BarItems.slider_color_s.update();
BarItems.slider_color_v.update();
$('.UVEditor').find('#uv_size').hide();
$('.bar.uv_editor_sliders').hide();
UVEditor.vue.setMode('paint');
three_grid.visible = false;
},
onUnselect: () => {
@ -196,8 +195,7 @@ BARS.defineActions(function() {
Cube.all.forEach(cube => {
Canvas.buildGridBox(cube)
})
$('.UVEditor').find('#uv_size').show();
$('.bar.uv_editor_sliders').show();
UVEditor.vue.setMode('uv');
three_grid.visible = true;
},
})

8
js/outliner/cube.js
View File

@ -85,7 +85,7 @@ class Face {
}
new Property(Face, 'number', 'rotation', {default: 0});
new Property(Face, 'number', 'tint', {default: -1});
new Property(Face, 'string', 'cullface', {merge_validation: (val) => (uv_dialog.allFaces.includes(val) || val == '')});
new Property(Face, 'string', 'cullface', )//{merge_validation: (val) => (UVEditor.cube_faces.includes(val) || val == '')});
new Property(Face, 'string', 'material_name');
new Property(Face, 'boolean', 'enabled', {default: true});
@ -559,7 +559,7 @@ class Cube extends OutlinerElement {
if (faces === true || Project.box_uv) {
var sides = ['north', 'east', 'south', 'west', 'up', 'down']
} else if (faces === undefined) {
var sides = [main_uv.face]
var sides = [UVEditor.face]
} else {
var sides = faces
}
@ -573,7 +573,7 @@ class Cube extends OutlinerElement {
scope.faces[side].texture = value
})
if (selected.indexOf(this) === 0) {
main_uv.loadData()
UVEditor.loadData()
}
if (Prop.view_mode === 'textured' && scope.visibility == true) {
Canvas.adaptObjectFaces(scope)
@ -870,7 +870,7 @@ BARS.defineActions(function() {
for (var face in base_cube.faces) {
base_cube.faces[face].texture = Texture.getDefault().uuid
}
main_uv.loadData()
UVEditor.loadData()
}
if (Format.bone_rig) {
if (group) {

2
js/preview/preview.js
View File

@ -671,7 +671,7 @@ class Preview {
} else if (Toolbox.selected.selectCubes && Modes.selected.selectCubes && data.type === 'cube') {
if (Toolbox.selected.selectFace) {
main_uv.setFace(data.face, false)
UVEditor.setFace(data.face, false)
}
Blockbench.dispatchEvent('canvas_select', data)
if (Modes.paint) {

4
js/texturing/painter.js
View File

@ -938,9 +938,7 @@ BARS.defineActions(function() {
Painter.updateNslideValues()
},
onUnselect: function() {
uv_dialog.all_editors.forEach(editor => {
editor.brush_outline.detach()
})
UVEditor.brush_outline.detach()
}
})
new Tool('fill_tool', {

34
js/texturing/textures.js
View File

@ -190,7 +190,7 @@ class Texture {
if (result === 0) {
setProjectResolution(img.naturalWidth, img.naturalHeight)
if (selected.length) {
main_uv.loadData()
UVEditor.loadData()
}
}
})
@ -436,12 +436,12 @@ class Texture {
this.source = dataUrl;
this.img.src = dataUrl;
this.updateMaterial();
if (this == main_uv.texture) {
main_uv.img.src = dataUrl;
if (this == UVEditor.texture) {
UVEditor.img.src = dataUrl;
};
if (open_dialog == 'uv_dialog') {
for (var key in uv_dialog.editors) {
var editor = uv_dialog.editors[key];
if (open_dialog == 'UVEditor') {
for (var key in UVEditor.editors) {
var editor = UVEditor.editors[key];
if (this == editor.texture) {
editor.img.src = dataUrl;
}
@ -473,7 +473,7 @@ class Texture {
})
Painter.current = {}
main_uv.loadData();
UVEditor.loadData();
Blockbench.dispatchEvent( 'change_texture_path', {texture: scope} )
}
if (scope.saved || force) {
@ -502,7 +502,7 @@ class Texture {
this.source = this.source.replace(/\?\d+$/, '?' + tex_version)
this.load();
this.updateMaterial()
TickUpdates.main_uv = true;
TickUpdates.UVEditor = true;
TickUpdates.texture_list = true;
}
reloadTexture() {
@ -620,7 +620,7 @@ class Texture {
if (Format.single_texture && Cube.all.length) {
Canvas.updateAllFaces()
if (selected.length) {
main_uv.loadData()
UVEditor.loadData()
}
}
TickUpdates.selection = true;
@ -644,8 +644,8 @@ class Texture {
Canvas.updateAllFaces()
TextureAnimator.updateButton()
hideDialog()
if (main_uv.texture == this) {
main_uv.displayTexture();
if (UVEditor.texture == this) {
UVEditor.displayTexture();
}
BARS.updateConditions()
Undo.finishEdit('Remove texture', {textures: []})
@ -697,7 +697,7 @@ class Texture {
Cube.selected.forEach(function(obj) {
for (var face in obj.faces) {
if (all || Project.box_uv || face === main_uv.face) {
if (all || Project.box_uv || face === UVEditor.face) {
var f = obj.faces[face]
if (all !== 'blank' || (f.texture !== null && !f.getTexture())) {
f.texture = scope.uuid
@ -706,7 +706,7 @@ class Texture {
}
})
Canvas.updateSelectedFaces()
main_uv.loadData()
UVEditor.loadData()
Undo.finishEdit('Apply texture')
return this;
}
@ -1270,7 +1270,7 @@ function loadTextureDraggable() {
})
Undo.finishEdit('Drop texture')
main_uv.loadData()
UVEditor.loadData()
Canvas.updateAllFaces()
}
}, 10)
@ -1371,8 +1371,8 @@ TextureAnimator = {
$(`.texture[texid="${tex.uuid}"]`).find('img').css('margin-top', (tex.currentFrame*-48)+'px');
maxFrame = Math.max(maxFrame, tex.currentFrame);
})
if (animated_textures.includes(main_uv.texture)) {
main_uv.img.style.objectPosition = `0 -${main_uv.texture.currentFrame * main_uv.inner_height}px`;
if (animated_textures.includes(UVEditor.texture)) {
UVEditor.img.style.objectPosition = `0 -${UVEditor.texture.currentFrame * UVEditor.inner_height}px`;
}
Cube.all.forEach(cube => {
var update = false
@ -1394,7 +1394,7 @@ TextureAnimator = {
$($('.texture').get(i)).find('img').css('margin-top', '0')
}
})
main_uv.img.style.objectPosition = '';
UVEditor.img.style.objectPosition = '';
while (i < elements.length) {
Canvas.updateUV(elements[i], true)
i++;

1172
js/texturing/uv.js
View File

File diff suppressed because it is too large Load Diff

11
js/undo.js
View File

@ -363,13 +363,6 @@ class UndoSystem {
Blockbench.dispatchEvent('load_undo_save', {save, reference, mode})
if (open_dialog == 'uv_dialog') {
for (var key in uv_dialog.editors) {
if (uv_dialog.editors[key]) {
uv_dialog.editors[key].loadData()
}
}
}
updateSelection()
if ((save.outliner || save.group) && Format.bone_rig) {
Canvas.updateAllBones();
@ -486,7 +479,7 @@ BARS.defineActions(function() {
new Action('undo', {
icon: 'undo',
category: 'edit',
condition: () => (!open_dialog || open_dialog === 'uv_dialog' || open_dialog === 'toolbar_edit'),
condition: () => Project,
work_in_dialog: true,
keybind: new Keybind({key: 'z', ctrl: true}),
click(e) {
@ -496,7 +489,7 @@ BARS.defineActions(function() {
new Action('redo', {
icon: 'redo',
category: 'edit',
condition: () => (!open_dialog || open_dialog === 'uv_dialog' || open_dialog === 'toolbar_edit'),
condition: () => Project,
work_in_dialog: true,
keybind: new Keybind({key: 'y', ctrl: true}),
click(e) {

2
keymaps/blender.bbkeymap
View File

@ -139,8 +139,6 @@
"change_textures_folder": null,
"animated_textures": null,
"animated_texture_frame": null,
"uv_dialog": null,
"uv_dialog_full": null,
"uv_rotation": null,
"uv_grid": null,
"uv_select_all": null,

2
keymaps/cinema4d.bbkeymap
View File

@ -139,8 +139,6 @@
"change_textures_folder": null,
"animated_textures": null,
"animated_texture_frame": null,
"uv_dialog": null,
"uv_dialog_full": null,
"uv_rotation": null,
"uv_grid": null,
"uv_select_all": null,

2
keymaps/maya.bbkeymap
View File

@ -139,8 +139,6 @@
"change_textures_folder": null,
"animated_textures": null,
"animated_texture_frame": null,
"uv_dialog": null,
"uv_dialog_full": null,
"uv_rotation": null,
"uv_grid": null,
"uv_select_all": null,

5
lang/en.json
View File

@ -854,11 +854,6 @@
"action.reset_theme": "Reset Theme",
"action.reset_theme.desc": "Reset to the default Blockbench theme",
"action.uv_dialog": "UV Window...",
"action.uv_dialog.desc": "Open the UV dialog to see all faces next to each other",
"action.uv_dialog_full": "Full View...",
"action.uv_dialog_full.desc": "Open the UV dialog to edit one face in fullscreen",
"action.undo": "Undo",
"action.undo.desc": "Undoes the last change",
"action.redo": "Redo",