source: Dev/trunk/js/generalScripts.js @ 220

Last change on this file since 220 was 220, checked in by tschipper, 13 years ago

Nieuwe implementatie van dropdown menus. Voorbeeld staat in positiontest.html, maar alle code staat in generalScripts.js, dus kan op alle pagina's gebruikt worden.

File size: 7.4 KB
RevLine 
[181]1/*
2 * General functions, shared by most different scripts and elements.
3 */
4
5// Object literal version of a timer script, can be used to benchmark script running time.
6
7var timeDiff  =  {
8    setStartTime:function (){
9        d = new Date();
10        time  = d.getTime();
11    },
12
13    getDiff:function (){
14        d = new Date();
15        return (d.getTime()-time);
16    }
17}
18
19// Check if a certain HTMLElement has a given classname
20function hasClass(ele,cls) {
21    if (ele.className)
22        return ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)'));
23   
24}
25
26// Add a given classname to an HTMLElement
27function addClass(ele,cls) {
28    if (!this.hasClass(ele,cls)) ele.className += " "+cls;
29}
30
31// Remove a given class from an HTMLElement
32function removeClass(ele,cls) {
33    if (hasClass(ele,cls)) {
34        var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)');
35        ele.className=ele.className.replace(reg,' ');
36    }
37}
38
39// General function to handle AJAX functionality.
40// Specify the request string, url to send to, the function to execute on response and whether to run in the background or wait for a response before continuing.
41function newAjaxRequest(c, u, cb, async) {
42    var xml;
43    var content = c;    //an array of strings, in "key=value"  format.
44    // assign a compatible request format
45    if (window.XMLHttpRequest) {    //Not IE5, IE6
46        xml = new XMLHttpRequest();
47    }
48    else {                          //IE5, IE6
49        xml = new ActiveXObject("Microsoft.XMLHTTP");
50    }
51    // subscribe the callback function to a response event
52    xml.onreadystatechange = function() {
53        xml.responseText = "Processing...";
54        if (xml.readyState == 4 && xml.status == 200) {
55            cb(xml);
56        }
57    };
58    // initialize XMLRequest
59    xml.open("POST", u, async);
60    xml.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
61    var contentString = "";
62    //iterate through parameters passed in variable c
63    if (typeof(content)=='object'&&(input instanceof Array)) {    // parameters were passed as an array of key=value strings
64        for (var i = 0; i < content.length; i++) {
65            contentString += content[i];
66            if (i != (content.length - 1)) {
67                contentString += "&";
68            }
69        }
70    }
71    else { // single parameter or string already formatted by calling function
72        contentString = content;
73    }
74    // finally send the formatted request
75    xml.send(contentString);
76}
77
[191]78// Function that handles updating of info panel via AJAX getInfo.php. Currently operates on HTML to paste into #infoPanelContent, should eventually involve JSON arrays, to have more control over formatting.
79function ajaxInfoRequest(uid, el, type) {
80    // Info panel update.
81   
82    var c = "uid="+uid;
83    c += "&type="+type;
84    var u = "getInfo.php";
85    newAjaxRequest(c, u, function(result) {
86        el.innerHTML = result.responseText;
87    }, true);
88}
89
[181]90// Function to save the object currently being edited.
91// !! Still needs to be generalized !!
92function saveObject (confirmSave) {
93    var answer = false;
94    if (confirmSave==true) {
95        answer = confirm("Save changes to pipeline?");
96    }
97    else {
98        answer = true;
99    }
100   
101   
102    if (answer == true) {
103        var pipeline = document.getElementById("pipelineStringField").value;
104        pipeline = pipeline.slice(0, pipeline.length - 1);
105        var types = document.getElementById("pipelineTypeField").value;
106        types = types.slice(0, types.length - 1);
107        var session = document.getElementById("sessionField").value;
108        var requestString = "uids="+pipeline+"&types="+types+"&sessionUid="+session;
109        console.log(requestString);
110       
111       
112        var success;
113        newAjaxRequest(requestString, "savesession.php", function(result){
114            success = result.responseText;
115        }, true);
116        console.log(success);
117    }
118}
119
120// Convert a string to an array and remove any empty items (from trailing commas)
121function stringToArray(s, c) {
122    var a = s.split(c);
123    for (var i = 0; i < a.length; i++) {    // remove empty items
124        if (a[i] == "") {
125            a.splice(i, 1);
126            i--;
127        }
128    }
129    return a;
130}
131
132// Convert an array to a string, separated by character "c"
133function arrayToString(a, c) {
134    var s = "";
135    for (var i = 0; i < a.length; i++) {
136        if (a[i] != "") {
137            s += a[i]+c;
138        }
139    }
140    return s;
141}
142
143// Remove all newlines, carriage returns and tabs from a given string
144function removeNL(s){
145    return s.replace(/[\n\r\t]/g,"");
[183]146}
147
148// Shorthand for document.createElement, because that pops up about three times every line of the main program
149function ce(s) {
150    return document.createElement(s);
151}
152
153// Shorthand for document.getElementById, same reason as above
154function ge(s) {
155    return document.getElementById(s);
[219]156}
157
[220]158// Function for getting the absolute position of the top left corner of an element, relative to the window
159function getPos(element) {
[219]160    var posX = posY = 0;
161    if (element.offsetParent) {
162        do {
163            posX += element.offsetLeft;
164            posY += element.offsetTop;
165        } while (element = element.offSetParent);
166    }
167   
168    var result = {
169        X: posX,
170        Y: posY
171    }
172    return result;
[220]173}
174
175// Returns the computed width of an element
176function getWidth(element) {
177    var width = 0;
178    if (element.offsetWidth) {
179        width = element.offsetWidth;
180    }
181   
182    return width;
183}
184
185// Drop down menu implementation. Supports three levels: Base button, 1st level categories, and 2nd level links
186function DDMenu() {
187    // Initialize function, setting all needed variables.
188    var instance = this;
189    this.closeTimer = 0;
190    this.ddMenuItem = null;
191    this.timeout = 350;
192    this.visible = false;
193    this.menuElement = null;
194    this.parentButton = null
195   
196    this.Init = function(id1, id2) {   
197        instance.menuElement = ge(id1);
198        instance.parentButton = ge(id2);
199    }
200   
201    this.SetCloseTimer = function() {
202        instance.closeTimer = window.setTimeout(instance.Close, instance.timeout);
203    }
204   
205    this.Close = function() {
206        if (instance.ddMenuItem) {
207            instance.ddMenuItem.style.visibility = "hidden";
208        }
209        instance.Show();
210       
211    }
212   
213    this.CancelCloseTimer = function() {
214        if (instance.closeTimer) {
215            window.clearTimeout(instance.closeTimer);
216            instance.closeTimer = null;
217        }
218    }
219   
220    this.Open = function(id) {
221        instance.CancelCloseTimer();
222        if (instance.ddMenuItem) {
223            instance.ddMenuItem.style.visibility = "hidden";
224        }
225       
226        instance.ddMenuItem = ge(id);
227        instance.ddMenuItem.style.visibility = "visible";
228        var parentPos = getPos(instance.ddMenuItem.parentNode);
229        var parentWidth = getWidth(instance.ddMenuItem.parentNode);
230        instance.ddMenuItem.style.left = (parentPos.X + parentWidth)+"px";
231        instance.ddMenuItem.style.top = parentPos.Y+"px";
232       
233    }
234   
235    this.Show = function() {
236        debugger;
237        if (instance.visible) {
238            // Hide the menu
239            instance.menuElement.style.visibility = "hidden";
240            instance.parentButton.className = "";
241            instance.visible = false;
242        }
243        else{
244            //Show the menu
245            instance.menuElement.style.visibility = "visible";
246            instance.parentButton.className = "down";
247            instance.visible = true;
248        }
249    }
[181]250}
Note: See TracBrowser for help on using the repository browser.