Mootools 1.4へのアップグレード　noobSlide編

サイトで使っているJavaScriptは基本的にMootoolsを使っています。
今まで1.3.xを使ってきたわけですが、ここで1.4.x系にアップデートしてみようと思ったわけです。

JavaScriptライブラリのアップデートは結構勇気が入ります。特にメジャーバージョンアップだのしていると特に。実装されていた命令の名前が変わっていたりするからです。

私はMootoolsで動作するプラグインをいくつか使用しているのですが、今回はその一つ、noobSlideの1.4対応についてお話します。

Mootoolsでソースをダウンロードするとき、1.2系と1.3系をコンパチしてくれるオプションがありますが、今回はあえてそのオプションは使わないことにします。

noobSlideの場合、問題となるのは2箇所。以下のメソッドを使っているところです。

• $extend()
• $clear()

$extend()は第1引数のオブジェクトに第2引数をマージするのですが、同じ名前のプロパティを上書きしない、つまり増えたプロパティだけ拡張するというものらしいです。
http://docs111.mootools.net/#$extend

これは、1.4ではObject.append()というメソッドに置き換えられます。
http://mootools.net/docs/core/Core/Core#Deprecated-Functions:extend
http://mootools.net/docs/core/Types/Object#Object:Object-append

なので、_class.noobSlide.jsの107行目は以下のように書き換えます。

this.fx = new Fx.Tween(this.box,$extend((params.fxOptions||{duration:500,wait:false}),{property:this.modes[this.mode][0]}));
↓変更
this.fx = new Fx.Tween(this.box,Object.append((params.fxOptions||{duration:500,wait:false}),{property:this.modes[this.mode][0]}));

もう一つは$clear()。
これはclearTimeout()関数に置き換えるようにとのこと。JavaScriptのネイティブ関数ですね。
http://mootools.net/docs/core/Core/Core#Deprecated-Functions:clear

で、_class.noobSlide.jsの147行目は以下のように書き換えます。

$clear(this._play);
↓変更
clearTimeout(this._play);

これで一応動くみたいです。

---

I use JavaScript based on Mootools for this site. I had been using version 1.3.x, and now decided to update it to 1.4.x.

Updating JavaScript Library is really troublesome job, isn’t it? Especially, the command names are sometimes unavailable by changing when major version is updated.

I’m using some plugins for Mootools, this time this is the story to migrate to 1.4.x for one of them, noobSlide.

Downloading source from Mootools website, you can choose the option to download compatible source of 1.2 and 1.3, but I don’t choose it this time.

So, the following two methods are problems on noobSlide:

• $extend()
• $clear()

Please get detail about $extend() from the following URL.
http://docs111.mootools.net/#$extend

And, you have to use Object.append() instead of it on 1.4.
http://mootools.net/docs/core/Core/Core#Deprecated-Functions:extend
http://mootools.net/docs/core/Types/Object#Object:Object-append

So line 107 on _class.noobSlide.js will be changed like the following:

this.fx = new Fx.Tween(this.box,$extend((params.fxOptions||{duration:500,wait:false}),{property:this.modes[this.mode][0]}));
// Change to the following:
this.fx = new Fx.Tween(this.box,Object.append((params.fxOptions||{duration:500,wait:false}),{property:this.modes[this.mode][0]}));

The other is $clear(). You can use clearTimeout(), the native JavaScript method, instead of it. Please get detail from the following URL.
http://mootools.net/docs/core/Core/Core#Deprecated-Functions:clear

And, line 147 on _class.noobSlide.js will be changed like the following:

$clear(this._play);
// Change to the following:
clearTimeout(this._play);

And noobSlide looks moving correctly.

• 前へ
• 次へ