Display policy report

Author: SKernchen

public/.hermes/process/transport.json

@@ -482,8 +482,8 @@
          {"conflict": "Curation"}
       ],
 
-  "policies": [{"policy 1": {"conforms": true}},
-  {"policy 2": {"conforms": false,
+  "policies": [{"Policy 1": {"conforms": true}},
+  {"Policy 2": {"conforms": false,
       "resultMessage": "String length not >= Literal(\"100\", datatype=xsd:integer)" ,
       "resultPath": "https://schema.org/description" ,
       "resultSeverity": "Violation" ,

public/curation/curation.js

@@ -1,21 +1,27 @@
 import { extract_info } from "./extract.js";
 
+/**
+* Fetches json_document and displays their contents in a table.
+* @param {Path} json_document - document do fetch data from.
+*/
 export function displayJSON(json_document){
-
   fetch(json_document)
   .then(response => response.json())
   .then(data => {
+      //Get data snippet from url
       const params = new URLSearchParams(location.search);
       if(params.has("id")){
         const id = params.get("id")
         data = get_data_snippet(data, "@id", id);
 
+        //If your seeing a data snippet, create button to go back
         const back = document.createElement("button");
         back.innerText = "Back to Overview";
         back.onclick = () => {window.location = window.location.href.split('?')[0];}
         document.body.appendChild(back);
       }
 
+      // Apply and fill in the template for Metadata
       const keys = Object.keys(data);
 
       const metadateTemp = document.querySelector("#metadate");
@@ -27,60 +33,58 @@ export function displayJSON(json_document){
       const header = document.querySelector("#header-policies");
       header.style.display = "none";
 
+      
       keys.forEach(element => { 
+        // Get a something with Name as p Header
         if(element.toLowerCase().includes("name")){
-          console.log(element);
           document.getElementById("project-name").innerHTML = element.charAt(0).toUpperCase() + element.slice(1) +' <b> '+data[element][0]+'</b>';
         }
+        // Apply and fill in the template for Policies 
         if(element=="policies"){
           header.style.display = "block";
-          console.log("policies");
           data[element].forEach(pol =>{
-            console.log(pol);
             const policy = document.importNode(policyTemp.content, true);
-            console.log(policy);
             const tbodyPol = policy.querySelector("tbody"),
-              polname = policy.querySelector("#policy-name");
+              polname = policy.querySelector("#policy-name"),
+              pconforms = policy.querySelector("#policy-conforms"); 
             const policyId = Object.keys(pol)[0];
             polname.textContent = `${policyId}`;
             policyDiv.appendChild(policy);
             const policyReportTemp = document.querySelector("#policy-report");
             const polKeys = Object.keys(pol[policyId]);
-            console.log(polKeys);
             polKeys.forEach(report =>{
-              console.log(report);
               const prow = document.importNode(policyReportTemp.content, true);
 
               const pkey = prow.querySelector("#pkey"),
                 pvalue = prow.querySelector("#pvalue");
-                //pconforms = prow.querySelector("#policy-conforms"); 
+                
                 if(report=="conforms"){
-                  console.log("conforms");
+                  pconforms.innerText = `${policyId} ${(pol[policyId][report]) ? 'is' : 'is not'} conform.`;
+                  pconforms.style.color = (pol[policyId][report]) ? 'black' : 'red';
                 }
-                console.log(report,pol[policyId][report]);
                 pkey.textContent = `${report}`;
                 extract_info(pvalue, pol[policyId][report]);
-                //pvalue.textContent = `${pol[policyId][report]}`;
+
                 tbodyPol.appendChild(prow);
             })
           })
 
           return;
-        }   
+        }  
+        
+        // Apply and fill in the template for Metadata 
         const row = document.importNode(metadateTemp.content, true);
-        console.log(row);
         const mkey = row.querySelector("#key"),
           mvalue = row.querySelector("#value"),
           mtag = row.querySelector("#tag");
 
           mkey.textContent = `${element}`;
           extract_info(mvalue, data[element], mtag);
-          /*
-          mvalue.textContent = `${data[element][0]}`;
-          mtag.textContent = `${data[element][1]["local_path"]}`;*/
+
           tbody.appendChild(row);
       })
   })
+  //Extend Checkbox for metadata source
     const checkbox = document.querySelector("#extended");
 checkbox.addEventListener('change', (event)=>{
   if(checkbox.checked){
@@ -93,7 +97,16 @@ checkbox.addEventListener('change', (event)=>{
 
 
 }
+
+/**
+* Function to get a smaller object from the orginal object.
+* searches through data till skey and svalue match and return the data from this point.
+* @param {Dictonary} data - Object(dict) to search from
+* @param {string} skey - search key for key-value pair to get data from
+* @param {} svalue - search value for key-value pair to get data from
+*/ 
 function get_data_snippet(data, skey, svalue){
+
   const stack = [data];
   while (stack?.length > 0) {
     const obj = stack.pop();

public/curation/extract.js

@@ -4,7 +4,6 @@ function extract_info(cell, obj, tag, category){
       }
       if(typeof obj[0] === "string" || typeof obj[0] == "number" || typeof obj[0] == "boolean"){
         if(obj[2] && obj[2]["conflict"] == "Curation"){
-          console.log(`${Object.keys(obj[2])}`);
           const element = document.createElement("div");
           element.className += " error";
           element.appendChild(document.createTextNode(` ${obj[0]}`));
@@ -23,7 +22,6 @@ function extract_info(cell, obj, tag, category){
           })}
       else if(Array.isArray(obj[0])){
           obj[0].forEach(e =>{
-            console.log(e);
           const element = document.createElement("div");
           extract_info(element, e, tag);
           //element.appendChild(document.createTextNode(`hh ${e}`));
@@ -65,10 +63,9 @@ function extract_info(cell, obj, tag, category){
     tooltiptag.appendChild(document.createTextNode("See Details"));
     tooltiptag.appendChild(document.createElement("br"));
     tooltiptag.onclick = function(){link_to_person(e)};
-    console.log(e);
     tag.appendChild(tooltiptag);
     //const data = JSON.stringify(e, null, 2);
-    
+
     const names = [];
     Object.keys(e).forEach(k => {
       const pair = document.createElement("p");

public/curation/index.html

@@ -50,6 +50,7 @@ <h1><a href="../">Software CaRD</a>
         <h3 id="header-policies">Policy Report</h3>
         <template id="policy">
             <b id="policy-name"></b>
+            <p id="policy-conforms"></p>
             <table>
                 <tbody>
                     <template id="policy-report">