liquid_feedback_frontend

diff static/js/voting.js @ 945:b865f87ea810

Work on robustification of JavaScript voting
author jbe
date Thu Nov 08 13:17:37 2012 +0100 (2012-11-08)
parents ebcc40a3f8b3
children c328da62f45c
line diff
     1.1 --- a/static/js/voting.js	Tue Nov 06 21:28:25 2012 +0100
     1.2 +++ b/static/js/voting.js	Thu Nov 08 13:17:37 2012 +0100
     1.3 @@ -1,4 +1,4 @@
     1.4 -if (!jsFail) {
     1.5 +jsProtect(function() {
     1.6    voting_text_approval_single               = "Approval"
     1.7    voting_text_approval_multi                = "Approval"
     1.8    voting_text_first_preference_single       = "Approval (first preference)"
     1.9 @@ -99,57 +99,90 @@
    1.10      }
    1.11    }
    1.12    function voting_move(element, up, dropX, dropY) {
    1.13 -    if (typeof(element) == "string") element = document.getElementById(element);
    1.14 -    var mouse = (up == null);
    1.15 -    var oldParent = element.parentNode;
    1.16 -    if (mouse) var centerY = dropY + element.clientHeight / 2;
    1.17 -    var approvalCount = 0;
    1.18 -    var disapprovalCount = 0;
    1.19 -    var mainDiv = document.getElementById("voting");
    1.20 -    var sections = mainDiv.childNodes;
    1.21 -    for (var i=0; i<sections.length; i++) {
    1.22 -      var section = sections[i];
    1.23 -      if (section.className == "approval")       approvalCount++;
    1.24 -      if (section.className == "disapproval") disapprovalCount++;
    1.25 -    }
    1.26 -    if (mouse) {
    1.27 +    jsProtect(function() {
    1.28 +      if (typeof(element) == "string") element = document.getElementById(element);
    1.29 +      var mouse = (up == null);
    1.30 +      var oldParent = element.parentNode;
    1.31 +      if (mouse) var centerY = dropY + element.clientHeight / 2;
    1.32 +      var approvalCount = 0;
    1.33 +      var disapprovalCount = 0;
    1.34 +      var mainDiv = document.getElementById("voting");
    1.35 +      var sections = mainDiv.childNodes;
    1.36        for (var i=0; i<sections.length; i++) {
    1.37          var section = sections[i];
    1.38 -        if (
    1.39 -          section.className == "approval" ||
    1.40 -          section.className == "abstention" ||
    1.41 -          section.className == "disapproval"
    1.42 -        ) {
    1.43 +        if (section.className == "approval")       approvalCount++;
    1.44 +        if (section.className == "disapproval") disapprovalCount++;
    1.45 +      }
    1.46 +      if (mouse) {
    1.47 +        for (var i=0; i<sections.length; i++) {
    1.48 +          var section = sections[i];
    1.49            if (
    1.50 -            centerY >= section.offsetTop &&
    1.51 -            centerY <  section.offsetTop + section.clientHeight
    1.52 +            section.className == "approval" ||
    1.53 +            section.className == "abstention" ||
    1.54 +            section.className == "disapproval"
    1.55            ) {
    1.56 -            var entries = section.childNodes;
    1.57 -            for (var j=0; j<entries.length; j++) {
    1.58 -              var entry = entries[j];
    1.59 -              if (entry.className == "movable") {
    1.60 -                if (centerY < entry.offsetTop + entry.clientHeight / 2) {
    1.61 -                  if (element != entry) {
    1.62 -                    oldParent.removeChild(element);
    1.63 -                    section.insertBefore(element, entry);
    1.64 +            if (
    1.65 +              centerY >= section.offsetTop &&
    1.66 +              centerY <  section.offsetTop + section.clientHeight
    1.67 +            ) {
    1.68 +              var entries = section.childNodes;
    1.69 +              for (var j=0; j<entries.length; j++) {
    1.70 +                var entry = entries[j];
    1.71 +                if (entry.className == "movable") {
    1.72 +                  if (centerY < entry.offsetTop + entry.clientHeight / 2) {
    1.73 +                    if (element != entry) {
    1.74 +                      oldParent.removeChild(element);
    1.75 +                      section.insertBefore(element, entry);
    1.76 +                    }
    1.77 +                    break;
    1.78                    }
    1.79 -                  break;
    1.80                  }
    1.81                }
    1.82 +              if (j == entries.length) {
    1.83 +                oldParent.removeChild(element);
    1.84 +                section.appendChild(element);
    1.85 +              }
    1.86 +              break;
    1.87              }
    1.88 -            if (j == entries.length) {
    1.89 -              oldParent.removeChild(element);
    1.90 -              section.appendChild(element);
    1.91 -            }
    1.92 -            break;
    1.93            }
    1.94          }
    1.95 -      }
    1.96 -      if (i == sections.length) {
    1.97 -        var newSection = document.createElement("div");
    1.98 -        var cathead = document.createElement("div");
    1.99 -        cathead.setAttribute("class", "cathead");
   1.100 -        newSection.appendChild(cathead);
   1.101 +        if (i == sections.length) {
   1.102 +          var newSection = document.createElement("div");
   1.103 +          var cathead = document.createElement("div");
   1.104 +          cathead.setAttribute("class", "cathead");
   1.105 +          newSection.appendChild(cathead);
   1.106 +          for (var i=0; i<sections.length; i++) {
   1.107 +            var section = sections[i];
   1.108 +            if (
   1.109 +              section.className == "approval" ||
   1.110 +              section.className == "abstention" ||
   1.111 +              section.className == "disapproval"
   1.112 +            ) {
   1.113 +              if (centerY < section.offsetTop + section.clientHeight / 2) {
   1.114 +                if (section.className == "disapproval") {
   1.115 +                  newSection.setAttribute("class", "disapproval");
   1.116 +                  disapprovalCount++;
   1.117 +                } else {
   1.118 +                  newSection.setAttribute("class", "approval");
   1.119 +                  approvalCount++;
   1.120 +                }
   1.121 +                mainDiv.insertBefore(newSection, section);
   1.122 +                break;
   1.123 +              }
   1.124 +            }
   1.125 +          }
   1.126 +          if (i == sections.length) {
   1.127 +            newSection.setAttribute("class", "disapproval");
   1.128 +            disapprovalCount++;
   1.129 +            mainDiv.appendChild(newSection);
   1.130 +          }
   1.131 +          oldParent.removeChild(element);
   1.132 +          newSection.appendChild(element);
   1.133 +        }
   1.134 +      } else {
   1.135 +        var oldFound = false;
   1.136 +        var prevSection = null;
   1.137 +        var nextSection = null;
   1.138          for (var i=0; i<sections.length; i++) {
   1.139            var section = sections[i];
   1.140            if (
   1.141 @@ -157,195 +190,184 @@
   1.142              section.className == "abstention" ||
   1.143              section.className == "disapproval"
   1.144            ) {
   1.145 -            if (centerY < section.offsetTop + section.clientHeight / 2) {
   1.146 -              if (section.className == "disapproval") {
   1.147 -                newSection.setAttribute("class", "disapproval");
   1.148 -                disapprovalCount++;
   1.149 -              } else {
   1.150 -                newSection.setAttribute("class", "approval");
   1.151 -                approvalCount++;
   1.152 +            if (oldFound) {
   1.153 +              nextSection = section;
   1.154 +              break;
   1.155 +            } else if (section == oldParent) {
   1.156 +              oldFound = true;
   1.157 +            } else {
   1.158 +              prevSection = section;
   1.159 +            }
   1.160 +          }
   1.161 +        }
   1.162 +        var create;
   1.163 +        if (oldParent.className == "abstention") {
   1.164 +          create = true;
   1.165 +        } else {
   1.166 +          create = false;
   1.167 +          for (var i=0; i<oldParent.childNodes.length; i++) {
   1.168 +            var entry = oldParent.childNodes[i];
   1.169 +            if (entry.className == "movable") {
   1.170 +              if (entry != element) {
   1.171 +                create = true;
   1.172 +                break;
   1.173                }
   1.174 -              mainDiv.insertBefore(newSection, section);
   1.175 -              break;
   1.176              }
   1.177            }
   1.178          }
   1.179 -        if (i == sections.length) {
   1.180 -          newSection.setAttribute("class", "disapproval");
   1.181 -          disapprovalCount++;
   1.182 -          mainDiv.appendChild(newSection);
   1.183 +        var newSection;
   1.184 +        if (create) {
   1.185 +          newSection = document.createElement("div");
   1.186 +          var cathead = document.createElement("div");
   1.187 +          cathead.setAttribute("class", "cathead");
   1.188 +          newSection.appendChild(cathead);
   1.189 +          if (
   1.190 +            oldParent.className == "approval" ||
   1.191 +            (oldParent.className == "abstention" && up)
   1.192 +          ) {
   1.193 +            newSection.setAttribute("class", "approval");
   1.194 +            approvalCount++;
   1.195 +          } else {
   1.196 +            newSection.setAttribute("class", "disapproval");
   1.197 +            disapprovalCount++;
   1.198 +          }
   1.199 +          if (up) {
   1.200 +            mainDiv.insertBefore(newSection, oldParent);
   1.201 +          } else {
   1.202 +            if (nextSection) mainDiv.insertBefore(newSection, nextSection);
   1.203 +            else mainDiv.appendChild(newSection);
   1.204 +          }
   1.205 +        } else {
   1.206 +          if (up) newSection = prevSection;
   1.207 +          else newSection = nextSection;
   1.208          }
   1.209 -        oldParent.removeChild(element);
   1.210 -        newSection.appendChild(element);
   1.211 -      }
   1.212 -    } else {
   1.213 -      var oldFound = false;
   1.214 -      var prevSection = null;
   1.215 -      var nextSection = null;
   1.216 -      for (var i=0; i<sections.length; i++) {
   1.217 -        var section = sections[i];
   1.218 -        if (
   1.219 -          section.className == "approval" ||
   1.220 -          section.className == "abstention" ||
   1.221 -          section.className == "disapproval"
   1.222 -        ) {
   1.223 -          if (oldFound) {
   1.224 -            nextSection = section;
   1.225 -            break;
   1.226 -          } else if (section == oldParent) {
   1.227 -            oldFound = true;
   1.228 +        if (newSection) {
   1.229 +          oldParent.removeChild(element);
   1.230 +          if (create || up) {
   1.231 +            newSection.appendChild(element);
   1.232            } else {
   1.233 -            prevSection = section;
   1.234 -          }
   1.235 -        }
   1.236 -      }
   1.237 -      var create;
   1.238 -      if (oldParent.className == "abstention") {
   1.239 -        create = true;
   1.240 -      } else {
   1.241 -        create = false;
   1.242 -        for (var i=0; i<oldParent.childNodes.length; i++) {
   1.243 -          var entry = oldParent.childNodes[i];
   1.244 -          if (entry.className == "movable") {
   1.245 -            if (entry != element) {
   1.246 -              create = true;
   1.247 -              break;
   1.248 +            var inserted = false;
   1.249 +            for (var i=0; i<newSection.childNodes.length; i++) {
   1.250 +              var entry = newSection.childNodes[i];
   1.251 +              if (entry.className == "movable") {
   1.252 +                newSection.insertBefore(element, entry);
   1.253 +                inserted = true;
   1.254 +                break;
   1.255 +              }
   1.256              }
   1.257 +            if (!inserted) newSection.appendChild(element);
   1.258            }
   1.259          }
   1.260        }
   1.261 -      var newSection;
   1.262 -      if (create) {
   1.263 -        newSection = document.createElement("div");
   1.264 -        var cathead = document.createElement("div");
   1.265 -        cathead.setAttribute("class", "cathead");
   1.266 -        newSection.appendChild(cathead);
   1.267 +      // sections = mainDiv.childNodes;
   1.268 +      for (i=0; i<sections.length; i++) {
   1.269 +        var section = sections[i];
   1.270          if (
   1.271 -          oldParent.className == "approval" ||
   1.272 -          (oldParent.className == "abstention" && up)
   1.273 +          (section.className == "approval"    &&    approvalCount > 1) ||
   1.274 +          (section.className == "disapproval" && disapprovalCount > 1)
   1.275          ) {
   1.276 -          newSection.setAttribute("class", "approval");
   1.277 -          approvalCount++;
   1.278 -        } else {
   1.279 -          newSection.setAttribute("class", "disapproval");
   1.280 -          disapprovalCount++;
   1.281 -        }
   1.282 -        if (up) {
   1.283 -          mainDiv.insertBefore(newSection, oldParent);
   1.284 -        } else {
   1.285 -          if (nextSection) mainDiv.insertBefore(newSection, nextSection);
   1.286 -          else mainDiv.appendChild(newSection);
   1.287 -        }
   1.288 -      } else {
   1.289 -        if (up) newSection = prevSection;
   1.290 -        else newSection = nextSection;
   1.291 -      }
   1.292 -      if (newSection) {
   1.293 -        oldParent.removeChild(element);
   1.294 -        if (create || up) {
   1.295 -          newSection.appendChild(element);
   1.296 -        } else {
   1.297 -          var inserted = false;
   1.298 -          for (var i=0; i<newSection.childNodes.length; i++) {
   1.299 -            var entry = newSection.childNodes[i];
   1.300 -            if (entry.className == "movable") {
   1.301 -              newSection.insertBefore(element, entry);
   1.302 -              inserted = true;
   1.303 -              break;
   1.304 -            }
   1.305 +          var entries = section.childNodes;
   1.306 +          for (var j=0; j<entries.length; j++) {
   1.307 +            var entry = entries[j];
   1.308 +            if (entry.className == "movable") break;
   1.309            }
   1.310 -          if (!inserted) newSection.appendChild(element);
   1.311 +          if (j == entries.length) {
   1.312 +            section.parentNode.removeChild(section);
   1.313 +          }
   1.314          }
   1.315        }
   1.316 -    }
   1.317 -    // sections = mainDiv.childNodes;
   1.318 -    for (i=0; i<sections.length; i++) {
   1.319 -      var section = sections[i];
   1.320 -      if (
   1.321 -        (section.className == "approval"    &&    approvalCount > 1) ||
   1.322 -        (section.className == "disapproval" && disapprovalCount > 1)
   1.323 -      ) {
   1.324 -        var entries = section.childNodes;
   1.325 -        for (var j=0; j<entries.length; j++) {
   1.326 -          var entry = entries[j];
   1.327 -          if (entry.className == "movable") break;
   1.328 -        }
   1.329 -        if (j == entries.length) {
   1.330 -          section.parentNode.removeChild(section);
   1.331 -        }
   1.332 -      }
   1.333 -    }
   1.334 -    voting_setCategoryHeadings();
   1.335 +      voting_setCategoryHeadings();
   1.336 +    });
   1.337    }
   1.338    function elementDropped(element, dropX, dropY) {
   1.339      voting_move(element, null, dropX, dropY);
   1.340    }
   1.341    window.addEventListener("load", function(event) {
   1.342 -    voting_setCategoryHeadings();
   1.343 -    var mainDiv = document.getElementById("voting");
   1.344 -    var form = document.getElementById("voting_form");
   1.345 -    var elements = document.getElementsByTagName("input");
   1.346 -    for (var i=0; i<elements.length; i++) {
   1.347 -      var element = elements[i];
   1.348 -      if (element.className == "voting_done1" ||
   1.349 -          element.className == "voting_done2" ||
   1.350 -          element.name == "preview") {
   1.351 -        element.addEventListener("click", function(event) {
   1.352 -          if (event.target.name == "preview") {
   1.353 -            document.getElementById("preview2").value = "1";
   1.354 -          }
   1.355 -          var scoringString = "";
   1.356 -          var approvalCount = 0;
   1.357 -          var disapprovalCount = 0;
   1.358 -          var sections = mainDiv.childNodes;
   1.359 -          for (var j=0; j<sections.length; j++) {
   1.360 -            var section = sections[j];
   1.361 -            if (section.className == "approval")       approvalCount++;
   1.362 -            if (section.className == "disapproval") disapprovalCount++;
   1.363 -          }
   1.364 -          var approvalIndex = 0;
   1.365 -          var disapprovalIndex = 0;
   1.366 -          for (var j=0; j<sections.length; j++) {
   1.367 -            var section = sections[j];
   1.368 -            if (
   1.369 -              section.className == "approval"    ||
   1.370 -              section.className == "abstention"  ||
   1.371 -              section.className == "disapproval"
   1.372 -            ) {
   1.373 -              var score;
   1.374 -              if (section.className == "approval") {
   1.375 -                score = approvalCount - approvalIndex;
   1.376 -                approvalIndex++;
   1.377 -              } else if (section.className == "abstention") {
   1.378 -                score = 0;
   1.379 -              } else if (section.className == "disapproval") {
   1.380 -                score = -1 - disapprovalIndex;
   1.381 -                disapprovalIndex++;
   1.382 +    jsProtect(function() {
   1.383 +      var jsTest = true;
   1.384 +      var jsTestSuccess = false;
   1.385 +      voting_setCategoryHeadings();
   1.386 +      var mainDiv = document.getElementById("voting");
   1.387 +      var form = document.getElementById("voting_form");
   1.388 +      var elements = document.getElementsByTagName("input");
   1.389 +      for (var i=0; i<elements.length; i++) {
   1.390 +        var element = elements[i];
   1.391 +        if (element.className == "voting_done1" ||
   1.392 +            element.className == "voting_done2" ||
   1.393 +            element.name == "preview") {
   1.394 +          element.addEventListener("click", function(event) {
   1.395 +            jsProtect(function() {
   1.396 +              event.preventDefault();
   1.397 +              if (event.target.name == "preview") {
   1.398 +                document.getElementById("preview2").value = "1";
   1.399 +              }
   1.400 +              var scoringString = "";
   1.401 +              var approvalCount = 0;
   1.402 +              var disapprovalCount = 0;
   1.403 +              var sections = mainDiv.childNodes;
   1.404 +              for (var j=0; j<sections.length; j++) {
   1.405 +                var section = sections[j];
   1.406 +                if (section.className == "approval")       approvalCount++;
   1.407 +                if (section.className == "disapproval") disapprovalCount++;
   1.408                }
   1.409 -              var entries = section.childNodes;
   1.410 -              for (var k=0; k<entries.length; k++) {
   1.411 -                var entry = entries[k];
   1.412 -                if (entry.className == "movable") {
   1.413 -                  var id = entry.id.match(/[0-9]+/);
   1.414 -                  var field = document.createElement("input");
   1.415 -                  scoringString += id + ":" + score + ";";
   1.416 +              var approvalIndex = 0;
   1.417 +              var disapprovalIndex = 0;
   1.418 +              for (var j=0; j<sections.length; j++) {
   1.419 +                var section = sections[j];
   1.420 +                if (
   1.421 +                  section.className == "approval"    ||
   1.422 +                  section.className == "abstention"  ||
   1.423 +                  section.className == "disapproval"
   1.424 +                ) {
   1.425 +                  var score;
   1.426 +                  if (section.className == "approval") {
   1.427 +                    score = approvalCount - approvalIndex;
   1.428 +                    approvalIndex++;
   1.429 +                  } else if (section.className == "abstention") {
   1.430 +                    score = 0;
   1.431 +                  } else if (section.className == "disapproval") {
   1.432 +                    score = -1 - disapprovalIndex;
   1.433 +                    disapprovalIndex++;
   1.434 +                  }
   1.435 +                  var entries = section.childNodes;
   1.436 +                  for (var k=0; k<entries.length; k++) {
   1.437 +                    var entry = entries[k];
   1.438 +                    if (entry.className == "movable") {
   1.439 +                      var id = entry.id.match(/[0-9]+/);
   1.440 +                      var field = document.createElement("input");
   1.441 +                      scoringString += id + ":" + score + ";";
   1.442 +                    }
   1.443 +                  }
   1.444                  }
   1.445                }
   1.446 -            }
   1.447 -          }
   1.448 -          var fields = form.childNodes;
   1.449 -          for (var j=0; j<fields.length; j++) {
   1.450 -            var field = fields[j];
   1.451 -            if (field.name == "scoring") {
   1.452 -              field.setAttribute("value", scoringString);
   1.453 -              form.submit();
   1.454 -              return;
   1.455 -            }
   1.456 -          }
   1.457 -          alert('Hidden input field named "scoring" not found.');
   1.458 -        }, false);
   1.459 +              var fields = form.childNodes;
   1.460 +              for (var j=0; j<fields.length; j++) {
   1.461 +                var field = fields[j];
   1.462 +                if (field.name == "scoring") {
   1.463 +                  field.setAttribute("value", scoringString);
   1.464 +                  if (jsTest) {
   1.465 +                    jsTestSuccess = success;
   1.466 +                    return;
   1.467 +                  } else {
   1.468 +                    form.submit();
   1.469 +                    return;
   1.470 +                  }
   1.471 +                }
   1.472 +              }
   1.473 +              alert('Hidden input field named "scoring" not found.');
   1.474 +            });
   1.475 +          }, false);
   1.476 +        }
   1.477        }
   1.478 -    }
   1.479 +      for (var i=0; i<elements.length; i++) {
   1.480 +        var element = elements[i];
   1.481 +        if (element.className == "voting_done1") {
   1.482 +          element.click();
   1.483 +        }
   1.484 +      }
   1.485 +      jsTest = false;
   1.486 +      if (!jsTestSuccess) jsFail = true;
   1.487 +    });
   1.488    }, false);
   1.489    function voting_moveUp(element) {
   1.490      return voting_move(element, true);
   1.491 @@ -353,6 +375,4 @@
   1.492    function voting_moveDown(element) {
   1.493      return voting_move(element, false);
   1.494    }
   1.495 -
   1.496 -  
   1.497 -}
   1.498 +});

Impressum / About Us