source: Dev/trunk/js/sequencerScripts.js @ 167

Last change on this file since 167 was 167, checked in by fpvanagthoven, 13 years ago
  • Save functie verbeterd, nu confirm? parameter.
  • Begin aan infopanel gemaakt
  • moveStep functie in JS gezet, werkt nog niet helemaal goed (refreshed niet!)
  • General CSS layout verbeterd van pipelineEditor.php
  • edit button werkt nu.
  • saveSession zit nog steeds een error in, nog niet weten te fixen. Heeft met creator te maken.
File size: 13.8 KB
RevLine 
[146]1/*
2 * To change this template, choose Tools | Templates
3 * and open the template in the editor.
4 */
5
6function IsItemSelected(check, target) {
7    if (check.value) {
8        target.disabled = false;
9    }
10    else {
11        target.disabled = true;
12    }
13}
14
15function IsCheckEnabled(check, target) {
16    if (check.checked) {
17        target.disabled = false;
18        this.removeClass(target, "dis");
19       
20    }
21    else {
22        target.disabled = true;
23        this.addClass(target, "dis");
24    }
25}
26
[166]27function removeNL(s){
28    return s.replace(/[\n\r\t]/g,"");
[146]29}
[166]30
[165]31function SubmitToolbox(type) {
32    var c = "objectToCreate="+type;
33    var u = "createObject.php";
34    var a = true;
35    var pipeline = document.getElementById("pipelineStringField");
36    var pipelineType = document.getElementById("pipelineTypeField");
37    var pipelineUpdated = document.getElementById("pipelineUpdatedField");
38   
39    newAjaxRequest(c, u, function(result){
[166]40        var resultUid = removeNL(result.responseText);
41        //resultUid.replace("\n","").replace("\r","");
42       
43        pipeline.value += resultUid+",";
44        pipelineType.value += type+",";
45        pipelineUpdated.value += "0,";
[165]46        updateSequencer();
47    }, a);
48}
[146]49
[152]50// Class manipulation
[146]51
[152]52function hasClass(ele,cls) {
[154]53    if (ele.className)
54        return ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)'));
[152]55}
56 
57function addClass(ele,cls) {
58    if (!this.hasClass(ele,cls)) ele.className += " "+cls;
59}
60 
61function removeClass(ele,cls) {
62    if (hasClass(ele,cls)) {
63        var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)');
64        ele.className=ele.className.replace(reg,' ');
65    }
66}
[146]67
[152]68//new scripts!
69//start here!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
70
71function selectStep(uid) {
[167]72    var nodes = document.getElementById("seqContentWrapper").childNodes;
[154]73    for (var i = 0; i < nodes.length; i++) {     //loop through childNodes. Skip first node (whitespace)
74        if (hasClass(nodes[i], "displayStep")) {    //check if current childNode is a displayStep, not divider or text.
75            if (nodes[i].id == uid) {
[164]76                if (hasClass(nodes[i], "selected")) {
77                    removeClass(nodes[i], "selected");
78                }
79                else {
80                    addClass(nodes[i], "selected");
81                }               
[154]82            }
83            else {
84                removeClass(nodes[i], "selected");
85            }
86        }
[153]87    }
[154]88   
89    // Update selected step field with uid of currently selected step.
90    var selectedStepField = document.getElementById("selectedStepField");
91    selectedStepField.value = uid;
92   
[152]93}
94                                                                           
[164]95function newAjaxRequest(c, u, cb, async) {
[152]96   
97    var xml;
98    var content = c;    //an array of strings, in "key=value"  format.
99    // assign a compatible request format
100    if (window.XMLHttpRequest) {    //Not IE5, IE6
101        xml = new XMLHttpRequest();
102    }
103    else {                          //IE5, IE6
104        xml = new ActiveXObject("Microsoft.XMLHTTP");
105    }
106    // subscribe the callback function to a response event
107    xml.onreadystatechange = function() {
[164]108        xml.responseText = "Processing...";
[152]109        if (xml.readyState == 4 && xml.status == 200) {
110            cb(xml);
111        }
112    };
113    // initialize XMLRequest
[164]114    xml.open("POST", u, async);
[152]115    xml.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
116    var contentString = "";
117    //iterate through parameters passed in variable c
118    if (typeof(content)=='object'&&(input instanceof Array)) {    // parameters were passed as an array of key=value strings
119        for (var i = 0; i < content.length; i++) {
120            contentString += content[i];
121            if (i != (content.length - 1)) {
122                contentString += "&";
123            }
124        }
125    }
[166]126    else { // single parameter or string already formatted by calling function
[152]127        contentString = content;
128    }
129    // finally send the formatted request
130    xml.send(contentString);
131}
[153]132
[154]133
[153]134/*
135 * ajaxStepRequest gets  the markup for displaying a step in the sequencer from returnStep.php
136 * Using ajax principle allows for editing of pipeline without constantly refreshing the page.
137 */
138
[165]139function ajaxStepRequest(UIDS, types) {
[154]140    var c = "uids="+UIDS;
[165]141    if (types != "") {
142        c += "&types="+types;
143    }
[153]144    var u = "returnStep.php";
145    newAjaxRequest(c, u, function(result) {
[167]146        document.getElementById("seqContentWrapper").innerHTML = result.responseText;
[164]147    }, true);
[153]148}
149
150function ajaxInfoRequest(id, el) {
151    var uid = id;
152    var c = "uid="+uid;
153    var u = "getInfo.php";
154    newAjaxRequest(c, u, function(result) {
155        el.innerHTML = result.responseText;
[164]156    }, true);
[153]157}
[146]158
[167]159function drawSteps2() {
160    var content = document.getElementById("seqContentWrapper");
[153]161    var pipeline = document.getElementById("pipelineStringField").value;
[165]162    var pipelineTypes = document.getElementById("pipelineTypeField").value;
[166]163    var numSteps = document.getElementById("numSteps").value;
164    if (numSteps > 0) {
165        pipeline = pipeline.replace(/,/g , ",divider,");    //regex search for commas, global (repeat), to represent them with visual dividers.
166        pipelineTypes = pipelineTypes.replace(/,/g, ",divider,");
167        ajaxStepRequest(pipeline, pipelineTypes);
168    }
[146]169}
170
[167]171function drawSteps() {
172   
173}
174
[164]175function updateSequencer() {
176    var plString = document.getElementById("pipelineStringField").value;
177    var plTypeString = document.getElementById("pipelineTypeField").value;
178    var plUpdatedString = document.getElementById("pipelineUpdatedField").value;
[153]179   
[164]180   
[166]181    var pl = stringToArray(plString, ",");   
182    var plType = stringToArray(plTypeString, ",");   
183    var plUpdated = stringToArray(plUpdatedString, ",");
184   
185    var count = pl.length;
186   
187    document.getElementById("numSteps").value = count;
188   
[164]189    for (var i = 0; i < pl.length; i++) {   // loop through pipeline contents
190        if (plUpdated[i] == "0") {   // if the element is not up to date
191            // first remove the step representation from the sequencer
[167]192            var seqContent = document.getElementById("seqContentWrapper");
[164]193            var element = document.getElementById(pl[i]);
[166]194            if (element == null) {
195                element = document.createElement("div");
196                element.name = "placeholder";
197                seqContent.appendChild(element);
198            }
199            if (element.nextSibling) {
200                var nextElement = element.nextSibling;
201            }
202            else {
203                var nextElement = document.createElement("div");
204                nextElement.name = "placeholderNext";
205                seqContent.appendChild(nextElement);
206            }
[164]207           
208            // now request a new step representation and insert it after previousElement
209            var holderDiv = document.createElement("div");
210            var requestString = "uids="+pl[i];
[166]211           
212            if (plType[i]) {
213                requestString += "&types="+plType[i];
214            }
215            // globally declare newDiv so it can be passed to the updateDividers function
216            var newDiv;
217           
[164]218            newAjaxRequest(requestString, "returnStep.php", function(result) {
[166]219                holderDiv.innerHTML = result.responseText;
220                newDiv = holderDiv.childNodes[1];           
221                seqContent.replaceChild(newDiv, element);
222                if (nextElement.name == "placeholderNext") {
223                    seqContent.removeChild(nextElement);
224                }
225                plUpdated[i] = "1";
[164]226            }, false);
227           
[166]228                       
229            // ALTERNATIVE METHOD TO REPLACECHILD!!!
230            //seqContent.removeChild(element);
231            //seqContent.insertBefore(newDiv, nextElement);
[164]232           
[166]233            // Now check if dividers are necessary.
[164]234           
[166]235            //alert("INSERT CODE FOR UPDATEDIVIDERS HERE!");
236            updateDividers(newDiv);
[164]237        }
238    }
239   
[166]240    // afterwards, convert the arrays back to strings and set to appropriate fields
241    var newUpdatedString = arrayToString(plUpdated, ",");
242    document.getElementById("pipelineUpdatedField").value = newUpdatedString;
[164]243   
[166]244}
245
246
247
248
249
250
251function updateDividers (element) {
[167]252    var seqContent = document.getElementById("seqContentWrapper");
[166]253   
254    if (element.nextSibling){
255        var nextElement = element.nextSibling;
[164]256    }
[166]257    if (element.previousSibling) {
258        var previousElement = element.previousSibling;
259    }
[164]260   
[166]261    if (nextElement){
262        if (!hasClass(nextElement, "divider")) {
263            var holderDiv = document.createElement("div");
264            newAjaxRequest("uids=divider&types=divider", "returnStep.php", function(result) {
265                holderDiv.innerHTML = result.responseText;
266                var newDivider = holderDiv.childNodes[1];
267                seqContent.insertBefore(newDivider, nextElement);
268            }, false);
269        }
[164]270    }
271   
[166]272    if (previousElement){
273        if (!hasClass(previousElement, "divider")) {
274            var holderDiv = document.createElement("div");
275            newAjaxRequest("uids=divider&types=divider", "returnStep.php", function(result) {
276                holderDiv.innerHTML = result.responseText;
277                var newDivider = holderDiv.childNodes[1];
278                seqContent.insertBefore(newDivider, element);
279            }, false);
280        }
281    }
282   
[164]283}
284
[166]285
286
287
288
289
[167]290function savePipeline (confirmSave) {
291    if (confirmSave==true) {
292        var answer = confirm("Save changes to pipeline?");
293    }
294    else {
295        var answer = true;
296    }
297   
298   
[164]299    if (answer) {
[166]300        var pipeline = document.getElementById("pipelineStringField").value;
301        pipeline = pipeline.slice(0, pipeline.length - 1);
302        var types = document.getElementById("pipelineTypeField").value;
303        types = types.slice(0, types.length - 1);
304        var session = document.getElementById("sessionField").value;
305        var requestString = "uids="+pipeline+"&types="+types+"&sessionUid="+session;
[167]306        console.log(requestString);
[166]307       
308       
309        var success;
310        newAjaxRequest(requestString, "savesession.php", function(result){
311            success = result.responseText;
312        }, false);
313        console.log(success);
[164]314    }
315}
316
317function t_setOutOfDate() {
318    // if a step is currently selected
319    var uid = document.getElementById("selectedStepField").value;
320    if (uid == "") {
321        alert("No step selected!");
322        return;
323    }
324   
325    // convert to arrays for looping
326    var plString = document.getElementById("pipelineStringField").value;
327    var plTypeString = document.getElementById("pipelineTypeField").value;
328    var plUpdatedString = document.getElementById("pipelineUpdatedField").value;
329   
330   
[166]331    var pl = stringToArray(plString, ",");   
332    var plType = stringToArray(plTypeString, ",");   
333    var plUpdated = stringToArray(plUpdatedString, ",");   
[164]334   
335    // set the targeted element's tag for "Needs updating"
[166]336    plUpdated[pl.indexOf(uid)] = "0";
[164]337   
338    // then rewrite the content strings and set them to the appropriate fields
[166]339    var newUpdatedString = arrayToString(plUpdated, ",");
340    document.getElementById("pipelineUpdatedField").value = newUpdatedString;
341}
342
343function stringToArray(s, c) {
344    var a = s.split(c);
345    for (var i = 0; i < a.length; i++) {    // remove empty items
346        if (a[i] == "") {
347            a.splice(i, 1);
348            i--;
349        }
[164]350    }
[166]351    return a;
352}
353
354function arrayToString(a, c) {
355    var s = "";
356    for (var i = 0; i < a.length; i++) {
357        if (a[i] != "") {
358            s += a[i]+c;
359        }
[164]360    }
[166]361    return s;
[167]362}
363
364
365function editStep() {
366    // eerst saven, dan de object type zoeken in de typelist, dan redirecten naar de goede pagina
367    savePipeline(false);
368    debugger;
369    var pipeline = document.getElementById("pipelineStringField").value;
370    var pipelineTypes = document.getElementById("pipelineTypeField").value;
371    var selectedStep = document.getElementById("selectedStepField").value;
372    pipeline = stringToArray(pipeline, ",");
373    pipelineTypes = stringToArray(pipelineTypes, ",");
374    var stepType = pipelineTypes[pipeline.indexOf(selectedStep)];
375   
376    var postForm = document.createElement("form");
377    postForm.action = stepType.toLowerCase()+"Editor.php";
378    postForm.method = "POST";
379    var objectUid = document.createElement("input");
380    objectUid.type = "hidden";
381    objectUid.value = selectedStep;
382    postForm.appendChild(objectUid);
383    postForm.submit();
384}
385
386
387
388function moveStep (direction) {
389    // misschien maar eens een loadhiddenfields functie maken voor deze meuk?
390    debugger;
391    var selectedStep = document.getElementById("selectedStepField").value;
392   
393    if (selectedStep != undefined && selectedStep != "") {
394        var pipeline = stringToArray(document.getElementById("pipelineStringField").value, ",");
395        var pipelineTypes = stringToArray(document.getElementById("pipelineTypeField").value, ",");
396        var updated = stringToArray(document.getElementById("pipelineUpdatedField").value, ",");
397    }
398    else {
399        alert("No step selected! Unable to move");
400        return;
401    }
402   
403    var id = pipeline.indexOf(selectedStep);
404    // Dit werkt niet, hij replaced dingen de verkeerde kant op. Lelijke versie met placeholder variables maar weer doen?
405    pipeline[id] = pipeline.splice(pipeline[id+direction], 1, pipeline[id])[0];
406    pipelineTypes[id] = pipelineTypes.splice(pipelineTypes[id+direction], 1, pipelineTypes[id])[0];
407    updated[id] = "0";
408    updated[id+direction] = "0";
409   
410    pipeline = arrayToString(pipeline, ",");
411    pipelineTypes = arrayToString(pipelineTypes, ",");
412    updated = arrayToString(updated, ",");
413   
414    document.getElementById("pipelineStringField").value = pipeline;
415    document.getElementById("pipelineTypeField").value = pipelineTypes;
416    document.getElementById("pipelineUpdatedField").value = updated;
417    updateSequencer();
418   
419   
420   
[154]421}
Note: See TracBrowser for help on using the repository browser.