modify default controller

add generate glyf name
add move left/right
This commit is contained in:
kekee000
2014-12-20 10:24:03 +08:00
parent febfd333e6
commit 6819f87544
9 changed files with 418 additions and 278 deletions

View File

@@ -41,12 +41,13 @@
.i-del,
.i-edit {
position: absolute;
right: 6px;
right: 4px;
padding: 0 2px;
display: none;
}
.i-edit {
right: 22px;
right: 20px;
}
}

View File

@@ -27,7 +27,8 @@
<span class="ico i-down"></span>
</button>
<ul class="dropdown-menu" role="menu">
<li data-action="import" title="导入ttf,woff,svg,eot格式字体文件"><a>从文件中导入</a></li>
<li data-action="import" title="导入svg格式字体文件"><a>导入svg</a></li>
<li data-action="import" title="导入ttf,woff,eot格式字体文件"><a>导入字体文件</a></li>
<li data-action="add-online"><a>在线字体</a></li>
<li data-action="add-url"><a>字体URL</a></li>
</ul>
@@ -54,6 +55,7 @@
<ul class="dropdown-menu" role="menu">
<li><a data-action="setting-name">字体信息</a></li>
<li><a data-action="setting-metrics">字体度量</a></li>
<li><a data-action="setting-glyf-name">生成字形名称</a></li>
<li><a data-action="setting-editor">编辑器</a></li>
</ul>
</div>

View File

@@ -148,10 +148,7 @@ define(
'add-new': function() {
if (program.ttfManager.get()) {
var selected = program.viewer.getSelected();
program.ttfManager.insertGlyf({
name: '',
unicode:[]
}, selected[0]);
program.ttfManager.insertGlyf({}, selected[0]);
}
},
@@ -222,6 +219,16 @@ define(
}
},
// 设置字型名称
'setting-glyf-name': function() {
var ttf = program.ttfManager.get();
if (ttf) {
if (window.confirm('生成的字形名称会覆盖原来的名称,确定生成?')) {
program.ttfManager.genGlyfName(program.viewer.getSelected());
}
}
},
// 设置
'setting-editor': function(e) {
var dlg = new setting.editor({

View File

@@ -15,7 +15,7 @@ define(
var setting = require('../widget/setting');
var actions = require('./actions');
var glyfAdjust = require('ttf/util/glyfAdjust');
var defaultProgram;
var currentProgram;
// 获取ttf的编辑选项
function getEditingOpt(ttf) {
@@ -36,18 +36,18 @@ define(
function showEditor(glyfIndex) {
// 重置editor缩放
var ttf = defaultProgram.ttfManager.get();
var ttf = currentProgram.ttfManager.get();
if (ttf) {
$('.main').addClass('editing');
$('.editor').addClass('editing');
defaultProgram.viewer.setMode('editor');
currentProgram.viewer.setMode('editor');
defaultProgram.viewer.blur();
defaultProgram.editor.show();
currentProgram.viewer.blur();
currentProgram.editor.show();
// 调整显示级别
defaultProgram.editor.setAxis(getEditingOpt(ttf));
currentProgram.editor.setAxis(getEditingOpt(ttf));
var font = ttf.glyf[glyfIndex];
if (font) {
@@ -55,10 +55,10 @@ define(
alert('暂不支持复合字形!');
}
else {
defaultProgram.editor.setFont(lang.clone(font));
currentProgram.editor.setFont(lang.clone(font));
}
}
defaultProgram.editor.focus();
currentProgram.editor.focus();
}
}
@@ -67,48 +67,43 @@ define(
$('.main').removeClass('editing');
$('.editor').removeClass('editing');
defaultProgram.editor && defaultProgram.editor.hide();
currentProgram.editor && currentProgram.editor.hide();
defaultProgram.viewer.clearEditing();
defaultProgram.viewer.setMode('list');
defaultProgram.viewer.focus();
currentProgram.viewer.clearEditing();
currentProgram.viewer.setMode('list');
currentProgram.viewer.focus();
}
// 显示ttf列表
function showTTF(ttf, page, selected) {
var glyfTotal = ttf.glyf.length;
var pageSize = defaultProgram.setting.get('editor').viewer.pageSize;
var pageSize = currentProgram.setting.get('editor').viewer.pageSize;
var totalPage = Math.ceil(glyfTotal / pageSize);
if (page > totalPage) {
page = totalPage;
}
defaultProgram.viewer.setPage(page - 1);
currentProgram.viewer.setPage(page - 1);
defaultProgram.viewer.show(ttf, selected || defaultProgram.viewer.getSelected());
defaultProgram.viewer.focus();
currentProgram.viewer.show(ttf, selected || currentProgram.viewer.getSelected());
currentProgram.viewer.focus();
// 设置翻页
if (glyfTotal > pageSize) {
defaultProgram.viewerPager.show(page, pageSize, glyfTotal);
currentProgram.viewerPager.show(page, pageSize, glyfTotal);
}
else {
defaultProgram.viewerPager.hide();
currentProgram.viewerPager.hide();
}
}
return {
/**
* 初始化控制器
* 绑定glyf列表
*
* @param {Object} program 项目组件
* @param {Object} program 全局对象
*/
init: function(program) {
defaultProgram = program;
function bindViewer(program) {
program.viewer.on('del', function(e) {
if (e.list) {
@@ -249,8 +244,31 @@ define(
dlg.show();
}).on('refresh', function() {
showTTF(program.ttfManager.get(), 1);
}).on('moveleft', function() {
var editingIndex = program.viewer.getEditing();
if (program.editor.isVisible() && editingIndex > 0) {
program.viewer.setEditing(--editingIndex);
showEditor(editingIndex);
}
}).on('moveright', function() {
var editingIndex = program.viewer.getEditing();
if (program.editor.isVisible() && editingIndex < program.ttfManager.get().glyf.length - 1) {
program.viewer.setEditing(++editingIndex);
showEditor(editingIndex);
}
});
program.viewerPager.on('change', function(e) {
showTTF(program.ttfManager.get(), e.page);
});
}
/**
* 绑定项目列表
*
* @param {Object} program 全局对象
*/
function bindProject(program) {
program.projectViewer.on('open', function(e) {
var imported = program.project.get(e.projectId);
if (imported) {
@@ -275,16 +293,19 @@ define(
}
program.viewer.focus();
});
}
program.viewerPager.on('change', function(e) {
showTTF(program.ttfManager.get(), e.page);
});
/**
* 绑定ttf管理器
*
* @param {Object} program 项目对象
*/
function bindttfManager(program) {
program.ttfManager.on('change', function(e) {
// 保存正在编辑的字形
var editing = program.viewer.getEditing();
if (e.changeType === 'update' && program.editor.isEditing() && editing !== -1) {
program.viewer.refresh(e.ttf, [editing]);
var editingIndex = program.viewer.getEditing();
if (e.changeType === 'update' && program.editor.isEditing() && editingIndex !== -1) {
program.viewer.refresh(e.ttf, [editingIndex]);
}
else {
showTTF(e.ttf, program.viewer.getPage() + 1);
@@ -299,9 +320,15 @@ define(
}
showTTF(e.ttf, 1, []);
});
}
/**
* 绑定项目对象
*
* @param {Object} program 项目对象
*/
function bindProgram(program) {
program.on('save', function(e) {
// 保存项目
@@ -310,9 +337,9 @@ define(
if (program.editor.isEditing()) {
// 如果是正在编辑的
var editing = program.viewer.getEditing();
if (editing !== -1) {
program.ttfManager.replaceGlyf(program.editor.getFont(), editing);
var editingIndex = program.viewer.getEditing();
if (editingIndex !== -1) {
program.ttfManager.replaceGlyf(program.editor.getFont(), editingIndex);
}
// 否则新建font
else {
@@ -345,6 +372,26 @@ define(
}
}
});
}
return {
/**
* 初始化控制器
*
* @param {Object} program 项目组件
*/
init: function(program) {
// 设置当前的项目对象为指定的项目对象
currentProgram = program;
bindViewer(program);
bindttfManager(program);
bindProject(program);
bindProgram(program);
$('.close-editor').click(function(e) {
hideEditor();

View File

@@ -136,9 +136,7 @@ define(
}
}
else if (action == 'edit') {
this.clearEditing();
this.setEditing(selected);
selectedGlyf.addClass('editing');
}
this.fire(action, {
@@ -205,6 +203,14 @@ define(
me.clearEditing();
me.fire('selection:change');
}
// 左移
else if (37 === e.keyCode) {
me.fire('moveleft');
}
// 右移
else if (39 === e.keyCode) {
me.fire('moveright');
}
// del, cut
else if (46 === e.keyCode || (88 === e.keyCode && e.ctrlKey)) {
e.stopPropagation();
@@ -499,7 +505,11 @@ define(
* @param {number} editingIndex 设置对象
*/
GLYFViewer.prototype.setEditing = function(editingIndex) {
this.clearEditing();
this.editingIndex = editingIndex >= 0 ? editingIndex : -1;
if (editingIndex !== -1) {
this.main.find('[data-index="'+ editingIndex +'"]').addClass('editing');
}
};
/**

View File

@@ -73,7 +73,7 @@ define(
me.fire('save');
}
// 粘贴
else if ((e.keyCode == 86 && e.ctrlKey)) {
else if ((86 === e.keyCode && e.ctrlKey)) {
e.preventDefault();
e.stopPropagation();
me.fire('paste');

View File

@@ -114,9 +114,10 @@ define(
};
/**
* 添加glyf
* 在指定索引前面添加新的glyf
*
* @param {Object} glyf glyf对象
* @param {Object} glyf 对象
* @param {number} beforeIndex 索引号
*
* @return {this}
*/
@@ -124,6 +125,7 @@ define(
var glyfList = this.ttf.getGlyf();
var unicode = 0x20;
if (!glyf.unicode || !glyf.unicode.length) {
// 找到unicode的最大值
for (var i = glyfList.length - 1; i > 0 ; i--) {
var g = glyfList[i];
@@ -134,8 +136,18 @@ define(
}
unicode++;
if (unicode === 0xFFFF) {
unicode++;
}
glyf.unicode = [unicode];
glyf.name = string.getUnicodeName(unicode);
}
if (!glyf.name) {
glyf.name = string.getUnicodeName(glyf.unicode[0]);
}
glyf.modify = 'new';
this.ttf.insertGlyf(glyf, beforeIndex);
@@ -204,6 +216,25 @@ define(
return this;
};
/**
* 生成字形名称
*
* @param {Array} indexList 索引列表
* @return {this}
*/
Manager.prototype.genGlyfName = function(indexList) {
var list = this.ttf.genGlyfName(indexList);
if (list.length) {
list.forEach(function(g) {
g.modify = 'edit';
});
this.fireChange(true);
}
return this;
};
/**
* 添加并体替换指定的glyf
*

View File

@@ -275,7 +275,8 @@ define(
"61441": 192,
"61442": 193,
"64257": 192,
"64258": 193
"64258": 193,
'65535': 0 // 0xFFFF指向.notdef
};
return unicodeName;

View File

@@ -196,7 +196,8 @@ define(
* @return {Array} 改变的glyf
*/
TTF.prototype.setUnicode = function(unicode, indexList) {
var glyf = this.ttf.glyf, list;
var glyf = this.ttf.glyf;
var list = [];
if (indexList && indexList.length) {
var first = indexList.indexOf(0);
if (first >= 0) {
@@ -238,6 +239,45 @@ define(
return list;
};
/**
* 生成字形名称
*
* @param {Array} indexList 索引列表
* @return {Array} 改变的glyf
*/
TTF.prototype.genGlyfName = function(indexList) {
var glyf = this.ttf.glyf;
var list = [];
if (indexList && indexList.length) {
list = indexList.map(function(item) {
return glyf[item];
});
}
else {
list = glyf;
}
if (list.length) {
var first = this.ttf.glyf[0];
var unicode;
list.forEach(function(g) {
if (g === first) {
g.name = '.notdef';
}
else {
if (g.unicode && g.unicode.length) {
g.name = string.getUnicodeName(g.unicode[0]);
}
else {
g.name = '.notdef';
}
}
});
}
return list;
};
/**
* 添加并体替换指定的glyf
*
@@ -246,7 +286,8 @@ define(
* @return {Array} 改变的glyf
*/
TTF.prototype.appendGlyf = function(glyfList, indexList) {
var glyf = this.ttf.glyf, result = glyfList.slice(0);
var glyf = this.ttf.glyf;
var result = glyfList.slice(0);
if (indexList && indexList.length) {
var l = Math.min(glyfList.length, indexList.length);