続 Google ブックマーク を Sleipnirで利用 (Operaでも可)

GoogleブックマークをSleipnirでうまく使いたかったので ブックマークレットを作ってみた。
SleipnirでGoogleツールバーが使えればこんなものいらないが...

Googleブックマーク 用 ブックマークレット

下のリンクを右クリック [お気に入りに追加] とすることで、現在開いているページを Googleブックマーク に追加するブックマークレットとして動作します。
リンクバーにドラッグでもOKかも

このブックマークレットでは、開いているサイトの情報を使用して、サイト名,URL,ラベル,メモ を一括登録できます。

Bookmarklet for Google Bookmarks - Add Google Bookmarks

• Add Google Bookmarks
• Add Google Bookmarks [PopUp]

動作確認

• Windows XP SP2
  1. Sleipnir 2.6.2 + Internet Explorer 6.0
  2. FireFox 2.0.0.12
  3. Opera 9.26

こっちのページでも公開
Bookmarklet for Google

script.aculo.us の effect

script.aculo.us なんとなくエフェクト使っては見たが、同時に使ったりすると、挙動がおかしい・・・ 放置しておくのもイヤだったので、調べてみたところ、queue オプションでなんとかなりそうだったので、少し使ってみた。

System55hz blog: script.aculo.us effect.js: Queueの使い方

//同時に実行される。
  new Effect.Appear('id',{
    duration :1
  });
  new Effect.SlideDown('id',{
    duration :1
  });

//順番に実行される。
  new Effect.Appear('id',{
    duration :1
  , queue :{position:'end',scope:'scopename',limit:2}
  });
  new Effect.SlideDown('id',{
    duration :1
  , queue :{position:'end',scope:'scopename',limit:2}
  });

使ってみて気づいたのだが、 Effect.Shake で queue が働かない！？（これだけじゃないかも） effects.js の中身確認してみたら、連続でnew Effect.Moveしてるだけか！ しかも、options 渡してないし・・・

どうにも気に入らなかったので、自分で Effect.Shake 書き換えてしまった。 options を少し変えてしまったが、使い勝手は悪くないはず...

動作確認

• Windows XP SP2
  • Internet Explorer 6.0.2900
  • FireFox 2.0.0.11
  • Opera 9.25
  • Safari 3.0.4

/*
  Effect.Shake の処理にバグがあったので、書き直した。
  (整数型の変数が32bit以上という前提で作りました)
  変更：countオプションで Shake する回数を決めることが出来ます。
        ※ 実際は count * (to - from) 回
  変更：x, y オプションで要素を X 及び Y 方向へ移動することができます。
        処理終了後、元の位置に戻ります。
*/
Effect.Shake = Class.create(Effect.Base, {
  initialize: function(element) {
    this.element = $(element);
    if (!this.element) throw(Effect._elementDoesNotExistError);
    var options = Object.extend({
      count:4
      ,x:20
      ,y:0
      ,duration:0.5
    }, arguments[1] || { });
    this.start(options);
  },
  setup: function() {
    this.element.makePositioned();
    this.originalLeft = parseFloat(this.element.getStyle('left') || '0');
    this.originalTop  = parseFloat(this.element.getStyle('top')  || '0');
  },
  update: function(pos) {
    var px = Math.abs((Math.floor(pos*this.options.count*0x20000-0x10000)&0x3ffff)-0x20000)-0x10000;
    this.element.setStyle({
//      left: (this.options.x * px / 0x10000 + this.originalLeft).round() + 'px'
//      ,top: (this.options.y * px / 0x10000 + this.originalTop).round()  + 'px'
      left: (((this.options.x * px) >> 16) + this.originalLeft).round() + 'px'
      ,top: (((this.options.y * px) >> 16) + this.originalTop).round()  + 'px'
    });
  },
  finish: function(pos) {
    this.element.setStyle({
      left: this.originalLeft + 'px'
      ,top: this.originalTop  + 'px'
    });
  }
});

↑を使用したサンプルコード

  new Effect.Shake('id',{
    queue :{position:'end',scope:'scopename',limit:3}
  });
  new Effect.Shake('id',{
    count:8,    // Shake する回数
    x:0,        // X 方向の移動距離
    y:20,       // Y 方向の移動距離
    queue :{position:'end',scope:'scopename',limit:3}
  });
  new Effect.Shake('id',{
    count:4,    // Shake する回数
    x:20,       // X 方向の移動距離
    y:-5,       // Y 方向の移動距離
    // Effect.Base を継承しているので DefaultOptions も設定可能
    duration:4, // 処理時間
    queue :{position:'end',scope:'scopename',limit:3}
  });

特に問題が無ければ、このコード、 script.aculo.us に送ってみようかとも思ったが、英語が分からない・・・

IE7.js 使ってみた

IEでW3C標準っぽい、レイアウトが出来るらしいとこのとで、試してみた。

IE7.js

<!--[if lt IE 8]>
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta)/IE8.js" type="text/javascript"></script>
<![endif]-->

をHTML内に書き込み、IE6使ってローカルで表示してみたが...右に寄ってしまって余計に崩れた !!ﾟдﾟ）とりあえず、当分は使用せずに様子見することにする。