fixed accordion arrow and checkstyle

Author: Riya Khandelwal

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-common/pom.xml

@@ -278,10 +278,7 @@
             <exclude>src/main/resources/webapps/static/dt-1.11.5/css/jui-dt.css</exclude>
             <exclude>src/main/resources/webapps/static/dt-1.11.5/css/demo_table.css</exclude>
             <exclude>src/main/resources/webapps/static/dt-1.11.5/images/Sorting icons.psd</exclude>
-<!--            <exclude>src/main/resources/webapps/static/dt-1.11.5/js/jquery.dataTables.min.js</exclude>-->
             <exclude>src/main/resources/webapps/static/jt/jquery.jstree.js</exclude>
-<!--            <exclude>src/main/resources/webapps/static/jquery/jquery-ui-1.13.2.custom.min.js</exclude>-->
-<!--            <exclude>src/main/resources/webapps/static/jquery/jquery-3.6.0.min.js</exclude>-->
             <exclude>src/main/resources/webapps/static/jquery/themes-1.9.1/base/jquery-ui.css</exclude>
             <exclude>src/test/resources/application_1440536969523_0001.har/_index</exclude>
             <exclude>src/test/resources/application_1440536969523_0001.har/part-0</exclude>

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-common/src/main/java/org/apache/hadoop/yarn/webapp/hamlet2/Hamlet.java

@@ -8456,11 +8456,6 @@ public LI<UL<T>> li() {
       return li_(this, false);
     }
 
-//    public UL<LI<UL<DIV<Hamlet>>>> selectorLi(String selector) {
-//      closeAttrs();
-//      return setSelector(li_(this, false), selector);
-//    }
-
     @Override
     public UL<T> li(String cdata) {
       return li().__(cdata).__();

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-common/src/main/java/org/apache/hadoop/yarn/webapp/view/JQueryUI.java

@@ -68,7 +68,6 @@ protected void render(Block html) {
         .link(root_url("static/dt-1.11.5/css/jquery.dataTables.css"))
         .link(root_url("static/dt-1.11.5/css/jui-dt.css"))
         .link(root_url("static/dt-1.11.5/css/custom_datatable.css"))
-        .link("https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.30.1/moment.min.js")
         .script(root_url("static/yarn.dt.plugins.js"))
         .script(root_url("static/customjs/Accordion.js"))
         .script(root_url("static/customjs/DataTable.js"))
@@ -85,12 +84,11 @@ protected void render(Block html) {
             .__(initDataTables()).__();
   }
 
-
   public static void jsnotice(HTML html) {
     html.
       div("#jsnotice.ui-state-error").
         __("This page will not function without javascript enabled."
-                    + " Please enable javascript on your browser.").__();
+                   + " Please enable javascript on your browser.").__();
     html.
       script().$type("text/javascript").
         __("document.getElementById('jsnotice').style.display = 'none'").__();
@@ -151,7 +149,6 @@ protected String initDataTables() {
               ", true);");
 
     }
-
     return dtJS;
   }
 

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-common/src/main/resources/webapps/static/customjs/Accordion.js

@@ -1,3 +1,21 @@
+/**
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance
+* with the License.  You may obtain a copy of the License at
+*
+*     http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+*/
+
 /*
  * Implementation of Accordion in Vanilla JS
  * Based on the implementation of Jquery-UI Accordion
@@ -37,31 +55,35 @@ var Accordion = function (element, options, selector) {
                 item.addEventListener('mouseout', onMouseOut);
             })
 
-        //start with all closed tabs
+        // start with all closed tabs
         closeAll();
         if (openTab) {
             open(openTab);
         }
     }
 
     function onClick(e) {
-        //do nothing if not clickable element
-        if (e.target.className.indexOf(titleClasses[0]) === -1) {
+        // do nothing if not clickable element
+        let currElement = e.target;
+        if (e.target.className.split(' ').indexOf(titleClasses[0]+'-icon') !== -1) {
+            currElement = e.target.parentNode;
+        }
+        if (currElement.className.indexOf(titleClasses[0]) === -1) {
             return;
         }
 
-        if (e.target.className.indexOf("ui-state-active") !== -1) {
+        if (currElement.className.indexOf("ui-state-active") !== -1) {
             return;
         }
 
-        let nextContent = e.target.nextElementSibling;
-        e.target.classList.toggle('ui-state-active');
-        e.target.children[0].classList.toggle("ui-icon-triangle-1-e");
-        e.target.children[0].classList.toggle("ui-icon-triangle-1-s");
+        let nextContent = currElement.nextElementSibling;
+        currElement.classList.toggle('ui-state-active');
+        currElement.children[0].classList.toggle("ui-icon-triangle-1-e");
+        currElement.children[0].classList.toggle("ui-icon-triangle-1-s");
 
         if (nextContent.style.display !== 'none') {
             // toggle current element if open
-            e.target.nextElementSibling.style.display = "none";
+            currElement.nextElementSibling.style.display = "none";
         }
 
         if (oneOpen) {
@@ -72,7 +94,9 @@ var Accordion = function (element, options, selector) {
 
     function onMouseOver(e) {
         if (e.target.classList &&
-            e.target.className.indexOf('ui-state-hover') === -1){
+            e.target.className.indexOf('ui-state-hover') === -1 &&
+            e.target.children.length !== 0){
+            // add hover state to the parent and not the icon
                 e.target.classList.add('ui-state-hover');
         }
     }

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-common/src/main/resources/webapps/static/customjs/DataTable.js

@@ -1,7 +1,22 @@
-/*
- * Implementation of DataTables on VanillaJS
- * Based on the implementation by Karl Saunders
- */
+/**
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance
+* with the License.  You may obtain a copy of the License at
+*
+*     http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+*/
+
+// Implementation of DataTables on VanillaJS
 
 (function(root, factory) {
     var plugin = "DataTable";
@@ -96,7 +111,7 @@
     };
 
     /**
-     * Merge objects (reccursive)
+     * Merge objects (recursive)
      * @param  {Object} r
      * @param  {Object} t
      * @return {Object}

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-common/src/main/resources/webapps/static/customjs/UtilsUI.js

@@ -1,3 +1,21 @@
+/**
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you under the Apache License, Version 2.0 (the
+* "License"); you may not use this file except in compliance
+* with the License.  You may obtain a copy of the License at
+*
+*     http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+*/
+
 function accordionJS(parent, selector){
   window.addEventListener("DOMContentLoaded", () => {
     window.removeEventListener("DOMContentLoaded", arguments.callee, false);

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-common/src/main/resources/webapps/static/jquery/themes-1.9.1/base/jquery-ui.css

@@ -30,14 +30,6 @@
 ----------------------------------*/
 /* Sets the width for the accordion. Sets the margin to 90px on the top and bottom and auto to the left and right */
 
-.accordion-parent {
- /* width: 800px;
-  margin: 90px auto;
-  color: black;
-  background-color: white;
-  padding: 45px 45px;*/
-}
-
 .accordion-parent + .container {
   display: none;
 }
@@ -46,7 +38,6 @@
   display: block;
 }
 
-
 /* Overlays */
 .ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
 

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-common/src/main/resources/webapps/static/yarn.dt.plugins.js

@@ -41,7 +41,6 @@ var yarnDt = function (dtObject) {
   // don't filter on hidden html elements for an sType of title-numeric
   dtObject.ofnSearch={}
   dtObject.oSort={}
-//  var dtObject.oApi.fnSetFilteringDelay={}
   dtObject.ofnSearch['title-numeric'] = function (sData) {
     return sData.replace(/\n/g, " ").replace(/<.*?>/g, "");
   }
@@ -94,38 +93,6 @@ var yarnDt = function (dtObject) {
     return naturalSort(a,b) * -1;
   }
 
-//  dtObject.oApi.fnSetFilteringDelay = function (oSettings, iDelay) {
-//    var
-//      _that = this,
-//      iDelay = (typeof iDelay == 'undefined') ? 250 : iDelay;
-//
-//    this.each(function (i) {
-//      $.fn.dataTableExt.iApiIndex = i;
-//      var
-//        $this = this,
-//        oTimerId = null,
-//        sPreviousSearch = null,
-//        anControl = $('input', _that.fnSettings().aanFeatures.f);
-//
-//      anControl.unbind('keyup').bind('keyup', function () {
-//        var $$this = $this;
-//
-//        if (sPreviousSearch === null || sPreviousSearch != anControl.val()) {
-//          window.clearTimeout(oTimerId);
-//          sPreviousSearch = anControl.val();
-//          oSettings.oApi._fnProcessingDisplay(oSettings, true);
-//          oTimerId = window.setTimeout(function () {
-//            $.fn.dataTableExt.iApiIndex = i;
-//            _that.fnFilter(anControl.val());
-//            oSettings.oApi._fnProcessingDisplay(oSettings, false);
-//          }, iDelay);
-//        }
-//      });
-//      return this;
-//    });
-//    return this;
-//  }
-
   return dtObject
 }
 

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-server/hadoop-yarn-server-common/src/main/java/org/apache/hadoop/yarn/server/webapp/AppAttemptBlock.java

@@ -188,12 +188,10 @@ public Collection<ContainerReport> run() throws Exception {
         containersTableData.length() - 1);
     }
     containersTableData.append("]");
-//    html.script().$type("text/javascript")
-//      .__("var containersTableData=" + containersTableData).__();
     String containersTableScript = "var containersTableData= " + containersTableData +
             ";\nconst containersDataTable = DataTableHelper('#containers', { data: { data: containersTableData } }, false)";
     html.script().$type("text/javascript")
-            .__(containersTableScript).__();
+      .__(containersTableScript).__();
 
     tbody.__().__();
   }

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-server/hadoop-yarn-server-resourcemanager/src/main/java/org/apache/hadoop/yarn/server/resourcemanager/webapp/FairSchedulerAppsBlock.java

@@ -229,9 +229,8 @@ private static String printAppInfo(long value) {
     }
     appsTableData.append("]");
     html.script().$type("text/javascript").
-            __("appsTableData=" + appsTableData + "\nopts.data = {data: appsTableData}" +
-                    "\nappsDataTable = DataTableHelper(elId, opts, true)").__();
-
+        __("appsTableData=" + appsTableData + "\nopts.data = {data: appsTableData}" +
+                  "\nappsDataTable = DataTableHelper(elId, opts, true)").__();
 
     tbody.__().__();
   }