2013年8月8日木曜日

enchant MOON の MOON.js を見てみる

めんどいので API だけ羅列します。 気になる人は MOON.js 読んでください。別にそんな長くない。
  • html5CanvasToSerializableObject(canvas)
    HTML5 の canvas オブジェクトを渡すと pixel データを文字列にしたオブジェクトが返ってくる

  • serializableObjectToHtml5Canvas(object)
    html5CanvasToSerializableObject() で作成したオブジェクトを渡すと、HTML5 の canvas オブジェクトが返ってくる

  • loadData(src, callback)
    src で指定した URL を XMLHttpRequest を使って GET アクセスし、結果の responseText を callback に渡す importJS(["lib/MOON.js"], function() { MOON.loadData(url, function(code) { eval(code); MOON.finish(); }.bind(this)); });

  • alert(message, callback)
    message を表示したアラートを出す
    callback を渡して内部で MOON.finish() を呼ばないといけないとかなんとか。。。 importJS(["lib/MOON.js"], function() { var sticker = Sticker.create(); sticker.ontap = function() { MOON.alert("Hello MOON", function() { MOON.finish(); }); MOON.finish(); }; sticker.onattach = function() { MOON.finish(); }; sticker.ondetach = function() { MOON.finish(); }; sticker.register(); });

  • penPrompt(message, callback)
    手書き入力用のプロンプトがついたアラートを出す importJS(["lib/MOON.js"], function() { var sticker = Sticker.create(); sticker.ontap = function() { MOON.penPrompt("Hello MOON", function(input) { MOON.alert(input, function() { MOON.finish(); }); }); MOON.finish(); }; sticker.onattach = function() { MOON.finish(); }; sticker.ondetach = function() { MOON.finish(); }; sticker.register(); }); こんなん。プロンプト上にペンで文字を書くと認識して変換してくれる。
    文字でかくて4文字しか書けんぞ。。。




  • openStickerPage(callback)
    シール台帳を開く
    (ちなみにページのどこかを長押しするとシール台帳が開くようになっている)
    callback には選択したシール画像のパスが返ってくるらしい

    どのシールを選択しても返ってくるパスが /nullimages/sticker1.png 固定でよくわからん。。。 importJS(["lib/MOON.js"], function() { var sticker = Sticker.create(); sticker.ontap = function() { MOON.openStickerPage(function(path) { MOON.alert(path, function() { MOON.finish(); }); }); MOON.finish(); }; sticker.onattach = function() { MOON.finish(); }; sticker.ondetach = function() { MOON.finish(); }; sticker.register(); });

  • openNotebook(callback)
    ページ一覧を開く
    (ちなみにページでピンチアウトするとページ一覧が開くようになっている)
    callback には選択したページのIDが返ってくるらしい

    Invalid Script もなくページ選択画面になるのだが、ページを選択すると画面が真っ暗になって うんともすんともいわなくなる。。。
    こうなると再起動するしかない。。。 importJS(["lib/MOON.js"], function() { var sticker = Sticker.create(); sticker.ontap = function() { MOON.openNotebook(function(pageId) { MOON.finish(); }); MOON.finish(); }; sticker.onattach = function() { MOON.finish(); }; sticker.ondetach = function() { MOON.finish(); }; sticker.register(); });

  • uploadCurrentPageToEvernote(onsuccess, onfailure)
    Evernote に現在のページをアップロードする

  • getPageThumbnail(pageId)
    指定したページIDのページのサムネイルが canvas オブジェクトとして返ってくる

  • getEditPaperThumbnail()
    現在のページ(たぶん)のサムネイルが canvas オブジェクトとして返ってくる

  • createAPIBind()
    以下の API を MOON 以下に割り当てるのに使っている





  • peel()
    そのシールをはがす

  • finish()
    MOON を終了するっぽいことだけはなんとなくわかる

  • openUrl(url)
    ブラウザで url を開く importJS(["lib/MOON.js"], function() { var sticker = Sticker.create(); sticker.ontap = function() { MOON.openUrl("http://www.google.co.jp"); MOON.finish(); }; sticker.onattach = function() { MOON.finish(); }; sticker.ondetach = function() { MOON.finish(); }; sticker.register(); });

  • openPage(pageId)
    ページを開く importJS(["lib/MOON.js"], function() { var sticker = Sticker.create(); sticker.ontap = function() { MOON.openPage("iZjSL9Ve1375584059045"); MOON.finish(); }; sticker.onattach = function() { MOON.finish(); }; sticker.ondetach = function() { MOON.finish(); }; sticker.register(); });

  • setPenColor(red, green, blue, alpha)
    ペンの色を変える
    red, green, blue, alpha は 0 〜 255 までの整数 importJS(["lib/MOON.js"], function() { var sticker = Sticker.create(); sticker.ontap = function() { var red = 255; var green = 102; var blue = 95; var alpha = 255; MOON.setPenColor(red, green, blue, alpha); MOON.finish(); }; sticker.onattach = function() { MOON.finish(); }; sticker.ondetach = function() { MOON.finish(); }; sticker.register(); }); 背景色や描画色は rgba 合わさった値が入っている var page = MOON.getCurrentPage(); var backing = page.backing; var paper = MOON.getPaperJSON(backing); // 背景色を取得する var color = paper.color; var transparent = paper.transparent; // color には #aarrggbb を10進数に直した値がはいっている 例)-16777216 = 0xff000000, -1 = 0xffffffff

  • setPenWidth(width)
    ペンの太さ(筆圧に対する倍率)を変える importJS(["lib/MOON.js"], function() { var sticker = Sticker.create(); sticker.ontap = function() { MOON.setPenWidth(5.0); MOON.finish(); }; sticker.onattach = function() { MOON.finish(); }; sticker.ondetach = function() { MOON.finish(); }; sticker.register(); });

  • getCurrentPage()
    現在のページのオブジェクトが返ってくる { backing:"DC9g1Jkj1375584059045", papers:"GOXracRB1375753891252" } backing にはストローク情報のID、papers にはシールIDが入っているもよう
    /Data/MyNotebook1/[現在のページのID]/info.json の内容と同じっぽいが、 info.json では "stickers" だったのが "papers" になってる importJS(["lib/MOON.js"], function() { var sticker = Sticker.create(); sticker.ontap = function() { var page = MOON.getCurrentPage(); MOON.finish(); }; sticker.onattach = function() { MOON.finish(); }; sticker.ondetach = function() { MOON.finish(); }; sticker.register(); });

  • setCurrentPage(page?)
    よくわからないけど、現在のページを変更する?



  • getPaperJSON(pageId)
    指定したストローク情報IDに対応するストローク情報が返ってくる

    /Data/MyNotebook1/[現在のページのID]/[ストローク情報ID]/info.json の内容っぽい { version:"0.2", x:0, y:0, width:768, height:1024, scale:1.0, color:-16777216, transparent:false, strokes:[{"width":2.5,"color":-1,"type":"pen","data":[...]}, ...] } importJS(["lib/MOON.js"], function() { var sticker = Sticker.create(); sticker.ontap = function() { var page = MOON.getCurrentPage(); var backing = page.backing; var paper = MOON.getPaperJSON(backing); var version = paper.version; var x = paper.x; var y = paper.y; var width = paper.width; var height = paper.height; var scale = paper.scale; var color = paper.color; var transparent = paper.transparent; var strokes = paper.strokes; MOON.finish(); }; sticker.onattach = function() { MOON.finish(); }; sticker.ondetach = function() { MOON.finish(); }; sticker.register(); });

  • setPagerJSON(backing, paperJSON)
    ストローク情報を書き換える importJS(["lib/MOON.js"], function() { var sticker = Sticker.create(); sticker.ontap = function() { var page = MOON.getCurrentPage(); var backing = page.backing; var paper = MOON.getPaperJSON(backing); // paper のプロパティを変更する paper.color = -6710887; // 背景色を #ff666666 にする MOON.setPaperJSON(backing, JSON.stringify(paper)); MOON.finish(); }; sticker.onattach = function() { MOON.finish(); }; sticker.ondetach = function() { MOON.finish(); }; sticker.register(); });

  • getImagePath(?)
    よくわからない



  • searchWeb(query)
    ブラウザを開いて検索する importJS(["lib/MOON.js"], function() { var sticker = Sticker.create(); sticker.ontap = function() { MOON.searchWeb("enchant MOON"); MOON.finish(); }; sticker.onattach = function() { MOON.finish(); }; sticker.ondetach = function() { MOON.finish(); }; sticker.register(); });

  • searchStorage(filter)
    各ノートの storage.json を検索する importJS(["lib/MOON.js"], function() { var sticker = Sticker.create(); sticker.ontap = function() { // storage.json に fav:1 が入っているノートをピックアップする // function の引数には各ノートの storage.json をオブジェクト化したものが入っている MOON.searchStorage("function matches(j){return j[\'fav\'] > 0;}"); MOON.finish(); }; sticker.onattach = function() { MOON.finish(); }; sticker.ondetach = function() { MOON.finish(); }; sticker.register(); }); storage.json にプロパティを追加するには localStorage オブジェクトを使う localStorage['fav'] = 1;

  • showParticle(particle?)
    showParticles() との違いがよくわからない

  • showParticles(particles)
    パーティクルを表示する
    particles は配列で x, y, vx, vy, ?, x, y, vx, vy, ?, ... のようにデータを入れる
    5番目がわからない。フレーム数?時間?距離? importJS(["lib/MOON.js"], function() { var sticker = Sticker.create(); sticker.ontap = function() { var page = MOON.getCurrentPage(); var backing = page.backing; var paper = MOON.getPaperJSON(backing); var x = paper.width / 2; var y = paper.height / 2; var particles = []; for (var i = 0; i < 10; i++) { particles.push(x + i, y + i, 0.1, 0.1, 40); } MOON.showParticles(particles); MOON.finish(); }; sticker.onattach = function() { MOON.finish(); }; sticker.ondetach = function() { MOON.finish(); }; sticker.register(); });

  • recognizeStrokes(?)
    よくわからない



0 件のコメント:

コメントを投稿