diff --git a/demo/editortest.html b/demo/editortest.html
index 6d24e39..d58bd49 100644
--- a/demo/editortest.html
+++ b/demo/editortest.html
@@ -26,6 +26,14 @@
+
+
+
+
+
diff --git a/demo/js/editortest.js b/demo/js/editortest.js
index 7b225a4..2dff8a9 100644
--- a/demo/js/editortest.js
+++ b/demo/js/editortest.js
@@ -35,10 +35,18 @@ define(
currentEditor = editor.create($('#render-view').get(0));
+ currentEditor.on('save', function(e) {
+ var font = e.font;
+ console.log(font);
+ ttfObject.glyf[font.index] = font;
+ });
+
$('#glyf-list').delegate('[data-index]', 'click', function(e) {
e.preventDefault();
var index = +$(this).attr('data-index');
- currentEditor.setFont(lang.clone(ttfObject.glyf[index]));
+ var font = lang.clone(ttfObject.glyf[index]);
+ font.index = index;
+ currentEditor.setFont(font);
});
$('#editor-unitsperem').on('change', function(){
@@ -46,7 +54,25 @@ define(
currentEditor.setAxis({
unitsPerEm: unitsPerEm
});
- })
+ });
+
+ $('#editor-bearing').on('change', function(){
+ var opt = $(this).val();
+
+ var setting = {
+ 1 : {
+ leftSideBearing: 10,
+ rightSideBearing: 10
+ },
+ 2: {
+ leftSideBearing: 100,
+ rightSideBearing: 100
+ }
+ };
+
+
+ currentEditor.adjustFont(setting[opt]);
+ });
}
};
diff --git a/src/editor/command/support.js b/src/editor/command/support.js
index 6bd2a0b..2664d8c 100644
--- a/src/editor/command/support.js
+++ b/src/editor/command/support.js
@@ -20,7 +20,8 @@ define(
rescale: function() {
this.coverLayer.clearShapes();
var size = this.render.getSize();
- this.render.scaleTo(1, {
+ var scale = 512 / this.options.unitsPerEm;
+ this.render.scaleTo(scale, {
x: size.width / 2,
y: size.height / 2
});
diff --git a/src/editor/controller/initFont.js b/src/editor/controller/initFont.js
index 2072a6a..9f01add 100644
--- a/src/editor/controller/initFont.js
+++ b/src/editor/controller/initFont.js
@@ -9,9 +9,10 @@
define(
function(require) {
-
var lang = require('common/lang');
var pathAdjust = require('graphics/pathAdjust');
+ var pathCeil = require('graphics/pathCeil');
+ var computeBoundingBox = require('graphics/computeBoundingBox');
var guid = require('render/util/guid');
/**
@@ -111,8 +112,97 @@ define(
return shapes;
}
+ /**
+ * 获取编辑后的font
+ *
+ * @return {Object} glyfObject
+ */
+ function getFont() {
+ var font = lang.clone(this.font || {});
+ font.rightSideBearing = font.rightSideBearing || 0;
+ font.unicode = font.unicode || [];
+ font.name = font.name || '';
+
+ var shapes = this.getShapes();
+ shapes.forEach(function(g) {
+ pathCeil(g);
+ });
+
+ // 设置边界
+ var box = computeBoundingBox.computePathBox.apply(null, shapes.map(function(shape) {
+ return shape.points;
+ }));
+
+ font.xMin = box.x;
+ font.yMin = box.y;
+ font.xMax = box.x + box.width;
+ font.yMax = box.y + box.height;
+ font.leftSideBearing = font.xMin;
+ font.advanceWidth = font.xMax + font.rightSideBearing;
+ delete font.advanceWidth;
+
+ font.contours = shapes;
+
+ return font;
+ }
+
+ /**
+ * 调整font信息
+ *
+ * @param {Object} options 参数选项
+ * @param {Object} options.leftSideBearing 左支撑
+ * @param {Object} options.rightSideBearing 右支撑
+ * @param {Object} options.unicode unicode
+ * @param {Object} options.name 名字
+ * @return {this}
+ */
+ function adjustFont(options) {
+ if (!this.font) {
+ return;
+ }
+
+ var scale = this.render.camera.scale;
+ var shapes = this.fontLayer.shapes;
+
+ var origin = this.render.getLayer('axis').shapes[0];
+ // 计算边界
+ var box = computeBoundingBox.computePathBox.apply(null, shapes.map(function(shape) {
+ return shape.points;
+ }));
+
+ var offset = 0;
+ var xMin = box.x - origin.x;
+
+ if (undefined !== options.leftSideBearing && Math.abs(options.leftSideBearing - xMin / scale) > 0.01) {
+ offset = options.leftSideBearing * scale - xMin;
+ shapes.forEach(function(g) {
+ pathAdjust(g.points, 1, 1, offset, 0);
+ });
+ this.fontLayer.refresh();
+ this.fire('change');
+ }
+
+ if (undefined !== options.rightSideBearing) {
+ this.rightSideBearing.p0.x = box.x + box.width + offset + options.rightSideBearing * scale;
+ this.axisLayer.refresh();
+ }
+
+ if (undefined !== options.unicode) {
+ this.font.unicode = options.unicode;
+ }
+
+ if (undefined !== options.name) {
+ this.font.name = options.name;
+ }
+
+ return this;
+ }
+
return function() {
this.setFont = setFont;
+ this.getFont = getFont;
+ this.adjustFont = adjustFont;
+
this.setShapes = setShapes;
this.getShapes = getShapes;
};
diff --git a/src/editor/controller/initRender.js b/src/editor/controller/initRender.js
index 9fd3c07..d3365ef 100644
--- a/src/editor/controller/initRender.js
+++ b/src/editor/controller/initRender.js
@@ -195,8 +195,14 @@ define(
return;
}
+ // 保存
+ if (e.keyCode == 83 && e.ctrlKey) {
+ me.fire('save', {
+ font: me.getFont()
+ });
+ }
// 放大
- if (e.keyCode == 187 && (e.ctrlKey || e.altKey)) {
+ else if (e.keyCode == 187 && (e.ctrlKey || e.altKey)) {
e.originEvent.stopPropagation();
e.originEvent.preventDefault();
var size = render.getSize();
diff --git a/src/graphics/computeBoundingBox.js b/src/graphics/computeBoundingBox.js
index a1dd900..a697b94 100644
--- a/src/graphics/computeBoundingBox.js
+++ b/src/graphics/computeBoundingBox.js
@@ -169,7 +169,7 @@ define(
}
else {
for (var i = 0, l = arguments.length; i < l; i++) {
- points = points.concat(arguments[i]);
+ Array.prototype.splice.apply(points, [points.length, 0].concat(arguments[i]));
}
}
return computeBoundingBox(points);