Add support Tab UI with golden layout

This commit is contained in:
Namhyeon Go 2024-09-26 15:46:07 +09:00
parent bf66ef6354
commit f18cf9b859
12 changed files with 5532 additions and 86 deletions

View File

@ -0,0 +1 @@
.lm_root{position:relative}.lm_row>.lm_item{float:left}.lm_content{overflow:hidden;position:relative}.lm_dragging,.lm_dragging *{cursor:move !important;user-select:none}.lm_maximised{position:absolute;top:0;left:0;z-index:40}.lm_maximise_placeholder{display:none}.lm_splitter{position:relative;z-index:20}.lm_splitter:hover,.lm_splitter.lm_dragging{background:orange}.lm_splitter.lm_vertical .lm_drag_handle{width:100%;position:absolute;cursor:ns-resize}.lm_splitter.lm_horizontal{float:left;height:100%}.lm_splitter.lm_horizontal .lm_drag_handle{height:100%;position:absolute;cursor:ew-resize}.lm_header{overflow:visible;position:relative;z-index:1}.lm_header [class^=lm_]{box-sizing:content-box !important}.lm_header .lm_controls{position:absolute;right:3px}.lm_header .lm_controls>li{cursor:pointer;float:left;width:18px;height:18px;text-align:center}.lm_header ul{margin:0;padding:0;list-style-type:none}.lm_header .lm_tabs{position:absolute}.lm_header .lm_tab{cursor:pointer;float:left;height:14px;margin-top:1px;padding:0 10px 5px;padding-right:25px;position:relative}.lm_header .lm_tab i{width:2px;height:19px;position:absolute}.lm_header .lm_tab i.lm_left{top:0;left:-2px}.lm_header .lm_tab i.lm_right{top:0;right:-2px}.lm_header .lm_tab .lm_title{display:inline-block;overflow:hidden;text-overflow:ellipsis}.lm_header .lm_tab .lm_close_tab{width:14px;height:14px;position:absolute;top:0;right:0;text-align:center}.lm_stack.lm_left .lm_header,.lm_stack.lm_right .lm_header{height:100%}.lm_dragProxy.lm_left .lm_header,.lm_dragProxy.lm_right .lm_header,.lm_stack.lm_left .lm_header,.lm_stack.lm_right .lm_header{width:20px;float:left;vertical-align:top}.lm_dragProxy.lm_left .lm_header .lm_tabs,.lm_dragProxy.lm_right .lm_header .lm_tabs,.lm_stack.lm_left .lm_header .lm_tabs,.lm_stack.lm_right .lm_header .lm_tabs{transform-origin:left top;top:0;width:1000px}.lm_dragProxy.lm_left .lm_header .lm_controls,.lm_dragProxy.lm_right .lm_header .lm_controls,.lm_stack.lm_left .lm_header .lm_controls,.lm_stack.lm_right .lm_header .lm_controls{bottom:0}.lm_dragProxy.lm_left .lm_items,.lm_dragProxy.lm_right .lm_items,.lm_stack.lm_left .lm_items,.lm_stack.lm_right .lm_items{float:left}.lm_dragProxy.lm_left .lm_header .lm_tabs,.lm_stack.lm_left .lm_header .lm_tabs{transform:rotate(-90deg) scaleX(-1);left:0}.lm_dragProxy.lm_left .lm_header .lm_tabs .lm_tab,.lm_stack.lm_left .lm_header .lm_tabs .lm_tab{transform:scaleX(-1);margin-top:1px}.lm_dragProxy.lm_left .lm_header .lm_tabdropdown_list,.lm_stack.lm_left .lm_header .lm_tabdropdown_list{top:initial;right:initial;left:20px}.lm_dragProxy.lm_right .lm_content{float:left}.lm_dragProxy.lm_right .lm_header .lm_tabs,.lm_stack.lm_right .lm_header .lm_tabs{transform:rotate(90deg) scaleX(1);left:100%;margin-left:0}.lm_dragProxy.lm_right .lm_header .lm_controls,.lm_stack.lm_right .lm_header .lm_controls{left:3px}.lm_dragProxy.lm_right .lm_header .lm_tabdropdown_list,.lm_stack.lm_right .lm_header .lm_tabdropdown_list{top:initial;right:20px}.lm_dragProxy.lm_bottom .lm_header .lm_tab,.lm_stack.lm_bottom .lm_header .lm_tab{margin-top:0;border-top:none}.lm_dragProxy.lm_bottom .lm_header .lm_controls,.lm_stack.lm_bottom .lm_header .lm_controls{top:3px}.lm_dragProxy.lm_bottom .lm_header .lm_tabdropdown_list,.lm_stack.lm_bottom .lm_header .lm_tabdropdown_list{top:initial;bottom:20px}.lm_drop_tab_placeholder{float:left;width:100px;height:10px;visibility:hidden}.lm_header .lm_controls .lm_tabdropdown:before{content:'';width:0;height:0;vertical-align:middle;display:inline-block;border-top:5px dashed;border-right:5px solid transparent;border-left:5px solid transparent;color:white}.lm_header .lm_tabdropdown_list{position:absolute;top:20px;right:0;z-index:5;overflow:hidden}.lm_header .lm_tabdropdown_list .lm_tab{clear:both;padding-right:10px;margin:0}.lm_header .lm_tabdropdown_list .lm_tab .lm_title{width:100px}.lm_header .lm_tabdropdown_list .lm_close_tab{display:none !important}.lm_dragProxy{position:absolute;top:0;left:0;z-index:30}.lm_dragProxy .lm_header{background:transparent}.lm_dragProxy .lm_content{border-top:none;overflow:hidden}.lm_dropTargetIndicator{display:none;position:absolute;z-index:20}.lm_dropTargetIndicator .lm_inner{width:100%;height:100%;position:relative;top:0;left:0}.lm_transition_indicator{display:none;width:20px;height:20px;position:absolute;top:0;left:0;z-index:20}.lm_popin{width:20px;height:20px;position:absolute;bottom:0;right:0;z-index:9999}.lm_popin>*{width:100%;height:100%;position:absolute;top:0;left:0}.lm_popin>.lm_bg{z-index:10}.lm_popin>.lm_icon{z-index:20}/*# sourceMappingURL=goldenlayout-base.css.map */

View File

@ -0,0 +1 @@
.lm_goldenlayout{background:#000000}.lm_content{background:#222222}.lm_dragProxy .lm_content{box-shadow:2px 2px 4px rgba(0,0,0,0.9)}.lm_dropTargetIndicator{box-shadow:inset 0 0 30px #000000;outline:1px dashed #cccccc;transition:all 200ms ease}.lm_dropTargetIndicator .lm_inner{background:#000000;opacity:.2}.lm_splitter{background:#000000;opacity:.001;transition:opacity 200ms ease}.lm_splitter:hover,.lm_splitter.lm_dragging{background:#444444;opacity:1}.lm_header{height:20px;user-select:none}.lm_header.lm_selectable{cursor:pointer}.lm_header .lm_tab{font-family:Arial,sans-serif;font-size:12px;color:#999999;background:#111111;box-shadow:2px -2px 2px rgba(0,0,0,0.3);margin-right:2px;padding-bottom:2px;padding-top:2px}.lm_header .lm_tab .lm_close_tab{width:11px;height:11px;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAATElEQVR4nG3OwQ0DMQwDwZGRBtR/j1YJzMc5+IDoR+yCVO29g+pu981MFgqZmRdAfU7+CYWcbF11LwALjpBL0N0qybNx/RPU+gOeiS/+XCRwDlTgkQAAAABJRU5ErkJggg==);background-position:center center;background-repeat:no-repeat;top:4px;right:6px;opacity:.4}.lm_header .lm_tab .lm_close_tab:hover{opacity:1}.lm_header .lm_tab.lm_active{border-bottom:none;box-shadow:0 -2px 2px #000000;padding-bottom:3px}.lm_header .lm_tab.lm_active .lm_close_tab{opacity:1}.lm_dragProxy.lm_bottom .lm_header .lm_tab,.lm_stack.lm_bottom .lm_header .lm_tab{box-shadow:2px 2px 2px rgba(0,0,0,0.3)}.lm_dragProxy.lm_bottom .lm_header .lm_tab.lm_active,.lm_stack.lm_bottom .lm_header .lm_tab.lm_active{box-shadow:0 2px 2px #000000}.lm_selected .lm_header{background-color:#452500}.lm_tab:hover,.lm_tab.lm_active{background:#222222;color:#dddddd}.lm_header .lm_controls .lm_tabdropdown:before{color:#ffffff}.lm_controls>li{position:relative;background-position:center center;background-repeat:no-repeat;opacity:.4;transition:opacity 300ms ease}.lm_controls>li:hover{opacity:1}.lm_controls .lm_popout{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAPklEQVR4nI2Q0QoAIAwCNfr/X7aXCpGN8snBdgejJOzckpkxs9jR6K6T5JpU0nWl5pSXTk7qwh8SnNT+CAAWCgkKFpuSWsUAAAAASUVORK5CYII=)}.lm_controls .lm_maximise{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAKElEQVR4nGP8////fwYCgImQAgYGBgYWKM2IR81/okwajIpgvsMbVgAwgQYRVakEKQAAAABJRU5ErkJggg==)}.lm_controls .lm_close{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAQUlEQVR4nHXOQQ4AMAgCQeT/f6aXpsGK3jSTuCVJAAr7iBdoAwCKd0nwfaAdHbYERw5b44+E8JoBjEYGMBq5gAYP3usUDu2IvoUAAAAASUVORK5CYII=)}.lm_maximised .lm_header{background-color:#000000}.lm_maximised .lm_controls .lm_maximise{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAJ0lEQVR4nGP8//8/AzGAiShVI1YhCwMDA8OsWbPwBmZaWhoj0SYCAN1lBxMAX4n0AAAAAElFTkSuQmCC)}.lm_transition_indicator{background-color:#000000;border:1px dashed #555555}.lm_popin{cursor:pointer}.lm_popin .lm_bg{background:#ffffff;opacity:.3}.lm_popin .lm_icon{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAJCAYAAADpeqZqAAAAWklEQVR4nJWOyw3AIAxDHcQC7L8jbwT3AlJBfNp3SiI7dtRaLSlKKeoA1oEsKSQZCEluexw8Tm3ohk+E7bnOUHUGcNh+HwbBygw4AZ7FN/Lt84p0l+yTflV8AKQyLdcCRJi/AAAAAElFTkSuQmCC);background-position:center center;background-repeat:no-repeat;border-left:1px solid #eeeeee;border-top:1px solid #eeeeee;opacity:.7}.lm_popin:hover .lm_icon{opacity:1}/*# sourceMappingURL=goldenlayout-dark-theme.css.map */

View File

@ -0,0 +1,101 @@
.lm_header,
.lm_header .lm_tab{
background: -webkit-linear-gradient(#dadada, #f6f6f6);
/*background: url(http://subtlepatterns.com/patterns/p2.png);*/
}
.lm_splitter{
background: -webkit-linear-gradient(#fff, #eee);
}
.lm_header{
border-bottom: 1px solid #ccc;
height: 19px !important;
}
/*.lm_splitter.lm_vertical{
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAFCAIAAAAL5hHIAAAAHElEQVR4nGNYtGgJk7a2JtPPnz+ZGBgYmFhYWABG7AVnGY/wNAAAAABJRU5ErkJggg==);
background-repeat: repeat-x;
}
*/
.lm_header .lm_tab{
color: #4c4c51;
font-size: 13px;
font-weight: bold;
border-bottom: 1px solid #ccc;
border-right: 1px solid #ccc;
padding-bottom: 4px;
font-family: Arial, sans-serif;
}
.lm_header .lm_tab i.lm_left{
left: -2px;
top: 0;
}
.lm_header .lm_tab i.lm_right{
right: -2px;
top: 0;
width: 0;
z-index: 1;
}
.lm_header .lm_tab.active i.lm_right{
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABCAYAAAD5PA/NAAAAGUlEQVR4nGNkYGAwZ2BgeMXAwPCBgYHhCwAQywMH5I3pAgAAAABJRU5ErkJggg==);
background-repeat: repeat-y;
width: 4px;
right: -5px;
border:none;
}
.lm_header .lm_tab.active i.lm_left{
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABCAYAAAD5PA/NAAAAGUlEQVR4nGNkYGBgZWBg4GFgYBBgYGAQAwABNQA5SO3S/AAAAABJRU5ErkJggg==);
background-repeat: y;
z-index: 1;
width: 4px;
left: -5px;
}
.lm_header .lm_tab.active,
.lm_header .lm_tab:hover{
color: #18181a;
}
.lm_header .lm_tab:hover{
background: #ccc;
}
.lm_header .lm_tab.active{
padding-bottom: 5px;
border-bottom: none;
}
.lm_controls .lm_close,
.lm_header .lm_tab .lm_close_tab{
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAALCAYAAACprHcmAAAAyUlEQVR4nH3QXYrCMBDA8X+bWfQ2CsruJRrQwt5CT6OncCEKc4M+SC3ri7dZ1zK+JCWoOBBCmN98kKKqlmOgBaY8hwBnYKIaEOAUE51q+EzK+/oD+AVwzl2ApgQSGHlfdy9gfzj8NMCqqKolwAjoHneI8AisAEoA1fCXTUjwlsMBv4q+7y2HAG/XAG6qYZZ3HqCIXFVDA8xjXryvzzke4H6/a4G1avjPCxaL7wuwLYEvESHB1CUWzJxzRfo6zAwz28T78Tgz26b3Hdv9aHMjH0aYAAAAAElFTkSuQmCC);
}
.lm_header .lm_tab .lm_close_tab{
width: 11px;
height: 11px;
right: 6px;
top: 4px;
background-repeat: no-repeat;
}
.lm_header .lm_tab.active .lm_close_tab,
.lm_controls .lm_close:hover{
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAALCAYAAACprHcmAAAAfUlEQVR4nHWR0Q2AIAxED6Y46xAu5jhu5AQMQTrG+WEgCPUSAvRdaC9AEkgrpEHSskaWt20veNX2roldGcARwM/Zvd4AzkQa3OsHjmpGAEiSoraLEQBy9Nqgc7x0czTGXMtRGPcahk6kLakjo3u9QRpIK5Kuv09prBVD48weClyE4HksR0kAAAAASUVORK5CYII=);
}
.lm_controls .lm_close{
background-position: center center;
background-repeat: no-repeat;
position: relative;
}

View File

@ -0,0 +1 @@
.lm_goldenlayout{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAMAAAAp4XiDAAAAGFBMVEX29vb19fXw8PDy8vL09PTz8/Pv7+/x8fGKuegbAAAAyUlEQVR42pXRQQ7CMBRDwST9pfe/MahEmgURbt7WmpVb6+vG0dd9REnn66xRy/qXiCgmEIIJhGACIZhACCYQgvlDCDFIEAwSBIMEwSBBMEgQDBIEgwTBIEEwCJEMQiSDENFMQmQzCZEbNyGemd6KeGZ6u4hnXe2qbdLHFjhf1XqNLXHev4wdMd9nspiEiWISJgqECQJhgkCYIBAmCIQJAmGCQJggECYJhAkCEUMEwhCBMEQgDJEIQ2RSg0iEIRJhiB/S+rrjqvXQ3paIJUgPBXxiAAAAAElFTkSuQmCC)}.lm_content{background:#e1e1e1;border:1px solid #cccccc}.lm_dragProxy .lm_content{box-shadow:2px 2px 4px rgba(0,0,0,0.2);box-sizing:border-box}.lm_dropTargetIndicator{box-shadow:inset 0 0 30px rgba(0,0,0,0.4);outline:1px dashed #cccccc;margin:1px;transition:all 200ms ease}.lm_dropTargetIndicator .lm_inner{background:#000000;opacity:.1}.lm_splitter{background:#999999;opacity:.001;transition:opacity 200ms ease}.lm_splitter:hover,.lm_splitter.lm_dragging{background:#bbbbbb;opacity:1}.lm_header{height:20px}.lm_header.lm_selectable{cursor:pointer}.lm_header .lm_tab{font-family:Arial,sans-serif;font-size:12px;color:#888888;background:#fafafa;margin-right:2px;padding-bottom:4px;border:1px solid #cccccc;border-bottom:none}.lm_header .lm_tab .lm_title{padding-top:1px}.lm_header .lm_tab .lm_close_tab{width:11px;height:11px;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAIklEQVR4nGNgYGD4z4Ad/Mdg4ODDBXCZRFgCp5EEHQMXBwAQAgz0SVCcggAAAABJRU5ErkJggg==);background-position:center center;background-repeat:no-repeat;right:6px;top:4px;opacity:.4}.lm_header .lm_tab .lm_close_tab:hover{opacity:1}.lm_header .lm_tab.lm_active{border-bottom:none;box-shadow:2px -2px 2px -2px rgba(0,0,0,0.2);padding-bottom:5px}.lm_header .lm_tab.lm_active .lm_close_tab{opacity:1}.lm_dragProxy.lm_bottom .lm_header .lm_tab.lm_active,.lm_stack.lm_bottom .lm_header .lm_tab.lm_active{box-shadow:2px 2px 2px -2px rgba(0,0,0,0.2)}.lm_selected .lm_header{background-color:#452500}.lm_tab:hover,.lm_tab.lm_active{background:#e1e1e1;color:#777777}.lm_header .lm_controls .lm_tabdropdown:before{color:#000000}.lm_controls>li{position:relative;background-position:center center;background-repeat:no-repeat;opacity:.4;transition:opacity 300ms ease}.lm_controls>li:hover{opacity:1}.lm_controls .lm_popout{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAANUlEQVR4nI2QMQoAMAwCz5L/f9mOzZIaN0E9UDyZhaaQz6atgBHgambEJ5wBKoS0WaIvfT+6K2MIECN19MAAAAAASUVORK5CYII=)}.lm_controls .lm_maximise{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAIklEQVR4nGNkYGD4z0AAMBFSAAOETPpPlEmDUREjAxHhBABPvAQLFv3qngAAAABJRU5ErkJggg==)}.lm_controls .lm_close{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAKUlEQVR4nGNgYGD4z4Af/Mdg4FKASwCnDf8JKSBoAtEmEXQTQd8RDCcA6+4Q8OvIgasAAAAASUVORK5CYII=)}.lm_maximised .lm_header{background-color:#ffffff}.lm_maximised .lm_controls .lm_maximise{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAJklEQVR4nGP8//8/AyHARFDFUFbEwsDAwMDIyIgzHP7//89IlEkApSkHEScJTKoAAAAASUVORK5CYII=)}.lm_transition_indicator{background-color:#000000;border:1px dashed #555555}.lm_popin{cursor:pointer}.lm_popin .lm_bg{background:#000000;opacity:.7}.lm_popin .lm_icon{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAJCAYAAADpeqZqAAAAWklEQVR4nJWOyw3AIAxDHcQC7L8jbwT3AlJBfNp3SiI7dtRaLSlKKeoA1oEsKSQZCEluexw8Tm3ohk+E7bnOUHUGcNh+HwbBygw4AZ7FN/Lt84p0l+yTflV8AKQyLdcCRJi/AAAAAElFTkSuQmCC);background-position:center center;background-repeat:no-repeat;opacity:.7}.lm_popin:hover .lm_icon{opacity:1}/*# sourceMappingURL=goldenlayout-light-theme.css.map */

View File

@ -0,0 +1 @@
.lm_goldenlayout{background:#000000;background:linear-gradient(#000000, #eeeeee);background-repeat:repeat}.lm_content{background:#272822}.lm_dragProxy .lm_content{box-shadow:2px 2px 4px rgba(0,0,0,0.9)}.lm_dropTargetIndicator{box-shadow:inset 0 0 30px #000000;outline:1px dashed #cccccc;transition:all 200ms ease}.lm_dropTargetIndicator .lm_inner{background:#000000;opacity:.2}.lm_splitter{background:#000000;opacity:.001;transition:opacity 200ms ease}.lm_splitter:hover,.lm_splitter.lm_dragging{background:#444444;opacity:1}.lm_header{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAcCAIAAAAvP0KbAAAANElEQVR4nH2IsQ0AMAyDHM5J/v8qD3ixulWdOiAQmhkAquoi6frt33udBEnYprvZXZJg+wAKcQ/o96fYNQAAAABJRU5ErkJggg==);height:28px}.lm_header.lm_selectable{cursor:pointer}.lm_header .lm_tab{font-family:Arial,sans-serif;font-size:13px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAcCAIAAAAvP0KbAAAANklEQVR4nHXGsQ0AMAgDQcuFh2EC9p+HhpIGaCMlKV5/cHdKoiQC+DYzl8+/nJk0M0YEu5tVtXqyIehfJSkOAAAAAElFTkSuQmCC);color:#999999;margin:0;padding-bottom:4px}.lm_header .lm_tab .lm_close_tab{width:11px;height:11px;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAATElEQVR4nG3OwQ0DMQwDwZGRBtR/j1YJzMc5+IDoR+yCVO29g+pu981MFgqZmRdAfU7+CYWcbF11LwALjpBL0N0qybNx/RPU+gOeiS/+XCRwDlTgkQAAAABJRU5ErkJggg==);background-position:center center;background-repeat:no-repeat;right:6px;top:4px;opacity:.4}.lm_header .lm_tab .lm_close_tab:hover{opacity:1}.lm_header .lm_tab.lm_active{border-bottom:none;padding-bottom:5px}.lm_header .lm_tab.lm_active .lm_close_tab{opacity:1}.lm_stack.lm_left .lm_header,.lm_stack.lm_right .lm_header{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAABCAIAAABCJ1mGAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4QQHEjUmFgXMqwAAADBJREFUCNdth7ENADAMwkjOIf9/xQMsqEPVTPVg2TUz3V0PANcb310nAWCbpKQktg/HHA+z1P+XmwAAAABJRU5ErkJggg==)}.lm_selected .lm_header{background-color:#452500}.lm_tab:hover,.lm_tab.lm_active{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAcCAIAAAAvP0KbAAAAKUlEQVR4nGPw8vJi4ubmZmJgYGD6//8/nEZnY+MTUoPM/vfvH9PPnz8BJQc56Apw2moAAAAASUVORK5CYII=);color:#eeeeee}.lm_header .lm_controls .lm_tabdropdown:before{color:#eeeeee}.lm_controls>li{position:relative;background-position:center center;background-repeat:no-repeat;opacity:.4;transition:opacity 300ms ease}.lm_controls>li:hover{opacity:1}.lm_controls .lm_popout{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAPklEQVR4nI2Q0QoAIAwCNfr/X7aXCpGN8snBdgejJOzckpkxs9jR6K6T5JpU0nWl5pSXTk7qwh8SnNT+CAAWCgkKFpuSWsUAAAAASUVORK5CYII=)}.lm_controls .lm_maximise{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAKElEQVR4nGP8////fwYCgImQAgYGBgYWKM2IR81/okwajIpgvsMbVgAwgQYRVakEKQAAAABJRU5ErkJggg==)}.lm_controls .lm_close{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAQUlEQVR4nHXOQQ4AMAgCQeT/f6aXpsGK3jSTuCVJAAr7iBdoAwCKd0nwfaAdHbYERw5b44+E8JoBjEYGMBq5gAYP3usUDu2IvoUAAAAASUVORK5CYII=)}.lm_maximised .lm_header{background-color:#000000}.lm_maximised .lm_controls .lm_maximise{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAJklEQVR4nGP8//8/AyHARFDFUFbEwsDAwMDIyIgzHP7//89IlEkApSkHEScJTKoAAAAASUVORK5CYII=)}.lm_transition_indicator{background-color:#000000;border:1px dashed #555555}.lm_popin{cursor:pointer}.lm_popin .lm_bg{background:#eeeeee;opacity:.7}.lm_popin .lm_icon{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAJCAYAAADpeqZqAAAAWklEQVR4nJWOyw3AIAxDHcQC7L8jbwT3AlJBfNp3SiI7dtRaLSlKKeoA1oEsKSQZCEluexw8Tm3ohk+E7bnOUHUGcNh+HwbBygw4AZ7FN/Lt84p0l+yTflV8AKQyLdcCRJi/AAAAAElFTkSuQmCC);background-position:center center;background-repeat:no-repeat;opacity:.7}.lm_popin:hover .lm_icon{opacity:1}/*# sourceMappingURL=goldenlayout-soda-theme.css.map */

View File

@ -0,0 +1 @@
.lm_goldenlayout{background:#dodgerblue;background:linear-gradient(to right bottom, dodgerblue, palevioletred)}.lm_content{background:rgba(255,255,255,0.1);box-shadow:0 0 15px 2px rgba(0,0,0,0.1);color:whitesmoke}.lm_dragProxy .lm_content{box-shadow:2px 2px 4px rgba(0,0,0,0.9)}.lm_dropTargetIndicator{box-shadow:inset 0 0 20px rgba(255,255,255,0.5);outline:1px dashed #ffffff;margin:1px;transition:all 200ms ease}.lm_splitter{background:#ffffff;opacity:.001;transition:opacity 200ms ease}.lm_splitter:hover,.lm_splitter.lm_dragging{background:#ffffff;opacity:.4}.lm_header{height:20px}.lm_header.lm_selectable{cursor:pointer}.lm_header .lm_tab{font-family:Arial,sans-serif;font-size:13px;color:#ffffff;background:rgba(255,255,255,0.1);margin-right:2px;padding-bottom:4px}.lm_header .lm_tab .lm_close_tab{width:11px;height:11px;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAATElEQVR4nG3OwQ0DMQwDwZGRBtR/j1YJzMc5+IDoR+yCVO29g+pu981MFgqZmRdAfU7+CYWcbF11LwALjpBL0N0qybNx/RPU+gOeiS/+XCRwDlTgkQAAAABJRU5ErkJggg==);background-position:center center;background-repeat:no-repeat;right:6px;top:4px;opacity:.4}.lm_header .lm_tab .lm_close_tab:hover{opacity:1}.lm_header .lm_tab.lm_active{border-bottom:none;box-shadow:2px -2px 2px -2px rgba(0,0,0,0.2);padding-bottom:5px}.lm_header .lm_tab.lm_active .lm_close_tab{opacity:1}.lm_dragProxy.lm_bottom .lm_header .lm_tab.lm_active,.lm_stack.lm_bottom .lm_header .lm_tab.lm_active{box-shadow:2px 2px 2px -2px rgba(0,0,0,0.2)}.lm_tab:hover,.lm_tab.lm_active{background:rgba(255,255,255,0.3);color:#ffffff}.lm_controls>li{position:relative;background-position:center center;background-repeat:no-repeat;opacity:.4;transition:opacity 300ms ease}.lm_controls>li:hover{opacity:1}.lm_controls .lm_popout{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAPklEQVR4nI2Q0QoAIAwCNfr/X7aXCpGN8snBdgejJOzckpkxs9jR6K6T5JpU0nWl5pSXTk7qwh8SnNT+CAAWCgkKFpuSWsUAAAAASUVORK5CYII=)}.lm_controls .lm_maximise{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAKElEQVR4nGP8////fwYCgImQAgYGBgYWKM2IR81/okwajIpgvsMbVgAwgQYRVakEKQAAAABJRU5ErkJggg==)}.lm_controls .lm_close{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAQUlEQVR4nHXOQQ4AMAgCQeT/f6aXpsGK3jSTuCVJAAr7iBdoAwCKd0nwfaAdHbYERw5b44+E8JoBjEYGMBq5gAYP3usUDu2IvoUAAAAASUVORK5CYII=)}.lm_popin{cursor:pointer}.lm_popin .lm_icon{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAJCAYAAADpeqZqAAAAWklEQVR4nJWOyw3AIAxDHcQC7L8jbwT3AlJBfNp3SiI7dtRaLSlKKeoA1oEsKSQZCEluexw8Tm3ohk+E7bnOUHUGcNh+HwbBygw4AZ7FN/Lt84p0l+yTflV8AKQyLdcCRJi/AAAAAElFTkSuQmCC);background-position:center center;background-repeat:no-repeat;opacity:.7}.lm_popin:hover .lm_icon{opacity:1}.lm_item{box-shadow:2px 2px 2px rgba(0,0,0,0.1)}/*# sourceMappingURL=goldenlayout-translucent-theme.css.map */

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

View File

@ -10,12 +10,12 @@ var Router = require("lib/router").Router;
Router.setRender(function(filename, data) { Router.setRender(function(filename, data) {
var template = FILE.readFile(filename, FILE.CdoCharset.CdoUTF_8); var template = FILE.readFile(filename, FILE.CdoCharset.CdoUTF_8);
var tmpl = $.templates(template); var tmpl = $.templates(template);
Browser.setContent(tmpl.render(data)); addContentItem(filename, tmpl.render(data));
// check all links // check all links
Object.values(document.getElementsByTagName("a")).map(function(x) { Object.values(document.getElementsByTagName("a")).map(function(x) {
x.addEventListener("click", function(e) { x.addEventListener("click", function(e) {
var href = e.target.getAttribute("href"); // NOTE: x.href != x.getAttribute("href") var href = e.target.getAttribute("href"); // NOTE: x.href != x.getAttribute("href")
if (href.indexOf('/') == 0) { if (href.indexOf('/') == 0) {
e.preventDefault(); e.preventDefault();
Router.go(href); Router.go(href);
@ -27,30 +27,6 @@ Router.setRender(function(filename, data) {
// main // main
Router.add('/', function(render) { Router.add('/', function(render) {
render("app\\signin.html", {}); render("app\\signin.html", {});
var token;
if (FILE.fileExists("token.txt")) {
token = FILE.readFile("token.txt", FILE.CdoCharset.CdoUTF_8);
}
document.getElementById("loginform").onsubmit = function(ev) {
ev.preventDefault();
};
if (FILE.fileExists("credential.json")) {
var credential = JSON.parse(FILE.readFile("credential.json", FILE.CdoCharset.CdoUTF_8));
document.getElementById("txt_email").value = credential.email;
document.getElementById("txt_password").value = credential.password;
}
document.getElementById("btn_submit").onclick = function() {
var credential = {
"email": document.getElementById("txt_email").value,
"password": document.getElementById("txt_password").value
};
FILE.writeFile("credential.json", JSON.stringify(credential), FILE.CdoCharset.CdoUTF_8);
};
}); });
// test // test
@ -105,5 +81,77 @@ Router.add('/notepad', function(render) {
document.getElementById("useragent").innerHTML = window.navigator.userAgent; document.getElementById("useragent").innerHTML = window.navigator.userAgent;
}); });
// go // clear
Router.go('/'); Browser.setContent("");
// initialize the layout
var config = {
settings: {
hasHeaders: true,
constrainDragToContainer: false,
reorderEnabled: false,
selectionEnabled: false,
popoutWholeStack: false,
blockedPopoutsThrowError: false,
closePopoutsOnUnload: false,
showPopoutIcon: false,
showMaximiseIcon: false,
showCloseIcon: false
},
content: [{
type: 'stack',
isClosable: false,
content: []
}]
};
var myLayout = new GoldenLayout(config);
myLayout.registerComponent('example', function(container, state) {
container.getElement().html('<div >' + state.text + '</div>');
});
myLayout.init();
var addContentItem = function(title, text) {
var newItemConfig = {
title: title,
type: 'component',
componentName: 'example',
componentState: {
text: text
}
};
myLayout.root.contentItems[0].addChild(newItemConfig);
};
// enable move the window with mouse drag and drop
(function(grip) {
var oX, oY,
mouseDown = function(e) {
if (e.offsetY + e.offsetX < 0) return;
oX = e.screenX;
oY = e.screenY;
window.addEventListener("mousemove", mouseMove);
window.addEventListener("mouseup", mouseUp);
},
mouseMove = function(e) {
window.moveTo(screenX + e.screenX - oX, screenY + e.screenY - oY);
oX = e.screenX;
oY = e.screenY;
},
gripMouseMove = function(e) {
this.style.cursor = (e.offsetY + e.offsetX > -1) ? "move" : "default";
},
mouseUp = function(e) {
window.removeEventListener("mousemove", mouseMove);
window.removeEventListener("mouseup", mouseUp);
};
grip.addEventListener("mousedown", mouseDown);
grip.addEventListener("mousemove", gripMouseMove);
})($(".lm_header")[0]);
// go to main
Router.go('/');

View File

@ -12,6 +12,10 @@ input, textarea {
font-family: "맑은 고딕", "Malgun Gothic", "Segoe UI", Calibri, Arial, Sans-Serif; font-family: "맑은 고딕", "Malgun Gothic", "Segoe UI", Calibri, Arial, Sans-Serif;
} }
body .lm_content {
overflow: auto;
}
#app { #app {
width: 100%; width: 100%;
} }

View File

@ -2,9 +2,7 @@
// Namhyeon Go <abuse@catswords.net> // Namhyeon Go <abuse@catswords.net>
// https://github.com/gnh1201/welsonjs // https://github.com/gnh1201/welsonjs
////////////////////////////////////////////////////////////////////////
// only less than IE 9 // only less than IE 9
////////////////////////////////////////////////////////////////////////
if (!window.addEventListener) { if (!window.addEventListener) {
global.Element = function() {}; global.Element = function() {};
@ -110,9 +108,7 @@ if (!window.addEventListener) {
})(window, document, global.Element.prototype, []); })(window, document, global.Element.prototype, []);
} }
////////////////////////////////////////////////////////////////////////
// getIEVersion() // getIEVersion()
////////////////////////////////////////////////////////////////////////
function getIEVersion() { function getIEVersion() {
var undef, var undef,
v = 3, v = 3,
@ -127,9 +123,7 @@ function getIEVersion() {
return v > 4 ? v : undef; return v > 4 ? v : undef;
}; };
////////////////////////////////////////////////////////////////////////
// waitUntil() // waitUntil()
////////////////////////////////////////////////////////////////////////
function waitUntil(f, test, ttl) { function waitUntil(f, test, ttl) {
if (typeof f !== "function") return; if (typeof f !== "function") return;
if (typeof test !== "function") return; if (typeof test !== "function") return;
@ -155,9 +149,7 @@ function waitUntil(f, test, ttl) {
f(_test, ttl); f(_test, ttl);
} }
////////////////////////////////////////////////////////////////////////
// addScript() // addScript()
////////////////////////////////////////////////////////////////////////
function addScript(url, callback, test, ttl) { function addScript(url, callback, test, ttl) {
if (typeof test !== "function") { if (typeof test !== "function") {
test = function(el, callback, ttl) {}; test = function(el, callback, ttl) {};
@ -177,9 +169,7 @@ function addScript(url, callback, test, ttl) {
return el; return el;
}; };
////////////////////////////////////////////////////////////////////////
// addStylesheet() // addStylesheet()
////////////////////////////////////////////////////////////////////////
function addStylesheet(url, callback, test, ttl) { function addStylesheet(url, callback, test, ttl) {
if (typeof test !== "function") { if (typeof test !== "function") {
test = function(el, callback, ttl) {}; test = function(el, callback, ttl) {};
@ -200,16 +190,12 @@ function addStylesheet(url, callback, test, ttl) {
return el; return el;
}; };
////////////////////////////////////////////////////////////////////////
// setContent() // setContent()
////////////////////////////////////////////////////////////////////////
function setContent(content) { function setContent(content) {
document.getElementById("app").innerHTML = content; document.getElementById("app").innerHTML = content;
}; };
////////////////////////////////////////////////////////////////////////
// start() // start()
////////////////////////////////////////////////////////////////////////
function start(callback) { function start(callback) {
var msie = getIEVersion(); var msie = getIEVersion();
@ -247,18 +233,14 @@ function start(callback) {
addScript("app/assets/js/jsrender-1.0.8.min.js"); addScript("app/assets/js/jsrender-1.0.8.min.js");
}; };
////////////////////////////////////////////////////////////////////////
// reload() // reload()
////////////////////////////////////////////////////////////////////////
function reload() { function reload() {
if (typeof window !== "undefined") { if (typeof window !== "undefined") {
window.location.reload(); window.location.reload();
} }
}; };
////////////////////////////////////////////////////////////////////////
// close() // close()
////////////////////////////////////////////////////////////////////////
function close() { function close() {
exit(0); exit(0);
}; };
@ -272,7 +254,7 @@ exports.start = start;
exports.reload = reload; exports.reload = reload;
exports.close = close; exports.close = close;
exports.VERSIONINFO = "Browser Library (browser.js) version 0.1.4"; exports.VERSIONINFO = "Browser Compatibility Library (browser.js) version 0.1.5";
exports.AUTHOR = "abuse@catswords.net"; exports.AUTHOR = "abuse@catswords.net";
exports.global = global; exports.global = global;
exports.require = global.require; exports.require = global.require;

View File

@ -1,12 +1,8 @@
////////////////////////////////////////////////////////////////////////
// Webloader // Webloader
////////////////////////////////////////////////////////////////////////
var FILE = require("lib/file"); var FILE = require("lib/file");
var Browser = require("lib/browser"); var Browser = require("lib/browser");
////////////////////////////////////////////////////////////////////////
// Override global.console._echo() // Override global.console._echo()
////////////////////////////////////////////////////////////////////////
global.console._echo = function(args, type) { global.console._echo = function(args, type) {
var heading, icon, message = this._join(args); var heading, icon, message = this._join(args);
var params = { var params = {
@ -66,52 +62,17 @@ global.console._echo = function(args, type) {
} }
}; };
////////////////////////////////////////////////////////////////////////
// Override global.exit() // Override global.exit()
////////////////////////////////////////////////////////////////////////
global.exit = function() { global.exit = function() {
if (typeof(window) !== "undefined") { if (typeof(window) !== "undefined") {
window.close(); window.close();
} }
}; };
////////////////////////////////////////////////////////////////////////
// this window makes movable
////////////////////////////////////////////////////////////////////////
(function(grip) {
var oX, oY,
mouseDown = function(e) {
if (e.offsetY + e.offsetX < 0) return;
oX = e.screenX;
oY = e.screenY;
window.addEventListener("mousemove", mouseMove);
window.addEventListener("mouseup", mouseUp);
},
mouseMove = function(e) {
window.moveTo(screenX + e.screenX - oX, screenY + e.screenY - oY);
oX = e.screenX;
oY = e.screenY;
},
gripMouseMove = function(e) {
this.style.cursor = (e.offsetY + e.offsetX > -1) ? "move" : "default";
},
mouseUp = function(e) {
window.removeEventListener("mousemove", mouseMove);
window.removeEventListener("mouseup", mouseUp);
};
grip.addEventListener("mousedown", mouseDown);
grip.addEventListener("mousemove", gripMouseMove);
})(document.getElementById("app"));
////////////////////////////////////////////////////////////////////////
// exports.IEVersion // exports.IEVersion
////////////////////////////////////////////////////////////////////////
exports.IEVersion = Browser.getIEVersion(); exports.IEVersion = Browser.getIEVersion();
////////////////////////////////////////////////////////////////////////
// exports.main() // exports.main()
////////////////////////////////////////////////////////////////////////
exports.main = function(args) { exports.main = function(args) {
// make will display contents // make will display contents
Browser.setContent(FILE.readFile("app\\index.html", FILE.CdoCharset.CdoUTF_8)); Browser.setContent(FILE.readFile("app\\index.html", FILE.CdoCharset.CdoUTF_8));
@ -119,6 +80,8 @@ exports.main = function(args) {
// add stylesheets // add stylesheets
Browser.addStylesheet("app/assets/css/jquery-ui-1.21.1.min.css"); Browser.addStylesheet("app/assets/css/jquery-ui-1.21.1.min.css");
Browser.addStylesheet("app/assets/css/jquery.toast-1.3.2.min.css"); Browser.addStylesheet("app/assets/css/jquery.toast-1.3.2.min.css");
Browser.addStylesheet("app/assets/css/goldenlayout-1.5.9-base.css");
Browser.addStylesheet("app/assets/css/goldenlayout-1.5.9-light-theme.css");
Browser.addStylesheet("app/assets/css/cascade/production/build-full.min.css"); Browser.addStylesheet("app/assets/css/cascade/production/build-full.min.css");
Browser.addStylesheet("app/assets/css/style.css"); Browser.addStylesheet("app/assets/css/style.css");
@ -137,6 +100,7 @@ exports.main = function(args) {
// start the app // start the app
Browser.addScript("app/assets/js/jquery.form-4.3.0.min.js"); Browser.addScript("app/assets/js/jquery.form-4.3.0.min.js");
Browser.addScript("app/assets/js/goldenlayout-1.5.9.min.js");
Browser.addScript("app/index.js"); Browser.addScript("app/index.js");
// hide loading image // hide loading image