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" >
2021-02-10 06:56:40 +08:00
< link rel = "manifest" href = "manifest.webmanifest" >
2019-01-09 22:54:35 +08:00
< link rel = "shortcut icon" href = "favicon.png" type = "image/x-icon" / >
2020-12-25 19:38:45 +08:00
< link rel = "apple-touch-icon" href = "icon_full.png" >
2019-01-09 22:54:35 +08:00
< 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';
2021-07-06 05:07:12 +08:00
const appVersion = '3.9.2';
2021-07-02 05:05:34 +08:00
window.onerror = (message, file, line) => {
if (window.Blockbench & & window.Blockbench.setup_successful) return;
let error_element = document.querySelector('#loading_error_detail');
if (error_element & & !error_element.innerText) {
error_element.innerText = `${message}\nIn .${file.split(location.origin).join('')}:${line}`
}
}
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 >
2021-07-02 05:05:34 +08:00
< div id = "loading_error_detail" style = "color: var(--color-subtle_text);" > < / 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 >
2021-04-11 21:58:24 +08:00
< script src = "lib/FileSaver.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 >
2019-01-09 22:54:35 +08:00
2021-02-10 05:26:52 +08:00
< script src = "js/webpack/bundle.js" > < / script >
2021-01-30 23:00:58 +08:00
< script src = "js/preview/OrbitControls.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/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 = "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 >
2021-05-22 05:48:39 +08:00
< div class = "dialog_close_button" onclick = "hideDialog();" > < 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-03-04 21:06:39 +08:00
< p class = "tl small_text subtle" > dialog.toolbar_edit.hidden_tools< / p >
2021-01-09 21:17:18 +08:00
< div class = "bar" style = "margin: 4px 0;" >
2021-02-20 20:21:11 +08:00
< search-bar v-model = "search_term" > < / search-bar >
2019-01-09 22:54:35 +08:00
< / 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 >
2021-05-22 05:48:39 +08:00
< div class = "dialog_close_button" onclick = "hideDialog();" > < 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" >
2021-02-20 20:21:11 +08:00
< input type = "text" class = "dark_bordered" id = "pe_search_bar" oninput = "pe_list._data.search_term = $(this).val().toUpperCase()" >
2019-01-09 22:54:35 +08:00
< 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 >
2021-05-22 05:48:39 +08:00
< div class = "dialog_close_button" onclick = "hideDialog();BarItems.close_project.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 >
2021-05-22 05:48:39 +08:00
< div class = "dialog_close_button" onclick = "hideDialog()" > < 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 >
2021-05-22 05:48:39 +08:00
< div class = "dialog_close_button" onclick = "cancelScaleAll()" > < 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 >
2021-05-22 05:48:39 +08:00
< div class = "dialog_close_button" onclick = "hideDialog()" > < 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" >
2021-07-06 04:59:05 +08:00
< div class = "dialog_handle tl" > menu.file.preferences< / 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 >
2021-04-26 01:40:15 +08:00
< div class = "bar next_to_title" id = "settings_title_bar" > < / div >
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" >
2021-05-25 03:39:15 +08:00
< img src = "assets/logo_text_white.svg" width = "240px" >
2019-07-18 00:02:07 +08:00
< / 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 >
2021-07-06 04:59:05 +08:00
< p > < b class = "tl" > about.repository< / b > < a class = "open-in-browser" href = "https://github.com/JannisX11/blockbench" > github.com/JannisX11/blockbench< / a > < / p >
2019-01-09 22:54:35 +08:00
< 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 > ,
2021-04-11 21:58:24 +08:00
< a class = "open-in-browser" href = "https://github.com/eligrey/FileSaver.js" > FileSaver.js< / a > ,
2021-01-12 05:03:36 +08:00
< a class = "open-in-browser" href = "https://peerjs.com" > PeerJS< / a > ,
2021-02-06 04:51:04 +08:00
< a class = "open-in-browser" href = "https://github.com/markedjs/marked" > Marked< / a > ,
< 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 > ,
2021-01-12 05:03:36 +08:00
< 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 >
2021-05-22 05:48:39 +08:00
< div class = "dialog_close_button" onclick = "Settings.save()" > < 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
2021-05-22 05:48:39 +08:00
< div class = "dialog_close_button" onclick = "hideDialog()" > < 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 >
2021-05-22 05:48:39 +08:00
< div class = "dialog_close_button" onclick = "hideDialog()" > < i class = "material-icons" > clear< / i > < / div >
2019-07-18 00:02:07 +08:00
< / dialog >
2019-01-09 22:54:35 +08:00
2021-02-20 20:21:11 +08:00
< div id = "dialog_wrapper" > < / div >
2019-01-09 22:54:35 +08:00
< header >
2019-07-18 00:02:07 +08:00
< ul id = "mac_window_menu" hidden > < / ul >
2021-05-25 03:39:15 +08:00
< div id = "corner_logo" class = "app-drag-region" >
< img src = "assets/logo_text_white.svg" / >
2019-01-09 22:54:35 +08:00
< / 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" >
2021-02-10 21:05:25 +08:00
< dialog id = "action_selector" > < / dialog >
2019-07-18 00:02:07 +08:00
2021-05-22 05:48:39 +08:00
< div id = "blackout" > < / div >
2019-07-18 00:02:07 +08:00
< 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 >
2021-01-24 21:39:53 +08:00
< div id = "uv_panel_sides" 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" >
2021-02-28 19:51:15 +08:00
< ul id = "toast_notification_list" >
< / ul >
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 >
2021-01-20 01:04:22 +08:00
< div id = "timeline_vue" > < / 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 >
2021-01-24 21:39:53 +08:00
< div id = "status_bar" > < / div >
2020-10-11 22:54:52 +08:00
2021-05-29 05:42:35 +08:00
< div id = "panel_selector_bar" > < / 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 >
