Edit | History | Print | Changes | AllChanges
Edit Title | Edit TopBar | Logout


Using Example

Scriptaculous의 dragdrop.js를 동적으로 호출하기

//Include dragdrop.js on action
var Draggable = function(element, options) {
    new Include('dragdrop.js', function(){
        new Draggable(element, options);
    });  
};

'Draggable' 이라는 함수를 미리 선언했다. 이 함수는 dragdrop.js의 Core class이름과 동일하다. 만약 어딘가에서 'Draggable' Class를 작동시키면 'dragdrop.js'파일이 로드되고 작동시킨 함수는 onComplete이벤트에 의해 실행되며 위에서 미리 선언한 함수는 'dragdrop.js' 원래의 Class로 Override되는 구조이다.

모두 override 하자!

var FishEye = function(element) {
    new Include('fisheye.js', function(){
        new FishEye(element);
    });
};
var CMotion = function(element){
    new Include('cmotion.js', function() {
        new CMotion(element);
    });
};
var Favicon = function(element){
    new Include('favicons.js', function() {
        new Favicon(element);
    });
};

조건이 만족하는 경우에만 호출하기

if ($$('pre code').length) {
    new Include('syntax.js, syntax.css');
}

Option Example

options에 기본경로명을 설정 할 수 있다.

new Include('1.js, 2.css, /js/3.js, 4.css, 5.js', {
    JSPath : 'http://js.com/',
    CSSPath : '/css/'
});
// -> 1.js = 'http://js.com/1.js'
// -> 2.css = '/css/2.css'
// -> 3.js = '/js/3.js/'
// -> 4.css = '/css/4.css/'
// -> 5.js = 'http://js.com/5.js'

duplicate option:

new Include('fileName.js', { duplicate : true });

'boolean' 속성이며 'true'로 설정할 경우 중복으로 로드하는 것을 검사하지 않음(기본 false)

현재 page에 load 된 file들의 배열을 반환

Include.all;
// -> ["SCRIPT tag(4)", "LINK tag(2)", script prototype.js, script effects.js, script extentions.js, script include.js, link, link]
Include.javascripts;
// -> ["SCRIPT tag(4)", script prototype.js, script effects.js, script extentions.js, script include.js]
Include.stylesheets;
// -> ["LINK tag(2)", link, link]