1

これは、私が投稿した以前の質問と大まかに関連していますが、別の画像編集ライブラリ ( Pixasticではなく CamanJS) とコードが多少リファクタリングされています。

changifyHTML5 画像キャンバスを元の状態に戻してから、いくつかの事前設定された変更を実行する関数を作成しようとしています。imageClipNameというリストから右のキャンバス要素をロードするこのコードは、次のようcamanCacheに機能します。

changify = (imageClipName) ->
    camanCache[imageClipName].revert ->
        camanCache[imageClipName]
            .brightness(10)
            .contrast(10)
            .noise(10)
            .render()
    console.log(camanCache[imageClipName])

しかし、私が望むのは、呼び出された別のリストから保存されたプリセットの変更を見つけ、imageValuesそのリストのキーと値のペアから画像関数の変更の文字列を動的に作成することです。これが私がやろうとしたことですが、失敗します：

imageClipName = "image_1"
imageValues = {image_1:{brightness: 10, contrast: 10, noise: 10}, image_2:{...}...}

changify = (imageClipName) ->
    camanCache[imageClipName].revert ->
        camanCache[imageClipName]
            for o in imageValues when o.id == imageClipName
                for key, val of o
                    .#{key}(val)
            .render()

これにより、changify関数 ( ) の 3 行目で coffeescript 構文エラーが発生しますが、複数の関数を に追加する場合には機能しないUnexpected 'INDENT'と思われます。コーヒースクリプトでこのような関数呼び出しを動的にストリングする方法は?.#{key}(val)camanCache[imageClipName]

4

1 に答える 1

2

私はあなたがこれをやろうとしていると思います:

changify = (imageClipName) ->
    camanCache[imageClipName].revert -> 
        clip = camanCache[imageClipName]
        for id, methods of imageValues when id == imageClipName
            for name, arg of methods
                clip = clip[name](arg)
            clip.render()

for ... ofオブジェクトを繰り返し処理しているため、外側のループのto への切り替えfor ... inは、CoffeeScript の配列用であることに注意してください。

したがって、これを考えると：

{brightness: 10, contrast: 10, noise: 10}

でmethods、このループ:

clip = camanCache[imageClipName]
for name, arg of methods
    clip = clip[name](arg)
clip.render()

次と同じ効果があります。

camanCache[imageClipName].brightness(10).contrast(10).noise(10).render()

key, valオブジェクトを繰り返し処理するときのペアの順序はo定義されていないため、brightness、contrast、およびnoise呼び出しの順序は保証されません。特定の順序でそれらが必要な場合は、次の配列を使用する必要がありますmethods。

imageValues = {image_1: [['brightness', 10], ['contrast', 10], ['noise', 10]], ... }

changify = (imageClipName) ->
    camanCache[imageClipName].revert -> 
        clip = camanCache[imageClipName]
        for id, methods of imageValues when id == imageClipName
            for method in methods
                clip = clip[method[0]](method[1])
            clip.render()

または少し良い：

imageValues = {image_1: [ {name: 'brightness', arg: 10}, {name: 'contrast', arg: 10}, {name: 'noise', arg: 10}], ... }

changify = (imageClipName) ->
    camanCache[imageClipName].revert -> 
        clip = camanCache[imageClipName]
        for id, methods of imageValues when id == imageClipName
            for method in methods
                clip = clip[method.name](method.arg)
            clip.render()
于 2012-11-06T19:01:24.787 に答える