modify project viewer
This commit is contained in:
parent
75ee3b22a5
commit
cb42a16538
@ -24,32 +24,41 @@
|
||||
}
|
||||
|
||||
.project-list {
|
||||
line-height: 28px;
|
||||
|
||||
a {
|
||||
color: #9EB0C0;
|
||||
}
|
||||
|
||||
div {
|
||||
dl {
|
||||
padding: 0 10px 0 15px;
|
||||
}
|
||||
cursor: pointer;
|
||||
|
||||
div:hover {
|
||||
background: #323842;
|
||||
|
||||
a {
|
||||
color: #FFF;
|
||||
dt {
|
||||
line-height: 28px;
|
||||
font-weight: normal;
|
||||
color: #9EB0C0;
|
||||
}
|
||||
|
||||
.i-del {
|
||||
dd {
|
||||
display: none;
|
||||
line-height: 28px;
|
||||
color: #6F7D88;
|
||||
span {
|
||||
margin-right: 10px;
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
dl:hover {
|
||||
background: lighten(#323842, 10%);
|
||||
dt {
|
||||
color: #FFF;
|
||||
}
|
||||
}
|
||||
|
||||
dl.selected {
|
||||
background: #323842;
|
||||
dd {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.i-del {
|
||||
float: right;
|
||||
display: none;
|
||||
color: #FFF;
|
||||
}
|
||||
}
|
||||
}
|
@ -53,13 +53,7 @@ define(
|
||||
if(e.keyCode == 32) {
|
||||
this.setMode('pan');
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 按键
|
||||
*/
|
||||
keyup: function(e) {
|
||||
if(e.keyCode == 65 && e.ctrlKey) {
|
||||
else if(e.keyCode == 65 && e.ctrlKey) {
|
||||
this.setMode('shapes', this.fontLayer.shapes.slice());
|
||||
}
|
||||
},
|
||||
|
@ -47,10 +47,9 @@ define(
|
||||
// 使用BKDR算法计算哈希
|
||||
// http://www.cnblogs.com/uvsjoh/archive/2012/03/27/2420120.html
|
||||
|
||||
var seed = 131;
|
||||
var hash = 0;
|
||||
for (var i = 0, l = sequence.length; i < l ; i++) {
|
||||
hash = 0x7FFFFFFF & (hash * seed + sequence[i]);
|
||||
hash = 0x7FFFFFFF & (hash * 131 + sequence[i]);
|
||||
}
|
||||
|
||||
return hash;
|
||||
|
@ -30,7 +30,7 @@ define(
|
||||
success: function(imported) {
|
||||
program.viewer.clearSelected();
|
||||
program.ttfManager.set(imported);
|
||||
program.data.projectName = null;
|
||||
program.data.projectId = null;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
@ -25,12 +25,6 @@ define(
|
||||
+ '<div data-field="name" class="name" title="${name}">${name}</div>'
|
||||
+ '</div>';
|
||||
|
||||
var keyMap = {
|
||||
46: 'del',
|
||||
67: 'copy',
|
||||
88: 'cut'
|
||||
};
|
||||
|
||||
// 获取glyfhtml文本
|
||||
function getGlyfHTML(glyf, ttf, opt) {
|
||||
var g = {
|
||||
@ -195,12 +189,12 @@ define(
|
||||
me.fire('selection:change');
|
||||
}
|
||||
// 撤销
|
||||
else if(e.keyCode == 90 && e.ctrlKey) {
|
||||
else if(90 === e.keyCode && e.ctrlKey) {
|
||||
e.stopPropagation();
|
||||
me.fire('undo');
|
||||
}
|
||||
// 重做
|
||||
else if(e.keyCode == 89 && e.ctrlKey) {
|
||||
else if(89 === e.keyCode && e.ctrlKey) {
|
||||
e.stopPropagation();
|
||||
me.fire('redo');
|
||||
}
|
||||
@ -211,25 +205,30 @@ define(
|
||||
me.clearEditing();
|
||||
me.fire('selection:change');
|
||||
}
|
||||
// 其他操作, del, copy, cut
|
||||
else if (keyMap[e.keyCode] && (e.keyCode == 46 || e.ctrlKey)) {
|
||||
// del, cut
|
||||
else if (46 === e.keyCode || (88 === e.keyCode && e.ctrlKey)) {
|
||||
e.stopPropagation();
|
||||
var selected = me.getSelected();
|
||||
|
||||
// 取消选中的glyf
|
||||
if (e.keyCode == 46 || e.keyCode == 88) {
|
||||
if (selected.length) {
|
||||
// del, cut 取消选中的glyf
|
||||
me.clearSelected();
|
||||
// 正在编辑的
|
||||
var editing = selected.indexOf(me.getEditing());
|
||||
if (editing >= 0) {
|
||||
me.clearEditing();
|
||||
}
|
||||
me.fire('selection:change');
|
||||
}
|
||||
|
||||
// 粘贴和有选择的操作需要发事件
|
||||
me.fire('selection:change');
|
||||
me.fire(46 === e.keyCode ? 'del' : 'cut', {
|
||||
list: selected
|
||||
});
|
||||
}
|
||||
}
|
||||
// copy
|
||||
else if (67 === e.keyCode && e.ctrlKey) {
|
||||
var selected = me.getSelected();
|
||||
if (selected.length) {
|
||||
me.fire(keyMap[e.keyCode], {
|
||||
me.fire('copy', {
|
||||
list: selected
|
||||
});
|
||||
}
|
||||
@ -245,11 +244,11 @@ define(
|
||||
|
||||
var me = this;
|
||||
me.main
|
||||
.delegate('[data-index]', 'click', function() {
|
||||
.on('click', '[data-index]', function() {
|
||||
$(this).toggleClass('selected');
|
||||
me.fire('selection:change');
|
||||
})
|
||||
.delegate('[data-action]', 'click', lang.bind(clickAction, this));
|
||||
.on('click', '[data-action]', lang.bind(clickAction, this));
|
||||
|
||||
me.downlistener = lang.bind(downlistener, this);
|
||||
|
||||
|
@ -27,62 +27,66 @@ define(
|
||||
/**
|
||||
* 添加一个项目
|
||||
*
|
||||
* @param {string} projectName 项目名称
|
||||
* @param {string} name 项目名称
|
||||
* @param {Object} ttf ttfObject
|
||||
* @return {Array} 现有项目列表
|
||||
*/
|
||||
add: function(projectName, ttf) {
|
||||
add: function(name, ttf) {
|
||||
var list = this.items();
|
||||
var exist = list.filter(function(l) {
|
||||
return l.name == projectName;
|
||||
});
|
||||
|
||||
var id;
|
||||
if (exist.length) {
|
||||
id = exist[0].id;
|
||||
}
|
||||
else {
|
||||
id = Date.now();
|
||||
list.push({
|
||||
name: projectName,
|
||||
id: id
|
||||
});
|
||||
}
|
||||
var id = Date.now();
|
||||
list.push({
|
||||
name: name,
|
||||
id: id
|
||||
});
|
||||
|
||||
storage.setItem('project-list', JSON.stringify(list));
|
||||
storage.setItem(id, JSON.stringify(ttf));
|
||||
return list;
|
||||
|
||||
return id;
|
||||
},
|
||||
|
||||
/**
|
||||
* 更新一个项目
|
||||
*
|
||||
* @param {string} id 编号
|
||||
* @param {Object} ttf ttf对象
|
||||
* @return {string} 项目编号
|
||||
*/
|
||||
update: function(id, ttf) {
|
||||
storage.setItem(id, JSON.stringify(ttf));
|
||||
return id;
|
||||
},
|
||||
|
||||
/**
|
||||
* 删除一个项目
|
||||
*
|
||||
* @param {string} projectName 项目名称
|
||||
* @param {string} id 项目名称
|
||||
* @return {Array} 现有项目列表
|
||||
*/
|
||||
remove: function(projectName) {
|
||||
remove: function(id) {
|
||||
var list = this.items();
|
||||
for(var i = list.length - 1; i >= 0; i--) {
|
||||
if (list[i].name == projectName) {
|
||||
if (list[i].id == id) {
|
||||
storage.removeItem(list[i].id);
|
||||
list.splice(i, 1);
|
||||
}
|
||||
}
|
||||
|
||||
storage.setItem('project-list', JSON.stringify(list));
|
||||
|
||||
return list;
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取一个项目
|
||||
*
|
||||
* @param {string} projectName 项目名称
|
||||
* @param {string} id 项目编号
|
||||
* @return {Object=} 项目对象
|
||||
*/
|
||||
get: function(projectName) {
|
||||
get: function(id) {
|
||||
var list = this.items();
|
||||
for(var i = 0, l = list.length; i < l ; i++) {
|
||||
if (list[i].name == projectName) {
|
||||
if (list[i].id == id) {
|
||||
var item = storage.getItem(list[i].id);
|
||||
if (item) {
|
||||
return JSON.parse(item);
|
||||
|
@ -23,30 +23,48 @@ define(
|
||||
|
||||
var me = this;
|
||||
|
||||
me.main.delegate('[data-action]', 'click', function(e) {
|
||||
me.main.on('click', '[data-action]', function(e) {
|
||||
e.stopPropagation();
|
||||
var the = $(this);
|
||||
me.fire(the.attr('data-action'), {
|
||||
projectName: the.parent().attr('data-name')
|
||||
var target = $(e.target);
|
||||
var action = target.attr('data-action');
|
||||
var id = target.parents('[data-id]').attr('data-id');
|
||||
if ('del' === action) {
|
||||
|
||||
if (!window.confirm('是否删除项目?')) {
|
||||
return;
|
||||
}
|
||||
|
||||
me.current && me.current.remove();
|
||||
me.current = null;
|
||||
}
|
||||
|
||||
me.fire(action, {
|
||||
projectId: id
|
||||
});
|
||||
});
|
||||
|
||||
me.main.delegate('[data-name]', 'click', function(e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
me.main.on('click', '[data-id]', function(e) {
|
||||
me.fire('open', {
|
||||
projectName: $(this).attr('data-name')
|
||||
projectId: $(this).attr('data-id')
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
ProjectViewer.prototype.select = function(id) {
|
||||
this.current && this.current.removeClass('selected');
|
||||
this.current = $('[data-id="'+ id +'"]').addClass('selected');
|
||||
};
|
||||
|
||||
ProjectViewer.prototype.show = function(projects) {
|
||||
var str = '';
|
||||
(projects || []).forEach(function(proj) {
|
||||
str += '<div data-name="'+ proj.name +'" data-id="'+ proj.id +'">'
|
||||
+ '<i title="删除" data-action="del" class="ico i-del"></i>'
|
||||
+ '<a href="#">'+ proj.name +'</a>'
|
||||
+ '</div>';
|
||||
str += '<dl data-id="'+ proj.id +'">'
|
||||
+ '<dt>'+ proj.name +'</dt>'
|
||||
+ '<dd>'
|
||||
+ '<span data-action="saveas">另存为</span>'
|
||||
+ '<span data-action="del">删除</span>'
|
||||
+ '</dd>'
|
||||
+ '</dl>';
|
||||
});
|
||||
|
||||
this.main.html(str);
|
||||
|
@ -409,7 +409,17 @@ define(
|
||||
* @return {this}
|
||||
*/
|
||||
Manager.prototype.setState = function(state) {
|
||||
if (state == 'new') {
|
||||
if (state === 'new') {
|
||||
this.changed = false;
|
||||
}
|
||||
else if (state === 'saved') {
|
||||
this.ttf.get().glyf.forEach(function(g) {
|
||||
delete g.modify;
|
||||
});
|
||||
|
||||
this.fire('set', {
|
||||
ttf: this.ttf.get()
|
||||
});
|
||||
this.changed = false;
|
||||
}
|
||||
};
|
||||
|
Loading…
x
Reference in New Issue
Block a user