Uploaded image for project: 'Jenkins'
  1. Jenkins
  2. JENKINS-74465

[spring-initalzr] Extract inline script block and event handler in org/jenkinsci/plugins/springinitializr/SpringBootLibrariesListParameterDefinition/index.jelly

      Problems

      == Inline Script Block
      Line: 25
      ----
      <script>
              var model = {
                  selectedIds : [],
                  searchText : ""
              };
              var searchById = {
              <j:set var="lastIndex" value="${it.libs.size() - 1}"/>
              <j:forEach var="lib" items="${it.libs}">
                  "${lib.id}" : "g:${lib.group.toLowerCase()} ${lib.name.toLowerCase()} ${lib.description.toLowerCase()}"<j:if test="${idx != lastIndex}">,</j:if>
              </j:forEach>
              };
      
              var searchBox = document.getElementById("search");
              var selectedDisplay = document.getElementById("selected");
              var hiddenValue = document.getElementById("hiddenValue");
              var lastText = "";
      
              setInterval(function () {
                  var text = searchBox.value;
                  if(lastText != text) {
                      onChange(text);
                      lastText = text;
                  }
              }, 100)
      
              function onChange(text) {
                  model.searchText = text.toLowerCase();
                  updateView();
              }
      
              function updateView() {
                  for(var lib in searchById) {
                      if(searchById.hasOwnProperty(lib)) {
                          document.getElementById("div-" + lib).style.display = isVisible(lib) ? "${visibleDisplay}" : "none"
                      }
                  }
              }
      
              function isVisible(lib) {
                  return model.selectedIds.indexOf(lib) &lt; 0 &amp;&amp; searchById[lib].indexOf(model.searchText) > -1
              }
              function clickedUnselected(event) {
                  var id = event.target.id.substring(4);
                  model.selectedIds.push(id);
                  updateSelected();
              }
              function updateSelected() {
                  updateView();
                  var anHtml = "";
                  var anJson = "";
                  for (var prop in model.selectedIds) {
                      if (model.selectedIds.hasOwnProperty(prop)) {
                          var item = model.selectedIds[prop];
                          anHtml += "&lt;div class='selectedId' onclick='clickedSelected(\"" + item + "\")'>" + item + "&lt;/div>";
                          anJson += item + ',';
                      }
                  }
                  selectedDisplay.innerHTML = anHtml;
                  hiddenValue.value = anJson.substr(0, anJson.length-1);
              }
              function clickedSelected(text) {
                  var newSelected = [];
                  for (var prop in model.selectedIds) {
                      if (model.selectedIds.hasOwnProperty(prop)) {
                          if(model.selectedIds[prop] !== text) {
                              newSelected.push(model.selectedIds[prop])
                          }
                      }
                  }
                  model.selectedIds = newSelected;
                  updateSelected();
              }
          </script>
      ----
      
      == Inline Event Handler
      Line: 21
      ----
      <div id="div-${lib.id}" class="lib" onclick="clickedUnselected(event)">
      ----
      

      Solutions

      https://www.jenkins.io/doc/developer/security/csp/#inline-javascript-blocks
      https://www.jenkins.io/doc/developer/security/csp/#inline-event-handlers

          [JENKINS-74465] [spring-initalzr] Extract inline script block and event handler in org/jenkinsci/plugins/springinitializr/SpringBootLibrariesListParameterDefinition/index.jelly

          Basil Crow created issue -
          Basil Crow made changes -
          Assignee Original: Igor Mihaylyuk [ migger ]
          Basil Crow made changes -
          Description Original: h4. Problems

          {noformat}
          == Inline Event Handler
          Line: 21
          ----
          <div id="div-${lib.id}" class="lib" onclick="clickedUnselected(event)">
          ----

          == Inline Script Block
          Line: 25
          ----
          <script>
                  var model = {
                      selectedIds : [],
                      searchText : ""
                  };
                  var searchById = {
                  <j:set var="lastIndex" value="${it.libs.size() - 1}"/>
                  <j:forEach var="lib" items="${it.libs}">
                      "${lib.id}" : "g:${lib.group.toLowerCase()} ${lib.name.toLowerCase()} ${lib.description.toLowerCase()}"<j:if test="${idx != lastIndex}">,</j:if>
                  </j:forEach>
                  };

                  var searchBox = document.getElementById("search");
                  var selectedDisplay = document.getElementById("selected");
                  var hiddenValue = document.getElementById("hiddenValue");
                  var lastText = "";

                  setInterval(function () {
                      var text = searchBox.value;
                      if(lastText != text) {
                          onChange(text);
                          lastText = text;
                      }
                  }, 100)

                  function onChange(text) {
                      model.searchText = text.toLowerCase();
                      updateView();
                  }

                  function updateView() {
                      for(var lib in searchById) {
                          if(searchById.hasOwnProperty(lib)) {
                              document.getElementById("div-" + lib).style.display = isVisible(lib) ? "${visibleDisplay}" : "none"
                          }
                      }
                  }

                  function isVisible(lib) {
                      return model.selectedIds.indexOf(lib) &lt; 0 &amp;&amp; searchById[lib].indexOf(model.searchText) > -1
                  }
                  function clickedUnselected(event) {
                      var id = event.target.id.substring(4);
                      model.selectedIds.push(id);
                      updateSelected();
                  }
                  function updateSelected() {
                      updateView();
                      var anHtml = "";
                      var anJson = "";
                      for (var prop in model.selectedIds) {
                          if (model.selectedIds.hasOwnProperty(prop)) {
                              var item = model.selectedIds[prop];
                              anHtml += "&lt;div class='selectedId' onclick='clickedSelected(\"" + item + "\")'>" + item + "&lt;/div>";
                              anJson += item + ',';
                          }
                      }
                      selectedDisplay.innerHTML = anHtml;
                      hiddenValue.value = anJson.substr(0, anJson.length-1);
                  }
                  function clickedSelected(text) {
                      var newSelected = [];
                      for (var prop in model.selectedIds) {
                          if (model.selectedIds.hasOwnProperty(prop)) {
                              if(model.selectedIds[prop] !== text) {
                                  newSelected.push(model.selectedIds[prop])
                              }
                          }
                      }
                      model.selectedIds = newSelected;
                      updateSelected();
                  }
              </script>
          ----

          == Inline Event Handler
          Line: 21
          ----
          <div id="div-${lib.id}" class="lib" onclick="clickedUnselected(event)">
          ----

          == Inline Script Block
          Line: 25
          ----
          <script>
                  var model = {
                      selectedIds : [],
                      searchText : ""
                  };
                  var searchById = {
                  <j:set var="lastIndex" value="${it.libs.size() - 1}"/>
                  <j:forEach var="lib" items="${it.libs}">
                      "${lib.id}" : "g:${lib.group.toLowerCase()} ${lib.name.toLowerCase()} ${lib.description.toLowerCase()}"<j:if test="${idx != lastIndex}">,</j:if>
                  </j:forEach>
                  };

                  var searchBox = document.getElementById("search");
                  var selectedDisplay = document.getElementById("selected");
                  var hiddenValue = document.getElementById("hiddenValue");
                  var lastText = "";

                  setInterval(function () {
                      var text = searchBox.value;
                      if(lastText != text) {
                          onChange(text);
                          lastText = text;
                      }
                  }, 100)

                  function onChange(text) {
                      model.searchText = text.toLowerCase();
                      updateView();
                  }

                  function updateView() {
                      for(var lib in searchById) {
                          if(searchById.hasOwnProperty(lib)) {
                              document.getElementById("div-" + lib).style.display = isVisible(lib) ? "${visibleDisplay}" : "none"
                          }
                      }
                  }

                  function isVisible(lib) {
                      return model.selectedIds.indexOf(lib) &lt; 0 &amp;&amp; searchById[lib].indexOf(model.searchText) > -1
                  }
                  function clickedUnselected(event) {
                      var id = event.target.id.substring(4);
                      model.selectedIds.push(id);
                      updateSelected();
                  }
                  function updateSelected() {
                      updateView();
                      var anHtml = "";
                      var anJson = "";
                      for (var prop in model.selectedIds) {
                          if (model.selectedIds.hasOwnProperty(prop)) {
                              var item = model.selectedIds[prop];
                              anHtml += "&lt;div class='selectedId' onclick='clickedSelected(\"" + item + "\")'>" + item + "&lt;/div>";
                              anJson += item + ',';
                          }
                      }
                      selectedDisplay.innerHTML = anHtml;
                      hiddenValue.value = anJson.substr(0, anJson.length-1);
                  }
                  function clickedSelected(text) {
                      var newSelected = [];
                      for (var prop in model.selectedIds) {
                          if (model.selectedIds.hasOwnProperty(prop)) {
                              if(model.selectedIds[prop] !== text) {
                                  newSelected.push(model.selectedIds[prop])
                              }
                          }
                      }
                      model.selectedIds = newSelected;
                      updateSelected();
                  }
              </script>
          ----
          {noformat}

          h4. Solutions

          [https://www.jenkins.io/doc/developer/security/csp/#inline-javascript-blocks]
          [https://www.jenkins.io/doc/developer/security/csp/#inline-event-handlers]
          New: h4. Problems

          {noformat}
          == Inline Script Block
          Line: 25
          ----
          <script>
                  var model = {
                      selectedIds : [],
                      searchText : ""
                  };
                  var searchById = {
                  <j:set var="lastIndex" value="${it.libs.size() - 1}"/>
                  <j:forEach var="lib" items="${it.libs}">
                      "${lib.id}" : "g:${lib.group.toLowerCase()} ${lib.name.toLowerCase()} ${lib.description.toLowerCase()}"<j:if test="${idx != lastIndex}">,</j:if>
                  </j:forEach>
                  };

                  var searchBox = document.getElementById("search");
                  var selectedDisplay = document.getElementById("selected");
                  var hiddenValue = document.getElementById("hiddenValue");
                  var lastText = "";

                  setInterval(function () {
                      var text = searchBox.value;
                      if(lastText != text) {
                          onChange(text);
                          lastText = text;
                      }
                  }, 100)

                  function onChange(text) {
                      model.searchText = text.toLowerCase();
                      updateView();
                  }

                  function updateView() {
                      for(var lib in searchById) {
                          if(searchById.hasOwnProperty(lib)) {
                              document.getElementById("div-" + lib).style.display = isVisible(lib) ? "${visibleDisplay}" : "none"
                          }
                      }
                  }

                  function isVisible(lib) {
                      return model.selectedIds.indexOf(lib) &lt; 0 &amp;&amp; searchById[lib].indexOf(model.searchText) > -1
                  }
                  function clickedUnselected(event) {
                      var id = event.target.id.substring(4);
                      model.selectedIds.push(id);
                      updateSelected();
                  }
                  function updateSelected() {
                      updateView();
                      var anHtml = "";
                      var anJson = "";
                      for (var prop in model.selectedIds) {
                          if (model.selectedIds.hasOwnProperty(prop)) {
                              var item = model.selectedIds[prop];
                              anHtml += "&lt;div class='selectedId' onclick='clickedSelected(\"" + item + "\")'>" + item + "&lt;/div>";
                              anJson += item + ',';
                          }
                      }
                      selectedDisplay.innerHTML = anHtml;
                      hiddenValue.value = anJson.substr(0, anJson.length-1);
                  }
                  function clickedSelected(text) {
                      var newSelected = [];
                      for (var prop in model.selectedIds) {
                          if (model.selectedIds.hasOwnProperty(prop)) {
                              if(model.selectedIds[prop] !== text) {
                                  newSelected.push(model.selectedIds[prop])
                              }
                          }
                      }
                      model.selectedIds = newSelected;
                      updateSelected();
                  }
              </script>
          ----

          == Inline Event Handler
          Line: 21
          ----
          <div id="div-${lib.id}" class="lib" onclick="clickedUnselected(event)">
          ----
          {noformat}

          h4. Solutions

          [https://www.jenkins.io/doc/developer/security/csp/#inline-javascript-blocks]
          [https://www.jenkins.io/doc/developer/security/csp/#inline-event-handlers]
          Summary Original: [spring-initalzr] Extract inline script blocks and event handlers in org/jenkinsci/plugins/springinitializr/SpringBootLibrariesListParameterDefinition/index.jelly New: [spring-initalzr] Extract inline script block and event handler in org/jenkinsci/plugins/springinitializr/SpringBootLibrariesListParameterDefinition/index.jelly

            Unassigned Unassigned
            basil Basil Crow
            Votes:
            0 Vote for this issue
            Watchers:
            1 Start watching this issue

              Created:
              Updated: