Mercurial > hg > webaudioevaluationtool
comparison test_create/test_core.js @ 1207:c3a180d49239
test_creator: Can add and delete scale markers.
author | Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk> |
---|---|
date | Mon, 22 Feb 2016 16:26:26 +0000 |
parents | 74ce8e3f8dd5 |
children | 124e6c702845 |
comparison
equal
deleted
inserted
replaced
1206:74ce8e3f8dd5 | 1207:c3a180d49239 |
---|---|
980 selectOption.setAttribute("name",scaleName); | 980 selectOption.setAttribute("name",scaleName); |
981 selectOption.textContent = scaleName; | 981 selectOption.textContent = scaleName; |
982 this.preset.input.appendChild(selectOption); | 982 this.preset.input.appendChild(selectOption); |
983 } | 983 } |
984 | 984 |
985 this.addMarker = { | |
986 root: document.createElement("button"), | |
987 parent: this, | |
988 handleEvent: function() { | |
989 var marker = { | |
990 position: 0, | |
991 text: "text" | |
992 }; | |
993 this.parent.scaleRoot.scales.push(marker); | |
994 var markerNode = new this.parent.buildMarkerNode(this.parent,marker); | |
995 document.getElementById("popup-option-holder").appendChild(markerNode.root); | |
996 this.parent.markerNodes.push(markerNode); | |
997 } | |
998 }; | |
999 this.addMarker.root.textContent = "Add Marker"; | |
1000 this.addMarker.root.addEventListener("click",this.addMarker); | |
1001 this.content.appendChild(this.addMarker.root); | |
1002 | |
985 // Create Marker List | 1003 // Create Marker List |
986 this.buildMarkerList(); | 1004 this.buildMarkerList(); |
987 } | 1005 } |
988 this.buildMarkerList = function() { | 1006 this.buildMarkerList = function() { |
989 var markerInject = document.getElementById("popup-option-holder"); | 1007 var markerInject = document.getElementById("popup-option-holder"); |
990 markerInject.innerHTML = ""; | 1008 markerInject.innerHTML = ""; |
991 this.markerNodes = []; | 1009 this.markerNodes = []; |
992 for (var i=0; i<this.scaleRoot.scales.length; i++) | 1010 for (var i=0; i<this.scaleRoot.scales.length; i++) |
993 { | 1011 { |
994 var markerNode = {}; | 1012 var markerNode = new this.buildMarkerNode(this,this.scaleRoot.scales[i]); |
995 markerNode.root = document.createElement("div"); | |
996 markerNode.root.className = "popup-option-entry"; | |
997 markerNode.positionInput = document.createElement("input"); | |
998 markerNode.positionInput.min = 0; | |
999 markerNode.positionInput.max = 100; | |
1000 markerNode.positionInput.value = this.scaleRoot.scales[i].position; | |
1001 markerNode.positionInput.setAttribute("name","position"); | |
1002 markerNode.textInput = document.createElement("input"); | |
1003 markerNode.textInput.setAttribute("name","text"); | |
1004 markerNode.textInput.value = this.scaleRoot.scales[i].text; | |
1005 markerNode.specification = this.scaleRoot.scales[i]; | |
1006 markerNode.parent = this; | |
1007 markerNode.handleEvent = function(event) { | |
1008 switch(event.currentTarget.getAttribute("name")) | |
1009 { | |
1010 case "position": | |
1011 this.specification.position = Number(event.currentTarget.value); | |
1012 break; | |
1013 case "text": | |
1014 this.specification.text = event.currentTarget.value; | |
1015 break; | |
1016 } | |
1017 } | |
1018 markerNode.positionInput.addEventListener("change",markerNode,false); | |
1019 markerNode.textInput.addEventListener("change",markerNode,false); | |
1020 | |
1021 var posText = document.createElement("span"); | |
1022 posText.textContent = "Position: "; | |
1023 var textText = document.createElement("span"); | |
1024 textText.textContent = "Text: "; | |
1025 markerNode.root.appendChild(posText); | |
1026 markerNode.root.appendChild(markerNode.positionInput); | |
1027 markerNode.root.appendChild(textText); | |
1028 markerNode.root.appendChild(markerNode.textInput); | |
1029 markerInject.appendChild(markerNode.root); | 1013 markerInject.appendChild(markerNode.root); |
1030 this.markerNodes.push(markerNode); | 1014 this.markerNodes.push(markerNode); |
1031 | 1015 |
1032 } | 1016 } |
1017 } | |
1018 | |
1019 this.buildMarkerNode = function(parent,specification) { | |
1020 this.root = document.createElement("div"); | |
1021 this.root.className = "popup-option-entry"; | |
1022 this.positionInput = document.createElement("input"); | |
1023 this.positionInput.min = 0; | |
1024 this.positionInput.max = 100; | |
1025 this.positionInput.value = specification.position; | |
1026 this.positionInput.setAttribute("name","position"); | |
1027 this.textInput = document.createElement("input"); | |
1028 this.textInput.setAttribute("name","text"); | |
1029 this.textInput.value = specification.text; | |
1030 this.specification = specification; | |
1031 this.parent = parent; | |
1032 this.handleEvent = function(event) { | |
1033 switch(event.currentTarget.getAttribute("name")) | |
1034 { | |
1035 case "position": | |
1036 this.specification.position = Number(event.currentTarget.value); | |
1037 break; | |
1038 case "text": | |
1039 this.specification.text = event.currentTarget.value; | |
1040 break; | |
1041 } | |
1042 } | |
1043 this.positionInput.addEventListener("change",this,false); | |
1044 this.textInput.addEventListener("change",this,false); | |
1045 | |
1046 var posText = document.createElement("span"); | |
1047 posText.textContent = "Position: "; | |
1048 var textText = document.createElement("span"); | |
1049 textText.textContent = "Text: "; | |
1050 this.root.appendChild(posText); | |
1051 this.root.appendChild(this.positionInput); | |
1052 this.root.appendChild(textText); | |
1053 this.root.appendChild(this.textInput); | |
1054 | |
1055 this.deleteMarker = { | |
1056 root: document.createElement("button"), | |
1057 parent: this, | |
1058 handleEvent: function() { | |
1059 var index = this.parent.parent.scaleRoot.scales.findIndex(function(element,index,array){ | |
1060 if (element == this) {return true;} else {return false;} | |
1061 },this.parent.specification) | |
1062 if (index >= 0) { | |
1063 this.parent.parent.scaleRoot.scales.splice(index,1); | |
1064 } | |
1065 document.getElementById("popup-option-holder").removeChild(this.parent.root); | |
1066 } | |
1067 } | |
1068 this.deleteMarker.root.addEventListener("click",this.deleteMarker); | |
1069 this.deleteMarker.root.textContent = "Delete Marker" | |
1070 this.root.appendChild(this.deleteMarker.root); | |
1033 } | 1071 } |
1034 } | 1072 } |
1035 } | 1073 } |
1036 } | 1074 } |
1037 | 1075 |