拆分组件

This commit is contained in:
mkwiser
2014-10-10 22:39:49 +08:00
parent b408e169d2
commit 3c0dbbec71
6 changed files with 253 additions and 214 deletions

View File

@@ -47,7 +47,9 @@ define(
function showGlyf(charcode) {
var glyf = lang.clone(ttf.getCodeGlyf(charcode));
if (glyf.compound) {
return;
}
var canvas = $('#glyf-canvas').get(0);
var ctx = canvas.getContext('2d');
@@ -101,7 +103,7 @@ define(
upFile.addEventListener('change', onUpFileChange);
ajaxBinaryFile({
url: '../font/baiduHealth.ttf',
url: '../test/baiduHealth.ttf',
onSuccess: function(binaryData) {
setFont(binaryData);

View File

@@ -49,6 +49,7 @@ define(
}
function showGlyf(charcode) {
var tpl = ''
+ '<svg class="glyf">'
+ ' <g>'
@@ -58,6 +59,10 @@ define(
var svg = $(tpl);
var glyf = lang.clone(ttf.getCodeGlyf(charcode));
if (glyf.compound) {
return;
}
// 调整大小
var width = glyf.xMax;
var height = glyf.yMax - glyf.yMin;
@@ -113,7 +118,7 @@ define(
upFile.addEventListener('change', onUpFileChange);
ajaxBinaryFile({
url: '../font/baiduHealth.ttf',
url: '../test/baiduHealth.ttf',
onSuccess: function(binaryData) {
setFont(binaryData);

View File

@@ -17,7 +17,7 @@ define(
function write() {
ajaxBinaryFile({
url: '../font/iconfont.woff',
url: '../test/iconfont.woff',
onSuccess: function(buffer) {
var ttfBuffer = woff2ttf(buffer, {

View File

@@ -10,220 +10,18 @@ define(
function(require) {
var GLYFViewer = require('../widget/glyfviewer');
var loader = require('../widget/loader');
var exporter = require('../widget/exporter');
var project = require('../widget/project');
var ProjectViewer = require('../widget/projectviewer');
var TTFManager = require('../widget/ttfmanager');
var program = require('../widget/program');
var controller = require('../widget/controller/default');
var ajaxBinaryFile = require('common/ajaxBinaryFile');
var string = require('common/string');
var setting = {
'unicode': require('../dialog/setting-unicode'),
'name': require('../dialog/setting-name'),
//'adjust-pos': require('../dialog/setting-adjust-pos'),
//'adjust-glyf': require('../dialog/setting-adjust-glyf'),
'metrics': require('../dialog/setting-metrics'),
'online': require('../dialog/font-online')
}
var actions = {
// 新建
'new': function() {
if (program.ttfmanager.isChanged() && !window.confirm('是否放弃保存当前项目?')) {
return;
}
$.getJSON('./src/fonteditor/data/empty.json', function(imported) {
program.ttfmanager.set(imported);
program.data.projectName = null;
});
},
// 打开
'open': function() {
$('#font-import').click();
},
// 导入
'import': function() {
$('#font-import').click();
},
// 导出
'export': function() {
},
// 导出文件
'export-file': function(e) {
if (program.ttfmanager.get()) {
var target = $(e.target);
exporter.export(program.ttfmanager.get(), {
type: target.attr('data-type'),
target: target
});
}
},
// 保存项目
'save': function() {
if (program.ttfmanager.get()) {
var name = '';
if(name = window.prompt('请输入项目名称:')) {
name = string.encodeHTML(name);
var list = project.add(name, program.ttfmanager.get());
program.projectViewer.show(list);
program.data.projectName = name;
program.ttfmanager.setState('new');
}
}
},
// 添加新字形
'add-new': function() {
program.ttfmanager.addGlyf({
name: '',
unicode:[]
});
},
// 添加在线字形
'add-online': function() {
var dlg = new setting.online({
onChange: function(url) {
// 此处延迟处理
setTimeout(function(){
program.loading.show('正在加载..', 1000);
ajaxBinaryFile({
url: url,
onSuccess: function(buffer) {
loader.load(buffer, {
type: 'ttf',
success: function(imported) {
program.loading.hide();
if (program.ttfmanager.get()) {
program.ttfmanager.merge(imported, {
scale: true
});
}
else {
program.ttfmanager.set(imported);
program.data.projectName = null;
}
}
});
},
onError: function() {
alert('加载文件错误!');
}
});
}, 20);
}
});
dlg.show();
},
// 设置unicode
'setting-unicode': function() {
var dlg = new setting.unicode({
onChange: function(unicode) {
// 此处延迟处理
setTimeout(function(){
if (program.ttfmanager.get()) {
var glyfList = program.viewer.getSelected();
program.ttfmanager.setUnicode(unicode, glyfList);
}
}, 20);
}
});
dlg.show();
},
// 调整字形位置
'setting-adjust-pos': function() {
var ttf = program.ttfmanager.get();
if (ttf) {
var dlg = new setting['adjust-pos']({
onChange: function(setting) {
setTimeout(function() {
program.ttfmanager.adjustGlyfPos(setting, selected);
}, 20);
}
});
// 如果仅选择一个字形,则填充现有值
var selected = program.viewer.getSelected();
if (selected.length === 1) {
var glyf = program.ttfmanager.getGlyf(selected)[0];
dlg.show({
leftSideBearing: glyf.leftSideBearing || '',
rightSideBearing: glyf.advanceWidth - glyf.xMax || ''
});
}
else {
dlg.show();
}
}
},
// 调整字形
'setting-adjust-glyf': function() {
var ttf = program.ttfmanager.get();
if (ttf) {
var dlg = new setting['adjust-glyf']({
onChange: function(setting) {
setTimeout(function() {
program.ttfmanager.adjustGlyf(setting, program.viewer.getSelected());
}, 20);
}
});
dlg.show();
}
},
// 设置字体名称
'setting-name': function() {
var ttf = program.ttfmanager.get();
if (ttf) {
var dlg = new setting.name({
onChange: function(setting) {
program.ttfmanager.setInfo(setting);
}
});
dlg.show($.extend({}, ttf.head, ttf.name));
}
},
// 调整规格
'setting-metrics': function() {
var ttf = program.ttfmanager.get();
if (ttf) {
var dlg = new setting['metrics']({
onChange: function(setting) {
program.ttfmanager.setMetrics(setting);
}
});
dlg.show($.extend({}, ttf['OS/2'], ttf.hhea, ttf.post));
}
}
};
var actions = require('../widget/actions');
// 打开文件
function onUpFile(e) {
var file = e.target.files[0];
if (program.action == 'open' && file.name.match(/(\.ttf|\.woff)$/i)) {
loader.load(file, {
if (program.data.action == 'open' && file.name.match(/(\.ttf|\.woff)$/i)) {
program.loader.load(file, {
type: file.name.slice(file.name.lastIndexOf('.') + 1).toLowerCase(),
success: function(imported) {
program.ttfmanager.set(imported);
@@ -231,9 +29,9 @@ define(
}
});
}
else if (program.action == 'import' && file.name.match(/(\.ttf|\.woff|\.svg)$/i)) {
else if (program.data.action == 'import' && file.name.match(/(\.ttf|\.woff|\.svg)$/i)) {
if (program.ttfmanager.get()) {
loader.load(file, {
program.loader.load(file, {
type: file.name.slice(file.name.lastIndexOf('.') + 1).toLowerCase(),
success: function(imported) {
if (imported.glyf.length) {
@@ -255,7 +53,7 @@ define(
$('.navbar').delegate('[data-action]', 'click', function(e) {
var action = $(this).attr('data-action');
if (actions[action]) {
program.action = action;
program.data.action = action;
actions[action].call(this, e);
}
});
@@ -279,16 +77,21 @@ define(
program.viewer = new GLYFViewer($('#glyf-list'));
// 项目管理
program.project = project;
program.project = require('../widget/project');
program.projectViewer = new ProjectViewer($('#project-list'));
// ttf管理
program.ttfmanager = new TTFManager();
// 导入导出器
program.loader = require('../widget/loader');
program.exporter = require('../widget/exporter');
controller.init(program);
// 加载项目
program.projectViewer.show(project.items());
program.projectViewer.show(program.project.items());
}
};

View File

@@ -0,0 +1,206 @@
/**
* @file actions.js
* @author mengke01
* @date
* @description
* 命令接口
*/
define(
function(require) {
var setting = require('../widget/setting');
var program = require('../widget/program');
var ajaxBinaryFile = require('common/ajaxBinaryFile');
var string = require('common/string');
var actions = {
// 新建
'new': function() {
if (program.ttfmanager.isChanged() && !window.confirm('是否放弃保存当前项目?')) {
return;
}
$.getJSON('./src/fonteditor/data/empty.json', function(imported) {
program.ttfmanager.set(imported);
program.data.projectName = null;
});
},
// 打开
'open': function() {
$('#font-import').click();
},
// 导入
'import': function() {
$('#font-import').click();
},
// 导出
'export': function() {
},
// 导出文件
'export-file': function(e) {
if (program.ttfmanager.get()) {
var target = $(e.target);
program.exporter.export(program.ttfmanager.get(), {
type: target.attr('data-type'),
target: target
});
}
},
// 保存项目
'save': function() {
if (program.ttfmanager.get()) {
var name = '';
if(name = window.prompt('请输入项目名称:')) {
name = string.encodeHTML(name);
var list = program.project.add(name, program.ttfmanager.get());
program.projectViewer.show(list);
program.data.projectName = name;
program.ttfmanager.setState('new');
}
}
},
// 添加新字形
'add-new': function() {
program.ttfmanager.addGlyf({
name: '',
unicode:[]
});
},
// 添加在线字形
'add-online': function() {
var dlg = new setting.online({
onChange: function(url) {
// 此处延迟处理
setTimeout(function(){
program.loading.show('正在加载..', 1000);
ajaxBinaryFile({
url: url,
onSuccess: function(buffer) {
program.loader.load(buffer, {
type: 'ttf',
success: function(imported) {
program.loading.hide();
if (program.ttfmanager.get()) {
program.ttfmanager.merge(imported, {
scale: true
});
}
else {
program.ttfmanager.set(imported);
program.data.projectName = null;
}
}
});
},
onError: function() {
alert('加载文件错误!');
}
});
}, 20);
}
});
dlg.show();
},
// 设置unicode
'setting-unicode': function() {
var dlg = new setting.unicode({
onChange: function(unicode) {
// 此处延迟处理
setTimeout(function(){
if (program.ttfmanager.get()) {
var glyfList = program.viewer.getSelected();
program.ttfmanager.setUnicode(unicode, glyfList);
}
}, 20);
}
});
dlg.show();
},
// 调整字形位置
'setting-adjust-pos': function() {
var ttf = program.ttfmanager.get();
if (ttf) {
var dlg = new setting['adjust-pos']({
onChange: function(setting) {
setTimeout(function() {
program.ttfmanager.adjustGlyfPos(setting, selected);
}, 20);
}
});
// 如果仅选择一个字形,则填充现有值
var selected = program.viewer.getSelected();
if (selected.length === 1) {
var glyf = program.ttfmanager.getGlyf(selected)[0];
dlg.show({
leftSideBearing: glyf.leftSideBearing || '',
rightSideBearing: glyf.advanceWidth - glyf.xMax || ''
});
}
else {
dlg.show();
}
}
},
// 调整字形
'setting-adjust-glyf': function() {
var ttf = program.ttfmanager.get();
if (ttf) {
var dlg = new setting['adjust-glyf']({
onChange: function(setting) {
setTimeout(function() {
program.ttfmanager.adjustGlyf(setting, program.viewer.getSelected());
}, 20);
}
});
dlg.show();
}
},
// 设置字体名称
'setting-name': function() {
var ttf = program.ttfmanager.get();
if (ttf) {
var dlg = new setting.name({
onChange: function(setting) {
program.ttfmanager.setInfo(setting);
}
});
dlg.show($.extend({}, ttf.head, ttf.name));
}
},
// 调整规格
'setting-metrics': function() {
var ttf = program.ttfmanager.get();
if (ttf) {
var dlg = new setting['metrics']({
onChange: function(setting) {
program.ttfmanager.setMetrics(setting);
}
});
dlg.show($.extend({}, ttf['OS/2'], ttf.hhea, ttf.post));
}
}
};
return actions;
}
);

View File

@@ -0,0 +1,23 @@
/**
* @file setting.js
* @author mengke01
* @date
* @description
* 设置项目
*/
define(
function(require) {
var setting = {
'unicode': require('../dialog/setting-unicode'),
'name': require('../dialog/setting-name'),
'adjust-pos': require('../dialog/setting-adjust-pos'),
'adjust-glyf': require('../dialog/setting-adjust-glyf'),
'metrics': require('../dialog/setting-metrics'),
'online': require('../dialog/font-online')
}
return setting;
}
);