Merge branch 'master' into gh-pages

.github/ISSUE_TEMPLATE/issue.yaml

@@ -29,6 +29,7 @@ body:
   id: format
   attributes:
     label: Model format in which the issue occurs
+    description: Format means which option you choose when creating a new model. Not the file extension.
   validations:
     required: true
 - type: dropdown

.travis.yml

@@ -19,7 +19,6 @@ jobs:
     - name: "Linux"
       os: linux
       script:
-        - npm install [email protected]
         - npm run prepublish
         - sudo apt-get install rpm
         - electron-builder --publish=onTagOrDraft

css/dialogs.css

@@ -625,7 +625,7 @@
 	}
 	.settings_list li .setting_icon i {
 		font-size: 26pt;
-		width: 34px;
+		max-width: unset;
 		margin-top: -6px;
 	}
 	.settings_list li:hover .setting_icon i {
@@ -2431,6 +2431,9 @@
 		object-fit: contain;
 		image-rendering: auto;
 	}
+	#tab_overview_grid > li.pixel_art img {
+		image-rendering: pixelated;
+	}
 	#tab_overview_grid > li label {
 		cursor: inherit;
 	}

css/general.css

@@ -449,6 +449,7 @@
 		cursor: default;
 		float: left;
 		color: var(--color-text);
+		flex-shrink: 0;
 	}
 	.tool i {
 		display: block;

css/panels.css

@@ -674,8 +674,9 @@
 		margin-left: 21px;
 		margin-top: 21px;
 		text-shadow: 0 0 5px #000;
-		font-size: 20pt;
+		font-size: 18pt;
 		left: 0;
+		max-width: 28px;
 	}
 	.texture_movie {
 		position: absolute;

css/window.css

@@ -1049,6 +1049,7 @@
 		z-index: 9;
 		pointer-events: initial;
 		cursor: move;
+		clip-path: none !important;
 	}
 	.reference_image.selected, .reference_image:hover {
 		outline: 1px solid var(--color-accent);

index.html

@@ -298,8 +298,7 @@ <h3><i class="material-icons icon">keyboard</i><span class="tl">keybindings.reco
 			<div id="right_bar" class="sidebar"></div>
 
 			<div id="center">
-				<ul id="toast_notification_list">
-				</ul>
+				<ul id="toast_notification_list"></ul>
 
 				<div id="top_slot"></div>
 				<div id="preview">

js/animations/animation.js

@@ -828,7 +828,7 @@ class Animation extends AnimationItem {
 			icon: 'folder',
 			condition(animation) {return isApp && Format.animation_files && animation.path && fs.existsSync(animation.path)},
 			click(animation) {
-				shell.showItemInFolder(animation.path);
+				showItemInFolder(animation.path);
 			}
 		},
 		'rename',

js/animations/animation_controllers.js

@@ -859,7 +859,7 @@ class AnimationController extends AnimationItem {
 			icon: 'folder',
 			condition(animation) {return isApp && Format.animation_files && animation.path && fs.existsSync(animation.path)},
 			click(animation) {
-				shell.showItemInFolder(animation.path);
+				showItemInFolder(animation.path);
 			}
 		},
 		'rename',

js/desktop.js

@@ -305,6 +305,10 @@ function loadDataFromModelMemory() {
 	Blockbench.dispatchEvent('load_from_recent_project_data', {data: project});
 }
 
+function showItemInFolder(path) {
+	ipcRenderer.send('show-item-in-folder', path);
+}
+
 //Window Controls
 function updateWindowState(e, type) {
 	let maximized = currentwindow.isMaximized();
@@ -728,7 +732,7 @@ ipcRenderer.on('update-available', (event, arg) => {
 		})
 
 	} else {
-		addStartScreenSection({
+		addStartScreenSection('update_notification', {
 			color: 'var(--color-back)',
 			graphic: {type: 'icon', icon: 'update'},
 			text: [

js/interface/actions.js

@@ -1907,7 +1907,7 @@ const BARS = {
 				category: 'file',
 				condition: () => {return isApp && (Project.save_path || Project.export_path)},
 				click: function () {
-					shell.showItemInFolder(Project.export_path || Project.save_path);
+					showItemInFolder(Project.export_path || Project.save_path);
 				}
 			})
 			new Action('reload', {

js/interface/interface.js

@@ -425,7 +425,8 @@ Interface.definePanels = function(callback) {
 //Misc
 function unselectInterface(event) {
 	if (
-		open_menu && $('.contextMenu').find(event.target).length === 0 &&
+		open_menu &&
+		!event.target.classList.contains('contextMenu') && $('.contextMenu').find(event.target).length === 0 &&
 		$('.menu_bar_point.opened:hover').length === 0 &&
 		!document.getElementById('mobile_menu_bar')?.contains(event.target)
 	) {

js/interface/start_screen.js

@@ -36,7 +36,7 @@ function addStartScreenSection(id, data) {
 		data = id;
 		id = '';
 	}
-	var obj = $(Interface.createElement('section', {id}))
+	var obj = $(Interface.createElement('section', {class: 'start_screen_section', section_id: id}))
 	if (typeof data.graphic === 'object') {
 		var left = $('<div class="start_screen_left graphic"></div>')
 		obj.append(left)
@@ -140,9 +140,9 @@ function addStartScreenSection(id, data) {
 	if (data.last) {
 		$('#start_screen > content').append(obj);
 	} else if (data.insert_after) {
-		$('#start_screen > content').find(`#${data.insert_after}`).after(obj);
+		$('#start_screen > content').find(`.start_screen_section[section_id="${data.insert_after}"]`).after(obj);
 	} else if (data.insert_before) {
-		$('#start_screen > content').find(`#${data.insert_before}`).before(obj);
+		$('#start_screen > content').find(`.start_screen_section[section_id="${data.insert_before}"]`).before(obj);
 	} else {
 		$('#start_screen > content').prepend(obj);
 	}
@@ -261,7 +261,7 @@ onVueSetup(async function() {
 						name: 'menu.texture.folder',
 						icon: 'folder',
 						click() {
-							shell.showItemInFolder(recent_project.path)
+							showItemInFolder(recent_project.path)
 						}
 					},
 					{
@@ -375,7 +375,7 @@ onVueSetup(async function() {
 		template: `
 			<div id="start_screen">
 				<content>
-					<section id="splash_screen" v-if="show_splash_screen">
+					<section id="splash_screen" v-if="show_splash_screen" class="start_screen_section" section_id="splash_screen">
 						<div class="splash_art_slideshow_image" :style="{backgroundImage: getBackground(slideshow[slideshow_selected].source)}">
 							<p v-if="slideshow[slideshow_selected].description" class="start_screen_graphic_description" v-html="pureMarked(slideshow[slideshow_selected].description)"></p>
 						</div>
@@ -387,7 +387,7 @@ onVueSetup(async function() {
 						<i class="material-icons start_screen_close_button" @click="show_splash_screen = false">clear</i>
 					</section>
 
-					<section id="start_files">
+					<section id="start_files" class="start_screen_section" section_id="start_files">
 
 						<div class="start_screen_left" v-if="!(selected_format_id && mobile_layout)">
 							<h2>${tl('mode.start.new')}</h2>
@@ -581,7 +581,7 @@ ModelLoader.loaders = {};
 		let twitter_ad;
 		if (Blockbench.startup_count < 20 && Blockbench.startup_count % 5 === 4) {
 			twitter_ad = true;
-			addStartScreenSection({
+			addStartScreenSection('twitter_link', {
 				color: '#1da1f2',
 				text_color: '#ffffff',
 				graphic: {type: 'icon', icon: 'fab.fa-twitter'},
@@ -594,7 +594,7 @@ ModelLoader.loaders = {};
 		}
 		//Discord
 		if (Blockbench.startup_count < 6 && !twitter_ad) {
-			addStartScreenSection({
+			addStartScreenSection('discord_link', {
 				color: '#5865F2',
 				text_color: '#ffffff',
 				graphic: {type: 'icon', icon: 'fab.fa-discord'},
@@ -666,7 +666,7 @@ ModelLoader.loaders = {};
 					}
 				},
 				template: `
-					<section id="quick_setup">
+					<section id="quick_setup" section_id="quick_setup" class="start_screen_section">
 						<i class="material-icons start_screen_close_button" @click="close()">clear</i>
 						<h2>${tl('mode.start.quick_setup')}</h2>
 

js/interface/themes.js

@@ -185,6 +185,9 @@ const CustomTheme = {
 					},
 					getThemeThumbnailStyle(theme) {
 						let style = {};
+						for (let key in CustomTheme.defaultColors) {
+							style[`--color-${key}`] = CustomTheme.defaultColors[key];
+						}
 						for (let key in theme.colors) {
 							style[`--color-${key}`] = theme.colors[key];
 						}
@@ -301,7 +304,8 @@ const CustomTheme = {
 						<div v-if="open_category == 'css'">
 							<h2 class="i_b">${tl('layout.css')}</h2>
 							<div id="css_editor">
-								<vue-prism-editor v-model="data.css" @change="customizeTheme(1, $event)" language="css" :line-numbers="true" />
+								<p v-if="data.css && data.css.length > 65000">Hidden due to performance limitations of the built-in CSS editor</p>
+								<vue-prism-editor v-else v-model="data.css" @change="customizeTheme(1, $event)" language="css" :line-numbers="true" />
 							</div>
 	
 						</div>

js/io/io.js

@@ -147,7 +147,7 @@ async function loadImages(files, event) {
 			let new_textures = [];
 			Undo.initEdit({textures: new_textures});
 			files.forEach(function(f, i) {
-				let tex = new Texture().fromFile(f).add().fillParticle();
+				let tex = new Texture().fromFile(f).add(false, true).fillParticle();
 				new_textures.push(tex);
 				if (Format.image_editor && i == 0) {
 					tex.select();

js/io/project.js

@@ -1225,6 +1225,9 @@ BARS.defineActions(function() {
 						select(project) {
 							Dialog.open.confirm();
 							project.select();
+						},
+						isPixelArt(project) {
+							return project.format.image_editor && project.textures[0]?.height < 190;
 						}
 					},
 					computed: {
@@ -1242,7 +1245,7 @@ BARS.defineActions(function() {
 								<search-bar id="tab_overview_search_bar" v-model="search_term"></search-bar>
 							</div>
 							<ul id="tab_overview_grid">
-								<li v-for="project in filtered_projects" @mousedown="select(project)">
+								<li v-for="project in filtered_projects" @mousedown="select(project)" :class="{pixel_art: isPixelArt(project)}">
 									<img :src="project.thumbnail" :style="{visibility: project.thumbnail ? 'unset' : 'hidden'}">
 									{{ project.name }}
 								</li>

js/misc.js

@@ -264,7 +264,7 @@ const AutoBackup = {
 			let has_backups = await AutoBackup.hasBackups();
 			if (has_backups && (!isApp || !currentwindow.webContents.second_instance)) {
 
-				let section = addStartScreenSection({
+				let section = addStartScreenSection('recover_backup', {
 					color: 'var(--color-back)',
 					graphic: {type: 'icon', icon: 'fa-archive'},
 					insert_before: 'start_files',
@@ -428,6 +428,15 @@ function factoryResetAndReload() {
 	}
 }
 
+function benchmarkCode(id, iterations, code) {
+	if (!iterations) iterations = 1000;
+	console.time(id);
+	for (let i = 0; i < iterations; i++) {
+		code();
+	}
+	console.timeEnd(id);
+}
+
 const documentReady = new Promise((resolve, reject) => {
 	$(document).ready(function() {
 		resolve()

js/modeling/mesh_editing.js

@@ -795,7 +795,11 @@ async function autoFixMeshEdit() {
 							return true;
 						})
 						let off_corners = edges.find(edge => !edge.includes(concave_vkey))
-						if (!off_corners) return;
+						if (!off_corners) {
+							// not sure if this always works, but its only required in special cases (if the quad edge that should be split is already connected to another face).
+							let concave_index = sorted_vertices.indexOf(concave_vkey);
+							off_corners = (concave_index%2) ? [sorted_vertices[1], sorted_vertices[3]] : [sorted_vertices[0], sorted_vertices[2]];
+						}
 
 						let new_face = new MeshFace(mesh, face);
 						new_face.vertices.remove(off_corners[0]);

js/outliner/cube.js

@@ -252,6 +252,18 @@ class Cube extends OutlinerElement {
 		}
 		return this;
 	}
+	selectLow(...args) {
+		let was_selected = this.selected;
+		super.selectLow(...args);
+		if (!was_selected && Cube.selected[0]) {
+			let other_selected_faces = UVEditor.selected_faces.slice();
+			let own_selected_faces = UVEditor.getSelectedFaces(this, true);
+			if (other_selected_faces?.length && !own_selected_faces?.length) {
+				own_selected_faces.replace(other_selected_faces);
+			}
+		}
+		return this;
+	}
 	size(axis, floored) {
 		var scope = this;
 		let epsilon = 0.0000001;

js/outliner/group.js

@@ -68,10 +68,11 @@ class Group extends OutlinerNode {
 		var scope = this;
 		if (Blockbench.hasFlag('renaming') || this.locked) return this;
 		if (!event) event = true
-		var allSelected = Group.selected === this && selected.length && this.matchesSelection()
+		var allSelected = Group.selected === this && selected.length && this.matchesSelection();
+		let previous_first_selected = Project.selected_elements[0];
 
 		//Clear Old Group
-		if (Group.selected) Group.selected.unselect()
+		if (Group.selected) Group.selected.unselect();
 		if ((event.shiftKey || Pressing.overrides.shift) !== true && (event.ctrlOrCmd || Pressing.overrides.ctrl) !== true) {
 			selected.length = 0
 		}
@@ -87,6 +88,10 @@ class Group extends OutlinerNode {
 			//Select Only Group, unselect Children
 			selected.length = 0
 		} else {
+			// Fix for #2401
+			if (previous_first_selected && previous_first_selected.isChildOf(this)) {
+				selected.push(previous_first_selected);
+			}
 			scope.children.forEach(function(s) {
 				s.selectLow()
 			})

js/outliner/outliner.js

@@ -478,7 +478,9 @@ class OutlinerElement extends OutlinerNode {
 
 		//Normal
 		} else {
-			selected.forEachReverse(obj => obj.unselect())
+			selected.forEachReverse(obj => {
+				if (obj != this) obj.unselect();
+			})
 			if (Group.selected) Group.selected.unselect()
 			this.selectLow()
 			just_selected.push(this)
@@ -503,6 +505,9 @@ class OutlinerElement extends OutlinerNode {
 	unselect() {
 		Project.selected_elements.remove(this);
 		this.selected = false;
+		if (UVEditor.selected_element_faces[this.uuid]) {
+			delete UVEditor.selected_element_faces[this.uuid];
+		}
 		TickUpdates.selection = true;
 		return this;
 	}

js/plugin_loader.js

@@ -692,7 +692,7 @@ Plugin.prototype.menu = new Menu([
 		icon: 'folder',
 		condition: plugin => (isApp && plugin.source == 'file'),
 		click(plugin) {
-			shell.showItemInFolder(plugin.path);
+			showItemInFolder(plugin.path);
 		}
 	},
 ]);
@@ -1267,8 +1267,8 @@ BARS.defineActions(function() {
 							<div :class="{open: tab == 'installed'}" @click="setTab('installed')">${tl('dialog.plugins.installed')}</div>
 							<div :class="{open: tab == 'available'}" @click="setTab('available')">${tl('dialog.plugins.available')}</div>
 						</div>
-						<ul class="list" id="plugin_list" ref="plugin_list">
-							<li v-for="plugin in viewed_plugins" :plugin="plugin.id" :class="{plugin: true, testing: plugin.fromFile, selected: plugin == selected_plugin, disabled_plugin: plugin.disabled, incompatible: plugin.isInstallable() !== true}" @click="selectPlugin(plugin)" @contextmenu="selectPlugin(plugin); plugin.showContextMenu($event)">
+						<ul class="list" :class="{paginated_list: pages.length > 1}" id="plugin_list" ref="plugin_list">
+							<li v-for="plugin in viewed_plugins" :plugin="plugin.id" :class="{plugin: true, testing: plugin.fromFile, selected: plugin == selected_plugin, disabled_plugin: plugin.disabled, installed_plugin: plugin.installed, incompatible: plugin.isInstallable() !== true}" @click="selectPlugin(plugin)" @contextmenu="selectPlugin(plugin); plugin.showContextMenu($event)">
 								<div>
 									<div class="plugin_icon_area">
 										<img v-if="plugin.hasImageIcon()" :src="plugin.getIcon()" width="48" height="48px" />
@@ -1292,7 +1292,7 @@ BARS.defineActions(function() {
 						</ol>
 					</div>
 					
-					<div id="plugin_browser_page" v-if="selected_plugin">
+					<div id="plugin_browser_page" v-if="selected_plugin" :class="{plugin_disabled: selected_plugin.disabled, plugin_installed: selected_plugin.installed}">
 						<div v-if="isMobile" @click="selectPlugin(null);" class="plugin_browser_back_button">
 							<i class="material-icons icon">arrow_back_ios</i>
 							${tl('generic.navigate_back')}</div>

js/preview/preview.js

@@ -781,7 +781,7 @@ class Preview {
 			if (Toolbox.selected.selectElements && Modes.selected.selectElements && (data.type === 'element' || Toolbox.selected.id == 'knife_tool')) {
 				if (Toolbox.selected.selectFace && data.face && data.element.type != 'mesh') {
 					let face_selection = UVEditor.getSelectedFaces(data.element, true);
-					if (event.ctrlOrCmd || Pressing.overrides.ctrl || event.shiftKey || Pressing.overrides.shift) {
+					if (data.element.selected && (event.ctrlOrCmd || Pressing.overrides.ctrl || event.shiftKey || Pressing.overrides.shift)) {
 						face_selection.safePush(data.face);
 					} else {
 						face_selection.replace([data.face]);