25개 이상의 토픽을 선택하실 수 없습니다.
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
107 lines
2.8 KiB
107 lines
2.8 KiB
<!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>
|