From 21ed602531cbceff3e92e4ac33484f44ed2b6848 Mon Sep 17 00:00:00 2001 From: Adrian Lang Date: Tue, 1 Dec 2009 12:50:19 +0100 Subject: Factor out timer and delay management darcs-hash:20091201115019-e4919-fe83e3d69eb997d0c04064b46117690824fe4daf.gz --- lib/exe/js.php | 2 +- lib/scripts/ajax.js | 104 +++++++++++++++++++++------------------------------ lib/scripts/delay.js | 69 ++++++++++++++++++++++++++++++++++ 3 files changed, 112 insertions(+), 63 deletions(-) create mode 100644 lib/scripts/delay.js diff --git a/lib/exe/js.php b/lib/exe/js.php index 5be4d2b6b..38fda1789 100644 --- a/lib/exe/js.php +++ b/lib/exe/js.php @@ -41,6 +41,7 @@ function js_out(){ $files = array( DOKU_INC.'lib/scripts/helpers.js', DOKU_INC.'lib/scripts/events.js', + DOKU_INC.'lib/scripts/delay.js', DOKU_INC.'lib/scripts/cookie.js', DOKU_INC.'lib/scripts/script.js', DOKU_INC.'lib/scripts/tw-sack.js', @@ -106,7 +107,6 @@ function js_out(){ // init stuff - js_runonstart("ajax_qsearch.init('qsearch__in','qsearch__out')"); js_runonstart("addEvent(document,'click',closePopups)"); js_runonstart('addTocToggle()'); js_runonstart("initSizeCtl('size__ctl','wiki__text')"); diff --git a/lib/scripts/ajax.js b/lib/scripts/ajax.js index a2a48a996..de009d448 100644 --- a/lib/scripts/ajax.js +++ b/lib/scripts/ajax.js @@ -1,68 +1,48 @@ /** * AJAX functions for the pagename quicksearch * - * We're using a global object with self referencing methods - * here to make callbacks work - * * @license GPL2 (http://www.gnu.org/licenses/gpl.html) * @author Andreas Gohr + * @author Adrian Lang */ - -//prepare class -function ajax_qsearch_class(){ - this.sack = null; - this.inObj = null; - this.outObj = null; - this.timer = null; -} - -//create global object and add functions -var ajax_qsearch = new ajax_qsearch_class(); -ajax_qsearch.sack = new sack(DOKU_BASE + 'lib/exe/ajax.php'); -ajax_qsearch.sack.AjaxFailedAlert = ''; -ajax_qsearch.sack.encodeURIString = false; - -ajax_qsearch.init = function(inID,outID){ - ajax_qsearch.inObj = document.getElementById(inID); - ajax_qsearch.outObj = document.getElementById(outID); - - // objects found? - if(ajax_qsearch.inObj === null){ return; } - if(ajax_qsearch.outObj === null){ return; } - - // attach eventhandler to search field - addEvent(ajax_qsearch.inObj,'keyup',ajax_qsearch.call); - - // attach eventhandler to output field - addEvent(ajax_qsearch.outObj,'click',function(){ ajax_qsearch.outObj.style.display='none'; }); -}; - -ajax_qsearch.clear = function(){ - ajax_qsearch.outObj.style.display = 'none'; - ajax_qsearch.outObj.innerHTML = ''; - if(ajax_qsearch.timer !== null){ - window.clearTimeout(ajax_qsearch.timer); - ajax_qsearch.timer = null; - } -}; - -ajax_qsearch.exec = function(){ - ajax_qsearch.clear(); - var value = ajax_qsearch.inObj.value; - if(value === ''){ return; } - ajax_qsearch.sack.runAJAX('call=qsearch&q='+encodeURI(value)); -}; - -ajax_qsearch.sack.onCompletion = function(){ - var data = ajax_qsearch.sack.response; - if(data === ''){ return; } - - ajax_qsearch.outObj.innerHTML = data; - ajax_qsearch.outObj.style.display = 'block'; -}; - -ajax_qsearch.call = function(){ - ajax_qsearch.clear(); - ajax_qsearch.timer = window.setTimeout("ajax_qsearch.exec()",500); -}; - +addInitEvent(function () { + + var inID = 'qsearch__in'; + var outID = 'qsearch__out'; + + var inObj = document.getElementById(inID); + var outObj = document.getElementById(outID); + + // objects found? + if (inObj === null){ return; } + if (outObj === null){ return; } + + function clear_results(){ + outObj.style.display = 'none'; + outObj.innerHTML = ''; + } + + var sack_obj = new sack(DOKU_BASE + 'lib/exe/ajax.php'); + sack_obj.AjaxFailedAlert = ''; + sack_obj.encodeURIString = false; + sack_obj.onCompletion = function () { + var data = sack_obj.response; + if (data === '') { return; } + + outObj.innerHTML = data; + outObj.style.display = 'block'; + }; + + // attach eventhandler to search field + var delay = new Delay(function () { + clear_results(); + var value = inObj.value; + if(value === ''){ return; } + sack_obj.runAJAX('call=qsearch&q=' + encodeURI(value)); + }); + + addEvent(inObj, 'keyup', function () {clear_results(); delay.start(); }); + + // attach eventhandler to output field + addEvent(outObj, 'click', function () {outObj.style.display = 'none'; }); +}); diff --git a/lib/scripts/delay.js b/lib/scripts/delay.js new file mode 100644 index 000000000..2ef9f8846 --- /dev/null +++ b/lib/scripts/delay.js @@ -0,0 +1,69 @@ +/** + * Manage delayed and timed actions + * + * @license GPL2 (http://www.gnu.org/licenses/gpl.html) + * @author Adrian Lang + */ + +/** + * Provide a global callback for window.setTimeout + * + * To get a timeout for non-global functions, just call + * delay.add(func, timeout). + */ +var timer = { + _cur_id: 0, + _handlers: {}, + + execDispatch: function (id) { + timer._handlers[id](); + }, + + add: function (func, timeout) { + var id = ++timer._cur_id; + timer._handlers[id] = func; + return window.setTimeout('timer.execDispatch(' + id + ')', timeout); + } +}; + +/** + * Provide a delayed start + * + * To call a function with a delay, just create a new Delay(func, timeout) and + * call that object’s method “start”. + */ +function Delay (func, timeout) { + this.func = func; + if (timeout) { + this.timeout = timeout; + } +} + +Delay.prototype = { + func: null, + timeout: 500, + + delTimer: function () { + if (this.timer !== null) { + window.clearTimeout(this.timer); + this.timer = null; + } + }, + + start: function () { + this.delTimer(); + var _this = this; + this.timer = timer.add(function () { _this.exec.call(_this); }, + this.timeout); + + this._data = { + _this: arguments[0], + _params: Array.prototype.slice.call(arguments, 2) + }; + }, + + exec: function () { + this.delTimer(); + this.func.call(this._data._this, this._data._params); + } +}; -- cgit v1.2.3