Core
Native
Class
Element
Utilities
Fx
Request
Plugins
- Fx.Slide
- Fx.Scroll
- Fx.Elements
- Drag
- Drag.Move
- Color
- Group
- Hash.Cookie
- Sortables
- Tips
- SmoothScroll
- Slider
- Scroller
- Assets
- Accordion
ある関数の処理が完了してから次の関数を開始する、といった具合に関数を順番に実行するときに役立つクラスです。 このメソッドはどんなクラスにでもClass:implementを用いて実装することができ、FxとRequestにはすでに実装されています。 例えばFxにおいては、複雑なカスタムアニメーションを作るのに使われています。
var MyClass = new Class({ Implements: Chain });
MyClass.implement(Chain);
var myChain = new Chain;
var Todo = new Class({ Implements: Chain, initialize: function(){ this.chain.apply(this, arguments); } }); var myTodoList = new Todo( function(){ alert('get groceries'); }, function(){ alert('go workout'); }, function(){ alert('code mootools documentation until eyes close involuntarily'); }, function(){ alert('sleep'); } );
Chainインスタンスの関数呼び出し命令の最後に関数を付け加えます。
myClass.chain(fn[, fn2[, fn3[, ...]]]);
//Fx.TweenはFxクラスを継承しているため、すでにChainクラスを実装しています。 var myFx = new Fx.Tween('myElement', 'opacity'); myFx.start(1,0).chain( //'this'が呼び出し側のオブジェクトを参照していることに注意(この場合は、myFxオブジェクト) function(){ this.start(0,1); }, function(){ this.start(1,0); }, function(){ this.start(0,1); } ); //フェイードアウト、フェードインを二回繰り返します。
Chainインスタンスの最初の関数を削除し、実行します。次の関数が配列の最初になります。
myClass.callChain([any arguments]);
var myChain = new Chain(); myChain.chain( function(){ alert('do dishes'); }, function(){ alert('put away clean dishes'); } ); myChain.callChain(); //アラート 'do dishes'. myChain.callChain(); //アラート 'put away clean dishes'.
Chainインスタンスの処理命令を空っぽにします。
myClass.clearChain();
var myFx = Fx.Tween('myElement', 'color'); //Fx.TweenはFxを継承しているため、Chainの機能を実装しています。 myFx.chain(function(){ while(true) alert("D'oh!"); }); //アラートの無限ループ。 myFx.clearChain(); //アラートの無限ループが始まる前に、それをキャンセル。
便利なクラスです。このクラスのメソッドはどんなクラスでもClass:implementによって実装できます。 例えばFxにおいて、このクラスは'complete'、 'start'、 'cancel'のようなFxイベントに対していくつでも関数を追加できるようにするために使われています。 Eventsを実装したクラスのイベントは、オプションかaddEventで追加しなくてはならず、'.options.onEventName'で直接追加してはいけません。
var MyClass = new Class({ Implements: Events });
MyClass.implement(Events);
var Widget = new Class({ Implements: Events, initialize: function(element){ // ... }, complete: function(){ this.fireEvent('complete'); } }); var myWidget = new Widget(); myWidget.addEvent('complete', myFunction);
クラスインスタンスのイベント一覧にイベントを加えます。
myClass.addEvent(type, fn[, internal]);
var myFx = new Fx.Tween('element', 'opacity'); myFx.addEvent('start', myStartFunction);
addEventと同じですが、一度に複数のイベントを追加できます。
myClass.addEvents(events);
var myFx = new Fx.Tween('element', 'opacity'); myFx.addEvents({ 'start': myStartFunction, 'complete': function() { alert('Done.'); } });
クラスインスタンス内の特定のタイプのイベントをすべて発生させます。
myClass.fireEvent(type[, args[, delay]]);
var Widget = new Class({ Implements: Events, initialize: function(arg1, arg2){ //... this.fireEvent("initialize", [arg1, arg2], 50); } });
クラスインスタンスからイベントを削除します。
myClass.removeEvent(type, fn);
クラスインスタンスから指定したタイプのイベントをすべて削除します。タイプがしていされていなければ、すべてのイベントが削除されます。
myClass.removeEvents([events]);
var myFx = new Fx.Tween('myElement', 'opacity'); myFx.removeEvents('complete');
役に立つクラスです。このメソッドはClass:implementを用いて、どんなにクラスでも実装できます。 クラスインスタンスのオプション設定を自動化できます。 クラスイベントも追加でき、その場合はオプションのプロパティを'on'ではじめ、次の文字を大文字にします (e.g. 'onComplete'は'complete'イベントを追加します)。
var MyClass = new Class({Implements: Options});
MyClass.implement(Options);
クラスのオプションに渡されたオプションを追加します。
myClass.setOptions([options]);
var Widget = new Class({ Implements: Options, options: { color: '#fff', size: { width: 100, height: 100 } }, initialize: function(options){ this.setOptions(options); } }); var myWidget = new Widget({ color: '#f00', size: { width: 200 } }); //myWidget.optionsの現在値: {color: #f00, size: {width: 200, height: 100}}
このドキュメントはMooToolsのドキュメントを元に高橋文樹が翻訳(ちょっと改変)しました。
本家と同じく、Attribution-NonCommercial-ShareAlike 3.0ライセンスで公表されています。