From 72520897bf2e7e125d247b6128a08d6bb65e275d Mon Sep 17 00:00:00 2001
From: Mark Eaton <MarkEEaton@users.noreply.github.com>
Date: Sat, 1 Jul 2023 03:25:36 -0400
Subject: [PATCH] working main nav

---
 groups/home/Vue3-v.4.html |   6 +-
 groups/home/src/main4.js  | 342 ++++++++++++++++++++------------------
 2 files changed, 183 insertions(+), 165 deletions(-)

diff --git a/groups/home/Vue3-v.4.html b/groups/home/Vue3-v.4.html
index e19fb41..b07f923 100644
--- a/groups/home/Vue3-v.4.html
+++ b/groups/home/Vue3-v.4.html
@@ -109,7 +109,7 @@
         <!-- end of row -->
         <div class="row" id="hamburger-alternative">
           <div class="col-xs-12">
-            <navig-component></navig-component>
+            <navig-component v-bind:navlistofMenus="navlistofmenus"></navig-component>
           </div>
           <!-- end of col-xs-12 -->
         </div>
@@ -398,8 +398,8 @@
   <script src="https://kbcc-cuny.libanswers.com/load_chat.php?hash=212334892d13e5887f44a2763092678b"></script>
 
   <!-- add Vue scripts -->
-  <!-- <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script> --><!-- development -->
-  <script src="https://unpkg.com/vue/dist/vue.global.prod.js"></script>
+  <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script><!-- development -->
+  <!-- <script src="https://unpkg.com/vue/dist/vue.global.prod.js"></script> -->
   <!--production -->
   <script
     type="text/javascript"
diff --git a/groups/home/src/main4.js b/groups/home/src/main4.js
index 8e05600..49e0671 100644
--- a/groups/home/src/main4.js
+++ b/groups/home/src/main4.js
@@ -12,7 +12,7 @@ const navigComponent = {
   `<nav class="navbar navbar-default main-nav-container">
     <div class="container-fluid">
       <ul class="nav navbar-nav" id="navbar-center">
-        <li v-for="(navmenu, navkey) in navListOfMenus"
+        <li v-for="(navmenu, navkey) in navlistofmenus"
             v-bind:key="navmenu.id"
             class="dropdown main-nav-dropdown"
         >
@@ -46,7 +46,9 @@ const navigComponent = {
         </li>
       </ul>
     </div>
-  </nav>`
+  </nav>`,
+  props: ['navlistofmenus']
+
 }
 
 const onesearchComponent = {
@@ -129,7 +131,8 @@ const onesearchComponent = {
             />
         </div>
     </div>
-</form>`
+</form>`,
+  props: ['selectedItem']
 }
 
 const { createApp } = Vue
@@ -185,165 +188,180 @@ createApp({
           id: 6
         }
       ],
-      navListOfMenus: { 
-        "Find It": [
-          {
-            link: "https://library.kbcc.cuny.edu/az.php",
-            icon: "fas fa-database fa-fw bigger-icon",
-            description: "Databases A to Z",
-            target_blank: "",
-            id: 1
-          },
-          {
-            link: "https://cuny-kb.primo.exlibrisgroup.com/discovery/npsearch?vid=01CUNY_KB:CUNY_KB&search_scope=all",
-            icon: "fas fa-newspaper fa-fw bigger-icon",
-            description: "Newspaper Search",
-            target_blank: "",
-            id: 2
-          },
-          {
-            link: "https://cuny-kb.primo.exlibrisgroup.com/discovery/search?vid=01CUNY_KB:CUNY_KB&tab=CourseReserves&search_scope=CourseReserves",
-            icon: "fas fa-cloud-download-alt fa-fw bigger-icon",
-            description: "Course Reserves",
-            target_blank: "",
-            id: 3
-          },
-          {
-            link: "https://cuny-kb.primo.exlibrisgroup.com/discovery/jsearch?vid=01CUNY_KB:CUNY_KB",
-            icon: "fas fa-book fa-fw bigger-icon",
-            description: "Search for Specific Journals",
-            target_blank: "",
-            id: 4
-          },
-          {
-            link: "https://library.kbcc.cuny.edu/academicworks",
-            icon: "fas fa-archive fa-fw bigger-icon",
-            description: "CUNY Academic Works",
-            target_blank: "_blank",
-            id: 5
-          },
-          {
-            link: "https://www.bkstr.com/kingsboroughccstore/home",
-            icon: "fas fa-cash-register fa-fw bigger-icon",
-            description: "KBCC Bookstore",
-            target_blank: "_blank",
-            id: 6
-          }
-        ],
-        "Services": [
-          {
-            link: "http://kbcc.cuny.illiad.oclc.org/illiad/logon.html",
-            icon: "fas fa-books fa-fw bigger-icon",
-            description: "Interlibrary Loan",
-            target_blank: "_blank",
-            id: 1
-          },
-          {
-            link: "https://library.kbcc.cuny.edu/libraryservices/informationliteracy",
-            icon: "fas fa-chalkboard-teacher fa-fw bigger-icon",
-            description: "Book a Library Instruction Session" ,
-            target_blank: "",
-            id: 2
-          },
-          {
-            link: "https://library.kbcc.cuny.edu/mediaservices",
-            icon: "fas fa-photo-video fa-fw bigger-icon",
-            description: "Media Services",
-            target_blank: "",
-            id: 3
-          },
-          {
-            link: "https://kbcc-cuny.libwizard.com/f/bookrequest",
-            icon: "fas fa-shopping-basket fa-fw bigger-icon",
-            description: "Suggest a Book for Purchase",
-            target_blank: "",
-            id: 4
-          },
-          {
-            link: "https://kbcc-cuny.libwizard.com/id/8cdb3f1a787de3c307a8cf5d75cad406",
-            icon: "fas fa-bookmark fa-fw bigger-icon",
-            description: "Suggest an Item to Add to Reserves",
-            target_blank: "",
-            id: 5
-          }
-        ],
-        "About Us": [
-          {
-            link: "https://library.kbcc.cuny.edu/about-us/directory",
-            icon: "fas fa-address-book fa-fw bigger-icon",
-            description: "Faculty & Staff Directory",
-            target_blank: "",
-            id: 1
-          },
-          {
-            link: "https://library.kbcc.cuny.edu/newarrivals",
-            icon: "far fa-mail-bulk fa-fw bigger-icon",
-            description: "New Arrivals",
-            target_blank: "",
-            id: 2
-          },
-          {
-            link: "https://library.kbcc.cuny.edu/about-us/liaisons",
-            icon: "fas fa-theater-masks fa-fw bigger-icon",
-            description: "Subject Liaisons",
-            target_blank: "",
-            id: 3
-          },
-          {
-            link: "https://library.kbcc.cuny.edu/social",
-            icon: "far fa-hashtag fa-fw bigger-icon",
-            description: "Social Media",
-            target_blank: "",
-            id: 4
-          }
-        ],
-        "Location & Hours": [
-          {
-            link: "https://tour.kingsborough.edu/",
-            icon: "fas fa-map-marked-alt fa-fw bigger-icon",
-            description: "Campus Map",
-            target_blank: "",
-            id: 1
-          },
-          {
-            link: "https://library.kbcc.cuny.edu/calendar",
-            icon: "fas fa-clock fa-fw bigger-icon",
-            description: "Library Hours",
-            target_blank: "",
-            id: 2
-          }
-        ],
-        "Help": [
-          {
-            link: "https://library.kbcc.cuny.edu/askalibrarian",
-            icon: "fas fa-book-reader fa-fw bigger-icon",
-            description: "Ask A Librarian",
-            target_blank: "",
-            id: 1
-          },
-          {
-            link: "https://library.kbcc.cuny.edu/faq",
-            icon: "fas fa-question-circle fa-fw bigger-icon",
-            description: "FAQ",
-            target_blank: "",
-            id: 2
-          },
-          {
-            link: "https://library.kbcc.cuny.edu/guides",
-            icon: "fas fa-telescope fa-fw bigger-icon",
-            description: "Research Guides and Tutorials",
-            target_blank: "",
-            id: 3
-          },
-          {
-            link: "https://library.kbcc.cuny.edu/ENGLISH24",
-            icon: "fas fa-question fa-fw bigger-icon",
-            description: "How to Use the Library",
-            target_blank: "",
-            id: 4
-          }
-        ]
-  	  }
+      navlistofmenus: {
+        'Find It': {
+          id: 1,
+          data: [
+            {
+              link: 'https://library.kbcc.cuny.edu/az.php',
+              icon: 'fas fa-database fa-fw bigger-icon',
+              description: 'Databases A to Z',
+              target_blank: '',
+              id: 1,
+            },
+            {
+              link: 'https://cuny-kb.primo.exlibrisgroup.com/discovery/npsearch?vid=01CUNY_KB:CUNY_KB&search_scope=all',
+              icon: 'fas fa-newspaper fa-fw bigger-icon',
+              description: 'Newspaper Search',
+              target_blank: '',
+              id: 2,
+            },
+            {
+              link: 'https://cuny-kb.primo.exlibrisgroup.com/discovery/search?vid=01CUNY_KB:CUNY_KB&tab=CourseReserves&search_scope=CourseReserves',
+              icon: 'fas fa-cloud-download-alt fa-fw bigger-icon',
+              description: 'Course Reserves',
+              target_blank: '',
+              id: 3,
+            },
+            {
+              link: 'https://cuny-kb.primo.exlibrisgroup.com/discovery/jsearch?vid=01CUNY_KB:CUNY_KB',
+              icon: 'fas fa-book fa-fw bigger-icon',
+              description: 'Search for Specific Journals',
+              target_blank: '',
+              id: 4,
+            },
+            {
+              link: 'https://library.kbcc.cuny.edu/academicworks',
+              icon: 'fas fa-archive fa-fw bigger-icon',
+              description: 'CUNY Academic Works',
+              target_blank: '_blank',
+              id: 5,
+            },
+            {
+              link: 'https://www.bkstr.com/kingsboroughccstore/home',
+              icon: 'fas fa-cash-register fa-fw bigger-icon',
+              description: 'KBCC Bookstore',
+              target_blank: '_blank',
+              id: 6,
+            },
+          ],
+        },
+        Services: {
+          id: 2,
+          data: [
+            {
+              link: 'http://kbcc.cuny.illiad.oclc.org/illiad/logon.html',
+              icon: 'fas fa-books fa-fw bigger-icon',
+              description: 'Interlibrary Loan',
+              target_blank: '_blank',
+              id: 1,
+            },
+            {
+              link: 'https://library.kbcc.cuny.edu/libraryservices/informationliteracy',
+              icon: 'fas fa-chalkboard-teacher fa-fw bigger-icon',
+              description: 'Book a Library Instruction Session',
+              target_blank: '',
+              id: 2,
+            },
+            {
+              link: 'https://library.kbcc.cuny.edu/mediaservices',
+              icon: 'fas fa-photo-video fa-fw bigger-icon',
+              description: 'Media Services',
+              target_blank: '',
+              id: 3,
+            },
+            {
+              link: 'https://kbcc-cuny.libwizard.com/f/bookrequest',
+              icon: 'fas fa-shopping-basket fa-fw bigger-icon',
+              description: 'Suggest a Book for Purchase',
+              target_blank: '',
+              id: 4,
+            },
+            {
+              link: 'https://kbcc-cuny.libwizard.com/id/8cdb3f1a787de3c307a8cf5d75cad406',
+              icon: 'fas fa-bookmark fa-fw bigger-icon',
+              description: 'Suggest an Item to Add to Reserves',
+              target_blank: '',
+              id: 5,
+            },
+          ],
+        },
+        'About Us': {
+          id: 3,
+          data: [
+            {
+              link: 'https://library.kbcc.cuny.edu/about-us/directory',
+              icon: 'fas fa-address-book fa-fw bigger-icon',
+              description: 'Faculty & Staff Directory',
+              target_blank: '',
+              id: 1,
+            },
+            {
+              link: 'https://library.kbcc.cuny.edu/newarrivals',
+              icon: 'far fa-mail-bulk fa-fw bigger-icon',
+              description: 'New Arrivals',
+              target_blank: '',
+              id: 2,
+            },
+            {
+              link: 'https://library.kbcc.cuny.edu/about-us/liaisons',
+              icon: 'fas fa-theater-masks fa-fw bigger-icon',
+              description: 'Subject Liaisons',
+              target_blank: '',
+              id: 3,
+            },
+            {
+              link: 'https://library.kbcc.cuny.edu/social',
+              icon: 'far fa-hashtag fa-fw bigger-icon',
+              description: 'Social Media',
+              target_blank: '',
+              id: 4,
+            },
+          ],
+        },
+        'Location & Hours': {
+          id: 4,
+          data: [
+            {
+              link: 'https://tour.kingsborough.edu/',
+              icon: 'fas fa-map-marked-alt fa-fw bigger-icon',
+              description: 'Campus Map',
+              target_blank: '',
+              id: 1,
+            },
+            {
+              link: 'https://library.kbcc.cuny.edu/calendar',
+              icon: 'fas fa-clock fa-fw bigger-icon',
+              description: 'Library Hours',
+              target_blank: '',
+              id: 2,
+            },
+          ],
+        },
+        Help: {
+          id: 5,
+          data: [
+            {
+              link: 'https://library.kbcc.cuny.edu/askalibrarian',
+              icon: 'fas fa-book-reader fa-fw bigger-icon',
+              description: 'Ask A Librarian',
+              target_blank: '',
+              id: 1,
+            },
+            {
+              link: 'https://library.kbcc.cuny.edu/faq',
+              icon: 'fas fa-question-circle fa-fw bigger-icon',
+              description: 'FAQ',
+              target_blank: '',
+              id: 2,
+            },
+            {
+              link: 'https://library.kbcc.cuny.edu/guides',
+              icon: 'fas fa-telescope fa-fw bigger-icon',
+              description: 'Research Guides and Tutorials',
+              target_blank: '',
+              id: 3,
+            },
+            {
+              link: 'https://library.kbcc.cuny.edu/ENGLISH24',
+              icon: 'fas fa-question fa-fw bigger-icon',
+              description: 'How to Use the Library',
+              target_blank: '',
+              id: 4,
+            },
+          ],
+        },
+      }
     }
   }
 }).mount('#app1');