Skip to content

P
psd-parse-web
Commit 81d83998 authored by 任建锋's avatar 任建锋
Browse files
Options

--

parent 53d8e362
Expand all Show whitespace changes
Inline Side-by-side
Showing with 157 additions and 87 deletions
dist/index.es.js
View file @ 81d83998
......@@ -86,7 +86,7 @@ async function execute(psdFile, options) {
let viewRoot = {
name: path.basename(psdFile.name, '.psd'),
type: 'node',
componentName : 'Div',
uuid: generateUUID(),
};
......@@ -99,10 +99,16 @@ async function execute(psdFile, options) {
await walkNode(tree, async function (node, parent) {
let {name} = node;
const {x, y, width, height, alpha, visible, origin: {layer, layer: {typeTool, solidColor}}} = node;
const {x, y, width, height, opacity, display, origin: {layer, layer: {typeTool, solidColor}}} = node;
//console.log('walk node:', name);
let properties = {
width, height, alpha, visible,
style:{
width, height, opacity,display ,
},
attrs:{
},
className:""
};
const isSecondLayer = !parent.origin.parent;
......@@ -171,7 +177,7 @@ async function execute(psdFile, options) {
value = 0;
}
}
properties[field] = value;
properties.style[field] = value;
}
}
}
......@@ -187,24 +193,33 @@ async function execute(psdFile, options) {
};
let dealLater = true;
if (x !== 0) {
properties.x = x - (isSecondLayer ? offset.x : 0);
properties.style.left = x - (isSecondLayer ? offset.x : 0);
}
if (y !== 0) {
properties.y = y - (isSecondLayer ? offset.y : 0);
properties.style.top = y - (isSecondLayer ? offset.y : 0);
}
properties.style.position="absolute";
viewNode.rect={
x: properties.style.left?properties.style.left:0,
y: properties.style.top?properties.style.top:0,
width: properties.style.width,
height: properties.style.height
};
if (typeTool) {
let fontInfo = typeTool();
properties.text = fontInfo.textValue;
properties.attrs.text = fontInfo.textValue;
const sizes = fontInfo.sizes();
const colors = fontInfo.colors();
properties.size = sizes ? sizes[0] || 20 : 20;
properties.style.fontSize = sizes ? sizes[0] || 20 : 20;
let [r, g, b, a] = colors[0];
properties.fillColor = `rgba(${r}, ${g}, ${b}, ${a / 255})`;
viewNode.type = 'label';
console.log("color",[r, g, b, a]);
properties.style.color = `rgba(${r}, ${g}, ${b}, ${a / 255})`;
viewNode.componentName = 'Label';
dealLater = false;
} else if (solidColor && layer.vectorMask) {
let paths = layer.vectorMask().paths;
if (paths[2].numPoints === 4) {
let isRect = true;
......@@ -215,9 +230,9 @@ async function execute(psdFile, options) {
}
}
if (isRect) {
viewNode.type = 'rect';
viewNode.componentName = 'Div';
const {r, g, b} = solidColor();
properties.fillColor = `rgba(${r}, ${g}, ${b}, 1)`;
properties.style.backgroundColor = `rgba(${r}, ${g}, ${b}, 1)`;
dealLater = false;
}
}
......@@ -225,9 +240,9 @@ async function execute(psdFile, options) {
if (dealLater) {
if (node.hasOwnProperty('children')) {
viewNode.type = 'node';
viewNode.componentName = 'Div';
} else {
viewNode.type = 'image';
viewNode.componentName = 'Image';
let uuid = generateUUID();
const ext = '.png';
......@@ -257,7 +272,7 @@ async function execute(psdFile, options) {
});
}
properties.source = 'asset://' + uuid;
properties.attrs.source = 'asset://' + uuid;
}
}
}
......@@ -270,10 +285,13 @@ async function execute(psdFile, options) {
node.view = viewNode;
});
console.log(psdFile);
let data = {
view: viewRoot,
pluginVersion:"0.0.1",
reference:"psd",
fileName:psdFile.name,
assets,
view: viewRoot,
};
let dataString = JSON.stringify(data);
......
dist/index.es.js.map
View file @ 81d83998
This diff is collapsed.
dist/index.js
View file @ 81d83998
......@@ -92,7 +92,7 @@ async function execute(psdFile, options) {
let viewRoot = {
name: path.basename(psdFile.name, '.psd'),
type: 'node',
componentName : 'Div',
uuid: generateUUID(),
};
......@@ -105,10 +105,16 @@ async function execute(psdFile, options) {
await walkNode(tree, async function (node, parent) {
let {name} = node;
const {x, y, width, height, alpha, visible, origin: {layer, layer: {typeTool, solidColor}}} = node;
const {x, y, width, height, opacity, display, origin: {layer, layer: {typeTool, solidColor}}} = node;
//console.log('walk node:', name);
let properties = {
width, height, alpha, visible,
style:{
width, height, opacity,display ,
},
attrs:{
},
className:""
};
const isSecondLayer = !parent.origin.parent;
......@@ -177,7 +183,7 @@ async function execute(psdFile, options) {
value = 0;
}
}
properties[field] = value;
properties.style[field] = value;
}
}
}
......@@ -193,24 +199,33 @@ async function execute(psdFile, options) {
};
let dealLater = true;
if (x !== 0) {
properties.x = x - (isSecondLayer ? offset.x : 0);
properties.style.left = x - (isSecondLayer ? offset.x : 0);
}
if (y !== 0) {
properties.y = y - (isSecondLayer ? offset.y : 0);
properties.style.top = y - (isSecondLayer ? offset.y : 0);
}
properties.style.position="absolute";
viewNode.rect={
x: properties.style.left?properties.style.left:0,
y: properties.style.top?properties.style.top:0,
width: properties.style.width,
height: properties.style.height
};
if (typeTool) {
let fontInfo = typeTool();
properties.text = fontInfo.textValue;
properties.attrs.text = fontInfo.textValue;
const sizes = fontInfo.sizes();
const colors = fontInfo.colors();
properties.size = sizes ? sizes[0] || 20 : 20;
properties.style.fontSize = sizes ? sizes[0] || 20 : 20;
let [r, g, b, a] = colors[0];
properties.fillColor = `rgba(${r}, ${g}, ${b}, ${a / 255})`;
viewNode.type = 'label';
console.log("color",[r, g, b, a]);
properties.style.color = `rgba(${r}, ${g}, ${b}, ${a / 255})`;
viewNode.componentName = 'Label';
dealLater = false;
} else if (solidColor && layer.vectorMask) {
let paths = layer.vectorMask().paths;
if (paths[2].numPoints === 4) {
let isRect = true;
......@@ -221,9 +236,9 @@ async function execute(psdFile, options) {
}
}
if (isRect) {
viewNode.type = 'rect';
viewNode.componentName = 'Div';
const {r, g, b} = solidColor();
properties.fillColor = `rgba(${r}, ${g}, ${b}, 1)`;
properties.style.backgroundColor = `rgba(${r}, ${g}, ${b}, 1)`;
dealLater = false;
}
}
......@@ -231,9 +246,9 @@ async function execute(psdFile, options) {
if (dealLater) {
if (node.hasOwnProperty('children')) {
viewNode.type = 'node';
viewNode.componentName = 'Div';
} else {
viewNode.type = 'image';
viewNode.componentName = 'Image';
let uuid = generateUUID();
const ext = '.png';
......@@ -263,7 +278,7 @@ async function execute(psdFile, options) {
});
}
properties.source = 'asset://' + uuid;
properties.attrs.source = 'asset://' + uuid;
}
}
}
......@@ -276,10 +291,13 @@ async function execute(psdFile, options) {
node.view = viewNode;
});
console.log(psdFile);
let data = {
view: viewRoot,
pluginVersion:"0.0.1",
reference:"psd",
fileName:psdFile.name,
assets,
view: viewRoot,
};
let dataString = JSON.stringify(data);
......
dist/index.js.map
View file @ 81d83998
This diff is collapsed.
dist/index.umd.js
View file @ 81d83998
......@@ -2,13 +2,13 @@
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('path'), require('color'), require('uuid/v4'), require('object-hash'), require('zlib')) :
typeof define === 'function' && define.amd ? define(['exports', 'path', 'color', 'uuid/v4', 'object-hash', 'zlib'], factory) :
(global = global || self, factory(global['psd-parse-web'] = {}, global.path, global.color, global.generateUUID, global.hash, global.zlib));
}(this, function (exports, path, color, generateUUID, hash, zlib) { 'use strict';
}(this, (function (exports, path, color, generateUUID, hash, zlib) { 'use strict';
path = path && path.hasOwnProperty('default') ? path['default'] : path;
color = color && color.hasOwnProperty('default') ? color['default'] : color;
generateUUID = generateUUID && generateUUID.hasOwnProperty('default') ? generateUUID['default'] : generateUUID;
hash = hash && hash.hasOwnProperty('default') ? hash['default'] : hash;
zlib = zlib && zlib.hasOwnProperty('default') ? zlib['default'] : zlib;
path = path && Object.prototype.hasOwnProperty.call(path, 'default') ? path['default'] : path;
color = color && Object.prototype.hasOwnProperty.call(color, 'default') ? color['default'] : color;
generateUUID = generateUUID && Object.prototype.hasOwnProperty.call(generateUUID, 'default') ? generateUUID['default'] : generateUUID;
hash = hash && Object.prototype.hasOwnProperty.call(hash, 'default') ? hash['default'] : hash;
zlib = zlib && Object.prototype.hasOwnProperty.call(zlib, 'default') ? zlib['default'] : zlib;
/**
* Created by rockyl on 2019-08-09.
......@@ -92,7 +92,7 @@
let viewRoot = {
name: path.basename(psdFile.name, '.psd'),
type: 'node',
componentName : 'Div',
uuid: generateUUID(),
};
......@@ -105,10 +105,16 @@
await walkNode(tree, async function (node, parent) {
let {name} = node;
const {x, y, width, height, alpha, visible, origin: {layer, layer: {typeTool, solidColor}}} = node;
const {x, y, width, height, opacity, display, origin: {layer, layer: {typeTool, solidColor}}} = node;
//console.log('walk node:', name);
let properties = {
width, height, alpha, visible,
style:{
width, height, opacity,display ,
},
attrs:{
},
className:""
};
const isSecondLayer = !parent.origin.parent;
......@@ -177,7 +183,7 @@
value = 0;
}
}
properties[field] = value;
properties.style[field] = value;
}
}
}
......@@ -193,24 +199,33 @@
};
let dealLater = true;
if (x !== 0) {
properties.x = x - (isSecondLayer ? offset.x : 0);
properties.style.left = x - (isSecondLayer ? offset.x : 0);
}
if (y !== 0) {
properties.y = y - (isSecondLayer ? offset.y : 0);
properties.style.top = y - (isSecondLayer ? offset.y : 0);
}
properties.style.position="absolute";
viewNode.rect={
x: properties.style.left?properties.style.left:0,
y: properties.style.top?properties.style.top:0,
width: properties.style.width,
height: properties.style.height
};
if (typeTool) {
let fontInfo = typeTool();
properties.text = fontInfo.textValue;
properties.attrs.text = fontInfo.textValue;
const sizes = fontInfo.sizes();
const colors = fontInfo.colors();
properties.size = sizes ? sizes[0] || 20 : 20;
properties.style.fontSize = sizes ? sizes[0] || 20 : 20;
let [r, g, b, a] = colors[0];
properties.fillColor = `rgba(${r}, ${g}, ${b}, ${a / 255})`;
viewNode.type = 'label';
console.log("color",[r, g, b, a]);
properties.style.color = `rgba(${r}, ${g}, ${b}, ${a / 255})`;
viewNode.componentName = 'Label';
dealLater = false;
} else if (solidColor && layer.vectorMask) {
let paths = layer.vectorMask().paths;
if (paths[2].numPoints === 4) {
let isRect = true;
......@@ -221,9 +236,9 @@
}
}
if (isRect) {
viewNode.type = 'rect';
viewNode.componentName = 'Div';
const {r, g, b} = solidColor();
properties.fillColor = `rgba(${r}, ${g}, ${b}, 1)`;
properties.style.backgroundColor = `rgba(${r}, ${g}, ${b}, 1)`;
dealLater = false;
}
}
......@@ -231,9 +246,9 @@
if (dealLater) {
if (node.hasOwnProperty('children')) {
viewNode.type = 'node';
viewNode.componentName = 'Div';
} else {
viewNode.type = 'image';
viewNode.componentName = 'Image';
let uuid = generateUUID();
const ext = '.png';
......@@ -263,7 +278,7 @@
});
}
properties.source = 'asset://' + uuid;
properties.attrs.source = 'asset://' + uuid;
}
}
}
......@@ -276,10 +291,13 @@
node.view = viewNode;
});
console.log(psdFile);
let data = {
view: viewRoot,
pluginVersion:"0.0.1",
reference:"psd",
fileName:psdFile.name,
assets,
view: viewRoot,
};
let dataString = JSON.stringify(data);
......@@ -302,5 +320,5 @@
Object.defineProperty(exports, '__esModule', { value: true });
}));
})));
//# sourceMappingURL=index.umd.js.map
dist/index.umd.js.map
View file @ 81d83998
This diff is collapsed.
src/zeroing.js
View file @ 81d83998
/**
* Created by rockyl on 2019-09-26.
* Created by renjianfeng on 2020-06-11.
*
* 导出zeroing的视图
* 导出spark的视图
*/
import {getTree} from "./psd-tree";
......@@ -33,7 +33,7 @@ export async function execute(psdFile, options) {
let viewRoot = {
name: path.basename(psdFile.name, '.psd'),
type: 'node',
componentName : 'Div',
uuid: generateUUID(),
};
......@@ -46,15 +46,19 @@ export async function execute(psdFile, options) {
await walkNode(tree, async function (node, parent) {
let {name} = node;
const {x, y, width, height, alpha, visible, origin: {layer, layer: {typeTool, solidColor}}} = node;
const {x, y, width, height, opacity, display, origin: {layer, layer: {typeTool, solidColor}}} = node;
//console.log('walk node:', name);
let properties = {
width, height, alpha, visible,
style:{
width, height, opacity,display ,
},
attrs:{
},
className:""
};
const isSecondLayer = !parent.origin.parent;
const {width: parentWidth, height: parentHeight} = parent;
if (name.includes('|')) {
try {
let arr = name.split('|');
......@@ -120,7 +124,7 @@ export async function execute(psdFile, options) {
value = 0;
}
}
properties[field] = value;
properties.style[field] = value;
}
}
}
......@@ -136,24 +140,33 @@ export async function execute(psdFile, options) {
};
let dealLater = true;
if (x !== 0) {
properties.x = x - (isSecondLayer ? offset.x : 0);
properties.style.left = x - (isSecondLayer ? offset.x : 0);
}
if (y !== 0) {
properties.y = y - (isSecondLayer ? offset.y : 0);
properties.style.top = y - (isSecondLayer ? offset.y : 0);
}
properties.style.position="absolute"
viewNode.rect={
x: properties.style.left?properties.style.left:0,
y: properties.style.top?properties.style.top:0,
width: properties.style.width,
height: properties.style.height
}
if (typeTool) {
let fontInfo = typeTool();
properties.text = fontInfo.textValue;
properties.attrs.text = fontInfo.textValue;
const sizes = fontInfo.sizes();
const colors = fontInfo.colors();
properties.size = sizes ? sizes[0] || 20 : 20;
properties.style.fontSize = sizes ? sizes[0] || 20 : 20;
let [r, g, b, a] = colors[0];
properties.fillColor = `rgba(${r}, ${g}, ${b}, ${a / 255})`;
viewNode.type = 'label';
console.log("color",[r, g, b, a])
properties.style.color = `rgba(${r}, ${g}, ${b}, ${a / 255})`;
viewNode.componentName = 'Label';
dealLater = false;
} else if (solidColor && layer.vectorMask) {
let paths = layer.vectorMask().paths;
if (paths[2].numPoints === 4) {
let isRect = true;
......@@ -164,9 +177,9 @@ export async function execute(psdFile, options) {
}
}
if (isRect) {
viewNode.type = 'rect';
viewNode.componentName = 'Div';
const {r, g, b} = solidColor();
properties.fillColor = `rgba(${r}, ${g}, ${b}, 1)`;
properties.style.backgroundColor = `rgba(${r}, ${g}, ${b}, 1)`;
dealLater = false;
}
}
......@@ -174,9 +187,9 @@ export async function execute(psdFile, options) {
if (dealLater) {
if (node.hasOwnProperty('children')) {
viewNode.type = 'node';
viewNode.componentName = 'Div';
} else {
viewNode.type = 'image';
viewNode.componentName = 'Image';
let uuid = generateUUID();
const ext = '.png';
......@@ -206,7 +219,7 @@ export async function execute(psdFile, options) {
});
}
properties.source = 'asset://' + uuid;
properties.attrs.source = 'asset://' + uuid;
}
}
}
......@@ -219,10 +232,13 @@ export async function execute(psdFile, options) {
node.view = viewNode;
});
console.log(psdFile)
let data = {
view: viewRoot,
pluginVersion:"0.0.1",
reference:"psd",
fileName:psdFile.name,
assets,
view: viewRoot,
};
let dataString = JSON.stringify(data);
......@@ -236,6 +252,6 @@ export async function execute(psdFile, options) {
console.log(res.length);
resolve(res);
}
})
});
})
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment