modify editing selection

This commit is contained in:
kekee000
2014-12-11 00:28:41 +08:00
parent 831aeefaca
commit f78e8bc3b9
6 changed files with 71 additions and 31 deletions

View File

@@ -46,13 +46,12 @@
}
.i-edit {
right: 20px;
right: 22px;
}
}
>.glyf-item:hover,
>.selected {
background: #232830;
.glyf {
border-color: #232830;
}
@@ -62,6 +61,8 @@
}
>.glyf-item:hover {
background: #3C619B;
.name {
color: #FFF;
}
@@ -73,9 +74,21 @@
}
}
>.selected,
>.selected:hover {
background: #232830;
}
>.editing,
>.editing:hover {
.glyf {
border-color: #066BC5;
}
}
>.compound {
.path {
fill: lighten(#232830, 10%) !important;
fill: lighten(#232830, 20%) !important;
}
}

View File

@@ -14,10 +14,10 @@ define(
// 移动步频
var stepMap = {
'left': [-5, 0],
'right': [5, 0],
'up': [0, -5],
'down': [0, 5]
'left': [-1, 0],
'right': [1, 0],
'up': [0, -1],
'down': [0, 1]
};
/**

View File

@@ -19,10 +19,10 @@ define(
// 移动步频
var stepMap = {
'left': [-5, 0],
'right': [5, 0],
'up': [0, -5],
'down': [0, 5]
'left': [-1, 0],
'right': [1, 0],
'up': [0, -1],
'down': [0, 1]
};
/**

View File

@@ -62,10 +62,10 @@ define(
alert('暂不支持复合字形!');
}
else {
program.data.editingIndex = glyfIndex;
program.editor.setFont(lang.clone(font));
}
}
program.editor.focus();
}
};
@@ -74,9 +74,9 @@ define(
$('.main').removeClass('editing');
$('.editor').removeClass('editing');
program.data.editingIndex = -1;
program.editor && program.editor.hide();
program.viewer.clearEditing();
program.viewer.setMode('list');
program.viewer.focus();
};
@@ -84,15 +84,6 @@ define(
program.viewer.on('del', function(e) {
if (e.list) {
// 正在编辑中的不可被删除
if (program.data.editingIndex !== -1) {
var editingIndex = e.list.indexOf(program.data.editingIndex);
if (editingIndex >= 0) {
e.list.splice(editingIndex, 1);
}
}
program.ttfManager.removeGlyf(e.list);
}
}).on('edit', function(e) {
@@ -147,8 +138,9 @@ define(
program.ttfManager.on('change', function(e) {
// 保存正在编辑的字形
if (e.changeType === 'update' && program.editor.isEditing() && program.data.editingIndex !== -1) {
program.viewer.refresh(e.ttf, [program.data.editingIndex]);
var editing = program.viewer.getEditing();
if (e.changeType === 'update' && program.editor.isEditing() && editing !== -1) {
program.viewer.refresh(e.ttf, [editing]);
}
else {
program.viewer.show(e.ttf, program.viewer.getSelected());
@@ -173,8 +165,9 @@ define(
if (program.editor.isEditing()) {
// 如果是正在编辑的
if (program.data.editingIndex !== -1) {
program.ttfManager.replaceGlyf(program.editor.getFont(), program.data.editingIndex);
var editing = program.viewer.getEditing();
if (editing !== -1) {
program.ttfManager.replaceGlyf(program.editor.getFont(), editing);
}
// 否则新建font
else {

View File

@@ -79,9 +79,7 @@ define(
this.editor.setFont(font);
}
this.editor.focus();
this.editor.refresh();
this.editing = true;
};

View File

@@ -14,7 +14,7 @@ define(
var MouseCapture = require('render/capture/Mouse');
var GLYF_ITEM_TPL = ''
+ '<div data-index="${index}" class="glyf-item ${compound} ${modify} ${selected}">'
+ '<div data-index="${index}" class="glyf-item ${compound} ${modify} ${selected} ${editing}">'
+ '<i data-action="edit" class="ico i-edit" title="编辑"></i>'
+ '<i data-action="del" class="ico i-del" title="删除"></i>'
+ '<svg class="glyf" viewbox="0 0 ${unitsPerEm} ${unitsPerEm}">'
@@ -37,6 +37,7 @@ define(
index: opt.index,
compound: glyf.compound ? 'compound' : '',
selected: opt.selected ? 'selected' : '',
editing: opt.editing ? 'editing' : '',
modify: glyf.modify,
unitsPerEm: opt.unitsPerEm,
descent: opt.descent,
@@ -65,12 +66,14 @@ define(
var glyfStr = '';
var color = this.options.color;
var editing = this.getEditing();
ttf.glyf.forEach(function(glyf, index) {
glyfStr += getGlyfHTML(glyf, ttf, {
index: index,
unitsPerEm: unitsPerEm,
descent: descent,
selected: selectedHash[index],
editing: editing === index,
color: color
});
});
@@ -91,12 +94,14 @@ define(
var main = this.main;
var color = this.options.color;
var editing = this.getEditing();
indexList.forEach(function (index) {
var glyfStr = getGlyfHTML(ttf.glyf[index], ttf, {
index: index,
unitsPerEm: unitsPerEm,
descent: descent,
selected: selectedHash[index],
editing: editing === index,
color: color
});
var before = main.find('[data-index="'+ index +'"]');
@@ -110,12 +115,18 @@ define(
e.stopPropagation();
var target = $(e.target);
var action = target.attr('data-action');
var editing = this.getEditing();
var selectedGlyf = target.parent('[data-index]');
var selected = [+selectedGlyf.attr('data-index')];
if (action == 'del' && !window.confirm('确定删除字形么?')) {
return;
}
else if (action == 'edit') {
this.clearEditing();
selectedGlyf.addClass('editing');
}
var selected = [+target.parent('[data-index]').attr('data-index')];
this.fire(action, {
list: selected
});
@@ -177,9 +188,10 @@ define(
else if (27 === e.keyCode) {
e.stopPropagation();
me.clearSelected();
me.clearEditing();
me.fire('selection:change');
}
// 其他操作
// 其他操作, del, copy, cut
else if (keyMap[e.keyCode] && (e.keyCode == 46 || e.ctrlKey)) {
e.stopPropagation();
var selected = me.getSelected();
@@ -187,6 +199,11 @@ define(
// 取消选中的glyf
if (e.keyCode == 46 || e.keyCode == 88) {
me.clearSelected();
// 正在编辑的
var editing = selected.indexOf(me.getEditing());
if (editing >= 0) {
me.clearEditing();
}
me.fire('selection:change');
}
@@ -388,6 +405,25 @@ define(
return selected;
};
/**
* 获取正在编辑的元素
*
* @return {Array} 选中的indexList
*/
GLYFViewer.prototype.getEditing = function() {
var editing = this.main.find('.editing')[0];
return editing ? +editing.getAttribute('data-index') : -1;
};
/**
* 清除正在编辑的元素
*
* @return {Array} 选中的indexList
*/
GLYFViewer.prototype.clearEditing = function() {
this.main.find('.editing').removeClass('editing');
};
/**
* 获取设置项目
*/