sgb13-navbar 2.0.0

package/README.md

@@ -0,0 +1,181 @@
+
+# Float Container Configuration Guide
+
+This document explains how to easily configure the float navigation system without having to modify the core implementation files. It also covers how to manage the styling with the included CSS utilities.
+
+## Configuration Approach
+
+The navigation system now uses a configuration-driven approach where all navigation items, links, and UI elements are defined in a single centralized configuration file.
+
+## Files Overview
+
+* `navigation-config.js` - Contains all the configurable navigation elements
+* `config.js` - Contains general system configuration settings
+* `float-ui.js` - Implementation that reads from configuration
+* `css-utils.js` - Utilities for managing the navbar CSS styles
+* `main.js` - Entry point and initialization
+
+## How to Update Navigation Elements
+
+### 1. Updating Navigation Links
+
+To update the navigation links (Game Tips, Download App, etc.), edit the `navLinks` array in `navigation-config.js`:
+
+```javascript
+navLinks: [
+  {
+    href: '/new-url',              // Change the URL
+    translationKey: 'gameTips',    // Reference to translations.js
+    iconClass: 'fa-solid fa-gamepad' // FontAwesome icon class
+  },
+  // Add or remove items as needed
+]
+```
+
+### 2. Updating Grid Items
+
+To update the grid items (Fortune Wheel, VIP Program, etc.), edit the `gridItems` array:
+
+```javascript
+gridItems: [
+  {
+    href: 'https://example.com',
+    imgSrc: '/path/to/image.png',
+    text: 'Display Text',
+    translationKey: 'translationKey',
+    target: '_self'
+  },
+  // Add or remove items as needed
+]
+```
+
+### 3. Updating Dropdown Menus
+
+To update dropdown menus (Follow Us, etc.), edit the `dropdownMenus` array:
+
+```javascript
+dropdownMenus: [
+  {
+    translationKey: 'menuTitle',
+    iconClass: 'fa-solid fa-users',
+    subItems: [
+      {
+        href: 'https://example.com',
+        translationKey: 'subItemText',
+        iconClass: 'fa-brands fa-example',
+        target: '_blank'
+      },
+      // Add or remove sub-items as needed
+    ]
+  }
+]
+```
+
+### 4. Updating Logo and Partnership Logo
+
+To update the logo or partnership logo:
+
+```javascript
+logo: {
+  src: '/path/to/new-logo.png',
+  alt: 'Logo Alt Text'
+},
+
+partnershipLogo: {
+  href: 'https://partner-site.com',
+  imgSrc: '/path/to/partner-logo.png',
+  imgAlt: 'Partner Logo Alt Text'
+}
+```
+
+## Programmatically Updating Configuration
+
+You can also update the configuration programmatically using the exported function:
+
+```javascript
+import { updateNavigationConfig } from './float-ui.js';
+
+// Update specific parts of the navigation
+updateNavigationConfig({
+  navLinks: [
+    // New set of navigation links
+  ],
+  logo: {
+    src: '/path/to/new-logo.png'
+  }
+});
+```
+
+## Managing CSS Styles
+
+The system includes built-in CSS management utilities that allow you to control the styling of the navbar.
+
+### Enabling/Disabling CSS Injection
+
+In `config.js`, you can control whether the CSS is automatically injected:
+
+```javascript
+features: {
+  enabled: true,
+  // ...
+  injectCSS: true  // Set to false to disable CSS injection
+}
+```
+
+### CSS Utility Functions
+
+You can also manipulate the CSS programmatically:
+
+```javascript
+import { injectNavbarCSS, removeNavbarCSS, toggleNavbarCSS, updateNavbarCSS } from './css-utils.js';
+
+// Inject the default CSS
+injectNavbarCSS();
+
+// Remove the CSS
+removeNavbarCSS();
+
+// Toggle CSS based on a condition
+toggleNavbarCSS(true); // Enable
+toggleNavbarCSS(false); // Disable
+
+// Update with custom CSS
+updateNavbarCSS(`
+  /* Your custom CSS here */
+  .sidenav {
+    background-color: #333;
+    color: white;
+  }
+`);
+```
+
+## Translation Keys
+
+All text elements use translation keys that reference the translation system. To add or update translations:
+
+1. Add the translation key to `navigation-config.js`
+2. Make sure the corresponding keys exist in the `translations.js` file
+
+## Adding New Navigation Elements Dynamically
+
+You can also add new navigation links or dropdown menus dynamically after initialization:
+
+```javascript
+import { addNavLink, addDropdownMenu } from './float-ui.js';
+
+// Add a new navigation link
+addNavLink({
+  href: '/new-page',
+  translationKey: 'newPageName',
+  iconClass: 'fa-solid fa-star'
+});
+
+// Add a new dropdown menu
+addDropdownMenu({
+  translationKey: 'newDropdown',
+  iconClass: 'fa-solid fa-list',
+  subItems: [
+    // Array of sub-items
+  ]
+});
+```

package/dist/index.min.js

@@ -0,0 +1 @@
+!function(){"use strict";const n={enabled:!0,showLanguageSelector:!0,showPromotions:!0,injectCSS:!0},e={floatContainer:"navbar-container",sidebar:"mySidenav"},t={enabled:!1,logLevel:"info"},o={enableLogging:!1};function a(n,e="log"){if(!o.enableLogging)return;const t="[Float System]";switch(e){case"warn":console.warn(`${t} ${n}`);break;case"error":console.error(`${t} ${n}`);break;default:console.log(`${t} ${n}`)}}function i(){const n=document.getElementById("navbar-css");return!!n&&(n.parentNode.removeChild(n),a("Navbar CSS removed"),!0)}function r(e){return(void 0!==e?e:n.injectCSS)?(function(n){i();const e=document.createElement("style");e.id="navbar-css",e.type="text/css",e.textContent=n||"@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.1/css/all.min.css');\n.burger-button-wrapper {\n  position: fixed;\n  z-index: 2;\n  top: 8px;\n  left: 15px;\n}\n\n.openbtn {\n  font-size: 20px;\n  cursor: pointer;\n  color: black;\n  border: none;\n  margin: 0;\n  position: relative;\n}\n\n.burger-new-indicator {\n  position: absolute;\n  top: -5px;\n  right: -55px;\n  width: 30px;\n  height: 30px;\n  z-index: 3;\n  pointer-events: none;\n  animation: pulse 1.5s infinite;\n}\n\n@keyframes pulse {\n  0% { transform: scale(0.95); }\n  50% { transform: scale(1.05); }\n  100% { transform: scale(0.95); }\n}\n\n.sidebar-video-container {\n  position: relative;\n  width: 100%;\n  height: 0;\n  padding-bottom: 56.25%; /* 16:9 aspect ratio */\n  margin-top: 10px;\n  margin-bottom: 10px;\n  overflow: hidden;\n  border-radius: 8px;\n}\n\n.sidebar-video-container iframe {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  border: none;\n}\n\n/* Action Buttons Styles */\n.action-buttons-container {\n    display: flex;\n    justify-content: space-between;\n    width: 100%;\n    gap: 0px;\n}\n\n.action-button {\n    flex: 1;\n    text-align: center;\n    transition: transform 0.2s ease;\n    padding-bottom: 10px !important;\n    padding-top: 0px !important;\n}\n\n.action-button:hover {\n  transform: scale(1.05);\n}\n\n.action-button-img {\n  width: 100%;\n  max-height: 50px;\n  object-fit: contain;\n  border-radius: 8px;\n}\n\n.icon-style {\n    color: #fcd34d;\n    font-weight: bold;\n    position: relative;\n    text-shadow: 1px 1px 0 #e0aa00, 2px 2px 0 #c68600, 3px 3px 2px rgba(0, 0, 0, 0.4);\n    background: linear-gradient(to top, #fcd34d 60%, #fff59d 100%);\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n}\n\n.burger-menu-button {\n  background-color: #f7de4d;\n  border: none;\n  border-radius: 8px;\n  font-size: 15px;\n  height: 30px;\n  width: 30px;\n  color: #e8567d;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n}\n\n\n.dropdown-btn.selected-dropdown {\n    border: 4px solid #eae139;\n    border-radius: 8px;\n}\n.dropdown-btn {\n  padding: 0 4px;\n  margin: 2px 0;\n  transition: all 0.2s ease-in-out; /* Smooth transition for border and background */\n}\n.dropdown-btn.selected-dropdown + .dropdown-container {\n  display: block;\n}\n\n.dropdown-btn.selected-dropdown + .dropdown-container {\n  margin-left: 10px;\n  padding-left: 15px;\n}\n\n.nav-icon-img-only {\n    width: 150px;\n    margin-left: 120px;\n}\n\n.nav-text {\n    font-weight: 600;\n}\n\n.nav-icon-img {\n  width: 40px;\n  height: 40px;\n  object-fit: contain;\n  display: block;\n}\n\n.sidenav .icon {\n  font-size: 25px;\n  padding: 0px 20px;\n  width: 73px;\n  text-align: center;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.dropdown-container .icon {\n  padding-left: 40px;\n}\n\n.burger-menu-container {\n  height: 30px;\n  width: 30px;\n}\n\n.burger-menu-icon {\n  width: 25px;\n  height: 100%;\n  display: block;\n  object-fit: contain;\n}\n\n.sidebar-close {\n  background-color: transparent;\n  border: none;\n  border-radius: 8px;\n  font-size: 30px;\n  height: 30px;\n  width: 30px;\n  color: #000;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n}\n\n#header .link i {\n    display: none;\n    line-height: 32px;\n    font-size: 28px;\n}\n#header .link.currency {\n    right: 0px;\n}\n\n.sidebar-grid-nav {\n  width: 100%;\n  padding: 10px 5px;\n  margin: 5px 0;\n}\n\n.sidebar-grid-item {\n    border-radius: 8px;\n    padding: 8px 4px;\n    transition: all 0.3s ease;\n    height: 30px;\n    background: linear-gradient(to top, #fcd34d, #fff59d);\n    box-shadow: 0 4px 0 #c68600, 0 6px 6px rgba(0, 0, 0, 0.3);\n}\n\n.sidebar-grid-item:hover {\n  transform: translateY(-2px);\n}\n\n.sidebar-grid-img {\n  width: 40px;\n  height: 40px;\n  object-fit: contain;\n}\n\n.sidebar-grid-text {\n  color: #000;\n  font-size: 8px !important;\n  font-weight: 600;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  max-width: 100%;\n  white-space: nowrap;\n}\n\n/* For smaller screens */\n@media (max-width: 320px) {\n  .sidebar-grid-img {\n    width: 32px;\n    height: 32px;\n  }\n}\n\n.fa-facebook {\n  color: #1877F2;\n}\n\n.fa-telegram {\n  color: #0088cc;\n}\n\n.fa-whatsapp {\n  color: #25D366; \n}\n\n.fa-instagram {\n  color: #E4405F;\n}\n\n.fa-twitter {\n  color: #1DA1F2;\n}\n\n.dropdown-container {\n  display: none;\n}\n\n.dropdown-btn.active {\n  background-color: #2fee63;\n  color: black;\n  border-radius: 8px;\n}\n\n.dropdown-visible {\n  display: block;\n}\n\n.dropdown-btn .nav-text {\n  margin-right: 10px;\n}\n\n.sidenav {\n  height: 100%;\n  width: 250px;\n  position: fixed;\n  z-index: 3;\n  top: 0;\n  left: -251px;\n  background-image: url(https://spongebob13.bet/media/9d1de25ca9a764c6b7d01.png);\n  background-size: cover;\n  overflow-x: hidden;\n  transition: 0.5s;\n  padding-top: 20px;\n  padding-bottom: 100px;\n  border-right: 2px solid #111d3f;\n  box-sizing: border-box;\n}\n\n\n\n.open {\n  right: calc(100% - 250px);\n}\n\n.dropdown-btn {\n  border: none;\n  background: none;\n  width: 100%;\n  cursor: pointer;\n  outline: none;\n}\n\n.sidenav a, .dropdown-btn {\n    text-decoration: none;\n    color: #fff;\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    padding: 15px 0px;\n    text-transform: none;\n    font-size: 15px;\n    color: #ff4f81;\n    position: relative;\n    text-shadow: 1px 1px 0 #e03a6e, 1px 1px 0 #c92e5d, 1px 1px 0 #b81f4b;\n    background: linear-gradient(145deg, #ff6a98, #ff3c77);\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n    font-family: inherit;\n}\n\n.dropdown-btn {\n    height: 60px;\n}\n\n.mybox {\n  padding-left: 10px;\n  padding-right: 10px;\n}\n\n.sidenav .closebtn {\n    position: absolute;\n    top: 3px;\n    right: 10px;\n    font-size: 20px;\n    margin-left: 50px;\n}\n\n.openbtn {\n  font-size: 20px;\n  cursor: pointer;\n  color: black;\n  border: none;\n  margin: 5px;\n  margin-left: 15px;\n  position: fixed;\n  z-index: 2;\n  top: 8px;\n}\n\n.menu-list-icon {\n  width: 24px;\n  height: 24px;\n}\n\n.menu-list-icon-partner {\n  width: 70%;\n}\n\n.dropdown-container {\n  display: none;\n  padding-left: 8px;\n}\n\n.dropdown-container a {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 10px;\n  padding: 5px;\n  margin-top: 5px;\n}\n.fa-caret-down {\n  float: right;\n  padding-right: 8px;\n}\n\n.unused {\n  background-color: #dad6d6 !important;\n  margin-top: 10px;\n  padding-right: 10px;\n  color: #4d4d4d !important;\n  border-radius: 8px;\n}\n\n.logo {\n  height: 55px;\n  margin: 20px auto;\n  margin-top: 30px;\n}\n\n.hr-style {\n  margin-top: 0.5rem;\n  margin-bottom: 0.5rem;\n  width: 100%;\n  height: 2px;\n  background-color: #000;\n  display: block;\n}\n\n.hr-gray-style {\n  background-image: linear-gradient(to right, #eed792, #f9de8d, #eed792);\n}\n\n#marquee {\n  z-index: 1 !important;\n  padding: 4px !important;\n}\n#header {\n  z-index: 1 !important;\n}\n@media screen and (max-height: 450px) {\n  .sidenav {\n    padding-top: 15px;\n  }\n  .sidenav a {\n    font-size: 18px;\n  }\n}\n\n.special-menu {\n  margin-top: 10px;\n}\n\n.special-menu a {\n  font-size: 10px;\n  padding: 5px;\n  margin: 2px;\n}\n\n.special-menu a .logo {\n  height: 30px;\n  /* animation: mymove 0.8s infinite; */\n}\n\n.download-app {\n  position: fixed;\n  bottom: 0;\n  font-size: 11px !important;\n  font-weight: 700 !important;\n  padding: 10px;\n  width: 250px;\n  box-sizing: border-box;\n}\n\n.download-app-image {\n  width: 90%;\n}\n\n.sidebar-backdrop {\n  position: fixed;\n  inset: 0;\n  z-index: 3;\n}\n\n\n.fortune-wheel-image {\n  width: 100%;\n}\n\n.free-angpao {\n  width: 90px;\n}\n\n.active {\n  background-color: #ea3323;\n  color: black;\n  border-radius: 8px;\n}\n\n.partnership-logo-container {\n  text-align: center;\n  padding-top: 5px;\n  padding-bottom: 5px;\n}\n\n.partnership-logo {\n  max-height: 55px;\n  display: inline-block;\n}\n",document.head.appendChild(e),a("Navbar CSS injected successfully")}(),!0):(i(),!1)}window.closePopup=function(n){const e=document.getElementById("checkin-popup-overlay");e&&(n&&n.target===e?e.style.display="none":n||(e.style.display="none"))};const s={EN:{sidebar:{gameTips:"Game Tips",language:"Language",promotion:"Promotion",vip:"VIP",followUs:"Follow Us",telegram:"Telegram",backupLink:"Backup Link",moreLink:"More Link",downloadApp:"Download App",telegram:"Telegram",facebook:"Facebook",whatsapp:"WhatsApp",twitter:"Twitter",instagram:"Instagram",newPartnership:"New Partnership",ausPartnership:"AUS Partnership",partnership:"Partnership",goldenEgg:"Golden Egg",fortuneWheel:"Fortune Wheel",vipProgram:"VIP Program",dailyCheckin:"Daily Check In"}},ZH:{sidebar:{gameTips:"游戏攻略",language:"语言",promotion:"优惠活动",vip:"贵宾专区",followUs:"关注我们",telegram:"电报",backupLink:"备用链接",moreLink:"更多链接",downloadApp:"下载应用",telegram:"Telegram",facebook:"Facebook",whatsapp:"WhatsApp",twitter:"Twitter",instagram:"Instagram",newPartnership:"New Partnership",ausPartnership:"AUS 澳洲联盟",partnership:"合作伙伴",goldenEgg:"黄金彩蛋",fortuneWheel:"幸运转盘",vipProgram:"贵宾计划",dailyCheckin:"每日签到"}}};function d(n){const e=(localStorage.getItem("LANGUAGE")||"EN").replace(/['"]/g,"");return s[e]?.[n]||s.EN[n]}function c(n,e){return d(n)[e]||s.EN[n][e]}let l={};const p={new:["doraemon13","mickey13"],regular:["gucci9","dior13","lvspin"]},m=n=>p[n].map((n=>{const e=l[n];return e?{href:e.href,translationKey:"",icon:{imgSrc:e.imgSrc,className:"nav-icon-img-only"},target:"_blank"}:null})).filter((n=>null!==n)),g={logo:{src:"https://spongebob13.net/media/4732e1a117a7690841006.png",alt:"Logo"},burgerMenu:{showNewIndicator:!0,newIndicatorUrl:"https://static.gwvkyk.com/media/4839064235e7686882c04.png",imgSrc:"",imgAlt:"Menu"},video:{url:"https://streamable.com/e/u4ann5?autoplay=1"},actionButtons:{deposit:{imgSrc:"https://spongebob13.bet/media/490dca4b88a762d1ee296.png",imgAlt:"Deposit",href:"/deposit",translationKey:"deposit"},withdraw:{imgSrc:"https://spongebob13.bet/media/1260e05b88a76b97fe97e.png",imgAlt:"Withdraw",href:"/withdraw",translationKey:"withdraw"}},gridItems:[{onClick:"navigateToPromoPage(2)",imgSrc:"https://static.gwvkyk.com/media/23369e5273f769079daf2.png",imgAlt:"Fortune Wheel",text:"Fortune Wheel",translationKey:"fortuneWheel"},{onClick:"navigateToPromoPage(3)",imgSrc:"https://static.gwvkyk.com/media/5808d29273f760003ec4b.jpg",imgAlt:"VIP Program",text:"VIP Program",translationKey:"vipProgram"},{onClick:"navigateToPromoPage(4)",imgSrc:"https://static.gwvkyk.com/media/1dc89bd273f7633f39208.png",imgAlt:"Check In Bonus",text:"Daily Check In",translationKey:"dailyCheckin"},{onClick:"navigateToPromoPage(5)",imgSrc:"https://static.gwvkyk.com/media/601ca40373f76c23655d4.png",imgAlt:"Smash The Golden Egg",text:"Smash The Golden Egg",translationKey:"goldenEgg",target:"_self"}],navLinks:[{href:"/leaderboard",translationKey:"gameTips",iconClass:"fa-solid icon-style fa-gamepad"},{href:"https://www.spongebob13auh5api.live/uploads/appwrap.html",translationKey:"downloadApp",iconClass:"fa-solid icon-style fa-download"},{href:"javascript:void(0)",translationKey:"language",iconClass:"fa-solid icon-style fa-language",id:"changelanguage",className:"link language"}],dropdownMenus:[{translationKey:"followUs",iconClass:"fa-solid icon-style fa-users",subItems:[{href:"https://www.facebook.com/Spongebob13au",translationKey:"facebook",iconClass:"fa-brands fa-facebook",target:"_blank"},{href:"https://t.me/Spongebob13Channel",translationKey:"telegram",iconClass:"fa-brands fa-telegram",target:"_blank"},{href:"https://wa.me/60142400931",translationKey:"whatsapp",iconClass:"fa-brands fa-whatsapp",target:"_blank"}]},{translationKey:"newPartnership",iconClass:"fa-solid icon-style fa-web-awesome",getSubItems:()=>m("new")},{translationKey:"partnership",iconClass:"fa-solid icon-style fa-handshake",getSubItems:()=>m("regular")}],gridConfig:{columns:2,containerClass:"sidebar-grid-nav",itemClass:"sidebar-grid-item",imgClass:"sidebar-grid-img"},async loadPartnerships(){try{const n=await fetch("https://gist.githubusercontent.com/jessy8768/4ad263e177046edada29ccd4386318c8/raw/aus",{headers:{Accept:"application/json"},cache:"no-store"});if(!n.ok)throw new Error(`HTTP error! Status: ${n.status}`);const e=await n.json();return l=e,window.refreshFloatNavigation&&window.refreshFloatNavigation(),!0}catch(n){return console.error("Error loading partnerships:",n),l={doraemon13:{name:"Doraemon13",href:"https://doraemon13.com/RFAUSPARSHIP",imgSrc:"https://static.gwvkyk.com/media/a02d13e272d76ad1c998a.png"},mickey13:{name:"Mickey13",href:"https://micky13.net/RFMENUBARMICKY",imgSrc:"https://static.gwvkyk.com/media/f3e2fbe272d7628b1b703.png"},gucci9:{name:"Gucci",href:"https://gucci9.vip/RFMENUGUCCI",imgSrc:"https://static.gwvkyk.com/media/49dd379572d769e78b8d2.png"},dior13:{name:"Dior13",href:"https://dior13.net/RFMENUBARDIOR",imgSrc:"https://static.gwvkyk.com/media/9ff84d9572d761de03a3b.png"},lvspin:{name:"Lvspin",href:"https://lvspin13.net/RFMENULV",imgSrc:"https://static.gwvkyk.com/media/108093a572d76730d34fa.png"},me99:{name:"Me99",href:"https://me99aud.com/RFMENUME",imgSrc:"https://static.gwvkyk.com/media/a04f213772d76f91afac9.png"},rainbow13:{name:"Rainbow13",href:"https://rainbow13.com/RFMENURAINBOW",imgSrc:"https://static.gwvkyk.com/media/5880183772d7698cb7c99.png"},pokemon13:{name:"Pokemon13",href:"https://pokemon13.com/RFMENUBAR",imgSrc:"https://static.gwvkyk.com/media/c1503f3772d769e3ba3e3.png"},lotso13:{name:"Lotso13",href:"https://lotso13.net/RFMENUBARLOTSO",imgSrc:"https://static.gwvkyk.com/media/8896a74772d7695e514cd.png"},mrbean9:{name:"Mrbean9",href:"https://mrbean9.com/RFMENUMR9",imgSrc:"https://static.gwvkyk.com/media/41b88c4772d7652b37ca3.png"},bigpay77:{name:"Bigpay77",href:"https://bigpay77.net/RFMENUB7",imgSrc:"https://static.gwvkyk.com/media/13e1975772d76cec03cef.png"},avengers9:{name:"Avengers",href:"https://avengers9.net/RFMENUAV9",imgSrc:"https://static.gwvkyk.com/media/cc37859772d76977fd400.png"}},window.refreshFloatNavigation&&window.refreshFloatNavigation(),!1}},get partnershipRepository(){return l},selectedPartnerships:p};function u(n){const{href:e,translationKey:t,defaultText:o,iconClass:a,icon:i,id:r,className:s,target:d}=n,l=document.createElement("a");l.href=e||"javascript:void(0)",d&&(l.target=d),r&&(l.id=r),s&&(l.className=s),t&&(l.dataset.translationKey=t);const p=document.createElement("div");if(p.className="icon",i&&i.imgSrc){const n=document.createElement("img");n.src=i.imgSrc,n.alt=i.imgAlt||"",n.className=i.className||"nav-icon-img",p.appendChild(n)}else if(a){const n=document.createElement("i");n.className=a,p.appendChild(n)}const m=document.createElement("div"),g=t?c("sidebar",t):o||"";return m.textContent=g,m.className="nav-text",l.appendChild(p),l.appendChild(m),l}function h(n){if(!n)return a("Float container not found","error"),!1;const e=document.createElement("div");e.className="sidenav",e.id="mySidenav",e.style.left="-251px";const t=document.createElement("div");t.className="mybox";const o=document.createElement("img");o.className="logo",o.src=g.logo.src,o.alt=g.logo.alt||"Logo",t.appendChild(o);const i=document.createElement("div");i.className="hr-style",t.appendChild(i);const r=document.createElement("a");r.href="javascript:void(0)",r.className="closebtn",r.onclick=function(){window.closeNav()};const s=document.createElement("button");s.className="sidebar-close";const d=document.createElement("i");if(d.className="fa-solid fa-xmark",s.appendChild(d),r.appendChild(s),t.appendChild(r),g.video&&g.video.url){const n=document.createElement("div");n.style.position="relative",n.style.width="100%",n.style.height="0px",n.style.paddingBottom="56.250%",n.style.marginTop="10px",n.style.marginBottom="10px";const e=document.createElement("iframe");e.src=g.video.url,e.width="100%",e.height="100%",e.style.border="none",e.style.position="absolute",e.style.left="0px",e.style.top="0px",e.style.overflow="hidden",e.allowFullscreen=!0,e.setAttribute("muted",""),e.allow="fullscreen;autoplay;muted",n.appendChild(e),t.appendChild(n)}const l=function(n,e={}){const{columns:t=2,containerClass:o="nav-grid-container",itemClass:a="nav-grid-item",imgClass:i="nav-grid-img",textClass:r="sidebar-grid-text"}=e,s=document.createElement("div");return s.className=o,s.style.display="grid",s.style.gridTemplateColumns=`repeat(${t}, 1fr)`,s.style.gap="10px",s.style.padding="10px 0",n.forEach((n=>{const e=void 0!==n.onClick,t=document.createElement("div");if(e?(t.style.cursor="pointer","function"==typeof n.onClick?t.onclick=n.onClick:"string"==typeof n.onClick&&t.setAttribute("onclick",n.onClick)):n.href&&(t.style.cursor="pointer",t.onclick=function(){"_blank"===n.target?window.open(n.href,"_blank"):window.location.href=n.href}),t.className=a,t.style.textDecoration="none",t.style.textAlign="center",t.style.display="flex",t.style.alignItems="center",t.style.justifyContent="center",n.id&&(t.id=n.id),n.imgSrc){const e=document.createElement("img");e.src=n.imgSrc,e.alt=n.imgAlt||"",e.className=i,e.style.width=n.imgWidth||"30px",e.style.height=n.imgHeight||"auto",e.style.marginBottom="5px",t.appendChild(e)}else if(n.iconClass){const e=document.createElement("div");e.className="icon";const o=document.createElement("i");o.className=n.iconClass,o.style.fontSize=n.iconSize||"24px",o.style.marginBottom="5px",e.appendChild(o),t.appendChild(e)}if(n.text){const e=document.createElement("span");e.textContent=n.text,e.className=r,e.style.fontSize=n.fontSize||"12px",n.translationKey&&(e.dataset.translationKey=n.translationKey,e.textContent=c("sidebar",n.translationKey)||n.text),t.appendChild(e)}s.appendChild(t)})),s}(g.gridItems,g.gridConfig);if(t.appendChild(l),g.actionButtons){const n=function(n){const e=document.createElement("div");if(e.className="action-buttons-container",n.deposit){const t=document.createElement("a");t.href="javascript:void(0)",t.className="action-button deposit-button",t.onclick=function(){try{const e=localStorage.getItem("USER"),t=e?JSON.parse(e):null;t&&t.username?window.location.href=n.deposit.href:window.location.href="/login"}catch(n){window.location.href="/login"}};const o=document.createElement("img");o.src=n.deposit.imgSrc,o.alt=n.deposit.imgAlt||"Deposit",o.className="action-button-img",n.deposit.translationKey&&(t.dataset.translationKey=n.deposit.translationKey),t.appendChild(o),e.appendChild(t)}if(n.withdraw){const t=document.createElement("a");t.href="javascript:void(0)",t.className="action-button withdraw-button",t.onclick=function(){try{const e=localStorage.getItem("USER"),t=e?JSON.parse(e):null;t&&t.username?window.location.href=n.withdraw.href:window.location.href="/login"}catch(n){window.location.href="/login"}};const o=document.createElement("img");o.src=n.withdraw.imgSrc,o.alt=n.withdraw.imgAlt||"Withdraw",o.className="action-button-img",n.withdraw.translationKey&&(t.dataset.translationKey=n.withdraw.translationKey),t.appendChild(o),e.appendChild(t)}return e}(g.actionButtons);t.appendChild(n)}var p;return g.navLinks.forEach(((n,e)=>{t.appendChild(u(n))})),g.dropdownMenus.forEach((n=>{const e=function(n){const{translationKey:e,iconClass:t,icon:o,subItems:i=[],getSubItems:r}=n,s=document.createDocumentFragment(),d=document.createElement("button");d.className="dropdown-btn",e&&(d.dataset.translationKey=e);const l=document.createElement("div");if(l.className="icon",o&&o.imgSrc){const n=document.createElement("img");n.src=o.imgSrc,n.alt=o.imgAlt||"",n.className=o.className||"nav-icon-img",l.appendChild(n)}else if(t){const n=document.createElement("i");n.className=t,l.appendChild(n)}const p=document.createElement("div"),m=e?c("sidebar",e):n.defaultText||"";p.textContent=m,p.className="nav-text";const g=document.createElement("i");g.className="fa-solid fa-angle-down",d.appendChild(l),d.appendChild(p),d.appendChild(g);const h=document.createElement("div");return h.className="dropdown-container",(r?r():i).forEach((n=>{if("custom"===n.type&&n.html){const e=document.createElement("div");e.className="dropdown-item-container","string"==typeof n.html?e.innerHTML=n.html:n.html instanceof HTMLElement&&e.appendChild(n.html),h.appendChild(e)}else if("raw"===n.type&&n.element)h.appendChild(n.element);else{const e=u(n);h.appendChild(e)}})),d.addEventListener("click",(function(){const n=this.classList.contains("active");document.querySelectorAll(".dropdown-btn").forEach((n=>{n.classList.remove("active","selected-dropdown");const e=n.nextElementSibling;e&&e.classList.contains("dropdown-container")&&e.classList.remove("dropdown-visible")})),n||(this.classList.add("active","selected-dropdown"),h.classList.add("dropdown-visible")),a("Dropdown toggled using improved class approach")})),s.appendChild(d),s.appendChild(h),s}(n);t.appendChild(e)})),e.appendChild(t),n.appendChild(e),p=f,window.addEventListener("storage",(n=>{"LANGUAGE"!==n.key&&"selectedLanguage"!==n.key||"function"==typeof p&&p()})),document.addEventListener("languageChange",(()=>{"function"==typeof p&&p()})),a("Sidebar created successfully"),!0}function f(){a("Updating sidebar translations");document.querySelectorAll("[data-translation-key]").forEach((n=>{const e=n.dataset.translationKey;if("BUTTON"===n.tagName){const t=n.querySelector(".nav-text");t&&e&&(t.textContent=c("sidebar",e))}else if("SPAN"===n.tagName)n.textContent=c("sidebar",e);else{const t=n.querySelector(".nav-text");t&&e&&(t.textContent=c("sidebar",e))}}))}function b(){const n=document.createElement("div");n.className="burger-button-wrapper";const e=document.createElement("span");e.className="openbtn",e.onclick=function(){window.openNav()};const t=document.createElement("div");t.className="burger-menu-container",t.role="button",t.tabIndex=0;const o=g.burgerMenu||{};if(o.imgSrc){const n=document.createElement("img");n.src=o.imgSrc,n.alt=o.imgAlt||"Menu",n.className=o.className||"burger-menu-icon",t.appendChild(n)}else{const n=document.createElement("div");n.className="burger-menu-button";const e=document.createElement("i");e.className="fa-solid fa-bars",n.appendChild(e),t.appendChild(n)}if(e.appendChild(t),n.appendChild(e),o.showNewIndicator&&o.newIndicatorUrl){const e=document.createElement("img");e.src=o.newIndicatorUrl,e.alt="New",e.className="burger-new-indicator",n.appendChild(e)}return n}function w(){const n=document.getElementById("navbar-container");return n?(n.innerHTML="",h(n),n.appendChild(b()),a("UI refreshed with updated configuration"),!0):(a("Float container not found for refreshing UI","error"),!1)}function x(){window.openNav=function(){const n=document.getElementById("mySidenav"),e=document.querySelector(".sidebar-container")||document.getElementById("floatcontainer");if(!n||!e)return void a("Navigation elements not found","error");const t=document.createElement("div");t.classList.add("sidebar-backdrop"),t.addEventListener("click",window.closeNav),e.prepend(t),n.style.left="0",a("Sidebar opened")},window.closeNav=function(){const n=document.getElementById("mySidenav"),e=document.querySelector(".sidebar-backdrop");n&&(n.style.left="-251px"),e&&e.remove(),a("Sidebar closed")},window.toggleLanguagePopup=function(){const n=document.querySelector("#changelanguage");n&&(window.closeNav(),n.click(),a("Language popup toggled"),setTimeout((()=>{const n=new Event("languageChange");document.dispatchEvent(n)}),500))},a("Navigation functions initialized"),setTimeout((()=>{const n=document.getElementsByClassName("dropdown-btn");for(let e=0;e<n.length;e++)n[e].addEventListener("click",(function(){this.classList.toggle("active");const n=this.nextElementSibling;"block"===n.style.display?n.style.display="none":n.style.display="block",a(`Dropdown ${e+1} toggled`)}));a("Dropdowns configured")}),100)}function y(){var n;n=t.enabled,o.enableLogging=n,a("Logging "+(n?"enabled":"disabled")),r(!0);const i=document.getElementById(e.floatContainer);return i?!!h(i)&&(i.appendChild(b()),x(),a("Float container initialized successfully"),!0):(a("Float container element not found","error"),!1)}g.loadPartnerships(),window.floatNavConfig=g,window.updateFloatNavConfig=function(n){try{return n.logo&&Object.assign(g.logo,n.logo),n.gridItems&&(g.gridItems=n.gridItems),n.navLinks&&(g.navLinks=n.navLinks),n.dropdownMenus&&(g.dropdownMenus=n.dropdownMenus),n.partnershipLogo&&Object.assign(g.partnershipLogo,n.partnershipLogo),n.gridConfig&&Object.assign(g.gridConfig,n.gridConfig),w(),a("Navigation configuration updated successfully"),!0}catch(n){return a(`Error updating navigation config: ${n.message}`,"error"),!1}},window.refreshFloatNavigation=function(){return w()},window.navigateToPromoPage=function(n){const e=document.getElementById("promoUserID").value;if(""===e.trim())return void alert("Please login first!");let t,o,a=document.getElementById("testUserID");a?(t=document.querySelector('input[id="testUserID"]').getAttribute("ref"),o=a.value):(t=document.querySelector('input[id="promoUserID"]').getAttribute("ref"),o=e);const i=btoa(t+"="+o),r=document.createElement("form");r.setAttribute("method","POST"),r.setAttribute("action",`https://spongebob13.gme1.co/p${n}.aspx`);const s=document.createElement("input");s.setAttribute("type","hidden"),s.setAttribute("name","userData"),s.setAttribute("value",i),r.appendChild(s),document.body.appendChild(r),r.submit()},window.floatContainerInitialized=!1,document.addEventListener("DOMContentLoaded",(function(){(function(){if(window.floatContainerInitialized)return!0;if(document.getElementById(e.floatContainer)){window.floatContainerInitialized=!0;const n=y();return window.floatObserverInstance&&window.floatObserverInstance.disconnect(),n}return!1})()||(!function(){const n=new MutationObserver(((n,t)=>{window.floatContainerInitialized||document.getElementById(e.floatContainer)&&(window.floatContainerInitialized=!0,y(),t.disconnect(),a("Float container initialized via observer"))}));window.floatObserverInstance&&window.floatObserverInstance.disconnect(),function e(){document.body?(n.observe(document.body,{childList:!0,subtree:!0}),window.floatObserverInstance=n,a("Observer started watching for DOM changes")):setTimeout(e,50)}()}(),a("Observer setup as initialization fallback"))}))}();

package/package.json

@@ -0,0 +1,19 @@
+{
+    "name": "sgb13-navbar",
+    "version": "2.0.0",
+    "main": "dist/index.min.js",
+    "files": [
+      "dist/index.min.js"
+    ],
+    "scripts": {
+      "build": "rollup -c",
+      "prepublishOnly": "npm run build"
+    },
+    "author": "",
+    "license": "MIT",
+    "devDependencies": {
+      "@rollup/plugin-node-resolve": "^13.3.0",
+      "rollup": "^2.79.1",
+      "rollup-plugin-terser": "^7.0.2"
+    }
+  }