[node.js] [gulp] gulpfileを晒してみる。

  • 2017-03-31更新
    • debuggerの問題で出力フォルダをルートフォルダに変更した。
    • firefox debugger が上手くソースマップ拾わないねん……

忘備録も兼ねて、typescript + cson でゲーム開発用のgulpfileを晒しておきます。

VSCodeでコンパイル、デバッグすることを前提にしています。

フォルダ構成は以下の通り

  • /src - typescriptのフォルダ
  • /cson - csonのフォルダ。assetデータ、jsonデータ用。
  • /dest - 出力先フォルダ
    • 出力フォルダはルートフォルダへ
var gulp = require('gulp')
var cson = require('gulp-cson')
var ts   = require('gulp-typescript');
var sourcemaps = require('gulp-sourcemaps');

// typescript
gulp.task('ts', () => {
    gulp.src('src/**/*.ts')
        .pipe(sourcemaps.init())
        .pipe(ts({
            target: "es6",
            module: "system",
            outFile: "app.js"
        }))
        .pipe(sourcemaps.write('.'))
        .pipe(gulp.dest('.'));
});

// cson
gulp.task('asset', () => {
    gulp.src('cson/*.cson')
        .pipe(cson())
        .pipe(gulp.dest('dest/asset'));
});

// default
gulp.task('default', ['ts', 'asset']);

[pixi.js] [javascript] PIXI.Cointainerに"added"と"removed"がイベントが存在していたお話。

突然の描画用javascriptフレームワーク、pixi.js の話題です。

早速なのですが、PIXI.Containerに子の要素を追加したり削除したりするときに、その子に対してイベントが発生するのはご存知でしょうか。

pixi.jsのソースコードを眺めてたらわかることなのですが、マニュアルには書かれておらず便利なので共有しておきます。私もたまたま見つけました。

let a = new PIXI.Container();

let b = new PIXI.Container();
b.on("added", () => {
    // 子要素として追加されたときにemitされる。
    console.log("added.") 
})
b.on("removed", () => {
    // 子要素から外されるとemitされる。
    console.log("removed")
});

a.addChild(b)  // "added" が emit される。 
a.removeChild(b) // "removed" が emit される。

ActionScriptなどにはあった挙動だと思うのですが、初期化のタイミングを子要素に追加された時に出来るなど使いみちが色々じゃないかなと。

Node.js で Discord の bot を作ってみたお話。

ちょっとしたきっかけでDiscordのbotを作ってみました。

↓こんな感じのもの。

ちぇんちゃんが入退室お知らせしてくれる。

返信よるコマンド機能とか

Botの作り方は別の記事で書くとして、とりあえず紹介として今回利用した環境は以下の感じ。

javascriptとNode.jsの知識があれば割りとすぐに出来る感じです。

  • 1