added comments (v1.2.2)

danielFHcode · Aug 25, 2022 · 4c6a9aa · 4c6a9aa
1 parent 0e681c3
commit 4c6a9aa
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 4 deletions.
diff --git a/hoverer.js b/hoverer.js
@@ -1,9 +1,13 @@
 /**
- * Shows text on hover
- * @param {HTMLElement} element 
- * @param {string} text
+ * Shows text box on hover
+ * @param {HTMLElement} element - The element which has hoverer applied to it.
+ * @param {string} text - The text that appears in the text box.
  */
 function applyHoverer(element,text){
+    /**
+     * Creating the text box
+     * @type {HTMLSpanElement}
+     */
     const textElement = document.createElement('span');
     textElement.ariaHidden = true;
     textElement.innerText = text;
@@ -17,6 +21,9 @@ function applyHoverer(element,text){
     'font-size: 0.8em;'
     document.body.appendChild(textElement);
 
+    /*
+     * Showing text box when mouse hovers over element.
+     */
     let isMouseOver = false;
     element.addEventListener('mouseover',function(e){
         if (isMouseOver) return;
@@ -37,6 +44,7 @@ function applyHoverer(element,text){
     /**
      * Get element transforms
      * @param {HTMLElement} element 
+     * @return {{x:number,y:number}}
      */
     function getTextBoxTrans(element){
         const boundingClientRect = element.getBoundingClientRect();
@@ -48,16 +56,25 @@ function applyHoverer(element,text){
 }
 
 (function(){
+    /*
+     * Applying hoverer to all element with `data-hoverer-text` attribute
+     */
     const hovererTextElements = document.querySelectorAll('[data-hoverer-text]');
     for (let i = 0; i < hovererTextElements.length; i++) {
         const hovererTextElement = hovererTextElements[i];
         applyHoverer(hovererTextElement,hovererTextElement.getAttribute('data-hoverer-text'));
     }
+    /*
+     * Selecting all element with `data-hoverer-infer` attribute
+     */
     const hovererInferElements = document.querySelectorAll('[data-hoverer-infer]');
     for (let i = 0; i < hovererInferElements.length; i++) {
         const hovererInferElement = hovererInferElements[i];
         const hovererInferValue = hovererInferElement.getAttribute('data-hoverer-infer');
         if (hovererInferValue == 'auto') {
+            /*
+             * Automatically choosing property to infer and applying hoverer with it
+             */
             if (hovererInferElement.tagName == 'IMG'||hovererInferElement.tagName == 'VIDEO') {
                 applyHoverer(
                     hovererInferElement,
@@ -84,6 +101,9 @@ function applyHoverer(element,text){
             }
         }
         else {
+            /*
+             * Apply hoverer with inferred property  
+             */
             applyHoverer(
                 hovererInferElement,
                 hovererInferElement[hovererInferValue]

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "hoverer",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "description": "make text appear on hover",
   "main": "hoverer.js",
   "scripts": {},