Changeset 36145 for main/trunk/greenstone3/web/interfaces/default/js/utility_scripts.js

Timestamp:

2022-04-14T17:13:54+12:00 (2 years ago)

Author:

davidb

Message:

Added support for TK Labels

File:

• main/trunk/greenstone3/web/interfaces/default/js/utility_scripts.js (modified) (1 diff)

main/trunk/greenstone3/web/interfaces/default/js/utility_scripts.js

@@ -166 +166 @@
     $.ajax(url);
 }
+
+var tkMetadataSetStatus = "needs-to-be-loaded";
+var tkMetadataElements = null;
+
+
+function addTKLabelToImage(labelName, definition, name, comment) {
+   // lists of tkLabels and their corresponding codes, in order
+   let tkLabels = ["Attribution","Clan","Family","MultipleCommunities","CommunityVoice","Creative","Verified","NonVerified","Seasonal","WomenGeneral","MenGeneral",
+      "MenRestricted","WomenRestricted","CulturallySensitive","SecretSacred","OpenToCommercialization","NonCommercial","CommunityUseOnly","Outreach","OpenToCollaboration"];
+   let tkCodes = ["tk_a","tk_cl","tk_f","tk_mc","tk_cv","tk_cr","tk_v","tk_nv","tk_s","tk_wg","tk_mg","tk_mr","tk_wr","tk_cs","tk_ss","tk_oc","tk_nc","tk_co","tk_o","tk_cb"];
+   for (let i = 0; i < tkLabels.length; i++) {
+      if (labelName == tkLabels[i]) {
+         let labeldiv = document.querySelectorAll(".tklabels img");
+         for (image of labeldiv) {
+            let labelCode = image.src.substr(image.src.lastIndexOf("/") + 1).replace(".png", ""); // get tk label code from image file name
+            if (labelCode == tkCodes[i]) {
+               image.title = "TK " + name + ": " + definition + " Click for more details."; // set tooltip
+               if (image.parentElement.parentElement.parentElement.classList[0] != "tocSectionTitle") { // disable onclick event in favourites section
+                  image.addEventListener("click", function(e) {
+                     let currPopup = document.getElementsByClassName("tkPopup")[0];
+                     if (currPopup == undefined || (currPopup != undefined && currPopup.id != labelCode)) { 
+                        let popup = document.createElement("div");
+                        popup.classList.add("tkPopup");
+                        popup.id = labelCode;
+                        let popupText = document.createElement("span");
+                        let heading = "<h1>Traditional Knowledge Label:<br><h2>" + name + "</h2></h1>";
+                        let moreInformation = "<br> For more information about TK Labels, <a href='https://localcontexts.org/labels/traditional-knowledge-labels/' target='_blank'>click here.</a>";
+                        popupText.innerHTML = heading + comment + moreInformation;
+                        let closeButton = document.createElement("span");
+                        closeButton.innerHTML = "&#215;";
+                        closeButton.id = "tkCloseButton";
+                        closeButton.title = "Click to close window."
+                        closeButton.addEventListener("click", function(e) {
+                           closeButton.parentElement.remove();
+                        });
+                        popup.appendChild(closeButton);
+                        popup.appendChild(popupText);
+                        e.target.parentElement.appendChild(popup);
+                     }
+                     if (currPopup) currPopup.remove(); // remove existing popup div
+                  });
+               }
+            }
+         }
+      }
+   }
+}
+
+function addTKLabelsToImages(lang) {
+   if (tkMetadataElements == null) {
+      console.error("ajax call not yet loaded tk label metadata set");
+   } else {
+      for (label of tkMetadataElements) { // for each tklabel element in tk.mds
+         let tkLabelName = label.attributes.name.value; // Element name=""
+         let attributes = label.querySelectorAll("[code=" + lang + "] Attribute"); // gets attributes for selected language
+         let tkName = attributes[0].textContent; // name="label"
+         let tkDefinition = attributes[1].textContent; // name="definition"
+         let tkComment = attributes[2].textContent; // name="comment"
+         addTKLabelToImage(tkLabelName, tkDefinition, tkName, tkComment);       
+      }  
+   }
+}
+
+function loadTKMetadataSet(lang) {
+   tkMetadataSetStatus = "loading";
+   $.ajax({
+      url: gs.variables["tkMetadataURL"],
+      success: function(xml) {
+         tkMetadataSetStatus = "loaded";
+         let parser = new DOMParser();
+         let tkmds = parser.parseFromString(xml, "text/xml");
+         tkMetadataElements = tkmds.querySelectorAll("Element");
+         if (document.readyState === "complete") {
+            addTKLabelsToImages(lang);
+         } else {
+            window.onload = function() {
+               addTKLabelsToImages(lang);
+            }
+         }
+      },
+      error: function() {
+         tkMetadataSetStatus = "no-metadata-set-for-this-collection";
+         console.log("No TK Label Metadata-set found for this collection");
+      }
+   });
+};
+
+