2017-10-31 21:49:01 +08:00
<!DOCTYPE html>
2019-12-16 03:04:31 +08:00
< html lang = "en" >
2017-10-31 21:49:01 +08:00
< head >
2019-01-09 22:54:35 +08:00
< title > Blockbench< / title >
2020-04-26 02:25:07 +08:00
< meta charset = "utf-8" / >
2019-01-09 22:54:35 +08:00
< meta name = "viewport" content = "width=device-width, initial-scale=1" >
2019-07-18 00:02:07 +08:00
< meta name = "theme-color" content = "#181a1f" >
2019-04-13 00:44:18 +08:00
< meta name = "robots" content = "noindex" >
2019-07-26 19:33:29 +08:00
<!-- link rel="manifest" href="manifest.json" -->
2019-01-09 22:54:35 +08:00
< link rel = "shortcut icon" href = "favicon.png" type = "image/x-icon" / >
< link rel = "stylesheet" href = "css/w3.css" >
< link rel = "stylesheet" href = "css/jquery-ui.min.css" >
2019-07-18 00:02:07 +08:00
< link rel = "stylesheet" href = "css/fontawesome.css" >
2019-01-09 22:54:35 +08:00
< link rel = "stylesheet" href = "css/spectrum.css" >
2019-12-16 03:04:31 +08:00
< link rel = "stylesheet" href = "css/prism.css" >
2019-07-18 00:02:07 +08:00
< link rel = "stylesheet" href = "css/setup.css" >
< link rel = "stylesheet" href = "css/general.css" >
2020-04-26 02:25:07 +08:00
< link rel = "stylesheet" href = "css/window.css" >
2019-07-18 00:02:07 +08:00
< link rel = "stylesheet" href = "css/panels.css" >
< link rel = "stylesheet" href = "css/dialogs.css" >
2019-12-16 03:04:31 +08:00
< style type = "text/css" id = "theme_css" > < / style >
2017-10-31 21:49:01 +08:00
< / head >
< body spellcheck = "false" >
2019-01-09 22:54:35 +08:00
< script >
if (typeof module === 'object') {window.module = module; module = undefined;}//jQuery Fix
const isApp = typeof require !== 'undefined';
2020-12-09 20:01:39 +08:00
const appVersion = '3.8.0';
2019-01-09 22:54:35 +08:00
< / script >
2020-03-05 03:56:17 +08:00
< div id = "loading_error_message" style = "display: none;" >
< div > An error occurred while loading Blockbench< / div >
2020-04-26 02:25:07 +08:00
< div id = "loading_error_detail" > < / div >
2020-03-05 03:56:17 +08:00
< button onclick = "isApp ? Blockbench.reload() : window.location.reload(true)" class = "large" style = "margin-right: auto; margin-left: auto;" > Reload< / button >
< button onclick = "window.close()" class = "large" style = "margin-right: auto; margin-left: auto;" > Quit< / button >
< / div >
2019-01-09 22:54:35 +08:00
< script src = "lib/vue.min.js" > < / script >
< script src = "lib/vue_sortable.js" > < / script >
< script src = "lib/jquery.js" > < / script >
< script src = "lib/jquery-ui.min.js" > < / script >
< script src = "lib/targa.js" > < / script >
< script src = "lib/jimp.min.js" > < / script >
2019-03-10 05:06:35 +08:00
< script src = "lib/jszip.min.js" > < / script >
2019-01-09 22:54:35 +08:00
< script src = "lib/gif.js" > < / script >
2019-12-16 03:04:31 +08:00
< script src = "lib/prism.js" > < / script >
< script src = "lib/VuePrismEditor.min.js" > < / script >
2020-09-13 21:34:12 +08:00
< script src = "lib/molang-prism-syntax.js" > < / script >
2019-07-18 00:02:07 +08:00
< script src = "lib/lzutf8.js" > < / script >
2019-04-08 00:53:33 +08:00
< script src = "lib/peer.min.js" > < / script >
2019-07-18 00:02:07 +08:00
< script src = "lib/marked.min.js" > < / script >
2019-01-09 22:54:35 +08:00
< script src = "lib/spectrum.js" > < / script >
2020-03-05 03:56:17 +08:00
< script src = "lib/three.min.js" > < / script >
2019-01-09 22:54:35 +08:00
< script src = "lib/three_custom.js" > < / script >
2020-03-05 03:56:17 +08:00
< script src = "lib/GLTFExporter.js" > < / script >
2020-07-16 15:32:59 +08:00
< script src = "lib/CanvasFrame.js" > < / script >
2020-08-30 21:00:41 +08:00
< script src = "lib/fik.min.js" > < / script >
2020-10-05 05:26:30 +08:00
< script src = "lib/molang.umd.js" > < / script >
2020-10-09 20:14:29 +08:00
< script src = "lib/wintersky.umd.js" > < / script >
2020-10-16 04:23:37 +08:00
2019-07-18 00:02:07 +08:00
< script src = "js/preview/OrbitControls.js" > < / script >
< script src = "js/outliner/tree.vue.js" > < / script >
2019-01-09 22:54:35 +08:00
< script src = "js/util.js" > < / script >
2020-07-16 15:32:59 +08:00
< script src = "js/property.js" > < / script >
2019-07-18 00:02:07 +08:00
< script src = "js/interface/language.js" > < / script >
< script src = "js/interface/menu.js" > < / script >
< script src = "js/interface/actions.js" > < / script >
2019-12-16 03:04:31 +08:00
< script src = "js/interface/themes.js" > < / script >
2019-01-09 22:54:35 +08:00
< script src = "js/blockbench.js" > < / script >
2020-03-11 05:19:17 +08:00
< script src = "js/modes.js" > < / script >
2020-10-11 22:54:52 +08:00
< script src = "js/api.js" > < / script >
< script src = "js/file_system.js" > < / script >
< script src = "js/interface/panels.js" > < / script >
< script src = "js/interface/interface.js" > < / script >
2019-07-18 00:02:07 +08:00
< script src = "js/interface/keyboard.js" > < / script >
< script src = "js/interface/settings.js" > < / script >
< script src = "js/interface/dialog.js" > < / script >
2019-12-16 03:04:31 +08:00
< script src = "js/copy_paste.js" > < / script >
2019-01-09 22:54:35 +08:00
< script src = "js/undo.js" > < / script >
< script type = "text/javascript" >
if (isApp === true) {
2019-07-18 00:02:07 +08:00
document.write("< script src = 'js/desktop.js' > < \ / s c r i p t > " ) ;
2019-01-09 22:54:35 +08:00
} else {
document.write("< script src = 'js/web.js' > < \ / s c r i p t > " ) ;
}
< / script >
2020-09-22 05:23:42 +08:00
< script src = "js/edit_sessions.js" > < / script >
2019-07-18 00:02:07 +08:00
< script src = "js/outliner/outliner.js" > < / script >
< script src = "js/outliner/group.js" > < / script >
< script src = "js/outliner/cube.js" > < / script >
< script src = "js/outliner/locator.js" > < / script >
2021-01-04 20:45:33 +08:00
< script src = "js/outliner/null_object.js" > < / script >
2019-07-18 00:02:07 +08:00
< script src = "js/preview/preview.js" > < / script >
< script src = "js/preview/canvas.js" > < / script >
< script src = "js/preview/transformer.js" > < / script >
2019-01-09 22:54:35 +08:00
< script src = "js/transform.js" > < / script >
2019-12-16 03:04:31 +08:00
< script src = "js/texturing/textures.js" > < / script >
< script src = "js/texturing/uv.js" > < / script >
< script src = "js/texturing/painter.js" > < / script >
2020-03-05 03:56:17 +08:00
< script src = "js/texturing/texture_generator.js" > < / script >
2019-12-16 03:04:31 +08:00
< script src = "js/texturing/color.js" > < / script >
2019-08-18 00:26:14 +08:00
< script src = "js/display_mode.js" > < / script >
2020-09-09 00:40:22 +08:00
< script src = "js/animations/animation.js" > < / script >
< script src = "js/animations/keyframe.js" > < / script >
< script src = "js/animations/timeline.js" > < / script >
2019-01-09 22:54:35 +08:00
< script src = "js/plugin_loader.js" > < / script >
2020-12-13 22:10:08 +08:00
< script src = "js/io/codec.js" > < / script >
2021-01-09 21:17:18 +08:00
< script src = "js/io/format.js" > < / script >
2020-10-01 19:07:45 +08:00
< script src = "js/io/project.js" > < / script >
2020-12-13 22:10:08 +08:00
< script src = "js/io/io.js" > < / script >
2020-07-16 15:32:59 +08:00
< script src = "js/io/formats/bbmodel.js" > < / script >
< script src = "js/io/formats/java_block.js" > < / script >
< script src = "js/io/formats/bedrock.js" > < / script >
< script src = "js/io/formats/bedrock_old.js" > < / script >
< script src = "js/io/formats/obj.js" > < / script >
< script src = "js/io/formats/gltf.js" > < / script >
< script src = "js/io/formats/modded_entity.js" > < / script >
< script src = "js/io/formats/optifine_jem.js" > < / script >
< script src = "js/io/formats/optifine_jpm.js" > < / script >
< script src = "js/io/formats/skin.js" > < / script >
2019-01-09 22:54:35 +08:00
2019-07-18 00:02:07 +08:00
< script > if ( window . module ) module = window . module ; < / script >
2019-01-09 22:54:35 +08:00
2019-07-18 00:02:07 +08:00
< div style = "display: none;" > < / div >
2019-01-09 22:54:35 +08:00
2019-03-10 05:06:35 +08:00
< div id = "overlay_message_box" style = "display: none;" >
< div >
< h3 > < i class = "material-icons" > keyboard< / i > < span class = "tl" > keybindings.recording< / span > < / h3 >
< p class = "tl" > keybindings.press< / p >
2019-08-18 00:26:14 +08:00
< button class = "tl" onclick = "Keybinds.recording.stopRecording()" > dialog.cancel< / button >
< button class = "tl" onclick = "Keybinds.recording.clear().stopRecording()" > keybindings.clear< / button >
2019-03-10 05:06:35 +08:00
< div id = "keybind_input_box" contenteditable = "true" style = "font-size: 0" > < / div >
< / div >
< / div >
2019-07-18 00:02:07 +08:00
< dialog class = "dialog draggable paddinged" id = "updater" >
< div class = "dialog_handle tl" > dialog.update.title< / div >
2019-01-09 22:54:35 +08:00
< h1 > < / h1 >
< div id = "updater_content" > < / div >
< div class = "progress_bar" id = "update_bar" >
< div class = "progress_bar_inner" > < / div >
< / div >
2020-07-16 15:32:59 +08:00
< div class = "dialog_bar button_bar" hidden >
2019-08-18 00:26:14 +08:00
< button type = "button" class = "cancel_btn confirm_btn uc_btn tl" onclick = "hideDialog()" > dialog.close< / button >
2019-01-09 22:54:35 +08:00
< / div >
2019-12-16 03:04:31 +08:00
< div class = "dialog_close_button" onclick = "$('.dialog#'+open_dialog).find('.cancel_btn:not([disabled])').click()" > < i class = "material-icons" > clear< / i > < / div >
2019-07-18 00:02:07 +08:00
< / dialog >
2019-01-09 22:54:35 +08:00
2019-07-18 00:02:07 +08:00
< dialog class = "dialog draggable paddinged" id = "plugins" >
< div class = "dialog_handle tl" > dialog.plugins.title< / div >
2019-01-09 22:54:35 +08:00
< div class = "bar next_to_title" id = "plugins_header_bar" > < / div >
< div class = "bar" >
2019-08-18 00:26:14 +08:00
< div class = "tab_bar" >
< div class = "open tl" onclick = "switchPluginTabs(true)" id = "installed_plugins" > dialog.plugins.installed< / div >
< div class = "tl" onclick = "switchPluginTabs(false)" id = "all_plugins" > dialog.plugins.available< / div >
< / div >
2019-01-09 22:54:35 +08:00
< div class = "search_bar" >
< input type = "text" class = "dark_bordered" id = "plugin_search_bar" oninput = "Plugins.updateSearch()" >
< i class = "material-icons" id = "plugin_search_bar_icon" > search< / i >
< / div >
< / div >
< ul class = "list" id = "plugin_list" >
2019-02-04 04:09:35 +08:00
< li v-for = "plugin in plugin_search" v-bind:plugin = "plugin.id" v-bind:class = "{testing: plugin.fromFile, expanded: plugin.expanded}" >
< div class = "title" v-on:click = "plugin.toggleInfo()" >
2019-08-18 00:26:14 +08:00
< div class = "icon_wrapper plugin_icon normal" v-html = "Blockbench.getIconNode(plugin.icon, plugin.color).outerHTML" > < / div >
2019-01-09 22:54:35 +08:00
< i v-if = "plugin.expanded" class = "material-icons plugin_expand_icon" > expand_less< / i >
< i v-else class = "material-icons plugin_expand_icon" > expand_more< / i >
{{ plugin.title }}
< / div >
2020-04-26 02:25:07 +08:00
< div class = "button_bar" v-if = "plugin.installed || plugin.isInstallable() == true" >
2019-02-04 04:09:35 +08:00
< button type = "button" class = "" v-on:click = "plugin.uninstall()" v-if = "plugin.installed" > < i class = "material-icons" > delete< / i > < span class = "tl" > dialog.plugins.uninstall< / span > < / button >
2019-04-08 00:53:33 +08:00
< button type = "button" class = "" v-on:click = "plugin.download(true)" v-else > < i class = "material-icons" > add< / i > < span class = "tl" > dialog.plugins.install< / span > < / button >
2020-04-26 02:25:07 +08:00
< button type = "button" v-on:click = "plugin.reload()" v-if = "plugin.installed && plugin.isReloadable()" > < i class = "material-icons" > refresh< / i > < span class = "tl" > dialog.plugins.reload< / span > < / button >
2019-01-09 22:54:35 +08:00
< / div >
2020-10-12 01:53:22 +08:00
< div class = "button_bar tiny tl" v-if = "plugin.isInstallable() != true" > {{ plugin.isInstallable() }}< / div >
2019-01-09 22:54:35 +08:00
< div class = "author" > {{ tl('dialog.plugins.author', [plugin.author]) }}< / div >
< div class = "description" > {{ plugin.description }}< / div >
2019-07-18 00:02:07 +08:00
< div v-if = "plugin.expanded" class = "about" v-html = "marked(plugin.about)" > < button > a< / button > < / div >
2019-02-04 04:09:35 +08:00
< div v-if = "plugin.expanded" class = "tl" v-on:click = "plugin.toggleInfo()" style = "text-decoration: underline;" > dialog.plugins.show_less< / div >
2019-01-09 22:54:35 +08:00
< / li >
2019-02-04 04:09:35 +08:00
< div class = "no_plugin_message tl" v-if = "plugin_search.length < 1 && showAll === false" > dialog.plugins.none_installed< / div >
< div class = "no_plugin_message tl" v-if = "plugin_search.length < 1 && showAll === true" id = "plugin_available_empty" > dialog.plugins.none_available< / div >
2019-01-09 22:54:35 +08:00
< / ul >
2020-07-16 15:32:59 +08:00
< div class = "dialog_bar button_bar" hidden >
2020-04-26 02:25:07 +08:00
< button type = "button" class = "cancel_btn confirm_btn uc_btn tl" onclick = "hideDialog();" > dialog.close< / button >
2019-01-09 22:54:35 +08:00
< / div >
2019-12-16 03:04:31 +08:00
< div class = "dialog_close_button" onclick = "$('.dialog#'+open_dialog).find('.cancel_btn:not([disabled])').click()" > < i class = "material-icons" > clear< / i > < / div >
2019-07-18 00:02:07 +08:00
< / dialog >
2019-01-09 22:54:35 +08:00
2019-07-18 00:02:07 +08:00
< dialog class = "dialog draggable paddinged" id = "edit_sessions" >
< div class = "dialog_handle tl" > dialog.edit_session.title< / div >
2019-04-08 00:53:33 +08:00
< div class = "dialog_bar" >
< label class = "name_space_left tl" > edit_session.username< / label >
< input type = "text" class = "dark_bordered half" id = "edit_session_username" >
< / div >
< div class = "dialog_bar" >
< label class = "name_space_left tl" > edit_session.token< / label >
< input type = "text" class = "dark_bordered half f_left" id = "edit_session_token" >
< div id = "edit_session_copy_button" class = "tool" onclick = "EditSession.copyToken()" > < div class = "tooltip tl" > action.paste< / div > < i class = "fa fa_big fa-clipboard" > < / i > < / div >
< / div >
< div class = "edit_session_inactive" >
< p class = "tl" > edit_session.about< / p >
< / div >
< div class = "edit_session_active hidden" >
< p > < b class = "tl" > edit_session.status< / b > : < span class = "tl" id = "edit_session_status" > edit_session.connected< / span > < / p >
< / div >
2020-07-16 15:32:59 +08:00
< div class = "dialog_bar button_bar" >
2019-04-08 00:53:33 +08:00
< button type = "button" class = "edit_session_inactive confirm_btn tl" onclick = "EditSession.join();" > edit_session.join< / button >
< button type = "button" class = "edit_session_inactive tl" onclick = "EditSession.start();" > edit_session.create< / button >
< button type = "button" class = "edit_session_active tl" onclick = "EditSession.quit();" > edit_session.quit< / button >
< button type = "button" class = "cancel_btn tl" onclick = "hideDialog();" > dialog.cancel< / button >
< / div >
2019-12-16 03:04:31 +08:00
< div class = "dialog_close_button" onclick = "$('.dialog#'+open_dialog).find('.cancel_btn:not([disabled])').click()" > < i class = "material-icons" > clear< / i > < / div >
2019-07-18 00:02:07 +08:00
< / dialog >
2019-04-08 00:53:33 +08:00
2019-07-18 00:02:07 +08:00
< dialog class = "dialog draggable paddinged" id = "toolbar_edit" >
< div class = "dialog_handle tl" > dialog.toolbar_edit.title< / div >
2019-01-09 22:54:35 +08:00
< ul class = "bar" id = "bar_items_current" v-sortable = "{onChoose: choose, onUpdate: sort, onEnd: drop, animation: 160 }" >
< li v-for = "item in currentBar" v-bind:title = "item.name" :key = "item.id||item" >
< div v-if = "typeof item === 'string'" class = "toolbar_separator" > < / div >
< div v-else class = "tool" >
< div class = "tooltip" > {{item.name + (BARS.condition(item.condition) ? '' : ' (' + tl('dialog.toolbar_edit.hidden') + ')' )}}< / div >
2019-02-04 04:09:35 +08:00
< span class = "icon_wrapper" v-bind:style = "{opacity: BARS.condition(item.condition) ? 1 : 0.4}" v-html = "Blockbench.getIconNode(item.icon, item.color).outerHTML" > < / span >
2019-01-09 22:54:35 +08:00
< / div >
< / li >
< / ul >
2021-01-09 21:17:18 +08:00
< div class = "bar" style = "margin: 4px 0;" >
2019-01-09 22:54:35 +08:00
< div class = "search_bar" >
< input type = "text" class = "dark_bordered" id = "action_search_bar" oninput = "BARS.list.updateSearch()" >
< i class = "material-icons" id = "plugin_search_bar_icon" > search< / i >
< / div >
< / div >
< ul class = "list" id = "bar_item_list" >
< li v-for = "item in searchedBarItems" v-on:click = "addItem(item)" >
< div class = "icon_wrapper normal" v-html = "Blockbench.getIconNode(item.icon, item.color).outerHTML" > < / div >
< div class = "icon_wrapper add" > < i class = "material-icons" > add< / i > < / div >
{{ item.name }}
< / li >
< / ul >
2020-07-16 15:32:59 +08:00
< div class = "dialog_bar button_bar" >
2020-04-26 02:25:07 +08:00
< button type = "button" class = "cancel_btn confirm_btn uc_btn tl" onclick = "hideDialog();" > dialog.close< / button >
2019-01-09 22:54:35 +08:00
< / div >
2019-12-16 03:04:31 +08:00
< div class = "dialog_close_button" onclick = "$('.dialog#'+open_dialog).find('.cancel_btn:not([disabled])').click()" > < i class = "material-icons" > clear< / i > < / div >
2019-07-18 00:02:07 +08:00
< / dialog >
2019-01-09 22:54:35 +08:00
2019-07-18 00:02:07 +08:00
< dialog class = "dialog draggable paddinged" id = "entity_import" >
< div class = "dialog_handle tl" > dialog.entitylist.title< / div >
2019-01-09 22:54:35 +08:00
< div class = "dialog_bar narrow tl" > dialog.entitylist.text< / div >
< div class = "search_bar" >
< input type = "text" class = "dark_bordered" id = "pe_search_bar" oninput = "pe_list._data.search_text = $(this).val().toUpperCase()" >
< i class = "material-icons" id = "plugin_search_bar_icon" > search< / i >
< / div >
< ul id = "pe_list" class = "list" >
2019-07-18 00:02:07 +08:00
< li v-for = "item in searched" v-bind:class = "{ selected: item.selected }" v-on:click = "selectE(item, $event)" v-on:dblclick = "open(item)" >
2019-01-09 22:54:35 +08:00
< img class = "pe_icon" v-if = "item.icon" v-bind:src = "item.icon" >
< div class = "pe_icon" v-else > < / div >
< h4 > {{ item.title }} < span > ({{ item.name }})< / span > < / h4 >
< p > {{ item.bonecount+' '+tl('dialog.entitylist.bones') }}, {{ item.cubecount+' '+tl('dialog.entitylist.cubes') }}< / p >
< / li >
< / ul >
2020-07-16 15:32:59 +08:00
< div class = "dialog_bar button_bar" >
2019-08-18 00:26:14 +08:00
< button type = "button" class = "tl confirm_btn" onclick = "" > dialog.import< / button >
2020-07-16 15:32:59 +08:00
< button type = "button" class = "cancel_btn tl" onclick = "hideDialog();BarItems.close_project.click()" > dialog.cancel< / button >
2019-01-09 22:54:35 +08:00
< / div >
2020-07-16 15:32:59 +08:00
< div class = "dialog_close_button" onclick = "$('.dialog#'+open_dialog).find('.cancel_btn:not([disabled])').click()" > < i class = "material-icons" > clear< / i > < / div >
2019-07-18 00:02:07 +08:00
< / dialog >
2019-01-09 22:54:35 +08:00
2019-07-18 00:02:07 +08:00
< dialog class = "dialog draggable paddinged" id = "image_extruder" >
< div class = "dialog_handle tl" > dialog.extrude.title< / div >
2019-01-09 22:54:35 +08:00
< h1 > < / h1 >
< div class = "dialog_bar" >
< label class = "tl" > dialog.extrude.mode< / label >
2019-07-18 00:02:07 +08:00
< div class = "bar_select f_left" >
< select id = "scan_mode" name = "scan_mode" >
< option class = "tl" id = "areas" selected > dialog.extrude.mode.areas< / option >
< option class = "tl" id = "lines" > dialog.extrude.mode.lines< / option >
< option class = "tl" id = "columns" > dialog.extrude.mode.columns< / option >
< option class = "tl" id = "pixels" > dialog.extrude.mode.pixels< / option >
< / select >
< / div >
2019-01-09 22:54:35 +08:00
< / div >
< div class = "dialog_bar" >
< label class = "tl" > dialog.extrude.opacity< / label >
< input class = "tool" type = "range" id = "scan_tolerance" value = "255" min = "1" max = "255" >
< label id = "scan_tolerance_label" > 255< / label >
< / div >
< canvas height = "256" width = "256" id = "extrusion_canvas" > < / canvas >
2020-07-16 15:32:59 +08:00
< div class = "dialog_bar button_bar" >
2019-07-18 00:02:07 +08:00
< button type = "button" class = "confirm_btn tl" onclick = "Extruder.startConversion()" > Scan and Import< / button >
< button type = "button" class = "cancel_btn tl" onclick = "hideDialog()" > dialog.cancel< / button >
2019-01-09 22:54:35 +08:00
< / div >
2019-12-16 03:04:31 +08:00
< div class = "dialog_close_button" onclick = "$('.dialog#'+open_dialog).find('.cancel_btn:not([disabled])').click()" > < i class = "material-icons" > clear< / i > < / div >
2019-07-18 00:02:07 +08:00
< / dialog >
2019-01-09 22:54:35 +08:00
2019-07-18 00:02:07 +08:00
< dialog class = "dialog draggable paddinged" id = "scaling" >
< div class = "dialog_handle tl" > dialog.scale.title< / div >
2019-01-09 22:54:35 +08:00
2019-04-08 00:53:33 +08:00
< label class = "tl" > dialog.scale.axis< / label >
2019-01-09 22:54:35 +08:00
< div class = "dialog_bar" style = "height: 32px;" >
< input type = "checkbox" class = "toggle_panel" id = "model_scale_x_axis" onchange = "scaleAll()" checked >
< label class = "toggle_panel" for = "model_scale_x_axis" > X< / label >
< input type = "checkbox" class = "toggle_panel" id = "model_scale_y_axis" onchange = "scaleAll()" checked >
< label class = "toggle_panel" for = "model_scale_y_axis" > Y< / label >
< input type = "checkbox" class = "toggle_panel" id = "model_scale_z_axis" onchange = "scaleAll()" checked >
< label class = "toggle_panel" for = "model_scale_z_axis" > Z< / label >
< / div >
2019-04-08 00:53:33 +08:00
< label class = "tl" > data.origin< / label >
< div class = "dialog_bar" >
< label for = "scaling_origin_x" class = "inline_label tl" > X< / label >
2019-07-19 23:31:22 +08:00
< input type = "number" id = "scaling_origin_x" class = "dark_bordered medium_width" oninput = "scaleAll()" >
2019-04-08 00:53:33 +08:00
< label for = "scaling_origin_y" class = "inline_label tl" > Y< / label >
2019-07-19 23:31:22 +08:00
< input type = "number" id = "scaling_origin_y" class = "dark_bordered medium_width" oninput = "scaleAll()" >
2019-04-08 00:53:33 +08:00
< label for = "scaling_origin_z" class = "inline_label tl" > Z< / label >
2019-07-19 23:31:22 +08:00
< input type = "number" id = "scaling_origin_z" class = "dark_bordered medium_width" oninput = "scaleAll()" >
2020-03-05 03:56:17 +08:00
< div class = "tool" style = "float: none" onclick = "setScaleAllPivot('origin')" >
< div class = "tooltip tl" > dialog.scale.element_pivot< / div >
< i class = "material-icons" > center_focus_strong< / i >
< / div >
< div class = "tool" style = "float: none" onclick = "setScaleAllPivot('selection')" >
< div class = "tooltip tl" > dialog.scale.selection_center< / div >
< i class = "material-icons" > filter_tilt_shift< / i >
< / div >
2019-01-09 22:54:35 +08:00
< / div >
2019-04-08 00:53:33 +08:00
< label class = "tl" > dialog.scale.scale< / label >
2019-01-09 22:54:35 +08:00
< div class = "dialog_bar" style = "height: 32px;" >
< input type = "range" id = "model_scale_range" value = "1" min = "0" max = "4" step = "0.02" oninput = "modelScaleSync()" >
2020-03-05 03:56:17 +08:00
< input type = "number" class = "f_left dark_bordered" id = "model_scale_label" min = "0" max = "4" step = "0.02" value = "1" oninput = "modelScaleSync(true)" >
2019-01-09 22:54:35 +08:00
< / div >
2019-04-08 00:53:33 +08:00
2019-01-09 22:54:35 +08:00
< div class = "dialog_bar narrow" id = "scaling_clipping_warning" > < / div >
2020-07-16 15:32:59 +08:00
< div class = "dialog_bar button_bar" >
2019-04-08 00:53:33 +08:00
< button type = "button" onclick = "scaleAll(true)" class = "confirm_btn tl" > dialog.scale.confirm< / button >
< button type = "button" class = "cancel_btn tl" onclick = "cancelScaleAll()" > dialog.cancel< / button >
2019-04-13 00:44:18 +08:00
< button type = "button" class = "minor hidden tl" id = "scale_overflow_btn" onclick = "scaleAllSelectOverflow()" > dialog.scale.select_overflow< / button >
2019-01-09 22:54:35 +08:00
< / div >
2019-12-16 03:04:31 +08:00
< div class = "dialog_close_button" onclick = "$('.dialog#'+open_dialog).find('.cancel_btn:not([disabled])').click()" > < i class = "material-icons" > clear< / i > < / div >
2019-07-18 00:02:07 +08:00
< / dialog >
2019-01-09 22:54:35 +08:00
2019-07-18 00:02:07 +08:00
< dialog class = "dialog draggable paddinged" id = "create_preset" >
< div class = "dialog_handle tl" > dialog.display_preset.title< / div >
2019-01-09 22:54:35 +08:00
< div class = "dialog_bar tl" > dialog.display_preset.message< / div >
< div class = "dialog_bar" >
< input type = "checkbox" id = "thirdperson_righthand_save" checked >
< label for = "thirdperson_righthand_save" class = "tl" > display.slot.third_right< / label >
< / div >
< div class = "dialog_bar" >
< input type = "checkbox" id = "thirdperson_lefthand_save" checked >
< label for = "thirdperson_lefthand_save" class = "tl" > display.slot.third_left< / label >
< / div >
< div class = "dialog_bar" >
< input type = "checkbox" id = "firstperson_righthand_save" checked >
< label for = "firstperson_righthand_save" class = "tl" > display.slot.first_right< / label >
< / div >
< div class = "dialog_bar" >
< input type = "checkbox" id = "firstperson_lefthand_save" checked >
< label for = "firstperson_lefthand_save" class = "tl" > display.slot.first_left< / label >
< / div >
< div class = "dialog_bar" >
< input type = "checkbox" id = "head_save" checked >
< label for = "head_save" class = "tl" > display.slot.head< / label >
< / div >
< div class = "dialog_bar" >
< input type = "checkbox" id = "ground_save" checked >
< label for = "ground_save" class = "tl" > display.slot.ground< / label >
< / div >
< div class = "dialog_bar" >
< input type = "checkbox" id = "fixed_save" checked >
< label for = "fixed_save" class = "tl" > display.slot.frame< / label >
< / div >
< div class = "dialog_bar" >
< input type = "checkbox" id = "gui_save" checked >
< label for = "gui_save" class = "tl" > display.slot.gui< / label >
< / div >
< div class = "dialog_bar narrow" >
2019-08-18 00:26:14 +08:00
< label class = "tl" > generic.name< / label >
2019-01-09 22:54:35 +08:00
< / div >
< div class = "dialog_bar" >
< input type = "text" id = "preset_name" class = "input_wide" id = "new preset" >
< / div >
2020-07-16 15:32:59 +08:00
< div class = "dialog_bar button_bar" >
2019-08-18 00:26:14 +08:00
< button type = "button" class = "tl confirm_btn" onclick = "DisplayMode.createPreset()" > dialog.display_preset.create< / button >
< button type = "button" class = "tl cancel_btn" onclick = "hideDialog()" > dialog.cancel< / button >
2019-01-09 22:54:35 +08:00
< / div >
2019-12-16 03:04:31 +08:00
< div class = "dialog_close_button" onclick = "$('.dialog#'+open_dialog).find('.cancel_btn:not([disabled])').click()" > < i class = "material-icons" > clear< / i > < / div >
2019-07-18 00:02:07 +08:00
< / dialog >
2019-01-09 22:54:35 +08:00
2019-07-18 00:02:07 +08:00
< dialog class = "dialog draggable paddinged" id = "settings" >
< div class = "dialog_handle tl" > dialog.settings.settings< / div >
2019-08-18 00:26:14 +08:00
< div class = "dialog_bar borderless tab_bar" id = "settings_tab_bar" >
2019-01-09 22:54:35 +08:00
< div class = "tl tab open" id = "setting" onclick = "setSettingsTab('setting')" > dialog.settings.settings< / div >
< div class = "tl tab" id = "keybindings" onclick = "setSettingsTab('keybindings')" > dialog.settings.keybinds< / div >
2020-03-05 03:56:17 +08:00
< div class = "tl tab" id = "layout_settings" onclick = "setSettingsTab('layout_settings')" > dialog.settings.theme< / div >
2019-01-09 22:54:35 +08:00
< div class = "tl tab" id = "credits" onclick = "setSettingsTab('credits')" > dialog.settings.about< / div >
< / div >
2019-04-13 00:44:18 +08:00
2019-01-09 22:54:35 +08:00
< div id = "setting" class = "tab_content" >
< h2 class = "tl i_b" > dialog.settings.settings< / h2 >
2019-07-18 00:02:07 +08:00
< div class = "search_bar" >
< input type = "text" class = "dark_bordered" id = "settings_search_bar" oninput = "Settings.updateSearch()" >
< i class = "material-icons" id = "settings_search_bar_icon" > search< / i >
< / div >
2019-01-09 22:54:35 +08:00
< ul id = "settingslist" >
2019-07-18 00:02:07 +08:00
< li v-for = "category in structure" v-if = "!category.hidden" >
2019-01-09 22:54:35 +08:00
< h3 v-on:click = "toggleCategory(category)" >
2021-01-09 21:17:18 +08:00
< i class = "material-icons settings_expand_icon" > {{ category.open ? 'expand_more' : 'navigate_next' }}< / i >
2019-01-09 22:54:35 +08:00
{{ category.name }}
< / h3 >
< ul v-if = "category.open" >
< li v-for = "(setting, key) in category.items" v-if = "Condition(setting.condition)" v-on = "setting.click ? {click: setting.click} : {}" >
< template v-if = "setting.type === 'number'" >
2019-12-18 00:44:27 +08:00
< div class = "setting_element" > < input type = "number" v-model . number = "setting.value" :min = "setting.min" :max = "setting.max" :step = "setting.step" v-on:input = "saveSettings()" > < / div >
2019-01-09 22:54:35 +08:00
< / template >
< template v-else-if = "setting.type === 'click'" >
2019-07-18 00:02:07 +08:00
< div class = "setting_element setting_icon" v-html = "Blockbench.getIconNode(setting.icon).outerHTML" > < / div >
2019-01-09 22:54:35 +08:00
< / template >
2019-12-16 03:04:31 +08:00
< template v-else-if = "setting.type == 'toggle'" > <!-- TOGGLE -->
2019-01-09 22:54:35 +08:00
< div class = "setting_element" > < input type = "checkbox" v-model = "setting.value" v-bind:id = "'setting_'+key" v-on:click = "saveSettings()" > < / div >
< / template >
< label class = "setting_label" v-bind:for = "'setting_'+key" >
2019-12-16 03:04:31 +08:00
< div class = "setting_name" > {{ setting.name }}< / div >
< div class = "setting_description" > {{ setting.description }}< / div >
2019-01-09 22:54:35 +08:00
< / label >
< template v-if = "setting.type === 'text'" >
< input type = "text" class = "dark_bordered" style = "width: 96%" v-model = "setting.value" v-on:input = "saveSettings()" >
< / template >
2020-04-26 02:25:07 +08:00
< template v-if = "setting.type === 'password'" >
< input :type = "setting.hidden ? 'password' : 'text'" class = "dark_bordered" style = "width: calc(96% - 28px);" v-model = "setting.value" v-on:input = "saveSettings()" >
< div class = "password_toggle" @ click = "setting.hidden = !setting.hidden;" >
< i class = "fas fa-eye-slash" v-if = "setting.hidden" > < / i >
< i class = "fas fa-eye" v-else > < / i >
< / div >
< / template >
2019-01-09 22:54:35 +08:00
< template v-else-if = "setting.type === 'select'" >
2019-04-08 00:53:33 +08:00
< div class = "bar_select" >
< select v-model = "setting.value" >
< option v-for = "(text, id) in setting.options" v-bind:value = "id" > {{ text }}< / option >
< / select >
< / div >
2019-01-09 22:54:35 +08:00
< / template >
< / li >
< / ul >
< / li >
< / ul >
< / div >
2019-04-13 00:44:18 +08:00
2019-01-09 22:54:35 +08:00
< div id = "keybindings" class = "hidden tab_content" >
< h2 class = "tl i_b" > dialog.settings.keybinds< / h2 >
< div class = "bar next_to_title" id = "keybinds_title_bar" > < / div >
2019-07-18 00:02:07 +08:00
< div class = "search_bar" >
< input type = "text" class = "dark_bordered" id = "keybind_search_bar" oninput = "Keybinds.updateSearch()" >
< i class = "material-icons" id = "keybind_search_bar_icon" > search< / i >
< / div >
2019-01-09 22:54:35 +08:00
< ul id = "keybindlist" >
2019-07-18 00:02:07 +08:00
< li v-for = "category in structure" v-if = "!category.hidden" >
2019-12-16 03:04:31 +08:00
< h3 v-on:click = "toggleCategory(category)" >
2021-01-09 21:17:18 +08:00
< i class = "material-icons f_left settings_expand_icon" > {{ category.open ? 'expand_more' : 'navigate_next' }}< / i >
2019-12-16 03:04:31 +08:00
{{ category.name }}
< i class = "material-icons f_right" v-if = "category.conflict" style = "color: var(--color-close);" > fiber_manual_record< / i >
< / h3 >
2019-01-09 22:54:35 +08:00
< ul v-if = "category.open" >
< li v-for = "action in category.actions" >
2019-07-18 00:02:07 +08:00
< div v-bind:title = "action.description" > {{action.name}}< / div >
2019-12-16 03:04:31 +08:00
< div class = "keybindslot" :class = "{conflict: action.keybind && action.keybind.conflict}" @ click . stop = "record(action)" > {{ action.keybind ? action.keybind.label : '' }}< / div >
2019-01-09 22:54:35 +08:00
< div class = "tool" v-on:click = "reset(action)" >
< div class = "tooltip tl" > keybindings.reset< / div >
2019-02-04 04:09:35 +08:00
< i class = "material-icons" > replay< / i >
2019-01-09 22:54:35 +08:00
< / div >
< div class = "tool" v-on:click = "clear(action)" >
< div class = "tooltip tl" > keybindings.clear< / div >
2019-02-04 04:09:35 +08:00
< i class = "material-icons" > clear< / i >
2019-01-09 22:54:35 +08:00
< / div >
< / li >
< / ul >
< / li >
< / ul >
< / div >
2019-04-13 00:44:18 +08:00
2019-01-09 22:54:35 +08:00
< div id = "layout_settings" class = "hidden tab_content" >
2020-03-05 03:56:17 +08:00
< h2 class = "tl i_b" > dialog.settings.theme< / h2 >
2019-01-09 22:54:35 +08:00
< div class = "bar next_to_title" id = "layout_title_bar" > < / div >
2019-12-16 03:04:31 +08:00
< div class = "y_scrollable" id = "theme_editor" >
2019-07-19 23:31:22 +08:00
< div id = "color_wrapper" >
2019-12-16 03:04:31 +08:00
< div class = "color_field" v-for = "(color, key) in colors" :id = "'color_field_' + key" >
< div class = "layout_color_preview" :style = "{'background-color': color}" class = "color_input" > < / div >
< div class = "desc" >
< h4 > {{ tl('layout.color.'+key) }}< / h4 >
< p > {{ tl('layout.color.'+key+'.desc') }}< / p >
< / div >
< / div >
2019-01-09 22:54:35 +08:00
< / div >
2019-07-19 23:31:22 +08:00
< div class = "dialog_bar" >
< label class = "name_space_left tl" for = "layout_font_main" > layout.font.main< / label >
2019-12-16 03:04:31 +08:00
< input style = "font-family: var(--font-main)" type = "text" class = "half dark_bordered" id = "layout_font_main" v-model = "main_font" >
2019-07-19 23:31:22 +08:00
< / div >
2019-01-09 22:54:35 +08:00
2019-07-19 23:31:22 +08:00
< div class = "dialog_bar" >
< label class = "name_space_left tl" for = "layout_font_headline" > layout.font.headline< / label >
2019-12-16 03:04:31 +08:00
< input style = "font-family: var(--font-headline)" type = "text" class = "half dark_bordered" id = "layout_font_headline" v-model = "headline_font" >
< / div >
< div class = "dialog_bar" >
< label class = "name_space_left tl" for = "layout_font_cpde" > layout.font.code< / label >
< input style = "font-family: var(--font-code)" type = "text" class = "half dark_bordered" id = "layout_font_cpde" v-model = "code_font" >
< / div >
< h4 class = "tl i_b" > layout.css< / h4 >
< div id = "css_editor" >
< vue-prism-editor v-model = "css" language = "css" :line-numbers = "true" / >
2019-07-19 23:31:22 +08:00
< / div >
2019-12-16 03:04:31 +08:00
2019-01-09 22:54:35 +08:00
< / div >
< / div >
< div id = "credits" class = "hidden tab_content" >
< h2 class = "tl i_b" > dialog.settings.about< / h2 >
2019-07-18 00:02:07 +08:00
< div id = "about_page_title" >
< i class = "icon-blockbench_inverted" > < / i >
< span > Blockbench< / span >
< / div >
2020-07-16 15:32:59 +08:00
< p > < b class = "tl" > about.version< / b > < span id = "version_tag" > < / span > < / p >
2019-01-09 22:54:35 +08:00
< p > < b class = "tl" > about.creator< / b > JannisX11< / p >
2021-01-12 05:03:36 +08:00
< p > < b class = "tl" > about.website< / b > < a class = "open-in-browser" href = "https://blockbench.net" > blockbench.net< / a > < / p >
2019-01-09 22:54:35 +08:00
< p > < b class = "tl" > about.bugtracker< / b > < a class = "open-in-browser" href = "https://github.com/JannisX11/blockbench/issues" > github.com/JannisX11/blockbench< / a > < / p >
< p class = "local_only tl" > about.electron< / p >
< p class = "tl" > about.vertex_snap< / p >
2021-01-12 05:03:36 +08:00
< p > < b class = "tl" > about.icons< / b > < a href = "https://material.io/icons/" class = "open-in-browser" > material.io/icons< / a > & < a href = "https://fontawesome.io/icons/" class = "open-in-browser" > fontawesome< / a > < / p >
2019-01-09 22:54:35 +08:00
< p > < b class = "tl" > about.libraries< / b >
2021-01-12 05:03:36 +08:00
< a class = "open-in-browser" href = "https://vuejs.org" > Vue< / a > ,
2019-01-09 22:54:35 +08:00
< a class = "open-in-browser" href = "https://github.com/weibangtuo/vue-tree" > Vue Tree< / a > ,
< a class = "open-in-browser" href = "https://github.com/sagalbot/vue-sortable" > Vue Sortable< / a > ,
< a class = "open-in-browser" href = "https://threejs.org" > ThreeJS< / a > ,
2021-01-12 05:03:36 +08:00
< a class = "open-in-browser" href = "https://github.com/lo-th/fullik" > Full IK< / a > ,
2019-01-09 22:54:35 +08:00
< a class = "open-in-browser" href = "https://github.com/oliver-moran/jimp" > Jimp< / a > ,
< a class = "open-in-browser" href = "https://bgrins.github.io/spectrum" > Spectrum< / a > ,
2019-07-18 00:02:07 +08:00
< a class = "open-in-browser" href = "https://github.com/jnordberg/gif.js" > gif.js< / a > ,
< a class = "open-in-browser" href = "https://stuk.github.io/jszip/" > JSZip< / a > ,
2019-09-06 06:16:54 +08:00
< a class = "open-in-browser" href = "https://github.com/rotemdan/lzutf8.js" > LZ-UTF8< / a > ,
2021-01-12 05:03:36 +08:00
< a class = "open-in-browser" href = "https://jquery.com" > jQuery< / a > ,
< a class = "open-in-browser" href = "https://jqueryui.com" > jQuery UI< / a > ,
< a class = "open-in-browser" href = "https://github.com/furf/jquery-ui-touch-punch" > jQuery UI Touch Punch< / a > ,
< a class = "open-in-browser" href = "https://peerjs.com" > PeerJS< / a > ,
2019-07-18 00:02:07 +08:00
< a class = "open-in-browser" href = "https://github.com/markedjs/marked" > Marked< / a >
2021-01-12 05:03:36 +08:00
< a class = "open-in-browser" href = "https://prismjs.com" > Prism< / a >
< a class = "open-in-browser" href = "https://github.com/koca/vue-prism-editor" > Vue Prism Editor< / a >
< a class = "open-in-browser" href = "https://github.com/JannisX11/molangjs" > MolangJS< / a >
< a class = "open-in-browser" href = "https://github.com/JannisX11/wintersky" > Wintersky< / a >
2019-01-09 22:54:35 +08:00
< / p >
< / div >
2019-04-13 00:44:18 +08:00
2020-07-16 15:32:59 +08:00
< div class = "dialog_bar button_bar" hidden >
2019-08-18 00:26:14 +08:00
< button type = "button" class = "confirm_btn cancel_btn tl" onclick = "Settings.save()" > dialog.close< / button >
2019-01-09 22:54:35 +08:00
< / div >
2019-12-16 03:04:31 +08:00
< div class = "dialog_close_button" onclick = "$('.dialog#'+open_dialog).find('.cancel_btn:not([disabled])').click()" > < i class = "material-icons" > clear< / i > < / div >
2019-07-18 00:02:07 +08:00
< / dialog >
2019-01-09 22:54:35 +08:00
2019-07-18 00:02:07 +08:00
< dialog class = "dialog draggable" id = "uv_dialog" >
< div class = "dialog_handle tl" > uv_editor.title< / div >
2019-08-18 00:26:14 +08:00
< div class = "dialog_bar borderless tab_bar" id = "uv_tab_bar" >
2019-01-09 22:54:35 +08:00
< 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 >
2019-07-18 00:02:07 +08:00
2019-01-09 22:54:35 +08:00
< div id = "uv_dialog_single" class = "uv_dialog_content" >
< / div >
2019-07-18 00:02:07 +08:00
< div class = "bar" id = "uv_dialog_toolbar" >
2019-01-09 22:54:35 +08:00
< div class = "toolbar_wrapper uv_dialog" > < / div >
< / div >
2019-07-18 00:02:07 +08:00
2020-07-16 15:32:59 +08:00
< div class = "dialog_bar button_bar" >
< button type = "button" onclick = "hideDialog()" class = "confirm_btn cancel_btn hidden" > dialog.close< / button >
< / div >
2019-01-09 22:54:35 +08:00
2019-12-16 03:04:31 +08:00
< div class = "dialog_close_button" onclick = "$('.dialog#'+open_dialog).find('.cancel_btn:not([disabled])').click()" > < i class = "material-icons" > clear< / i > < / div >
2019-07-18 00:02:07 +08:00
< / dialog >
2019-01-09 22:54:35 +08:00
2019-07-18 00:02:07 +08:00
< dialog class = "dialog draggable paddinged" id = "text_input" >
< div class = "dialog_handle tl" > dialog.input.title< / div >
2019-01-09 22:54:35 +08:00
< div class = "dialog_bar" >
< input type = "text" id = "text_input_field" class = "dark_bordered input_wide" >
< / div >
2020-07-16 15:32:59 +08:00
< div class = "dialog_bar button_bar" >
2019-08-18 00:26:14 +08:00
< button type = "button" class = "confirm_btn tl" onclick = "hideDialog()" > dialog.confirm< / button >
< button type = "button" class = "cancel_btn tl" onclick = "hideDialog()" > dialog.cancel< / button >
2019-01-09 22:54:35 +08:00
< / div >
2019-12-16 03:04:31 +08:00
< div class = "dialog_close_button" onclick = "$('.dialog#'+open_dialog).find('.cancel_btn:not([disabled])').click()" > < i class = "material-icons" > clear< / i > < / div >
2019-07-18 00:02:07 +08:00
< / dialog >
2019-01-09 22:54:35 +08:00
< div id = "plugin_dialog_wrapper" > < / div >
< header >
2019-07-18 00:02:07 +08:00
< ul id = "mac_window_menu" hidden > < / ul >
< div id = "title" class = "app-drag-region" >
2019-01-09 22:54:35 +08:00
< span > Blockbench< / span >
< i class = "icon-blockbench_inverted" > < / i >
< / div >
2019-07-18 00:02:07 +08:00
< ul id = "menu_bar" class = "scroll_horizontal" > < / ul >
< div class = "app-drag-region" id = "header_free_bar" > < / div >
< ul id = "windows_window_menu" hidden >
2019-12-16 03:04:31 +08:00
< li onclick = "currentwindow.minimize()" > < i class = "material-icons" style = "margin-top: 4px;" > remove< / i > < / li >
< li onclick = "currentwindow.isMaximized() ? currentwindow.unmaximize() : currentwindow.maximize()" > < i class = "material-icons" > crop_square< / i > <!-- 🗖 --> < / li >
< li class = "wwm_r" onclick = "currentwindow.close()" > < i class = "material-icons" > clear< / i > < / li >
2019-07-18 00:02:07 +08:00
< / ul >
< button id = "web_download_button" hidden > < a class = "tl" href = "https://blockbench.net/downloads" > web.download_app< / a > < / button >
< / header >
2020-04-26 02:25:07 +08:00
< div id = "page_wrapper" class = "hidden" >
< dialog id = "action_selector" v-if = "open" >
< input type = "text" v-model = "search_input" autocomplete = "off" autosave = "off" autocorrect = "off" spellcheck = "off" autocapitalize = "off" >
< i class = "material-icons" id = "action_search_bar_icon" > search< / i >
< div >
< ul >
< li v-for = "(item, i) in actions" v-on:click = "ActionControl.click(item, $event)" v-bind:class = "{selected: i === index}" v-on:mouseenter = "index = i" >
< div class = "icon_wrapper normal" v-html = "Blockbench.getIconNode(item.icon, item.color).outerHTML" > < / div >
< div class = "name" > {{ item.name }}< / div >
< label > {{ item.keybind.label }}< / label >
< / li >
< / ul >
< div class = "small_text" v-if = "actions[index]" > {{ Pressing.alt ? actions[index].keybind.label : actions[index].description }}< / div >
< / div >
< / dialog >
2019-07-18 00:02:07 +08:00
< div id = "blackout" onclick = "$('.dialog#'+open_dialog).find('.cancel_btn:not([disabled])').click()" > < / div >
< div id = "main_toolbar" >
2019-08-01 17:07:33 +08:00
< div style = "color: #fff; text-align: center; font-family: segoe ui, sans-serif;" id = "no_css_message" >
< br > < h1 > Oops...< / h1 >
< p > It looks like your internet connection was too unstable to automatically update Blockbench.< / p >
< p > Download and run < a style = "color: #75b1ff" href = "https://blockbench.net/downloads/" > the installer< / a > to update manually. Your custom settings will remain untouched.< / p >
< / div >
2019-01-09 22:54:35 +08:00
< div class = "toolbar_wrapper narrow tools" > < / div >
2019-07-18 00:02:07 +08:00
2019-01-09 22:54:35 +08:00
< div class = "toolbar_wrapper narrow tool_options" > < / div >
2019-12-16 03:04:31 +08:00
< ul id = "mode_selector" >
2019-01-09 22:54:35 +08:00
< li
v-for="mode in options"
v-if="Condition(mode.condition)"
v-bind:class="{selected: mode.selected}"
v-on:click="mode.select()"
>{{ mode.name }}< / li >
2019-12-16 03:04:31 +08:00
< / ul >
2020-10-26 22:27:07 +08:00
< div class = "toolbar_wrapper narrow mobile_side" > < / div >
2020-03-05 03:56:17 +08:00
< / div >
2019-01-09 22:54:35 +08:00
< div id = "left_bar" class = "sidebar" >
2020-07-16 15:32:59 +08:00
2019-01-09 22:54:35 +08:00
< div id = "uv" class = "panel selection_only" >
2021-01-13 07:18:36 +08:00
< 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" >
2019-01-09 22:54:35 +08:00
2021-01-13 07:18:36 +08:00
< input type = "radio" name = "side" id = "north_radio" checked >
< label class = "tl" for = "north_radio" > face.north< / label >
2019-01-09 22:54:35 +08:00
2021-01-13 07:18:36 +08:00
< 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 >
2019-01-09 22:54:35 +08:00
2021-01-13 07:18:36 +08:00
< input type = "radio" name = "side" id = "east_radio" >
< label class = "tl" for = "east_radio" > face.east< / label >
2019-01-09 22:54:35 +08:00
2021-01-13 07:18:36 +08:00
< input type = "radio" name = "side" id = "up_radio" >
< label class = "tl" for = "up_radio" > face.up< / label >
2019-01-09 22:54:35 +08:00
2021-01-13 07:18:36 +08:00
< input type = "radio" name = "side" id = "down_radio" >
< label class = "tl" for = "down_radio" > face.down< / label >
< / div >
2019-01-09 22:54:35 +08:00
< / div >
< / div >
2020-07-16 15:32:59 +08:00
2019-01-09 22:54:35 +08:00
< / div >
< div id = "right_bar" class = "sidebar" >
2019-12-16 03:04:31 +08:00
2019-07-19 23:31:22 +08:00
< div id = "element" class = "panel selection_only" >
2021-01-13 07:18:36 +08:00
< div class = "panel_inside" >
< p class = "tl" > panel.element.position< / p >
< div class = "toolbar_wrapper element_position" > < / div >
< p class = "tl" > panel.element.size< / p >
< div class = "toolbar_wrapper element_size" > < / div >
< p class = "tl" > panel.element.origin< / p >
< div class = "toolbar_wrapper element_origin" > < / div >
< p class = "tl" > panel.element.rotation< / p >
< div class = "toolbar_wrapper element_rotation" > < / div >
< / div >
2019-07-19 23:31:22 +08:00
< / div >
2019-04-08 00:53:33 +08:00
< div id = "color" class = "panel" >
2021-01-13 07:18:36 +08:00
< div id = "color_panel_wrapper" class = "panel_inside" >
2019-12-16 03:04:31 +08:00
< div id = "color_panel_head" >
< div class = "main" v-bind:style = "{'background-color': hover_color || main_color}" > < / div >
< div class = "side" >
< input type = "text" v-model = "color_code" @ focusout = "validateMainColor()" >
< div id = "color_history" >
< li
v-for="(color, i) in history" v-if="i || color != main_color"
:key="color"
v-bind:style="{'background-color': color}"
v-bind:title="color" @click="setColor(color)"
>< / li >
< / div >
< / div >
< / div >
2020-07-16 15:32:59 +08:00
< div id = "uv_panel_sides" onclick = "main_uv.loadSelectedFace()" class = "bar tabs_small" >
2019-12-16 03:04:31 +08:00
< input type = "radio" name = "tab" id = "radio_color_picker" value = "picker" v-model = "open_tab" >
< label class = "tl" for = "radio_color_picker" > panel.color.picker< / label >
< input type = "radio" name = "tab" id = "radio_color_palette" value = "palette" v-model = "open_tab" >
< label class = "tl" for = "radio_color_palette" > panel.color.palette< / label >
2020-03-05 03:56:17 +08:00
< input type = "radio" name = "tab" id = "radio_color_both" value = "both" v-model = "open_tab" >
< label class = "tl" for = "radio_color_both" > panel.color.both< / label >
2019-12-16 03:04:31 +08:00
< / div >
2020-03-05 03:56:17 +08:00
< div v-show = "open_tab == 'picker' || open_tab == 'both'" >
2019-12-16 03:04:31 +08:00
< input id = "main_colorpicker" >
< div class = "toolbar_wrapper color_picker" > < / div >
< / div >
2020-03-05 03:56:17 +08:00
< div v-show = "open_tab == 'palette' || open_tab == 'both'" >
2019-12-16 03:04:31 +08:00
< div class = "toolbar_wrapper palette" > < / div >
< ul id = "palette_list" class = "list" v-sortable = "{onUpdate: sort, onEnd: drop, fallbackTolerance: 10}" @ contextmenu = "ColorPanel.menu.open($event)" >
< li
class="color" v-for="color in palette"
:title="color" :key="color"
2020-04-26 02:25:07 +08:00
:class="{selected: color == main_color, contrast: isDarkColor(color)}"
2019-12-16 03:04:31 +08:00
@click="setColor(color)"
@mouseenter="hover_color = color"
@mouseleave="hover_color = ''"
>
< div class = "color_inner" v-bind:style = "{'background-color': color}" > < / div >
< / li >
< / ul >
< / div >
< / div >
2019-04-08 00:53:33 +08:00
< / div >
2019-07-19 23:31:22 +08:00
2019-01-09 22:54:35 +08:00
< / div >
2019-07-18 00:02:07 +08:00
< div id = "center" >
2020-12-22 20:32:49 +08:00
< div id = "preview" class = "center_window" >
2019-07-18 00:02:07 +08:00
< / div >
2020-12-22 20:32:49 +08:00
< div id = "timeline" class = "center_window" >
2019-07-18 00:02:07 +08:00
< div class = "toolbar_wrapper timeline" > < / div >
2019-08-18 00:26:14 +08:00
< div id = "timeline_vue" >
< div id = "timeline_header" >
< div id = "timeline_corner" v-bind:style = "{width: head_width+'px'}" > < / div >
< div id = "timeline_time_wrapper" >
< div id = "timeline_time" v-bind:style = "{width: (size*length)+'px', left: -scroll_left+'px'}" >
2020-04-26 02:25:07 +08:00
< div v-for = "t in timecodes" class = "timeline_timecode" v-bind:style = "{left: (t.time * size) + 'px', width: (t.width * size) + 'px'}" >
< span > {{ t.text }}< / span >
< div class = "substeps" >
< div v-for = "n in Math.ceil(t.substeps)" > < / div >
< / div >
2019-08-18 00:26:14 +08:00
< / div >
2020-01-24 01:53:36 +08:00
< div id = "timeline_playhead"
v-bind:style="{left: (playhead * size) + 'px'}"
>< / div >
2020-04-26 02:25:07 +08:00
< div id = "timeline_endbracket"
v-bind:style="{left: (animation_length * size) + 'px'}"
>< / div >
2020-01-24 01:53:36 +08:00
< div
v-for="marker in markers"
class="timeline_marker"
v-bind:style="{left: (marker.time * size) + 'px', 'border-color': markerColors[marker.color].standard}"
@contextmenu.prevent="marker.showContextMenu($event)"
v-on:click="marker.callPlayhead()"
2019-08-18 00:26:14 +08:00
>< / div >
< / div >
2019-07-18 00:02:07 +08:00
< / div >
< / div >
2019-08-18 00:26:14 +08:00
< div id = "timeline_body" >
2019-12-16 03:04:31 +08:00
< div id = "timeline_body_inner" v-bind:style = "{width: (size*length + head_width)+'px'}" @ contextmenu . stop = "Timeline.showMenu($event)" >
2019-08-18 00:26:14 +08:00
< li v-for = "animator in animators" class = "animator" :class = "{selected: animator.selected}" :uuid = "animator.uuid" v-on:click = "animator.select();" >
2019-12-16 03:04:31 +08:00
< div class = "animator_head_bar" >
2020-04-26 02:25:07 +08:00
< div class = "channel_head" v-bind:style = "{left: scroll_left+'px', width: head_width+'px'}" v-on:dblclick . stop = "toggleAnimator(animator)" >
2019-08-18 00:26:14 +08:00
< div class = "text_button" v-on:click . stop = "toggleAnimator(animator)" >
2020-04-26 02:25:07 +08:00
< i class = "icon-open-state fa" v-bind:class = "{'fa-angle-right': !animator.expanded, 'fa-angle-down': animator.expanded}" > < / i >
2019-08-18 00:26:14 +08:00
< / div >
< span v-on:click . stop = "animator.select();" > {{animator.name}}< / span >
< div class = "text_button" v-on:click . stop = "removeAnimator(animator)" >
< i class = "material-icons" > remove< / i >
< / div >
< / div >
2020-09-28 18:55:45 +08:00
< div class = "keyframe_section" >
< template v-for = "channel in animator.channels" v-if = "!(animator.expanded && channels[channel] != false && (!channels.hide_empty || animator[channel].length))" >
< keyframe
v-for="keyframe in animator[channel]"
v-bind:style="{left: (8 + keyframe.time * size) + 'px'}"
class="keyframe"
v-bind:id="'_'+keyframe.uuid"
>
< i class = "material-icons" > lens< / i >
< / keyframe >
< / template >
2019-08-18 00:26:14 +08:00
< / div >
< / div >
2020-04-26 02:25:07 +08:00
< div class = "animator_channel_bar"
v-bind:style="{width: (size*length + head_width)+'px'}"
v-for="channel in animator.channels"
2020-09-28 18:55:45 +08:00
v-if="animator.expanded & & channels[channel] != false & & (!channels.hide_empty || animator[channel].length)"
2020-04-26 02:25:07 +08:00
>
2019-08-18 00:26:14 +08:00
< div class = "channel_head" v-bind:style = "{left: scroll_left+'px', width: head_width+'px'}" >
2020-03-05 03:56:17 +08:00
< div class = "text_button" v-on:click . stop = "animator.toggleMuted(channel)" >
< template v-if = "channel === 'sound'" >
< i class = "channel_mute fas fa-volume-mute" v-if = "animator.muted[channel]" > < / i >
< i class = "channel_mute fas fa-volume-up" v-else > < / i >
< / template >
< template v-else-if = "channel !== 'timeline'" >
< i class = "channel_mute fas fa-eye-slash" v-if = "animator.muted[channel]" > < / i >
< i class = "channel_mute fas fa-eye" v-else > < / i >
< / template >
< / div >
2019-08-18 00:26:14 +08:00
< span > {{ tl('timeline.'+channel) }}< / span >
< div class = "text_button" v-on:click . stop = "animator.createKeyframe(null, Timeline.time, channel, true)" >
< i class = "material-icons" > add< / i >
< / div >
< / div >
< div class = "keyframe_section" >
< keyframe
v-for="keyframe in animator[channel]"
2020-09-12 22:55:32 +08:00
v-bind:style="{left: (8 + keyframe.time * size) + 'px', color: getColor(keyframe.color)}"
2019-08-18 00:26:14 +08:00
class="keyframe"
v-bind:class="[keyframe.channel, keyframe.selected?'selected':'']"
v-bind:id="keyframe.uuid"
v-on:click.stop="keyframe.select($event)"
2020-01-24 01:53:36 +08:00
v-on:dblclick="keyframe.callPlayhead()"
2019-08-18 00:26:14 +08:00
:title="tl('timeline.'+keyframe.channel)"
@contextmenu.prevent="keyframe.showContextMenu($event)"
>
2020-09-27 19:01:51 +08:00
< i class = "material-icons keyframe_icon_smaller" v-if = "keyframe.interpolation == 'catmullrom'" > lens< / i >
< i class = "material-icons" v-else > stop< / i >
2020-09-28 00:16:13 +08:00
< svg class = "keyframe_waveform" v-if = "keyframe.channel == 'sound' && keyframe.data_points[0].file && waveforms[keyframe.data_points[0].file]" :style = "{width: waveforms[keyframe.data_points[0].file].duration * size}" >
< polygon :points = "getWaveformPoints(waveforms[keyframe.data_points[0].file].samples, size)" > < / polygon >
2020-09-13 02:35:25 +08:00
< / svg >
2019-08-18 00:26:14 +08:00
< / keyframe >
< / div >
< / div >
< / li >
< div id = "timeline_empty_head" class = "channel_head" v-bind:style = "{left: scroll_left+'px', width: head_width+'px'}" >
< / div >
< div id = "timeline_selector" class = "selection_rectangle" > < / div >
< / div >
2019-07-18 00:02:07 +08:00
< / div >
2019-01-09 22:54:35 +08:00
< / div >
2019-07-18 00:02:07 +08:00
< / div >
2020-12-22 20:32:49 +08:00
2020-10-11 22:54:52 +08:00
< div id = "mobile_panel_overlay" hidden > < / div >
2019-01-09 22:54:35 +08:00
< / div >
2019-07-18 00:02:07 +08:00
< div id = "status_bar" @ contextmenu = "Interface.status_bar.menu.show(event)" >
2020-12-22 20:32:49 +08:00
2021-01-10 01:33:42 +08:00
< div class = "sidebar_toggle_button" onclick = "Interface.toggleSidebar('left')" :title = "tl('status_bar.toggle_sidebar')" >
< i class = "material-icons" > {{Prop.show_left_bar ? 'chevron_left' : 'chevron_right'}}< / i >
< / div >
2020-07-16 15:32:59 +08:00
< div class = "f_left" v-if = "settings.streamer_mode.value"
style="background-color: var(--color-stream); color: var(--color-light);"
@click="Settings.open({search: 'streamer_mode'})"
v-bind:title="tl('interface.streamer_mode_on')"
>
< i class = "material-icons" > live_tv< / i >
< / div >
2019-01-09 22:54:35 +08:00
< div id = "status_saved" >
< i class = "material-icons" v-if = "Prop.project_saved" v-bind:title = "tl('status_bar.saved')" > check< / i >
< i class = "material-icons" v-else v-bind:title = "tl('status_bar.unsaved')" > close< / i >
< / div >
2019-08-18 00:26:14 +08:00
< div v-html = "Blockbench.getIconNode(Format.icon).outerHTML" v-bind:title = "Format.name" > < / div >
2019-12-16 03:04:31 +08:00
< div v-if = "Prop.recording" v-html = "Blockbench.getIconNode('fiber_manual_record').outerHTML" style = "color: var(--color-close)" v-bind:title = "tl('status_bar.recording')" > < / div >
2020-07-16 15:32:59 +08:00
2019-01-09 22:54:35 +08:00
< div id = "status_name" >
{{ Prop.file_name }}
< / div >
< div id = "status_message" class = "hidden" > < / div >
< div class = "f_right" >
{{ Prop.fps }} FPS
< / div >
2019-04-08 00:53:33 +08:00
< div class = "f_right" v-if = "Prop.session" >
{{ Prop.connections }} Clients
< / div >
2020-12-22 20:32:49 +08:00
2021-01-10 01:33:42 +08:00
< div class = "sidebar_toggle_button" onclick = "Interface.toggleSidebar('right')" :title = "tl('status_bar.toggle_sidebar')" >
< i class = "material-icons" > {{Prop.show_right_bar ? 'chevron_right' : 'chevron_left'}}< / i >
< / div >
2020-12-22 20:32:49 +08:00
2019-01-09 22:54:35 +08:00
< div id = "status_progress" v-if = "Prop.progress" v-bind:style = "{width: Prop.progress*100+'%'}" > < / div >
< / div >
2020-10-11 22:54:52 +08:00
< div id = "panel_selector_bar" hidden >
< div class = "panel_selector" :class = "{selected: selected == null}" @ click = "select(null)" >
< div class = "icon_wrapper" > < i class = "material-icons icon" > 3d_rotation< / i > < / div >
< / div >
< div class = "panel_selector" :class = "{selected: selected == panel.id}" v-for = "panel in all_panels" v-if = "Condition(panel.condition)" @ click = "select(panel)" >
< div class = "icon_wrapper" v-html = "Blockbench.getIconNode(panel.icon).outerHTML" > < / div >
< / div >
< / div >
2019-07-18 00:02:07 +08:00
< / div >
2019-12-16 03:04:31 +08:00
< script src = "js/boot_loader.js" > < / script >
2019-01-09 22:54:35 +08:00
< script >
if (!Blockbench || !Blockbench.setup_successful) {
document.getElementById('loading_error_message').style.display = 'block'
2020-10-26 22:27:07 +08:00
if (window.require) {
2019-01-09 22:54:35 +08:00
require('electron').remote.getCurrentWindow().webContents.openDevTools()
}
2019-07-18 00:02:07 +08:00
} else {
document.getElementById('loading_error_message').innerHTML = 'No loading errors...'
2019-01-09 22:54:35 +08:00
}
< / script >
2017-10-31 21:49:01 +08:00
< / body >
< / html >
