Mercurial > hg > webaudioevaluationtool
changeset 513:d7b1b270c13a Dev_main
Bug #1562: Checkbox and radios will be center aligned, left justified. Also solves issue #1571. Only tested in OSX Chrome!
| author | Nicholas Jillings <n.g.r.jillings@se14.qmul.ac.uk> |
|---|---|
| date | Fri, 12 Feb 2016 09:02:41 +0000 |
| parents | f4800ccc4d54 |
| children | 46b16d47c923 |
| files | core.css core.js index.html |
| diffstat | 3 files changed, 23 insertions(+), 2 deletions(-) [+] |
line wrap: on
line diff
--- a/core.css Fri Feb 12 08:42:15 2016 +0000 +++ b/core.css Fri Feb 12 09:02:41 2016 +0000 @@ -63,6 +63,7 @@ min-height: 50px; max-height: 320px; overflow: auto; + position: relative; } button.popupButton {
--- a/core.js Fri Feb 12 08:42:15 2016 +0000 +++ b/core.js Fri Feb 12 09:02:41 2016 +0000 @@ -515,11 +515,14 @@ } this.popupResponse.appendChild(textArea); textArea.focus(); + this.popupResponse.style.textAlign="center"; + this.popupResponse.style.left="0%"; } else if (node.specification.type == 'checkbox') { if (node.response == undefined) { node.response = Array(node.specification.options.length); } var index = 0; + var max_w = 0; for (var option of node.specification.options) { var input = document.createElement('input'); input.id = option.name; @@ -537,13 +540,21 @@ input.checked = "true"; } } + var w = $(span).width(); + if (w > max_w) + max_w = w; index++; } + max_w += 12; + this.popupResponse.style.textAlign=""; + var leftP = ((max_w/500)/2)*100; + this.popupResponse.style.left=leftP+"%"; } else if (node.specification.type == 'radio') { if (node.response == undefined) { node.response = {name: "", text: ""}; } var index = 0; + var max_w = 0; for (var option of node.specification.options) { var input = document.createElement('input'); input.id = option.name; @@ -560,7 +571,14 @@ if (input.id == node.response.name) { input.checked = "true"; } + var w = $(span).width(); + if (w > max_w) + max_w = w; } + max_w += 12; + this.popupResponse.style.textAlign=""; + var leftP = ((max_w/500)/2)*100; + this.popupResponse.style.left=leftP+"%"; } else if (node.specification.type == 'number') { var input = document.createElement('input'); input.type = 'textarea'; @@ -571,6 +589,8 @@ input.value = node.response; } this.popupResponse.appendChild(input); + this.popupResponse.style.textAlign="center"; + this.popupResponse.style.left="0%"; } if(this.currentIndex+1 == this.popupOptions.length) { if (this.node.location == "pre") {
--- a/index.html Fri Feb 12 08:42:15 2016 +0000 +++ b/index.html Fri Feb 12 09:02:41 2016 +0000 @@ -53,10 +53,10 @@ </div> <div id="popupHolder" class="popupHolder" style="visibility: hidden; z-index: -1"> <div id="popupContent"> - <div id="popupTitleHolder" align="center"> + <div id="popupTitleHolder" style="text-align: center"> <span id="popupTitle"></span> </div> - <div id="popupResponse" align="center"></div> + <div id="popupResponse"></div> </div> <button id="popup-proceed" class="popupButton">Next</button> <button id="popup-previous" class="popupButton">Back</button>