@micromag/cli 0.3.317 → 0.3.318
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bin/export.js +10 -29
- package/lib/index.js +309 -394
- package/package.json +9 -9
package/bin/export.js
CHANGED
|
@@ -50,11 +50,9 @@ const transformStory = (story, format) => {
|
|
|
50
50
|
transforms = {}
|
|
51
51
|
} = screensManager__default["default"].getDefinition(type);
|
|
52
52
|
const transform = transforms[transformKey] || null;
|
|
53
|
-
|
|
54
53
|
if (transform !== null) {
|
|
55
54
|
return transform(newStory, screen, story);
|
|
56
55
|
}
|
|
57
|
-
|
|
58
56
|
return newStory;
|
|
59
57
|
}, baseStory);
|
|
60
58
|
return transforms.postProcessor(componentsStory, transformKey);
|
|
@@ -75,28 +73,23 @@ const getOutputPath = (output, filename) => {
|
|
|
75
73
|
if (output !== null) {
|
|
76
74
|
const fileExt = path__default["default"].extname(filename);
|
|
77
75
|
const outputExt = path__default["default"].extname(output);
|
|
78
|
-
|
|
79
76
|
if (fileExt && outputExt === '') {
|
|
80
77
|
return path__default["default"].join(output, filename);
|
|
81
78
|
}
|
|
82
|
-
|
|
83
79
|
return output;
|
|
84
80
|
}
|
|
85
|
-
|
|
86
81
|
return path__default["default"].join(process.cwd(), `./${filename}`);
|
|
87
82
|
};
|
|
88
83
|
|
|
89
84
|
/* eslint-disable no-await-in-loop */
|
|
90
85
|
const DEBUG = false;
|
|
91
86
|
const READY_WAIT_TIMEOUT = 20000; // ms
|
|
92
|
-
|
|
93
87
|
const DEFAULT_VIEWPORT = {
|
|
94
88
|
width: 360,
|
|
95
89
|
height: 640,
|
|
96
90
|
deviceScaleFactor: 3,
|
|
97
91
|
isMobile: true
|
|
98
92
|
};
|
|
99
|
-
|
|
100
93
|
const captureStory = async (story, location, settings = {}) => {
|
|
101
94
|
const {
|
|
102
95
|
viewport: defaultViewport = DEFAULT_VIEWPORT,
|
|
@@ -119,16 +112,15 @@ const captureStory = async (story, location, settings = {}) => {
|
|
|
119
112
|
} : null),
|
|
120
113
|
defaultViewport,
|
|
121
114
|
args: ['--no-sandbox']
|
|
122
|
-
});
|
|
115
|
+
});
|
|
123
116
|
|
|
117
|
+
// try {
|
|
124
118
|
const pages = await browser.pages();
|
|
125
119
|
const hasPage = pages.length > 0;
|
|
126
120
|
const page = hasPage ? pages[0] : await browser.newPage();
|
|
127
121
|
await page.goto(`http://127.0.0.1:${serverPort}`);
|
|
128
|
-
|
|
129
122
|
if (screens !== null) {
|
|
130
123
|
const count = screens.length;
|
|
131
|
-
|
|
132
124
|
for (let index = 0; index < count; index += 1) {
|
|
133
125
|
const screenNumber = index + 1;
|
|
134
126
|
const screen = screens[index];
|
|
@@ -136,11 +128,11 @@ const captureStory = async (story, location, settings = {}) => {
|
|
|
136
128
|
id,
|
|
137
129
|
type
|
|
138
130
|
} = screen;
|
|
139
|
-
const singleScreenStory = {
|
|
131
|
+
const singleScreenStory = {
|
|
132
|
+
...story,
|
|
140
133
|
components: screens.slice(index, index + 1)
|
|
141
134
|
};
|
|
142
135
|
console.log(`Screen ${screenNumber}/${count} (${type})...`);
|
|
143
|
-
|
|
144
136
|
if (type === 'video' || type === 'video-360') {
|
|
145
137
|
const {
|
|
146
138
|
video: {
|
|
@@ -159,7 +151,6 @@ const captureStory = async (story, location, settings = {}) => {
|
|
|
159
151
|
fileStream.on('finish', resolve);
|
|
160
152
|
});
|
|
161
153
|
}
|
|
162
|
-
|
|
163
154
|
await page.evaluate((storyToRender, storyProps) => renderStory(storyToRender, storyProps), singleScreenStory, {
|
|
164
155
|
screen: id,
|
|
165
156
|
renderContext: 'capture',
|
|
@@ -169,7 +160,6 @@ const captureStory = async (story, location, settings = {}) => {
|
|
|
169
160
|
height,
|
|
170
161
|
googleApiKey
|
|
171
162
|
});
|
|
172
|
-
|
|
173
163
|
try {
|
|
174
164
|
await page.waitForSelector('[data-screen-ready="true"]', {
|
|
175
165
|
timeout: READY_WAIT_TIMEOUT
|
|
@@ -177,22 +167,20 @@ const captureStory = async (story, location, settings = {}) => {
|
|
|
177
167
|
} catch (e) {
|
|
178
168
|
console.log(`Timeout reached: ${id}`);
|
|
179
169
|
}
|
|
180
|
-
|
|
181
170
|
await page.screenshot({
|
|
182
171
|
path: getOutputPath(location, `${screenNumber}.png`)
|
|
183
172
|
});
|
|
184
173
|
}
|
|
185
|
-
}
|
|
174
|
+
}
|
|
175
|
+
// } catch (e) {
|
|
186
176
|
// console.log('ERROR', e); // eslint-disable-line
|
|
187
177
|
// }
|
|
188
178
|
|
|
189
|
-
|
|
190
179
|
await browser.close();
|
|
191
180
|
server.close();
|
|
192
181
|
};
|
|
193
182
|
|
|
194
183
|
/* globals renderStory: true */
|
|
195
|
-
|
|
196
184
|
const getStoryHtml = async (story, settings = {}) => {
|
|
197
185
|
const {
|
|
198
186
|
googleApiKey = null,
|
|
@@ -247,10 +235,8 @@ const storyParser = new core.StoryParser({
|
|
|
247
235
|
fieldsManager: FieldsManager__default["default"],
|
|
248
236
|
screensManager: screensManager__default["default"]
|
|
249
237
|
});
|
|
250
|
-
|
|
251
238
|
const exportStoryToPath = async (story, format, output, settings = {}) => {
|
|
252
239
|
const storyParsed = storyParser.parse(story);
|
|
253
|
-
|
|
254
240
|
switch (format) {
|
|
255
241
|
case 'html':
|
|
256
242
|
{
|
|
@@ -260,7 +246,6 @@ const exportStoryToPath = async (story, format, output, settings = {}) => {
|
|
|
260
246
|
fs__default["default"].writeFileSync(destination, html, 'utf-8');
|
|
261
247
|
break;
|
|
262
248
|
}
|
|
263
|
-
|
|
264
249
|
case 'html-ssr':
|
|
265
250
|
{
|
|
266
251
|
const html = getStoryHtmlSSR(storyParsed, settings);
|
|
@@ -268,19 +253,17 @@ const exportStoryToPath = async (story, format, output, settings = {}) => {
|
|
|
268
253
|
fs__default["default"].writeFileSync(destination, html, 'utf-8');
|
|
269
254
|
break;
|
|
270
255
|
}
|
|
271
|
-
|
|
272
256
|
case 'images':
|
|
273
257
|
{
|
|
274
258
|
captureStory(storyParsed, output, settings);
|
|
275
259
|
break;
|
|
276
260
|
}
|
|
277
|
-
|
|
278
261
|
default:
|
|
279
262
|
{
|
|
280
263
|
const parsedDestination = getOutputPath(output, 'parsed.json');
|
|
281
264
|
fs__default["default"].writeFileSync(parsedDestination, JSON.stringify(storyParsed), 'utf-8');
|
|
282
|
-
const newStory = transformStory(storyParsed, format);
|
|
283
|
-
|
|
265
|
+
const newStory = transformStory(storyParsed, format);
|
|
266
|
+
// const mediaDestination = getOutputPath(output);
|
|
284
267
|
const fileDestination = getOutputPath(output, 'article.json');
|
|
285
268
|
console.log(output, fileDestination);
|
|
286
269
|
fs__default["default"].writeFileSync(fileDestination, JSON.stringify(newStory), 'utf-8');
|
|
@@ -303,21 +286,19 @@ const startProgram = (stdin = null) => {
|
|
|
303
286
|
} = program__default["default"].opts();
|
|
304
287
|
const settings = jsonSettings !== null ? JSON.parse(jsonSettings) : {};
|
|
305
288
|
exportStoryToPath(storyArgument, format, output, settings);
|
|
306
|
-
};
|
|
307
|
-
|
|
289
|
+
};
|
|
308
290
|
|
|
291
|
+
// Read stdin for the story
|
|
309
292
|
if (process.stdin.isTTY) {
|
|
310
293
|
startProgram();
|
|
311
294
|
} else {
|
|
312
295
|
let stdin = null;
|
|
313
296
|
process.stdin.on('readable', () => {
|
|
314
297
|
const chunk = process.stdin.read();
|
|
315
|
-
|
|
316
298
|
if (chunk !== null) {
|
|
317
299
|
if (stdin === null) {
|
|
318
300
|
stdin = '';
|
|
319
301
|
}
|
|
320
|
-
|
|
321
302
|
stdin += chunk;
|
|
322
303
|
}
|
|
323
304
|
});
|
package/lib/index.js
CHANGED
|
@@ -43,20 +43,16 @@ var transformStory = function transformStory(story, format) {
|
|
|
43
43
|
var transformKey = changeCase.camelCase(format);
|
|
44
44
|
var baseStory = transforms.transformer(story, transformKey, story);
|
|
45
45
|
var _story$components = story.components,
|
|
46
|
-
|
|
46
|
+
components = _story$components === void 0 ? [] : _story$components;
|
|
47
47
|
var componentsStory = components.reduce(function (newStory, screen) {
|
|
48
48
|
var type = screen.type;
|
|
49
|
-
|
|
50
49
|
var _screensManager$getDe = screensManager__default["default"].getDefinition(type),
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
50
|
+
_screensManager$getDe2 = _screensManager$getDe.transforms,
|
|
51
|
+
transforms = _screensManager$getDe2 === void 0 ? {} : _screensManager$getDe2;
|
|
54
52
|
var transform = transforms[transformKey] || null;
|
|
55
|
-
|
|
56
53
|
if (transform !== null) {
|
|
57
54
|
return transform(newStory, screen, story);
|
|
58
55
|
}
|
|
59
|
-
|
|
60
56
|
return newStory;
|
|
61
57
|
}, baseStory);
|
|
62
58
|
return transforms.postProcessor(componentsStory, transformKey);
|
|
@@ -65,46 +61,38 @@ var transformStory = function transformStory(story, format) {
|
|
|
65
61
|
var startServer = /*#__PURE__*/function () {
|
|
66
62
|
var _ref = _asyncToGenerator__default["default"]( /*#__PURE__*/_regeneratorRuntime__default["default"]().mark(function _callee(path) {
|
|
67
63
|
var port,
|
|
68
|
-
|
|
69
|
-
|
|
64
|
+
finalPort,
|
|
65
|
+
_args = arguments;
|
|
70
66
|
return _regeneratorRuntime__default["default"]().wrap(function _callee$(_context) {
|
|
71
|
-
while (1) {
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
67
|
+
while (1) switch (_context.prev = _context.next) {
|
|
68
|
+
case 0:
|
|
69
|
+
port = _args.length > 1 && _args[1] !== undefined ? _args[1] : null;
|
|
70
|
+
_context.t0 = port;
|
|
71
|
+
if (_context.t0) {
|
|
72
|
+
_context.next = 6;
|
|
73
|
+
break;
|
|
74
|
+
}
|
|
75
|
+
_context.next = 5;
|
|
76
|
+
return getPort__default["default"]({
|
|
77
|
+
port: getPort__default["default"].makeRange(3050, 3100)
|
|
78
|
+
});
|
|
79
|
+
case 5:
|
|
80
|
+
_context.t0 = _context.sent;
|
|
81
|
+
case 6:
|
|
82
|
+
finalPort = _context.t0;
|
|
83
|
+
return _context.abrupt("return", new Promise(function (resolve) {
|
|
84
|
+
var app = express__default["default"]();
|
|
85
|
+
app.use(express__default["default"]["static"](path));
|
|
86
|
+
var server = app.listen(finalPort, function () {
|
|
87
|
+
return resolve(server);
|
|
85
88
|
});
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
case 6:
|
|
91
|
-
finalPort = _context.t0;
|
|
92
|
-
return _context.abrupt("return", new Promise(function (resolve) {
|
|
93
|
-
var app = express__default["default"]();
|
|
94
|
-
app.use(express__default["default"]["static"](path));
|
|
95
|
-
var server = app.listen(finalPort, function () {
|
|
96
|
-
return resolve(server);
|
|
97
|
-
});
|
|
98
|
-
}));
|
|
99
|
-
|
|
100
|
-
case 8:
|
|
101
|
-
case "end":
|
|
102
|
-
return _context.stop();
|
|
103
|
-
}
|
|
89
|
+
}));
|
|
90
|
+
case 8:
|
|
91
|
+
case "end":
|
|
92
|
+
return _context.stop();
|
|
104
93
|
}
|
|
105
94
|
}, _callee);
|
|
106
95
|
}));
|
|
107
|
-
|
|
108
96
|
return function startServer(_x) {
|
|
109
97
|
return _ref.apply(this, arguments);
|
|
110
98
|
};
|
|
@@ -114,229 +102,185 @@ var getOutputPath = function getOutputPath(output, filename) {
|
|
|
114
102
|
if (output !== null) {
|
|
115
103
|
var fileExt = path__default["default"].extname(filename);
|
|
116
104
|
var outputExt = path__default["default"].extname(output);
|
|
117
|
-
|
|
118
105
|
if (fileExt && outputExt === '') {
|
|
119
106
|
return path__default["default"].join(output, filename);
|
|
120
107
|
}
|
|
121
|
-
|
|
122
108
|
return output;
|
|
123
109
|
}
|
|
124
|
-
|
|
125
110
|
return path__default["default"].join(process.cwd(), "./".concat(filename));
|
|
126
111
|
};
|
|
127
112
|
|
|
128
113
|
var DEBUG = false;
|
|
129
114
|
var READY_WAIT_TIMEOUT = 20000; // ms
|
|
130
|
-
|
|
131
115
|
var DEFAULT_VIEWPORT = {
|
|
132
116
|
width: 360,
|
|
133
117
|
height: 640,
|
|
134
118
|
deviceScaleFactor: 3,
|
|
135
119
|
isMobile: true
|
|
136
120
|
};
|
|
137
|
-
|
|
138
121
|
var captureStory = /*#__PURE__*/function () {
|
|
139
|
-
var _ref = _asyncToGenerator__default["default"]( /*#__PURE__*/_regeneratorRuntime__default["default"]().mark(function
|
|
122
|
+
var _ref = _asyncToGenerator__default["default"]( /*#__PURE__*/_regeneratorRuntime__default["default"]().mark(function _callee(story, location) {
|
|
140
123
|
var settings,
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
browser = _context2.sent;
|
|
193
|
-
_context2.next = 13;
|
|
194
|
-
return browser.pages();
|
|
195
|
-
|
|
196
|
-
case 13:
|
|
197
|
-
pages = _context2.sent;
|
|
198
|
-
hasPage = pages.length > 0;
|
|
199
|
-
|
|
200
|
-
if (!hasPage) {
|
|
201
|
-
_context2.next = 19;
|
|
202
|
-
break;
|
|
203
|
-
}
|
|
204
|
-
|
|
205
|
-
_context2.t0 = pages[0];
|
|
206
|
-
_context2.next = 22;
|
|
124
|
+
_settings$viewport,
|
|
125
|
+
defaultViewport,
|
|
126
|
+
_settings$googleApiKe,
|
|
127
|
+
googleApiKey,
|
|
128
|
+
_settings$executableP,
|
|
129
|
+
executablePath,
|
|
130
|
+
server,
|
|
131
|
+
serverPort,
|
|
132
|
+
width,
|
|
133
|
+
height,
|
|
134
|
+
_ref2,
|
|
135
|
+
_ref2$components,
|
|
136
|
+
screens,
|
|
137
|
+
browser,
|
|
138
|
+
pages,
|
|
139
|
+
hasPage,
|
|
140
|
+
page,
|
|
141
|
+
count,
|
|
142
|
+
_loop,
|
|
143
|
+
index,
|
|
144
|
+
_args2 = arguments;
|
|
145
|
+
return _regeneratorRuntime__default["default"]().wrap(function _callee$(_context2) {
|
|
146
|
+
while (1) switch (_context2.prev = _context2.next) {
|
|
147
|
+
case 0:
|
|
148
|
+
settings = _args2.length > 2 && _args2[2] !== undefined ? _args2[2] : {};
|
|
149
|
+
_settings$viewport = settings.viewport, defaultViewport = _settings$viewport === void 0 ? DEFAULT_VIEWPORT : _settings$viewport, _settings$googleApiKe = settings.googleApiKey, googleApiKey = _settings$googleApiKe === void 0 ? null : _settings$googleApiKe, _settings$executableP = settings.executablePath, executablePath = _settings$executableP === void 0 ? null : _settings$executableP;
|
|
150
|
+
_context2.next = 4;
|
|
151
|
+
return startServer(path__default["default"].join(process.cwd(), './node_modules/@micromag/viewer-build/build/'));
|
|
152
|
+
case 4:
|
|
153
|
+
server = _context2.sent;
|
|
154
|
+
serverPort = server.address().port;
|
|
155
|
+
width = defaultViewport.width, height = defaultViewport.height;
|
|
156
|
+
_ref2 = story || {}, _ref2$components = _ref2.components, screens = _ref2$components === void 0 ? null : _ref2$components;
|
|
157
|
+
_context2.next = 10;
|
|
158
|
+
return puppeteer__default["default"].launch(_objectSpread__default["default"](_objectSpread__default["default"]({
|
|
159
|
+
devtools: DEBUG
|
|
160
|
+
}, executablePath !== null ? {
|
|
161
|
+
executablePath: executablePath
|
|
162
|
+
} : null), {}, {
|
|
163
|
+
defaultViewport: defaultViewport,
|
|
164
|
+
args: ['--no-sandbox']
|
|
165
|
+
}));
|
|
166
|
+
case 10:
|
|
167
|
+
browser = _context2.sent;
|
|
168
|
+
_context2.next = 13;
|
|
169
|
+
return browser.pages();
|
|
170
|
+
case 13:
|
|
171
|
+
pages = _context2.sent;
|
|
172
|
+
hasPage = pages.length > 0;
|
|
173
|
+
if (!hasPage) {
|
|
174
|
+
_context2.next = 19;
|
|
207
175
|
break;
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
break;
|
|
225
|
-
}
|
|
226
|
-
|
|
227
|
-
count = screens.length;
|
|
228
|
-
index = 0;
|
|
229
|
-
|
|
230
|
-
case 28:
|
|
231
|
-
if (!(index < count)) {
|
|
232
|
-
_context2.next = 51;
|
|
233
|
-
break;
|
|
234
|
-
}
|
|
235
|
-
|
|
236
|
-
screenNumber = index + 1;
|
|
237
|
-
screen = screens[index];
|
|
238
|
-
id = screen.id, type = screen.type;
|
|
239
|
-
singleScreenStory = _objectSpread__default["default"](_objectSpread__default["default"]({}, story), {}, {
|
|
240
|
-
components: screens.slice(index, index + 1)
|
|
241
|
-
});
|
|
242
|
-
console.log("Screen ".concat(screenNumber, "/").concat(count, " (").concat(type, ")..."));
|
|
243
|
-
|
|
244
|
-
if (!(type === 'video' || type === 'video-360')) {
|
|
245
|
-
_context2.next = 36;
|
|
246
|
-
break;
|
|
247
|
-
}
|
|
248
|
-
|
|
249
|
-
return _context2.delegateYield( /*#__PURE__*/_regeneratorRuntime__default["default"]().mark(function _callee() {
|
|
250
|
-
var _screen$video, _screen$video$media, _screen$video$media$u, url, fileExtension, res, fileStream;
|
|
251
|
-
|
|
252
|
-
return _regeneratorRuntime__default["default"]().wrap(function _callee$(_context) {
|
|
253
|
-
while (1) {
|
|
254
|
-
switch (_context.prev = _context.next) {
|
|
255
|
-
case 0:
|
|
256
|
-
_screen$video = screen.video;
|
|
257
|
-
_screen$video = _screen$video === void 0 ? {} : _screen$video;
|
|
258
|
-
_screen$video$media = _screen$video.media;
|
|
259
|
-
_screen$video$media = _screen$video$media === void 0 ? {} : _screen$video$media;
|
|
260
|
-
_screen$video$media$u = _screen$video$media.url, url = _screen$video$media$u === void 0 ? null : _screen$video$media$u;
|
|
261
|
-
console.log("Downloading video from ".concat(url, "..."));
|
|
262
|
-
fileExtension = url.split(/[#?]/)[0].split('.').pop().trim();
|
|
263
|
-
_context.next = 9;
|
|
264
|
-
return nodeFetch__default["default"](url);
|
|
265
|
-
|
|
266
|
-
case 9:
|
|
267
|
-
res = _context.sent;
|
|
268
|
-
fileStream = fsExtra__default["default"].createWriteStream(getOutputPath(location, "".concat(screenNumber, ".").concat(fileExtension)));
|
|
269
|
-
_context.next = 13;
|
|
270
|
-
return new Promise(function (resolve, reject) {
|
|
271
|
-
res.body.pipe(fileStream);
|
|
272
|
-
res.body.on('error', reject);
|
|
273
|
-
fileStream.on('finish', resolve);
|
|
274
|
-
});
|
|
275
|
-
|
|
276
|
-
case 13:
|
|
277
|
-
case "end":
|
|
278
|
-
return _context.stop();
|
|
279
|
-
}
|
|
280
|
-
}
|
|
281
|
-
}, _callee);
|
|
282
|
-
})(), "t1", 36);
|
|
283
|
-
|
|
284
|
-
case 36:
|
|
285
|
-
_context2.next = 38;
|
|
286
|
-
return page.evaluate(function (storyToRender, storyProps) {
|
|
287
|
-
return renderStory(storyToRender, storyProps);
|
|
288
|
-
}, singleScreenStory, {
|
|
289
|
-
screen: id,
|
|
290
|
-
renderContext: 'capture',
|
|
291
|
-
withoutRouter: true,
|
|
292
|
-
withoutMenu: true,
|
|
293
|
-
width: width,
|
|
294
|
-
height: height,
|
|
295
|
-
googleApiKey: googleApiKey
|
|
296
|
-
});
|
|
297
|
-
|
|
298
|
-
case 38:
|
|
299
|
-
_context2.prev = 38;
|
|
300
|
-
_context2.next = 41;
|
|
301
|
-
return page.waitForSelector('[data-screen-ready="true"]', {
|
|
302
|
-
timeout: READY_WAIT_TIMEOUT
|
|
303
|
-
});
|
|
304
|
-
|
|
305
|
-
case 41:
|
|
306
|
-
_context2.next = 46;
|
|
176
|
+
}
|
|
177
|
+
_context2.t0 = pages[0];
|
|
178
|
+
_context2.next = 22;
|
|
179
|
+
break;
|
|
180
|
+
case 19:
|
|
181
|
+
_context2.next = 21;
|
|
182
|
+
return browser.newPage();
|
|
183
|
+
case 21:
|
|
184
|
+
_context2.t0 = _context2.sent;
|
|
185
|
+
case 22:
|
|
186
|
+
page = _context2.t0;
|
|
187
|
+
_context2.next = 25;
|
|
188
|
+
return page["goto"]("http://127.0.0.1:".concat(serverPort));
|
|
189
|
+
case 25:
|
|
190
|
+
if (!(screens !== null)) {
|
|
191
|
+
_context2.next = 34;
|
|
307
192
|
break;
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
193
|
+
}
|
|
194
|
+
count = screens.length;
|
|
195
|
+
_loop = /*#__PURE__*/_regeneratorRuntime__default["default"]().mark(function _loop() {
|
|
196
|
+
var screenNumber, screen, id, type, singleScreenStory, _screen$video, _screen$video2, _screen$video2$media, _screen$video2$media2, _screen$video2$media3, url, fileExtension, res, fileStream;
|
|
197
|
+
return _regeneratorRuntime__default["default"]().wrap(function _loop$(_context) {
|
|
198
|
+
while (1) switch (_context.prev = _context.next) {
|
|
199
|
+
case 0:
|
|
200
|
+
screenNumber = index + 1;
|
|
201
|
+
screen = screens[index];
|
|
202
|
+
id = screen.id, type = screen.type;
|
|
203
|
+
singleScreenStory = _objectSpread__default["default"](_objectSpread__default["default"]({}, story), {}, {
|
|
204
|
+
components: screens.slice(index, index + 1)
|
|
205
|
+
});
|
|
206
|
+
console.log("Screen ".concat(screenNumber, "/").concat(count, " (").concat(type, ")..."));
|
|
207
|
+
if (!(type === 'video' || type === 'video-360')) {
|
|
208
|
+
_context.next = 15;
|
|
209
|
+
break;
|
|
210
|
+
}
|
|
211
|
+
_screen$video = screen.video, _screen$video2 = _screen$video === void 0 ? {} : _screen$video, _screen$video2$media = _screen$video2.media, _screen$video2$media2 = _screen$video2$media === void 0 ? {} : _screen$video2$media, _screen$video2$media3 = _screen$video2$media2.url, url = _screen$video2$media3 === void 0 ? null : _screen$video2$media3;
|
|
212
|
+
console.log("Downloading video from ".concat(url, "..."));
|
|
213
|
+
fileExtension = url.split(/[#?]/)[0].split('.').pop().trim();
|
|
214
|
+
_context.next = 11;
|
|
215
|
+
return nodeFetch__default["default"](url);
|
|
216
|
+
case 11:
|
|
217
|
+
res = _context.sent;
|
|
218
|
+
fileStream = fsExtra__default["default"].createWriteStream(getOutputPath(location, "".concat(screenNumber, ".").concat(fileExtension)));
|
|
219
|
+
_context.next = 15;
|
|
220
|
+
return new Promise(function (resolve, reject) {
|
|
221
|
+
res.body.pipe(fileStream);
|
|
222
|
+
res.body.on('error', reject);
|
|
223
|
+
fileStream.on('finish', resolve);
|
|
224
|
+
});
|
|
225
|
+
case 15:
|
|
226
|
+
_context.next = 17;
|
|
227
|
+
return page.evaluate(function (storyToRender, storyProps) {
|
|
228
|
+
return renderStory(storyToRender, storyProps);
|
|
229
|
+
}, singleScreenStory, {
|
|
230
|
+
screen: id,
|
|
231
|
+
renderContext: 'capture',
|
|
232
|
+
withoutRouter: true,
|
|
233
|
+
withoutMenu: true,
|
|
234
|
+
width: width,
|
|
235
|
+
height: height,
|
|
236
|
+
googleApiKey: googleApiKey
|
|
237
|
+
});
|
|
238
|
+
case 17:
|
|
239
|
+
_context.prev = 17;
|
|
240
|
+
_context.next = 20;
|
|
241
|
+
return page.waitForSelector('[data-screen-ready="true"]', {
|
|
242
|
+
timeout: READY_WAIT_TIMEOUT
|
|
243
|
+
});
|
|
244
|
+
case 20:
|
|
245
|
+
_context.next = 25;
|
|
246
|
+
break;
|
|
247
|
+
case 22:
|
|
248
|
+
_context.prev = 22;
|
|
249
|
+
_context.t0 = _context["catch"](17);
|
|
250
|
+
console.log("Timeout reached: ".concat(id));
|
|
251
|
+
case 25:
|
|
252
|
+
_context.next = 27;
|
|
253
|
+
return page.screenshot({
|
|
254
|
+
path: getOutputPath(location, "".concat(screenNumber, ".png"))
|
|
255
|
+
});
|
|
256
|
+
case 27:
|
|
257
|
+
case "end":
|
|
258
|
+
return _context.stop();
|
|
259
|
+
}
|
|
260
|
+
}, _loop, null, [[17, 22]]);
|
|
261
|
+
});
|
|
262
|
+
index = 0;
|
|
263
|
+
case 29:
|
|
264
|
+
if (!(index < count)) {
|
|
265
|
+
_context2.next = 34;
|
|
323
266
|
break;
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
267
|
+
}
|
|
268
|
+
return _context2.delegateYield(_loop(), "t1", 31);
|
|
269
|
+
case 31:
|
|
270
|
+
index += 1;
|
|
271
|
+
_context2.next = 29;
|
|
272
|
+
break;
|
|
273
|
+
case 34:
|
|
274
|
+
_context2.next = 36;
|
|
275
|
+
return browser.close();
|
|
276
|
+
case 36:
|
|
277
|
+
server.close();
|
|
278
|
+
case 37:
|
|
279
|
+
case "end":
|
|
280
|
+
return _context2.stop();
|
|
336
281
|
}
|
|
337
|
-
},
|
|
282
|
+
}, _callee);
|
|
338
283
|
}));
|
|
339
|
-
|
|
340
284
|
return function captureStory(_x, _x2) {
|
|
341
285
|
return _ref.apply(this, arguments);
|
|
342
286
|
};
|
|
@@ -345,107 +289,90 @@ var captureStory = /*#__PURE__*/function () {
|
|
|
345
289
|
var getStoryHtml = /*#__PURE__*/function () {
|
|
346
290
|
var _ref = _asyncToGenerator__default["default"]( /*#__PURE__*/_regeneratorRuntime__default["default"]().mark(function _callee(story) {
|
|
347
291
|
var settings,
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
292
|
+
_settings$googleApiKe,
|
|
293
|
+
googleApiKey,
|
|
294
|
+
_settings$executableP,
|
|
295
|
+
executablePath,
|
|
296
|
+
server,
|
|
297
|
+
serverPort,
|
|
298
|
+
browser,
|
|
299
|
+
pages,
|
|
300
|
+
hasPage,
|
|
301
|
+
page,
|
|
302
|
+
pageContent,
|
|
303
|
+
_args = arguments;
|
|
361
304
|
return _regeneratorRuntime__default["default"]().wrap(function _callee$(_context) {
|
|
362
|
-
while (1) {
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
deviceScaleFactor: 3,
|
|
383
|
-
isMobile: true
|
|
384
|
-
}
|
|
385
|
-
}));
|
|
386
|
-
|
|
387
|
-
case 8:
|
|
388
|
-
browser = _context.sent;
|
|
389
|
-
_context.next = 11;
|
|
390
|
-
return browser.pages();
|
|
391
|
-
|
|
392
|
-
case 11:
|
|
393
|
-
pages = _context.sent;
|
|
394
|
-
hasPage = pages.length > 0;
|
|
395
|
-
|
|
396
|
-
if (!hasPage) {
|
|
397
|
-
_context.next = 17;
|
|
398
|
-
break;
|
|
305
|
+
while (1) switch (_context.prev = _context.next) {
|
|
306
|
+
case 0:
|
|
307
|
+
settings = _args.length > 1 && _args[1] !== undefined ? _args[1] : {};
|
|
308
|
+
_settings$googleApiKe = settings.googleApiKey, googleApiKey = _settings$googleApiKe === void 0 ? null : _settings$googleApiKe, _settings$executableP = settings.executablePath, executablePath = _settings$executableP === void 0 ? null : _settings$executableP;
|
|
309
|
+
_context.next = 4;
|
|
310
|
+
return startServer(path__default["default"].join(process.cwd(), './node_modules/@micromag/viewer-build/build/'));
|
|
311
|
+
case 4:
|
|
312
|
+
server = _context.sent;
|
|
313
|
+
serverPort = server.address().port;
|
|
314
|
+
_context.next = 8;
|
|
315
|
+
return puppeteer__default["default"].launch(_objectSpread__default["default"](_objectSpread__default["default"]({
|
|
316
|
+
devtools: false
|
|
317
|
+
}, executablePath !== null ? {
|
|
318
|
+
executablePath: executablePath
|
|
319
|
+
} : null), {}, {
|
|
320
|
+
defaultViewport: {
|
|
321
|
+
width: 360,
|
|
322
|
+
height: 640,
|
|
323
|
+
deviceScaleFactor: 3,
|
|
324
|
+
isMobile: true
|
|
399
325
|
}
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
326
|
+
}));
|
|
327
|
+
case 8:
|
|
328
|
+
browser = _context.sent;
|
|
329
|
+
_context.next = 11;
|
|
330
|
+
return browser.pages();
|
|
331
|
+
case 11:
|
|
332
|
+
pages = _context.sent;
|
|
333
|
+
hasPage = pages.length > 0;
|
|
334
|
+
if (!hasPage) {
|
|
335
|
+
_context.next = 17;
|
|
403
336
|
break;
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
case 32:
|
|
442
|
-
case "end":
|
|
443
|
-
return _context.stop();
|
|
444
|
-
}
|
|
337
|
+
}
|
|
338
|
+
_context.t0 = pages[0];
|
|
339
|
+
_context.next = 20;
|
|
340
|
+
break;
|
|
341
|
+
case 17:
|
|
342
|
+
_context.next = 19;
|
|
343
|
+
return browser.newPage();
|
|
344
|
+
case 19:
|
|
345
|
+
_context.t0 = _context.sent;
|
|
346
|
+
case 20:
|
|
347
|
+
page = _context.t0;
|
|
348
|
+
_context.next = 23;
|
|
349
|
+
return page["goto"]("http://127.0.0.1:".concat(serverPort));
|
|
350
|
+
case 23:
|
|
351
|
+
_context.next = 25;
|
|
352
|
+
return page.evaluate(function (storyToRender, storyProps) {
|
|
353
|
+
return renderStory(storyToRender, storyProps);
|
|
354
|
+
}, story, {
|
|
355
|
+
renderContext: 'static',
|
|
356
|
+
withoutRouter: true,
|
|
357
|
+
withoutMenu: true,
|
|
358
|
+
googleApiKey: googleApiKey
|
|
359
|
+
});
|
|
360
|
+
case 25:
|
|
361
|
+
_context.next = 27;
|
|
362
|
+
return page.content();
|
|
363
|
+
case 27:
|
|
364
|
+
pageContent = _context.sent;
|
|
365
|
+
_context.next = 30;
|
|
366
|
+
return browser.close();
|
|
367
|
+
case 30:
|
|
368
|
+
server.close();
|
|
369
|
+
return _context.abrupt("return", pageContent);
|
|
370
|
+
case 32:
|
|
371
|
+
case "end":
|
|
372
|
+
return _context.stop();
|
|
445
373
|
}
|
|
446
374
|
}, _callee);
|
|
447
375
|
}));
|
|
448
|
-
|
|
449
376
|
return function getStoryHtml(_x) {
|
|
450
377
|
return _ref.apply(this, arguments);
|
|
451
378
|
};
|
|
@@ -454,7 +381,7 @@ var getStoryHtml = /*#__PURE__*/function () {
|
|
|
454
381
|
var getStoryHtmlSSR = function getStoryHtmlSSR(story) {
|
|
455
382
|
var settings = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
456
383
|
var _settings$googleApiKe = settings.googleApiKey,
|
|
457
|
-
|
|
384
|
+
googleApiKey = _settings$googleApiKe === void 0 ? null : _settings$googleApiKe;
|
|
458
385
|
var element = /*#__PURE__*/React__default["default"].createElement(Viewer__default["default"], {
|
|
459
386
|
story: story,
|
|
460
387
|
renderContext: 'static',
|
|
@@ -470,69 +397,57 @@ var storyParser = new core.StoryParser({
|
|
|
470
397
|
fieldsManager: FieldsManager__default["default"],
|
|
471
398
|
screensManager: screensManager__default["default"]
|
|
472
399
|
});
|
|
473
|
-
|
|
474
400
|
var exportStoryToPath = /*#__PURE__*/function () {
|
|
475
401
|
var _ref = _asyncToGenerator__default["default"]( /*#__PURE__*/_regeneratorRuntime__default["default"]().mark(function _callee(story, format, output) {
|
|
476
402
|
var settings,
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
403
|
+
storyParsed,
|
|
404
|
+
html,
|
|
405
|
+
destination,
|
|
406
|
+
_html,
|
|
407
|
+
_destination,
|
|
408
|
+
parsedDestination,
|
|
409
|
+
newStory,
|
|
410
|
+
fileDestination,
|
|
411
|
+
_args = arguments;
|
|
487
412
|
return _regeneratorRuntime__default["default"]().wrap(function _callee$(_context) {
|
|
488
|
-
while (1) {
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
fileDestination = getOutputPath(output, 'article.json');
|
|
524
|
-
console.log(output, fileDestination);
|
|
525
|
-
fs__default["default"].writeFileSync(fileDestination, JSON.stringify(newStory), 'utf-8');
|
|
526
|
-
return _context.abrupt("break", 25);
|
|
527
|
-
|
|
528
|
-
case 25:
|
|
529
|
-
case "end":
|
|
530
|
-
return _context.stop();
|
|
531
|
-
}
|
|
413
|
+
while (1) switch (_context.prev = _context.next) {
|
|
414
|
+
case 0:
|
|
415
|
+
settings = _args.length > 3 && _args[3] !== undefined ? _args[3] : {};
|
|
416
|
+
storyParsed = storyParser.parse(story);
|
|
417
|
+
_context.t0 = format;
|
|
418
|
+
_context.next = _context.t0 === 'html' ? 5 : _context.t0 === 'html-ssr' ? 12 : _context.t0 === 'images' ? 16 : 18;
|
|
419
|
+
break;
|
|
420
|
+
case 5:
|
|
421
|
+
_context.next = 7;
|
|
422
|
+
return getStoryHtml(storyParsed, settings);
|
|
423
|
+
case 7:
|
|
424
|
+
html = _context.sent;
|
|
425
|
+
destination = getOutputPath(output, 'story.html');
|
|
426
|
+
console.log('destination', destination);
|
|
427
|
+
fs__default["default"].writeFileSync(destination, html, 'utf-8');
|
|
428
|
+
return _context.abrupt("break", 25);
|
|
429
|
+
case 12:
|
|
430
|
+
_html = getStoryHtmlSSR(storyParsed, settings);
|
|
431
|
+
_destination = getOutputPath(output, 'story-ssr.html');
|
|
432
|
+
fs__default["default"].writeFileSync(_destination, _html, 'utf-8');
|
|
433
|
+
return _context.abrupt("break", 25);
|
|
434
|
+
case 16:
|
|
435
|
+
captureStory(storyParsed, output, settings);
|
|
436
|
+
return _context.abrupt("break", 25);
|
|
437
|
+
case 18:
|
|
438
|
+
parsedDestination = getOutputPath(output, 'parsed.json');
|
|
439
|
+
fs__default["default"].writeFileSync(parsedDestination, JSON.stringify(storyParsed), 'utf-8');
|
|
440
|
+
newStory = transformStory(storyParsed, format); // const mediaDestination = getOutputPath(output);
|
|
441
|
+
fileDestination = getOutputPath(output, 'article.json');
|
|
442
|
+
console.log(output, fileDestination);
|
|
443
|
+
fs__default["default"].writeFileSync(fileDestination, JSON.stringify(newStory), 'utf-8');
|
|
444
|
+
return _context.abrupt("break", 25);
|
|
445
|
+
case 25:
|
|
446
|
+
case "end":
|
|
447
|
+
return _context.stop();
|
|
532
448
|
}
|
|
533
449
|
}, _callee);
|
|
534
450
|
}));
|
|
535
|
-
|
|
536
451
|
return function exportStoryToPath(_x, _x2, _x3) {
|
|
537
452
|
return _ref.apply(this, arguments);
|
|
538
453
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@micromag/cli",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.318",
|
|
4
4
|
"description": "",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"javascript"
|
|
@@ -44,13 +44,13 @@
|
|
|
44
44
|
},
|
|
45
45
|
"dependencies": {
|
|
46
46
|
"@babel/runtime": "^7.13.10",
|
|
47
|
-
"@micromag/core": "^0.3.
|
|
48
|
-
"@micromag/elements": "^0.3.
|
|
49
|
-
"@micromag/fields": "^0.3.
|
|
50
|
-
"@micromag/screens": "^0.3.
|
|
51
|
-
"@micromag/transforms": "^0.3.
|
|
52
|
-
"@micromag/viewer": "^0.3.
|
|
53
|
-
"@micromag/viewer-build": "^0.3.
|
|
47
|
+
"@micromag/core": "^0.3.318",
|
|
48
|
+
"@micromag/elements": "^0.3.318",
|
|
49
|
+
"@micromag/fields": "^0.3.318",
|
|
50
|
+
"@micromag/screens": "^0.3.318",
|
|
51
|
+
"@micromag/transforms": "^0.3.318",
|
|
52
|
+
"@micromag/viewer": "^0.3.318",
|
|
53
|
+
"@micromag/viewer-build": "^0.3.318",
|
|
54
54
|
"change-case": "^4.1.2",
|
|
55
55
|
"classnames": "^2.2.6",
|
|
56
56
|
"commander": "^8.3.0",
|
|
@@ -67,5 +67,5 @@
|
|
|
67
67
|
"publishConfig": {
|
|
68
68
|
"access": "public"
|
|
69
69
|
},
|
|
70
|
-
"gitHead": "
|
|
70
|
+
"gitHead": "7d1a296e0c0d410e1225279e1f19e3a7715bfa96"
|
|
71
71
|
}
|