From 729798bc2594dc99e70717fc773092323b7724a5 Mon Sep 17 00:00:00 2001 From: shmyga Date: Tue, 9 Jan 2018 22:22:03 +0300 Subject: [PATCH] [build] added html5 task --- build/client.js | 66 +++++++++++++++++++++++---- build/webapp.js | 28 ------------ gulpfile.js | 4 +- package.json | 2 + project.xml | 2 +- src/client/html/index.html | 28 ++++++++++++ src/{webapp => client/html}/js/swf.js | 14 +----- src/webapp/index.html | 61 ++++++++++++++----------- tasks/haxe.js | 35 ++++++++------ 9 files changed, 145 insertions(+), 95 deletions(-) create mode 100644 src/client/html/index.html rename src/{webapp => client/html}/js/swf.js (84%) diff --git a/build/client.js b/build/client.js index fbf53f8..04baa9d 100755 --- a/build/client.js +++ b/build/client.js @@ -1,10 +1,15 @@ const gulp = require('gulp'); +const concat = require('gulp-concat'); +const uglify = require('gulp-uglify'); +const babel = require('gulp-babel'); +const template = require('gulp-template'); const yargs = require('yargs'); const Haxe = require('../tasks/haxe'); const FlashPlayer = require('../tasks/flashplayer'); const version = require('./version'); const prepare = require('./prepare'); const debug = require('../tasks/debug'); +const webserver = require('gulp-webserver'); const generate = () => function generate() { @@ -13,26 +18,67 @@ const generate = () => function generate() { ]); }; -const build = () => function build() { +const build = (platform) => function build() { const argv = yargs.argv; return gulp.src('.') .pipe(new Haxe().openfl({ command: 'build', - platform: 'flash', + platform: platform, version: version, - outputFile: 'tankz.swf', debug: argv.dev, })) - .pipe(gulp.dest('target')); + .pipe(gulp.dest(`target/${platform}`)); }; -const test = (build) => function test() { +const flashIndex = function() { + return gulp.src('src/client/html/index.html') + .pipe(template({ + scripts: ['app.min.js'], + swf: 'tankz.swf' + })) + .pipe(gulp.dest('target/flash')) +}; + +const flashJs = function() { + const src = [ + 'src/client/html/js/*.js' + ]; + return gulp.src(src) + .pipe(babel({presets: ['es2015']})) + .pipe(uglify()) + .pipe(concat('app.min.js')) + .pipe(gulp.dest('target/flash')) +}; + +const webapp = function () { + return gulp.src('src/webapp/*').pipe(gulp.dest('target')); +}; + +exports['client:flash:html'] = gulp.parallel(flashIndex, flashJs); +exports['client:flash'] = gulp.series(prepare(Haxe.ID), generate(), build('flash'), exports['client:flash:html']); +exports['client:html5'] = gulp.series(prepare(Haxe.ID), generate(), build('html5')); +exports['client:webapp'] = webapp; +exports['client'] = gulp.series(prepare(Haxe.ID), generate(), gulp.parallel(build('flash'), build('html5')), exports['client:flash:html'], webapp); + + + +const testFlash = function() { const argv = yargs.argv; - return build() - .pipe(new FlashPlayer().run(argv.dev)) - .pipe(debug()); + return build('flash') + .pipe(new FlashPlayer().run(argv.dev)) + .pipe(debug()); }; +const testHtml5 = function() { + return gulp.series(build('html5'), () => gulp.src('target/html5').pipe(webserver({ + host: 'localhost', port: 3000, + open: true, + fallback: 'index.html' + })))(); +}; + +exports['client:flash:test'] = gulp.series(prepare(Haxe.ID, FlashPlayer.ID), testFlash); +exports['client:html5:test'] = gulp.series(prepare(Haxe.ID), testHtml5); +exports['client:test'] = exports['client:flash:test']; + -exports['client'] = gulp.series(prepare(Haxe.ID), generate(), build()); -exports['client:test'] = gulp.series(prepare(Haxe.ID, FlashPlayer.ID), test(build())); diff --git a/build/webapp.js b/build/webapp.js index 4e88e61..e69de29 100644 --- a/build/webapp.js +++ b/build/webapp.js @@ -1,28 +0,0 @@ -const gulp = require('gulp'); -const concat = require('gulp-concat'); -const uglify = require('gulp-uglify'); -const babel = require('gulp-babel'); -const template = require('gulp-template'); - - -const index = () => function index() { - return gulp.src('src/webapp/index.html') - .pipe(template({ - scripts: ['app.min.js'], - swf: 'tankz.swf' - })) - .pipe(gulp.dest('target')) -}; - -const js = () => function js() { - const src = [ - 'src/webapp/js/*.js' - ]; - return gulp.src(src) - .pipe(babel({presets: ['es2015']})) - .pipe(uglify()) - .pipe(concat('app.min.js')) - .pipe(gulp.dest('target')) -}; - -exports['webapp'] = gulp.parallel(index(), js()); \ No newline at end of file diff --git a/gulpfile.js b/gulpfile.js index 8dc33bd..e06e65f 100755 --- a/gulpfile.js +++ b/gulpfile.js @@ -30,6 +30,6 @@ exports.update = prepare.update; merge('./build/prepare'); merge('./build/client'); merge('./build/server'); -merge('./build/webapp'); -exports.default = gulp.series(exports.clean, exports.client, exports.webapp); \ No newline at end of file + +exports.default = gulp.series(exports.clean, exports.client); \ No newline at end of file diff --git a/package.json b/package.json index 38f50b8..5bc7d1e 100755 --- a/package.json +++ b/package.json @@ -17,12 +17,14 @@ "gulp-concat": "^2.6.1", "gulp-template": "^5.0.0", "gulp-uglify": "^3.0.0", + "gulp-webserver": "^0.9.1", "plugin-error": "^0.1.2", "progress": "^2.0.0", "promise-streams": "^2.1.1", "tar": "^4.2.0", "tmp-file": "^2.0.1", "unzip-stream": "^0.2.1", + "vinyl-fs": "^3.0.1", "yargs": "^10.0.3" } } diff --git a/project.xml b/project.xml index ef388b1..8f89b5c 100755 --- a/project.xml +++ b/project.xml @@ -9,7 +9,7 @@ - + diff --git a/src/client/html/index.html b/src/client/html/index.html new file mode 100644 index 0000000..217ae12 --- /dev/null +++ b/src/client/html/index.html @@ -0,0 +1,28 @@ + + + + + Tank'z + <% scripts.forEach(function(script) { %> + + <% }); %> + + + +
+ + + \ No newline at end of file diff --git a/src/webapp/js/swf.js b/src/client/html/js/swf.js similarity index 84% rename from src/webapp/js/swf.js rename to src/client/html/js/swf.js index d154006..d2e7a63 100644 --- a/src/webapp/js/swf.js +++ b/src/client/html/js/swf.js @@ -1,15 +1,3 @@ -const typeOf = (item) => { - if (item == null) return "null"; - if (item.nodeName) { - if (item.nodeType == 1) return "element"; - if (item.nodeType == 3) return (/\S/).test(item.nodeValue) ? "textnode" : "whitespace"; - } else if (typeof item.length == "number") { - if (item.callee) return "arguments"; - } - return typeof item; -}; - - class Swf { constructor(element, swf, options) { @@ -50,7 +38,7 @@ class Swf { var value = object[key]; if (base) key = base + ":" + key; var result; - switch (typeOf(value)) { + switch (typeof value) { case "object": result = this.toFlashVars(value, key); break; diff --git a/src/webapp/index.html b/src/webapp/index.html index 217ae12..358e364 100644 --- a/src/webapp/index.html +++ b/src/webapp/index.html @@ -1,28 +1,35 @@ - - - - - Tank'z - <% scripts.forEach(function(script) { %> - - <% }); %> - - - -
- - + + + + + Tank'z + + + +
+
    +
    • +
    • +
+
+ + \ No newline at end of file diff --git a/tasks/haxe.js b/tasks/haxe.js index 16ebc42..3c889c7 100755 --- a/tasks/haxe.js +++ b/tasks/haxe.js @@ -1,3 +1,4 @@ +const os = require('os'); const fs = require('fs'); const path = require('path'); const tmp = require('tmp-file'); @@ -9,6 +10,7 @@ const Vinyl = require('vinyl'); const PluginError = require('plugin-error'); const colors = require('ansi-colors'); const log = require('fancy-log'); +const vfs = require('vinyl-fs'); class Haxe extends Sdk { @@ -136,7 +138,7 @@ class Haxe extends Sdk { }; const endStream = (callback) => { - log(this.tag, colors.cyan("openfl", params.command, params.platform), '=>', colors.magenta(params.outputFile)); + log(this.tag, colors.cyan(`openfl ${params.command} ${params.platform}`)); const args = ['-cwd', files[0].path, 'run', 'openfl', params.command, params.platform]; if (params.values) for (let key of Object.keys(params.values)) { const value = params.values[key]; @@ -146,11 +148,11 @@ class Haxe extends Sdk { args.push(`-D${key}="${value}"`); } } - const tmpFile = tmp.generateFile(); - const dir = path.dirname(tmpFile.path); - const name = path.basename(tmpFile.path); - args.push(`--app-path=${dir}`); - args.push(`--app-file=${name}`); + const buildDir = path.join(os.tmpdir(), 'build'); + args.push(`--app-path=${buildDir}`); + if (params.outputFile) { + args.push(`--app-file=${params.outputFile}`); + } if (params.version) args.push(`--meta-version=${params.version}`); //if (params.build) args.push(`--haxedef=BUILD="${params.build}"`); args.push(`--haxeflag="--macro CompilationOption.set('build','${params.build}')"`); @@ -166,14 +168,19 @@ class Haxe extends Sdk { } //console.log('haxelib', args.join(' ')); this.haxelib(args).then(() => { - const out = new Vinyl({ - path: params.outputFile, - //contents: fs.createReadStream(`${dir}/flash/bin/${name}.swf`), - contents: fs.readFileSync(`${dir}/flash/bin/${name}.swf`), - }); - out.debug = debug; - stream.push(out); - callback(); + const result = { + 'flash': `${buildDir}/flash/bin/*.swf`, + 'html5': `${buildDir}/html5/bin/**/*`, + }[params.platform]; + vfs.src(result).pipe(through.obj((file, enc, cb) => { + file.debug = debug; + stream.push(file); + cb(); + }, (cb) => { + callback(); + cb(); + })); + //callback(); }).catch((error) => { stream.emit('error', new PluginError({plugin: this.name, message: error})); callback();