CocoRoboLabs
/
CocoRoboDesktop


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
							<!DOCTYPE html>
<html>
<head>
    <script src="bower_components/seajs/dist/sea.js"></script>
    <meta charset="utf-8">
    <link rel="stylesheet" href="hotbox.css" />
    <style>
        html, body {
            margin: 0;
            padding: 0;
        }
        .message {
            text-align: center;
            margin: 20px 0;
        }
        .editor {
            width: 1200px;
            height: 750px;
            position: relative;
            background: rgb(251, 251, 251);
            border: 1px solid #ccc;
            margin: 20px auto;
            overflow: hidden;
        }
    </style>
</head>
<body>
<div class="message">编辑区域获得焦点时，按空格呼出热盒。主菜单的快捷键可以直接执行</div>
<div class="editor"></div>
</body>
<script>
    /* global seajs */
    seajs.config({
        base: './src'
    });

    define('start', function(require) {
        var HotBox = require('hotbox');

        var hotbox = new HotBox('.editor');

        hotbox.control();

        hotbox.hintDeactiveMainState = true;
        hotbox.openOnContextMenu = true;

        var main = hotbox.state('main');

        main.button({
            position: 'center',
            label: '编辑',
            key: 'F2'
        });

        var ringButtons = '前移:Alt+Up|下级:Tab|同级:Enter|后移:Alt+Down|删除:Delete|归纳:Shift+Tab'.split('|');
        ringButtons.forEach(function(button) {
            main.button({
                position: 'ring',
                label: button.split(':')[0],
                key: button.split(':')[1]
            });
        });

        var topButtons = '超链接:H|图片:I|备注:N|优先级:P|进度:G|资源:R'.split('|');
        topButtons.forEach(function(button) {
            main.button({
                position: 'top',
                label: button.split(':')[0],
                key: button.split(':')[1],
                next: button.split(':')[1] == 'P' ? 'priority' : 'idle'
            });
        });

        var bottomButtons = '模板:T|布局:L|样式:S|展开:/|选择:M'.split('|');
        bottomButtons.forEach(function(button) {
            main.button({
                position: 'bottom',
                label: button.split(':')[0],
                key: button.split(':')[1]
            });
        });

        var priority = hotbox.state('priority');
        '123456789'.split('').forEach(function(p) {
            priority.button({
                position: 'ring',
                label: 'P' + p,
                key: p
            });
        });
        priority.button({
            position: 'center',
            label: '移除',
            key: 'Del',
            next: 'idle'
        });
        priority.button({
            position: 'top',
            label: '返回',
            key: 'Esc',
            next: 'back'
        });
    });

    seajs.use('start');
</script>
</html>