2015年4月
      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30    
無料ブログはココログ

« 手書き要素の配置換えを「ちょっとだけ」便利にするシール | トップページ | 「なるほど」と、シールのアイコンを直す »

2013年11月 2日 (土)

配置換え支援「定着シール」、修正:付箋と併用できます

「定着シール」、ちょっとだけ不備と考慮不足があったので、修正しました。

既にダウンロードした方で、使い続けそうならダウンロードし直してください。ダウンロード元ファイル自体を更新していますので、前回記事からダウンロードしても更新できます。

(2014/8/24 : MOONPhase v.2.10.0 対応済み)

Download : [定着シール]

修正内容

一つは、連続して実行した場合を考慮していなかったこと。

「定着シール」を実行すると、各シール上のストロークをページ本体に転写して、シール上のストロークは色を変えてぼかしてしまうのですが、ここで再度「定着シール」を実行すると、ぼかしたストロークをさらにページ本体に転写してしまって、何がなんだかわからなくなってしまいました。

このような事態にならないように、一度処理されたシールのストロークは、処理対象から除くようにしました。

もう一つの修正点は、背景画像を使っているシールと画像のないシールを区別しないようにしたこと。

これは、たとえば web から切り取った画像をシールにしている場合などは、シール上のストロークを「定着」させない方がよいと思ってのことだったのですが、該当する場合が少なく、むしろ手書きの文字・イラストをラベルにしたシールのストロークを「定着」させてしまう欠点を全く回避できていない以上、意味のないこだわりでした。

区別を外したからといって、欠点は治らないのですが、利点は増えました。@shi3z 社長謹製 : -) の「付箋シール」 と併用可能になりました。付箋シールを貼って、そのうえにいろいろ書いて、定着シールでページ本体に残せます。あとで剥がすつもりで付箋に書いたけれど、やっぱり残しておきたくなったというときに使えます。

…と、いうか、付箋と併用したくなったので、背景画像を区別しないように修正したというのが実情です。

使用例

まず、付箋シールを貼ります。

Fixstrokes01

付箋に何か書きます。

Fixstrokes02

剥がすつもりだった付箋の内容を残しておきたくなったら、残したい場所に付箋を移動させて、

Fixstrokes03

「定着シール」を実行すると、付箋(や他のシール)の、処理されたストロークがぼやけます。

Fixstrokes04

付箋を剥がすと、ストロークはページ本体に「定着」しています。

Fixstrokes05

最後にコードを晒します

importJS(["lib/MOON.js", "main.js"], function() {

    var BLUR_WIDTH_RATE = 10;
    var BLUR_COLOR = MOON.rgba2int( 220,220,220,220 );

    function makeShiftedStrokes( org_strokes, shift_x, shift_y ) {

        var strokes, a_stroke, src_stroke;
        strokes = [];

        for( var i = 0, j = org_strokes.length; i < j; i++ ) {
            src_stroke = org_strokes[ i ];
            if ( src_stroke.color != BLUR_COLOR ) {
                a_stroke = {
                  width:src_stroke.width,
                  color:src_stroke.color,
                  type:"pen", data:[]
                };
                for( var k = 0, l = src_stroke.data.length - 2; k < l; k = k + 3 ) {
                    a_stroke.data.push( src_stroke.data[ k ] + shift_x );
                    a_stroke.data.push( src_stroke.data[ k + 1 ] + shift_y );
                    a_stroke.data.push( src_stroke.data[ k + 2 ] );
                }
                strokes.push( a_stroke );
            }
        }
        return strokes;
    }

    function blurStrokes( org_strokes ) {
        for( var i = 0, j = org_strokes.length; i < j; i++ ) {
            if ( org_strokes[ i ].color != BLUR_COLOR ) {
                org_strokes[ i ].width = org_strokes[ i ].width * BLUR_WIDTH_RATE;
                org_strokes[ i ].color = BLUR_COLOR;
            }
        }
        return org_strokes;
    }


    var sticker = Sticker.create();

    sticker.ontap = function(event) {
        var currentPage = MOON.getCurrentPage();
        var paperJSON = MOON.getPaperJSON( currentPage.backing );
        var aggregatedStrokes = [];

        var stickers = currentPage.papers;
        var stickerJSON;
        for ( var i = 0, j = stickers.length; i < j; i++ ) {
            stickerJSON = MOON.getPaperJSON( stickers[ i ] );
            aggregatedStrokes = aggregatedStrokes.concat( makeShiftedStrokes( stickerJSON.strokes, stickerJSON.x, stickerJSON.y ) );

            stickerJSON.strokes = blurStrokes( stickerJSON.strokes );
            MOON.setPaperJSON( stickers[ i ], stickerJSON );
        }

        paperJSON.strokes = paperJSON.strokes.concat( aggregatedStrokes );
        MOON.setPaperJSON( currentPage.backing, paperJSON );

        MOON.finish();
    };

    sticker.onattach = function(event) {
        MOON.finish();
    };

    sticker.ondetach = function(event) {
        MOON.finish();
    };

    sticker.register();
});

« 手書き要素の配置換えを「ちょっとだけ」便利にするシール | トップページ | 「なるほど」と、シールのアイコンを直す »

enchantMOON」カテゴリの記事

コメント

コメントを書く

(ウェブ上には掲載しません)

トラックバック

この記事のトラックバックURL:
http://app.f.cocolog-nifty.com/t/trackback/1527616/53801524

この記事へのトラックバック一覧です: 配置換え支援「定着シール」、修正:付箋と併用できます:

« 手書き要素の配置換えを「ちょっとだけ」便利にするシール | トップページ | 「なるほど」と、シールのアイコンを直す »