code added

dist/js/allInOne.js

@@ -0,0 +1,96 @@
+$('.owl-carousel').owlCarousel({
+    // rtl:true,
+    // loop:true,
+    margin:200,
+ 
+    nav:true,
+    URLhashListener:true,
+        autoplayHoverPause:true,
+        responsiveClass:true,
+        responsive:{
+            0:{
+                items:1,
+                nav:true,
+                margin:10
+            },
+
+            600:{
+                items:2,
+                nav:false,
+                margin:200
+            },  
+
+            1000:{
+                items:3,
+                nav:true,
+                loop:false,
+                margin:10
+            },
+            1400:{
+                items:5,
+                nav:true,
+                loop:false,
+                margin:200
+            }
+        }
+})
+
+const controller  = new ScrollMagic.Controller();
+const exploreSence = new ScrollMagic.Scene({
+    triggerElement:".animateHeadingLeft",
+    triggerHook:0.5,
+    reverse:false
+}).setClassToggle('.animateHeadingLeft','addTextanimationLeft').addTo(controller)
+const controllerNew  = new ScrollMagic.Controller();
+new ScrollMagic.Scene({
+    triggerElement:".animateHeadingRight",
+    triggerHook:0.9,
+    reverse:false
+}).setClassToggle('.animateHeadingRight','addTextanimationRight').addTo(controllerNew)
+
+const controllerThree  = new ScrollMagic.Controller();
+new ScrollMagic.Scene({
+    triggerElement:".laptoponanimation",
+    triggerHook:0.9,
+    reverse:false
+}).setClassToggle('.laptoponanimation','addOpacity').addTo(controllerThree)
+
+const controllerFour  = new ScrollMagic.Controller();
+new ScrollMagic.Scene({
+    triggerElement:".allinOnepc",
+    triggerHook:0.9,
+    reverse:false
+}).setClassToggle('.allinOnepc','addOpacity').addTo(controllerFour)
+
+
+const controllerFive = new ScrollMagic.Controller();
+new ScrollMagic.Scene({
+    triggerElement:".dualLaptopSlideone",
+    triggerHook:0.9,
+    reverse:false
+}).setClassToggle('.dualLaptopSlideone','addTextanimationRight').addTo(controllerFive)
+
+const controllerSix = new ScrollMagic.Controller();
+new ScrollMagic.Scene({
+    triggerElement:".dualLaptopSlideLeftone",
+    triggerHook:0.9,
+    reverse:false
+}).setClassToggle('.dualLaptopSlideLeftone','dualLaptopSlideLeftoneLeft').addTo(controllerSix)
+
+const controllerSeven = new ScrollMagic.Controller();
+new ScrollMagic.Scene({
+    triggerElement:".cpuSlideLeftone",
+    triggerHook:0.9,
+    reverse:false
+}).setClassToggle('.cpuSlideLeftone','traslateZero').addTo(controllerSeven)
+
+const controllerEight = new ScrollMagic.Controller();
+new ScrollMagic.Scene({
+    triggerElement:".controllerEight",
+    triggerHook:0.9,
+    reverse:false
+}).setClassToggle('.controllerEight','traslateZero').addTo(controllerSeven)
+
+
+
+

dist/js/auth/apiservice.js

@@ -0,0 +1,353 @@
+//let SERVERNAME = 'https://anwi.bizgaze.app';
+//let SERVERNAME = 'http://beta.bizgaze.com';
+let SERVERNAME = 'https://qa.anwisystems.com';
+ //let SERVERNAME = 'http://localhost:3088';
+
+//template
+const STAT = 'd8c3dc7ce4d2404484004c02d1d3145f';
+
+//live
+//const STAT = '23bdb3c6d08d492c939a53daec34e89a';
+
+const USER_AUTH_OKAY = 'USER_AUTH_OKAY';
+
+
+function imgServerNameBuild(path){
+    
+    return `https://appassets.bizgaze.app/${path}`;
+}
+
+
+function buildLinkWithServerName(link){
+    return `${SERVERNAME}/${link}`
+}
+
+
+async function getStatAPIService(url,data={}){
+    let config = {
+        url,
+        method:'get',
+        data:data,
+        headers: {
+            'Authorization': `stat ${STAT}`,
+            'Content-Type': 'application/json'
+        },
+    }
+    let response = await axios(config);
+
+    return response;
+}
+
+async function getAPIService(url,data={}){
+ 
+    const config = {
+        url:`${SERVERNAME}/${url}`,
+        method: "get",
+      };
+    let response = await axios(config);
+
+    return response;
+}
+
+async function postAPIService(url,data={}){
+    let config = {
+        url:`${SERVERNAME}/${url}`,
+        method:'post',
+        data:data,
+    }
+    let response = await axios(config);
+
+    return response;
+}
+
+
+async function postStatAPIService(url,data={}){
+    let config = {
+        url,
+        method:'post',
+        data:data,
+        headers: {
+            'Authorization': `stat ${STAT}`,
+            'Content-Type': 'application/json'
+        },
+    }
+    let response = await axios(config);
+
+    return response;
+}
+
+
+
+
+
+async function postAPIServiceLocal(url,data={}){
+    let config = {
+      url:`${SERVERNAME}/${url}`,
+        method:'post',
+        data:JSON.stringify(data    ),
+        headers: {
+            'Authorization': `Basic b67607dd-283e-478e-b2cf-35736e8bad69`,
+            'Content-Type': 'application/json'
+        },
+    }
+    let response = await axios(config);
+
+    return response;
+}
+async function getAPIServiceLocal(url){
+    let config = {
+      url:`${SERVERNAME}/${url}`,
+        method:'get',
+    
+        headers: {
+            'Authorization': `Basic b67607dd-283e-478e-b2cf-35736e8bad69`,
+            'Content-Type': 'application/json'
+        },
+    }
+    let response = await axios(config);
+
+    return response;
+}
+
+
+class API_SERVICE_CLASS{
+    baseURL = '';
+    token='';
+    statToken=STAT;
+    Instance = null;
+    
+    constructor(baseurl){
+        this.Instance = this;
+        this.baseURL = baseurl;
+
+        this.getService = this.getService.bind(this);
+        this.postService = this.postService.bind(this);
+        this.justGetAPIService =this.justGetAPIService.bind(this);
+        this.justPostAPIService = this.justPostAPIService.bind(this);
+        
+    }
+
+    getService(url,isStat = false){
+       return this.baseService(this.buildURL(url),'get',isStat);
+    }
+
+    postService(url,data,isStat = false){
+        return this.baseService(this.buildURL(url),'post',isStat,data);
+    }
+
+    
+
+    async baseService(url,method,isStat,data){
+        let isPost = method == 'get' ? false : true;
+        const cookieData = COOKIE_HELPER_ACTIONS.getCookie();
+       if(!isStat){
+        if(!cookieData) return window.location.href = "login.html"
+       }
+        let token = isStat ?`stat ${this.statToken}` : `Basic ${cookieData.token}`;
+        this.token = token;
+        let successResFun = this.buildSuccessResponse;
+        let failureResFun = this.buildFailureResponse;
+        let config = {
+            url,
+            method,
+            headers:{
+               'Authorization': token,
+               'Content-Type': 'application/json'
+            }
+        }
+
+        if(isPost){
+            config['data'] = data;
+        }
+
+        try {
+            let response 
+           try {
+            response = await axios(config);
+            if(response.data === true || response.data === false){
+                return successResFun(response.data)
+            }
+            if(response.data.code == '417'){
+                // window.location.href = '/index.html'
+                return failureResFun(response.data)
+            }
+            if(response.data.code != '0'){
+                return failureResFun(response.data)
+            }
+
+            if(response.data.errors?.length){
+                return failureResFun(response.data)
+            }
+            return successResFun(response.data)
+            
+           } catch (error) {
+            return failureResFun(error)
+           }
+            
+        } catch (error) {
+            return failureResFun(error)
+        }
+
+    }
+
+    buildURL(url){
+        return `${this.baseURL}/${url}`;
+    }
+
+    buildSuccessResponse(response){
+        return {
+            isError : false,
+            errorMsg : null,
+            response:response,
+        }
+    }
+
+    buildFailureResponse(error){
+        return {
+            isError : true,
+            errorMsg : error,
+            response:null,
+        }
+    }
+
+    async justAPI_BaseService(){
+        let isPost = method == 'get' ? false : true;
+
+    
+        let successResFun = this.buildSuccessResponse;
+        let failureResFun = this.buildFailureResponse;
+        let config = {
+            url,
+            method,
+            headers:{
+               
+               'Content-Type': 'application/json'
+            }
+        }
+
+        if(isPost){
+            config['data'] = data;
+        }
+
+        try {
+            let response 
+           try {
+            response = await axios(config);
+            if(response.data.code == '417'){
+                // window.location.href = '/index.html'
+                return failureResFun(response.data)
+            }
+            if(response.data.code != '0'){
+                return failureResFun(response.data)
+            }
+            return successResFun(response.data)
+            
+           } catch (error) {
+            return failureResFun(error)
+           }
+            
+        } catch (error) {
+            return failureResFun(error)
+        }
+    }
+
+    justGetAPIService(url){
+        return this.justAPI_BaseService('get',url)
+    }
+    justPostAPIService(url){
+        return this.justAPI_BaseService('post',url)
+    }
+
+
+    isValid(){
+        const cookieData = COOKIE_HELPER_ACTIONS.getCookie();
+        if(!cookieData){
+          return  justGetAPIService('/Account/Session/Validate')
+        }
+
+      
+
+
+    }
+
+    
+}
+
+const API_SERVICES = new API_SERVICE_CLASS(SERVERNAME);
+
+const API_SERVICES_ACTIONS = {
+    postAPIService:API_SERVICES.postService,
+    getAPIService:API_SERVICES.getService
+}
+
+
+// cookie helper
+const AUTH = 'AUTH'
+
+class COOKIE_HELPER_CLASS{
+    constructor(){
+        this.getCookie = this.getCookie.bind(this);
+    }
+    getCookie(){
+        let cookieVal = Cookies.get(AUTH);
+        if(!cookieVal){
+            return null;
+        }
+    return JSON.parse(cookieVal)
+    };
+    setCookie(value){
+        debugger;
+        return Cookies.set(AUTH,value)
+    };
+
+    removeCookie(token){
+           debugger;
+        Cookies.remove(token)
+    }
+
+
+    async validateToken(){
+        return await API_SERVICES_ACTIONS.getAPIService(`Account/Session/Validate`)
+    }
+}
+
+
+const COOKIE_HELPER = new COOKIE_HELPER_CLASS();
+const COOKIE_HELPER_ACTIONS ={
+    getCookie : COOKIE_HELPER.getCookie,
+    setCookie :COOKIE_HELPER.setCookie,
+    removeAuthCookie:COOKIE_HELPER.removeCookie.bind(null,AUTH)
+}
+
+
+function setCookieManual(token){
+    Cookies.set(AUTH,{
+        token,
+        userId:null
+    })
+}
+
+async function checkValidAuth(cb,redirect=undefined){
+
+
+   document.querySelector('auth-loader').show();
+    const res = await COOKIE_HELPER.validateToken();
+    if(!res.response){
+        if(redirect){
+            window.location.href =redirect;
+         document.querySelector('auth-loader').hide();
+         return;
+        }
+        window.location.href = '/';
+         document.querySelector('auth-loader').hide();
+        return;
+    }
+    
+   setTimeout(()=>{
+    document.querySelector('auth-loader').hide();
+    cb();
+   },300);
+}
+
+
+// setCookieManual('6eb70fee-35ef-4ca2-95cd-01ebdd616eb1');

dist/js/auth/login.js

@@ -0,0 +1,720 @@
+
+
+let AUTH_LOGIN_APIS_URL = {
+  isUser(user) {
+    return `account/getuserbyphoneormail/${user}/${user}`;
+  },
+  login() {
+    return `bizgaze/crm/webapi/crmuserlogin`
+  },
+  signUp() {
+    return `bizgaze/crm/webapi/registercrmuser`;
+  },
+  resendOTP() {
+    return `bizgaze/crm/webapi/ReSendOtp`;
+  },
+  sendOTP() {
+    return `account/sendotp`;
+  },
+  updatePassword() {
+    return `account/UpdatePassword`;
+  }
+}
+
+initLogin();
+
+
+
+
+
+function initLogin() {
+  
+  let userDetails = {
+    otpid: null,
+    email: null,
+    password: null,
+    unibaseid: null
+  }
+  let backotp = null;
+  let backOptions = {
+    forgotPassword:'forgotPassword',
+    EmailnotV:'EmailnotV',
+    signUp:'signUp'
+  }
+  let authloginLoadingBtnAction = {
+    addLoading() {
+      $('.authloginLoading').addClass('d-none');
+      $('.authloginLoadingBtn').removeClass('d-none');
+    },
+    removeLoading() {
+      $('.authloginLoading').removeClass('d-none');
+      $('.authloginLoadingBtn').addClass('d-none');
+    }
+  }
+
+  let otpLoadingAction = {
+    addLoadingOTP() {
+      $('.otploading').removeClass('d-none');
+      $('.otploadingtext').addClass('d-none');
+    },
+    removeLoadingOTP() {
+      $('.otploading').addClass('d-none');
+      $('.otploadingtext').removeClass('d-none');
+    }
+  }
+
+  let formErrorAction = {
+    addError(message) {
+      $('.error_msg').removeClass('d-none');
+      $('.error_msg_res').html(message);
+    },
+    removeClass() {
+      $('.error_msg').addClass('d-none');
+      $('.error_msg_res').html('');
+    }
+  }
+  function init() {
+    const logoauth = $('.logoauth');
+    logoauth.removeClass('d-none');
+    loginUI();
+    //updatePasswordUI();
+    //OTP_UI()
+  }
+
+
+  function checkPassword(value){
+    const specailHelper = containsSpecialCharsHelper(value);
+    const isUpperCase = isUpperCaseHelper(value);
+    const isLowerCase = isLowerCaseHelper(value);
+    const isNumber = isNumberContainsHelper(value);
+    const len = value.length>=8;
+
+    return specailHelper && isUpperCase && isLowerCase && isNumber && len;
+
+  }
+
+  init();
+
+  function updatePasswordUI() {
+    formErrorAction.removeClass();
+    let html = ` <form class="row g-3 needs-validation" novalidate> <div class="form-floating position-relative py-0"> <input required type="password" class="form-control shadow-none h-50p passwordvalidui" id="updatepassword" placeholder="Enter Your Password" autocomplete="off"> <span class="position-absolute eyePassword" style=" top: 50%; right: 3%; transform: translateY(-50%);"> <i class="text-dark fa fa-eye-slash"></i> </span> <label for="updatepassword">Password </label> <div class="invalid-feedback"> Please enter password. </div> <div class="pswd_info" style="display: none;z-index: 1;"> <p>Password must contain:</p> <ul> <li id="chck_capital" class="invalid">At least <strong>one capital letter</strong> </li> <li id="chck_small" class="invalid">At least <strong>one lowercase letter</strong> </li> <li id="chck_special" class="invalid">At least <strong>one special letter</strong> </li> <li id="chck_number" class="invalid">At least <strong>one number</strong> </li> <li id="chck_length" class="invalid">At least <strong>8 characters</strong> </li> </ul> </div> </div> <div class="form-floating position-relative py-0"> <input required type="password" class="form-control shadow-none h-50p passwordvalidui" id="updateconfirmpassword" placeholder="Enter Your Password" autocomplete="off"> <span class="position-absolute eyePassword" style=" top: 50%; right: 3%; transform: translateY(-50%);"> <i class="text-dark fa fa-eye-slash"></i> </span> <label for="updateconfirmpassword">Password </label> <div class="invalid-feedback"> Please enter password. </div> <div class="pswd_info" style="display: none;z-index: 1;"> <p>Password must contain:</p> <ul> <li id="chck_capital" class="invalid">At least <strong>one capital letter</strong> </li> <li id="chck_small" class="invalid">At least <strong>one lowercase letter</strong> </li> <li id="chck_special" class="invalid">At least <strong>one special letter</strong> </li> <li id="chck_number" class="invalid">At least <strong>one number</strong> </li> <li id="chck_length" class="invalid">At least <strong>8 characters</strong> </li> </ul> </div> </div> <div class="col-12 pt-3 mt-0 px-0"> <button class="btn bg-gradient-anwi text-white w-100 cursor-pointer h-50p btnupdatepassword" type="submit"> <div class="spinner-border authloginLoadingBtn d-none" role="status"> <span class="visually-hidden">Loading...</span> </div> <span class="authloginLoading">Update Password</span> </button> </div> </form>`;
+
+    $('.authContainerUI').html(html);
+    updatepasswordEvents();
+  }
+
+  function updatepasswordEvents() {
+
+    $('.needs-validation').off('submit');
+    loadPasswordListener();
+    $('.needs-validation').on('submit', async (event) => {
+      event.preventDefault();
+      let ele = document.querySelector('.needs-validation')
+      if (!ele.checkValidity()) {
+        ele.classList.add('was-validated')
+        return;
+      }
+
+
+      let newPassword = $('#updatepassword').val();
+      let passwordConfirm = $('#updateconfirmpassword').val();
+      
+
+      if (newPassword != passwordConfirm) {
+        formErrorAction.addError("Password doesn't match");
+        return;
+      }
+
+      if(!checkPassword(newPassword)){
+        formErrorAction.addError("Password doesn't match");
+        return;
+      }
+
+      const forgotpassPayload = {
+        username: userDetails.unibaseid,
+        password: passwordConfirm,
+      };
+
+      const res = await postAPIService(AUTH_LOGIN_APIS_URL.updatePassword(), forgotpassPayload);
+
+      console.log(res);
+
+      if (res.data.message == 'Password Updated Successfully') {
+        loginUI();
+        toasterHelper("success", "Password updated successfull");
+      }
+    });
+    
+
+  }
+
+  function loadPasswordListener(){
+    
+    $('.passwordvalidui').off().on('keyup',function (e){
+
+      $(this).parent().find('.pswd_info').css('display','block');
+      let value = $(this).val();
+
+      const specailHelper = containsSpecialCharsHelper(value);
+      const isUpperCase = isUpperCaseHelper(value);
+      const isLowerCase = isLowerCaseHelper(value);
+      const isNumber = isNumberContainsHelper(value);
+
+
+      if(isLowerCase){
+         $(this).parent().find('#chck_small').addClass('text-decoration-line-through');
+      }else{
+         $(this).parent().find('#chck_small').removeClass('text-decoration-line-through');
+      }
+
+      if(specailHelper){
+         $(this).parent().find('#chck_special').addClass('text-decoration-line-through');
+      }else{
+         $(this).parent().find('#chck_special').removeClass('text-decoration-line-through');
+      }
+
+      if(isUpperCase){
+         $(this).parent().find('#chck_capital').addClass('text-decoration-line-through');
+      }else{
+         $(this).parent().find('#chck_capital').removeClass('text-decoration-line-through');
+      }
+
+      if(value.length>=8){
+         $(this).parent().find('#chck_length').addClass('text-decoration-line-through');
+      }else{
+         $(this).parent().find('#chck_length').removeClass('text-decoration-line-through');
+      }
+
+      if(isNumber){
+         $(this).parent().find('#chck_number').addClass('text-decoration-line-through');
+      }else{
+         $(this).parent().find('#chck_number').removeClass('text-decoration-line-through');
+      }
+
+
+    }).blur(function (e){
+      $(this).parent().find('.pswd_info').css('display','none');
+    })
+
+    $('.eyePassword').off();
+    $('.eyePassword').click(function (e){
+      e.stopPropagation();
+     let eyeOpen = '<i class="text-dark fa fa-eye"></i>';
+     let eyeClose = '<i class="text-dark fa fa-eye-slash"></i>';
+      console.log(this);
+      let isClose = $(this).find(`.fa-eye-slash`).length;
+      
+      if(isClose){
+        $(this).html(eyeOpen);
+        $(this).parent().find('.passwordvalidui').attr('type','text');
+      }else{
+        $(this).html(eyeClose);
+        $(this).parent().find('.passwordvalidui').attr('type','password');
+      }
+    });
+  }
+
+  async function resendOTP() {
+    otpLoadingAction.addLoadingOTP();
+    let payload = {
+      "FirstName": "",
+      "LastName": "",
+      "ContactNumber": "",
+      "Email": "",
+      "TenantName": "",
+      "ContactOrEmail": userDetails.email,
+      "IsSignup": false,
+      "IsRegisterUser": true,
+      "IsForgotPswd": false,
+      "UnibaseId": userDetails.unibaseid,
+      "OtpId": parseInt(userDetails.otpid),
+      "UserOtp": ""
+    }
+    let res = await postAPIService(AUTH_LOGIN_APIS_URL.resendOTP(), payload);
+    res = res.data;
+    if (res.code != '0' || res.message != 'OTP resent successfully') {
+      return;
+    }
+    userDetails = { ...userDetails, otpid: res.result };
+    otpLoadingAction.removeLoadingOTP();
+  }
+
+  function loadForpasswordsEvents() {
+    $('.needs-validation').off('submit');
+    $('.needs-validation').on('submit', async (event) => {
+      event.preventDefault()
+      let ele = document.querySelector('.needs-validation')
+      if (!ele.checkValidity()) {
+        ele.classList.add('was-validated')
+        return;
+      }
+      debugger;
+
+      const email = $('#forgotpassword').val();
+
+      await sendOTPService(email,1,backOptions.forgotPassword);
+
+      authloginLoadingBtnAction.removeLoading();
+
+
+
+
+    });
+
+    $('.btnForgotback').click(function (e) {
+      loginUI();
+    })
+  }
+
+  function forgotPasswordUIEmail() {
+    formErrorAction.removeClass();
+    let html = `<div> <div class="d-flex justify-content-between border-bottom pb-1"><span>Forgot Password?</span><span class="btnForgotback cursor-pointer"><i class="fa-solid fa-arrow-left"></i></span></div> <div class="py-3">Enter the email associated with your account and we'll send an email with instructions to reset your password.</div> <div> <form class="row g-3 needs-validation" novalidate> <div class="pb-3 form-floating py-0"> <input required type="email" class="form-control shadow-none h-50p" id="forgotpassword" placeholder="Enter Your Email" autocomplete="off"> <label for="forgotpassword">Email address</label> <div class="invalid-feedback"> Please enter email. </div> </div>  <div class="col-12 mt-0 px-0"> <button class="btn h-50p forgotpasswordbtn bg-gradient-anwi text-white w-100 cursor-pointer" type="submit"> <div class="spinner-border authloginLoadingBtn d-none" role="status"> <span class="visually-hidden">Loading...</span> </div> <span class="authloginLoading ">Password Reset</span> </button> </div> </form> </div></div>`;
+    $('.authContainerUI').html(html);
+    loadForpasswordsEvents();
+  }
+
+
+
+  function loginEvents() {
+
+
+    // submit event
+    $('.needs-validation').off('submit');
+    $('.needs-validation').on('submit', async (event) => {
+      event.preventDefault();
+      let ele = document.querySelector('.needs-validation')
+      if (!ele.checkValidity()) {
+        ele.classList.add('was-validated')
+        return;
+      }
+
+      debugger;
+      const email = $('#User_Email').val();
+
+      const isUserURL = AUTH_LOGIN_APIS_URL.isUser(email);
+      authloginLoadingBtnAction.addLoading();
+      const user = await getAPIService(isUserURL);
+      const isUser = user.data.result === null && user.data.message === `Email/Phonenumber doesn't exist`;
+
+      if (!isUser) {
+        loginUser();
+      } else {
+        debugger;
+        signUpUser();
+      }
+    });
+
+    // forgot password
+    $('.forgotpasswordBtn').click(function (e) {
+      forgotPasswordUIEmail();
+    });
+
+  
+
+    loadPasswordListener();
+
+    
+    
+
+  }
+
+
+
+  async function loginUserService(email, passord) {
+    const loginPayload = {
+      username: email,
+      Password: passord,
+      UnibaseId: "",
+      RememberMe: false,
+    };
+
+    let res = await postAPIService(AUTH_LOGIN_APIS_URL.login(),
+      loginPayload
+    );
+
+    return res;
+  }
+
+  async function loginUser() {
+    formErrorAction.removeClass();
+    let userEmail = $("#User_Email").val();
+    let userPassword = $("#User_password").val();
+
+
+    let res = await loginUserService(userEmail, userPassword);
+    res = res.data;
+
+    let isError = res.code != '0';
+
+
+    userDetails['email'] = userEmail;
+    userDetails['password'] = userPassword;
+    debugger;
+    if (isError) {
+      if (res.message === 'Email is not verified') {
+        formErrorAction.addError(`<span><span>${res.message}</span> <span class="validemail cursor-pointer"><u>Valid here</u></span></span>`);
+
+        $('.validemail').off('click')
+        $('.validemail').click(async function (e) {
+          await sendOTPService(userEmail,2,backOptions.EmailnotV);
+          formErrorAction.removeClass();
+          authloginLoadingBtnAction.removeLoading();
+
+        });
+        authloginLoadingBtnAction.removeLoading();
+        return;
+      }
+
+      formErrorAction.addError(`${res.message}`);
+      authloginLoadingBtnAction.removeLoading();
+      return;
+    }
+    let authObj = {
+      token: res.result.sessionId,
+      userId: res.result.userId,
+      unibaseId:res.result.unibaseId,
+      sessionId:res.result.sessionId,
+      tenantId:res.result.tenantId,
+      name:res.result.name,
+      assetUrl:res.result.assetUrl
+    };
+ 
+    COOKIE_HELPER_ACTIONS.setCookie(authObj);
+
+   
+    localStorage.setItem("userdata",JSON.stringify(res.result));
+  
+
+    const isCartAdded = localStorage.getItem(CART_ADD);
+          if(isCartAdded){
+            localStorage.removeItem(CART_ADD);
+            window.location.href = `/selectdelivery.html`;
+            return;
+          }
+    localStorage.setItem(USER_AUTH_OKAY,2);
+    window.location.href = '/';
+    //authloginLoadingBtnAction.removeLoading();
+    console.log(res);
+  }
+
+  async function sendOTPService(userEmail,num=0,option) {
+    const isUserURL = AUTH_LOGIN_APIS_URL.isUser(userEmail);
+    authloginLoadingBtnAction.addLoading();
+    const user = await getAPIService(isUserURL);
+    const isUser = user.data.result === null || user.data.message === `Email/Phonenumber doesn't exist`;
+    if (isUser) {
+      formErrorAction.addError(user.data.message);
+      authloginLoadingBtnAction.removeLoading();
+      return;
+    }
+
+    const forgotpassPayload = {
+      firstname: "",
+      lastname: "",
+      contactnumber: "",
+      email: "",
+      tenantname: "",
+      contactoremail: user.data.result.email,
+      IsSignup: false,
+      IsRegisterUser: false,
+      IsForgotPswd: true,
+      UnibaseId: user.data.result.userName,
+      OtpId: 0,
+      UserOtp: "",
+    };
+
+    const forgetpassRes = await postAPIService(
+      AUTH_LOGIN_APIS_URL.sendOTP(),
+      forgotpassPayload
+    );
+
+    userDetails.email = userEmail;
+    userDetails.otpid = forgetpassRes.data;
+    userDetails.unibaseid = user.data.result.userName;
+
+    console.log(forgetpassRes, userDetails);
+    backotp = option
+    OTP_UI(num);
+ 
+  }
+
+  async function signUpUser() {
+    formErrorAction.removeClass();
+    let userEmail = $("#User_Email").val();
+    let userPassword = $("#User_password").val();
+    let checkPasswordValue = checkPassword(userPassword);
+    if(!checkPasswordValue){
+      authloginLoadingBtnAction.removeLoading();
+      formErrorAction.addError('Password must contain one specail letter ,number,small letter, uppercase letter and 8 letters');
+      return;
+    }
+
+  
+    const userRegistratioNPayload = {
+      organizationtypeid: "2",
+      organizationid: "0",
+      contactid: "0",
+      userid: "0",
+      username: "0",
+      users_phonenumber: "0",
+      password: userPassword,
+      users_emailaddress: "0",
+      emailaddress: userEmail,
+      contactname: userEmail.split('@')[0],
+      phonenumber: "0",
+      branchid: "0",
+      tenantname: "Anwi Systems",
+      rolename: "Customer Admin",
+      currencyid: "0",
+      customerformuniqueid: "Bizgaze_Platform_Crm_RegisterCRMUser",
+    };
+
+    let res = await postAPIService(
+      AUTH_LOGIN_APIS_URL.signUp(),
+      userRegistratioNPayload
+    );
+
+    console.log(res);
+
+    res = res.data;
+    if (res.code != '0') {
+      formErrorAction.addError(res.message);
+      authloginLoadingBtnAction.removeLoading();
+      return;
+    }
+
+    res = res.result;
+
+    userDetails['otpid'] = res.OtpId;
+    userDetails['email'] = userEmail;
+    userDetails['password'] = userPassword;
+    userDetails['unibaseid'] = res.UnibaseId;
+    backotp = backOptions.signUp
+    OTP_UI();
+  
+
+  }
+
+
+  function loginUI() {
+    formErrorAction.removeClass();
+    let html = `  <div class="text-center pb-4">
+    <span class="font-weight-600">Login</span> / <span class="font-weight-600">Signup</span>
+  </div>
+  <form class="row g-3 needs-validation" novalidate>
+    <div class="form-floating py-0">
+      <input required type="email" class="form-control shadow-none h-50p" id="User_Email" placeholder="Enter Your Email" autocomplete="off">
+      <label for="User_Email">Email address</label>
+      <div class="invalid-feedback"> Please enter email. </div>
+    </div>
+    <div class="form-floating position-relative py-0">
+      <input required type="password" class="form-control shadow-none h-50p passwordvalidui" id="User_password" placeholder="Enter Your Password" autocomplete="off">
+      <span class="position-absolute eyePassword" style=" top: 50%; right: 3%; transform: translateY(-50%);">
+        <i class="text-dark fa fa-eye-slash"></i>
+      </span>
+      <label for="User_password">Password </label>
+      <div class="invalid-feedback"> Please enter password. </div>
+      <div class="pswd_info" style="display: none;z-index: 1;">
+        <p>Password must contain:</p>
+        <ul>
+        <li id="chck_capital" class="invalid">At least <strong>one capital letter</strong>
+        </li>
+         <li id="chck_small" class="invalid">At least <strong>one lowercase letter</strong>
+        </li>
+        <li id="chck_special" class="invalid">At least <strong>one special letter</strong>
+        </li>
+        <li id="chck_number" class="invalid">At least <strong>one number</strong>
+        </li>
+        <li id="chck_length" class="invalid">At least <strong>8 characters</strong>
+        </li>
+        </ul>
+      </div>
+    </div>
+    <div class="fs-7 my-2 satoshi_font text-center"> By continuing, I agree to the Terms of Use & Privacy Policy </div>
+    <div class="col-12 mt-0 px-0">
+      <button class="btn bg-gradient-anwi text-white w-100 cursor-pointer h-50p" type="submit">
+        <div class="spinner-border authloginLoadingBtn d-none" role="status">
+          <span class="visually-hidden">Loading...</span>
+        </div>
+        <span class="authloginLoading h-50p">Continue</span>
+      </button>
+    </div>
+  </form>
+  <div class="pt-3 text-center">
+    <span class="forgotpasswordBtn cursor-pointer">Forgot password?</span>
+  </div>
+ `;
+    $('.authContainerUI').html(html);
+    
+    loginEvents();
+  }
+
+  function OTP_UI(forgot = 0) {
+    formErrorAction.removeClass();
+    let html = `<div class="d-flex justify-content-between border-bottom pb-1">
+    <span></span>
+    <span class="btnForgotback">
+      <i class="fa-solid fa-arrow-left"></i>
+    </span>
+  </div> <div class="otp-validation"> <div class="otp-input-group mt-3"> <div> <h4 class="text-center">Enter OTP</h4> <div class="text-center">We have send OTP to your email </div> <p class="user_email text-center"></p> <div class="otp-sent-email fw-600 text-center"></div> </div> <div class="d-flex my-4"> <div class="col"> <div class="form-group"> <input type="text" class="press form-control" name="code" maxlength="1" tabindex="1" autocomplete="off"> </div> </div> <div class="col"> <div class="form-group"> <input type="text" class="press form-control" name="code" maxlength="1" tabindex="2" autocomplete="off"> </div> </div> <div class="col"> <div class="form-group"> <input type="text" class="press form-control" name="code" maxlength="1" tabindex="3" autocomplete="off"> </div> </div> <div class="col"> <div class="form-group"> <input type="text" class="press form-control" name="code" maxlength="1" tabindex="4" autocomplete="off"> </div> </div> <div class="col"> <div class="form-group"> <input type="text" class="press form-control" name="code" maxlength="1" tabindex="5" autocomplete="off"> </div> </div> <div class="col"> <div class="form-group"> <input type="text" class="press form-control" name="code" maxlength="1" tabindex="6" autocomplete="off"> </div> </div> </div> <div> <a href="#" class=" h-50p d-flex align-items-center justify-content-center bg-gradient-anwi btn fw-500 text-white w-100" id="email_validate_proceed" type="submit"><div class="spinner-border otploading d-none" role="status">
+  </div><span class="otploadingtext">Verfiy OTP</span></a> </div> <div class="resendOTP cursor-pointer text-center pt-4 ">Resend OTP</div> </div></div>`;
+    $('.authContainerUI').html(html);
+    loadOTPEvents(forgot);
+  }
+
+  async function validOTP(email, id, otp) {
+    const validateForgotpass = {
+      email: email,
+      otpid: id,
+      userotp: otp,
+    };
+
+    const res = await postAPIService(
+      `hyperfusion/validateotp`,
+      validateForgotpass
+    );
+
+    return res;
+  }
+
+  function loadOTPEvents(forgot) {
+
+
+    $('.resendOTP').click(function (e) {
+      resendOTP();
+    })
+
+
+    $('.btnForgotback').off().click(function(e){
+      debugger;
+      if(backotp === backOptions.forgotPassword){
+        forgotPasswordUIEmail();
+      }else if(backotp === backOptions.EmailnotV){
+        loginUI();
+      }else if(backotp === backOptions.signUp){
+        loginUI();
+      }
+    });
+
+    $("#email_validate_proceed").click(async function () {
+      debugger;
+      otpLoadingAction.addLoadingOTP();
+      let userotp = '';
+      $(".otp-validation .otp-input-group input").each(function () {
+        let presVal = $(this).val();
+        userotp += presVal;
+      });
+debugger;
+      if (userotp.length == 6) {
+        // const validateForgotpass = {
+        //   email: userDetails.email,
+        //   otpid: userDetails.otpid,
+        //   userotp: userotp,
+        // };
+        $('#email_validate_proceed').hide()
+        $(".loader-btn").show();
+        const validate_email_resopt = await validOTP(userDetails.email, userDetails.otpid, userotp);
+
+        $(".loader-btn").hide();
+        $('#email_validate_proceed').show()
+        const Resotp = validate_email_resopt.data.result;
+        if (Resotp == "Otp verified successfully") {
+          if (forgot == 1) {
+            updatePasswordUI();
+            return;
+          } else if (forgot == 2) {
+            loginUI();
+            toasterHelper("success", "Email has been verified");
+            return;
+          }
+          let res = await loginUserService(userDetails.email, userDetails.password);
+          res = res.data;
+
+          let authObj = {
+            token: res.result.sessionId,
+            userId: res.result.userId,
+            unibaseId:res.result.unibaseId,
+            sessionId:res.result.sessionId,
+            tenantId:res.result.tenantId,
+            name:res.result.name,
+            assetUrl:res.result.assetUrl
+          };
+       
+          COOKIE_HELPER_ACTIONS.setCookie(authObj);
+          localStorage.setItem("userdata",JSON.stringify(res.result));
+          const isCartAdded = localStorage.getItem(CART_ADD);
+          if(isCartAdded){
+            localStorage.removeItem(CART_ADD);
+            window.location.href = `/selectdelivery.html`;
+            return;
+          }
+          localStorage.setItem(USER_AUTH_OKAY,1);
+          window.location.href = '/';
+          otpLoadingAction.removeLoadingOTP();
+        } else {
+          // toasterOpts()
+          // Command: toastr["error"]("Please enter Valid OTP");
+          otpLoadingAction.removeLoadingOTP();
+          formErrorAction.addError("Please enter Valid OTP")
+  
+        }
+      }
+      else {
+        otpLoadingAction.removeLoadingOTP();
+        formErrorAction.addError("Please enter Valid OTP")
+      }
+    });
+
+    $(".otp-validation .otp-input-group").on("paste", function (p) {
+      let data = p.originalEvent.clipboardData.getData("text");
+      let dataLength = data.length;
+      for (let i = 0; i < dataLength; i++) {
+        let input = $(
+          '.otp-validation .otp-input-group input[tabindex="' + (i + 1) + '"]'
+        );
+        input.val(data.charAt(i));
+        if (input.val().length >= input.attr("maxlength")) {
+          let nextInput = $(
+            '.otp-validation .otp-input-group input[tabindex="' +
+            (i + 2) +
+            '"]'
+          );
+          if (nextInput) {
+            nextInput.focus();
+          }
+        }
+      }
+      p.preventDefault();
+    });
+
+    $('.otp-validation .otp-input-group input[type="text"]').on(
+      "keyup",
+      function (e) {
+        if ($(this).val().length >= $(this).attr("maxlength")) {
+          if (e.keyCode !== 9 && e.keyCode !== 16) {
+            let tabIndex = parseInt($(this).attr("tabindex")) + 1;
+            $(
+              '.otp-validation .otp-input-group input[tabindex="' +
+              $(this).attr("tabindex") +
+              '"]'
+            ).val($(this).val());
+            $(
+              '.otp-validation .otp-input-group input[tabindex="' +
+              tabIndex +
+              '"]'
+            ).focus();
+          }
+        } else {
+          if (e.keyCode === 8) {
+            let tabIndex = parseInt($(this).attr("tabindex")) - 1;
+            $(
+              '.otp-validation .otp-input-group input[tabindex="' +
+              tabIndex +
+              '"]'
+            ).focus();
+          }
+        }
+      }
+    );
+  }
+}

dist/js/auth/login_11.js

@@ -0,0 +1,383 @@
+function initLogin() {
+  let reg_name, reg_email, reg_number, reg_pwd, reg_otp_email;
+  let loginForm = $("#login_form");
+  let registerForm = $("#register_form");
+
+  // document.querySelector('#register_form .otp-input-group input.press').addEventListener("paste", function (p) {
+  //   var data = p.clipboardData.getData('text');
+  //   var dataLength = data.length;
+
+  //   for (var i = 0; i < dataLength; i++) {
+  //     var input = document.querySelector("#register_form .otp-input-group input[tabindex='" + (i + 1) + "']");
+  //     input.value = data.charAt(i);
+  //     if (input.value.length >= input.maxLength) {
+  //       var nextInput = document.querySelector("#register_form .otp-input-group input[tabindex='" + (i + 2) + "']");
+  //       if (nextInput) {
+  //         nextInput.focus();
+  //       }
+  //     }
+  //   }
+  //   p.preventDefault();
+  // });
+  // document.querySelectorAll('#register_form .otp-input-group input[type="text"]').forEach(function (input) {
+  //   input.addEventListener('keyup', function (e) {
+  //     if (this.value.length >= this.maxLength) {
+  //       if (e.keyCode !== 9 && e.keyCode !== 16) {
+  //         var tabIndex = this.tabIndex + 1;
+  //         document.querySelector("#register_form .otp-input-group input[tabindex='" + this.tabIndex + "']").value = this.value;
+  //         document.querySelector("#register_form .otp-input-group input[tabindex='" + tabIndex + "']").focus();
+  //       }
+  //     } else {
+  //       if (e.keyCode === 8) {
+  //         var tabIndex = this.tabIndex - 1;
+  //         document.querySelector("#register_form .otp-input-group input[tabindex='" + tabIndex + "']").focus();
+  //       }
+  //     }
+  //   });
+  // });
+
+  $('#register_form .otp-input-group input.press').on('paste', function (p) {
+    var data = p.originalEvent.clipboardData.getData('text');
+    var dataLength = data.length;
+
+    for (var i = 0; i < dataLength; i++) {
+      var input = $('#register_form .otp-input-group input[tabindex="' + (i + 1) + '"]');
+      input.val(data.charAt(i));
+      if (input.val().length >= input.attr('maxlength')) {
+        var nextInput = $('#register_form .otp-input-group input[tabindex="' + (i + 2) + '"]');
+        if (nextInput) {
+          nextInput.focus();
+        }
+      }
+    }
+    p.preventDefault();
+  });
+
+  $('#register_form .otp-input-group input[type="text"]').on('keyup', function (e) {
+    if ($(this).val().length >= $(this).attr('maxlength')) {
+      if (e.keyCode !== 9 && e.keyCode !== 16) {
+        var tabIndex = parseInt($(this).attr('tabindex')) + 1;
+        $('#register_form .otp-input-group input[tabindex="' + $(this).attr('tabindex') + '"]').val($(this).val());
+        $('#register_form .otp-input-group input[tabindex="' + tabIndex + '"]').focus();
+      }
+    } else {
+      if (e.keyCode === 8) {
+        var tabIndex = parseInt($(this).attr('tabindex')) - 1;
+        $('#register_form .otp-input-group input[tabindex="' + tabIndex + '"]').focus();
+      }
+    }
+  });
+
+
+  loginForm.find("#User_Email,#User_password").keypress(function (e) {
+    if (e.which == 13)
+      document.getElementById("Login_btn").click();
+
+  });
+
+  $("#Login_btn").click(function () {
+    loginForm.find(".loader-btn").show();
+    $(this).hide();
+    let userEmail = loginForm.find("#User_Email").val();
+    let userPassword = loginForm.find("#User_password").val();
+    let emailInput = loginForm.find(".email-login-inputgroup");
+    let passwordInput = loginForm.find(".password-login-inputgroup");
+    if (userEmail == "") {
+      emailInput.find('#User_Email').addClass('is-invalid');
+      emailInput.find('.form-floating').addClass('is-invalid');
+      emailInput.find('.invalid-feedback').text('Please enter your email');
+      loginForm.find(".loader-btn").hide();
+      $(this).show();
+
+    }
+    if (userPassword == "") {
+      passwordInput.find('#User_password').addClass('is-invalid');
+      passwordInput.find('.form-floating').addClass('is-invalid');
+      loginForm.find(".loader-btn").hide();
+      $(this).show();
+    }
+    else {
+      emailInput.find('#User_Email').removeClass('is-invalid');
+      emailInput.find('.form-floating').removeClass('is-invalid');
+      passwordInput.find('#User_password').removeClass('is-invalid');
+      passwordInput.find('.form-floating').removeClass('is-invalid');
+      if (validateEmail(userEmail)) {
+        let port = SERVERNAME
+        // let port = "http://localhost:3088";
+        let url = `${port}/account/getuserbyphoneormail/${userEmail}/${userEmail}`;
+        getDataStatAxios(url, userEmail);
+      } else {
+        loginForm.find(".loader-btn").hide();
+        $(this).show();
+        emailInput.find('#User_Email').addClass('is-invalid');
+        emailInput.find('.form-floating').addClass('is-invalid');
+        emailInput.find('.invalid-feedback').text('Please enter a valid email');
+      }
+    }
+  });
+
+  async function getDataStatAxios(url, userEmail) {
+    const config = {
+      url,
+      method: "get",
+    };
+    let response = await axios(config);
+    if (response.data.result == null) {
+      $('.error-div').text(response.data.message);
+    }
+    else {
+      let userEmail = $("#User_Email").val();
+      let userPassword = $("#User_password").val();
+      const loginPayload = {
+        username: userEmail,
+        Password: userPassword,
+        UnibaseId: "",
+        RememberMe: false,
+      };
+      const res = await postAPIService(
+        `bizgaze/crm/webapi/crmuserlogin`,
+        loginPayload
+      );
+      debugger;
+      console.log(res);
+      if (res.data.message == "200") {
+        // Command: toastr["success"]("Logged in successfully")
+        // toasterOpts();
+        debugger;
+        COOKIE_HELPER_ACTIONS.setCookie({
+          token: res.data.result.sessionId,
+          userid: res.data.result.userId,
+          ...res.data.result
+        })
+        // setInitLoginLocal();
+        // window.localStorage.setItem("Useremail", userEmail);
+        //window.localStorage.setItem("Userpassword", userPassword);
+        //window.localStorage.setItem("Isloggedin", true);
+        const isCartAdded = localStorage.getItem(CART_ADD);
+        if(isCartAdded){
+          localStorage.removeItem(CART_ADD);
+          window.location.href = `/selectdelivery.html`;
+          return;
+        }
+        window.location.href = `/index.html`;
+      } else {
+        $("#empt_num").removeClass("d-none text-success").text(res.data.message).addClass('text-danger');
+        $(".my_avatar").attr("href", "./login.html");
+      }
+    }
+  }
+
+  // this function will be triggered on new user registration 
+  async function userRegistration() {
+    reg_form = $('#register_form');
+    // reg_name = $("#User_Name").val();
+    reg_email = reg_form.find("#User_Email").val();
+    // reg_otp_email = $("#User_otp_Email").val();
+    // reg_number = $("#user_number").val();
+    reg_pwd = reg_form.find("#User_password").val();
+    let userName = reg_email.split("@");
+    let otpRes = null;
+    const userRegistratioNPayload = {
+      organizationtypeid: "2",
+      organizationid: "0",
+      contactid: "0",
+      userid: "0",
+      username: "0",
+      users_phonenumber: "0",
+      password: reg_pwd,
+      users_emailaddress: "0",
+      emailaddress: reg_email,
+      contactname: userName[0],
+      phonenumber: "0",
+      branchid: "0",
+      tenantname: "Anwi Systems",
+      rolename: "Customer Admin",
+      currencyid: "0",
+      customerformuniqueid: "Bizgaze_Platform_Crm_RegisterCRMUser",
+    };
+    $('.spinner-border').removeClass('d-none');
+    const res = await postAPIService(
+      `bizgaze/crm/webapi/registercrmuser`,
+      userRegistratioNPayload
+    );
+    console.log(res, "register");
+    $('.spinner-border').addClass('d-none');
+    if (res.data.message == "User Already Exists!") {
+      $('.error-div').text('User Already Exists!');
+      // $(".useralready_exist").removeClass("d-none");
+    } else {
+    }
+
+    $("#proceed").click(async function () {
+      let userEnterOtp = "";
+      let userEmail = registerForm.find("#User_Email").val();
+      $('.otp-input-group input').each(function () {
+        let presVal = $(this).val();
+        userEnterOtp += presVal;
+      })
+      console.log(userEnterOtp);
+      debugger;
+      const userotppayload = {
+        email: userEmail,
+        otpid: res.data.result.OtpId,
+        userotp: userEnterOtp,
+      };
+      $('.spinner-border').removeClass('d-none');
+      otpRes = await postAPIService(
+        `bizgaze/crm/webapi/ValidateOtp`,
+        userotppayload
+      );
+      $('.spinner-border').addClass('d-none');
+      debugger;
+      console.log(otpRes, "otp");
+      const verifyotpStatus = otpRes.data.result;
+      debugger;
+      if (verifyotpStatus == "Otp verified successfully") {
+        alert("Account created successfully");
+        window.location.href = `/myaccount.html`;
+      } else {
+        alert("please enter valid otp");
+      }
+    });
+  }
+
+  // to validate password on keyup in password input field 
+  function passwordValidate(pswd) {
+    if (pswd.length < 11) {
+      $('#chck_length').removeClass('pswd_valid').addClass('pswd_invalid');
+    } else {
+      $('#chck_length').removeClass('pswd_invalid').addClass('pswd_valid');
+    }
+    // validate uppercase letter
+    if (pswd.match(/[A-Z]/)) {
+      $('#chck_capital').removeClass('pswd_invalid').addClass('pswd_valid');
+    } else {
+      $('#chck_capital').removeClass('pswd_valid').addClass('pswd_invalid');
+    }
+    //validate special letter
+    if (pswd.match(/[!@#$%^&*]/)) {
+      $('#chck_special').removeClass('pswd_invalid').addClass('pswd_valid');
+    } else {
+      $('#chck_special').removeClass('pswd_valid').addClass('pswd_invalid');
+    }
+    let pswdVal = $('#register_form #User_password').val();
+    let pattern = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[^a-zA-Z0-9]).{11,}$/;
+    if (pswdVal.match(pattern)) {
+      $('#pswd_info').hide()
+    }
+    else {
+      $('#pswd_info').show()
+    }
+    //validate number
+    if (pswd.match(/\d/)) {
+      $('#chck_number').removeClass('pswd_invalid').addClass('pswd_valid');
+    } else {
+      $('#chck_number').removeClass('pswd_valid').addClass('pswd_invalid');
+    }
+
+  };
+
+  //you have to use keyup, because keydown will not catch the currently entered value
+  $('#register_form #User_password').keyup(function () {
+    // set password variable
+    var pswd = $(this).val();
+    passwordValidate(pswd);
+  }).focus(function () {
+    let pswdVal = $('#register_form #User_password').val();
+    let pattern = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[^a-zA-Z0-9]).{11,}$/;
+    if (pswdVal.match(pattern)) {
+      $('#pswd_info').hide()
+    }
+    else {
+      $('#pswd_info').show()
+    }
+  }).blur(function () {
+    $('#pswd_info').hide();
+  });
+
+  // function to validate user entered email 
+  function validateEmail(userEmail) {
+    var pattern =
+      /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
+    return $.trim(userEmail).match(pattern) ? true : false;
+  }
+
+  // function to validate user entered password
+  function validatepassword(userPassword) {
+    var pattern = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[^a-zA-Z0-9]).{11,}$/;
+    return $.trim(userPassword).match(pattern) ? true : false;
+  }
+
+  registerForm.find("#User_Email,#User_password").keypress(function (e) {
+    if (e.which == 13)
+      document.getElementById("register_btn").click();
+
+  });
+
+  // this will be triggered on clicking continue in signup form 
+  $("#register_btn").click(function () {
+    registerForm.find(".loader-btn").show();
+    $(this).hide();
+    let userEmail = registerForm.find("#User_Email").val();
+    let userPassword = registerForm.find("#User_password").val();
+    let emailInput = registerForm.find(".email-login-inputgroup");
+    let passwordInput = registerForm.find(".password-login-inputgroup");
+    if (userEmail == "") {
+      emailInput.find('#User_Email').addClass('is-invalid');
+      emailInput.find('.form-floating').addClass('is-invalid');
+      emailInput.find('.invalid-feedback').text('Please enter your email');
+      registerForm.find(".loader-btn").hide();
+      $(this).show();
+    }
+    if (userPassword == "") {
+      passwordInput.find('#User_password').addClass('is-invalid');
+      passwordInput.find('.form-floating').addClass('is-invalid');
+      registerForm.find(".loader-btn").hide();
+      $(this).show();
+    }
+    else {
+      emailInput.find('#User_Email').removeClass('is-invalid');
+      emailInput.find('.form-floating').removeClass('is-invalid');
+      passwordInput.find('#User_password').removeClass('is-invalid');
+      passwordInput.find('.form-floating').removeClass('is-invalid');
+      if (validateEmail(userEmail)) {
+        $('#register_form .email-password-group').hide();
+        $('#register_form .otp-input-group').show();
+        $('#register_form .otp-input-group .otp-sent-email').text(userEmail);
+        userRegistration();
+      } else {
+        emailInput.find('#User_Email').addClass('is-invalid');
+        emailInput.find('.form-floating').addClass('is-invalid');
+        emailInput.find('.invalid-feedback').text('Please enter a valid email');
+        registerForm.find(".loader-btn").hide();
+        $(this).show();
+      }
+    }
+  });
+
+  $('#forgotPassword').click(function () {
+    $('.login-email-password-div').hide();
+    $('.login-forgot-passsword-div').show();
+  })
+
+  function toasterOpts() {
+    toastr.options = {
+      "closeButton": true,
+      "debug": false,
+      "newestOnTop": true,
+      "progressBar": true,
+      "positionClass": "toast-top-center",
+      "preventDuplicates": true,
+      "showDuration": "300",
+      "hideDuration": "1000",
+      "timeOut": "3000",
+      "extendedTimeOut": "1000",
+      "showEasing": "swing",
+      "hideEasing": "linear",
+      "showMethod": "fadeIn",
+      "hideMethod": "fadeOut"
+    }
+  }
+}
+
+initLogin();

dist/js/auth/login_ing.js

@@ -0,0 +1,780 @@
+function initLogin() {
+  // alert('as')
+  // Command: toastr["success"]("Logged in successfully")
+  // Command: toastr["success"]("My name is Inigo Montoya. You killed my father. Prepare to die!")
+
+  // toasterOpts();
+  let reg_name, reg_email, reg_number, reg_pwd, reg_otp_email;
+  let loginForm = $("#login_form");
+  let registerForm = $("#register_form");
+
+  $("#register_form .otp-input-group input.press").on("paste", function (p) {
+    var data = p.originalEvent.clipboardData.getData("text");
+    var dataLength = data.length;
+
+    for (var i = 0; i < dataLength; i++) {
+      var input = $(
+        '#register_form .otp-input-group input[tabindex="' + (i + 1) + '"]'
+      );
+      input.val(data.charAt(i));
+      if (input.val().length >= input.attr("maxlength")) {
+        var nextInput = $(
+          '#register_form .otp-input-group input[tabindex="' + (i + 2) + '"]'
+        );
+        if (nextInput) {
+          nextInput.focus();
+        }
+      }
+    }
+    p.preventDefault();
+  });
+
+  $('#register_form .otp-input-group input[type="text"]').on(
+    "keyup",
+    function (e) {
+      if ($(this).val().length >= $(this).attr("maxlength")) {
+        if (e.keyCode !== 9 && e.keyCode !== 16) {
+          var tabIndex = parseInt($(this).attr("tabindex")) + 1;
+          $(
+            '#register_form .otp-input-group input[tabindex="' +
+              $(this).attr("tabindex") +
+              '"]'
+          ).val($(this).val());
+          $(
+            '#register_form .otp-input-group input[tabindex="' + tabIndex + '"]'
+          ).focus();
+        }
+      } else {
+        if (e.keyCode === 8) {
+          var tabIndex = parseInt($(this).attr("tabindex")) - 1;
+          $(
+            '#register_form .otp-input-group input[tabindex="' + tabIndex + '"]'
+          ).focus();
+        }
+      }
+    }
+  );
+
+  loginForm.find("#User_Email,#User_password").keypress(function (e) {
+    if (e.which == 13) $("#Login_btn").click();
+  });
+
+  $("#Login_btn").click(function () {
+    $('.error_msg').hide();
+    // loginForm.find(".loader-btn").show();
+    let userEmail = loginForm.find("#User_Email").val();
+    let userPassword = loginForm.find("#User_password").val();
+    let emailInput = loginForm.find(".email-login-inputgroup");
+    let passwordInput = loginForm.find(".password-login-inputgroup");
+    if (userEmail == "") {
+      emailInput.find("#User_Email").addClass("is-invalid");
+      emailInput.find(".form-floating").addClass("is-invalid");
+      emailInput.find(".invalid-feedback").text("Please enter your email");
+      loginForm.find(".loader-btn").hide();
+      $(this).show();
+    }
+    if (userPassword == "") {
+      passwordInput.find("#User_password").addClass("is-invalid");
+      passwordInput.find(".form-floating").addClass("is-invalid");
+      loginForm.find(".loader-btn").hide();
+      $(this).show();
+    } else {
+      emailInput.find("#User_Email").removeClass("is-invalid");
+      emailInput.find(".form-floating").removeClass("is-invalid");
+      passwordInput.find("#User_password").removeClass("is-invalid");
+      passwordInput.find(".form-floating").removeClass("is-invalid");
+      if (validateEmail(userEmail)) {
+         let port = SERVERNAME
+      // let port = "http://localhost:3088";
+        let url = `${port}/account/getuserbyphoneormail/${userEmail}/${userEmail}`;
+        getDataStatAxios(url, userEmail);
+      } else {
+        loginForm.find(".loader-btn").hide();
+        $(this).show();
+        emailInput.find("#User_Email").addClass("is-invalid");
+        emailInput.find(".form-floating").addClass("is-invalid");
+        emailInput.find(".invalid-feedback").text("Please enter a valid email");
+      }
+    }
+  });
+  async function getDataStatAxios(url, userEmail) {
+    const config = {
+      url,
+      method: "get",
+    };
+    let response = await axios(config);
+    if (response.data.result == null) {
+      $('.error_msg').show();
+      $('.error_msg .error_msg_res').html(`User doesn't exists with the email,  <a href="#" class="alert-link register_sectionbtn" id="register_sectionbtn">Sign Up </a>`);
+      $(".register_sectionbtn").click(function(){
+   
+      
+        $(".login_section").css("display","none");
+        $(".register_section").css("display","block");
+        $(".login_section").find("#User_Email").removeClass("is-invalid");
+        $(".login_section").find(".form-floating").removeClass("is-invalid");
+        $(".login_section").find("#User_password").removeClass("is-invalid");
+        $(".login_section").find(".form-floating").removeClass("is-invalid");
+        $('.error_msg').hide();
+      });
+      // toasterOpts();
+      
+      // Command: toastr["error"]("Please enter Valid email / password");
+    } else {
+      let userEmail = $("#User_Email").val();
+      let userPassword = $("#User_password").val();
+      const loginPayload = {
+        username: userEmail,
+        Password: userPassword,
+        UnibaseId: "",
+        RememberMe: false,
+      };
+      $("#Login_btn").hide();
+      $(".loader-btn").show();
+      const res = await postAPIService(
+        `bizgaze/crm/webapi/crmuserlogin`,
+        loginPayload
+      );
+      debugger;
+      console.log(res);
+      $(".loader-btn").hide();
+      $("#Login_btn").show();
+      if (res.data.message == "200") {
+        debugger;
+        // Command: toastr["success"]("Logged in successfully")
+        // toasterOpts();
+        COOKIE_HELPER_ACTIONS.setCookie({
+          token: res.data.result.sessionId,
+          userid: res.data.result.userId,
+          ...res.data.result
+        });
+        // setInitLoginLocal();
+        window.localStorage.setItem("Useremail", userEmail);
+        //window.localStorage.setItem("Userpassword", userPassword);
+        window.localStorage.setItem("Isloggedintoaster", true);
+        window.localStorage.setItem("Isloggedin", true);
+
+        const isCartAdded = localStorage.getItem(CART_ADD);
+        if(isCartAdded){
+          localStorage.removeItem(CART_ADD);
+          window.location.href = `/selectdelivery.html`;
+          return;
+        }
+        
+      window.location.href = `./index.html`;
+      } else {
+        $('.error_msg').show();
+        $('.error_msg .error_msg_res').html(res.data.message + ' <a class="validate_mail text-danger"><b>Validate Email</b></a>');
+      //   toasterOpts();
+      // Command: toastr["error"]()
+        /*Email validation*/
+  $('.validate_mail').click(function(){
+    $(".login_section").hide();
+    $(".email-validate-div").show();
+    $('.error_msg').hide();
+  })
+      }
+    }
+  }
+
+  // this function will be triggered on new user registration
+  async function userRegistration() {
+    reg_form = $("#register_form");
+    // reg_name = $("#User_Name").val();
+    reg_email = reg_form.find("#User_Email").val();
+    // reg_otp_email = $("#User_otp_Email").val();
+    // reg_number = $("#user_number").val();
+    reg_pwd = reg_form.find("#User_password").val();
+    let userName = reg_email.split("@");
+    let otpRes = null;
+    const userRegistratioNPayload = {
+      organizationtypeid: "2",
+      organizationid: "0",
+      contactid: "0",
+      userid: "0",
+      username: "0",
+      users_phonenumber: "0",
+      password: reg_pwd,
+      users_emailaddress: "0",
+      emailaddress: reg_email,
+      contactname: userName[0],
+      phonenumber: "0",
+      branchid: "0",
+      tenantname: "Anwi Systems",
+      rolename: "Customer Admin",
+      currencyid: "0",
+      customerformuniqueid: "Bizgaze_Platform_Crm_RegisterCRMUser",
+    };
+    debugger;
+    $('#register_btn').hide()
+    $(".loader-btn").show();
+    debugger;
+    const res = await postAPIService(
+      `bizgaze/crm/webapi/registercrmuser`,
+      userRegistratioNPayload
+    );
+    console.log(res, "register");
+    $(".loader-btn").hide();
+    $('#register_btn').show()
+    if (res.data.code == "404" ) {
+      // toasterOpts();
+      // Command: toastr["error"](res.data.message)
+      $('.error_msg').show();
+      $('.error_msg .error_msg_res').html(res.data.message);
+      return;
+    }
+     else {
+      $("#register_form .email-password-group").hide();
+      $("#register_form .register_otp.otp-input-group").show();
+    }
+  
+    $("#proceed").click(async function () {
+      let userEnterOtp = "";
+      let userEmail = registerForm.find("#User_Email").val();
+      $(".otp-input-group input").each(function () {
+        let presVal = $(this).val();
+        userEnterOtp += presVal;
+      });
+      console.log(userEnterOtp);
+      debugger;
+      const userotppayload = {
+        email: userEmail,
+        otpid: res.data.result.OtpId,
+        userotp: userEnterOtp,
+      };
+      $(".loader-btn").show();
+      $('#proceed').hide()
+      otpRes = await postAPIService(
+        `bizgaze/crm/webapi/ValidateOtp`,
+        userotppayload
+      );
+      $(".loader-btn").hide();
+      $('#proceed').show()
+      debugger;
+      console.log(otpRes, "otp");
+      const verifyotpStatus = otpRes.data.result;
+      if (verifyotpStatus == "Otp verified successfully") {
+        const loginPayload = {
+          username: reg_email,
+          Password: reg_pwd,
+          UnibaseId: "",
+          RememberMe: false,
+        };
+        const res = await postAPIService(
+          `bizgaze/crm/webapi/crmuserlogin`,
+          loginPayload
+        );
+        if (res.data.message == "200") {
+          debugger;
+          // Command: toastr["success"]("Logged in successfully")
+          // toasterOpts();
+          COOKIE_HELPER_ACTIONS.setCookie({
+            token: res.data.result.sessionId,
+            userid: res.data.result.userId,
+            ...res.data.result
+          });
+          // setInitLoginLocal();
+          window.localStorage.setItem("Useremail", userEmail);
+          //window.localStorage.setItem("Userpassword", userPassword);
+          window.localStorage.setItem("isaccountCreated", true);
+          const isCartAdded = localStorage.getItem(CART_ADD);
+          if(isCartAdded){
+            localStorage.removeItem(CART_ADD);
+            window.location.href = `/selectdelivery.html`;
+            return;
+          }
+          window.location.href = `./index.html`;
+        } else {
+        //   toasterOpts();
+        // Command: toastr["error"](res.data.message)
+        $('.error_msg').show();
+        $('.error_msg .error_msg_res').html(res.data.message);
+        }       
+      } else {
+        // toasterOpts();
+        // Command: toastr["error"]("Please enter Valid OTP");
+        $('.error_msg').show();
+        $('.error_msg .error_msg_res').html("Please enter Valid OTP");
+      }
+    });
+  }
+
+  // to validate password on keyup in password input field
+  function passwordValidate(pswd) {
+    if (pswd.length < 8) {
+      $("#chck_length").removeClass("pswd_valid").addClass("pswd_invalid");
+    } else {
+      $("#chck_length").removeClass("pswd_invalid").addClass("pswd_valid");
+    }
+    // validate uppercase letter
+    if (pswd.match(/[A-Z]/)) {
+      $("#chck_capital").removeClass("pswd_invalid").addClass("pswd_valid");
+    } else {
+      $("#chck_capital").removeClass("pswd_valid").addClass("pswd_invalid");
+    }
+    //validate special letter
+    if (pswd.match(/[!@#$%^&*]/)) {
+      $("#chck_special").removeClass("pswd_invalid").addClass("pswd_valid");
+    } else {
+      $("#chck_special").removeClass("pswd_valid").addClass("pswd_invalid");
+    }
+    let pswdVal = $("#register_form #User_password").val();
+    let pattern = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[^a-zA-Z0-9]).{8,}$/;
+    if (pswdVal.match(pattern)) {
+      $(".pswd_info").hide();
+    } else {
+      $(".pswd_info").show();
+    }
+    //validate number
+    if (pswd.match(/\d/)) {
+      $("#chck_number").removeClass("pswd_invalid").addClass("pswd_valid");
+    } else {
+      $("#chck_number").removeClass("pswd_valid").addClass("pswd_invalid");
+    }
+  }
+
+  //you have to use keyup, because keydown will not catch the currently entered value
+  $("#register_form #User_password")
+    .keyup(function () {
+      // set password variable
+      var pswd = $(this).val();
+      passwordValidate(pswd);
+    })
+    .focus(function () {
+      let pswdVal = $("#register_form #User_password").val();
+      let pattern = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[^a-zA-Z0-9]).{11,}$/;
+      if (pswdVal.match(pattern)) {
+        $(".pswd_info").hide();
+      } else {
+        $(".pswd_info").show();
+      }
+    })
+    .blur(function () {
+      $(".pswd_info").hide();
+    });
+
+  // function to validate user entered email
+  function validateEmail(userEmail) {
+    var pattern = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
+    // return $.trim(userEmail).test(pattern) ? true : false;
+    return pattern.test(userEmail) ? true : false;
+  }
+
+  // function to validate user entered password
+  function validatepassword(userPassword) {
+    var pattern =  /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[^a-zA-Z0-9])(?!.*\s).{8,15}$/;
+    // return $.trim(userPassword).test(pattern) ? true : false;
+    return pattern.test(userPassword) ? true : false;
+  }
+
+  registerForm.find("#User_Email,#User_password").keypress(function (e) {
+    if (e.which == 13) $("#register_btn").click();
+  });
+
+  // this will be triggered on clicking continue in signup form
+  $("#register_btn").click(function () {
+    $('.error_msg').hide();
+    registerForm.find(".loader-btn").show();
+    $(this).hide();
+    let userEmail = registerForm.find("#User_Email").val();
+    let userPassword = registerForm.find("#User_password").val();
+    let emailInput = registerForm.find(".email-login-inputgroup");
+    let passwordInput = registerForm.find(".password-login-inputgroup");
+    if (userEmail == "") {
+      emailInput.find("#User_Email").addClass("is-invalid");
+      emailInput.find(".form-floating").addClass("is-invalid");
+      emailInput.find(".invalid-feedback").text("Please enter your email");
+      registerForm.find(".loader-btn").hide();
+      $(this).show();
+    }
+    if (userPassword == "") {
+      passwordInput.find("#User_password").addClass("is-invalid");
+      passwordInput.find(".form-floating").addClass("is-invalid");
+      registerForm.find(".loader-btn").hide();
+      $(this).show();
+    } else {
+      emailInput.find("#User_Email").removeClass("is-invalid");
+      emailInput.find(".form-floating").removeClass("is-invalid");
+      passwordInput.find("#User_password").removeClass("is-invalid");
+      passwordInput.find(".form-floating").removeClass("is-invalid");
+      let Email_valid = validateEmail(userEmail);
+      let Pwd_valid = validatepassword(userPassword);
+      if (Email_valid === true && Pwd_valid === true) {
+        userRegistration();
+        $("#register_form .otp-input-group .otp-sent-email").text(userEmail);
+      } else if(Email_valid === false) {
+        emailInput.find("#User_Email").addClass("is-invalid");
+        emailInput.find(".form-floating").addClass("is-invalid");
+        emailInput.find(".invalid-feedback").text("Please enter a valid email");
+        registerForm.find(".loader-btn").hide();
+        $(this).show();
+      }else if(Pwd_valid === false){
+        passwordInput.find("#User_password").addClass("is-invalid");
+        passwordInput.find(".form-floating").addClass("is-invalid");
+        passwordInput.find(".invalid-feedback").text("Please check the password!");
+        registerForm.find(".loader-btn").hide();
+        $(this).show();
+      }
+    }
+  });
+  $(".pswd_eye").click(function(){
+    let eyeClass = $(this).find('svg').hasClass("fa-eye-slash");
+    if(eyeClass == true){
+         $(this).find('svg').removeClass("fa-eye-slash"); 
+        $(this).find('svg').addClass("fa-eye");
+        $(this).siblings('input').attr('type','password')
+      }else{
+        $(this).find('svg').removeClass("fa-eye");
+        $(this).find('svg').addClass("fa-eye-slash");  
+        $(this).siblings('input').attr('type','text')
+    }
+})
+  
+  $("#forgotPassword").click(function () {
+    $(".login-email-password-div").hide();
+    $(".login-forgot-password-div").show();
+  });
+  $("#forgot_Password_Back").click(function () {
+    $(".login-forgot-password-div").hide();
+    $(".login-email-password-div").show();
+  });
+  $("#forgot_password_submit").click(async function () {
+    let forgot_email = $("#forgot_User_Email").val();
+    if(forgot_email == ''){
+$('#forgot_User_Email').addClass('is-invalid')
+$('#forgot_User_Email').after(`<div class="invalid-feedback">Please enter Valid email</div>`);
+return
+    }
+    else{
+    debugger;
+  let port = SERVERNAME
+   // let port = "http://localhost:3088";
+    let url = `${port}/account/getuserbyphoneormail/${forgot_email}/${forgot_email}`;
+    const config = {
+      url,
+      method: "get",
+    };
+    $(".loader-btn").show();
+    $('#forgot_password_submit').hide()
+    let response = await axios(config);
+    debugger;
+    console.log(response);
+    $(".loader-btn").hide();
+    $('#forgot_password_submit').show()
+    if (response.data.result != null) {
+      debugger;
+      console.log(response.data);
+      const forgotpassPayload = {
+        firstname: "",
+        lastname: "",
+        contactnumber: "",
+        email: "",
+        tenantname: "",
+        contactoremail: response.data.result.email,
+        IsSignup: false,
+        IsRegisterUser: false,
+        IsForgotPswd: true,
+        UnibaseId: response.data.result.userName,
+        OtpId: 0,
+        UserOtp: "",
+      };
+      $('#forgot_password_submit').hide()
+      $(".loader-btn").show();
+      const forgetpassRes = await postAPIService(
+        `account/sendotp`,
+        forgotpassPayload
+      );
+      $(".loader-btn").hide();
+      console.log(forgetpassRes);
+      $(".email-validation").hide();
+      $('.user_email').html(forgot_email)
+      $(".otp-validation .otp-input-group").show();
+      $(".otp-validation .otp-input-group").on("paste", function (p) {
+        let data = p.originalEvent.clipboardData.getData("text");
+        let dataLength = data.length;
+        for (let i = 0; i < dataLength; i++) {
+          let input = $(
+            '.otp-validation .otp-input-group input[tabindex="' + (i + 1) + '"]'
+          );
+          input.val(data.charAt(i));
+          if (input.val().length >= input.attr("maxlength")) {
+            let nextInput = $(
+              '.otp-validation .otp-input-group input[tabindex="' +
+                (i + 2) +
+                '"]'
+            );
+            if (nextInput) {
+              nextInput.focus();
+            }
+          }
+        }
+        p.preventDefault();
+      });
+
+      $('.otp-validation .otp-input-group input[type="text"]').on(
+        "keyup",
+        function (e) {
+          if ($(this).val().length >= $(this).attr("maxlength")) {
+            if (e.keyCode !== 9 && e.keyCode !== 16) {
+              let tabIndex = parseInt($(this).attr("tabindex")) + 1;
+              $(
+                '.otp-validation .otp-input-group input[tabindex="' +
+                  $(this).attr("tabindex") +
+                  '"]'
+              ).val($(this).val());
+              $(
+                '.otp-validation .otp-input-group input[tabindex="' +
+                  tabIndex +
+                  '"]'
+              ).focus();
+            }
+          } else {
+            if (e.keyCode === 8) {
+              let tabIndex = parseInt($(this).attr("tabindex")) - 1;
+              $(
+                '.otp-validation .otp-input-group input[tabindex="' +
+                  tabIndex +
+                  '"]'
+              ).focus();
+            }
+          }
+        }
+      );
+      $("#Forgot_pass_proceed").click(async function () {
+        debugger;
+        let userotp='';
+        $(".otp-validation .otp-input-group input").each(function () {
+          let presVal = $(this).val();
+          userotp += presVal;
+        });
+        console.log(userotp);
+          const validateForgotpass = {
+           email: forgot_email,
+            otpid: forgetpassRes.data,
+            userotp: userotp,
+          };
+          $('#Forgot_pass_proceed').hide()
+          $(".loader-btn").show();
+          const forgetpassResotp = await postAPIService(
+            `hyperfusion/validateotp`,
+            validateForgotpass
+         );
+         $(".loader-btn").hide();
+         $('#Forgot_pass_proceed').show()
+          console.log(forgetpassResotp);
+          const Resotp = forgetpassResotp.data.result;
+          if (Resotp == "Otp verified successfully") {
+            $(".login-forgot-password-details-div").show();
+        $(".otp-validation .otp-input-group").hide();
+          } else {
+            // toasterOpts()
+            // Command: toastr["error"]("Please enter Valid OTP");
+            $('.error_msg').show();
+            $('.error_msg .error_msg_res').html("Please enter Valid OTP");
+          }
+      });
+      $("#forgot_password_details_submit").click(async function () {
+        debugger;
+        let pswdone =$("#forgot-password-input-one").val();
+        let pswdtwo =$("#forgot-password-input-two").val();
+        if(pswdone == pswdtwo) {
+          const forgotpassPayload = {
+            username: response.data.result.userName,
+            password: pswdtwo,
+          };
+          $("#forgot_password_details_submit").hide();
+          $(".loader-btn").show();
+          const forgetpassRes = await postAPIService(
+            `account/UpdatePassword`,
+            forgotpassPayload
+          );
+          console.log(forgetpassRes);
+          $(".loader-btn").hide();
+          $("#forgot_password_details_submit").show();
+          window.localStorage.setItem('Ispasswordupdate',true)
+          window.location.href = `./myaccount.html`;
+        }else {
+          $("#forgot-password-input-one").addClass('is-invalid');
+          $("#forgot-password-input-two").addClass('is-invalid')
+          $('.password_display').text('Passwords are not matched !').addClass('text-danger')
+        }
+     
+      
+      });
+    } 
+    else{
+      $('#forgot_User_Email').addClass('is-invalid');
+      $('#forgot_User_Email').after(`<div class="invalid-feedback">Please enter Valid email</div>`);
+   
+    }
+  }
+  });
+  $(".user_pass")
+  .keyup(function () {
+    // set password variable
+    var pswd = $(this).val();
+    passwordValidate(pswd);
+    $('.pswd_info').hide();
+    $(this).parent().siblings('.pswd_info').show();
+  })
+  .focus(function () {
+    let pswdVal = $(this).val();
+    let pattern = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[^a-zA-Z0-9]).{8,}$/;
+    if (pswdVal.match(pattern)) {
+      $(this).parent().siblings('.pswd_info').hide();
+    } else {
+      $(this).parent().siblings('.pswd_info').show();
+    }
+  })
+  .blur(function () {
+    $(this).parent().siblings('.pswd_info').hide();
+  });
+
+  function toasterOpts(){
+    toastr.options = {
+      "closeButton": true,
+      "debug": false,
+      "newestOnTop": true,
+      "progressBar": true,
+      "positionClass": "toast-top-center",
+      "preventDuplicates": true,
+      "onclick": null,
+      "showDuration": "300",
+      "hideDuration": "1000",
+      "timeOut": "5000",
+      "extendedTimeOut": "1000",
+      "showEasing": "swing",
+      "hideEasing": "linear",
+      "showMethod": "fadeIn",
+      "hideMethod": "fadeOut"
+    }
+  }
+}
+ $("#email_validate_submit").click(async function () {
+  let vaidate_otp;
+    let validate_email = $("#email_validation_input").val();
+    if(validate_email == ''){
+$('#email_validation_input').addClass('is-invalid')
+$('#email_validation_input').after(`<div class="invalid-feedback">Please enter Valid email</div>`);
+return
+    }
+    else{
+    debugger;
+  let port = SERVERNAME;
+   // let port = "http://localhost:3088";
+    let url = `${port}/account/getuserbyphoneormail/${validate_email}/${validate_email}`;
+    const config = {
+      url,
+      method: "get",
+    };
+    $(".loader-btn").show();
+    $('#email_validate_submit').hide()
+    let response = await axios(config);
+    debugger;
+    console.log(response);
+    $(".loader-btn").hide();
+    $('#email_validate_submit').show()
+    if (response.data.result != null) {
+      debugger;
+      console.log(response.data);
+      const forgotpassPayload = {
+        firstname: "",
+        lastname: "",
+        contactnumber: "",
+        email: "",
+        tenantname: "",
+        contactoremail: response.data.result.email,
+        IsSignup: false,
+        IsRegisterUser: false,
+        IsForgotPswd: true,
+        UnibaseId: response.data.result.userName,
+        OtpId: 0,
+        UserOtp: "",
+      };
+      $('#email_validate_submit').hide()
+      $(".loader-btn").show();
+      const validate_email_res = await postAPIService(
+        `account/sendotp`,
+        forgotpassPayload
+      );
+      $(".loader-btn").hide();
+      vaidate_otp = validate_email_res.data;
+      console.log(validate_email_res);
+      $(".email-validation").hide();
+      $('.user_email').html(validate_email)
+      $(".otp-validation .otp-input-group").show();
+      $(".otp-validation .otp-input-group").on("paste", function (p) {
+        let data = p.originalEvent.clipboardData.getData("text");
+        let dataLength = data.length;
+        for (let i = 0; i < dataLength; i++) {
+          let input = $(
+            '.otp-validation .otp-input-group input[tabindex="' + (i + 1) + '"]'
+          );
+          input.val(data.charAt(i));
+          if (input.val().length >= input.attr("maxlength")) {
+            let nextInput = $(
+              '.otp-validation .otp-input-group input[tabindex="' +
+                (i + 2) +
+                '"]'
+            );
+            if (nextInput) {
+              nextInput.focus();
+            }
+          }
+        }
+        p.preventDefault();
+      });
+     
+    } 
+    else{
+      $('#email_validation_input').addClass('is-invalid');
+      $('#email_validation_input').after(`<div class="invalid-feedback">Please enter Valid email</div>`);
+   
+    }
+  }
+  $("#email_validate_proceed").click(async function () {
+    debugger;
+    let userotp='';
+    let validate_email = $("#email_validation_input").val();
+    $(".email-validate-div .otp-validation .otp-input-group input").each(function () {
+      let presVal = $(this).val();
+      userotp += presVal;
+    });
+  
+     if(userotp.length == 6){
+      const validateForgotpass = {
+        email: validate_email,
+         otpid: vaidate_otp,
+         userotp: userotp,
+       };
+       $('#email_validate_proceed').hide()
+       $(".loader-btn").show();
+       const validate_email_resopt = await postAPIService(
+         `hyperfusion/validateotp`,
+         validateForgotpass
+      );
+      
+      $(".loader-btn").hide();
+      $('#email_validate_proceed').show()
+       const Resotp = validate_email_resopt.data.result;
+       if (Resotp == "Otp verified successfully") {
+       $(".login_section").show();
+       $(".otp-validation .otp-input-group").hide();
+       $("#email_validate_back").hide();
+       $('.error_msg').hide();
+       } else {
+         // toasterOpts()
+         // Command: toastr["error"]("Please enter Valid OTP");
+         $('.error_msg').show();
+         $('.error_msg .error_msg_res').html("Please enter Valid OTP");
+       }
+     }
+     else{
+      $('.error_msg').show();
+      $('.error_msg .error_msg_res').html("Please enter OTP");
+     }
+  });
+  });
+
+
+initLogin();

dist/js/components/accordion/accordion.js

@@ -0,0 +1,110 @@
+class AccordionItem extends HTMLElement {
+    static get observedAttributes() {
+      return ['title'];
+    }
+  
+    #title = '';
+    #collapsed = true;
+  
+    constructor() {
+      super();
+      this.attachShadow({ mode: 'open' });
+    }
+  
+    connectedCallback() {
+      this.update();
+      this.shadowRoot.addEventListener('click', this.toggle.bind(this));
+    }
+  
+    attributeChangedCallback(name, oldValue, newValue) {
+      if (name === 'title') {
+        this.#title = newValue;
+      }
+      this.update();
+    }
+  
+    toggle() {
+      this.#collapsed = !this.#collapsed;
+      this.update();
+  
+      // Dispatch a custom event to notify the parent AccordionElement
+      const event = new CustomEvent('accordion-item-toggle', {
+        bubbles: true,
+        detail: {
+          collapsed: this.#collapsed,
+          item: this,
+        },
+      });
+      this.dispatchEvent(event);
+    }
+  
+    update() {
+      this.shadowRoot.innerHTML = `
+        <style>
+          .accordion-item {
+          
+          }
+          .accordion-title {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            cursor: pointer;
+            padding: 0.5rem;
+            background-color: white;
+          }
+          .accordion-title:hover {
+            background-color: white;
+          }
+          .accordion-title::after {
+            content: '${this.#collapsed ? '+' : '−'}';
+            font-size: 1rem;
+            font-weight: bold;
+            color: #777;
+            margin-left: 0.5rem;
+          }
+          .accordion-content {
+            padding: 0.5rem;
+            display: ${this.#collapsed ? 'none' : 'block'};
+          }
+        </style>
+        <div class="accordion-item">
+          <div class="accordion-title">${this.#title}</div>
+          <div class="accordion-content">
+            <slot></slot>
+          </div>
+        </div>
+      `;
+    }
+  }
+
+  class AccordionElement extends HTMLElement {
+    #activeItem = null;
+  
+    constructor() {
+      super();
+      this.attachShadow({ mode: 'open' });
+      this.shadowRoot.innerHTML = '<slot></slot>';
+      this.addEventListener('accordion-item-toggle', this.handleItemToggle.bind(this));
+    }
+  
+    handleItemToggle(event) {
+      const { collapsed, item } = event.detail;
+  
+      // If the active item is different from the toggled item, collapse the active item
+      if (this.#activeItem && this.#activeItem !== item && !collapsed) {
+        this.#activeItem.toggle();
+      }
+
+      // Update the active item
+      if (!collapsed) {
+        this.#activeItem = item;
+      } else if (this.#activeItem === item) {
+        this.#activeItem = null;
+      }
+    }
+  }
+  
+  customElements.define('accordion-item', AccordionItem);
+  customElements.define('accordion-element', AccordionElement);
+  
+  

dist/js/components/authloader/authloader.js

@@ -0,0 +1,162 @@
+const template = document.createElement('template');
+
+template.innerHTML = `
+<style>
+.authloaderanwi {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+.wrap{
+    position:absolute;
+    left:50%;
+    width:5em;
+    height:5em;
+    top:20%;
+    transform: translate(-50%,-50%);
+  }
+  
+  .loader{
+      transition: all 0.7s ease-in-out;
+  
+    border:5px solid #ebebeb;
+    border-bottom-color:black;
+    width: 20px;
+    height: 20px;
+    border-radius:50%;
+    -webkit-font-smoothing: antialiased !important;
+    margin:30px 0px;
+  }
+  
+  #lrd1{
+      -webkit-animation: spin1 0.5s linear infinite;
+  
+  }
+  #lrd2{
+      -webkit-animation: spin2 3s ease-in-out infinite;
+  
+  }
+  #lrd3{
+      -webkit-animation: spin3 15s ease-in-out infinite;
+  
+  }
+  
+  @keyframes spin1{
+    0% {
+      transform: rotate(0deg);    
+    }
+  
+  
+    100% {
+      transform: rotate(360deg); 
+    }
+  
+  }
+  @keyframes spin2{
+    0% {
+      transform: rotate(0deg);    
+    }
+    50% {
+      transform: rotate(1020deg);    
+    }
+    
+    
+    100% {
+      transform: rotate(720deg); 
+    }
+  }
+  
+  @keyframes spin3{
+    0% {
+      transform: rotate(0deg);    
+    }
+    40% {
+      transform: rotate(1070deg);    
+    }
+    
+    
+    100% {
+      transform: rotate(6119deg);
+      border-bottom-color:#072426 !important;
+    }
+  }
+  
+.authloaderanwi {
+    height: 100vh;
+}
+
+
+.overlayanwiAuth{
+    width:100vw;
+    height:100vh;
+    background:white;
+    position:fixed;
+    top:0;
+    right:0;
+    z-index:99999;
+    display:none;
+}
+
+</style>
+  <div class="overlayanwiAuth ">
+  
+  <div style="
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    width:40px;
+    display:none;
+    ">
+
+    <span>
+  <?xml version="1.0" encoding="utf-8"?><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 122.88 116.31" style="enable-background:new 0 0 122.88 116.31" xml:space="preserve"><g><path d="M4.06,12.67C1.87,12.67,0,10.8,0,8.51c0-2.19,1.87-4.06,4.06-4.06h5.62c0.1,0,0.31,0,0.42,0c3.75,0.1,7.08,0.83,9.88,2.6 c3.12,1.98,5.41,4.99,6.66,9.47c0,0.1,0,0.21,0.1,0.31L27.78,21h2.34V4.12c0-2.27,1.85-4.12,4.12-4.12h21.67 c2.27,0,4.12,1.85,4.12,4.12v10.02c3.42-3.41,8.06-5.5,13.18-5.5c2.22,0,4.36,0.4,6.34,1.12c4.08-4.33,9.87-7.04,16.29-7.04 c10.96,0,20.07,7.88,21.99,18.28h0.99c2.29,0,4.06,1.87,4.06,4.06c0,0.42-0.11,0.83-0.21,1.25l-10.61,42.76 c-0.42,1.87-2.08,3.12-3.95,3.12l0,0H41.51c1.46,5.41,2.91,8.32,4.89,9.68c2.39,1.56,6.56,1.66,13.53,1.56h0.1l0,0h47.03 c2.29,0,4.06,1.87,4.06,4.06c0,2.29-1.87,4.06-4.06,4.06H60.04l0,0c-8.64,0.1-13.94-0.1-18.21-2.91 c-4.37-2.91-6.66-7.91-8.95-16.96l0,0L18.94,18.92c0-0.1,0-0.1-0.1-0.21c-0.62-2.29-1.66-3.85-3.12-4.68 c-1.46-0.94-3.43-1.35-5.72-1.35c-0.1,0-0.21,0-0.31,0H4.06L4.06,12.67L4.06,12.67z M84.38,37.69c0-1.28,1.27-2.32,2.83-2.32 c1.56,0,2.83,1.04,2.83,2.32v15.69c0,1.28-1.27,2.32-2.83,2.32c-1.56,0-2.83-1.04-2.83-2.32V37.69L84.38,37.69z M67.43,37.69 c0-1.28,1.27-2.32,2.83-2.32c1.56,0,2.83,1.04,2.83,2.32v15.69c0,1.28-1.27,2.32-2.83,2.32c-1.56,0-2.83-1.04-2.83-2.32V37.69 L67.43,37.69z M50.49,37.69c0-1.28,1.27-2.32,2.83-2.32c1.56,0,2.83,1.04,2.83,2.32v15.69c0,1.28-1.27,2.32-2.83,2.32 c-1.56,0-2.83-1.04-2.83-2.32V37.69L50.49,37.69z M85.57,13.37c2.31,2.05,4.14,4.66,5.29,7.63h19.85 c-1.68-6.65-7.7-11.58-14.87-11.58C91.89,9.42,88.29,10.91,85.57,13.37L85.57,13.37z M92.21,29.11L92.21,29.11l-38.01,0l0,0H30.07 l0,0l9.26,34.86h65.65l8.63-34.86H92.21L92.21,29.11z M55.31,21c0.11-0.29,0.23-0.57,0.35-0.85V7.2c0-1.64-1.35-2.99-2.99-2.99 H37.71c-1.64,0-2.99,1.34-2.99,2.99V21H55.31L55.31,21z M94.89,96.33c5.52,0,9.99,4.47,9.99,9.99s-4.47,9.99-9.99,9.99 c-5.51,0-9.99-4.47-9.99-9.99S89.38,96.33,94.89,96.33L94.89,96.33L94.89,96.33z M51.09,96.33c5.51,0,9.99,4.47,9.99,9.99 s-4.47,9.99-9.99,9.99s-9.99-4.47-9.99-9.99S45.57,96.33,51.09,96.33L51.09,96.33L51.09,96.33z"/></g>
+    </svg>
+    </span>
+    </div>
+<div class="authloaderanwi">
+<div class='loader' id='lrd1'></div>
+</div>
+
+  </div>
+`
+
+class AuthLoader extends HTMLElement {
+    constructor() {
+      super();
+      console.log(this.payment);
+      this._shadowRoot = this.attachShadow({ 'mode': 'open' });
+      this._shadowRoot.appendChild(template.content.cloneNode(true));
+      this.show();
+    }
+
+    static get observedAttributes() {
+      return ['payment'];
+    }
+  
+    // define getters and setters for attributes
+    get payment() {
+      return this.getAttribute('payment');
+    }
+  
+    set payment(val) {
+      if (val) {
+        this.setAttribute('payment', val);
+      } else {
+        this.removeAttribute('payment');
+      }
+    }
+    
+
+    show(){
+        // $('.overlayanwiAuth').css('display','block');
+        this._shadowRoot.querySelector('.overlayanwiAuth').style.display = "block";
+    }
+
+    hide(){
+         //$('.overlayanwiAuth').addClass('display','none');
+        this._shadowRoot.querySelector('.overlayanwiAuth').style.display = "none";
+    }
+}
+
+window.customElements.define('auth-loader', AuthLoader);

dist/js/components/select/selectcomponent.js

@@ -0,0 +1,256 @@
+
+class SearchableMulti extends HTMLElement {
+    static get observedAttributes() {
+      return ['placeholder'];
+    }
+  
+    constructor() {
+      super();
+      this._values = [];
+      this._placeholder = 'Search...';
+    }
+  
+    connectedCallback() {
+      if(!this._rendered) {
+        this._rendered = true;
+        this.attachShadow({ mode: 'open' });
+        this.shadowRoot.appendChild(this._template());
+        this._refresh();
+      }
+  
+      this._nonSelected.addEventListener('click', this);
+      this._selected.addEventListener('click', this);
+      this._search.addEventListener('keyup', this);
+    }
+  
+    disconnectedCallback() {
+      this._nonSelected.removeEventListener('click', this);
+      this._selected.removeEventListener('click', this);
+      this._search.removeEventListener('keyup', this);
+    }
+  
+    attributeChangedCallback(name, oldVal, newVal) {
+      if(name === 'placeholder') {
+        this.placeholder = newVal;
+      }
+    }
+  
+    get value() {
+      return this._values;
+    }
+  
+    get placeholder() {
+      return this._placeholder;
+    }
+  
+    set placeholder(val) {
+      this._placeholder = val;
+      if(this._rendered) {
+        this.shadowRoot.querySelector('input').placeholder = val;
+      }
+    }
+  
+    handleEvent(ev) {
+      var el = ev.target;
+      switch(ev.type) {
+        case 'click':
+          if(el.className === 'item') {
+            if(el.parentNode.className === 'non-selected-wrapper') {
+              this._nonSelectedClick(el);
+            } else {
+              this._selectedClick(el);
+            }
+          }
+          break;
+        case 'keyup':
+          if(ev.keyCode === 32 || ev.keyCode === 13) {
+            if(el.className === 'item') {
+              if(el.parentNode.className === 'non-selected-wrapper') {
+                this._nonSelectedClick(el);
+              } else {
+                this._selectedClick(el);
+              }
+              ev.preventDefault();
+            }
+          } else {
+            this._onSearch();
+          }
+          break;
+      }
+    }
+  
+    _nonSelectedClick(el) {
+      // Not already selected
+      if(!el._selected) {
+        this._setSelected(el);
+        this.dispatchEvent(new Event('change'));
+      }
+    }
+  
+    _setSelected(el) {
+      el._option.selected = true;
+      var clone = el._selected = el.cloneNode(true);
+      clone._nonSelected = el;
+      this._selected.appendChild(clone);
+      this._values.push(el.dataset.value);
+    }
+  
+    _selectedClick(el) {
+      var nonSelected = el._nonSelected;
+      var option = nonSelected._option;
+      nonSelected._selected = undefined;
+      el.parentNode.removeChild(el);
+  
+      // Deselect the option
+      option.selected = false;
+  
+      // Remove from values
+      var idx = this._values.indexOf(el.dataset.value);
+      if(idx !== -1) {
+        this._values.splice(idx, 1);
+        this.dispatchEvent(new Event('change'));
+      }
+    }
+  
+    _onSearch() {
+      var term = this._search.value.toLowerCase();
+  
+      function includes(str) {
+        return str.toLowerCase().indexOf(term) !== -1;
+      }
+  
+      var nonSelected, d;
+      for(var i = 0, len = this._nonSelected.children.length; i < len; i++) {
+        nonSelected = this._nonSelected.children[i];
+  
+        if(term && !includes(nonSelected.dataset.value) &&
+          !includes(nonSelected.textContent)) {
+          d = 'none';
+        } else {
+          d = '';
+        }
+        nonSelected.style.display = d;
+        if(nonSelected._selected) {
+          nonSelected._selected.style.display = d;
+        }
+      }
+    }
+  
+    _template() {
+      var doc = this.ownerDocument;
+      var wrapper = doc.createElement('div');
+      wrapper.className = 'wrapper';
+  
+      var style = doc.createElement('style');
+      style.textContent = this._styles();
+  
+      var input = this._search = doc.createElement('input');
+      input.type = 'text';
+      input.className = 'search-input';
+      input.placeholder = this.placeholder;
+  
+      var nonSelected = this._nonSelected = doc.createElement('div');
+      nonSelected.className = 'non-selected-wrapper';
+  
+      var selected = this._selected = doc.createElement('div');
+      selected.className = 'selected-wrapper';
+  
+      wrapper.appendChild(style);
+      wrapper.appendChild(input);
+      wrapper.appendChild(nonSelected);
+      wrapper.appendChild(selected);
+      return wrapper;
+    }
+  
+    _styles() {
+      return `
+        :host {
+          display: block;
+        }
+  
+        .wrapper {
+            border: 1px solid #ccc;
+            border-radius: 3px;
+            overflow: hidden;
+            width: 100%;
+        }
+  
+        .non-selected-wrapper,
+        .selected-wrapper {
+            box-sizing: border-box;
+            display: inline-block;
+            height: 200px;
+            overflow-y: scroll;;
+            padding: 10px;
+            vertical-align: top;
+            width: 50%;
+        }
+  
+        .non-selected-wrapper {
+            background: #fafafa;
+            border-right: 1px solid #ccc;
+        }
+  
+        .selected-wrapper {
+            background: #fff;
+        }
+  
+        .item {
+            cursor: pointer;
+            display: block;
+            padding: 5px 10px;
+        }
+  
+        .item:hover {
+            background: #ececec;
+            border-radius: 2px;
+        }
+  
+        .search-input {
+            border: 0;
+            border-bottom: 1px solid #ccc;
+            border-radius: 0;
+            display: block;
+            font-size: 1em;
+            margin: 0;
+            outline: 0;
+            padding: 10px 20px;
+            width: 100%;
+        }
+  
+        .non-selected-wrapper .item.selected {
+            opacity: 0.5;
+        }
+  
+        .non-selected-wrapper .row.selected:hover {
+            background: inherit;
+            cursor: inherit;
+        }
+      `;
+    }
+  
+    _refresh() {
+      this._selected.innerHTML = this._nonSelected.innerHTML = '';
+  
+      var term = this._search.value;
+      var options = [].slice.call(this.querySelectorAll('option'));
+      var doc = this.ownerDocument;
+  
+      options.forEach(function(option){
+        var row = doc.createElement('a');
+        row.setAttribute('tabindex', "0");
+        row.setAttribute('role', 'button');
+        row.textContent = option.textContent;
+        row.dataset.value = option.value;
+        row.className = 'item';
+        row._option = option;
+        this._nonSelected.appendChild(row);
+  
+        if(option.selected) {
+          this._setSelected(row);
+        }
+      }.bind(this));
+    }
+  }
+  
+  customElements.define('searchable-multi', SearchableMulti);

dist/js/footer.js

@@ -0,0 +1,446 @@
+$(document).ready(function () {
+    // Footer Js
+    let product_pg = $("body").hasClass("product_page");
+    let cookie = `<div id="cookieAcceptBar" class="cookieAcceptBar shadow bg-white py-3">
+   
+    <div class="cookie-content">
+        <p class="text-dark">We use cookies to enhance your user experience. please accept our
+          <a href="#" class="text-dark">cookies policy</a>
+        </p>
+        <div class="text-end">
+          <button id="btnAcceptCookiePolicy" class="btn btn-dark rounded">Accept</button>
+        </div>
+    </div>
+  </div>`;
+    $("#footer-head").after(cookie);
+        let footerHtml = `<footer class="footer-wrapper bg-black sec-space-1">
+    <div class="aw-mobile-footer d-block d-sm-none">
+    <div class="accordion" id="accordionExample">
+    <div class="accordion-item">
+      <h2 class="accordion-header" id="headingOne">
+        <button class="accordion-button bg-black text-white" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
+        Products
+        </button>
+      </h2>
+      <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
+        <div class="accordion-body pt-0">
+        <ul class="list-inline ">
+            <li class="fs-6">
+                <a href="/ramproducts.html" class="text-white fs-9 text-decoration-none satoshi_font">Memory</a>
+            </li>
+            <li class="fs-6">
+                <a href="./storageproducts.html" class="text-white fs-9  text-decoration-none satoshi_font">Storage</a>
+            </li class="fs-6">
+                <a href="./index1.html" class="text-white fs-9  text-decoration-none satoshi_font">Coming Soon</a>
+            </li>
+      <!--  <li>Monitors </li>
+        <li>Peripherals</li>
+        <li>Desktops</li>
+        <li>Components</li>
+        <li>Network Switches</li>
+        <li>Network Cards</li>
+        <li>Servers</li>
+        <li>Storage</li>
+        <li>Compact Workstations</li>-->
+    </ul>
+        </div>
+      </div>
+    </div>
+    <div class="accordion-item">
+      <h2 class="accordion-header" id="headingTwo">
+        <button class="accordion-button collapsed bg-black text-white" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
+        Anwi
+        </button>
+      </h2>
+      <div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
+        <div class="accordion-body pt-0">
+        <ul class="list-inline">
+            <li><a href="./about.html" class="text-white text-decoration-none satoshi_font">About Us</a></li>
+            <li><a href="./press.html" class="text-white text-decoration-none satoshi_font">Press</a></li>
+            <li><a href="./becomeamember.html" class="text-white text-decoration-none satoshi_font">Become a Member</a></li>
+            <li><a href="#" class="text-white text-decoration-none satoshi_font">Quality Certification</a></li>
+            <li><a href="#" class="text-white text-decoration-none satoshi_font">Case Study</a></li>
+            <li><a href="#" class="text-white text-decoration-none satoshi_font">Terms</a></li>
+            <li><a href="#" class="text-white text-decoration-none satoshi_font">Privacy</a></li>
+            <li><a href="#" class="text-white text-decoration-none satoshi_font">Careers</a></li>
+        </ul>
+        </div>
+      </div>
+    </div>
+   <!-- <div class="accordion-item">
+      <h2 class="accordion-header" id="headingThree">
+        <button class="accordion-button collapsed bg-black text-white" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
+        User Centre
+        </button>
+      </h2>
+      <div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
+        <div class="accordion-body pt-0">
+        <ul class="list-inline">
+        <li>My Quotes</li>
+        <li><a href="./support.html" class="text-white text-decoration-none satoshi_font">My Support</a></li>
+    </ul>
+        </div>
+      </div>
+    </div>-->
+    <div class="accordion-item">
+    <h2 class="accordion-header" id="headingFour">
+      <button class="accordion-button collapsed bg-black text-white" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
+      Support
+      </button>
+    </h2>
+    <div id="collapseFour" class="accordion-collapse collapse" aria-labelledby="headingFour" data-bs-parent="#accordionExample">
+      <div class="accordion-body pt-0">
+      <ul class="list-inline">
+      <li><a href="./contact.html" class="text-white text-decoration-none satoshi_font">Contact Us</a></li>
+      <li><a href="./support.html" class="text-white text-decoration-none satoshi_font">Support</a></li>
+      <li>Help Centre</li>
+      <li>Feedback</li>
+  </ul>
+      </div>
+    </div>
+  </div>
+    <div class="accordion-item">
+    <h2 class="accordion-header" id="headingFive">
+      <button class="accordion-button collapsed bg-black text-white" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFive" aria-expanded="false" aria-controls="collapseFive">
+      Service
+      </button>
+    </h2>
+    <div id="collapseFive" class="accordion-collapse collapse" aria-labelledby="headingFive" data-bs-parent="#accordionExample">
+      <div class="accordion-body pt-0">
+      <ul class="list-inline Services_list">
+        <li><a href="./services/paymentmethod.html" class="text-white text-decoration-none satoshi_font">Payment Method</a></li>
+        <li><a href="./services/shipping-delivary.html" class="text-white text-decoration-none satoshi_font">Shipping &amp; Delivery</a></li>
+        <li><a href="./services/return-policy.html" class="text-white text-decoration-none satoshi_font">Return Policy</a></li>
+        <li><a href="./services/product-warrenty.html" class="text-white text-decoration-none satoshi_font">Product Warranty</a></li>
+        <li><a href="./services/online-help.html" class="text-white text-decoration-none satoshi_font">Online Help</a></li>
+        <li><a href="./services/bulk-orders.html" class="text-white text-decoration-none satoshi_font">Bulk Orders</a></li>
+  </ul>
+      </div>
+    </div>
+  </div>
+    <div class="accordion-item">
+    <h2 class="accordion-header" id="headingSix">
+      <button class="accordion-button collapsed bg-black text-white" type="button" data-bs-toggle="collapse" data-bs-target="#collapseSix" aria-expanded="false" aria-controls="collapseSix">
+      Account
+      </button>
+    </h2>
+    <div id="collapseSix" class="accordion-collapse collapse" aria-labelledby="headingSix" data-bs-parent="#accordionExample">
+      <div class="accordion-body pt-0">
+      <ul class="list-inline">
+      <li>My Shopping Cart</li>
+      <li>My Account
+      </li>
+  </ul>
+      </div>
+    </div>
+  </div>
+    <div class="accordion-item">
+    <h2 class="accordion-header" id="headingSeven">
+      <button class="accordion-button collapsed bg-black text-white" type="button" data-bs-toggle="collapse" data-bs-target="#collapseSeven" aria-expanded="false" aria-controls="collapseSeven">
+      Follow Us
+      </button>
+    </h2>
+    <div id="collapseSeven" class="accordion-collapse collapse" aria-labelledby="headingSeven" data-bs-parent="#accordionExample">
+      <div class="accordion-body pt-0">
+      <ul class="p-0" style="list-style:none;">
+      <li>
+      <a href="#" target="_blank" class="text-white">
+          <ul class="d-flex list-inline">
+              <li class="footer-socailImg"><img src="./dist/assets/imgs/footer/twitter.png" alt="logo" class="px-1 img-fluid"></li>
+              <li>Twitter</li>
+          </ul>
+      </a>
+  </li>
+  <li>
+      <a href="https://www.instagram.com/anwi_systems/" target="_blank" class="text-white">
+          <ul class="d-flex list-inline">
+              <li class="footer-socailImg"><img src="./dist/assets/imgs/footer/instra.png" alt="logo" class="px-1 img-fluid"></li>
+              <li>Instagram</li>
+          </ul>
+      </a>
+  </li>
+  <li>
+      <a href="#" target="_blank" class="text-white">
+          <ul class="d-flex list-inline">
+              <li class="footer-socailImg"><img src="./dist/assets/imgs/footer/youtube.png" alt="logo" class="px-1 img-fluid"></li>
+              <li>Youtube</li>
+          </ul>
+      </a>
+  </li>
+  <li>
+      <a href="https://www.linkedin.com/company/anwisystems" target="_blank" class="text-white">
+          <ul class="d-flex list-inline">
+              <li class="footer-socailImg"><img src="./dist/assets/imgs/footer/linkedin.png" alt="logo" class="px-1 img-fluid"></li>
+              <li>Linkedin</li>
+          </ul>
+      </a>
+  </li>
+  <li>
+      <a href="https://www.facebook.com/profile.php?id=100089547520891" target="_blank" class="text-white">
+          <ul class="d-flex list-inline">
+              <li class="footer-socailImg">
+                  <img src="./dist/assets/imgs/footer/facebook.png" alt="logo" class="px-1 img-fluid">
+              </li>
+              <li>Facebook</li>
+          </ul>
+      </a>
+  </li>
+  </ul>
+
+      </div>
+    </div>
+  </div>
+  
+  </div>
+  <div class="footer-sub-content ">
+  <div class="container">
+  <div class="row g-0 align-items-center justify-content-around">
+          <div class="col-md-2 col-6 text-white
+                  text-center">
+              <p class="mb-0">Privacy Policy</p>
+          </div>
+          <div class="col-md-2 col-6 text-white
+                  text-center">
+              <p class="mb-0"> Terms of Use Sales
+              </p>
+          </div>
+          <div class="col-md-2 col-6 text-center text-white">
+          <p class="mb-0 d-flex align-items-center"><i class="fa fa-envelope"></i> <span class="satoshi_font"><a href="mailto:sales@anwisystems.com" class="satoshi_font text-white ps-1">sales@anwisystems.com </a></span>
+          </p>
+          </div>
+      </div>
+  <div class="text-white">
+  <p class="mb-0 text-center">Copyright ©2023 Anwisystems pvt ltd.</p>
+  <p class="mb-0 text-center">All rights reserved.</p>
+</div>
+  </div>
+</div>
+  </div>
+    <div class="footer-main-container d-none d-sm-block ">
+        <div class="footer-logo py-3
+                container"> <img src="./dist/assets/imgs/anwi-logo-2.png" class="img-fluid "  alt="anwi"> </div>
+        <hr class="container-fluid
+                text-white">
+        <div class="footer-content-main-container">
+            <div class="footer-content text-white position-relative ">
+                <div class="container">
+                    <div class="d-flex my-3">
+                        <div class="col-lg-3 border-end col-lg-3 mx-3">
+                            <h5 class="fw-bold">Products</h5>
+                            <ul class="list-inline ">
+                                <li class="fs-6">
+                                    <a href="/ramproducts.html" class="text-white fs-9 text-decoration-none satoshi_font">Memory</a>
+                                </li>
+                                <li class="fs-6">
+                                    <a href="./storageproducts.html" class="text-white fs-9  text-decoration-none satoshi_font">Storage</a>
+                                </li>
+                                <li class="fs-6">
+                                    <a href="./index1.html" class="text-white fs-9  text-decoration-none satoshi_font">Coming Soon</a>
+                                </li>
+                            </ul>
+                        </div>
+                        <div class="col-lg-3 border-end col-lg-3 mx-3 fs-6">
+                            <h5 class="fw-bold">Anwi</h5>
+                            <ul class="list-inline">
+                                <li class="fs-6"><a href="./about.html" class="text-white text-decoration-none satoshi_font">About Us</a></li>
+                                <li class="fs-6"><a href="./press.html" class="text-white text-decoration-none satoshi_font">Press</a></li>
+                                <li><a href="./becomeamember.html" class="text-white text-decoration-none satoshi_font">Become a Member</a></li>
+                                <li class="fs-6"><a href="#" class="text-white text-decoration-none satoshi_font">Quality Certification</a></li>
+                                <li class="fs-6"><a href="#" class="text-white text-decoration-none satoshi_font">Case Study</a></li>
+                                <li class="fs-6"><a href="#" class="text-white text-decoration-none satoshi_font">Terms</a></li>
+                                <li class="fs-6"><a href="#" class="text-white text-decoration-none satoshi_font">Privacy</a></li>
+                                <li class="fs-6"><a href="#" class="text-white text-decoration-none satoshi_font">Careers</a></li>
+                            </ul>
+                        </div>
+                        <div class="col-lg-3 border-end col-lg-3
+                                mx-3">
+                            <h5 class="fw-bold">Support</h5>
+                            <ul class="list-inline">
+                                <li><a href="./contact.html" class="text-white text-decoration-none satoshi_font">Contact Us</a></li>
+                                <li><a href="./support.html" class="text-white text-decoration-none satoshi_font">Support</a></li>
+                                <li>Help Centre</li>
+                                <li>Feedback</li>
+                            </ul>
+                            <h5 class="fw-bold">Service</h5>
+                            <ul class="list-inline">
+                                <li><a href="./services/paymentmethod.html" class="text-white text-decoration-none satoshi_font">Payment Method</a></li>
+                                <li><a href="./services/shipping-delivary.html" class="text-white text-decoration-none satoshi_font">Shipping &amp; Delivery</a></li>
+                                <li><a href="./services/return-policy.html" class="text-white text-decoration-none satoshi_font">Return Policy</a></li>
+                                <li><a href="./services/product-warrenty.html" class="text-white text-decoration-none satoshi_font">Product Warranty</a></li>
+                                <li><a href="./services/online-help.html" class="text-white text-decoration-none satoshi_font">Online Help</a></li>
+                                <li><a href="./services/bulk-orders.html" class="text-white text-decoration-none satoshi_font">Bulk Orders</a></li>
+                            </ul>
+                        </div>
+                        <div class="col-lg-3 last-col-footer">
+                            <h5 class="fw-bold">Account</h5>
+                            <ul class="list-inline">
+                            <li>
+                            <a href="/shopping-cart.html" class="text-white text-decoration-none satoshi_font"> My Shopping Cart</a>
+                           </li>
+                      
+                            <li>
+                            <a href="/myaccount.html" class="text-white text-decoration-none satoshi_font"> My Account</a>
+                            
+                            </li>
+                                </li>
+                            </ul>
+                            <h5 class="fw-bold">Follow Us</h5>
+                            <ul class="p-0" style="list-style:none;">
+                                <li>
+                                    <a href="#" target="_blank" class="text-white">
+                                        <ul class="d-flex list-inline">
+                                            <li class="footer-socailImg"><img src="./dist/assets/imgs/footer/twitter.png" alt="logo" class="px-1 img-fluid"></li>
+                                            <li>Twitter</li>
+                                        </ul>
+                                    </a>
+                                </li>
+                                <li>
+                                    <a href="https://www.instagram.com/anwi_systems/" target="_blank" class="text-white">
+                                        <ul class="d-flex list-inline">
+                                            <li class="footer-socailImg"><img src="./dist/assets/imgs/footer/instra.png" alt="logo" class="px-1 img-fluid"></li>
+                                            <li>Instagram</li>
+                                        </ul>
+                                    </a>
+                                </li>
+                                <li>
+                                    <a href="#" target="_blank" class="text-white">
+                                        <ul class="d-flex list-inline">
+                                            <li class="footer-socailImg"><img src="./dist/assets/imgs/footer/youtube.png" alt="logo" class="px-1 img-fluid"></li>
+                                            <li>Youtube</li>
+                                        </ul>
+                                    </a>
+                                </li>
+                                <li>
+                                    <a href="https://www.linkedin.com/company/anwisystems" target="_blank" class="text-white">
+                                        <ul class="d-flex list-inline">
+                                            <li class="footer-socailImg"><img src="./dist/assets/imgs/footer/linkedin.png" alt="logo" class="px-1 img-fluid"></li>
+                                            <li>Linkedin</li>
+                                        </ul>
+                                    </a>
+                                </li>
+                                <li>
+                                    <a href="https://www.facebook.com/profile.php?id=100089547520891" target="_blank" class="text-white">
+                                        <ul class="d-flex list-inline">
+                                            <li class="footer-socailImg">
+                                                <img src="./dist/assets/imgs/footer/facebook.png" alt="logo" class="px-1 img-fluid">
+                                            </li>
+                                            <li>Facebook</li>
+                                        </ul>
+                                    </a>
+                                </li>
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+                <div class="footer-rkt position-absolute bottom-0
+                        end-0 me-5">
+                    <img src="../dist/assets/imgs/Home/rocket-footer.png" alt="footer-rocket-img">
+                </div>
+            </div>
+        </div>
+        <hr class="container-fluid text-white">
+        <div class="footer-sub-content ">
+            <div class="container">
+                <div class="row g-0 py-4 align-items-center">
+                    <div class="col-md-5 text-white">
+                        <p class="mb-0">Copyright ©${new Date().getFullYear()} Anwisystems pvt ltd. All rights reserved.</p>
+                    </div>
+                    <div class="col-md-2 text-white border-end
+                            text-center">
+                        <p class="mb-0">Privacy Policy</p>
+                    </div>
+                    <div class="col-md-2 text-white border-end ps-3
+                            text-center">
+                        <p class="mb-0"> Terms of Use Sales
+                        </p>
+                    </div>
+                    <div class="col-md-2 text-white ps-5">
+                        <p class="mb-0 d-flex align-items-center"><i class="fa fa-envelope"></i> <span class="satoshi_font"><a href="mailto:sales@anwisystems.com" class="satoshi_font text-white ps-1">sales@anwisystems.com </a></span>
+                        </p>
+                    </div>
+
+                    <!-- <ul class="d-flex mb-0
+                            list-inline align-items-center text-white">
+                        <li>Copyright © 2022 Anwisystems pvt ltd. All rights reserved.
+                        </li>
+                        <li>
+                            <ul class="d-flex list-inline
+                                    align-items-center
+                                    ms-4">
+                                <li>Privacy Policy</li>
+                                <li class="mx-5">Terms of Use Sales</li>
+                                <li><p class="mb-0 d-flex align-items-center"><i class="fa fa-envelope"></i> <span class="satoshi_font"><a href="mailto:sales@anwisystems.com" class="satoshi_font text-white ps-1">sales@anwisystems.com </a></span>
+                                </p>
+                                </li>
+                            </ul>
+                        </li>
+                    </ul> -->
+                </div>
+            </div>
+        </div>
+    </div>
+</footer>`;
+        $("#footer-head").html(footerHtml);
+
+
+
+    $("[alt=footer-rocket-img]").click(function (e) {
+        document.documentElement.scrollTop = 0;
+    })
+    cookiesPolicyPrompt();
+
+    function cookiesPolicyPrompt() {
+        if (Cookies.get('AnwiCookiesPolicy') !== "yes") {
+            $("#cookieAcceptBar").fadeIn("slow");
+        }
+        $('#btnAcceptCookiePolicy').on('click', function () {
+            Cookies.set('AnwiCookiesPolicy', 'yes', { expires: 30 });
+            $("#cookieAcceptBar").fadeOut("slow");
+        });
+        let width = $(window).width();
+        if (width < 575) {
+            $("#cookieAcceptBar").css({
+                "max-width": "100%",
+            });
+        } else if (width <= 1600 && width > 1200) {
+            $("#cookieAcceptBar").css({
+                "max-width": "28%",
+            });
+        }
+        else if (width <= 1200 && width > 575) {
+            $("#cookieAcceptBar").css({
+                "max-width": "50%",
+            });
+        }
+    }
+
+
+    //services pages links and sources
+
+    let $body_pg = $("body").hasClass("services_page");
+    let $nav_img ="../dist/assets/imgs/anwi-logo-1.png";
+    let $footer_img = "../dist/assets/imgs/anwi-logo-2.png";
+    let $scrool_top_img = "../dist/assets/imgs/Home/rocket-footer.png";
+
+    if($body_pg == true){
+        $("#footer-head").find(".footer-logo img").attr("src",$footer_img);
+        $(".footer-socailImg").each(function(){
+            let $social_img = $(this).find("img").attr("src");
+            let $social_img_mbil = $social_img.includes("https://anwisystems.com/");
+                if($social_img_mbil === false){
+                    let $social_icon_mbil = `.${$social_img}`
+                    $(this).find("img").attr("src",$social_icon_mbil);
+                }
+        })
+        $(".list-inline").find("li a").each(function(){
+            let $footer_link = $(this).attr("href");
+            let $footer_in = $footer_link.includes("https://anwisystems.com/");
+            if($footer_in === false){
+                if( $footer_link != "#"){
+                    let $in_link = `.${$footer_link}`
+                    $(this).attr("href", $in_link);
+                }
+            }
+        }) 
+    }
+});

dist/js/form.js

@@ -0,0 +1,73 @@
+let formHTML = `  <!-- pop up -->
+<!-- enquire-form pop up -->
+<div class="modal fade style" id="enquireModal" tabindex="-1" role="dialog">
+  <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable mx-md-3 mx-3 mx-lg-auto" role="document">
+    <div class="wrap-contact100">
+      
+    <div class="modal-content contact100-form validate-form">
+      <div class=" justify-content-center position-absolute btn" style="right:0;z-index:10;">
+        <!-- <h5 class="modal-title" id="itemTitle"> </h5> -->
+        <button type="button" class="close btn" data-bs-dismiss="modal" >
+          <span >&times;</span>
+        </button>
+      </div>
+       <div class="d-flex w-100">
+      <div class="enquire-form-img col-md-6 col-lg-6 col-12 d-none d-lg-block d-md-block d-xl-block">
+      <img class="h-100 img-fluid" src="../backups/anwi-old-website/assets/img/quote-image.png">
+      </div>
+  <div class="enquire-form position-relative col-12 col-md-6 col-lg-6 pt-lg-5 pt-md-5 pt-2 px-30">
+  <div class="p-3">
+     <div>
+          <h3 class="contact-page-title">Request a Quote</h3>
+    </div>
+    <div>
+    
+                        <div id="pageloader" class="d-none">
+                            <img src="http://cdnjs.cloudflare.com/ajax/libs/semantic-ui/0.16.1/images/loader-large.gif"
+                                alt="processing..." />
+                        </div>
+    <form id="anwi-enquire-form" action="">
+      <div class="form-floating">
+        <input type="text" class="form-control" id="userName" name="name" placeholder="name@example.com"  required>
+        <label for="name">Your Name</label>
+      </div>
+      <div class="form-floating">
+        <input type="text" class="form-control" id="itemTitle" name="Title" placeholder="Password" disabled>
+        <label for="name">Product</label>
+      </div>
+      <div class="form-floating ">
+        <input type="email" class="form-control" id="floatingEmail" name="email" placeholder="name@example.com"  required>
+        <label for="floatingEmail">Email address</label>
+      </div>
+      <div class="form-floating">
+        <input type="number" class="form-control" id="floatingPhonenumber" name="phone" placeholder="Password"  required>
+        <label for="floatingPhonenumber">Mobile No</label>
+      </div>
+      <div class="form-floating ">
+        <input type="text" class="form-control" id="floatingSubject" name="subject" placeholder="name@example.com"  required>
+        <label for="floatingSubject">Subject</label>
+      </div>
+      <div class="form-floating">
+        <textarea name="contactMessage" class="form-control" id="contactMessage" name="message" placeholder="Your Message" required style="height:100px"></textarea>
+        <label for="floatingPassword">Message</label>
+      </div>
+      <div class="form-floating text-center my-4">
+        <button type="submit"  class="bg-black btn btn-lg text-white w-50" >
+          submit
+        </button>
+      </div>
+    </form>
+    </div>
+    </div>
+  </div>
+</div>
+    </div>
+    </div>
+  </div>
+</div>
+<!-- end popup -->`;
+
+$("#enquire").html(formHTML);
+$(".close").on("click", function () {
+    $("body").removeClass("open");
+  });

dist/js/index/index.js

@@ -0,0 +1,178 @@
+function indexInit(){
+    function init(){
+        initData();
+    }
+    async function initData(){
+        const ids = await getProductIdService();
+        if(!ids) return;
+        let dataAcc = [];
+        for(let i=0;i<ids.length;i++){
+            let currId = ids[i];
+            let {productid} = currId;
+
+            let resData =await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/itemtagscombination/productid/${productid}`,true); 
+
+            if(resData.isError){
+                alert(resData.errorMsg.message);
+                return;
+            }
+    
+            let res = resData.response;
+                
+            res = JSON.parse(res.result);
+    
+            dataAcc = [...dataAcc,...res.slice(0, 4)];
+
+        }
+
+   
+
+        shuffleArray(dataAcc);
+        console.log(dataAcc);
+        let html = '';
+       for(let i=0;i<dataAcc.length;i++){
+        html += getCardHTML({...dataAcc[i],img:dataAcc[i].itemimageurl})
+       }
+
+       $('.slider-hero').html(html);
+       
+
+        console.log(ids);
+        initSlider();
+
+        $('.topproductbtn').click(function (e){
+            let productid = $(e.target).data('productid');
+            let itemid = $(e.target).data('itemid');
+            let name =  $(e.target).data('name');
+            debugger;
+            window.location.href = `/productdetails.html?productId=${productid}#itemid=${itemid}`;
+        });
+    }
+
+    function initSlider(){
+        $('.slider-hero').slick({
+            dots: false,
+            lazyLoad: 'ondemand',
+            // autoplay: true,
+            // autoplaySpeed: 1000,
+            slidesToShow: 4,
+            slidesToScroll: 1,
+            responsive: [
+                {
+                  breakpoint: 1024,
+                  settings: {
+                    slidesToShow: 3,
+                    slidesToScroll: 3,
+                    infinite: true,
+                  }
+                },
+                {
+                  breakpoint: 600,
+                  settings: {
+                    slidesToShow: 2,
+                    slidesToScroll: 2
+                  }
+                },
+                {
+                  breakpoint: 480,
+                  settings: {
+                    slidesToShow: 1,
+                    slidesToScroll: 1
+                  }
+                },
+                {
+                    breakpoint: 1199,
+                    settings: {
+                        slidesToShow: 5,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 991,
+                    settings: {
+                        slidesToShow: 3,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 767,
+                    settings: {
+                        slidesToShow: 3,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 575,
+                    settings: {
+                        autoplay: true,
+                        slidesToShow: 3,
+                    }
+                }
+                // You can unslick at a given breakpoint now by adding:
+                // settings: "unslick"
+                // instead of a settings object
+            ]
+        });
+
+        $(".slick-prev").addClass("btn text-white");
+        $(".slick-next").addClass("btn text-white");
+        $(".slick-prev").html("←");
+        $(".slick-next").html("→")
+    }
+    function getCardHTML({itemname,img,sku,itemid,productid}){
+        let defaultImg = img ? imgServerNameBuild(img): `./dist/assets/imgs/nophoto.png`;
+        return ` <div class="card h-100 mx-1 text-center bg-gray-4 border-0">
+        <div class="card-body h-100">
+            <div class="d-flex flex-column h-100 justify-content-between">
+                <img src="${defaultImg}" class="w-100"/>
+                <p class="mb-0 fs-7 py-2">${itemname}</p>
+                <p class="fw-600 text-primary mb-0 topproductbtn" data-name="${itemname}" data-sku="${sku}" data-productid="${productid}" data-itemid="${itemid}">Buy Now</p>
+            </div>
+        </div>
+    </div>`;
+        return ` <div class="card h-100 mx-1 text-center bg-gray-4 border-0 top_sell">
+        <div class="card-body">
+            <img src="${defaultImg}" class="w-100"/>
+            <p class="mb-0 fs-7 py-2">${itemname}</p>
+             <p class="fw-600 text-primary mb-0" data-sku="${sku}" data-productid="${productid}" data-itemid="${itemid}">Buy Now</p>
+             
+        </div>
+    </div>`;
+    }
+
+    function getProductIdService(){
+        return new Promise(async (reslove,reject)=>{
+            let resData =await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/getallproducts`,true); 
+           if(resData.isError){
+                alert(resData.errorMsg.message);
+                return;
+            }
+
+            let res = resData.response;
+                
+            res = JSON.parse(res.result);
+
+          
+            let resultItem = [];
+
+            for(let i=0;i<res.length;i++){
+                if(resultItem.length == 2) break;
+                if(res[i].productname.includes('RAM ORA')||res[i].productname.includes('SSD ORA')){
+                    resultItem.push(res[i]);
+                  
+                }
+            }
+          
+            return reslove(resultItem)
+
+        });
+    }
+
+    
+
+    init();
+
+    
+}
+
+indexInit();

dist/js/json.js

@@ -0,0 +1,23 @@
+let product_detail = [
+  {
+    Name:"RAM",
+    Types:{
+        ProductType:"ORA",
+        ProductName:"DDR4 DESKTOP Memory",
+        ProductDesc:"ORA, Desktop RAM",
+        ProductSize:"16GB DDR4, 3200 Mhz",
+        ProductImage:"",
+        Product_features:{
+            memorysize:"32GB Kit (2 x 16GB)",
+            Frequency:"DDR5-6000 MT/s",
+            timing:"40-40-40-76 (XMP 6000MT/s)",
+            performance:"XMP 3.0",
+            warranty:"5 years",
+            intel:"Intel Z690 certificated",
+            productdesign:"Copper-aluminum composite heat spreaders with nano carbon coating to keep performance",
+            industrialStandards:"Comply with industrial standard JEDEC DDR5",
+            support:"RGB Fusion 2.0 Supported",
+        }
+    }
+  }
+];

dist/js/laptopmuti.js

@@ -0,0 +1,14 @@
+function callGallery(){
+    $('.PO_gallery_box').each(function(i,el){
+        $(el).click(function(e){
+            const src = $(e.target).attr('src');
+            $('.PO_gallery_display_img').attr('src',src)
+        });
+    });
+}
+
+function callMain(){
+    callGallery();
+}
+
+callMain();

dist/js/localstorage/checkout.js

@@ -0,0 +1,18 @@
+const ALL_ADDRESS_LOCAL = 'ALL_ADDRESS_LOCAL';
+
+function setAddressLocal(payload){
+    let addressList = getAddressLocal();
+    addressList = addressList?addressList:[];
+    localStorage.setItem(ALL_ADDRESS_LOCAL,JSON.stringify({...addressList,...payload}))
+}
+
+function getAddressLocal(){
+    let res =  localStorage.getItem(ALL_ADDRESS_LOCAL)
+    if(!res) return null;
+
+    return JSON.parse(res);
+}
+
+function removeAddressLocal(){
+    localStorage.removeItem(ALL_ADDRESS_LOCAL);
+}

dist/js/localstorage/loginauthlocal.js

@@ -0,0 +1,14 @@
+const INIT_LOGIN_AUTH = 'INIT_LOGIN_AUTH';
+
+function setInitLoginLocal(){
+    localStorage.setItem(INIT_LOGIN_AUTH,true);
+}
+
+function getInitLoginLocal(){
+    return JSON.parse(localStorage.getItem(INIT_LOGIN_AUTH));
+}
+
+
+function removeInitLoginLocal(){
+    localStorage.setItem(INIT_LOGIN_AUTH,false);
+}

dist/js/myaccount/Address.js

@@ -0,0 +1,377 @@
+async function addressDetails() {
+
+  // const user_addr_num =$("#Profile_Phone_num").val();
+  getbillinginfoBind();
+  let addr_phone = $('#phonenumber');
+  let addr_addrline = $('#addressdes');
+  let addr_zip = $('#zipcode');
+
+  let stateArr = [];
+
+  function getCustomDropDownHTML({ cityid, cityname, countryid }) {
+    return ` <div class="bg-white stateoption px-2 border-bottom py-2 cursor-pointer" data-name="${cityname}" data-value="${cityid}">${cityname}</div>`;
+  }
+
+  function renderCustomStateDropdown(stateList) {
+    let html = ``;
+
+    let maxLen = stateList.length > 10 ? 10 : stateList.length
+    for (let i = 0; i < maxLen; i++) {
+      let currItem = stateList[i];
+      html += getCustomDropDownHTML(currItem);
+    }
+
+    $('.stateBox').html(html);
+
+    $('.stateoption').off().click(function (e) {
+ 
+      const name = $(e.target).data('name');
+      const id = $(e.target).data('value');
+      $('#state').val(name);
+      $('#state').attr('data-id', id);
+    })
+  }
+
+  function loadDropdownStateEvents() {
+    $('#state').off().focus(function () {
+      $('.stateBox').removeClass('d-none');
+      $(document).off('click').click(closeDrop);
+
+
+    })
+
+
+    $(document).off().click(closeDrop);
+
+    function closeDrop(e) {
+      let id = $(e.target).hasClass('stateoption');
+      if ($(e.target).attr('id') === 'state') return;
+      if (id) {
+        $('.stateBox').addClass('d-none');
+        $(document).off();
+      } else {
+        $('.stateBox').addClass('d-none');
+        $(document).off();
+      }
+
+    }
+
+    $('#state').keyup(debounce(function (event) {
+      onChangeState(event)
+    }));
+  }
+
+  function getbillinginfoBind() {
+    return new Promise(async (resolve, reject) => {
+      let cookieRes = COOKIE_HELPER_ACTIONS.getCookie();
+      console.log(cookieRes);
+      const { errorMsg, isError, response } =
+        await API_SERVICES_ACTIONS.getAPIService(
+          `apis/v4/bizgaze/integrations/anwiauth/getbillinginfo/contactid/${cookieRes.userId}`
+        );
+      let res = JSON.parse(response.result);
+
+      console.log(res);
+      res = res[res.length - 1];
+
+      addr_phone.val(res?.phonenumber);
+      $('#Profile_User_name').val(res?.organizationname)
+      $('#Profile_Phone_num').val(res?.phonenumber)
+      let Profileusername = $('#Profile_User_name').val()
+      let Profileuserphone = $('#Profile_Phone_num').val()
+      $('.overview_user_name').html(Profileusername);
+      $('.overview_user_phone').html(Profileuserphone);
+      if (res?.cityid == "0") {
+        $(".profile_Address").html(
+          `<div class=User_address><button class="btn btn-outline-primary create_address" type="button"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-plus-circle" viewBox="0 0 16 16"><path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/><path d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z"/></svg> ADD NEW ADDRESS</button></div>`
+        );
+
+        $(".address_edit").hide();
+        $(".create_address").on("click", function () {
+    
+          $(this).hide();
+          $('.saveaddress').hide()
+          $(".addresslist").show();
+          $(".Createaddress").show();
+          getCountryStateCurrency();
+        });
+        $('.Createaddress').off().on('click', async function () {
+          if (addr_zip.val() == "" || addr_addrline.val() == "") {
+            // toastr.error('Required Feilds are Empty!');
+            //  if(addr_phone.val() == '' || addr_phone.val().length <10){
+            //     addr_phone.addClass("is-invalid");
+            //  }
+            //  else{
+            //     addr_phone.removeClass("is-invalid");
+            //  }
+            if (addr_zip.val() == '' || addr_zip.val().length < 6) {
+              addr_zip.addClass("is-invalid");
+            }
+            else {
+              addr_zip.removeClass("is-invalid");
+            }
+            if (addr_addrline.val() == '') {
+              addr_addrline.addClass("is-invalid");
+            } else {
+              addr_addrline.removeClass("is-invalid");
+            }
+          }
+          else {
+            $(".addresslist").hide();
+            $(".profile_Address").show();
+            $(".address_edit").show();
+            $(".address_edit_cancel").hide();
+            await createBillingForm()
+            await getbillinginfoBind();
+          }
+
+        })
+      } else {
+        $(".profile_Address").html(
+          `<div class=User_address><address><p><strong class="">${res?.organizationname}</strong><p>${res?.addressline},${res?.cityname},${res?.zipcode}<p>Mobile: ${res?.phonenumber}</address></div>`
+        );
+        $('#state').val(res?.cityname)
+        $('#state').attr('data-id',res?.cityid);
+        $('#zipcode').val(res?.zipcode);
+        $('#addressdes').val(res?.addressline);
+      }
+      resolve();
+    });
+  } 
+
+
+  $(".address_edit").on("click", function () {
+    $(this).hide();
+    $(".profile_Address").hide();
+    $(".addresslist").show();
+    $(".address_edit_cancel").show();
+    getCountryStateCurrency();
+    getbillinginfoBind()
+  });
+
+  $(".address_edit_cancel").on("click", function () {
+    $(this).hide();
+    $(".addresslist").hide();
+    $(".profile_Address").show();
+    $(".address_edit").show();
+  });
+
+  $(".saveaddress")
+    .off("click")
+    .click(async function () {
+
+    
+      if (addr_zip.val() == "" || addr_addrline.val() == "") {
+        // toastr.error('Required Feilds are Empty!');
+        //  if(addr_phone.val() == '' || addr_phone.val().length <10){
+        //     addr_phone.addClass("is-invalid");
+        //  }
+        //  else{
+        //     addr_phone.removeClass("is-invalid");
+        //  }
+        if (addr_zip.val() == '' || addr_zip.val().length < 6) {
+          addr_zip.addClass("is-invalid");
+        }
+        else {
+          addr_zip.removeClass("is-invalid");
+        }
+        if (addr_addrline.val() == '') {
+          addr_addrline.addClass("is-invalid");
+        } else {
+          addr_addrline.removeClass("is-invalid");
+        }
+      }
+      else {
+        $(".addresslist").hide();
+        $(".profile_Address").show();
+        $(".address_edit").show();
+        $(".address_edit_cancel").hide();
+        $('.spinner-border').removeClass('d-none')
+        $('.saveaddress').find('span').addClass('d-none')
+        await AddresssaveForm();
+        $('.spinner-border').addClass('d-none')
+        $('.saveaddress').find('span').removeClass('d-none')
+        await getbillinginfoBind();
+      }
+
+    });
+
+    function onChangeState(e){
+      let userItem = e.target.value.toLowerCase();
+      let limit = 10;
+      let results = [];
+      let maxLen = stateArr.length > 10 ? 10 :stateArr.length;
+      
+      for(let i=0;i<stateArr.length;i++){
+          let currItem = stateArr[i];
+          let stateName = currItem.cityname.toLowerCase();
+          if(stateName.includes(userItem)){
+              results.push(currItem);
+              if(results.length>=10) break;
+          }
+      }
+      $('.stateBox').removeClass('d-none');
+      renderCustomStateDropdown(results);
+      loadDropdownStateEvents();
+
+
+  }
+
+  async function getCountryStateCurrency() {
+ 
+    const countryRes = await API_SERVICES_ACTIONS.getAPIService(
+      "apis/v4/bizgaze/integrations/anwiauth/getcountry"
+    );
+    if (countryRes.isError) {
+      alert("something went wrong");
+      console.log(countryRes);
+      return;
+    }
+    let countryData = JSON.parse(countryRes.response.result);
+
+    console.log(countryData, "country");
+
+    for (let i = 0; i < countryData.length; i++) {
+      if (countryData[i].countryname.toLowerCase() === "india") {
+        countryID = countryData[i].countryid;
+        countrynameData = countryData[i].countryname;
+        break;
+      }
+    }
+    const stateRes = await API_SERVICES_ACTIONS.getAPIService(
+      `apis/v4/bizgaze/integrations/anwiauth/getcities/countryid/${countryID}`
+    );
+
+    if (stateRes.isError) {
+      alert("something went wrong");
+      console.log(stateRes, "state");
+      return;
+    }
+
+    let stateData = JSON.parse(stateRes.response.result);
+
+    console.log(stateData, "state");
+    stateArr = stateData;
+    renderCustomStateDropdown(stateArr);
+    loadDropdownStateEvents();
+    const currencyRes = await API_SERVICES_ACTIONS.getAPIService(
+      "apis/v4/bizgaze/integrations/anwiauth/getcurrencies"
+    );
+
+    if (currencyRes.isError) {
+      alert("something went wrong");
+      console.log(currencyRes);
+      return;
+    }
+
+    let currencyData = JSON.parse(currencyRes.response.result);
+
+    console.log(currencyData, "currencyDatacurrencyDatacurrencyData");
+
+    for (let i = 0; i < currencyData.length; i++) {
+      const curr = currencyData[i];
+      if (curr.currencyname.toLowerCase().includes("india")) {
+        currencyid = curr.currencyid;
+      }
+    }
+  }
+
+  async function getCountryId() {
+    const countryRes = await API_SERVICES_ACTIONS.getAPIService(
+      "apis/v4/bizgaze/integrations/anwiauth/getcountry"
+    );
+
+    if (countryRes.isError) {
+      alert("something went wrong");
+      console.log(countryRes);
+      return;
+    }
+
+    let ctyId = 0;
+    let countryData = JSON.parse(countryRes.response.result);
+
+    console.log(countryData);
+
+    for (let i = 0; i < countryData.length; i++) {
+      if (countryData[i].countryname.toLowerCase() === "india") {
+        countryId = countryData[i].countryid;
+        ctyId = countryId;
+        countrynameData = countryData[i].countryname;
+        break;
+      }
+    }
+
+    return ctyId;
+  }
+
+  function createBillingForm() {
+
+    return new Promise(async (resolve, reject) => {
+      let cookieRes = COOKIE_HELPER_ACTIONS.getCookie();
+      let { userId, name } = cookieRes;
+      const ctyId = await getCountryId();
+      let stateId = $("#state").data('id');
+      let payload = {
+        cityid: stateId,
+        CityName: $(`[data-id="${stateId}"`).html(),
+        addressline1: $("#addressdes").val(),
+        OrganizationType: 2,
+        organizationname: name,
+        //"OrganizationId":,
+        ContactName: name,
+        ContactId: userId,
+        countryname: "india",
+        countryid: ctyId,
+        statename: $(`[data-id="${stateId}"`).html(),
+        phonenumber: $("#phonenumber").val(),
+        OrganizationId: userId,
+        currencyid: 2,
+        taxno: "0",
+        BillingInfoExists: false,
+        lobid: 0,
+        lobname: "IT Products",
+        gstindetailid: 0,
+        zipcode: $("#zipcode").val(),
+      };
+      const res = await API_SERVICES_ACTIONS.postAPIService(
+        "apis/v4/bizgaze/crm/address/savebillinginfo",
+        payload
+      );
+      // http://localhost:3088/apis/v4/bizgaze/crm/address/savebillinginfo
+      console.log(res);
+      resolve();
+    });
+  }
+
+  async function AddresssaveForm() {
+
+    let cookieRes = COOKIE_HELPER_ACTIONS.getCookie();
+    let { userId, name } = cookieRes;
+    const { errorMsg, isError, response } =
+      await API_SERVICES_ACTIONS.getAPIService(
+        `apis/v4/bizgaze/integrations/anwiauth/getbillinginfo/contactid/${cookieRes.userId}`
+      );
+    let resAnwi = JSON.parse(response.result);
+    console.log(resAnwi, "befores");
+    resAnwi = resAnwi[resAnwi.length - 1];
+    let stateId = parseInt($("#state").data('id'));
+    let payload = {
+      ...resAnwi,
+      phonenumber: $("#phonenumber").val(),
+      addressline1: $("#addressdes").val(),
+      zipcode: $("#zipcode").val(),
+      cityid: stateId,
+      CityName: $('#state').val(),
+      cityname: $('#state').val(),
+    };
+    console.log(payload, "addresssaave");
+    //
+    const res = await API_SERVICES_ACTIONS.postAPIService(
+      "apis/v4/bizgaze/crm/address/savebillinginfo",
+      payload
+    );
+    return new Promise((reslove, reject) => {
+      reslove(res);
+    });
+  }
+}

dist/js/myaccount/Myaccount.js

@@ -0,0 +1,10 @@
+function initmyaccount(){
+    $('.my_account_page').removeClass('d-none')
+    myProfile();
+    supportTicketMain();
+    bindOrderDetails();   
+    wattantyFunction();
+    addressDetails()
+}
+
+checkValidAuth(initmyaccount,'./login.html')

dist/js/myaccount/Profile.js

@@ -0,0 +1,158 @@
+function myProfile() {
+    
+    getbillinginfoBind()
+   async function getbillinginfoBind(){
+    let cookieRes = COOKIE_HELPER_ACTIONS.getCookie();
+    console.log(cookieRes);
+    const { errorMsg, isError, response } = await API_SERVICES_ACTIONS.getAPIService(
+      `apis/v4/bizgaze/integrations/anwiauth/getbillinginfo/contactid/${cookieRes.userId}`
+    );
+    let res = JSON.parse(response.result);
+   
+    console.log(res);
+    res = res[res.length - 1];
+   $('#Profile_User_name').val(res?.organizationname)
+  $('#Profile_Phone_num').val(res?.phonenumber)
+    let Profileusername =$('#Profile_User_name').val()
+    let Profileuserphone=$('#Profile_Phone_num').val()
+    $('.overview_user_name').html(Profileusername);
+    $('.overview_user_phone').html(Profileuserphone);
+    $(".profile_Address").html(`<div class=User_address><address><p><strong>${res?.organizationname}</strong><p>${res?.addressline},${res?.cityname}<br>${res?.statename},${res?.zipcode}<p>Mobile: ${res?.phonenumber}</address></div>`
+      );
+}
+    let countryId = null;   
+  $(".profile_edit").on("click", function () {
+    $(this).hide();
+    // $('.profile_save_btn,.profile_edit_cancel').removeClass('d-none')
+    $(".profile_save_btn,.profile_edit_cancel,.profile_info_label").show();
+    $(".profile_info").removeAttr("disabled").removeClass("cursor-notvalid");
+  });
+  $(".profile_edit_cancel").on("click", function () {
+    $(this).hide();
+    $(".profile_save_btn,.profile_info_label").hide();
+    $('#Profile_User_name').val('');
+    $('#Profile_Phone_num').val('');
+    getbillinginfoBind();
+    $(".profile_edit").show();
+    $(".profile_info").attr("disabled", "disabled").addClass("cursor-notvalid");
+  });
+  $(".pass_edit").on("click", function () {
+    $(this).hide();
+    $(".update_profile_pass,.pass_edit_cancel").show();
+    $(".profile_info_pass")
+      .removeAttr("disabled")
+      .removeClass("cursor-notvalid");
+  });
+  $(".pass_edit_cancel").on("click", function () {
+    $('#Profile_User_current_pass').val('');
+    $('#Profile_User_confirm_pass').val('');
+    $('#Profile_User_new_pass').val('');
+    $('#Profile_User_current_pass,#Profile_User_new_pass,#Profile_User_confirm_pass').removeClass('is-invalid')
+    // $('#Profile_User_new_pass').val().removeClass('is-invalid')
+    // $('#Profile_User_confirm_pass').val().removeClass('is-invalid')
+    $(this).hide();
+    $(".update_profile_pass").hide();
+    $(".pass_edit").show();
+    $(".profile_info_pass")
+      .attr("disabled", "disabled")
+      .addClass("cursor-notvalid");
+  });
+  $(".update_profile_pass").on("click", async function () {
+    let userEmail = window.localStorage.getItem("Useremail");
+    console.log(userEmail);
+    let port = SERVERNAME;
+    // let port = "http://localhost:3088";
+    let url = `${port}/account/getuserbyphoneormail/${userEmail}/${userEmail}`;
+    const config = {
+      url,
+      method: "get",
+    };
+
+
+    let response = await axios(config);
+    let usernameId = response.data.result.userName;
+    let UserNewpassword = $("#Profile_User_new_pass");
+    let usercurrentPass = $("#Profile_User_current_pass");
+    let userConfirmpass = $("#Profile_User_confirm_pass");
+    if (usercurrentPass.val() != "") {
+      $(usercurrentPass).removeClass("is-invalid");
+      if (UserNewpassword.val() && userConfirmpass.val() != "") {
+        if (UserNewpassword.val() == userConfirmpass.val()) {
+          console.log(usernameId);
+          const UpdatePassPayload = {
+            username: usernameId,
+            password: UserNewpassword.val(),
+            oldpassword: usercurrentPass.val(),
+          };
+          const update_passres = await postAPIService(
+            `hyperfusion/HypersfusionUpdatePassword`,
+            UpdatePassPayload
+          );
+          console.log(update_passres);
+          if (update_passres.data.errors != null) {
+            $(".profilepass_feedbackres")
+              .html(`<div class="alert alert-danger error_msg " role="alert" style="font-size: 12px;"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.2646 3.41366C11.7212 3.15681 12.2788 3.15681 12.7354 3.41366L19.2354 7.06991C19.7077 7.33558 20 7.83536 20 8.37727V15.6227C20 16.1646 19.7077 16.6644 19.2354 16.9301L12.7354 20.5863C12.2788 20.8432 11.7212 20.8432 11.2646 20.5863L4.76461 16.9301C4.29229 16.6644 4 16.1646 4 15.6227V8.37727C4 7.83536 4.29229 7.33559 4.76461 7.06991L11.2646 3.41366Z" fill="#FF3A2E"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M11 7.4C11 7.17909 11.1791 7 11.4 7H12.6C12.8209 7 13 7.17909 13 7.4V12.6C13 12.8209 12.8209 13 12.6 13H11.4C11.1791 13 11 12.8209 11 12.6V7.4Z" fill="white"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M11 16C11 15.4477 11.4477 15 12 15C12.5523 15 13 15.4477 13 16C13 16.5523 12.5523 17 12 17C11.4477 17 11 16.5523 11 16Z" fill="white"></path></svg>
+         <span class="error_msg_res">${update_passres.data.message}</a></span> 
+         
+         </div>`);
+            $(userConfirmpass).addClass("is-invalid");
+            $(UserNewpassword).removeClass("is-invalid");
+            $(userConfirmpass).removeClass("is-invalid");
+          } else {
+            $(".profilepass_feedbackres")
+              .html(`<div class="alert alert-success success_msg" role="alert" style="font-size: 12px;"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-check" viewBox="0 0 16 16">
+                <path d="M10.97 4.97a.75.75 0 0 1 1.07 1.05l-3.99 4.99a.75.75 0 0 1-1.08.02L4.324 8.384a.75.75 0 1 1 1.06-1.06l2.094 2.093 3.473-4.425a.267.267 0 0 1 .02-.022z"/>
+              </svg>
+         <span class="success_msg_res">${update_passres.data.message}</a></span> 
+         </div>`);
+            usercurrentPass.val("");
+            UserNewpassword.val("");
+            userConfirmpass.val("");
+          }
+        } else {
+          $(UserNewpassword).addClass("is-invalid");
+          $(userConfirmpass).addClass("is-invalid");
+          return;
+        }
+      } else {
+        $(UserNewpassword).addClass("is-invalid");
+        $(userConfirmpass).addClass("is-invalid");
+        return;
+      }
+    } else {
+      $(usercurrentPass).addClass("is-invalid");
+      return;
+    }
+  });
+  $('.profile_save_btn').on('click',async function(){
+    await ProfilesaveForm();
+    $('.profile_edit_cancel').trigger('click')
+})
+  async function ProfilesaveForm() {
+
+    let cookieRes = COOKIE_HELPER_ACTIONS.getCookie();
+    let { userId, name } = cookieRes;
+    const { errorMsg, isError, response } =
+      await API_SERVICES_ACTIONS.getAPIService(
+        `apis/v4/bizgaze/integrations/anwiauth/getbillinginfo/contactid/${cookieRes.userId}`
+      );
+    let resAnwi = JSON.parse(response.result);
+    console.log(resAnwi, "previous profilesave");
+    resAnwi = resAnwi[resAnwi.length - 1];
+    let payload = {
+      ...resAnwi,
+      organizationname: $("#Profile_User_name").val(),
+      phonenumber: $("#Profile_Phone_num").val(),
+    };
+    console.log(payload, "profilesave");
+    //
+    const res = await API_SERVICES_ACTIONS.postAPIService(
+      "apis/v4/bizgaze/crm/address/savebillinginfo",
+      payload
+    );
+    return new Promise((reslove, reject) => {
+      reslove(res);
+      getbillinginfoBind();
+    });
+  }
+}

dist/js/myaccount/myaccount_warrenty.js

@@ -0,0 +1,158 @@
+function wattantyFunction(){
+
+
+let order_card = `<div class=warranty_product><div class="py-3 warranty_productform"><div class=mb-3><label class=form-label for=Add_serial_number_inp>Enter Your Serial Number</label><input class=form-control id=Add_serial_number_inp  required><label class="form-label text-danger d-none error_serial_num" for=Add_serial_number_inp >Serial Number Not Found</label></div><div class=mb-3><label class=form-label for=Add_phonenumber_inp>Enter Your Phone Number</label> <input class=form-control id=Add_phonenumber_inp required><label class="text-danger d-none form-label error_phonenumber" for=Add_phonenumber_inp>Enter Valid Phone Number</label></div><div class=mb-3><label class=form-label for=Add_contactname_inp>Enter Your Contactname</label> <input class=form-control id=Add_contactname_inp required></div><div class="serial_submit text-end"><button class="btn btn-dark warranty_serialNumber_submit" type="button">Submit</button></div></div></div>`;
+
+$(".user_orders").append(order_card);
+$('.add_serialNum').click(function () {
+    $('.warranty_productform').removeClass('d-none');
+    $(this).addClass('d-none');
+});
+$('.warranty_serialNumber_submit').click(async function () {
+    let serial_no_inp = $('#Add_serial_number_inp').val();
+    let phonenumber_inp = $('#Add_phonenumber_inp').val();
+    let contactname_inp = $('#Add_contactname_inp').val();
+    if(serial_no_inp && phonenumber_inp !=''){
+        $('.error_serial_num').addClass('d-none');
+         $('.error_phonenumber').addClass('d-none');
+         $('#Add_serial_number_inp').removeClass('border-danger')    
+         $('#Add_phonenumber_inp').removeClass('border-danger');
+    let port = SERVERNAME;
+
+    let url = `${port}/apis/v4/Bizgaze/integrations/products/warrantyservice/serialno/${serial_no_inp}`;
+    console.log(url);
+    // const STAT = `05b2f2ca510344968c65e1ebf49a5595`
+    const config = {
+        url,
+        method: "get",
+        headers: {
+            Authorization: `stat ${STAT}`,
+        },
+    };
+
+    let response = await axios(config);
+
+    console.log(response)
+    let product_res = response.data.result
+    if (product_res != null) {
+        let warrenty_res = JSON.parse(product_res);
+        let new_arr = [warrenty_res];
+        $.each(new_arr, function (key, value) {
+            console.log(value)
+            if (response.data.result == '[]') {
+                // Command: toastr["error"]("Serial number not found !")
+                // toasterOpts();
+                // $('#Add_serial_number_inp').addClass('border-danger');
+                // $('.error_serial_num').removeClass('d-none')
+                $(".user_Warranty_details").html(`<div class="Serial_numb_notfound text-danger text-center"><h2>Serial Number Not Found !</h2>`);
+                // $('.warranty_productform').addClass('d-none');
+                // $('.add_serialNum').removeClass('d-none');
+                return;
+            }
+            else {
+                const warrantyEnabled = value[0].warrantyenabled;
+                if (warrantyEnabled == false) {
+                    let phonenumber_updated = Number(phonenumber_inp)
+                    $('.user_Warranty_details').removeClass('d-none')
+                    //  let  strDate =  new Date(value[0].purchasedate).toISOString().slice(0, 10);
+                     let Warrentypayload =
+                     {
+                         "sku": value[0].sku,
+                         "serialno": serial_no_inp,
+                         "phonenumber": phonenumber_updated,
+                         "contactname": contactname_inp,
+                         "warrantyfromdate": value[0].purchasedate
+                    }
+                     warrentyService(Warrentypayload);
+                }
+                else {
+                    // let warrantySerialnumber =$('.serial_no_warrantynumber').text()
+                    let warrenty_date =value[0].warrantytodate
+                        let userwarrenty_product = `<div class="border-3 border-start my-3 order-cards ps-4 rounded-0" id='order-cards'> <div class="col-md-12 "><b>Warranty For :</b> ${value[0].itemname}</div><div class="row align-items-center"> <div class=col-md-12>  <div class="col-md-6 my-2"><span>Serail NO :</span> <span class="fs-9 text-secondary serial_no_warrantynumber">${value[0].serialno}</span> </div><div class="col-md-6 my-2"><span> Warrenty Expiry Date :</span> <span class=" fs-9 text-secondary rounded-2 warrenty_date">${value[0].warrantytodate}</span> </div><div class="my-2 col-md-6"><span> Warranty Start Date :</span> <span class="fs-9 text-secondary purchase_date">${value[0].warrantyfromdate}</span> </div><div class="col-md-6 my-2"> <span> Warranty Status : </span><span class="bg-success btn fs-9 is_warranty_enable py-0 text-white"> ${value[0].warrantyenabled}</span> </div></div></div></div>`;
+                       let is_warranty_enable=value[0].warrantyenabled
+               
+                       $(".user_Warranty_details").html(userwarrenty_product);
+                       if(is_warranty_enable == true){
+                       $('.is_warranty_enable').text('Activated')
+                       }
+                       else{
+                        $('.is_warranty_enable').text('Not Activated')
+                       }
+                       if(warrenty_date == "" ){
+                        $('.warrenty_date').addClass('d-none')
+                       }
+                       else{
+                        $('.warrenty_date').removeClass('d-none')
+                       }
+                       $('#Add_serial_number_inp').addClass('border-success')
+                       $('.error_serial_num').addClass('d-none')
+                        // $('.warranty_productform').addClass('d-none');
+                        $('.add_serialNum').removeClass('d-none');
+                        //Command: toastr["success"]("Warranty already enabled !")
+                   
+                }
+                
+            }
+
+        })
+        
+
+    }
+}
+else{
+    if(serial_no_inp == ''){
+        $('#Add_serial_number_inp').addClass('border-danger')
+        $('.error_serial_num').removeClass('d-none')
+    }
+    else if(phonenumber_inp == ''){
+        $('#Add_phonenumber_inp').addClass('border-danger');
+        $('.error_phonenumber').removeClass('d-none');
+        
+
+    }
+}
+})
+async function warrentyService(Warrentypayload) {
+    //       let d = new Date();
+    //     // let  strDate = d.getFullYear() + "-" + (d.getMonth() + 1) + "-" + d.getDate();
+    //     let  strDate =  new Date().toISOString().slice(0, 10)
+    // console.log(strDate)
+   
+    const res = await postAPIServiceWarranty(`apis/v4/bizgaze/transact/items/savewarrantyasync`, Warrentypayload);
+    
+    console.log(res)
+  if (res.data.status == 2) {
+    //   $('.warranty_productform').addClass('d-none');
+    //   $('.add_serialNum').removeClass('d-none');
+        // Command: toastr["warning"](res.data.message)
+        // toasterOpts();
+        $(".user_Warranty_details").html(`<div class="text-warning text-center"><h2>No Serial number found / Product not Delivered</h2>`);
+
+    }
+    else if(res.data.status == '0'){
+        // $('.warranty_productform').addClass('d-none');
+        // $('.add_serialNum').removeClass('d-none');
+        // Command: toastr["success"](res.data.message);
+        // toasterOpts();
+        $(".user_Warranty_details").html(`<div class="text-danger text-center"><h2>${res.data.message}</h2>`);
+ }
+}
+// function toasterOpts() {
+//     toastr.options = {
+//         "closeButton": true,
+//         "debug": false,
+//         "newestOnTop": true,
+//         "progressBar": true,
+//         "positionClass": "toast-top-center",
+//         "preventDuplicates": true,
+//         "showDuration": "300",
+//         "hideDuration": "1000",
+//         "timeOut": "3000",
+//         "extendedTimeOut": "1000",
+//         "showEasing": "swing",
+//         "hideEasing": "linear",
+//         "showMethod": "fadeIn",
+//         "hideMethod": "fadeOut"
+//     }
+// }
+}

dist/js/myaccount/orderdetails.js

@@ -0,0 +1,171 @@
+async function bindOrderDetails() {
+  let user_number = $('.User_phoneum').text();
+  // validatesession()
+
+  let cookieRes = COOKIE_HELPER_ACTIONS.getCookie();
+  let { userId } = cookieRes;
+  //let userId = '106631380000048';
+
+  console.log(cookieRes);
+  let port = SERVERNAME;
+  // let port = "http://localhost:3088";
+  let url = `${port}/apis/v4/Bizgaze/integrations/products/salesorderdetailsbyorgid/organizationid/${userId}`;
+  // /apis/v4/bizgaze/integrations/products/salesorderdetailsbyorgid/phonenumber/
+  // https://anwi.bizgaze.app/apis/v4/Bizgaze/integrations/products/salesorderdetailsbyorgid/organizationid/{organizationid}
+  const config = {
+    url,
+    method: "get",
+    headers: {
+      'Authorization': `stat ${STAT} `,
+      'Content-Type': 'application/json'
+    }
+  };
+
+  let res = await axios(config);
+  if (res.data.result == '[]' || res.data.result === null) {
+    $(".user_order_details").append(`<div><h6 class="text-center">No orders Found</h6></div>`);
+    return;
+  }
+  const orderDetailsres = JSON.parse(res.data.result);
+  console.log(orderDetailsres,"order");
+  let new_arrr = orderDetailsres;
+  console.log(new_arrr);
+  $(".user_order_details").html(``)
+  console.log('hello')
+  let user_order_details = ``;
+  let order_itemTotal = '';
+  let order_netTotal = '';
+  let order_quantity = '';
+  let order_taxAmount = '';
+
+  for (let i = 0; i < new_arrr.length; i++) {
+    let current = new_arrr[i]
+    console.log(current);
+    let updatedCurent_total = current.nettotal.toLocaleString()
+    order_itemTotal = current.itemtotal;
+    order_netTotal = current.nettotal;
+    order_quantity = current.Quantity;
+    order_taxAmount = current.taxamount;
+    user_order_details += `<div href="" class="order_details_main_container">
+  <div class="border-3 mb-3 card">
+    <div class="text-dark card-body px-0 pt-0">
+      <div class="d-none">
+        <span class="order_itemTotal">${order_itemTotal}</span>
+        <span class="order_netTotal">${order_netTotal}</span>
+        <span class="order_tax">${order_taxAmount}</span>
+        <span class="order_qty">${order_quantity}</span>
+      </div>
+      <div class="bg-gray-4 p-2 m-0 border-bottom">
+      <p class="m-0 fw-600 text-secondary">ORDER NO: <span class="text-blue fs-9 serial_no serial_no_btn "><u class="cursor-pointer">${current.OrderNo}</u></span>
+      </p>
+    </div>
+      <div class="bg-gray-4 p-2 row g-0">
+        <div class="col-md-6 ">
+          <div class="d-flex justify-content-between align-items-center">
+            <div>
+              <p class="mb-1">ORDER PLACED</p>
+              <p class="mb-1 fw-500 order_date">${current.OrderDate}</p>
+            </div>
+            <div>
+              <p class="mb-1"> TOTAL</p>
+              <p class="mb-1 fw-500 Current_netTotal"> ₹${updatedCurent_total}</p>
+            </div>
+            <div>
+              <p class="mb-1">Delivered TO </p>
+              <p class="mb-1 fw-500">${current.OrganizationName}</p>
+            </div>
+          </div>
+        </div>
+        <div class="col-md-4 ms-auto">
+       
+          <div class="d-flex justify-content-between">
+         <div>
+         <p class="mb-1 text-info fw-500"> View order details </p>
+         
+         </div>
+           <div>
+           <p class="mb-0 text-info fw-500 text-center">Invoice</p>
+           <p class="mb-1 fw-500 d-flex gap-2 pt-1">
+          <span data-invoiceid="${current.invoiceid}" class="invoicedownload w-100 cursor-pointer bg-white rounded p-1 d-flex align-items-center justify-content-around">  <i  class="fa-solid fa-file-invoice p-1 "></i></span>
+         
+           </p>
+           </div>
+          </div>
+        </div>
+      </div>
+      <div class="border-0 card rounded-0 order-cards py-3">
+        <div class="d-flex flex-wrap px-2 align-items-center text-center">
+          <div class="col-md-3">
+            <img src="https://appassets.bizgaze.app/${current.imageurl}" class="img-fluid w-75 order_item_name" />
+          </div>
+          <div class="col-md-9">
+            <div class="row align-items-center">
+              <div class="col-md-8">
+                <div class="order_item_name">${current.itemname}</div>
+              </div>
+              <div class="col-md-4">
+                <button type="button" class="btn btn-sm rounded order_details_btn  bg-gradient-anwi-outline py-0 mb-3" onClick="event.preventDefault();">Track Package</button>
+                <button type="button" class="btn btn-sm btn-light rounded order_details_btn py-0 mb-3 shadow-sm" onClick="event.preventDefault();">Cancel Item</button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>`;
+  }
+  $(".user_order_details").append(user_order_details);
+  $('.serial_no_btn').click(function () {
+    // order_details_main_container
+    let current_serial_no = $(this).text();
+    //  window.localStorage.setItem('orderDate',current_order_date);
+    //  window.localStorage.setItem('orderSerialno',current_serial_no);
+    //  window.localStorage.setItem('Userphonenumber',user_number);
+    // $(this).attr('href', `./orderdetails.html#${current_serial_no}`);
+
+    window.location.href = `/orderdetails.html#${current_serial_no}`;
+  });
+
+  $('.invoicedownload').off('click').click(async function (e){
+    let invoiceId = $(this).data('invoiceid');
+    console.log(invoiceId);
+    $(this).html(`<div style="width:15px;height:15px" class="spinner-border" role="status">
+    <span class="sr-only">Loading...</span>
+  </div>`)
+    let res = await API_SERVICES_ACTIONS.postAPIService(`apis/v4/unibase/platform/templates/generatetemplatepdf/printprovideruniquekey/Bizgaze_Extension_Transact_Transact_PrintProvider_InvoicePrint/pkid/${invoiceId}`);
+
+    if(res.isError){
+      toasterHelper(`error`,err.errorMsg,`toast-top-right`);
+      return;
+    }
+
+    res=JSON.parse(res.response.result);
+    let {FilePath:fileLink} = res;
+    let link = buildLinkWithServerName(fileLink);
+    console.log(link);
+    window.open(link, "_blank");
+
+    $(this).html(`<i  class="fa-solid fa-file-invoice p-1 "></i>`)
+    
+  });
+}
+function toasterOpts() {
+  toastr.options = {
+    "closeButton": true,
+    "debug": false,
+    "newestOnTop": true,
+    "progressBar": true,
+    "positionClass": "toast-top-center",
+    "preventDuplicates": true,
+    "onclick": null,
+    "showDuration": "300",
+    "hideDuration": "1000",
+    "timeOut": "5000",
+    "extendedTimeOut": "1000",
+    "showEasing": "swing",
+    "hideEasing": "linear",
+    "showMethod": "fadeIn",
+    "hideMethod": "fadeOut"
+  }
+}

dist/js/myaccount/support_tickets.js

@@ -0,0 +1,79 @@
+function supportTicketMain() {
+    // https://qa.anwisystems.com/apis/v4/anwisystems/integrations/products/getticket/contactid/{contactid}
+    let cookieRes = COOKIE_HELPER_ACTIONS.getCookie();
+    let { userId } = cookieRes;
+    init()
+    function init() {
+        getTickets();
+    };
+
+    async function getTickets() {
+        let res = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/anwisystems/integrations/products/getticket/contactid/${userId}`);
+
+        if (res.isError) {
+            toasterHelper("error", res.errorMsg);
+            return;
+        }
+
+        res = JSON.parse(res.response.result);
+
+        if (!res.length) {
+            $('.nosupportticket').removeClass('d-none');
+            $('.headersupportlist').addClass('d-none');
+            return;
+        } else {
+            $('.nosupportticket').addClass('d-none');
+            $('.headersupportlist').removeClass('d-none');
+        }
+
+        let supportHTMLTicketList = '';
+
+        debugger
+        for (let i = 0; i < res.length; i++) {
+            supportHTMLTicketList += getTicketHTML(res[i]);
+        }
+
+        $('.support-list-container').html(supportHTMLTicketList);
+
+
+        console.log(res, "support");
+
+
+    }
+
+
+    function getTicketHTML(ticket) {
+        let color = '';
+        let prioityName = ticket[`Priority Name`];
+        if (prioityName.toLowerCase() === 'low') {
+            color = 'info';
+        } else if (prioityName.toLowerCase() === 'high') {
+            color = 'danger';
+        } else {
+            color = 'warning';
+        }
+
+
+
+        //<a href="#" data-bs-toggle="modal" data-bs-target="#supportmodalticket" class="supportlistview d-block
+        return `<a href="supportticket.html?ticketno=${ticket[`ticketno`]}"  class="supportlistview d-block    bg-gradient-anwi-outline btn-sm btn "><div class="p-2"><div class="card p-2">
+    <div class="row ">
+    <div class="col-sm-3">
+        ${ticket[`Raised Date`]}
+    </div>
+    <div class="col-sm-3">
+
+        ${ticket[`ticketno`]}
+    </div>
+    <div class="col-sm-3 text-center">
+   
+        ${ticket[`Stage Name`]}
+    </div>
+    <div class="col-sm-3 text-center">
+      
+       <span class="badge  badge-${color} text-bg-${color}">${prioityName}</span>
+    </div>
+</div>
+    </div></div> </a>`;
+    }
+}

dist/js/navbar.js

@@ -0,0 +1,644 @@
+navINIT();
+
+function navINIT() {
+
+
+
+   
+
+    async function getAllProdouctsIds(){
+        let res = await API_SERVICES_ACTIONS.getAPIService('apis/v4/bizgaze/integrations/products/getallproducts',true);
+        if(res.isError){
+            alert(res.errorMsg);
+            return;
+        }
+
+        res = JSON.parse(res.response.result);
+    
+        for(let i=0;i<res.length;i++){
+            let curr = res[i];
+            let productname = curr.productname;
+            let id = curr.productid;
+            
+            // ACCESSORIES
+            switch (productname) {
+                case 'Zeno Sleekbook':
+                    appendIdNav('zenosleekbook',id);
+                    break;
+                case 'Zeno Dualbook':
+                    appendIdNav('zenodualbook',id);
+                    break;
+                case "FYRO Flagship":
+                    appendIdNav('fyroflagship',id);
+                    break;
+                case "AIO Fyro":
+                    // appendIdNav('fyroaio',id);
+                    break;
+                case "AIO Zeno":
+                    // appendIdNav('zenoaio',id);
+                default:
+                    break;
+            }
+        }
+    }
+
+    function appendIdNav(className,id){
+        let html = $(`.${className}`).attr('href');
+        const pattern = /{[^}]+}/g;
+        const replacedString = html.replace(pattern, id);
+        $(`.${className}`).parents('.nav-tab-show').removeClass('d-none')
+        $(`.${className}`).attr('href',replacedString);
+    }
+    
+    if(!window.location.href.includes('orderconfirmation')&&!window.location.href.includes('/w/')){
+        loadCart();
+        
+    }
+   
+    function loadHelper(src = './dist/js/utils/helpers.js'){
+        if ($(`script[src="${src}"]`).length > 0) {
+          return new Promise((resolve) => resolve());
+        }
+        return new Promise(function (resolve, reject) {
+            var s;
+            s = document.createElement('script');
+            s.src = src;
+            s.onload = resolve;
+            s.onerror = reject;
+            document.head.appendChild(s);
+        });
+    }
+    async function loadCart(){
+
+        if(!window.location.href.includes('services/paymentmethod.html')){
+            let files = ['./dist/js/shoppingcart/addtocart.js'];
+            await loadHelper();
+            for(let i=0;i<files.length;i++){
+                if ($(`script[src="${files[i]}"]`).length > 0) {
+                    continue;
+                }
+                try {
+            
+                    await loadHelper(files[i])
+                    console.log("done");
+    
+                } catch (error) {
+                    console.log(error);
+                    return;
+                }
+            }
+        }
+
+         setLengthCart();
+         getAllProdouctsIds();
+        //console.log("hello");
+
+        
+        
+      
+    }
+    let URLNAMENAV = window.location.href;
+    const isTransparent = URLNAMENAV.includes('login')||URLNAMENAV.includes('orderconfirmation')|| URLNAMENAV.includes('services/paymentmethod.html');
+   
+    let nav_html = `
+<header class="header-area section-padding-1 transparent-bar" ${isTransparent ?'style="background:#000"' :''}>
+            <div class="header-large-device">
+                <div class="header-bottom sticky-bar">
+                    <div class="container">
+                        <div class="header-bottom-flex">
+                            <div class="logo-menu-wrap d-flex gap-5">
+                                <div class="logo">
+                                    <a href="../index.html">
+                                        <img src="/dist/assets/imgs/anwi-logo-2.png" alt="logo" class="nav_logo">
+                                    </a>
+                                </div>
+                                <div class="main-menu menu-lh-1 main-menu-padding-1">
+                                    <nav>
+                                        <ul class="mb-0 p-0">
+                                        <li class="hover_tab_1">
+                                            <a href="/laptops.html" class="satoshi_font">LAPTOPS
+                                                <svg style="width:18px;height:15px" viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg">
+                                                    <path fill="#fff" d="M1395 736q0 13-10 23l-466 466q-10 10-23 10t-23-10l-466-466q-10-10-10-23t10-23l50-50q10-10 23-10t23 10l393 393 393-393q10-10 23-10t23 10l50 50q10 10 10 23z"/>
+                                                </svg>
+                                            </a>
+                                        <ul class="pb-3" style="list-style:none">
+                                            <li>
+                                                <div class="d-flex gap-4r pt-4 pb-2 align-items-center justify-content-center">
+                                                    <div class="position-relative nav-tab-show  d-none">
+                                                        <a class="h-100 nav_items zenosleekbook" href="/laptopdetails.html?Zeno#productId={106633230000029}">
+                                                            <div  style="" class="align-items-center cursor-pointer d-flex flex-column h-100 justify-content-center rounded-3">
+                                                                <img src="https://appassets.bizgaze.app/_files/documents/663/cfed4b55-9c51-48a8-969f-2d443fdb9bac/15%20inch.png" alt="ora img" class="nav_imgs"/>
+                                                                <p  class="mb-0 text-center text-dark w-100">Zeno Sleekbook </p>
+                                                            </div>
+                                                        </a>
+                                                    </div>
+                                                    <div class="position-relative nav-tab-show  d-none">
+                                                        <a class="h-100 nav_items fyroflagship" href="/laptopdetails.html?Fyro#productId={106633230000031}">
+                                                            <div  style="" class=" align-items-center cursor-pointer d-flex flex-column h-100 justify-content-center rounded-3">
+                                                                <img src="https://appassets.bizgaze.app/_files/documents/663/39d3ec7f-c692-4489-a808-60d79c0ffcb1/17%20inches.png" alt="ora img" class="nav_imgs"/>
+                                                                <p  class="mb-0 text-center text-dark w-100">Fyro Flagship </p>
+                                                            </div>
+                                                        </a>
+                                                    </div>
+                                                    <div class="position-relative nav-tab-show  d-none">
+                                                    <a class="h-100 nav_items zenodualbook" href="/laptopdetails.html?Zeno#productId={106633230000030}">
+                                                        <div  style="" class=" align-items-center cursor-pointer d-flex flex-column h-100 justify-content-center rounded-3">
+                                                            <img src="https://appassets.bizgaze.app/_files/documents/663/3feb2ad5-7451-4cd5-ba7a-f6695e1fa708/zeno_dualbook.png" alt="ora img" class="nav_imgs"/>
+                                                            <p  class="mb-0 text-center text-dark w-100">Zeno Dual Book </p>
+                                                        </div>
+                                                    </a>
+                                                </div>
+                                                </div>
+                                            </li>
+                                        </ul>
+                                    </li>
+                                    <li class="hover_tab_2">
+                                        <a href="/allinones.html" class="satoshi_font">ALL IN ONES
+                                            <svg style="width:18px;height:15px;" viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg">
+                                                <path fill="#fff" d="M1395 736q0 13-10 23l-466 466q-10 10-23 10t-23-10l-466-466q-10-10-10-23t10-23l50-50q10-10 23-10t23 10l393 393 393-393q10-10 23-10t23 10l50 50q10 10 10 23z"/>
+                                            </svg>
+                                        </a>
+                                    <ul class="pb-3" style="list-style:none">
+                                        <li>
+                                            <div class="d-flex gap-4r pt-4 pb-2 align-items-center justify-content-center">
+                                                <div class="position-relative  nav-tab-show">
+                                                    <a class="h-100 nav_items zenoaio" href="/laptopdetails.html?AIO Zeno#productId=106633230000026#itemid=106633240000112">
+                                                        <div  style="" class="align-items-center cursor-pointer d-flex flex-column h-100 justify-content-center rounded-3">
+                                                            <img src="https://appassets.bizgaze.app/_files/documents/663/42bdf033-74fb-45ca-b180-9bff7a0dca86/zeno_aio.png" alt="ora img" class="nav_imgs"/>
+                                                            <p  class="mb-0 text-center text-dark w-100">Zeno All in ones</p>
+                                                        </div>
+                                                    </a>
+                                                </div>
+                                                <div class="position-relative  nav-tab-show">
+                                                    <a class="h-100 nav_items" href="/laptopdetails.html?AIO Fyro#productId=106633230000027#itemid=106633240000126">
+                                                        <div  style="" class=" align-items-center cursor-pointer d-flex flex-column h-100 justify-content-center rounded-3">
+                                                            <img src="https://appassets.bizgaze.app/_files/documents/663/39e90b38-3d04-4f88-bff4-2b6feb3eb54c/Asset%204@2x.png" alt="ora img" class="nav_imgs"/>
+                                                            <p  class="mb-0 text-center text-dark w-100">Fyro All in ones </p>
+                                                        </div>
+                                                    </a>
+                                                </div>
+                                            </div>
+                                        </li>
+                                    </ul>
+                                    </li>
+                                    <li class="hover_tab_2">
+                                        <a href="/accessories.html" class="satoshi_font">ACCESSORIES
+                                            <svg style="width:18px;height:15px;" viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg">
+                                                <path fill="#fff" d="M1395 736q0 13-10 23l-466 466q-10 10-23 10t-23-10l-466-466q-10-10-10-23t10-23l50-50q10-10 23-10t23 10l393 393 393-393q10-10 23-10t23 10l50 50q10 10 10 23z"/>
+                                            </svg>
+                                        </a>
+                                        <ul class="pb-3" style="list-style:none">
+                                        <li>
+                                            <div class="d-flex gap-4r pt-4 pb-2 align-items-center justify-content-center">
+                                                <div class="position-relative  nav-tab-show_acc">
+                                                    <a class="h-100 nav_items" href="/storageproducts.html">
+                                                        <div  style="" class="align-items-center cursor-pointer d-flex flex-column h-100 justify-content-center rounded-3">
+                                                            <img src="https://appassets.bizgaze.app/_files/documents/663/c3ea1dde-6c5b-4169-922b-97c297c55737/Ora4%20SSD%202TB%20copy.png" alt="ora img" class="nav_imgs"/>
+                                                            <p  class="mb-0 text-center text-dark w-100">Storage</p>
+                                                        </div>
+                                                    </a>
+                                                </div>
+                                                <div class="position-relative  nav-tab-show_acc">
+                                                    <a class="h-100 nav_items" href="/ramproducts.html">
+                                                        <div  style="" class=" align-items-center cursor-pointer d-flex flex-column h-100 justify-content-center rounded-3">
+                                                            <img src="https://appassets.bizgaze.app/_files/documents/663/9d71f7a4-bf31-4d3c-b120-5de610321dc2/image_2023_05_05T09_12_42_081Z.png" alt="ora img" class="nav_imgs"/>
+                                                            <p  class="mb-0 text-center text-dark w-100">Memory </p>
+                                                        </div>
+                                                    </a>
+                                                </div>
+                                            </div>
+                                        </li>
+                                    </ul>
+                                    </li>
+                                    <!-- 
+                                    <li><a href="./storageproducts.html" class="satoshi_font">STORAGE</a></li>
+                                    <li><a href="./ramproducts.html" class="satoshi_font">MEMORY</a></li> -->
+                                            <li><a href="./support.html" class="satoshi_font">SUPPORT</a></li>
+                                            <li><a href="./press.html" class="satoshi_font">PRESS</a></li>
+                                            <li><a href="./contact.html" class="satoshi_font">CONTACT</a></li>
+                                            <li class="d-none"><a href="#" class="satoshi_font product_data" item_id="106633220000002">ACCESSORIES</a></li>
+                                        </ul>
+                                    </nav>
+                                </div>
+                            </div>
+                            <div class="header-action-wrap header-action-flex header-action-width header-action-mrg-1">
+                                <div class="same-style">
+                                <a href="/myaccount.html" class="my_avatar">
+                                <svg class="user-icon" width="25" height="25" viewBox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+                                    <g clip-path="url(#clip0)">
+                                        <path d="M21.4443 24.3665H19.4443V19.3235C19.4435 18.5395 19.1317 17.7879 18.5774 17.2335C18.023 16.6791 17.2713 16.3673 16.4873 16.3665H8.40134C7.61733 16.3673 6.86567 16.6791 6.3113 17.2335C5.75693 17.7879 5.44513 18.5395 5.44434 19.3235V24.3665H3.44434V19.3235C3.44592 18.0093 3.96869 16.7494 4.89796 15.8201C5.82723 14.8909 7.08714 14.3681 8.40134 14.3665H16.4873C17.8015 14.3681 19.0614 14.8909 19.9907 15.8201C20.92 16.7494 21.4427 18.0093 21.4443 19.3235V24.3665Z" fill="#fff"/>
+                                        <path d="M12.4443 12.3665C11.2577 12.3665 10.0976 12.0146 9.11092 11.3553C8.12422 10.696 7.35519 9.75898 6.90106 8.66262C6.44694 7.56626 6.32812 6.35986 6.55963 5.19598C6.79114 4.03209 7.36258 2.96299 8.2017 2.12388C9.04081 1.28476 10.1099 0.713318 11.2738 0.481807C12.4377 0.250296 13.6441 0.369116 14.7404 0.823242C15.8368 1.27737 16.7739 2.0464 17.4332 3.0331C18.0924 4.01979 18.4443 5.17983 18.4443 6.36652C18.4427 7.95733 17.8101 9.48253 16.6852 10.6074C15.5604 11.7323 14.0352 12.3649 12.4443 12.3665ZM12.4443 2.36652C11.6532 2.36652 10.8799 2.60111 10.2221 3.04064C9.56426 3.48017 9.05157 4.10488 8.74882 4.83579C8.44607 5.56669 8.36686 6.37096 8.5212 7.14688C8.67554 7.9228 9.0565 8.63554 9.61591 9.19495C10.1753 9.75436 10.8881 10.1353 11.664 10.2897C12.4399 10.444 13.2442 10.3648 13.9751 10.062C14.706 9.75929 15.3307 9.2466 15.7702 8.5888C16.2097 7.931 16.4443 7.15764 16.4443 6.36652C16.4443 5.30565 16.0229 4.28824 15.2728 3.53809C14.5226 2.78795 13.5052 2.36652 12.4443 2.36652Z" fill="#fff"/>
+                                    </g>
+                                    <defs>
+                                        <clipPath id="clip0">
+                                            <rect width="24" height="24" fill="white" transform="translate(0.444336 0.366516)"/>
+                                        </clipPath>
+                                    </defs>
+                                </svg>
+                                </a>
+                                </div>
+                                <div class="same-style header-cart">
+                                <a class="cart-active1 position-relative" href="/shopping-cart.html">
+                                <svg class="cart_icon" width="25" height="25" viewBox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+                                    <g clip-path="url(#clip0)">
+                                        <path d="M24.4941 3.36652H4.73614L4.69414 3.01552C4.60819 2.28593 4.25753 1.61325 3.70863 1.12499C3.15974 0.636739 2.45077 0.366858 1.71614 0.366516L0.494141 0.366516V2.36652H1.71614C1.96107 2.36655 2.19748 2.45647 2.38051 2.61923C2.56355 2.78199 2.68048 3.00626 2.70914 3.24952L4.29414 16.7175C4.38009 17.4471 4.73076 18.1198 5.27965 18.608C5.82855 19.0963 6.53751 19.3662 7.27214 19.3665H20.4941V17.3665H7.27214C7.02705 17.3665 6.79052 17.2764 6.60747 17.1134C6.42441 16.9505 6.30757 16.7259 6.27914 16.4825L6.14814 15.3665H22.3301L24.4941 3.36652ZM20.6581 13.3665H5.91314L4.97214 5.36652H22.1011L20.6581 13.3665Z" fill="#fff"/>
+                                        <path d="M7.49414 24.3665C8.59871 24.3665 9.49414 23.4711 9.49414 22.3665C9.49414 21.2619 8.59871 20.3665 7.49414 20.3665C6.38957 20.3665 5.49414 21.2619 5.49414 22.3665C5.49414 23.4711 6.38957 24.3665 7.49414 24.3665Z" fill="#fff"/>
+                                        <path d="M17.4941 24.3665C18.5987 24.3665 19.4941 23.4711 19.4941 22.3665C19.4941 21.2619 18.5987 20.3665 17.4941 20.3665C16.3896 20.3665 15.4941 21.2619 15.4941 22.3665C15.4941 23.4711 16.3896 24.3665 17.4941 24.3665Z" fill="#fff"/>
+                                    </g>
+                                    <defs>
+                                        <clipPath id="clip0">
+                                            <rect width="24" height="24" fill="white" transform="translate(0.494141 0.366516)"/>
+                                        </clipPath>
+                                    </defs>
+                                </svg>
+                                <span class="position-absolute cartnumcount d-none" >0</span>
+                                </a>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="sub_nav_container bg-white d-none border-top" style="
+                        box-shadow: 0 6PX 16PX 0 #1919190f;
+                        -webkit-backdrop-filter: blur(6px);
+                        backdrop-filter: blur(6px);">
+                        <div class="container">
+                            <div class="d-flex justify-content-between">
+                           <span class="d-flex align-items-center font-weight-600">
+                           <h2 class="titleproductnav sub_nav_item me-3 fs-9"></h2></span>
+                                <ul class="d-flex mb-0 py-3  justify-content-center align-items-center" style="list-style:none;">
+                                    <li>
+                                        <a data-overview="#${window.location.href.includes('Zeno')?'overview_data_zeno':'overview_data_fyro'}" class="sub_nav_item overview me-3 fs-9">Overview</a>
+                                    </li>
+                                    <li>
+                                        <a data-spec="true" class="sub_nav_item me-3 fs-9 overviewspecs">Specifications</a>
+                                    </li>
+                                    <li>
+                                        <a href="#"  class="font-12p btn btn-dark button_dark sub_nav_item text-white">Buy now</a>
+                                    </li>
+                                </ul>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="header-small-device header-small-ptb sticky-bar py-md-2 py-2 bg-white">
+                <div class="container-fluid px-4">
+                    <div class="row align-items-center">
+                        <div class="col-6 header-action-wrap">
+                            <div class="d-flex">
+                                <div class="same-style header-info">
+                                    <button class="mobile-menu-button-active">
+                                        <span class="info-width-1"></span>
+                                        <span class="info-width-2"></span>
+                                        <span class="info-width-3"></span>
+                                    </button>
+                                </div>
+                                <div class="mobile-logo mobile-logo-width ps-3">
+                                    <a href="../index.html">
+                                        <img alt="" src="/dist/assets/imgs/anwi-logo-1.png" class="w-50">
+                                    </a>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-6">
+                            <div class="header-action-wrap header-action-flex header-action-mrg-1">
+                                <div class="same-style">
+                                <a href="/myaccount.html" class="my_avatar">
+                                    <svg class="user-icon" width="25" height="25" viewBox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg" data-di-res-id="e576e1a9-2f4a9ed6" data-di-rand="1682677695656">
+                                    <g clip-path="url(#clip0)">
+                                        <path d="M21.4443 24.3665H19.4443V19.3235C19.4435 18.5395 19.1317 17.7879 18.5774 17.2335C18.023 16.6791 17.2713 16.3673 16.4873 16.3665H8.40134C7.61733 16.3673 6.86567 16.6791 6.3113 17.2335C5.75693 17.7879 5.44513 18.5395 5.44434 19.3235V24.3665H3.44434V19.3235C3.44592 18.0093 3.96869 16.7494 4.89796 15.8201C5.82723 14.8909 7.08714 14.3681 8.40134 14.3665H16.4873C17.8015 14.3681 19.0614 14.8909 19.9907 15.8201C20.92 16.7494 21.4427 18.0093 21.4443 19.3235V24.3665Z" fill="#fff"/>
+                                        <path d="M12.4443 12.3665C11.2577 12.3665 10.0976 12.0146 9.11092 11.3553C8.12422 10.696 7.35519 9.75898 6.90106 8.66262C6.44694 7.56626 6.32812 6.35986 6.55963 5.19598C6.79114 4.03209 7.36258 2.96299 8.2017 2.12388C9.04081 1.28476 10.1099 0.713318 11.2738 0.481807C12.4377 0.250296 13.6441 0.369116 14.7404 0.823242C15.8368 1.27737 16.7739 2.0464 17.4332 3.0331C18.0924 4.01979 18.4443 5.17983 18.4443 6.36652C18.4427 7.95733 17.8101 9.48253 16.6852 10.6074C15.5604 11.7323 14.0352 12.3649 12.4443 12.3665ZM12.4443 2.36652C11.6532 2.36652 10.8799 2.60111 10.2221 3.04064C9.56426 3.48017 9.05157 4.10488 8.74882 4.83579C8.44607 5.56669 8.36686 6.37096 8.5212 7.14688C8.67554 7.9228 9.0565 8.63554 9.61591 9.19495C10.1753 9.75436 10.8881 10.1353 11.664 10.2897C12.4399 10.444 13.2442 10.3648 13.9751 10.062C14.706 9.75929 15.3307 9.2466 15.7702 8.5888C16.2097 7.931 16.4443 7.15764 16.4443 6.36652C16.4443 5.30565 16.0229 4.28824 15.2728 3.53809C14.5226 2.78795 13.5052 2.36652 12.4443 2.36652Z" fill="#fff"/>
+                                    </g>
+                                    <defs>
+                                        <clipPath id="clip0">
+                                            <rect width="24" height="24" fill="white" transform="translate(0.444336 0.366516)"/>
+                                        </clipPath>
+                                    </defs>
+                                </svg>
+                                </a>
+                                </div>
+                                <div class="same-style header-cart ms-3">
+                                <a class="cart-active1 position-relative" href="/shopping-cart.html">
+                                <svg class="cart_icon icon" width="25" height="25" viewBox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg" data-di-res-id="e576e1a9-90f52cd9" data-di-rand="1682677695656">
+                                    <g clip-path="url(#clip0)">
+                                        <path d="M24.4941 3.36652H4.73614L4.69414 3.01552C4.60819 2.28593 4.25753 1.61325 3.70863 1.12499C3.15974 0.636739 2.45077 0.366858 1.71614 0.366516L0.494141 0.366516V2.36652H1.71614C1.96107 2.36655 2.19748 2.45647 2.38051 2.61923C2.56355 2.78199 2.68048 3.00626 2.70914 3.24952L4.29414 16.7175C4.38009 17.4471 4.73076 18.1198 5.27965 18.608C5.82855 19.0963 6.53751 19.3662 7.27214 19.3665H20.4941V17.3665H7.27214C7.02705 17.3665 6.79052 17.2764 6.60747 17.1134C6.42441 16.9505 6.30757 16.7259 6.27914 16.4825L6.14814 15.3665H22.3301L24.4941 3.36652ZM20.6581 13.3665H5.91314L4.97214 5.36652H22.1011L20.6581 13.3665Z" fill="#fff"/>
+                                        <path d="M7.49414 24.3665C8.59871 24.3665 9.49414 23.4711 9.49414 22.3665C9.49414 21.2619 8.59871 20.3665 7.49414 20.3665C6.38957 20.3665 5.49414 21.2619 5.49414 22.3665C5.49414 23.4711 6.38957 24.3665 7.49414 24.3665Z" fill="#fff"/>
+                                        <path d="M17.4941 24.3665C18.5987 24.3665 19.4941 23.4711 19.4941 22.3665C19.4941 21.2619 18.5987 20.3665 17.4941 20.3665C16.3896 20.3665 15.4941 21.2619 15.4941 22.3665C15.4941 23.4711 16.3896 24.3665 17.4941 24.3665Z" fill="#fff"/>
+                                    </g>
+                                    <defs>
+                                        <clipPath id="clip0">
+                                            <rect width="24" height="24" fill="white" transform="translate(0.494141 0.366516)"/>
+                                        </clipPath>
+                                    </defs>
+                                </svg>
+                                <span class="position-absolute cartnumcount d-none"  style="top:-27%;right:-80%">0</span>
+                                </a>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </header>
+        <!-- Mobile menu start -->
+        <div class="mobile-menu-active clickalbe-sidebar-wrapper-style-1">
+            <div class="clickalbe-sidebar-wrap">
+            <div class="row pb-2 border-bottom">
+                <div class="col-6">
+                    <div class="mobile-logo mobile-logo-width">
+                        <a href="../index.html">
+                            <img alt="" src="/dist/assets/imgs/anwi-logo-1.png" class="w-75">
+                        </a>
+                    </div>
+                </div>
+                <div class="col-6 text-end pe-4">
+                    <a class="sidebar-close"><i class="fa-solid fa-xmark"></i></a>
+                </div>
+            </div>
+               
+                <div class="mobile-menu-content-area sidebar-content-100-percent pt-3">
+                    <div class="mobile-search d-none">
+                        <form class="search-form" action="#">
+                            <input type="text" placeholder="Search here…" class="satoshi_font">
+                            <button class="button-search"><i class="fa-solid fa-magnifying-glass"></i></button>
+                        </form>
+                    </div>
+                    <div class="clickable-mainmenu-wrap clickable-mainmenu-style1">
+                        <nav>
+                            <ul class="pl-0">
+                          
+
+                                
+                                <li class="expandlinav">
+                                <div class="d-flex justify-content-between explandlinavnameparent">
+                                    <span class="explandlinavname">LAPTOP</span><span data-name="laptops.html" class=" viewall_li">+</span>
+                                </div>
+                               <div class="content-expandlinav pt-2 d-none">
+                               <a class="h-100 p-1 zenosleekbook" href="/laptopdetails.html?Zeno#productId={106633230000029}">
+                                    <div class="ps-2">
+                                    Zeno Sleekbook
+                                    </div>
+                                </a>
+                                <a class="h-100 p-1 fyroflagship" href="/laptopdetails.html?Fyro#productId={106633230000031}">
+                                    <div class="ps-2">Fyro Flagship  </div>
+                                    </a>
+                                    <a class="h-100 p-1 zenodualbook" href="/laptopdetails.html?Zeno#productId={106633230000030}">
+                                    <div class="ps-2">Zeno Dual Book   </div>
+                                    </a>
+                               </div>
+                                </li>
+                                <li class="expandlinav">
+                                <div class="d-flex justify-content-between explandlinavnameparent">
+                                    <span class="explandlinavname">ALL IN ONES </span><span  data-name="allinones.html" class="viewall_li">+</span>
+                                </div>
+                               <div class="content-expandlinav pt-2 d-none">
+                               <a class="h-100 p-1" href="/laptopdetails.html?AIO Zeno#productId=106633230000026#itemid=106633240000112">
+                                    <div class="ps-2">
+                                    Zeno All In One
+                                    </div>
+                                    </a>
+                                    <a class="h-100 p-1" href="/laptopdetails.html?AIO Fyro#productId=106633230000027#itemid=106633240000126">
+                                    <div class="ps-2">
+                                    Fyro All iIn One
+                                    </div>
+                                    </a>
+                               </div>
+                                </li>
+                                <li class="expandlinav">
+                                 <div class="d-flex justify-content-between explandlinavnameparent">
+                                   <span class="explandlinavname">ACCESSORIES </span><span  data-name="allinones.html" class="viewall_li">+</span>
+                                  </div>
+                                     <div class="content-expandlinav pt-2 d-none">
+                                    <a class="h-100 p-1" href="/storageproducts.html">
+                                     <div class="ps-2">
+                                      Storage
+                                     </div>
+                                      </a>
+                                   <a class="h-100 p-1" href="/ramproducts.html">
+                                  <div class="ps-2">
+                                   Memory
+                                   </div>
+                                  </a>
+                                 </div>
+                                 </li>
+                                 <!-- 
+                                 <li class=""><a href="./ramproducts.html" class="satoshi_font">MEMORY</a></li>
+                                 <li class=""><a href="./storageproducts.html" class="satoshi_font">STORAGE</a></li> -->
+                                <li class=""><a href="./support.html" class="satoshi_font" >SUPPORT</a></li>
+                                <li class=""><a href="./press.html" class="satoshi_font">PRESS</a></li>
+                                <li class=""><a href="./contact.html" class="satoshi_font">CONTACT</a></li>
+                            </ul>
+                        </nav>
+                    </div>
+                    <div class="mobile-curr-lang-wrap d-none">
+                        <div class="single-mobile-curr-lang">
+                            <a class="mobile-language-active" href="#">Language <i class="icofont-simple-down"></i></a>
+                            <div class="lang-curr-dropdown lang-dropdown-active">
+                                <ul>
+                                    <li><a href="#">English</a></li>
+                                    <li><a href="#">Spanish</a></li>
+                                    <li><a href="#">Hindi </a></li>
+                                </ul>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="aside-contact-info d-none">
+                        <ul>
+                            <li><i class="icofont-clock-time"></i>Monday - Friday: 9:00 - 19:00</li>
+                            <li><i class="icofont-envelope"></i>Info@example.com</li>
+                            <li><i class="icofont-stock-mobile"></i>(+55) 254. 254. 254</li>
+                            <li><i class="icofont-home"></i>Helios Tower 75 Tam Trinh Hoang - Ha Noi - Viet Nam</li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+        </div>`;
+    $("#navbar-head").html(nav_html);
+
+    $('.explandlinavnameparent').click(function (e){
+
+        let parentElement = $(e.target).parents('.expandlinav');
+        if($(parentElement).find('.content-expandlinav').hasClass('d-none')){
+            const name = $(parentElement).find('.viewall_li').data('name');
+            $(parentElement).find('.viewall_li').html(`<a href="${name}">view all</a>`);
+            $(parentElement).find('.content-expandlinav').removeClass('d-none');
+           }else{
+            $(parentElement).find('.viewall_li').html('+');
+            $(parentElement).find('.content-expandlinav').addClass('d-none');
+           }
+       
+       console.log($(e.target));
+        
+    });
+
+    let width = $(window).width();
+    $(".menu-negative-mrg2,.menu-negative-mrg3,.menu-negative-mrg4").css("width", width);
+    let ele_page = $("body").hasClass("product_pg");
+    if (ele_page == true) {
+        $(".header-area").removeClass("bg-white");
+        $(".main-menu").find("nav ul li a").addClass("text-white");
+        $(".header-bottom.sticky-bar").removeClass("sticky-bar");
+        let src = `../dist/assets/imgs/anwi-logo-2.png`;
+        $(".logo-menu-wrap").find(".logo a img").attr("src", src);
+        $(".main-body").find("iframe").attr("width", width);
+        if (width <= 575 && width >= 390) {
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 236,
+            })
+        } else if (width <= 390 && width >= 270) {
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 210,
+            });
+        } else if (width <= 998 && width > 575) {
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 530,
+            });
+        } else if (width <= 2720 && width > 2300) {
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 1440,
+            });
+        } else if(width <= 2300 && width > 1921){
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 1132,
+            });
+        }
+        else if(width <= 1920 && width > 1620){
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 1083,
+            });
+        }else {
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 861,
+            });
+        }
+    }
+
+
+    $("a.ram_data").click(function () {
+        let item_id = $(this).attr("accessories_id");
+        let loc_path = '/products.html'
+        if (window.location.pathname.includes(loc_path)) {
+            window.location.href = `?itemid=${item_id}`
+        }
+        else {
+            window.location.href = `/products.html#itemid=${item_id}`;
+        }
+    })
+
+
+    // $(".main-menu nav ul").find("li").each(function () {
+    //     var current = window.location.pathname;
+    //     var $this = $(this).find("a");
+    //     if (current != "/") {
+    //         if ($this.attr('href').indexOf(current) !== -1) {
+    //             $(this).addClass('active_nav');
+    //         }
+    //     }
+
+    // })
+
+    // destroy localstorage data
+    let loc_path = '/productdetails.html';
+    if (window.location.pathname.includes(loc_path) === false) {
+        localStorage.removeItem("product_data");
+        localStorage.removeItem("top_data")
+    }
+    let loc_path1 = '/productcatloguedetails.html';
+    if (window.location.pathname.includes(loc_path1) === false) {
+        localStorage.removeItem("product_catlogue_obj");
+    }
+
+    //services pages links and sources
+
+   
+
+
+
+    let $body_pg = $("body").hasClass("services_page");
+    let $hm_pg = "../index.html";
+    let $nav_img = "../dist/assets/imgs/anwi-logo-1.png";
+    let $footer_img = "../dist/assets/imgs/anwi-logo-2.png";
+    let $scrool_top_img = "../dist/assets/imgs/Home/rocket-footer.png";
+    let $about_pg = $("body").hasClass("about_page");
+    if($about_pg == true){
+        $(".main-menu").find("nav ul li a").addClass("text-dark");
+        let img_src = `./dist/assets/imgs/anwi-logo-1.png`;
+        $(".logo-menu-wrap").find(".logo a img").attr("src",img_src);
+        $(".header-bottom").addClass("sticky-bar stick");
+        $("body.about_page").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#000");
+    }
+    if ($body_pg == true) {
+        $(".header-large-device").find(".logo-menu-wrap .logo").find("a").attr("href", $hm_pg);
+        $(".header-large-device").find(".logo-menu-wrap .logo").find("a img").attr("src", $nav_img);
+        $(".mobile-logo").find("a").attr("href", $hm_pg);
+        $(".mobile-logo").find(".logo a img").attr("src", $nav_img);
+        $("body.services_page").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#000");
+        $(".main-menu").find("nav ul").find("li a").each(function () {
+            $(this).addClass("text-dark")
+            $(".header-bottom").addClass("sticky-bar stick");
+            let $arc = $(this).attr("href");
+            let $spcial_char = $arc.includes("./");
+            if ($spcial_char === true) {
+                let $refarence = `.${$arc}`
+                $(this).attr("href", $refarence);
+            }
+            
+        });
+        $(".same-style").find("a").each(function () {
+            let $arc1 = $(this).attr("href");
+            let $spcial_char1 = $arc1.includes("./");
+            if ($spcial_char1 === true) {
+                let $refarence1 = `.${$arc1}`
+                $(this).attr("href", $refarence1);
+            }
+        })
+        $(".tab-content").find("img").each(function(){
+            let $img_src = $(this).attr("src");
+            let $img_src1 = $img_src.includes("./");
+            if ($img_src1 === true) {
+                let $refarenceimg1 = `.${$img_src}`;
+                $(this).attr("src", $refarenceimg1);
+            }
+        });
+        $(".clickable-mainmenu-wrap").find("nav ul").find("li a").each(function () {
+            let $arc_mbil = $(this).attr("href");
+            let $spcial_char_mbil = $arc_mbil.includes("./");
+            if ($spcial_char_mbil === true) {
+                let $refarence_mbil = `.${$arc_mbil}`
+                $(this).attr("href", $refarence_mbil);
+            }
+        });
+    }
+
+    setTimeout(()=>{
+        if(width<=600){
+            $('.same-style').find('svg path').attr('fill','#000');
+        }
+    },300);
+
+    // overview 
+
+    $('.overview').click(function (e){
+        let name = $(e.target).data('overview');
+        
+        document.querySelector(name)?.scrollIntoView({
+            behavior: 'smooth'
+        });
+        
+    });
+
+    $('.overviewspecs').click(function (e){
+        document.querySelector('#specification_data')?.scrollIntoView({
+            behavior: 'smooth'
+        });
+    });
+
+    
+}

dist/js/navbar2.js

@@ -0,0 +1,487 @@
+navINIT();
+
+function navINIT() {
+    if(!window.location.href.includes('orderconfirmation')&&!window.location.href.includes('/w/')){
+        loadCart();
+    }
+   
+    function loadHelper(src = './dist/js/utils/helpers.js'){
+        if ($(`script[src="${src}"]`).length > 0) {
+          return new Promise((resolve) => resolve());
+        }
+        return new Promise(function (resolve, reject) {
+            var s;
+            s = document.createElement('script');
+            s.src = src;
+            s.onload = resolve;
+            s.onerror = reject;
+            document.head.appendChild(s);
+        });
+    }
+    async function loadCart(){
+
+        if(!window.location.href.includes('services/paymentmethod.html')){
+            let files = ['./dist/js/shoppingcart/addtocart.js'];
+            await loadHelper();
+            for(let i=0;i<files.length;i++){
+                if ($(`script[src="${files[i]}"]`).length > 0) {
+                    continue;
+                }
+                try {
+            
+                    await loadHelper(files[i])
+                    console.log("done");
+    
+                } catch (error) {
+                    console.log(error);
+                    return;
+                }
+            }
+        }
+
+         setLengthCart();
+        //console.log("hello");
+
+        
+        
+      
+    }
+    let URLNAMENAV = window.location.href;
+    const isTransparent = URLNAMENAV.includes('login')||URLNAMENAV.includes('orderconfirmation')|| URLNAMENAV.includes('services/paymentmethod.html');
+    let nav_html = `
+<header class="header-area section-padding-1 transparent-bar" ${isTransparent ?'style="background:#0A1039"' :''}>
+            <div class="header-large-device">
+                <div class="header-bottom sticky-bar">
+                    <div class="container">
+                        <div class="header-bottom-flex">
+                            <div class="logo-menu-wrap d-flex">
+                                <div class="logo">
+                                    <a href="../index.html">
+                                        <img src="/dist/assets/imgs/anwi-logo-2.png" alt="logo" class="w-50">
+                                    </a>
+                                </div>
+                                <div class="main-menu menu-lh-1 main-menu-padding-1">
+                                    <nav>
+                                        <ul class="mb-0 p-0">
+                                        <li class="hover_tab_1"><a href="./storageproducts.html" class="satoshi_font">STORAGE</a>
+                                        <ul class="py-3 px-3 rounded-bottom shadow">
+                                            <li class="d-flex">
+                                                <ul class="nav nav-pills flex-column w-200 border-end" id="experienceTab" role="tablist">
+                                                    <li class="nav-item">
+                                                        <a class="nav-link active text-dark" data-bs-toggle="tab" href="#ora3">ORA 3</a>
+                                                    </li>
+                                                    <li class="nav-item">
+                                                        <a class="nav-link text-dark" data-bs-toggle="tab" href="#ora4">ORA 4</a>
+                                                    </li>
+                                                </ul>
+                                                <ul class="nav w-500">
+                                                    <li>
+                                                    <div class="tab-content">
+                                                        <div id="ora3" class="container tab-pane active">
+                                                            <div class="row">
+                                                                <div class="col-4">
+                                                                    <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                        <img src="./dist/assets/imgs/Navbar/ora3_ram.png" alt="ora img" class=""/>
+                                                                        <p class="fs-7 fw-600 mb-0 text-a-color text-center pb-1">Ora3 M.2 NVMe 512GB</p>
+                                                                    </div>
+                                                                </div>
+                                                                <div class="col-4">
+                                                                    <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                         <img src="./dist/assets/imgs/Navbar/ora3_ram.png" alt="ora img" class=""/>
+                                                                         <p class="fs-7 fw-600 mb-0 text-a-color text-center pb-1">Ora3 M.2 NVMe 1TB</p>
+                                                                    </div>
+                                                                </div>
+                                                                <div class="col-4">
+                                                                    <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                        <img src="./dist/assets/imgs/Navbar/ora3_ram.png" alt="ora img" class=""/>
+                                                                        <p class="fs-7 fw-600 mb-0 text-a-color text-center pb-1">Ora3 M.2 NVMe 2TB</p>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+                                                        </div>
+                                                        <div id="ora4" class="container tab-pane fade">
+                                                            <div class="row">
+                                                                <div class="col-4">
+                                                                    <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                        <img src="./dist/assets/imgs/Navbar/ora3_ram.png" alt="ora img" class=""/>
+                                                                        <p class="fs-7 fw-600 mb-0 text-a-color text-center  pb-1">Ora4 M.2 NVMe 512GB</p>
+                                                                    </div>
+                                                                </div>
+                                                                <div class="col-4">
+                                                                    <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                        <img src="./dist/assets/imgs/Navbar/ora3_ram.png" alt="ora img" class=""/>
+                                                                        <p class="fs-7 fw-600 mb-0 text-a-color text-center  pb-1">Ora4 M.2 NVMe 1TB</p>
+                                                                    </div>
+                                                                </div>
+                                                                <div class="col-4">
+                                                                    <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                        <img src="./dist/assets/imgs/Navbar/ora3_ram.png" alt="ora img" class=""/>
+                                                                        <p class="fs-7 fw-600 mb-0 text-a-color text-center  pb-1">Ora4 M.2 NVMe 2TB</p>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+                                                        </div>
+                                                  </div>
+                                                </li>
+                                                </ul>
+                                            </li>
+                                        </ul>
+                                    </li>
+                                    <li class="hover_tab_2"><a href="./ramproducts.html" class="satoshi_font">MEMORY</a>
+                                    <ul class="py-3 px-3 rounded-bottom shadow">
+                                    <li class="d-flex">
+                                        <ul class="nav nav-pills flex-column w-200 border-end" id="experienceTab" role="tablist">
+                                            <li class="nav-item">
+                                                <a class="nav-link active text-dark" data-bs-toggle="tab" href="#laptop">Laptop</a>
+                                            </li>
+                                            <li class="nav-item">
+                                                <a class="nav-link text-dark" data-bs-toggle="tab" href="#desktop">Desktop</a>
+                                            </li>
+                                        </ul>
+                                        <ul class="nav w-500">
+                                            <li>
+                                            <div class="tab-content">
+                                                <div id="laptop" class="container tab-pane active">
+                                                    <div class="row">
+                                                        <div class="col-4">
+                                                            <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                <img src="./dist/assets/imgs/Navbar/ora_ddr4_laptop.png" alt="ora img" class=""/>
+                                                                <p class="fs-7 fw-600 mb-0 text-a-color text-center pb-1">Ora 8GB DDR5</p>
+                                                            </div>
+                                                        </div>
+                                                        <div class="col-4">
+                                                            <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                 <img src="./dist/assets/imgs/Navbar/ora_ddr5_laptop.png" alt="ora img" class=""/>
+                                                                 <p class="fs-7 fw-600 mb-0 text-a-color text-center  pb-1">Ora 16GB DDR5</p>
+                                                            </div>
+                                                        </div>
+                                                        <div class="col-4 ">
+                                                            <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                 <img src="./dist/assets/imgs/Navbar/ora_ddr5_laptop.png" alt="ora img" class=""/>
+                                                                 <p class="fs-7 fw-600 mb-0 text-a-color text-center  pb-1">Ora 32GB DDR5</p>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                                <div id="desktop" class="container tab-pane fade">
+                                                    <div class="row">
+                                                        <div class="col-4">
+                                                            <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                <img src="./dist/assets/imgs/Navbar/ora_ddr4_desktop.png" alt="ora img" class=""/>
+                                                                <p class="fs-7 fw-600 mb-0 text-a-color text-center  pb-1">Ora 8GB DDR4</p>
+                                                            </div>
+                                                        </div>
+                                                        <div class="col-4">
+                                                            <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                <img src="./dist/assets/imgs/Navbar/ora_ddr4_desktop.png" alt="ora img" class=""/>
+                                                                <p class="fs-7 fw-600 mb-0 text-a-color text-center  pb-1">Ora 16GB DDR4</p>
+                                                            </div>
+                                                        </div>
+                                                        <div class="col-4">
+                                                            <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                 <img src="./dist/assets/imgs/Navbar/ora_ddr4_desktop.png" alt="ora img" class=""/>
+                                                                 <p class="fs-7 fw-600 mb-0 text-a-color text-center  pb-1">Ora 32GB DDR4</p>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                          </div>
+                                        </li>
+                                        </ul>
+                                    </li>
+                                </ul>
+                                    </li>
+                                            <li><a href="./support.html" class="satoshi_font">SUPPORT</a></li>
+                                            <li><a href="./press.html" class="satoshi_font">PRESS</a></li>
+                                            <li><a href="./index1.html" class="satoshi_font">COMING SOON</a></li>
+                                            <li><a href="./contact.html" class="satoshi_font">CONTACT</a></li>
+                                            <li class="d-none"><a href="#" class="satoshi_font product_data" item_id="106633220000002">ACCESSORIES</a></li>
+                                        </ul>
+                                    </nav>
+                                </div>
+                            </div>
+                            <div class="header-action-wrap header-action-flex header-action-width header-action-mrg-1">
+                                <div class="same-style">
+                                <a href="/myaccount.html" class="my_avatar">
+                      
+                                <svg style="width:20px;" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg" focusable="false" aria-hidden="true" class="icon" data-di-res-id="e576e1a9-2f4a9ed6" data-di-rand="1682677695656"><path fill="#fff" d="M48 50c17.346 0 32 14.221 32 31.054V89c0 2.757-2.243 5-5 5H21c-2.757 0-5-2.243-5-5v-7.946C16 64.221 30.654 50 48 50zm0 8c-12.785 0-24 10.773-24 23.054V86h48v-4.946C72 68.773 60.785 58 48 58zm-.002-56c12.133 0 22.003 9.87 22.003 22.001C70 36.131 60.13 46 47.998 46c-12.13 0-21.997-9.869-21.997-21.999C26 11.87 35.867 2 47.998 2zm0 8c-7.718 0-13.997 6.281-13.997 14.001C34 31.72 40.28 38 47.998 38 55.718 38 62 31.72 62 24.001 62 16.281 55.719 10 47.998 10z"></path></svg>
+                                </a>
+                                </div>
+                                <div class="same-style header-cart">
+                                <a class="cart-active1 position-relative" href="/shopping-cart.html">
+                                <svg  style="width:20px;" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg" focusable="false" aria-hidden="true" class="icon" data-di-res-id="e576e1a9-90f52cd9" data-di-rand="1682677695656"><path  fill="#fff"  d="M72.848 70.25c6.075 0 11 4.925 11 11s-4.925 11-11 11-11-4.925-11-11 4.925-11 11-11zm-35 0c6.075 0 11 4.925 11 11s-4.925 11-11 11-11-4.925-11-11c0-6.074 4.926-11 11-11zm35 7a4 4 0 10.002 8.001 4 4 0 00-.002-8.001zm-35 0a4 4 0 100 8 4 4 0 000-8zM13.892 3.75c2.287 0 4.376 1.55 5.058 3.72l.064.22 2.97 11.187h68.128a4.727 4.727 0 014.661 5.786l-.048.2-9.559 36.291c-.583 2.216-2.618 3.842-4.894 3.944l-.228.005H30.06c-2.287 0-4.377-1.55-5.06-3.72l-.063-.219-13.124-49.413-10.7.006-.004-8 12.782-.007zm72.03 23.127H24.108l8.027 30.226H77.96l7.962-30.226z"></path></svg>
+                                
+                                <span class="position-absolute cartnumcount d-none" >0</span>
+                                </a>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="header-small-device header-small-ptb sticky-bar py-md-2 py-2 bg-white">
+                <div class="container-fluid px-4">
+                    <div class="row align-items-center">
+                        <div class="col-6 header-action-wrap">
+                            <div class="d-flex">
+                                <div class="same-style header-info">
+                                    <button class="mobile-menu-button-active">
+                                        <span class="info-width-1"></span>
+                                        <span class="info-width-2"></span>
+                                        <span class="info-width-3"></span>
+                                    </button>
+                                </div>
+                                <div class="mobile-logo mobile-logo-width ps-3">
+                                    <a href="../index.html">
+                                        <img alt="" src="/dist/assets/imgs/anwi-logo-1.png" class="w-50">
+                                    </a>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-6">
+                            <div class="header-action-wrap header-action-flex header-action-mrg-1">
+                                <div class="same-style">
+                                <a href="/myaccount.html" class="my_avatar"> <svg style="width:22px;" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg" focusable="false" aria-hidden="true" class="icon" data-di-res-id="e576e1a9-2f4a9ed6" data-di-rand="1682677695656"><path fill="#fff" d="M48 50c17.346 0 32 14.221 32 31.054V89c0 2.757-2.243 5-5 5H21c-2.757 0-5-2.243-5-5v-7.946C16 64.221 30.654 50 48 50zm0 8c-12.785 0-24 10.773-24 23.054V86h48v-4.946C72 68.773 60.785 58 48 58zm-.002-56c12.133 0 22.003 9.87 22.003 22.001C70 36.131 60.13 46 47.998 46c-12.13 0-21.997-9.869-21.997-21.999C26 11.87 35.867 2 47.998 2zm0 8c-7.718 0-13.997 6.281-13.997 14.001C34 31.72 40.28 38 47.998 38 55.718 38 62 31.72 62 24.001 62 16.281 55.719 10 47.998 10z"></path></svg></a>
+                                </div>
+                                <div class="same-style header-cart">
+                                <a class="cart-active1 position-relative" href="/shopping-cart.html"> <svg  style="width:22px;" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg" focusable="false" aria-hidden="true" class="icon" data-di-res-id="e576e1a9-90f52cd9" data-di-rand="1682677695656"><path  fill="#fff"  d="M72.848 70.25c6.075 0 11 4.925 11 11s-4.925 11-11 11-11-4.925-11-11 4.925-11 11-11zm-35 0c6.075 0 11 4.925 11 11s-4.925 11-11 11-11-4.925-11-11c0-6.074 4.926-11 11-11zm35 7a4 4 0 10.002 8.001 4 4 0 00-.002-8.001zm-35 0a4 4 0 100 8 4 4 0 000-8zM13.892 3.75c2.287 0 4.376 1.55 5.058 3.72l.064.22 2.97 11.187h68.128a4.727 4.727 0 014.661 5.786l-.048.2-9.559 36.291c-.583 2.216-2.618 3.842-4.894 3.944l-.228.005H30.06c-2.287 0-4.377-1.55-5.06-3.72l-.063-.219-13.124-49.413-10.7.006-.004-8 12.782-.007zm72.03 23.127H24.108l8.027 30.226H77.96l7.962-30.226z"></path></svg>
+                                <span class="position-absolute cartnumcount d-none"  style="top:-27%;right:-80%">0</span>
+                                </a>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </header>
+        <!-- Mobile menu start -->
+        <div class="mobile-menu-active clickalbe-sidebar-wrapper-style-1">
+            <div class="clickalbe-sidebar-wrap">
+            <div class="row pb-2 border-bottom">
+                <div class="col-6">
+                    <div class="mobile-logo mobile-logo-width">
+                        <a href="../index.html">
+                            <img alt="" src="/dist/assets/imgs/anwi-logo-1.png" class="w-75">
+                        </a>
+                    </div>
+                </div>
+                <div class="col-6 text-end pe-4">
+                    <a class="sidebar-close"><i class="fa-solid fa-xmark"></i></a>
+                </div>
+            </div>
+               
+                <div class="mobile-menu-content-area sidebar-content-100-percent pt-3">
+                    <div class="mobile-search d-none">
+                        <form class="search-form" action="#">
+                            <input type="text" placeholder="Search here…" class="satoshi_font">
+                            <button class="button-search"><i class="fa-solid fa-magnifying-glass"></i></button>
+                        </form>
+                    </div>
+                    <div class="clickable-mainmenu-wrap clickable-mainmenu-style1">
+                        <nav>
+                            <ul class="pl-0">
+                          
+
+                                <li class=""><a href="./ramproducts.html" class="satoshi_font">RAM</a></li>
+                                <li class=""><a href="./storageproducts.html" class="satoshi_font">STORAGE</a></li>
+                                <li class="expandlinav">
+                                <div class="d-flex justify-content-between">
+                                    <span class="explandlinavname">LAPTOP</span><span class="d-none viewall_li">view all</span>
+                                </div>
+                               <div class="content-expandlinav d-none">
+                               <accordion-element>
+                               <accordion-item title="Accordion Item #1">
+                                 <p>Lorem ipsum dolor sit amet,.</p>
+                               </accordion-item>
+                               <accordion-item title="Accordion Item #2">
+                                 <p>Lorem ipsum dolor sit amet,.</p>
+                               </accordion-item>
+                               <accordion-item title="Accordion Item #3">
+                                 <p>Lorem ipsum dolor sit amet,</p>
+                               </accordion-item>
+                             </accordion-element>
+                               </div>
+                                </li>
+                                <li class=""><a href="./support.html" class="satoshi_font" >SUPPORT</a></li>
+                                <li class=""><a href="./press.html" class="satoshi_font">PRESS</a></li>
+                                <li class=""><a href="./index1.html" class="satoshi_font">COMING SOON</a></li>
+                                <li class=""><a href="./contact.html" class="satoshi_font">CONTACT</a></li>
+                            </ul>
+                        </nav>
+                    </div>
+                    <div class="mobile-curr-lang-wrap d-none">
+                        <div class="single-mobile-curr-lang">
+                            <a class="mobile-language-active" href="#">Language <i class="icofont-simple-down"></i></a>
+                            <div class="lang-curr-dropdown lang-dropdown-active">
+                                <ul>
+                                    <li><a href="#">English</a></li>
+                                    <li><a href="#">Spanish</a></li>
+                                    <li><a href="#">Hindi </a></li>
+                                </ul>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="aside-contact-info d-none">
+                        <ul>
+                            <li><i class="icofont-clock-time"></i>Monday - Friday: 9:00 - 19:00</li>
+                            <li><i class="icofont-envelope"></i>Info@example.com</li>
+                            <li><i class="icofont-stock-mobile"></i>(+55) 254. 254. 254</li>
+                            <li><i class="icofont-home"></i>Helios Tower 75 Tam Trinh Hoang - Ha Noi - Viet Nam</li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+        </div>`;
+    $("#navbar-head").html(nav_html);
+
+    $('.explandlinavname').click(function (e){
+       if($('.expandlinav .viewall_li').hasClass('d-none')){
+        $('.expandlinav').find('.viewall_li').removeClass('d-none');
+        $('.expandlinav').find('.content-expandlinav').removeClass('d-none');
+       }else{
+        $('.expandlinav').find('.viewall_li').addClass('d-none');
+        $('.expandlinav').find('.content-expandlinav').addClass('d-none');
+       }
+       
+       console.log($(e.target));
+        
+    });
+
+    let width = $(window).width();
+    $(".menu-negative-mrg2,.menu-negative-mrg3,.menu-negative-mrg4").css("width", width);
+    let ele_page = $("body").hasClass("product_pg");
+    if (ele_page == true) {
+        $(".header-area").removeClass("bg-white");
+        $(".main-menu").find("nav ul li a").addClass("text-white");
+        $(".header-bottom.sticky-bar").removeClass("sticky-bar");
+        let src = `../dist/assets/imgs/anwi-logo-2.png`;
+        $(".logo-menu-wrap").find("a img").attr("src", src);
+        $(".main-body").find("iframe").attr("width", width);
+        if (width <= 575 && width >= 390) {
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 236,
+            })
+        } else if (width <= 390 && width >= 270) {
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 210,
+            });
+        } else if (width <= 998 && width > 575) {
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 530,
+            });
+        } else if (width <= 2720 && width > 1920) {
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 1440,
+            });
+        } else {
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 860,
+            });
+        }
+    }
+
+
+    $("a.ram_data").click(function () {
+        let item_id = $(this).attr("accessories_id");
+        let loc_path = '/products.html'
+        if (window.location.pathname.includes(loc_path)) {
+            window.location.href = `?itemid=${item_id}`
+        }
+        else {
+            window.location.href = `/products.html#itemid=${item_id}`;
+        }
+    })
+
+
+    // $(".main-menu nav ul").find("li").each(function () {
+    //     var current = window.location.pathname;
+    //     var $this = $(this).find("a");
+    //     if (current != "/") {
+    //         if ($this.attr('href').indexOf(current) !== -1) {
+    //             $(this).addClass('active_nav');
+    //         }
+    //     }
+
+    // })
+
+    // destroy localstorage data
+    let loc_path = '/productdetails.html';
+    if (window.location.pathname.includes(loc_path) === false) {
+        localStorage.removeItem("product_data");
+        localStorage.removeItem("top_data")
+    }
+    let loc_path1 = '/productcatloguedetails.html';
+    if (window.location.pathname.includes(loc_path1) === false) {
+        localStorage.removeItem("product_catlogue_obj");
+    }
+
+    //services pages links and sources
+
+    let $body_pg = $("body").hasClass("services_page");
+    let $hm_pg = "../index.html";
+    let $nav_img = "../dist/assets/imgs/anwi-logo-1.png";
+    let $footer_img = "../dist/assets/imgs/anwi-logo-2.png";
+    let $scrool_top_img = "../dist/assets/imgs/Home/rocket-footer.png";
+    let $about_pg = $("body").hasClass("about_page");
+    if($about_pg == true){
+        debugger
+        $(".main-menu").find("nav ul li a").addClass("text-dark");
+        let img_src = `./dist/assets/imgs/anwi-logo-1.png`;
+        $(".logo-menu-wrap").find("a img").attr("src",img_src);
+        $(".header-bottom").addClass("sticky-bar stick");
+        $("body.about_page").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#000");
+    }
+    if ($body_pg == true) {
+        $(".header-large-device").find(".logo-menu-wrap .logo").find("a").attr("href", $hm_pg);
+        $(".header-large-device").find(".logo-menu-wrap .logo").find("a img").attr("src", $nav_img);
+        $(".mobile-logo").find("a").attr("href", $hm_pg);
+        $(".mobile-logo").find("a img").attr("src", $nav_img);
+        $("body.services_page").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#000");
+        $(".main-menu").find("nav ul").find("li a").each(function () {
+            $(this).addClass("text-dark")
+            $(".header-bottom").addClass("sticky-bar stick");
+            let $arc = $(this).attr("href");
+            let $spcial_char = $arc.includes("./");
+            if ($spcial_char === true) {
+                let $refarence = `.${$arc}`
+                $(this).attr("href", $refarence);
+            }
+            
+        });
+        $(".same-style").find("a").each(function () {
+            let $arc1 = $(this).attr("href");
+            let $spcial_char1 = $arc1.includes("./");
+            if ($spcial_char1 === true) {
+                let $refarence1 = `.${$arc1}`
+                $(this).attr("href", $refarence1);
+            }
+        })
+        $(".tab-content").find("img").each(function(){
+            let $img_src = $(this).attr("src");
+            let $img_src1 = $img_src.includes("./");
+            if ($img_src1 === true) {
+                let $refarenceimg1 = `.${$img_src}`;
+                $(this).attr("src", $refarenceimg1);
+            }
+        });
+        $(".clickable-mainmenu-wrap").find("nav ul").find("li a").each(function () {
+            let $arc_mbil = $(this).attr("href");
+            let $spcial_char_mbil = $arc_mbil.includes("./");
+            if ($spcial_char_mbil === true) {
+                let $refarence_mbil = `.${$arc_mbil}`
+                $(this).attr("href", $refarence_mbil);
+            }
+        });
+    }
+
+    setTimeout(()=>{
+        if(width<=600){
+            $('.same-style').find('svg path').attr('fill','#000')
+        }
+    },300)
+}

dist/js/navbar_okay.js

@@ -0,0 +1,453 @@
+navINIT();
+
+function navINIT() {
+    if(!window.location.href.includes('orderconfirmation')&&!window.location.href.includes('/w/')){
+        loadCart();
+    }
+   
+    function loadHelper(src = './dist/js/utils/helpers.js'){
+        if ($(`script[src="${src}"]`).length > 0) {
+          return new Promise((resolve) => resolve());
+        }
+        return new Promise(function (resolve, reject) {
+            var s;
+            s = document.createElement('script');
+            s.src = src;
+            s.onload = resolve;
+            s.onerror = reject;
+            document.head.appendChild(s);
+        });
+    }
+    async function loadCart(){
+
+        if(!window.location.href.includes('services/paymentmethod.html')){
+            let files = ['./dist/js/shoppingcart/addtocart.js'];
+            await loadHelper();
+            for(let i=0;i<files.length;i++){
+                if ($(`script[src="${files[i]}"]`).length > 0) {
+                    continue;
+                }
+                try {
+            
+                    await loadHelper(files[i])
+                    console.log("done");
+    
+                } catch (error) {
+                    console.log(error);
+                    return;
+                }
+            }
+        }
+
+         setLengthCart();
+        //console.log("hello");
+
+        
+        
+      
+    }
+    let URLNAMENAV = window.location.href;
+    const isTransparent = URLNAMENAV.includes('login')||URLNAMENAV.includes('orderconfirmation')|| URLNAMENAV.includes('services/paymentmethod.html');
+    let nav_html = `
+<header class="header-area section-padding-1 transparent-bar" ${isTransparent ?'style="background:#0A1039"' :''}>
+            <div class="header-large-device">
+                <div class="header-bottom sticky-bar">
+                    <div class="container">
+                        <div class="header-bottom-flex">
+                            <div class="logo-menu-wrap d-flex">
+                                <div class="logo">
+                                    <a href="../index.html">
+                                        <img src="/dist/assets/imgs/anwi-logo-2.png" alt="logo" class="w-50">
+                                    </a>
+                                </div>
+                                <div class="main-menu menu-lh-1 main-menu-padding-1">
+                                    <nav>
+                                        <ul class="mb-0 p-0">
+                                        <li class="hover_tab_1"><a href="./storageproducts.html" class="satoshi_font">STORAGE</a>
+                                        <ul class="py-3 px-3 rounded-bottom shadow">
+                                            <li class="d-flex">
+                                                <ul class="nav nav-pills flex-column w-200 border-end" id="experienceTab" role="tablist">
+                                                    <li class="nav-item">
+                                                        <a class="nav-link active text-dark" data-bs-toggle="tab" href="#ora3">ORA 3</a>
+                                                    </li>
+                                                    <li class="nav-item">
+                                                        <a class="nav-link text-dark" data-bs-toggle="tab" href="#ora4">ORA 4</a>
+                                                    </li>
+                                                </ul>
+                                                <ul class="nav w-500">
+                                                    <li>
+                                                    <div class="tab-content">
+                                                        <div id="ora3" class="container tab-pane active">
+                                                            <div class="row">
+                                                                <div class="col-4">
+                                                                    <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                        <img src="./dist/assets/imgs/Navbar/ora3_ram.png" alt="ora img" class=""/>
+                                                                        <p class="fs-7 fw-600 mb-0 text-a-color text-center pb-1">Ora3 M.2 NVMe 512GB</p>
+                                                                    </div>
+                                                                </div>
+                                                                <div class="col-4">
+                                                                    <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                         <img src="./dist/assets/imgs/Navbar/ora3_ram.png" alt="ora img" class=""/>
+                                                                         <p class="fs-7 fw-600 mb-0 text-a-color text-center pb-1">Ora3 M.2 NVMe 1TB</p>
+                                                                    </div>
+                                                                </div>
+                                                                <div class="col-4">
+                                                                    <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                        <img src="./dist/assets/imgs/Navbar/ora3_ram.png" alt="ora img" class=""/>
+                                                                        <p class="fs-7 fw-600 mb-0 text-a-color text-center pb-1">Ora3 M.2 NVMe 2TB</p>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+                                                        </div>
+                                                        <div id="ora4" class="container tab-pane fade">
+                                                            <div class="row">
+                                                                <div class="col-4">
+                                                                    <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                        <img src="./dist/assets/imgs/Navbar/ora3_ram.png" alt="ora img" class=""/>
+                                                                        <p class="fs-7 fw-600 mb-0 text-a-color text-center  pb-1">Ora4 M.2 NVMe 512GB</p>
+                                                                    </div>
+                                                                </div>
+                                                                <div class="col-4">
+                                                                    <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                        <img src="./dist/assets/imgs/Navbar/ora3_ram.png" alt="ora img" class=""/>
+                                                                        <p class="fs-7 fw-600 mb-0 text-a-color text-center  pb-1">Ora4 M.2 NVMe 1TB</p>
+                                                                    </div>
+                                                                </div>
+                                                                <div class="col-4">
+                                                                    <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                        <img src="./dist/assets/imgs/Navbar/ora3_ram.png" alt="ora img" class=""/>
+                                                                        <p class="fs-7 fw-600 mb-0 text-a-color text-center  pb-1">Ora4 M.2 NVMe 2TB</p>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+                                                        </div>
+                                                  </div>
+                                                </li>
+                                                </ul>
+                                            </li>
+                                        </ul>
+                                    </li>
+                                    <li class="hover_tab_2"><a href="./ramproducts.html" class="satoshi_font">MEMORY</a>
+                                    <ul class="py-3 px-3 rounded-bottom shadow">
+                                    <li class="d-flex">
+                                        <ul class="nav nav-pills flex-column w-200 border-end" id="experienceTab" role="tablist">
+                                            <li class="nav-item">
+                                                <a class="nav-link active text-dark" data-bs-toggle="tab" href="#laptop">Laptop</a>
+                                            </li>
+                                            <li class="nav-item">
+                                                <a class="nav-link text-dark" data-bs-toggle="tab" href="#desktop">Desktop</a>
+                                            </li>
+                                        </ul>
+                                        <ul class="nav w-500">
+                                            <li>
+                                            <div class="tab-content">
+                                                <div id="laptop" class="container tab-pane active">
+                                                    <div class="row">
+                                                        <div class="col-4">
+                                                            <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                <img src="./dist/assets/imgs/Navbar/ora_ddr4_laptop.png" alt="ora img" class=""/>
+                                                                <p class="fs-7 fw-600 mb-0 text-a-color text-center pb-1">Ora 8GB DDR5</p>
+                                                            </div>
+                                                        </div>
+                                                        <div class="col-4">
+                                                            <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                 <img src="./dist/assets/imgs/Navbar/ora_ddr5_laptop.png" alt="ora img" class=""/>
+                                                                 <p class="fs-7 fw-600 mb-0 text-a-color text-center  pb-1">Ora 16GB DDR5</p>
+                                                            </div>
+                                                        </div>
+                                                        <div class="col-4 ">
+                                                            <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                 <img src="./dist/assets/imgs/Navbar/ora_ddr5_laptop.png" alt="ora img" class=""/>
+                                                                 <p class="fs-7 fw-600 mb-0 text-a-color text-center  pb-1">Ora 32GB DDR5</p>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                                <div id="desktop" class="container tab-pane fade">
+                                                    <div class="row">
+                                                        <div class="col-4">
+                                                            <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                <img src="./dist/assets/imgs/Navbar/ora_ddr4_desktop.png" alt="ora img" class=""/>
+                                                                <p class="fs-7 fw-600 mb-0 text-a-color text-center  pb-1">Ora 8GB DDR4</p>
+                                                            </div>
+                                                        </div>
+                                                        <div class="col-4">
+                                                            <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                <img src="./dist/assets/imgs/Navbar/ora_ddr4_desktop.png" alt="ora img" class=""/>
+                                                                <p class="fs-7 fw-600 mb-0 text-a-color text-center  pb-1">Ora 16GB DDR4</p>
+                                                            </div>
+                                                        </div>
+                                                        <div class="col-4">
+                                                            <div class="bg-gray-4 rounded-3 cursor-pointer">
+                                                                 <img src="./dist/assets/imgs/Navbar/ora_ddr4_desktop.png" alt="ora img" class=""/>
+                                                                 <p class="fs-7 fw-600 mb-0 text-a-color text-center  pb-1">Ora 32GB DDR4</p>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                          </div>
+                                        </li>
+                                        </ul>
+                                    </li>
+                                </ul>
+                                    </li>
+                                            <li><a href="./support.html" class="satoshi_font">SUPPORT</a></li>
+                                            <li><a href="./press.html" class="satoshi_font">PRESS</a></li>
+                                            <li><a href="./index1.html" class="satoshi_font">COMING SOON</a></li>
+                                            <li><a href="./contact.html" class="satoshi_font">CONTACT</a></li>
+                                            <li class="d-none"><a href="#" class="satoshi_font product_data" item_id="106633220000002">ACCESSORIES</a></li>
+                                        </ul>
+                                    </nav>
+                                </div>
+                            </div>
+                            <div class="header-action-wrap header-action-flex header-action-width header-action-mrg-1">
+                                <div class="same-style">
+                                <a href="/myaccount.html" class="my_avatar">
+                      
+                                <svg style="width:20px;" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg" focusable="false" aria-hidden="true" class="icon" data-di-res-id="e576e1a9-2f4a9ed6" data-di-rand="1682677695656"><path fill="#fff" d="M48 50c17.346 0 32 14.221 32 31.054V89c0 2.757-2.243 5-5 5H21c-2.757 0-5-2.243-5-5v-7.946C16 64.221 30.654 50 48 50zm0 8c-12.785 0-24 10.773-24 23.054V86h48v-4.946C72 68.773 60.785 58 48 58zm-.002-56c12.133 0 22.003 9.87 22.003 22.001C70 36.131 60.13 46 47.998 46c-12.13 0-21.997-9.869-21.997-21.999C26 11.87 35.867 2 47.998 2zm0 8c-7.718 0-13.997 6.281-13.997 14.001C34 31.72 40.28 38 47.998 38 55.718 38 62 31.72 62 24.001 62 16.281 55.719 10 47.998 10z"></path></svg>
+                                </a>
+                                </div>
+                                <div class="same-style header-cart">
+                                <a class="cart-active1 position-relative" href="/shopping-cart.html">
+                                <svg  style="width:20px;" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg" focusable="false" aria-hidden="true" class="icon" data-di-res-id="e576e1a9-90f52cd9" data-di-rand="1682677695656"><path  fill="#fff"  d="M72.848 70.25c6.075 0 11 4.925 11 11s-4.925 11-11 11-11-4.925-11-11 4.925-11 11-11zm-35 0c6.075 0 11 4.925 11 11s-4.925 11-11 11-11-4.925-11-11c0-6.074 4.926-11 11-11zm35 7a4 4 0 10.002 8.001 4 4 0 00-.002-8.001zm-35 0a4 4 0 100 8 4 4 0 000-8zM13.892 3.75c2.287 0 4.376 1.55 5.058 3.72l.064.22 2.97 11.187h68.128a4.727 4.727 0 014.661 5.786l-.048.2-9.559 36.291c-.583 2.216-2.618 3.842-4.894 3.944l-.228.005H30.06c-2.287 0-4.377-1.55-5.06-3.72l-.063-.219-13.124-49.413-10.7.006-.004-8 12.782-.007zm72.03 23.127H24.108l8.027 30.226H77.96l7.962-30.226z"></path></svg>
+                                
+                                <span class="position-absolute cartnumcount d-none" >0</span>
+                                </a>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="header-small-device header-small-ptb sticky-bar py-md-2 py-2 bg-white">
+                <div class="container-fluid px-4">
+                    <div class="row align-items-center">
+                        <div class="col-6 header-action-wrap">
+                            <div class="d-flex">
+                                <div class="same-style header-info">
+                                    <button class="mobile-menu-button-active">
+                                        <span class="info-width-1"></span>
+                                        <span class="info-width-2"></span>
+                                        <span class="info-width-3"></span>
+                                    </button>
+                                </div>
+                                <div class="mobile-logo mobile-logo-width ps-3">
+                                    <a href="../index.html">
+                                        <img alt="" src="/dist/assets/imgs/anwi-logo-1.png" class="w-50">
+                                    </a>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-6">
+                            <div class="header-action-wrap header-action-flex header-action-mrg-1">
+                                <div class="same-style">
+                                <a href="/myaccount.html" class="my_avatar"> <svg style="width:22px;" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg" focusable="false" aria-hidden="true" class="icon" data-di-res-id="e576e1a9-2f4a9ed6" data-di-rand="1682677695656"><path fill="#fff" d="M48 50c17.346 0 32 14.221 32 31.054V89c0 2.757-2.243 5-5 5H21c-2.757 0-5-2.243-5-5v-7.946C16 64.221 30.654 50 48 50zm0 8c-12.785 0-24 10.773-24 23.054V86h48v-4.946C72 68.773 60.785 58 48 58zm-.002-56c12.133 0 22.003 9.87 22.003 22.001C70 36.131 60.13 46 47.998 46c-12.13 0-21.997-9.869-21.997-21.999C26 11.87 35.867 2 47.998 2zm0 8c-7.718 0-13.997 6.281-13.997 14.001C34 31.72 40.28 38 47.998 38 55.718 38 62 31.72 62 24.001 62 16.281 55.719 10 47.998 10z"></path></svg></a>
+                                </div>
+                                <div class="same-style header-cart">
+                                <a class="cart-active1 position-relative" href="/shopping-cart.html"> <svg  style="width:22px;" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg" focusable="false" aria-hidden="true" class="icon" data-di-res-id="e576e1a9-90f52cd9" data-di-rand="1682677695656"><path  fill="#fff"  d="M72.848 70.25c6.075 0 11 4.925 11 11s-4.925 11-11 11-11-4.925-11-11 4.925-11 11-11zm-35 0c6.075 0 11 4.925 11 11s-4.925 11-11 11-11-4.925-11-11c0-6.074 4.926-11 11-11zm35 7a4 4 0 10.002 8.001 4 4 0 00-.002-8.001zm-35 0a4 4 0 100 8 4 4 0 000-8zM13.892 3.75c2.287 0 4.376 1.55 5.058 3.72l.064.22 2.97 11.187h68.128a4.727 4.727 0 014.661 5.786l-.048.2-9.559 36.291c-.583 2.216-2.618 3.842-4.894 3.944l-.228.005H30.06c-2.287 0-4.377-1.55-5.06-3.72l-.063-.219-13.124-49.413-10.7.006-.004-8 12.782-.007zm72.03 23.127H24.108l8.027 30.226H77.96l7.962-30.226z"></path></svg>
+                                <span class="position-absolute cartnumcount d-none"  style="top:-27%;right:-80%">0</span>
+                                </a>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </header>
+        <!-- Mobile menu start -->
+        <div class="mobile-menu-active clickalbe-sidebar-wrapper-style-1">
+            <div class="clickalbe-sidebar-wrap">
+            <div class="row pb-2 border-bottom">
+                <div class="col-6">
+                    <div class="mobile-logo mobile-logo-width">
+                        <a href="../index.html">
+                            <img alt="" src="/dist/assets/imgs/anwi-logo-1.png" class="w-75">
+                        </a>
+                    </div>
+                </div>
+                <div class="col-6 text-end pe-4">
+                    <a class="sidebar-close"><i class="fa-solid fa-xmark"></i></a>
+                </div>
+            </div>
+               
+                <div class="mobile-menu-content-area sidebar-content-100-percent pt-3">
+                    <div class="mobile-search d-none">
+                        <form class="search-form" action="#">
+                            <input type="text" placeholder="Search here…" class="satoshi_font">
+                            <button class="button-search"><i class="fa-solid fa-magnifying-glass"></i></button>
+                        </form>
+                    </div>
+                    <div class="clickable-mainmenu-wrap clickable-mainmenu-style1">
+                        <nav>
+                            <ul class="pl-0">
+                                <li class=""><a href="./ramproducts.html" class="satoshi_font">RAM</a></li>
+                                <li class=""><a href="./storageproducts.html" class="satoshi_font">STORAGE</a></li>
+                                <li class=""><a href="./support.html" class="satoshi_font" >SUPPORT</a></li>
+                                <li class=""><a href="./press.html" class="satoshi_font">PRESS</a></li>
+                                <li class=""><a href="./index1.html" class="satoshi_font">COMING SOON</a></li>
+                                <li class=""><a href="./contact.html" class="satoshi_font">CONTACT</a></li>
+                            </ul>
+                        </nav>
+                    </div>
+                    <div class="mobile-curr-lang-wrap d-none">
+                        <div class="single-mobile-curr-lang">
+                            <a class="mobile-language-active" href="#">Language <i class="icofont-simple-down"></i></a>
+                            <div class="lang-curr-dropdown lang-dropdown-active">
+                                <ul>
+                                    <li><a href="#">English</a></li>
+                                    <li><a href="#">Spanish</a></li>
+                                    <li><a href="#">Hindi </a></li>
+                                </ul>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="aside-contact-info d-none">
+                        <ul>
+                            <li><i class="icofont-clock-time"></i>Monday - Friday: 9:00 - 19:00</li>
+                            <li><i class="icofont-envelope"></i>Info@example.com</li>
+                            <li><i class="icofont-stock-mobile"></i>(+55) 254. 254. 254</li>
+                            <li><i class="icofont-home"></i>Helios Tower 75 Tam Trinh Hoang - Ha Noi - Viet Nam</li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+        </div>`;
+    $("#navbar-head").html(nav_html);
+    let width = $(window).width();
+    $(".menu-negative-mrg2,.menu-negative-mrg3,.menu-negative-mrg4").css("width", width);
+    let ele_page = $("body").hasClass("product_pg");
+    if (ele_page == true) {
+        $(".header-area").removeClass("bg-white");
+        $(".main-menu").find("nav ul li a").addClass("text-white");
+        $(".header-bottom.sticky-bar").removeClass("sticky-bar");
+        let src = `../dist/assets/imgs/anwi-logo-2.png`;
+        $(".logo-menu-wrap").find("a img").attr("src", src);
+        $(".main-body").find("iframe").attr("width", width);
+        if (width <= 575 && width >= 390) {
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 236,
+            })
+        } else if (width <= 390 && width >= 270) {
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 210,
+            });
+        } else if (width <= 998 && width > 575) {
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 530,
+            });
+        } else if (width <= 2720 && width > 1920) {
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 1440,
+            });
+        } else {
+            $(".main-body").find("iframe").attr({
+                width: width,
+                height: 860,
+            });
+        }
+    }
+
+
+    $("a.ram_data").click(function () {
+        let item_id = $(this).attr("accessories_id");
+        let loc_path = '/products.html'
+        if (window.location.pathname.includes(loc_path)) {
+            window.location.href = `?itemid=${item_id}`
+        }
+        else {
+            window.location.href = `/products.html#itemid=${item_id}`;
+        }
+    })
+
+
+    // $(".main-menu nav ul").find("li").each(function () {
+    //     var current = window.location.pathname;
+    //     var $this = $(this).find("a");
+    //     if (current != "/") {
+    //         if ($this.attr('href').indexOf(current) !== -1) {
+    //             $(this).addClass('active_nav');
+    //         }
+    //     }
+
+    // })
+
+    // destroy localstorage data
+    let loc_path = '/productdetails.html';
+    if (window.location.pathname.includes(loc_path) === false) {
+        localStorage.removeItem("product_data");
+        localStorage.removeItem("top_data")
+    }
+    let loc_path1 = '/productcatloguedetails.html';
+    if (window.location.pathname.includes(loc_path1) === false) {
+        localStorage.removeItem("product_catlogue_obj");
+    }
+
+    //services pages links and sources
+
+    let $body_pg = $("body").hasClass("services_page");
+    let $hm_pg = "../index.html";
+    let $nav_img = "../dist/assets/imgs/anwi-logo-1.png";
+    let $footer_img = "../dist/assets/imgs/anwi-logo-2.png";
+    let $scrool_top_img = "../dist/assets/imgs/Home/rocket-footer.png";
+    let $about_pg = $("body").hasClass("about_page");
+    if($about_pg == true){
+        debugger
+        $(".main-menu").find("nav ul li a").addClass("text-dark");
+        let img_src = `./dist/assets/imgs/anwi-logo-1.png`;
+        $(".logo-menu-wrap").find("a img").attr("src",img_src);
+        $(".header-bottom").addClass("sticky-bar stick");
+        $("body.about_page").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#000");
+    }
+    if ($body_pg == true) {
+        $(".header-large-device").find(".logo-menu-wrap .logo").find("a").attr("href", $hm_pg);
+        $(".header-large-device").find(".logo-menu-wrap .logo").find("a img").attr("src", $nav_img);
+        $(".mobile-logo").find("a").attr("href", $hm_pg);
+        $(".mobile-logo").find("a img").attr("src", $nav_img);
+        $("body.services_page").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#000");
+        $(".main-menu").find("nav ul").find("li a").each(function () {
+            $(this).addClass("text-dark")
+            $(".header-bottom").addClass("sticky-bar stick");
+            let $arc = $(this).attr("href");
+            let $spcial_char = $arc.includes("./");
+            if ($spcial_char === true) {
+                let $refarence = `.${$arc}`
+                $(this).attr("href", $refarence);
+            }
+            
+        });
+        $(".same-style").find("a").each(function () {
+            let $arc1 = $(this).attr("href");
+            let $spcial_char1 = $arc1.includes("./");
+            if ($spcial_char1 === true) {
+                let $refarence1 = `.${$arc1}`
+                $(this).attr("href", $refarence1);
+            }
+        })
+        $(".tab-content").find("img").each(function(){
+            let $img_src = $(this).attr("src");
+            let $img_src1 = $img_src.includes("./");
+            if ($img_src1 === true) {
+                let $refarenceimg1 = `.${$img_src}`;
+                $(this).attr("src", $refarenceimg1);
+            }
+        });
+        $(".clickable-mainmenu-wrap").find("nav ul").find("li a").each(function () {
+            let $arc_mbil = $(this).attr("href");
+            let $spcial_char_mbil = $arc_mbil.includes("./");
+            if ($spcial_char_mbil === true) {
+                let $refarence_mbil = `.${$arc_mbil}`
+                $(this).attr("href", $refarence_mbil);
+            }
+        });
+    }
+
+    setTimeout(()=>{
+        if(width<=600){
+            $('.same-style').find('svg path').attr('fill','#000')
+        }
+    },300)
+}

dist/js/orderDetails/order_summary.js

@@ -0,0 +1,271 @@
+async function order_summary() {
+
+  let cookieRes = COOKIE_HELPER_ACTIONS.getCookie();
+  let { userId } = cookieRes;
+  let filesInputSupport = [];
+
+
+  // let res = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/Bizgaze/integrations/products/salesorderdetailsbyorgid/organizationid/${userId}`,true);
+  // https://templateserver.bizgaze.com/apis/v4/bizgaze/integrations/products/getordersbyid/organizationid/{organizationid}/orderno/{orderno}
+  let orderno = window.location.hash.split('#')[1];
+  let res = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/getordersbyid/organizationid/${userId}/orderno/${orderno}`);
+  if (res.isError) {
+    return;
+  }
+  const orderDetailsres = JSON.parse(res.response.result);
+
+  let new_arrr = orderDetailsres;
+  console.log(new_arrr)
+  let orderNumber = window.location.hash.split('#')[1];
+  let filteredOrders = new_arrr.filter(function (order) {
+    return order.OrderNo === orderNumber;
+  });
+
+  for (let i = 0; i < filteredOrders.length; i++) {
+    let order = filteredOrders[i];
+    let Delivery_status = order.stageshortcode
+    let deliverdCard = appendItemHTML(order);
+    $('.deliverd-card').append(deliverdCard)
+    if (Delivery_status == 'CMD') {
+      $('.delivery_status').html('Deliverd')
+    }
+    if (Delivery_status == 'APL') {
+      $('.delivery_status').html('Approval')
+    }
+  }
+
+  $('.supportBtn').click(function (e) {
+    let parentEl = $(e.target).parents('.card-body');
+
+    const orderName = $(parentEl).find('.ordernameModal').text();
+    const img = $(parentEl).find('.order_img').attr('src');
+    $('#exampleModalsupport').find('.order_img').attr('src', img);
+
+    $('.modalitemname').text(orderName);
+
+    const orderQty = $(parentEl).find('.orderqtymodalinfo').text();
+    const orderPrice = $(parentEl).find('.order_price').text();
+    const [symbol, price] = getCurrencySymbol(orderPrice)
+    $('.modalitemqty').html(orderQty);
+    $('.modalprice').html(`${symbol} ${price}`);
+    console.log(orderName);
+  });
+
+
+  // modal start
+
+
+  // files append html ui
+  function getInputsListHTML(arr){
+    let html = '';
+
+    for(let i=0;i<arr.length;i++){
+      const {FileName,FileType} = arr[i];
+      html += `<span class='p-1  rounded text-truncate containerfilesupport' data-name="${FileName}.${FileType}" >
+     <span class="border p-1 rounded"> <span class=" w-50 filenamesupportticket"> ${FileName}.${FileType}</span>
+     <span  class=' text-center bg-white rounded removeFilesupportticket'>
+      <i class='p-1  fa fa-close'></i>
+     </span></span>
+   </span>`
+    } 
+
+    return html;
+  }
+
+  // files onchange handler for input files
+  async function fileUploadSaveHandler(e){
+
+    const promiseFiles = await getMulFileToGetBase64(e);
+    // console.log(promiseFiles,'promisepromise');
+    filesInputSupport = promiseFiles;
+
+    let html = getInputsListHTML(filesInputSupport);
+
+    $('.inputlistsupportcontainer').html(html);
+
+    $('.removeFilesupportticket').off('click').click(function (e){
+      let el = $(this);
+
+      let nameWithExt = $(el).parents('.containerfilesupport').data('name')
+      console.log(nameWithExt);
+
+      filterRemoveInputsFiles(nameWithExt)
+    });
+
+  }  
+
+  function filterRemoveInputsFiles(nameWithExt){
+    console.log("okay");
+    console.log(filesInputSupport);
+    filesInputSupport = filesInputSupport.filter(function (e){
+      const {FileName,FileType} = e;
+      const str = `${FileName}.${FileType}`;
+      if(str != nameWithExt) return e;
+    });
+
+    console.log(filesInputSupport);
+  }
+
+  $('#supportattachfile').off().change(function (e){
+    debugger;
+    if(!e.target.files.length) return;
+    fileUploadSaveHandler(e);
+  });
+
+
+
+  // submit support ticket
+  $('.submitsupportticket').off('click').click(async function (e) {
+    console.log("tick");
+
+    let supportGroup = $('#supportgroups').val();
+    let priortyGroup = $('#supportlevel').val();
+    let description = $('.desmodalsupportarea').val()?.trim();
+
+
+
+    let isErrorValidtion = false;
+    if (!supportGroup) {
+      isErrorValidtion = true;
+      $('#supportgroups').parent().find('.invalid-feedback').addClass('d-block');
+    } else {
+      $('#supportgroups').parent().find('.invalid-feedback').removeClass('d-block');
+    }
+
+    if (!priortyGroup) {
+      isErrorValidtion = true;
+      $('#supportlevel').parent().find('.invalid-feedback').addClass('d-block');
+    } else {
+      $('#supportlevel').parent().find('.invalid-feedback').removeClass('d-block');
+    }
+
+    if (!description) {
+      isErrorValidtion = true;
+      $('.desmodalsupportarea').parent().find('.invalid-feedback').addClass('d-block');
+    } else {
+      $('.desmodalsupportarea').parent().find('.invalid-feedback').removeClass('d-block');
+    }
+
+    if (isErrorValidtion) return;
+
+    const payload = {
+      ticketgroupid: Number(supportGroup),
+      description: description,
+      documents: filesInputSupport.length > 0 ? filesInputSupport : 0,
+      PriorityId: Number(priortyGroup),
+      ticketid: 0,
+      contactid: Number(userId)
+    }
+    $('.supportticketsubmit').removeClass('d-none');
+    $('.supportticketsubmitbtn').addClass('d-none');
+
+    $('.closesupportticket').attr('disabled', true);
+    console.log(payload);
+    const res = await API_SERVICES_ACTIONS.postAPIService(`apis/v4/hyperfusion/hireserver/machines/saveticket`, payload);
+
+    console.log(res);
+
+    if (res.isError) {
+      toasterHelper("error", res.errorMsg, `toast-top-right`);
+      $('.supportticketsubmit').addClass('d-none');
+      $('.supportticketsubmitbtn').removeClass('d-none');
+      $('.closesupportticket').attr('disabled', false);
+      return;
+    }
+    $('.supportticketsubmit').addClass('d-none');
+    $('.supportticketsubmitbtn').removeClass('d-none');
+    $('.closesupportticket').attr('disabled', false);
+    toasterHelper("success", 'Ticket successfully submitted!', `toast-top-right`);
+
+    // $('#supportgroups').val(null);
+    // $('#supportlevel').val(null);
+    $('.desmodalsupportarea').val('');
+    $("#exampleModalsupport .closesupportticket").click()
+  });
+
+
+
+  // modal end
+
+  $('.warrantybtn').click(function (e) {
+    let parentEl = $(e.target).parents('.card-body');
+
+    const orderName = $(parentEl).find('.ordernameModal').text();
+
+    $('#warrenymodalname').html(orderName);
+  });
+
+  let summary = `<div class="bg-gradient-anwi card-body"><div><p class="mb-0 fw-500">Order : <span>${orderNumber}</span><small class=" "> ( ${filteredOrders.length} items )</samll><p class="mb-0 ">Order placed on ${filteredOrders[0].OrderDate}</p></div>`;
+
+  $('.Order_details_section  .order_tax').html(filteredOrders[0].taxamount)
+  $('.Order_details_section .Order_total').html(filteredOrders[0].nettotal)
+  $('.Order_details_section  .order_price').html(filteredOrders[0].assessableamount)
+  $('.Order_details_section  .order-summary').html(summary);
+
+  $('.back_to_orders').click(function () {
+    $(this).attr('href', './myaccount.html')
+  });
+
+  function appendItemHTML(order) {
+
+    return `<div class="card rounded-0 bg-white mb-3 "><div class=card-body><div class="align-items-center row"><div class=col-md-6><div class=d-flex><img class=img-fluid src=""></div><div class="d-flex align-items-center"><div class="text-secondary">Delivery Status : </div><div class=" delivery_status text-blue fw-600" data-status="${order.stageshortcode}"></div></div></div><div class="col-md-6 text-end"><button data-bs-toggle="modal" data-bs-target="#exampleModalwarrenty" class=" bg-gradient-anwi-outline btn-sm  btn warrantybtn ">Claim warranty</button> <button data-bs-toggle="modal" data-bs-target="#exampleModalsupport" class="supportBtn bg-gradient-anwi-outline btn-sm btn ">Support</button></div></div><div><small class=" text-secondary me-2">Delivered To : </small><small class="fw-600 user_name">${order.OrganizationName}</div><div class="row pb-4 pb-md-0 align-items-center"><div class="col-md-4 text-center"><img class="img-fluid order_img w-75"src=https://appassets.bizgaze.app/${order.imageurl?.replaceAll(" ", "%20")}></div><div class="col-md-8 position-relative"><small class=" mb-0 order_itemname"><span ><span class="ordernameModal">${order.itemname}</span>  (<span class="orderqtymodalinfo">${order.Quantity}</span> items)</span><small class=" align-items-center d-flex fw-600 mb-3"><svg class="bi bi-currency-rupee"fill=currentColor height=16 viewBox="0 0 16 16"width=16 xmlns=http://www.w3.org/2000/svg><path d="M4 3.06h2.726c1.22 0 2.12.575 2.325 1.724H4v1.051h5.051C8.855 7.001 8 7.558 6.788 7.558H4v1.317L8.437 14h2.11L6.095 8.884h.855c2.316-.018 3.465-1.476 3.688-3.049H12V4.784h-1.345c-.08-.778-.357-1.335-.793-1.732H12V2H4v1.06Z"></path></svg><small class="order_price fs-6">${order.itemtotal}</small><p class=" mb-0 close_exchange position-absolute d-none text-secondary">Return/Exchange window closed on Friday,24 March <a class=text-primary href=#>Why?</a></div></div></div></div>`;
+  }
+
+
+
+
+
+  async function supportModalInit() {
+    $.fn.modal.Constructor.prototype.enforceFocus = function () { };
+    let ticketGroupRes = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/anwisystems/integrations/anwiauth/getticketgoups`);
+
+
+    if (ticketGroupRes.isError) {
+      console.log(ticketGroupRes.errorMsg);
+      return;
+    }
+
+
+    ticketGroupRes = JSON.parse(ticketGroupRes.response.result);
+
+    console.log(ticketGroupRes);
+
+
+
+    let htmlTGroup = '';
+    for (let i = 0; i < ticketGroupRes.length; i++) {
+      htmlTGroup += `<option value="${ticketGroupRes[i].ticketgroupid}" data-id="${ticketGroupRes[i].ticketgroupid}">${ticketGroupRes[i].ticketgroupname}</option>`
+    }
+
+    $('#supportgroups').html(htmlTGroup);
+
+    // priopty
+
+    let prioritiesRes = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/anwisystems/integrations/anwiauth/getticketpriorities`);
+
+    if (prioritiesRes.isError) {
+      console.log(prioritiesRes.errorMsg);
+      return;
+    }
+
+
+    prioritiesRes = JSON.parse(prioritiesRes.response.result);
+
+    console.log(prioritiesRes, 'prioritiesRes');
+
+
+    let htmlTpriorites = '';
+    for (let i = 0; i < prioritiesRes.length; i++) {
+      htmlTpriorites += `<option value="${prioritiesRes[i].priorityid}" data-id="${prioritiesRes[i].priorityid}">${prioritiesRes[i].priorityname}</option>`
+    }
+
+    $('#supportlevel').html(htmlTpriorites);
+
+
+
+  }
+
+
+  supportModalInit();
+}
+order_summary()

dist/js/orderconfirmation.js

@@ -0,0 +1,160 @@
+function orderConfirmation(){
+    init();
+    function init(){
+        addFullLoader();
+        getOrderStatus();
+    }
+
+    function orderlistsummary({name,price,qty,total,img}){
+        let priceAmt = '';
+        let totalAmt = '';
+
+        let defaultImg =img ? imgServerNameBuild(img): `./dist/assets/imgs/nophoto.png`;
+
+debugger;
+        
+        let [priceSysm,priceamt] = getCurrencySymbol(price)
+        priceAmt = `${priceSysm}${priceamt}`
+        
+
+        
+        let [qtySymb,qtyamt] = getCurrencySymbol(qty*price)
+       
+
+        totalAmt = `${qtySymb}${qtyamt}`
+
+        return `<div class="col-sm-4">
+     <div style="max-width:200px">   <img src="${defaultImg}" alt="" class="w-100 h-100">   </div>
+    </div>
+    <div class="col-sm-8 d-flex flex-column justify-content-center">
+        <div class="itemname"><span class="font-weight-500">${name}</span></div>
+        <div> <span>Unit Price :</span><span class="font-weight-500">${priceAmt}</span> </div>
+        <div> <span>Quantity :</span><span class="font-weight-500">${qty}</span> </div>
+        <div> <span>Total Amount :</span>  <span class="font-weight-500">${totalAmt}</span></div>
+    </div>`;
+
+        return `
+        <div class="row">
+                            <div class="col-4">
+                                <div class="row">
+                                    <div class="col-6">
+                                        <img class="w-100 h-100" src="http://127.0.0.1:5504/dist/assets/imgs/Navbar/Accessiories-2.png" alt="">
+                                    </div>
+                                    <div class="col-6 d-flex justify-content-center align-items-center">
+                                        <div class="itemname">${name}</div>
+                                        
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="col-3 d-flex align-items-center justify-content-center">
+                                ${priceAmt}
+                            </div>
+                            <div class="col-2 d-flex align-items-center justify-content-center">
+                               ${qty}
+                            </div>
+                            <div class="col-3 text-end">
+                               ${totalAmt}
+                             </div>
+                        </div>`;
+    }
+
+    function addFullLoader(){
+        document.querySelector('auth-loader').show();
+    }
+
+    function removeFullLoader(){
+        document.querySelector('auth-loader').hide();
+    }
+
+    async function getOrderStatus(){
+       
+        const searchParams = window.location.search.split('&');
+        let orderId = searchParams[0].split('=')[1];
+
+        debugger;
+        let orderRes = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/hyperfusionpaymentgateway/gethyperfusionpaymentdetails/orderid/${orderId}`);
+        if(orderRes.isError){
+            removeFullLoader();
+            return;
+        }
+        console.log(orderRes);
+        //payment_group
+       
+        orderRes = JSON.parse(orderRes.response.result)[0];
+        $('.paymentmethodconfirm').html(orderRes.payment_group)
+        if(orderRes.payment_status === 'FAILED'){
+            $('.ordercontainerconfirmError').removeClass('d-none');
+            $('.successorderconfirm').addClass('d-none');
+            removeFullLoader();
+            return;
+        }
+      
+        const res =  await API_SERVICES_ACTIONS.postAPIService(`apis/v4/bizgaze/transact/orders/updatepaymenttransactionstatus/refid/${orderId}`,null);
+
+        console.log(res,'ress');
+
+        if(res.isError){
+            console.log(res);
+            $('.ordercontainerconfirmError').removeClass('d-none');
+            $('.successorderconfirm').addClass('d-none');
+            removeFullLoader();
+            return;
+        }
+
+
+        if(!res.response.message.toLowerCase().includes('success')){
+            console.log(res);
+            $('.ordercontainerconfirmError').removeClass('d-none');
+            $('.successorderconfirm').addClass('d-none');
+            removeFullLoader();
+            return;
+        }
+
+        let resData = JSON.parse(res.response.result);
+
+        const {NetTotal,TaxAmount,OrderItems,CreatedDate,OrderNo
+        } = resData;
+        let [netcurrencySymbol,netamount] = getCurrencySymbol(NetTotal);    
+        $('.totalordersummary').html(`${netcurrencySymbol}${netamount}`);
+
+       {
+        let [ordercurrencySymbol,orderamount] = getCurrencySymbol(TaxAmount);
+        $('.totaltaxsummary').html(`${ordercurrencySymbol}${orderamount}`);
+       }
+
+       let orderItemsListHTML = '';
+
+       for(let i=0;i<OrderItems.length;i++){
+        const {ItemName:name,UnitPrice:price,Quantity:qty,UnitPrice:total,ItemImage:img} = OrderItems[i];
+        debugger;
+        orderItemsListHTML += orderlistsummary({
+            name,
+            price,
+            qty,
+            total,
+            img
+        });
+       }
+       let userData = COOKIE_HELPER_ACTIONS.getCookie();
+       let {name} = userData;
+       $('.username').html(name);
+       $('.orderlistconfirm').html(orderItemsListHTML);
+
+       $('.createdDateConfirm').html(CreatedDate);
+
+       $('.ordernumber').html(OrderNo);
+debugger;
+       localStorage.removeItem(CART_DATA)
+
+       setLengthCart();
+       removeFullLoader();
+        console.log(resData);
+
+    }
+
+
+   
+}
+
+    
+checkValidAuth(orderConfirmation)

dist/js/plugins/ajax-mail.js

@@ -0,0 +1,48 @@
+$(function() {
+
+	// Get the form.
+	var form = $('#contact-form');
+
+	// Get the messages div.
+	var formMessages = $('.form-messege');
+
+	// Set up an event listener for the contact form.
+	$(form).submit(function(e) {
+		// Stop the browser from submitting the form.
+		e.preventDefault();
+
+		// Serialize the form data.
+		var formData = $(form).serialize();
+
+		// Submit the form using AJAX.
+		$.ajax({
+			type: 'POST',
+			url: $(form).attr('action'),
+			data: formData
+		})
+		.done(function(response) {
+			// Make sure that the formMessages div has the 'success' class.
+			$(formMessages).removeClass('error');
+			$(formMessages).addClass('success');
+
+			// Set the message text.
+			$(formMessages).text(response);
+
+			// Clear the form.
+			$('#contact-form input,#contact-form textarea').val('');
+		})
+		.fail(function(data) {
+			// Make sure that the formMessages div has the 'error' class.
+			$(formMessages).removeClass('success');
+			$(formMessages).addClass('error');
+
+			// Set the message text.
+			if (data.responseText !== '') {
+				$(formMessages).text(data.responseText);
+			} else {
+				$(formMessages).text('Oops! An error occured and your message could not be sent.');
+			}
+		});
+	});
+
+});

dist/js/plugins/countdown.js

@@ -0,0 +1,22 @@
+/*!
+ * The Final Countdown for jQuery v2.2.0 (http://hilios.github.io/jQuery.countdown/)
+ * Copyright (c) 2016 Edson Hilios
+ * 
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of
+ * this software and associated documentation files (the "Software"), to deal in
+ * the Software without restriction, including without limitation the rights to
+ * use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
+ * the Software, and to permit persons to whom the Software is furnished to do so,
+ * subject to the following conditions:
+ * 
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ * 
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+ * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+ * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+ * IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+ * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+!function(a){"use strict";"function"==typeof define&&define.amd?define(["jquery"],a):a(jQuery)}(function(a){"use strict";function b(a){if(a instanceof Date)return a;if(String(a).match(g))return String(a).match(/^[0-9]*$/)&&(a=Number(a)),String(a).match(/\-/)&&(a=String(a).replace(/\-/g,"/")),new Date(a);throw new Error("Couldn't cast `"+a+"` to a date object.")}function c(a){var b=a.toString().replace(/([.?*+^$[\]\\(){}|-])/g,"\\$1");return new RegExp(b)}function d(a){return function(b){var d=b.match(/%(-|!)?[A-Z]{1}(:[^;]+;)?/gi);if(d)for(var f=0,g=d.length;f<g;++f){var h=d[f].match(/%(-|!)?([a-zA-Z]{1})(:[^;]+;)?/),j=c(h[0]),k=h[1]||"",l=h[3]||"",m=null;h=h[2],i.hasOwnProperty(h)&&(m=i[h],m=Number(a[m])),null!==m&&("!"===k&&(m=e(l,m)),""===k&&m<10&&(m="0"+m.toString()),b=b.replace(j,m.toString()))}return b=b.replace(/%%/,"%")}}function e(a,b){var c="s",d="";return a&&(a=a.replace(/(:|;|\s)/gi,"").split(/\,/),1===a.length?c=a[0]:(d=a[0],c=a[1])),Math.abs(b)>1?c:d}var f=[],g=[],h={precision:100,elapse:!1,defer:!1};g.push(/^[0-9]*$/.source),g.push(/([0-9]{1,2}\/){2}[0-9]{4}( [0-9]{1,2}(:[0-9]{2}){2})?/.source),g.push(/[0-9]{4}([\/\-][0-9]{1,2}){2}( [0-9]{1,2}(:[0-9]{2}){2})?/.source),g=new RegExp(g.join("|"));var i={Y:"years",m:"months",n:"daysToMonth",d:"daysToWeek",w:"weeks",W:"weeksToMonth",H:"hours",M:"minutes",S:"seconds",D:"totalDays",I:"totalHours",N:"totalMinutes",T:"totalSeconds"},j=function(b,c,d){this.el=b,this.$el=a(b),this.interval=null,this.offset={},this.options=a.extend({},h),this.firstTick=!0,this.instanceNumber=f.length,f.push(this),this.$el.data("countdown-instance",this.instanceNumber),d&&("function"==typeof d?(this.$el.on("update.countdown",d),this.$el.on("stoped.countdown",d),this.$el.on("finish.countdown",d)):this.options=a.extend({},h,d)),this.setFinalDate(c),this.options.defer===!1&&this.start()};a.extend(j.prototype,{start:function(){null!==this.interval&&clearInterval(this.interval);var a=this;this.update(),this.interval=setInterval(function(){a.update.call(a)},this.options.precision)},stop:function(){clearInterval(this.interval),this.interval=null,this.dispatchEvent("stoped")},toggle:function(){this.interval?this.stop():this.start()},pause:function(){this.stop()},resume:function(){this.start()},remove:function(){this.stop.call(this),f[this.instanceNumber]=null,delete this.$el.data().countdownInstance},setFinalDate:function(a){this.finalDate=b(a)},update:function(){if(0===this.$el.closest("html").length)return void this.remove();var a,b=new Date;return a=this.finalDate.getTime()-b.getTime(),a=Math.ceil(a/1e3),a=!this.options.elapse&&a<0?0:Math.abs(a),this.totalSecsLeft===a||this.firstTick?void(this.firstTick=!1):(this.totalSecsLeft=a,this.elapsed=b>=this.finalDate,this.offset={seconds:this.totalSecsLeft%60,minutes:Math.floor(this.totalSecsLeft/60)%60,hours:Math.floor(this.totalSecsLeft/60/60)%24,days:Math.floor(this.totalSecsLeft/60/60/24)%7,daysToWeek:Math.floor(this.totalSecsLeft/60/60/24)%7,daysToMonth:Math.floor(this.totalSecsLeft/60/60/24%30.4368),weeks:Math.floor(this.totalSecsLeft/60/60/24/7),weeksToMonth:Math.floor(this.totalSecsLeft/60/60/24/7)%4,months:Math.floor(this.totalSecsLeft/60/60/24/30.4368),years:Math.abs(this.finalDate.getFullYear()-b.getFullYear()),totalDays:Math.floor(this.totalSecsLeft/60/60/24),totalHours:Math.floor(this.totalSecsLeft/60/60),totalMinutes:Math.floor(this.totalSecsLeft/60),totalSeconds:this.totalSecsLeft},void(this.options.elapse||0!==this.totalSecsLeft?this.dispatchEvent("update"):(this.stop(),this.dispatchEvent("finish"))))},dispatchEvent:function(b){var c=a.Event(b+".countdown");c.finalDate=this.finalDate,c.elapsed=this.elapsed,c.offset=a.extend({},this.offset),c.strftime=d(this.offset),this.$el.trigger(c)}}),a.fn.countdown=function(){var b=Array.prototype.slice.call(arguments,0);return this.each(function(){var c=a(this).data("countdown-instance");if(void 0!==c){var d=f[c],e=b[0];j.prototype.hasOwnProperty(e)?d[e].apply(d,b.slice(1)):null===String(e).match(/^[$A-Z_][0-9A-Z_$]*$/i)?(d.setFinalDate.call(d,e),d.start()):a.error("Method %s does not exist on jQuery.countdown".replace(/\%s/gi,e))}else new j(this,b[0],b[1])})}});

dist/js/plugins/easyzoom.js

@@ -0,0 +1,7 @@
+/*!
+ * @name        easyzoom
+ * @author       <>
+ * @modified    Thursday, November 22nd, 2018
+ * @version     2.5.2
+ */
+!function(t,e){"use strict";"function"==typeof define&&define.amd?define(["jquery"],function(t){e(t)}):"object"==typeof module&&module.exports?module.exports=t.EasyZoom=e(require("jquery")):t.EasyZoom=e(t.jQuery)}(this,function(i){"use strict";var c,d,l,p,u,f,o={loadingNotice:"Loading image",errorNotice:"The image could not be loaded",errorDuration:2500,linkAttribute:"href",preventClicks:!0,beforeShow:i.noop,beforeHide:i.noop,onShow:i.noop,onHide:i.noop,onMove:i.noop};function s(t,e){this.$target=i(t),this.opts=i.extend({},o,e,this.$target.data()),void 0===this.isOpen&&this._init()}return s.prototype._init=function(){this.$link=this.$target.find("a"),this.$image=this.$target.find("img"),this.$flyout=i('<div class="easyzoom-flyout" />'),this.$notice=i('<div class="easyzoom-notice" />'),this.$target.on({"mousemove.easyzoom touchmove.easyzoom":i.proxy(this._onMove,this),"mouseleave.easyzoom touchend.easyzoom":i.proxy(this._onLeave,this),"mouseenter.easyzoom touchstart.easyzoom":i.proxy(this._onEnter,this)}),this.opts.preventClicks&&this.$target.on("click.easyzoom",function(t){t.preventDefault()})},s.prototype.show=function(t,e){var o=this;if(!1!==this.opts.beforeShow.call(this)){if(!this.isReady)return this._loadImage(this.$link.attr(this.opts.linkAttribute),function(){!o.isMouseOver&&e||o.show(t)});this.$target.append(this.$flyout);var i=this.$target.outerWidth(),s=this.$target.outerHeight(),h=this.$flyout.width(),n=this.$flyout.height(),a=this.$zoom.width(),r=this.$zoom.height();(c=a-h)<0&&(c=0),(d=r-n)<0&&(d=0),l=c/i,p=d/s,this.isOpen=!0,this.opts.onShow.call(this),t&&this._move(t)}},s.prototype._onEnter=function(t){var e=t.originalEvent.touches;this.isMouseOver=!0,e&&1!=e.length||(t.preventDefault(),this.show(t,!0))},s.prototype._onMove=function(t){this.isOpen&&(t.preventDefault(),this._move(t))},s.prototype._onLeave=function(){this.isMouseOver=!1,this.isOpen&&this.hide()},s.prototype._onLoad=function(t){t.currentTarget.width&&(this.isReady=!0,this.$notice.detach(),this.$flyout.html(this.$zoom),this.$target.removeClass("is-loading").addClass("is-ready"),t.data.call&&t.data())},s.prototype._onError=function(){var t=this;this.$notice.text(this.opts.errorNotice),this.$target.removeClass("is-loading").addClass("is-error"),this.detachNotice=setTimeout(function(){t.$notice.detach(),t.detachNotice=null},this.opts.errorDuration)},s.prototype._loadImage=function(t,e){var o=new Image;this.$target.addClass("is-loading").append(this.$notice.text(this.opts.loadingNotice)),this.$zoom=i(o).on("error",i.proxy(this._onError,this)).on("load",e,i.proxy(this._onLoad,this)),o.style.position="absolute",o.src=t},s.prototype._move=function(t){if(0===t.type.indexOf("touch")){var e=t.touches||t.originalEvent.touches;u=e[0].pageX,f=e[0].pageY}else u=t.pageX||u,f=t.pageY||f;var o=this.$target.offset(),i=f-o.top,s=u-o.left,h=Math.ceil(i*p),n=Math.ceil(s*l);if(n<0||h<0||c<n||d<h)this.hide();else{var a=-1*h,r=-1*n;this.$zoom.css({top:a,left:r}),this.opts.onMove.call(this,a,r)}},s.prototype.hide=function(){this.isOpen&&!1!==this.opts.beforeHide.call(this)&&(this.$flyout.detach(),this.isOpen=!1,this.opts.onHide.call(this))},s.prototype.swap=function(t,e,o){this.hide(),this.isReady=!1,this.detachNotice&&clearTimeout(this.detachNotice),this.$notice.parent().length&&this.$notice.detach(),this.$target.removeClass("is-loading is-ready is-error"),this.$image.attr({src:t,srcset:i.isArray(o)?o.join():o}),this.$link.attr(this.opts.linkAttribute,e)},s.prototype.teardown=function(){this.hide(),this.$target.off(".easyzoom").removeClass("is-loading is-ready is-error"),this.detachNotice&&clearTimeout(this.detachNotice),delete this.$link,delete this.$zoom,delete this.$image,delete this.$notice,delete this.$flyout,delete this.isOpen,delete this.isReady},i.fn.easyZoom=function(e){return this.each(function(){var t=i.data(this,"easyZoom");t?void 0===t.isOpen&&t._init():i.data(this,"easyZoom",new s(this,e))})},s});

dist/js/plugins/jquery-ui-touch-punch.js

@@ -0,0 +1,11 @@
+/*!
+ * jQuery UI Touch Punch 0.2.3
+ *
+ * Copyright 2011–2014, Dave Furfero
+ * Dual licensed under the MIT or GPL Version 2 licenses.
+ *
+ * Depends:
+ *  jquery.ui.widget.js
+ *  jquery.ui.mouse.js
+ */
+!function(a){function f(a,b){if(!(a.originalEvent.touches.length>1)){a.preventDefault();var c=a.originalEvent.changedTouches[0],d=document.createEvent("MouseEvents");d.initMouseEvent(b,!0,!0,window,1,c.screenX,c.screenY,c.clientX,c.clientY,!1,!1,!1,!1,0,null),a.target.dispatchEvent(d)}}if(a.support.touch="ontouchend"in document,a.support.touch){var e,b=a.ui.mouse.prototype,c=b._mouseInit,d=b._mouseDestroy;b._touchStart=function(a){var b=this;!e&&b._mouseCapture(a.originalEvent.changedTouches[0])&&(e=!0,b._touchMoved=!1,f(a,"mouseover"),f(a,"mousemove"),f(a,"mousedown"))},b._touchMove=function(a){e&&(this._touchMoved=!0,f(a,"mousemove"))},b._touchEnd=function(a){e&&(f(a,"mouseup"),f(a,"mouseout"),this._touchMoved||f(a,"click"),e=!1)},b._mouseInit=function(){var b=this;b.element.bind({touchstart:a.proxy(b,"_touchStart"),touchmove:a.proxy(b,"_touchMove"),touchend:a.proxy(b,"_touchEnd")}),c.call(b)},b._mouseDestroy=function(){var b=this;b.element.unbind({touchstart:a.proxy(b,"_touchStart"),touchmove:a.proxy(b,"_touchMove"),touchend:a.proxy(b,"_touchEnd")}),d.call(b)}}}(jQuery);

dist/js/plugins/jquery.nice-select.min.js

@@ -0,0 +1,4 @@
+/*  jQuery Nice Select - v1.0
+    https://github.com/hernansartorio/jquery-nice-select
+    Made by Hernán Sartorio  */
+!function(e){e.fn.niceSelect=function(t){function s(t){t.after(e("<div></div>").addClass("nice-select").addClass(t.attr("class")||"").addClass(t.attr("disabled")?"disabled":"").attr("tabindex",t.attr("disabled")?null:"0").html('<span class="current"></span><ul class="list"></ul>'));var s=t.next(),n=t.find("option"),i=t.find("option:selected");s.find(".current").html(i.data("display")||i.text()),n.each(function(t){var n=e(this),i=n.data("display");s.find("ul").append(e("<li></li>").attr("data-value",n.val()).attr("data-display",i||null).addClass("option"+(n.is(":selected")?" selected":"")+(n.is(":disabled")?" disabled":"")).html(n.text()))})}if("string"==typeof t)return"update"==t?this.each(function(){var t=e(this),n=e(this).next(".nice-select"),i=n.hasClass("open");n.length&&(n.remove(),s(t),i&&t.next().trigger("click"))}):"destroy"==t?(this.each(function(){var t=e(this),s=e(this).next(".nice-select");s.length&&(s.remove(),t.css("display",""))}),0==e(".nice-select").length&&e(document).off(".nice_select")):console.log('Method "'+t+'" does not exist.'),this;this.hide(),this.each(function(){var t=e(this);t.next().hasClass("nice-select")||s(t)}),e(document).off(".nice_select"),e(document).on("click.nice_select",".nice-select",function(t){var s=e(this);e(".nice-select").not(s).removeClass("open"),s.toggleClass("open"),s.hasClass("open")?(s.find(".option"),s.find(".focus").removeClass("focus"),s.find(".selected").addClass("focus")):s.focus()}),e(document).on("click.nice_select",function(t){0===e(t.target).closest(".nice-select").length&&e(".nice-select").removeClass("open").find(".option")}),e(document).on("click.nice_select",".nice-select .option:not(.disabled)",function(t){var s=e(this),n=s.closest(".nice-select");n.find(".selected").removeClass("selected"),s.addClass("selected");var i=s.data("display")||s.text();n.find(".current").text(i),n.prev("select").val(s.data("value")).trigger("change")}),e(document).on("keydown.nice_select",".nice-select",function(t){var s=e(this),n=e(s.find(".focus")||s.find(".list .option.selected"));if(32==t.keyCode||13==t.keyCode)return s.hasClass("open")?n.trigger("click"):s.trigger("click"),!1;if(40==t.keyCode){if(s.hasClass("open")){var i=n.nextAll(".option:not(.disabled)").first();i.length>0&&(s.find(".focus").removeClass("focus"),i.addClass("focus"))}else s.trigger("click");return!1}if(38==t.keyCode){if(s.hasClass("open")){var l=n.prevAll(".option:not(.disabled)").first();l.length>0&&(s.find(".focus").removeClass("focus"),l.addClass("focus"))}else s.trigger("click");return!1}if(27==t.keyCode)s.hasClass("open")&&s.trigger("click");else if(9==t.keyCode&&s.hasClass("open"))return!1});var n=document.createElement("a").style;return n.cssText="pointer-events:auto","auto"!==n.pointerEvents&&e("html").addClass("no-csspointerevents"),this}}(jQuery);

dist/js/plugins/scrollup.js

@@ -0,0 +1,11 @@
+
+/*
+ * 
+ * scrollup 
+ * Url: http://markgoodyear.com/labs/scrollup/
+ * v2.4.1
+ * 
+ */
+!function(l,o,e){"use strict";l.fn.scrollUp=function(o){l.data(e.body,"scrollUp")||(l.data(e.body,"scrollUp",!0),l.fn.scrollUp.init(o))},l.fn.scrollUp.init=function(r){var s,t,c,i,n,a,d,p=l.fn.scrollUp.settings=l.extend({},l.fn.scrollUp.defaults,r),f=!1;switch(d=p.scrollTrigger?l(p.scrollTrigger):l("<a/>",{id:p.scrollName,href:"#top"}),p.scrollTitle&&d.attr("title",p.scrollTitle),d.appendTo("body"),p.scrollImg||p.scrollTrigger||d.html(p.scrollText),d.css({display:"none",position:"fixed",zIndex:p.zIndex}),p.activeOverlay&&l("<div/>",{id:p.scrollName+"-active"}).css({position:"absolute",top:p.scrollDistance+"px",width:"100%",borderTop:"1px dotted"+p.activeOverlay,zIndex:p.zIndex}).appendTo("body"),p.animation){case"fade":s="fadeIn",t="fadeOut",c=p.animationSpeed;break;case"slide":s="slideDown",t="slideUp",c=p.animationSpeed;break;default:s="show",t="hide",c=0}i="top"===p.scrollFrom?p.scrollDistance:l(e).height()-l(o).height()-p.scrollDistance,n=l(o).scroll(function(){l(o).scrollTop()>i?f||(d[s](c),f=!0):f&&(d[t](c),f=!1)}),p.scrollTarget?"number"==typeof p.scrollTarget?a=p.scrollTarget:"string"==typeof p.scrollTarget&&(a=Math.floor(l(p.scrollTarget).offset().top)):a=0,d.click(function(o){o.preventDefault(),l("html, body").animate({scrollTop:a},p.scrollSpeed,p.easingType)})},l.fn.scrollUp.defaults={scrollName:"scrollUp",scrollDistance:300,scrollFrom:"top",scrollSpeed:300,easingType:"linear",animation:"fade",animationSpeed:200,scrollTrigger:!1,scrollTarget:!1,scrollText:"Scroll to top",scrollTitle:!1,scrollImg:!1,activeOverlay:!1,zIndex:2147483647},l.fn.scrollUp.destroy=function(r){l.removeData(e.body,"scrollUp"),l("#"+l.fn.scrollUp.settings.scrollName).remove(),l("#"+l.fn.scrollUp.settings.scrollName+"-active").remove(),l.fn.jquery.split(".")[1]>=7?l(o).off("scroll",r):l(o).unbind("scroll",r)},l.scrollUp=l.fn.scrollUp}(jQuery,window,document);
+
+

dist/js/plugins/svg-injector.min.js

@@ -0,0 +1,8 @@
+/**
+ * SVGInjector v1.1.3 - Fast, caching, dynamic inline SVG DOM injection library
+ * https://github.com/iconic/SVGInjector
+ *
+ * Copyright (c) 2014-2015 Waybury <hello@waybury.com>
+ * @license MIT
+ */
+!function(t,e){"use strict";function r(t){t=t.split(" ");for(var e={},r=t.length,n=[];r--;)e.hasOwnProperty(t[r])||(e[t[r]]=1,n.unshift(t[r]));return n.join(" ")}var n="file:"===t.location.protocol,i=e.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#BasicStructure","1.1"),o=Array.prototype.forEach||function(t,e){if(void 0===this||null===this||"function"!=typeof t)throw new TypeError;var r,n=this.length>>>0;for(r=0;n>r;++r)r in this&&t.call(e,this[r],r,this)},a={},l=0,s=[],u=[],c={},f=function(t){return t.cloneNode(!0)},p=function(t,e){u[t]=u[t]||[],u[t].push(e)},d=function(t){for(var e=0,r=u[t].length;r>e;e++)!function(e){setTimeout(function(){u[t][e](f(a[t]))},0)}(e)},v=function(e,r){if(void 0!==a[e])a[e]instanceof SVGSVGElement?r(f(a[e])):p(e,r);else{if(!t.XMLHttpRequest)return r("Browser does not support XMLHttpRequest"),!1;a[e]={},p(e,r);var i=new XMLHttpRequest;i.onreadystatechange=function(){if(4===i.readyState){if(404===i.status||null===i.responseXML)return r("Unable to load SVG file: "+e),n&&r("Note: SVG injection ajax calls do not work locally without adjusting security setting in your browser. Or consider using a local webserver."),r(),!1;if(!(200===i.status||n&&0===i.status))return r("There was a problem injecting the SVG: "+i.status+" "+i.statusText),!1;if(i.responseXML instanceof Document)a[e]=i.responseXML.documentElement;else if(DOMParser&&DOMParser instanceof Function){var t;try{var o=new DOMParser;t=o.parseFromString(i.responseText,"text/xml")}catch(l){t=void 0}if(!t||t.getElementsByTagName("parsererror").length)return r("Unable to parse SVG file: "+e),!1;a[e]=t.documentElement}d(e)}},i.open("GET",e),i.overrideMimeType&&i.overrideMimeType("text/xml"),i.send()}},h=function(e,n,a,u){var f=e.getAttribute("data-src")||e.getAttribute("src");if(!/\.svg/i.test(f))return void u("Attempted to inject a file with a non-svg extension: "+f);if(!i){var p=e.getAttribute("data-fallback")||e.getAttribute("data-png");return void(p?(e.setAttribute("src",p),u(null)):a?(e.setAttribute("src",a+"/"+f.split("/").pop().replace(".svg",".png")),u(null)):u("This browser does not support SVG and no PNG fallback was defined."))}-1===s.indexOf(e)&&(s.push(e),e.setAttribute("src",""),v(f,function(i){if("undefined"==typeof i||"string"==typeof i)return u(i),!1;var a=e.getAttribute("id");a&&i.setAttribute("id",a);var p=e.getAttribute("title");p&&i.setAttribute("title",p);var d=[].concat(i.getAttribute("class")||[],"injected-svg",e.getAttribute("class")||[]).join(" ");i.setAttribute("class",r(d));var v=e.getAttribute("style");v&&i.setAttribute("style",v);var h=[].filter.call(e.attributes,function(t){return/^data-\w[\w\-]*$/.test(t.name)});o.call(h,function(t){t.name&&t.value&&i.setAttribute(t.name,t.value)});var g,m,b,y,A,w={clipPath:["clip-path"],"color-profile":["color-profile"],cursor:["cursor"],filter:["filter"],linearGradient:["fill","stroke"],marker:["marker","marker-start","marker-mid","marker-end"],mask:["mask"],pattern:["fill","stroke"],radialGradient:["fill","stroke"]};Object.keys(w).forEach(function(t){g=t,b=w[t],m=i.querySelectorAll("defs "+g+"[id]");for(var e=0,r=m.length;r>e;e++){y=m[e].id,A=y+"-"+l;var n;o.call(b,function(t){n=i.querySelectorAll("["+t+'*="'+y+'"]');for(var e=0,r=n.length;r>e;e++)n[e].setAttribute(t,"url(#"+A+")")}),m[e].id=A}}),i.removeAttribute("xmlns:a");for(var x,S,k=i.querySelectorAll("script"),j=[],G=0,T=k.length;T>G;G++)S=k[G].getAttribute("type"),S&&"application/ecmascript"!==S&&"application/javascript"!==S||(x=k[G].innerText||k[G].textContent,j.push(x),i.removeChild(k[G]));if(j.length>0&&("always"===n||"once"===n&&!c[f])){for(var M=0,V=j.length;V>M;M++)new Function(j[M])(t);c[f]=!0}var E=i.querySelectorAll("style");o.call(E,function(t){t.textContent+=""}),e.parentNode.replaceChild(i,e),delete s[s.indexOf(e)],e=null,l++,u(i)}))},g=function(t,e,r){e=e||{};var n=e.evalScripts||"always",i=e.pngFallback||!1,a=e.each;if(void 0!==t.length){var l=0;o.call(t,function(e){h(e,n,i,function(e){a&&"function"==typeof a&&a(e),r&&t.length===++l&&r(l)})})}else t?h(t,n,i,function(e){a&&"function"==typeof a&&a(e),r&&r(1),t=null}):r&&r(0)};"object"==typeof module&&"object"==typeof module.exports?module.exports=exports=g:"function"==typeof define&&define.amd?define(function(){return g}):"object"==typeof t&&(t.SVGInjector=g)}(window,document);

dist/js/product.js

@@ -0,0 +1,67 @@
+
+async function getDataStatAxios(url) {
+    const config = {
+        url,
+        method: 'get',
+        headers: {
+            'Authorization': `stat 05b2f2ca510344968c65e1ebf49a5595`,
+        }
+    };
+
+    let response = await axios(config);
+    let item_array = JSON.parse(response.data.result);
+    $.each(item_array, function (key, value) {
+        let item_html = `
+            <div class="col-lg-4 col-md-6 pb-3 items_ptoducts" data_item_search="${value.productname}">
+                <div class="card h-100 shadow border-0 p-1">
+                    <div class="card-head text-center">
+                    <img src="../dist/assets/imgs/Navbar/Accessiories-1.png" class="img-fluid"/>
+                    </div>
+                    <div class="card-body">
+                        <ul style="list-style:none" class="h-10p p-0">
+                            <li class="border-bottom py-1 satoshi_font">${value.productname}</li>
+                            <li class="border-bottom py-1 d-none satoshi_font">${value.itemname}</li>
+                            <li class="border-bottom py-1 d-none satoshi_font">${value.sku}</li>
+                        </ul>
+                        <div>
+                        <a href="#" class="bg-black btn font-1-2 px-5 rounded-5 text-white w-100 satoshi_font" data_detail="${value.productid}">Details</a>
+                        </div>
+                    </div>
+                </div>
+            </div>`;
+        // $(".product_name").html(value.productname);
+        $(".item_details").append(item_html);
+    })
+    $(".item_details").find(".items_ptoducts").each(function(){
+        $(this).find(".card_body").find("a.btn").click(function(){
+            let product_id = $(this).find(".card-body").find("a.btn").attr("data_detail");
+            let loc_path = '/productdetails.html'
+                   if (window.location.pathname.includes(loc_path)) {
+                       window.location.href = `?itemid=${product_id}`
+                   }
+                   else {
+                       window.location.href = `/productdetails.html?itemid=${product_id}`;
+                   }
+        })
+    });
+}
+let port = SERVERNAME
+let loc_id = window.location.search;
+let loc_url = loc_id.split("=");
+let locpath = "/products.html?products";
+let url;
+if (window.location.href.includes(locpath)) {
+    url = `${port}/apis/v4/bizgaze/integrations/products/getallproducts`;
+}else{
+    url = `${port}/apis/v4/bizgaze/integrations/products/getproductsbyid/itemgroupid/${loc_url[1]}`;
+}
+getDataStatAxios(url);
+
+$("#item_search").on("keyup", function() {
+    var value = $(this).val().toLowerCase();
+    $(".list_items").find(".items_ptoducts").filter(function() {
+      $(this).toggle($(this).attr("data_item_search").toLowerCase().indexOf(value) > -1)
+    });
+});
+
+

dist/js/productdetails/laptopd.js

@@ -0,0 +1,943 @@
+function startDetails() {
+    // http://127.0.0.1:5502/productdetails.html?productId=106633230000024
+    
+    if (window.location.search.split('=')[0] == '') {
+        window.location.href = "/notfound.html";
+        return;
+    }
+    let productId = window.location.hash.split('#')[1].split('=')[1];
+   // console.log(productId);
+    let itemtagscombinationRes = null;
+    let labels = {};
+    let isThereInLabel = {};
+    let currentComb = null;
+
+    let colorId = null;
+
+    let group = {};
+
+    let loadingActions = {
+        addLoader() {
+            $('.loadingCall').removeClass('d-none');
+            $('.mainContanierProduct').addClass('d-none');
+        },
+        removeLoader() {
+            $('.loadingCall').addClass('d-none');
+            $('.mainContanierProduct').removeClass('d-none');
+        }
+    }
+
+    let currentClick = null;
+
+    if (productId) {
+        swapSectionsVideo();
+        loadingActions.addLoader();
+        updateProductId(productId);
+        getProductDetails(productId);
+        appendSpecs(productId)
+    } else {
+        window.location.href = "/notfound.html"
+    }
+
+    function updateProductId(val) {
+        $('#productidtag').val(val);
+    }
+
+    function updateItemId(val) {
+        $('#itemidtag').val(val);
+    }
+
+    let specification_wrap_action = {
+        remove() {
+
+            $('.specification-wrap').addClass('d-none');
+        },
+
+        add() {
+            $('.specification-wrap').removeClass('d-none');
+        }
+    }
+
+    let description_action = {
+        addVal(value) {
+            $('.description-wrap > p').html(value);
+        },
+
+        removeVal(value) {
+            $('.description-wrap > p').html('');
+        }
+    }
+
+    function getSpecsItemHTML({ name, des, itemid, id }) {
+        let isMobile = $(window).width()<=600 ? '' : '';
+        let addPaddM =  $(window).width()<=600 ? 'py-2' : 'py-4';
+        return `<div id="${id}" data-specitemid="${itemid}" >
+        <div class="row   border-bottom">
+            <div class="col-sm-3 ${isMobile} font-weight-600  ${addPaddM} ">
+            ${name}
+            </div>
+            <div class="col-sm-9  py-2 d-flex align-items-center">
+            ${des}	
+            </div>
+        </div>
+    </div>`;
+    }
+    // function getSpecsItemHTML({name,des,itemid,id}){
+    //     return ` <tr id="${id}" data-specitemid="${itemid}">
+    //     <td style="width:200px">${name}</td>
+    //     <td class="">${des}</td>
+    // </tr>`;
+    // }
+
+    async function appendSpecs(id) {
+        let resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/itemspecifications/itemid/${id}`, true);
+
+        if (resData.isError) {
+            $('.productdetailstabs').addClass('d-none');
+            $('.specContainerleft').html('')
+            $('.specContainerRight').html('')
+            return;
+        }
+        $('.productdetailstabs ').removeClass('d-none');
+        const res = resData.response;
+   //     console.log(JSON.parse(res.result));
+        const data = JSON.parse(res.result);
+     //   console.log(data);
+        let html = '';
+        let leftHtml = '';
+        let rightHtml = '';
+
+        if (data.length == 0) {
+            $('.productdetailstabs ').addClass('d-none');
+            $('.specContainerleft').html('')
+            $('.specContainerRight').html('')
+            return;
+        }
+
+        for (let i = 0; i < data.length; i++) {
+            const { specificationname, specificationitemid, itemid, description } = data[i];
+            if ((i + 1) % 2 == 0) {
+                rightHtml += getSpecsItemHTML({
+                    name: specificationname, id: specificationitemid, itemid, des: description
+                })
+            } else {
+                leftHtml += getSpecsItemHTML({
+                    name: specificationname, id: specificationitemid, itemid, des: description
+                });
+            }
+
+        }
+
+        $('.specContainerleft').html(leftHtml)
+        $('.specContainerRight').html(rightHtml)
+
+    }
+
+
+    function getParentHTML(name, productid, id, isMain) {
+        return `<div data-parentidgroup="${name?.replace(" ", '')}-parent" class="pb-2 groupingitems_search ${name?.replace(" ", '')}-parent">
+        <h5 class="py-2 smallHeadingProductDetails">${name}</h5>
+        <div class="d-flex gap-2 flex-lg-row flex-wrap ${id}container" data-tagid="${id}">
+           
+        </div>
+    </div>`;
+    }
+
+    function onClickHandler(e) {
+
+        $(e).parent().find('.borderselector').removeClass('borderselector');
+
+        $(e).addClass('borderselector')
+
+    }
+
+    function getChildHTML(tagid, name, isTrue,parentid) {
+
+        let blue = '#253746';
+        let greenLight = '#5e7975';
+        let brown = '#624839';
+        let bgColor = '';
+       if(name === 'Deep Sea Blue'){
+        bgColor = blue;
+       }else if(name == 'Desert Brown'){
+        bgColor =  brown;
+       }else if(name == 'Eucalyptus Green'){
+        bgColor = greenLight;
+       }
+
+        if(colorId == parentid){
+            return `
+            <div data-type="${tagid}-${name}" data-tagiditem="${tagid}" class="specsmallcard optiontaganwi ${isTrue ? 'borderselector' : ''} colorselector card text-center small-font cursor-pointer ">
+        <span  style="
+        height: 25px;
+        border-radius: 5px;
+        width:25px;
+        background: ${bgColor} !important;
+        pointer-events:none;
+      
+    "></span>
+            </div> `
+        }
+        return `
+            <div data-type="${tagid}-${name}" data-tagiditem="${tagid}" class="specsmallcard optiontaganwi ${isTrue ? 'borderselector' : ''} card text-center small-font cursor-pointer p-3">
+                ${name}
+            </div> `
+
+
+    }
+
+    function addeventlisteners() {
+
+        $('.optiontaganwi').each(function (i, el) {
+            $(el).click(function (e) {
+                
+                $('#quantity').val(1);
+
+                $(e.target).parent().find('.borderselector').removeClass('borderselector');
+                $(e.target).addClass('borderselector');
+            
+                currentClick = e.target;
+                ;
+             //searchComb();
+                // getAllCombination();
+                getandsetCombination();
+              
+            })
+        });
+
+    }
+
+    function getandsetCombination(){
+        
+        let keyOption = $(currentClick).data('tagiditem');
+        $('.disabled-option-item').removeClass('disabled-option-item');
+        let tagsNames = [];
+     
+       
+
+        let currOptionAvaIds = {};
+       
+        $('.borderselector').each(function (i,e){
+            let id = $(e).data('tagiditem');
+            tagsNames.push(id);
+        });
+      
+
+        for(let i=0;i<itemtagscombinationRes.length;i++){
+            let tagItems = itemtagscombinationRes[i].tagids;;
+            if(tagItems.includes(keyOption)){
+                let splitArr = tagItems.split('|');
+                for(let j=0;j<splitArr.length;j++){
+                    if(keyOption){
+                        currOptionAvaIds[splitArr[j]] = splitArr[j];
+                    }
+                  
+                }
+            }
+        }
+
+      //  console.log(currOptionAvaIds);
+//console.log(itemtagscombinationRes);
+        let parentsArr = []; 
+        $('.optiontaganwi').each(function (i,e){
+           
+            let currParent = $(e).parents('.groupingitems_search');
+        
+            if(currParent.find(`[data-tagiditem="${keyOption}"]`).length==0){
+                let currId = $(e).data('tagiditem');
+                if(!currOptionAvaIds[currId]){
+                    if($(e).hasClass('borderselector')){
+                        parentsArr.push(currParent);
+                        $(e).removeClass('borderselector');
+                    }
+                    $(e).addClass('disabled-option-item');
+                }
+            }
+        });
+
+        for(let i=0;i<parentsArr.length;i++){
+            let currParent = parentsArr[i];
+            currParent.find('.optiontaganwi').each(function (j,e){
+                let isTrue = $(e).hasClass('disabled-option-item');
+                if(!isTrue){
+                    $(e).addClass('borderselector');
+                    return false; 
+                }
+            });
+        }
+
+        // $('.optiontaganwi').addClass('disabled-option-item');
+        let parentId = $(currentClick).parents('.groupingitems_search');
+        let parentData = $(parentId).data('parentidgroup');
+        let parentArr = [];
+       $('.groupingitems_search').each(function (i,e){
+           const curParentId =  $(e).data('parentidgroup');
+           if(parentData != curParentId){
+            let obj = {
+                name:$(e).find('.smallHeadingProductDetails').html(),
+                arr:[]
+            }
+                $(e).find('.optiontaganwi').each(function (j,evt){
+                    let id = $(evt).data('tagiditem');
+                    obj.arr.push(id);
+                });
+                parentArr.push(obj);
+
+           }
+       })
+
+      // console.log(parentArr);
+
+       let arrone = parentArr[0].arr;
+       let arrtwo = []; 
+       if(parentArr.length>1){
+        arrtwo = parentArr[1]?.arr;
+       }
+
+       let currId = keyOption;
+       let ids = [];
+       for(let i=0;i<arrone.length;i++){
+        //let currEl = [currId,arrone[i]];
+        let currEl = ``
+        for(let j=0;j<arrtwo.length;j++){
+            currEl = `${currId}|${arrone[i]}|${arrtwo[j]}`;
+
+            ids.push(currEl);
+            currEl = '';
+        }
+        
+       }
+       console.log(ids,'ids');
+       let findObj = [];
+       debugger 
+       for(let i=0;i<ids.length;i++){
+      
+        let curId = ids[i]
+        for(let j=0;j<itemtagscombinationRes.length;j++){
+            const currItem = itemtagscombinationRes[j].tagids.split('|');
+            let isTrue = true;
+            for(let k=0;k<currItem.length;k++){
+                if(!curId.includes(currItem[k])){
+                    isTrue = false;
+                    break;
+                }
+            }
+
+            if(isTrue){
+                findObj.push(itemtagscombinationRes[j]);
+            }
+        }
+       }
+
+
+       //console.log(findObj);
+
+       $('.optiontaganwi').addClass('disabled-option-item');
+
+debugger;
+       for(let i=0;i<findObj.length;i++){
+
+        let item = findObj[i].tagids.split('|');
+        for(let j=0;j<item.length;j++){
+            $(`[data-tagiditem=${item[j]}]`).removeClass('disabled-option-item');
+        }
+       
+       }
+
+       $(parentId).find('.optiontaganwi').each(function (i,e){
+        $(e).removeClass('disabled-option-item')
+       });
+
+
+       for(let i=0;i<itemtagscombinationRes.length;i++){
+        let currIds = itemtagscombinationRes[i].tagids;
+        let isTrue = true;
+        let isPro = false;
+
+        for(let j=0;j<tagsNames.length;j++){
+            if(tagsNames.join().includes('106631360000128')&&(tagsNames.join().includes('106631360000132')||tagsNames.join().includes('106631360000133'))){
+                isPro = true;
+            }
+            if(!currIds.includes(tagsNames[j])){
+                isTrue = false;
+            }
+        }
+
+        if(isTrue){
+            const { quantity } = itemtagscombinationRes[i];
+            if (true) {
+                currentComb = itemtagscombinationRes[i];
+              
+                updateDetailsByObj(itemtagscombinationRes[i]);
+
+                if(isPro){
+                    $(`[data-tagiditem="106631360000089"]`).addClass(' disabled-option-item')
+                    $(`[data-tagiditem="106631360000088"]`).addClass(' disabled-option-item')
+                }
+
+                
+            } else {
+
+                let name = itemtagscombinationRes[i].itemname.split('-')[0];
+                $('#addtocart').addClass('disabled');
+                let itemsName = name;
+                $('.borderselector').each(function (i, e) {
+                    itemsName += ` ${$(e).html().trim()}`;
+                });
+
+                updateItemId(null);
+
+                let defaultImg = itemtagscombinationRes[i].itemimageurl ? imgServerNameBuild(itemtagscombinationRes[i].itemimageurl) : `./dist/assets/imgs/nophoto.png`;
+            
+                $('.productDetailsMain  > img').attr('src', defaultImg);
+
+                specification_wrap_action.remove();
+                $('#skudetailitem').val(-1)
+                $('.productname').html(itemsName)
+               
+
+                $('.msgErrorDetailsItem').removeClass('d-none');
+                $('.des_productdes').html('');
+                $('.price').html('');
+            }
+
+            initAddToCart()
+            return;
+        }
+        
+       }
+
+   
+       
+   
+        // return;
+
+    
+
+
+        return;
+        let commonTags = [];
+      //  $('.optiontaganwi').addClass('disabled-option-item')
+
+        for(let i=0;i<tagsNames.length;i++){
+            let currtagName = tagsNames[i];
+            let arr = currtagItemCom(currtagName);
+            commonTags.push(arr);
+        }
+
+        
+
+         console.log(commonTags);
+
+        // for(let i=0;i<commonTags.length;i++){
+        //     let currObj = commonTags[i];
+        //     for(let item in currObj){
+        //         console.log($(`[data-tagiditem="${item}"]`));
+        //         $(`[data-tagiditem="${item}"]`).removeClass('disabled-option-item')
+        //     }
+        // }
+
+        let finalAns = {};
+        let arra = [];
+        for(let i=0;i<commonTags.length;i++){
+            let currObj = commonTags[i];
+            for(let item in currObj){
+                let isTrue = true;
+                for(let j=0;j<commonTags.length;j++){
+                    if(j!=i){
+                        let currComb = commonTags[j];
+                        if(!currComb[item]){
+                            isTrue = false;
+                        }
+                    }
+                }
+                if(isTrue){
+                    arra.push(currObj[item])
+                    finalAns[currObj[item]] = currObj[item];
+                    $(`[data-tagiditem="${item}"]`).removeClass('disabled-option-item')
+                }
+            }
+        }
+
+        // console.log(arra);
+
+        
+        
+
+       
+       
+        // for(let i=0;i<itemtagscombinationRes.length;i++){
+        //     let tagItems = itemtagscombinationRes[i].tagids;;
+        //     if(tagItems.includes(keyOption)){
+        //         let splitArr = tagItems.split('|');
+        //         for(let j=0;j<splitArr.length;j++){
+        //             commonTags[splitArr[j]] = splitArr[j];
+        //         }
+        //     }
+        // }
+
+
+
+        // for(let i=0;i<currOptionAvaIds.length;i++){
+        //     let currId = currOptionAvaIds[i];
+        //     if(parentId.find(currId).length === 0){
+        //         console.log(currId);
+        //     }
+        // }
+    }
+
+    
+    
+    function currtagItemCom(keyOption){
+        debugger;
+        let arr = [];
+        let commonTags = {};
+        for(let i=0;i<itemtagscombinationRes.length;i++){
+            let tagItems = itemtagscombinationRes[i].tagids;;
+            if(tagItems.includes(keyOption)){
+                let splitArr = tagItems.split('|');
+                for(let j=0;j<splitArr.length;j++){
+                    if(!commonTags[splitArr[j]]){
+                        commonTags[splitArr[j]] = {
+                        keyOption,
+                        data:itemtagscombinationRes[i]
+                        };
+                        arr.push(splitArr[j]);
+
+                    }
+                    
+                }
+            }
+        }
+
+        return commonTags;
+    }
+
+
+
+    function updateDetailsByObj(obj) {
+        $('.productname').html(obj.itemname);
+        $('.titleproductnav').html(obj.itemname);
+        let  [currencySymbol, amount] = getCurrencySymbol(obj?.pricelist||0);
+
+        let commingSoonText = window.location.href.toLowerCase().includes('zeno')||window.location.href.toLowerCase().includes('fyro')
+        $('.price').html(obj.pricelist ? `<span class="font-w600">${currencySymbol}${amount}</span>${commingSoonText?'<span class="mx-1 badge  bg-gradient-violet text-a-color">Coming Soon</span>':''}` : 'coming soon');
+        $('.price').attr('data-price',obj.pricelist);
+        appendSpecs(obj.itemid)
+        $('#skudetailitem').val(obj.sku)
+        $('.des_productdes').html(obj.itemdescription);
+        $('#addtocart').attr('data-qty', obj.quantity);
+
+
+        let defaultImg = obj.itemimageurl ? imgServerNameBuild(obj.itemimageurl) : `./dist/assets/imgs/nophoto.png`;
+      //  console.log(obj.itemimageurl, 'obj.itemimageurlobj.itemimageurlobj.itemimageurl');
+debugger;
+let productId = window.location.hash.split('#')[1]?.split('=')[1];
+let itemId = window.location.hash.split('#')[2]?.split('=')[1];
+history.replaceState(undefined, undefined, `#productId=${productId}#itemid=${obj.itemid}`)
+        $('.productDetailsMain  > img').attr('src', defaultImg).attr('loading','lazy');
+
+        updateItemId(obj.itemid);
+
+//console.log(obj,'objobjobj');
+        if (!obj.pricelist || !obj.quantity) {
+            $('.buynow').attr('disabled', true);
+            $('#addtocart').attr('disabled', true);
+        } else {
+            $('.buynow').attr('disabled', false);
+            $('#addtocart').attr('disabled', false);
+        }
+    }
+
+    function searchComb() {
+        let valuesSelected = [];
+        $('.optiontaganwi').removeClass('disabled-option-item')
+
+        $('#addtocart').removeClass('disabled');
+        $('.msgErrorDetailsItem').addClass('d-none');
+        $('.borderselector,border_selector').each(function (i, el) {
+           // console.log($(el).html())
+            let val = $(el).data('tagiditem');
+            valuesSelected.push(val);
+        });
+
+        let labelRecord = {};
+
+        for (let label in labels) {
+            labelRecord[label] = false;
+        }
+
+        specification_wrap_action.add();
+   
+        let unFiler = null;
+        for (let i = 0; i < itemtagscombinationRes.length; i++) {
+            const currItem = itemtagscombinationRes[i];
+            const { tagids } = currItem;
+
+
+            let isTrue = true;
+            let labelFilter = labelRecord;
+
+            for (let i = 0; i < valuesSelected.length; i++) {
+
+                if (!tagids.includes(valuesSelected[i])) {
+                    isTrue = false
+
+                    unFiler = labelFilter;
+                    break;
+                }
+                labelFilter[group[valuesSelected[i]]] = true;
+            }
+
+            if (isTrue) {
+              //  console.log(itemtagscombinationRes[i], 'itemtagscombinationRes[i]');
+                const { quantity } = itemtagscombinationRes[i];
+                if (quantity >= $('#quantity').val() && quantity >= 1) {
+                    currentComb = itemtagscombinationRes[i];
+                    // $('.productname').html(itemtagscombinationRes[i].itemname)
+                    // $('.price').html(itemtagscombinationRes[i].pricelist);
+                    // location.hash = itemtagscombinationRes[i].itemname.trim();
+                    // appendSpecs(itemtagscombinationRes[i].itemid)
+                    // history.replaceState(null, null, `#itemid=${itemtagscombinationRes[i].itemid}#${itemtagscombinationRes[i].itemname.trim()}`);
+
+                    // $('#skudetailitem').val(itemtagscombinationRes[i].sku)
+                    // $('.des_productdes').html(itemtagscombinationRes[i].itemdescription);
+                    updateDetailsByObj(itemtagscombinationRes[i]);
+                } else {
+
+                    let name = itemtagscombinationRes[i].itemname.split('-')[0];
+                    $('#addtocart').addClass('disabled');
+                    let itemsName = name;
+                    $('.borderselector').each(function (i, e) {
+                        itemsName += ` ${$(e).html().trim()}`;
+                    });
+
+                    updateItemId(null);
+
+                    let defaultImg = itemtagscombinationRes[i].itemimageurl ? imgServerNameBuild(itemtagscombinationRes[i].itemimageurl) : `./dist/assets/imgs/nophoto.png`;
+                   // console.log(itemtagscombinationRes[i].itemimageurl, 'obj.itemimageurlobj.itemimageurlobj.itemimageurl');
+            
+                    $('.productDetailsMain  > img').attr('src', defaultImg);
+
+                    specification_wrap_action.remove();
+                    $('#skudetailitem').val(-1)
+                    $('.productname').html(itemsName)
+                    // history.replaceState(null, null, `#`);
+
+                    $('.msgErrorDetailsItem').removeClass('d-none');
+                    $('.des_productdes').html('');
+                    $('.price').html('');
+                }
+
+                initAddToCart()
+                return;
+
+            }
+
+        }
+
+        
+
+        alert("j");
+       
+        let name = itemtagscombinationRes[0].itemname.split('-')[0];
+        let itemsName = name;
+        $('.borderselector').each(function (i, e) {
+            itemsName += `- ${$(e).html().trim()}`;
+        })
+        specification_wrap_action.remove();
+        $('.productname').html(itemsName)
+        $('#skudetailitem').val(-1)
+        $('.price').html('');
+        $('#addtocart').addClass('disabled');
+        $('.msgErrorDetailsItem').removeClass('d-none');
+
+        initAddToCart()
+    }
+
+    function getAllCombination() {
+        debugger;
+        const currClickAttr = $(currentClick).html().trim();
+        const optionId = $(currentClick).data('tagiditem');
+
+        let curr = $(currentClick).parents('.groupingitems_search').data('parentidgroup');
+        $('.groupingitems_search').each(function (i, e) {
+            const id = $(e).data('parentidgroup');
+            if (id != curr) {
+                $(e).find('.optiontaganwi').addClass('disabled-option-item');
+                $(e).find('.borderselector').removeClass('borderselector');
+            }
+        });
+
+        let ansArr = [];
+        let index = 0;
+        let comb = null;
+        for(let i=0;i<itemtagscombinationRes.length;i++){
+          
+            let currIds = itemtagscombinationRes[i].tagids;
+          
+            if(currIds.includes(optionId)){
+                currIds = currIds.split('|');
+              
+                for(let j=0;j<currIds.length;j++){
+                    debugger;
+                    if(index==0 &&optionId != currIds[j] ) {
+                        $(`[data-tagiditem="${currIds[j]}"]`).addClass('borderselector')
+                        comb = itemtagscombinationRes[i];
+                        index++;
+                    }
+                    $(`[data-tagiditem="${currIds[j]}"]`).removeClass('disabled-option-item');
+                   
+                    // $().parents('[data-tagid]').find()
+                }    
+    
+            }
+
+            
+           
+        }
+
+      //  console.log(comb,'comb tag');
+
+        updateDetailsByObj(comb);
+
+        let currentItem = comb.tagids.split('|');
+
+        for(let i=0;i<currentItem.length;i++){
+            $(`[data-tagiditem="${currentItem[i]}"]`).removeClass('disabled-option-item').addClass('borderselector');
+        }
+
+        // history.replaceState(null, null, `#${comb.itemname}`);
+        // window.location.href =  `#${comb.itemname}`
+        console.log(itemtagscombinationRes,'gobal');
+        return;
+      
+
+    };
+
+
+   
+
+
+    async function getProductDetails(id) {
+
+
+        debugger;
+
+        let resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/productattributelist/productid/${id}`, true);
+
+       
+        
+        if (resData.isError) {
+            loadingActions.removeLoader();
+            alert(resData.errorMsg.message);
+            return;
+        }
+
+        if(resData.response.result == '[]' || !resData.response.result){
+            $('.barbgnav').removeClass('d-none')
+            loadingActions.removeLoader();
+            toasterHelper("Something Went Wrong")
+            return;
+        }
+
+        let res = resData.response;
+       
+
+        res = JSON.parse(res.result);
+       // console.log(res,'resDataresDataresDataresDataresData');
+       // console.log(res, 'productattributelist');
+
+        if (!res) {
+            loadingActions.removeLoader();
+            return;
+        };
+
+
+
+
+        let html = '';
+
+        for (let i = 0; i < res.length; i++) {
+            const currItem = res[i];
+            // parenttagid means under what label
+            // tag id means it know unquie id
+            const { parentattribute, parenttagid, tagid, attribute, productid } = currItem;
+
+            if (labels[parentattribute]) {
+                labels[parentattribute].items.push({
+                    attribute,
+                    tagid: tagid
+                });
+            } else {
+                labels[parentattribute] = {
+                    id: parenttagid,
+                    items: [{
+                        attribute,
+                        tagid: tagid
+                    }]
+                };
+               
+                if(parentattribute.toLowerCase() === 'colour'){
+                    colorId = parenttagid;
+                }
+                html += getParentHTML(parentattribute, productid, parenttagid, i == 0);
+            }
+
+        }
+        $('#spec-container-details').html(html);
+
+
+      console.log(labels,'labels');
+
+        let childIds = [];
+
+        for (let item in labels) {
+            let { id, items } = labels[item];
+            // $(`[data-tagid=${id}]`)
+            let html = '';
+
+            for (let i = 0; i < items.length; i++) {
+                const { attribute, tagid } = items[i]
+                childIds.push(tagid);
+                group[attribute] = item;
+              //  console.log(attribute,colorId,"s");
+                html += getChildHTML(tagid, attribute, i == 0,id);
+               // console.log(attribute,"attributeattributeattributeattribute");
+            }
+            debugger;
+            $(`[data-tagid="${id}"]`).html(html);
+        }
+        itemtagscombinationRes = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/getitemwithoutbranch/productid/${id}`, true);
+        itemtagscombinationRes = JSON.parse(itemtagscombinationRes.response.result);
+        console.log(itemtagscombinationRes, "conductt");
+
+        let itemidSearch = window.location.hash.split('#')[2]?.split('=')[1];
+
+        if(!itemidSearch){
+            itemidSearch = itemtagscombinationRes[0].itemid
+        }
+
+        let valuesSelected = [];
+
+        $('.borderselector').each(function (i, el) {
+
+            let val = $(el).html();
+            valuesSelected.push(val.trim());
+        });
+debugger;
+        // let searchParams = window.location.search.split("&");
+        // let skuId = window.location.hash.split('#')[2].split('=')[1];
+        // skuId = skuId.split('=')[1]
+        let isGo = true;
+        for (let i = 0; i < itemtagscombinationRes.length; i++) {
+            const currItem = itemtagscombinationRes[i];
+
+            const { tagnames, sku, itemid } = currItem;
+
+            isThereInLabel[tagnames] = itemtagscombinationRes[i];
+            let isTrue = true;
+            if (isGo) {
+                // for(let i=0;i<valuesSelected.length;i++){
+                //     if(!tagnames.includes(valuesSelected[i])){
+                //         isTrue = false
+                //     }
+                // }
+                if (itemidSearch != itemid) {
+                    isTrue = false
+                }
+                // if (i != 0) {
+                //     isTrue = false
+                // }
+                if (isTrue) {
+
+                   // console.log(itemtagscombinationRes[i], 'itemtagscombinationRes[i]');
+
+
+                    currentComb = itemtagscombinationRes[i];
+
+
+                    updateDetailsByObj(itemtagscombinationRes[i]);
+
+
+
+                    isGo = false;
+                    let { tagnames, tagids, pricelist } = itemtagscombinationRes[i];
+                    tagids = tagids.split('|');
+                    tagnames = tagnames.split('|');
+                    $('.optiontaganwi').removeClass('borderselector');
+
+                    for (let i = 0; i < tagids.length; i++) {
+
+                        $(`[data-tagiditem="${tagids[i]}"]`).addClass('borderselector');
+                    }
+
+                    break;
+                    // tagiditem
+                }
+            }
+        }
+
+
+        if (isGo && itemtagscombinationRes.length != 0) {
+
+          //  console.log(itemtagscombinationRes[0]);
+            let { tagnames, tagids, pricelist } = itemtagscombinationRes[0];
+            tagids = tagids.split('|');
+            tagnames = tagnames.split('|');
+            $('.optiontaganwi').removeClass('borderselector');
+            currentComb = itemtagscombinationRes[0];
+            // updateItemId(itemtagscombinationRes[0].itemid);
+
+            for (let i = 0; i < tagids.length; i++) {
+
+                $(`[data-type="${tagids[i]}-${tagnames[i]}"]`).addClass('borderselector');
+                // $(`[data-type="${tagids[i]}-Eucalyptus Green"]`).removeClass('borderselector');
+                // $(`[data-type="${tagids[i]}-Desert Brown"]`).removeClass('borderselector');
+                // $(`[data-type="${tagids[i]}-Deep Sea Blue"]`).removeClass('borderselector');
+            }
+
+            // $('.price').html(pricelist);
+            // $('.des_productdes').html(itemtagscombinationRes[0].itemdescription);
+            // appendSpecs(itemtagscombinationRes[0].itemid);
+
+            updateDetailsByObj(itemtagscombinationRes[0]);
+            //console.log(childIds);
+            // 
+
+        }
+
+      
+
+        //getAllCombination()
+
+
+
+        // for(let i=0;i<itemtagscombinationRes.length;i++){
+        //     const {tagnames} = itemtagscombinationRes[i];
+
+        // }
+
+        $('#spec-container-details').children().find('.specsmallcard').removeClass('specsmallcard');
+
+
+
+        //getting the first borderselector in first $('.groupingitems_search')[0] 
+
+        let firstParentGroup = $('.groupingitems_search')[0];
+        debugger;
+        let optionId = $(firstParentGroup).find('.borderselector').data('tagiditem');
+        
+        currentClick = $(firstParentGroup).find('.borderselector')
+        getandsetCombination();
+        addeventlisteners();
+        loadingActions.removeLoader();
+        return;
+       
+
+    }
+
+
+}
+startDetails();
+

dist/js/productdetails/laptopdetails.js

@@ -0,0 +1,606 @@
+function startDetails() {
+    // http://127.0.0.1:5502/productdetails.html?productId=106633230000024
+    if (window.location.search.split('=')[0] == '') {
+        window.location.href = "/notfound.html";
+        return;
+    }
+    let productId = window.location.href.split('=')[1].split('&')[0].split('#')[0];
+    console.log(productId);
+    let itemtagscombinationRes = null;
+    let labels = {};
+    let isThereInLabel = {};
+    let currentComb = null;
+
+    let group = {};
+
+    let loadingActions = {
+        addLoader() {
+            $('.loadingCall').removeClass('d-none');
+            $('.mainContanierProduct').addClass('d-none');
+        },
+        removeLoader() {
+            $('.loadingCall').addClass('d-none');
+            $('.mainContanierProduct').removeClass('d-none');
+        }
+    }
+
+    let currentClick = null;
+
+    if (productId) {
+        loadingActions.addLoader();
+        updateProductId(productId);
+        getProductDetails(productId);
+        appendSpecs(productId)
+    } else {
+        window.location.href = "/notfound.html"
+    }
+
+    function updateProductId(val) {
+        $('#productidtag').val(val);
+    }
+
+    function updateItemId(val) {
+        $('#itemidtag').val(val);
+    }
+
+    let specification_wrap_action = {
+        remove() {
+
+            $('.specification-wrap').addClass('d-none');
+        },
+
+        add() {
+            $('.specification-wrap').removeClass('d-none');
+        }
+    }
+
+    let description_action = {
+        addVal(value) {
+            $('.description-wrap > p').html(value);
+        },
+
+        removeVal(value) {
+            $('.description-wrap > p').html('');
+        }
+    }
+
+    function getSpecsItemHTML({ name, des, itemid, id }) {
+        let isMobile = $(window).width()<=600 ? '' : '';
+        let addPaddM =  $(window).width()<=600 ? 'py-2' : 'py-4';
+        return `<div id="${id}" data-specitemid="${itemid}" >
+        <div class="row   border-bottom">
+            <div class="col-sm-3 ${isMobile} font-weight-600  ${addPaddM} ">
+            ${name}
+            </div>
+            <div class="col-sm-9  py-2 d-flex align-items-center">
+            ${des}	
+            </div>
+        </div>
+    </div>`;
+        return `<div id="${id}" data-specitemid="${itemid}" class="">
+        <div class="row  border-bottom">
+            <div class="col-sm-6 bg-gray-3 py-2">
+            ${name}
+            </div>
+            <div class="col-sm-6  py-2">
+            ${des}	
+            </div>
+        </div>
+    </div>`;
+
+    }
+    // function getSpecsItemHTML({name,des,itemid,id}){
+    //     return ` <tr id="${id}" data-specitemid="${itemid}">
+    //     <td style="width:200px">${name}</td>
+    //     <td class="">${des}</td>
+    // </tr>`;
+    // }
+
+    async function appendSpecs(id) {
+        let resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/itemspecifications/itemid/${id}`, true);
+
+        if (resData.isError) {
+            $('.productdetailstabs').addClass('d-none');
+            $('.specContainerleft').html('')
+            $('.specContainerRight').html('')
+            return;
+        }
+        $('.productdetailstabs ').removeClass('d-none');
+        const res = resData.response;
+        console.log(JSON.parse(res.result));
+        const data = JSON.parse(res.result);
+        console.log(data);
+        let html = '';
+        let leftHtml = '';
+        let rightHtml = '';
+
+        if (data.length == 0) {
+            $('.productdetailstabs ').addClass('d-none');
+            $('.specContainerleft').html('')
+            $('.specContainerRight').html('')
+            return;
+        }
+
+        for (let i = 0; i < data.length; i++) {
+            const { specificationname, specificationitemid, itemid, description } = data[i];
+            if ((i + 1) % 2 == 0) {
+                rightHtml += getSpecsItemHTML({
+                    name: specificationname, id: specificationitemid, itemid, des: description
+                })
+            } else {
+                leftHtml += getSpecsItemHTML({
+                    name: specificationname, id: specificationitemid, itemid, des: description
+                });
+            }
+
+        }
+
+        $('.specContainerleft').html(leftHtml)
+        $('.specContainerRight').html(rightHtml)
+
+    }
+
+
+    function getParentHTML(name, productid, id, isMain) {
+        return `<div data-parentidgroup="${name?.replace(" ", '')}-parent" class="pb-2 groupingitems_search ${name?.replace(" ", '')}-parent">
+        <h5 class="py-2 smallHeadingProductDetails">${name}</h5>
+        <div class="d-flex gap-2 flex-lg-row flex-wrap ${id}container" data-tagid="${id}">
+           
+        </div>
+    </div>`;
+    }
+
+    function onClickHandler(e) {
+
+        $(e).parent().find('.borderselector').removeClass('borderselector');
+
+        $(e).addClass('borderselector')
+
+    }
+
+    function getChildHTML(tagid, name, isTrue) {
+
+
+        return `
+            <div data-type="${tagid}-${name}" data-tagiditem="${tagid}" class="specsmallcard optiontaganwi ${isTrue ? 'borderselector' : ''} card text-center small-font cursor-pointer p-3">
+                ${name}
+            </div> `
+
+
+    }
+
+    function addeventlisteners() {
+
+        $('.optiontaganwi').each(function (i, el) {
+            $(el).click(function (e) {
+                debugger;
+                $('#quantity').val(1);
+
+                $(e.target).parent().find('.borderselector').removeClass('borderselector');
+                $(e.target).addClass('borderselector');
+                searchComb();
+                currentClick = e.target;
+                getAllCombination();
+            })
+        });
+
+    }
+
+
+
+    function updateDetailsByObj(obj) {
+        $('.productname').html(obj.itemname)
+        let  [currencySymbol, amount] = getCurrencySymbol(obj?.pricelist||0);
+        
+        $('.price').html(obj.pricelist ?`${currencySymbol}${amount}'`:'');
+        $('.price').attr('data-price',obj.pricelist);
+        appendSpecs(obj.itemid)
+        $('#skudetailitem').val(obj.sku)
+        $('.des_productdes').html(obj.itemdescription);
+        $('#addtocart').attr('data-qty', obj.quantity);
+
+debugger;
+        let defaultImg = obj.itemimageurl ? imgServerNameBuild(obj.itemimageurl) : `./dist/assets/imgs/nophoto.png`;
+        console.log(obj.itemimageurl, 'obj.itemimageurlobj.itemimageurlobj.itemimageurl');
+
+        $('.productDetailsMain  > img').attr('src', defaultImg);
+
+        updateItemId(obj.itemid);
+
+
+        if (!obj.pricelist) {
+            $('.buynow').attr('disabled', true);
+            $('#addtocart').attr('disabled', true);
+        } else {
+            $('.buynow').attr('disabled', false);
+            $('#addtocart').attr('disabled', false);
+        }
+    }
+
+    function searchComb() {
+        let valuesSelected = [];
+        $('.optiontaganwi').removeClass('disabled-option-item')
+
+        $('#addtocart').removeClass('disabled');
+        $('.msgErrorDetailsItem').addClass('d-none');
+        $('.borderselector,border_selector').each(function (i, el) {
+            console.log($(el).html())
+            let val = $(el).data('tagiditem');
+            valuesSelected.push(val);
+        });
+
+        let labelRecord = {};
+
+        for (let label in labels) {
+            labelRecord[label] = false;
+        }
+
+        console.log(labelRecord);
+        specification_wrap_action.add();
+        console.log(group);
+        let unFiler = null;
+        for (let i = 0; i < itemtagscombinationRes.length; i++) {
+            const currItem = itemtagscombinationRes[i];
+            const { tagids } = currItem;
+
+
+            let isTrue = true;
+            let labelFilter = labelRecord;
+
+            for (let i = 0; i < valuesSelected.length; i++) {
+
+                if (!tagids.includes(valuesSelected[i])) {
+                    isTrue = false
+
+                    unFiler = labelFilter;
+                    break;
+                }
+                labelFilter[group[valuesSelected[i]]] = true;
+            }
+
+            if (isTrue) {
+                console.log(itemtagscombinationRes[i], 'itemtagscombinationRes[i]');
+                const { quantity } = itemtagscombinationRes[i];
+                if (quantity >= $('#quantity').val() && quantity >= 1) {
+                    currentComb = itemtagscombinationRes[i];
+                    // $('.productname').html(itemtagscombinationRes[i].itemname)
+                    // $('.price').html(itemtagscombinationRes[i].pricelist);
+                    // location.hash = itemtagscombinationRes[i].itemname.trim();
+                    // appendSpecs(itemtagscombinationRes[i].itemid)
+                    history.replaceState(null, null, `#itemid=${itemtagscombinationRes[i].itemid}#${itemtagscombinationRes[i].itemname.trim()}`);
+
+                    // $('#skudetailitem').val(itemtagscombinationRes[i].sku)
+                    // $('.des_productdes').html(itemtagscombinationRes[i].itemdescription);
+                    updateDetailsByObj(itemtagscombinationRes[i]);
+                } else {
+
+                    let name = itemtagscombinationRes[i].itemname.split('-')[0];
+                    $('#addtocart').addClass('disabled');
+                    let itemsName = name;
+                    $('.borderselector').each(function (i, e) {
+                        itemsName += ` ${$(e).html().trim()}`;
+                    });
+
+                    updateItemId(null);
+
+                    let defaultImg = itemtagscombinationRes[i].itemimageurl ? imgServerNameBuild(itemtagscombinationRes[i].itemimageurl) : `./dist/assets/imgs/nophoto.png`;
+                    console.log(itemtagscombinationRes[i].itemimageurl, 'obj.itemimageurlobj.itemimageurlobj.itemimageurl');
+            
+                    $('.productDetailsMain  > img').attr('src', defaultImg);
+
+                    specification_wrap_action.remove();
+                    $('#skudetailitem').val(-1)
+                    $('.productname').html(itemsName)
+                    history.replaceState(null, null, `#`);
+
+                    $('.msgErrorDetailsItem').removeClass('d-none');
+                    $('.des_productdes').html('');
+                    $('.price').html('');
+                }
+
+                initAddToCart()
+                return;
+
+            }
+
+        }
+
+        alert("j");
+        let name = itemtagscombinationRes[0].itemname.split('-')[0];
+        let itemsName = name;
+        $('.borderselector').each(function (i, e) {
+            itemsName += `- ${$(e).html().trim()}`;
+        })
+        specification_wrap_action.remove();
+        $('.productname').html(itemsName)
+        $('#skudetailitem').val(-1)
+        $('.price').html('');
+        $('#addtocart').addClass('disabled');
+        $('.msgErrorDetailsItem').removeClass('d-none');
+
+        initAddToCart()
+    }
+
+    function getAllCombination() {
+        debugger;
+        const currClickAttr = $(currentClick).html().trim();
+
+        let isThere = [];
+        for (let item in isThereInLabel) {
+            let { tagnames } = isThereInLabel[item];
+            if (tagnames.includes(currClickAttr)) {
+                isThere.push(isThereInLabel[item])
+            }
+        }
+
+        if (!isThere.length) {
+            let curr = $(currentClick).parents('.groupingitems_search').data('parentidgroup');
+            $('.groupingitems_search').each(function (i, e) {
+                const id = $(e).data('parentidgroup');
+                if (id != curr) {
+                    $(e).find('.optiontaganwi').addClass('disabled-option-item');
+                }
+
+
+            });
+
+            return;
+        }
+        let selected = [];
+        $('.borderselector').each(function (i, e) {
+            selected.push($(e).html().trim())
+        });
+
+        // console.log(selected);
+        // console.log(isThere);
+
+        let ishashObj = {};
+
+        for (let i = 0; i < isThere.length; i++) {
+            let { tagnames, tagids } = isThere[i];
+            tagnames = tagnames.split('|');
+            tagids = tagids.split('|');
+
+            for (let j = 0; j < tagnames.length; j++) {
+                if (!ishashObj[tagnames[j]]) {
+                    ishashObj[tagnames[j]] = tagids[j];
+                }
+            }
+        }
+
+         console.log(ishashObj);
+
+        // for(let i=0;i<itemtagscombinationRes.length;i++){
+
+        // }
+
+    }
+
+
+    async function getProductDetails(id) {
+
+
+        debugger;
+
+        let resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/productattributelist/productid/${id}`, true);
+
+        if (resData.isError) {
+            loadingActions.removeLoader();
+            alert(resData.errorMsg.message);
+            return;
+        }
+
+        let res = resData.response;
+
+        res = JSON.parse(res.result);
+        console.log(res, 'productattributelist');
+
+        if (!res) {
+            loadingActions.removeLoader();
+            return;
+        };
+
+
+
+
+        let html = '';
+
+        for (let i = 0; i < res.length; i++) {
+            const currItem = res[i];
+            // parenttagid means under what label
+            // tag id means it know unquie id
+            const { parentattribute, parenttagid, tagid, attribute, productid } = currItem;
+
+            if (labels[parentattribute]) {
+                labels[parentattribute].items.push({
+                    attribute,
+                    tagid: tagid
+                });
+            } else {
+                labels[parentattribute] = {
+                    id: parenttagid,
+                    items: [{
+                        attribute,
+                        tagid: tagid
+                    }]
+                };
+                html += getParentHTML(parentattribute, productid, parenttagid, i == 0);
+            }
+
+        }
+        $('#spec-container-details').html(html);
+
+
+        // console.log(labels,'labels');
+
+        let childIds = [];
+
+        for (let item in labels) {
+            let { id, items } = labels[item];
+            // $(`[data-tagid=${id}]`)
+            let html = '';
+
+            for (let i = 0; i < items.length; i++) {
+                const { attribute, tagid } = items[i]
+                childIds.push(tagid);
+                group[attribute] = item;
+                html += getChildHTML(tagid, attribute, i == 0);
+            }
+            $(`[data-tagid="${id}"]`).html(html);
+        }
+        itemtagscombinationRes = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/getitemwithoutbranch/productid/${id}`, true);
+        itemtagscombinationRes = JSON.parse(itemtagscombinationRes.response.result);
+        console.log(itemtagscombinationRes, "conductt");
+
+        let valuesSelected = [];
+
+        $('.borderselector').each(function (i, el) {
+
+            let val = $(el).html();
+            valuesSelected.push(val.trim());
+        });
+
+        let searchParams = window.location.search.split("&");
+        let skuId = window.location.hash.split('#')[1].split('=')[1];
+        // skuId = skuId.split('=')[1]
+        let isGo = true;
+        for (let i = 0; i < itemtagscombinationRes.length; i++) {
+            const currItem = itemtagscombinationRes[i];
+
+            const { tagnames, sku, itemid } = currItem;
+
+            isThereInLabel[tagnames] = itemtagscombinationRes[i];
+            let isTrue = true;
+            if (isGo) {
+                // for(let i=0;i<valuesSelected.length;i++){
+                //     if(!tagnames.includes(valuesSelected[i])){
+                //         isTrue = false
+                //     }
+                // }
+                if (i != 0) {
+                    isTrue = false
+                }
+                if (isTrue) {
+
+                    console.log(itemtagscombinationRes[i], 'itemtagscombinationRes[i]');
+
+
+                    currentComb = itemtagscombinationRes[i];
+
+
+                    updateDetailsByObj(itemtagscombinationRes[i]);
+
+
+
+                    isGo = false;
+                    let { tagnames, tagids, pricelist } = itemtagscombinationRes[i];
+                    tagids = tagids.split('|');
+                    tagnames = tagnames.split('|');
+                    $('.optiontaganwi').removeClass('borderselector');
+
+                    for (let i = 0; i < tagids.length; i++) {
+
+                        $(`[data-tagiditem="${tagids[i]}"]`).addClass('borderselector');
+                    }
+                    // tagiditem
+                }
+            }
+        }
+
+
+        if (isGo && itemtagscombinationRes.length != 0) {
+
+            console.log(itemtagscombinationRes[0]);
+            let { tagnames, tagids, pricelist } = itemtagscombinationRes[0];
+            tagids = tagids.split('|');
+            tagnames = tagnames.split('|');
+            $('.optiontaganwi').removeClass('borderselector');
+            currentComb = itemtagscombinationRes[0];
+            // updateItemId(itemtagscombinationRes[0].itemid);
+
+            for (let i = 0; i < tagids.length; i++) {
+
+                $(`[data-type="${tagids[i]}-${tagnames[i]}"]`).addClass('borderselector');
+                // $(`[data-type="${tagids[i]}-Eucalyptus Green"]`).removeClass('borderselector');
+                // $(`[data-type="${tagids[i]}-Desert Brown"]`).removeClass('borderselector');
+                // $(`[data-type="${tagids[i]}-Deep Sea Blue"]`).removeClass('borderselector');
+            }
+
+            // $('.price').html(pricelist);
+            // $('.des_productdes').html(itemtagscombinationRes[0].itemdescription);
+            // appendSpecs(itemtagscombinationRes[0].itemid);
+
+            updateDetailsByObj(itemtagscombinationRes[0]);
+            //console.log(childIds);
+            // 
+
+        }
+
+        //getAllCombination()
+
+
+
+        // for(let i=0;i<itemtagscombinationRes.length;i++){
+        //     const {tagnames} = itemtagscombinationRes[i];
+
+        // }
+
+        $('#spec-container-details').children().find('.specsmallcard').removeClass('specsmallcard');
+
+        addeventlisteners();
+        loadingActions.removeLoader();
+        return;
+        // let resTwo = await postStatAPIService(`${SERVERNAME}/apis/v4/bizgaze/integrations/products/itemtagscombination/productid/${id}`);
+
+
+        //let html = '';
+        let attributesObj = {};
+        for (let i = 0; i < res.length; i++) {
+            const { parentattribute, tagid, productid } = res[i];
+            // let attributes = await postStatAPIService(`${SERVERNAME}/apis/v4/bizgaze/integrations/products/productattributelist/parenttagid/${tagid}`);
+            // attributesObj[tagid] = JSON.parse(attributes.data.result);
+            // console.log(attributes.data.result,tagid);
+            html += getParentHTML(parentattribute, productid, tagid, i == 0);
+        }
+
+        $('#spec-container-details').html(html);
+
+
+        // let attributes = await postStatAPIService(`${SERVERNAME}/apis/v4/bizgaze/integrations/products/productattributelist/parenttagid/${tagid}`);
+        return;
+        for (let attr in attributesObj) {
+            const arr = attributesObj[attr];
+
+            let html = '';
+            for (let i = 0; i < arr.length; i++) {
+                const { attribute, tagid } = arr[i];
+                html += getChildHTML(tagid, attribute, i == 0);
+            }
+
+
+            $(`[data-tagid="${attr}"]`).html(html);
+
+
+        }
+
+        let defaultValues = await postStatAPIService(`${SERVERNAME}/apis/v4/bizgaze/integrations/products/sellableitemlist/productid/${id}`);
+        defaultValues = JSON.parse(defaultValues.data.result);
+        let { itemname, price } = defaultValues[0];
+        $('.productname').html(itemname);
+        $('.price').html(price)
+
+        $('#spec-container-details').children().slice(1).find('.specsmallcard').removeClass('specsmallcard');
+
+
+
+
+        // getQuantityById(id)
+
+
+
+    }
+
+
+}
+startDetails();
+

dist/js/productdetails/laptopdetails.js-old

@@ -0,0 +1,650 @@
+function startDetails() {
+    // http://127.0.0.1:5502/productdetails.html?productId=106633230000024
+    if (window.location.search.split('=')[0] == '') {
+        window.location.href = "/notfound.html";
+        return;
+    }
+    let productId = window.location.href.split('=')[1].split('&')[0].split('#')[0];
+    console.log(productId);
+    let itemtagscombinationRes = null;
+    let labels = {};
+    let isThereInLabel = {};
+    let currentComb = null;
+
+    let group = {};
+
+    let loadingActions = {
+        addLoader() {
+            $('.loadingCall').removeClass('d-none');
+            $('.mainContanierProduct').addClass('d-none');
+        },
+        removeLoader() {
+            $('.loadingCall').addClass('d-none');
+            $('.mainContanierProduct').removeClass('d-none');
+        }
+    }
+
+    let currentClick = null;
+
+    if (productId) {
+        loadingActions.addLoader();
+        updateProductId(productId);
+        getProductDetails(productId);
+        appendSpecs(productId)
+    } else {
+        window.location.href = "/notfound.html"
+    }
+
+    function updateProductId(val) {
+        $('#productidtag').val(val);
+    }
+
+    function updateItemId(val) {
+        $('#itemidtag').val(val);
+    }
+
+    let specification_wrap_action = {
+        remove() {
+
+            $('.specification-wrap').addClass('d-none');
+        },
+
+        add() {
+            $('.specification-wrap').removeClass('d-none');
+        }
+    }
+
+    let description_action = {
+        addVal(value) {
+            $('.description-wrap > p').html(value);
+        },
+
+        removeVal(value) {
+            $('.description-wrap > p').html('');
+        }
+    }
+
+    function getSpecsItemHTML({ name, des, itemid, id }) {
+        return `<div id="${id}" data-specitemid="${itemid}" class="">
+        <div class="row  border-bottom">
+            <div class="col-sm-6 bg-gray-3 py-2">
+            ${name}
+            </div>
+            <div class="col-sm-6  py-2">
+            ${des}	
+            </div>
+        </div>
+    </div>`;
+        return ` <tr id="${id}" data-specitemid="${itemid}">
+        <td style="width:200px">${name}</td>
+        <td class="">${des}</td>
+    </tr>`;
+    }
+    // function getSpecsItemHTML({name,des,itemid,id}){
+    //     return ` <tr id="${id}" data-specitemid="${itemid}">
+    //     <td style="width:200px">${name}</td>
+    //     <td class="">${des}</td>
+    // </tr>`;
+    // }
+
+    async function appendSpecs(id) {
+        let resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/itemspecifications/itemid/${id}`, true);
+
+        if (resData.isError) {
+            $('.productdetailstabs').addClass('d-none');
+            $('.specContainerleft').html('')
+            $('.specContainerRight').html('')
+            return;
+        }
+        $('.productdetailstabs ').removeClass('d-none');
+        const res = resData.response;
+        console.log(JSON.parse(res.result));
+        const data = JSON.parse(res.result);
+        console.log(data);
+        let html = '';
+        let leftHtml = '';
+        let rightHtml = '';
+
+        if (data.length == 0) {
+            $('.productdetailstabs ').addClass('d-none');
+            $('.specContainerleft').html('')
+            $('.specContainerRight').html('')
+            return;
+        }
+
+        for (let i = 0; i < data.length; i++) {
+            const { specificationname, specificationitemid, itemid, description } = data[i];
+            if ((i + 1) % 2 == 0) {
+                rightHtml += getSpecsItemHTML({
+                    name: specificationname, id: specificationitemid, itemid, des: description
+                })
+            } else {
+                leftHtml += getSpecsItemHTML({
+                    name: specificationname, id: specificationitemid, itemid, des: description
+                });
+            }
+
+        }
+
+        $('.specContainerleft').html(leftHtml)
+        $('.specContainerRight').html(rightHtml)
+
+    }
+
+
+    function getParentHTML(name, productid, id, isMain) {
+        return `<div class="pb-2 $${name?.replace(" ", '')}-parent">
+        <h5 class="py-2 smallHeadingProductDetails">${name}</h5>
+        <div class="d-flex gap-2 flex-lg-row flex-wrap ${id}container" data-tagid="${id}">
+           
+        </div>
+    </div>`;
+    }
+
+    function onClickHandler(e) {
+
+        $(e).parent().find('.borderselector').removeClass('borderselector');
+
+        $(e).addClass('borderselector')
+
+    }
+
+    function getChildHTML(tagid, name, isTrue) {
+        
+        let  item_color_1 = `#5e7975`;
+        let item_color_2 = `#624839`;
+        let item_color_3 = `#253746`;
+        if(name == "Eucalyptus Green"){
+
+            return `<p item_color=${item_color_1} data-type="${tagid}-${name}" data-tagiditem="${tagid}" class="optiontaganwi_color specsmallcard optiontaganwi fs-7 cursor-pointer text-white rounded mb-0 me-1 py-2 px-3" ${item_color_1 ? `style="background-color:${item_color_1}"`:''}><span class="${isTrue ? 'border-bottom color' : 'color'}">${name}</span></p>`;
+
+        }else if(name == "Desert Brown"){
+
+            return `<p item_color=${item_color_2} data-type="${tagid}-${name}" data-tagiditem="${tagid}" class="optiontaganwi_color specsmallcard optiontaganwi mb-0 fs-7 cursor-pointer me-1 rounded text-white py-2 px-3" ${item_color_2 ? `style="background-color:${item_color_2}"`:''}><span class="${isTrue ? 'border-bottom color' : 'color'}">${name}</span></p>`;
+
+        }else if(name == "Deep Sea Blue"){
+
+            return `<p item_color=${item_color_3} data-type="${tagid}-${name}" data-tagiditem="${tagid}" class="optiontaganwi_color specsmallcard optiontaganwi mb-0 fs-7 text-white cursor-pointer rounded py-2 px-3 " ${item_color_3 ? `style="background-color:${item_color_3}"`:''}><span class="${isTrue ? 'border-bottom color' : 'color'}">${name}</span></p>`;
+        }
+        else{
+            return `
+            <div data-type="${tagid}-${name}" data-tagiditem="${tagid}" class="specsmallcard optiontaganwi ${isTrue ? 'borderselector' : ''} card text-center small-font cursor-pointer p-3">
+                ${name}
+            </div> `
+         }
+   
+    }
+
+    function addeventlisteners() {
+
+        $('.optiontaganwi').each(function (i, el) {
+            $(el).click(function (e) {
+                $('#quantity').val(1);
+                debugger;
+                let ele_col = $(e.target).hasClass("color");
+                let ele_col1 = $(e.target).hasClass("optiontaganwi_color");
+                if(ele_col === true){
+                    $(e.target).parent().find("span.color").removeClass('border-bottom');
+                    $(e.target).parent().addClass("border_selector");
+                    $(e.target).addClass("border-bottom");
+                    $(e.target).parent().find("span.border-bottom").removeClass("border-bottom text-dark");
+                    $(e.target).addClass("border_selector");
+                    $(e.target).find("span.color").addClass("border-bottom text-dark");
+                    $(e.target).parent().find('.borderselector').removeClass('borderselector');
+                    // $(e.target).addClass('borderselector');
+                    searchComb();
+                    currentClick = e.target;
+                }else if(ele_col1 === true){
+                    $(e.target).parent().find("span.text-dark").removeClass("text-dark border-bottom");
+                    $(e.target).addClass("border_selector");
+                    $(e.target).find("span.color").addClass("text-dark");
+                    $(e.target).parent().find('.borderselector').removeClass('borderselector');
+                    $(e.target).addClass('borderselector');
+                    searchComb();
+                    currentClick = e.target;
+                }else{
+                    $(e.target).parent().find('.borderselector').removeClass('borderselector');
+                    $(e.target).addClass('borderselector');
+                    searchComb();
+                    currentClick = e.target;
+                 }
+              
+                searchComb();
+                currentClick = e.target;
+                // getAllCombination();
+            })
+        });
+        // $('.optiontaganwi_color span.color').each(function (i, el) {
+        //     $(el).click(function (e) {
+        //         $('#quantity').val(1);
+        //         $(e.target).parent().find("span.border-bottom").removeClass("border-bottom");
+        //         $(e.target).addClass("border-bottom");
+        //         searchComb();
+        //         currentClick = e.target;
+        //         // getAllCombination();
+        //     })
+        // });
+    }
+
+    // function getChildHTML(tagid,name,isTrue){
+    //     return `
+    //     <div  data-type="${tagid}-${name}" data-tagiditem="${tagid}" class="specsmallcard optiontaganwi ${isTrue?'borderselector':''} card small-font cursor-pointer p-3">
+    //         ${name}
+    //     </div>
+    // `
+    // }
+
+    // function addeventlisteners(){
+      
+    //     $('.optiontaganwi').each(function (i,el){
+    //       $(el).click(function (e){
+    //         $('#quantity').val(1)
+    //         $(e.target).parent().find('.borderselector').removeClass('borderselector');
+    //         $(e.target).addClass('borderselector')
+    //        searchComb();
+    //         currentClick = e.target;
+    //        // getAllCombination();
+    //       })
+    //     });
+    // }
+
+    function updateDetailsByObj(obj) {
+        $('.productname').html(obj.itemname)
+        $('.price').html(obj.pricelist?obj.pricelist:'coming soon');
+        appendSpecs(obj.itemid)
+        $('#skudetailitem').val(obj.sku)
+        $('.des_productdes').html(obj.itemdescription);
+        $('#addtocart').attr('data-qty', obj.quantity);
+
+
+        let defaultImg = obj.itemimageurl ? imgServerNameBuild(obj.itemimageurl) : `./dist/assets/imgs/nophoto.png`;
+        console.log(obj.itemimageurl, 'obj.itemimageurlobj.itemimageurlobj.itemimageurl');
+
+        $('.productDetailsMain  > img').attr('src', defaultImg);
+
+        updateItemId(obj.itemid);
+        
+
+        if(!obj.pricelist){
+            $('.buynow').attr('disabled',true);
+            $('#addtocart').attr('disabled',true);
+        }else{
+            $('.buynow').attr('disabled',false);
+            $('#addtocart').attr('disabled',false);
+        }
+    }
+
+    function searchComb() {
+        let valuesSelected = [];
+
+
+        $('#addtocart').removeClass('disabled');
+        $('.msgErrorDetailsItem').addClass('d-none');
+        $('.borderselector,border_selector').each(function (i, el) {
+            console.log($(el).html())
+            let val = $(el).html();
+            valuesSelected.push(val.trim());
+        });
+
+        let labelRecord = {};
+
+        for (let label in labels) {
+            labelRecord[label] = false;
+        }
+
+        console.log(labelRecord);
+        specification_wrap_action.add();
+        console.log(group);
+        let unFiler = null;
+        for (let i = 0; i < itemtagscombinationRes.length; i++) {
+            const currItem = itemtagscombinationRes[i];
+            const { tagnames } = currItem;
+
+
+            let isTrue = true;
+            let labelFilter = labelRecord;
+
+            for (let i = 0; i < valuesSelected.length; i++) {
+
+                if (!tagnames.includes(valuesSelected[i])) {
+                    isTrue = false
+
+                    unFiler = labelFilter;
+                    break;
+                }
+                labelFilter[group[valuesSelected[i]]] = true;
+            }
+
+            if (isTrue) {
+                console.log(itemtagscombinationRes[i], 'itemtagscombinationRes[i]');
+                const { quantity } = itemtagscombinationRes[i];
+                if (quantity >= $('#quantity').val() && quantity >= 1) {
+                    currentComb = itemtagscombinationRes[i];
+                    // $('.productname').html(itemtagscombinationRes[i].itemname)
+                    // $('.price').html(itemtagscombinationRes[i].pricelist);
+                    // location.hash = itemtagscombinationRes[i].itemname.trim();
+                    // appendSpecs(itemtagscombinationRes[i].itemid)
+                    history.replaceState(null, null, `#itemid=${itemtagscombinationRes[i].itemid}#${itemtagscombinationRes[i].itemname.trim()}`);
+
+                    // $('#skudetailitem').val(itemtagscombinationRes[i].sku)
+                    // $('.des_productdes').html(itemtagscombinationRes[i].itemdescription);
+                    updateDetailsByObj(itemtagscombinationRes[i]);
+                } else {
+
+                    let name = itemtagscombinationRes[i].itemname.split('-')[0];
+                    $('#addtocart').addClass('disabled');
+                    let itemsName = name;
+                    $('.borderselector').each(function (i, e) {
+                        itemsName += ` ${$(e).html().trim()}`;
+                    });
+
+                    updateItemId(null);
+
+                    specification_wrap_action.remove();
+                    $('#skudetailitem').val(-1)
+                    $('.productname').html(itemsName)
+                    history.replaceState(null, null, `#`);
+
+                    $('.msgErrorDetailsItem').removeClass('d-none');
+                    $('.des_productdes').html('');
+                    $('.price').html('');
+                }
+
+                initAddToCart()
+                return;
+
+            }
+
+        }
+
+        let name = itemtagscombinationRes[0].itemname.split('-')[0];
+        let itemsName = name;
+        $('.borderselector').each(function (i, e) {
+            itemsName += `- ${$(e).html().trim()}`;
+        })
+        specification_wrap_action.remove();
+        $('.productname').html(itemsName)
+        $('#skudetailitem').val(-1)
+        $('.price').html('');
+        $('#addtocart').addClass('disabled');
+        $('.msgErrorDetailsItem').removeClass('d-none');
+
+        initAddToCart()
+    }
+
+    function getAllCombination() {
+        const currClickAttr = $(currentClick).html().trim();
+
+        let isThere = [];
+        for (let item in isThereInLabel) {
+            let { tagnames } = isThereInLabel[item];
+            if (tagnames.includes(currClickAttr)) {
+                isThere.push(isThereInLabel[item])
+            }
+        }
+        let selected = [];
+        $('.borderselector').each(function (i, e) {
+            selected.push($(e).html().trim())
+        });
+
+        // console.log(selected);
+        // console.log(isThere);
+
+        let ishashObj = {};
+
+        for (let i = 0; i < isThere.length; i++) {
+            let { tagnames, tagids } = isThere[i];
+            tagnames = tagnames.split('|');
+            tagids = tagids.split('|');
+
+            for (let j = 0; j < tagnames.length; j++) {
+                if (!ishashObj[tagnames[j]]) {
+                    ishashObj[tagnames[j]] = tagids[j];
+                }
+            }
+        }
+
+        // console.log(ishashObj);
+
+        // for(let i=0;i<itemtagscombinationRes.length;i++){
+
+        // }
+
+    }
+
+
+    async function getProductDetails(id) {
+
+
+
+        // let res = await getStatAPIService(`${SERVERNAME}/apis/v4/bizgaze/integrations/products/productattributelist/productid/${id}`);
+
+        let resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/productattributelist/productid/${id}`, true);
+
+        if (resData.isError) {
+            loadingActions.removeLoader();
+            alert(resData.errorMsg.message);
+            return;
+        }
+
+        let res = resData.response;
+
+        res = JSON.parse(res.result);
+        console.log(res, 'productattributelist');
+
+        if (!res) {
+            loadingActions.removeLoader();
+            return;
+        };
+
+
+
+
+        let html = '';
+
+        for (let i = 0; i < res.length; i++) {
+            const currItem = res[i];
+            // parenttagid means under what label
+            // tag id means it know unquie id
+            const { parentattribute, parenttagid, tagid, attribute, productid } = currItem;
+
+            if (labels[parentattribute]) {
+                labels[parentattribute].items.push({
+                    attribute,
+                    tagid: tagid
+                });
+            } else {
+                labels[parentattribute] = {
+                    id: parenttagid,
+                    items: [{
+                        attribute,
+                        tagid: tagid
+                    }]
+                };
+                html += getParentHTML(parentattribute, productid, parenttagid, i == 0);
+            }
+
+        }
+        $('#spec-container-details').html(html);
+
+
+        // console.log(labels,'labels');
+
+        let childIds = [];
+
+        for (let item in labels) {
+            let { id, items } = labels[item];
+            // $(`[data-tagid=${id}]`)
+            let html = '';
+
+            for (let i = 0; i < items.length; i++) {
+                const { attribute, tagid } = items[i]
+                childIds.push(tagid);
+                group[attribute] = item;
+                html += getChildHTML(tagid, attribute, i == 0);
+            }
+            $(`[data-tagid="${id}"]`).html(html);
+        }
+        itemtagscombinationRes = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/getitemwithoutbranch/productid/${id}`, true);
+        itemtagscombinationRes = JSON.parse(itemtagscombinationRes.response.result);
+        console.log(itemtagscombinationRes, "conductt");
+
+        let valuesSelected = [];
+
+        $('.borderselector').each(function (i, el) {
+
+            let val = $(el).html();
+            valuesSelected.push(val.trim());
+        });
+
+        let searchParams = window.location.search.split("&");
+        let skuId = window.location.hash.split('#')[1].split('=')[1];
+        // skuId = skuId.split('=')[1]
+        let isGo = true;
+        for (let i = 0; i < itemtagscombinationRes.length; i++) {
+            const currItem = itemtagscombinationRes[i];
+
+            const { tagnames, sku, itemid } = currItem;
+
+            isThereInLabel[tagnames] = itemtagscombinationRes[i];
+            let isTrue = true;
+            if (isGo) {
+                // for(let i=0;i<valuesSelected.length;i++){
+                //     if(!tagnames.includes(valuesSelected[i])){
+                //         isTrue = false
+                //     }
+                // }
+                if (skuId != itemid) {
+                    isTrue = false
+                }
+                if (isTrue) {
+
+                    console.log(itemtagscombinationRes[i], 'itemtagscombinationRes[i]');
+
+
+                    currentComb = itemtagscombinationRes[i];
+                    // location.hash = itemtagscombinationRes[i].itemname.trim();
+
+                    // $('.productname').html(itemtagscombinationRes[i].itemname);
+                    // $('#skudetailitem').val(itemtagscombinationRes[i].sku)
+                    // $('.price').html(itemtagscombinationRes[i].pricelist)
+
+                    // appendSpecs(itemtagscombinationRes[i].itemid);
+                    // $('.des_productdes').html(itemtagscombinationRes[i].itemdescription);
+
+                    updateDetailsByObj(itemtagscombinationRes[i]);
+
+
+
+                    isGo = false;
+                    let { tagnames, tagids, pricelist } = itemtagscombinationRes[i];
+                    tagids = tagids.split('|');
+                    tagnames = tagnames.split('|');
+                    $('.optiontaganwi').removeClass('borderselector');
+
+                    for (let i = 0; i < tagids.length; i++) {
+
+                        $(`[data-tagiditem="${tagids[i]}"]`).addClass('borderselector');
+                    }
+                    // tagiditem
+                }
+            }
+        }
+
+
+        if (isGo && itemtagscombinationRes.length != 0) {
+
+            console.log(itemtagscombinationRes[0]);
+            let { tagnames, tagids, pricelist } = itemtagscombinationRes[0];
+            tagids = tagids.split('|');
+            tagnames = tagnames.split('|');
+            $('.optiontaganwi').removeClass('borderselector');
+            currentComb = itemtagscombinationRes[0];
+            // updateItemId(itemtagscombinationRes[0].itemid);
+
+            for (let i = 0; i < tagids.length; i++) {
+
+                $(`[data-type="${tagids[i]}-${tagnames[i]}"]`).addClass('borderselector');
+                $(`[data-type="${tagids[i]}-Eucalyptus Green"]`).removeClass('borderselector');
+                $(`[data-type="${tagids[i]}-Desert Brown"]`).removeClass('borderselector');
+                $(`[data-type="${tagids[i]}-Deep Sea Blue"]`).removeClass('borderselector');
+            }
+
+            // $('.price').html(pricelist);
+            // $('.des_productdes').html(itemtagscombinationRes[0].itemdescription);
+            // appendSpecs(itemtagscombinationRes[0].itemid);
+
+            updateDetailsByObj(itemtagscombinationRes[0]);
+            //console.log(childIds);
+            // 
+
+        }
+
+        //getAllCombination(valuesSelected)
+
+
+
+        // for(let i=0;i<itemtagscombinationRes.length;i++){
+        //     const {tagnames} = itemtagscombinationRes[i];
+
+        // }
+
+        $('#spec-container-details').children().find('.specsmallcard').removeClass('specsmallcard');
+
+        addeventlisteners();
+        loadingActions.removeLoader();
+        return;
+        // let resTwo = await postStatAPIService(`${SERVERNAME}/apis/v4/bizgaze/integrations/products/itemtagscombination/productid/${id}`);
+
+
+        //let html = '';
+        let attributesObj = {};
+        for (let i = 0; i < res.length; i++) {
+            const { parentattribute, tagid, productid } = res[i];
+            // let attributes = await postStatAPIService(`${SERVERNAME}/apis/v4/bizgaze/integrations/products/productattributelist/parenttagid/${tagid}`);
+            // attributesObj[tagid] = JSON.parse(attributes.data.result);
+            // console.log(attributes.data.result,tagid);
+            html += getParentHTML(parentattribute, productid, tagid, i == 0);
+        }
+
+        $('#spec-container-details').html(html);
+
+
+        // let attributes = await postStatAPIService(`${SERVERNAME}/apis/v4/bizgaze/integrations/products/productattributelist/parenttagid/${tagid}`);
+        return;
+        for (let attr in attributesObj) {
+            const arr = attributesObj[attr];
+
+            let html = '';
+            for (let i = 0; i < arr.length; i++) {
+                const { attribute, tagid } = arr[i];
+                html += getChildHTML(tagid, attribute, i == 0);
+            }
+
+
+            $(`[data-tagid="${attr}"]`).html(html);
+
+
+        }
+
+        let defaultValues = await postStatAPIService(`${SERVERNAME}/apis/v4/bizgaze/integrations/products/sellableitemlist/productid/${id}`);
+        defaultValues = JSON.parse(defaultValues.data.result);
+        let { itemname, price } = defaultValues[0];
+        $('.productname').html(itemname);
+        $('.price').html(price)
+
+        $('#spec-container-details').children().slice(1).find('.specsmallcard').removeClass('specsmallcard');
+
+
+
+
+        // getQuantityById(id)
+
+
+
+    }
+
+
+}
+startDetails();
+

dist/js/productdetails/productdetails.js

@@ -0,0 +1,589 @@
+function startDetails(){
+    // http://127.0.0.1:5502/productdetails.html?productId=106633230000024
+    if(window.location.search.split('=')[0] == ''){
+        window.location.href = "/notfound.html";
+        return;
+    }
+    debugger;
+    let productId = window.location.href.split('=')[1].split('&')[0].split('#')[0];
+    console.log(productId);
+    let itemtagscombinationRes = null;
+    let labels = {};    
+    let isThereInLabel = {};
+    let currentComb = null;
+
+    let group = {};
+
+    let loadingActions = {
+        addLoader(){
+            $('.loadingCall').removeClass('d-none');
+            $('.mainContanierProduct').addClass('d-none');
+        },
+        removeLoader(){
+            $('.loadingCall').addClass('d-none');
+            $('.mainContanierProduct').removeClass('d-none');
+        }
+    }
+
+    let currentClick = null;
+   
+    if(productId){
+        loadingActions.addLoader();
+        updateProductId(productId);
+       getProductDetails(productId);
+        appendSpecs(productId)
+    }else{
+       window.location.href = "/notfound.html"
+    }
+
+    function updateProductId(val){
+        $('#productidtag').val(val);
+    }
+
+    function updateItemId(val){
+        $('#itemidtag').val(val);
+    }
+
+    let specification_wrap_action = {
+        remove(){
+    
+            $('.specification-wrap').addClass('d-none');
+        },
+
+        add(){
+            $('.specification-wrap').removeClass('d-none');
+        }
+    }
+
+    let description_action = {
+        addVal(value){
+            $('.description-wrap > p').html(value);
+        },
+
+        removeVal(value){
+            $('.description-wrap > p').html('');
+        }
+    }
+
+    function getSpecsItemHTML({name,des,itemid,id}){
+        let isMobile = $(window).width()<=600 ? '' : '';
+        let addPaddM =  $(window).width()<=600 ? 'py-2' : 'py-4';
+        return `<div id="${id}" data-specitemid="${itemid}" >
+        <div class="row   border-bottom">
+            <div class="col-sm-3 ${isMobile} font-weight-600  ${addPaddM} ">
+            ${name}
+            </div>
+            <div class="col-sm-9  py-2 d-flex align-items-center">
+            ${des}	
+            </div>
+        </div>
+    </div>`;
+        return ` <tr id="${id}" data-specitemid="${itemid}">
+        <td style="width:200px">${name}</td>
+        <td class="">${des}</td>
+    </tr>`;
+    }
+    // function getSpecsItemHTML({name,des,itemid,id}){
+    //     return ` <tr id="${id}" data-specitemid="${itemid}">
+    //     <td style="width:200px">${name}</td>
+    //     <td class="">${des}</td>
+    // </tr>`;
+    // }
+
+    async function appendSpecs(id){
+        let resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/itemspecifications/itemid/${id}`,true);
+
+        if(resData.isError){
+            $('.productdetailstabs').addClass('d-none');
+            $('.specContainerleft').html('')
+            $('.specContainerRight').html('')
+            return;
+        }
+        $('.productdetailstabs ').removeClass('d-none');
+        const res = resData.response;
+        console.log(JSON.parse(res.result));
+        const data = JSON.parse(res.result);
+        console.log(data);
+        let html = '';
+        let leftHtml = '';
+        let rightHtml = '';
+
+        if(data.length == 0){
+            $('.productdetailstabs ').addClass('d-none');
+            $('.specContainerleft').html('')
+            $('.specContainerRight').html('')
+            return;
+        }
+
+        for(let i=0;i<data.length;i++){
+            const {specificationname,specificationitemid,itemid,description} = data[i];
+            leftHtml += getSpecsItemHTML({
+                name:specificationname,id:specificationitemid,itemid,des:description
+            });
+            // if((i+1)%2 == 0){
+            //     rightHtml += getSpecsItemHTML({
+            //         name:specificationname,id:specificationitemid,itemid,des:description
+            //     })
+            // }else{
+            //     leftHtml += getSpecsItemHTML({
+            //         name:specificationname,id:specificationitemid,itemid,des:description
+            //     });
+            // }
+            
+        }
+  
+        $('.specContainerleft').html(leftHtml)
+        $('.specContainerRight').html(rightHtml)
+
+    }
+   
+
+    function getParentHTML(name,productid,id,isMain){
+        return `<div class="pb-2 $${name?.replace(" ",'')}-parent">
+        <h5 class="py-2 smallHeadingProductDetails">${name}</h5>
+        <div class="d-flex gap-2 flex-wrap ${id}container" data-tagid="${id}">
+           
+        </div>
+    </div>`;
+    }
+
+    function onClickHandler(e) {
+  
+        $(e).parent().find('.borderselector').removeClass('borderselector');
+    
+        $(e).addClass('borderselector')
+    
+    }
+
+    function getChildHTML(tagid,name,isTrue){
+        return `
+        <div  data-type="${tagid}-${name}" data-tagiditem="${tagid}" class="specsmallcard optiontaganwi ${isTrue?'borderselector':''} card small-font cursor-pointer p-3">
+            ${name}
+        </div>
+    `
+    }
+
+    function addeventlisteners(){
+      
+        $('.optiontaganwi').each(function (i,el){
+          $(el).click(function (e){
+            $('#quantity').val(1)
+            $(e.target).parent().find('.borderselector').removeClass('borderselector');
+            $(e.target).addClass('borderselector')
+           searchComb();
+            currentClick = e.target;
+           // getAllCombination();
+          })
+        });
+    }
+
+    function updateDetailsByObj(obj){
+        $('.productname').html(obj.itemname);
+        let  [currencySymbol, amount] = getCurrencySymbol(obj?.pricelist||0);
+        $('.price').html(obj.pricelist ?`${currencySymbol}${amount}`:'');
+        $('.price').attr('data-price',obj.pricelist);
+        appendSpecs(obj.itemid)
+        $('#skudetailitem').val(obj.sku)
+        $('.des_productdes').html(obj.itemdescription);
+        $('#addtocart').attr('data-qty',obj.quantity);
+
+        
+        let defaultImg = obj.itemimageurl ? imgServerNameBuild(obj.itemimageurl): `./dist/assets/imgs/nophoto.png`;
+console.log(obj.itemimageurl,'obj.itemimageurlobj.itemimageurlobj.itemimageurl');
+
+        $('.productDetailsMain  > img').attr('src',defaultImg);
+
+        updateItemId(obj.itemid);
+debugger;
+        if (!obj.pricelist || !obj.quantity) {
+            $('.buynow').attr('disabled', true);
+            $('#addtocart').attr('disabled', true);
+        } else {
+            $('.buynow').attr('disabled', false);
+            $('#addtocart').attr('disabled', false);
+        }
+    }
+
+    function searchComb(){
+        let valuesSelected = [];
+ 
+        
+        $('#addtocart').removeClass('disabled');
+        $('.msgErrorDetailsItem').addClass('d-none');
+        $('.borderselector').each(function (i,el){
+            let val = $(el).html();
+            valuesSelected.push(val.trim());
+        });
+
+        let labelRecord = {};
+
+        for(let label in labels){
+            labelRecord[label] = false;
+        }
+
+        console.log(labelRecord);
+        specification_wrap_action.add();
+        console.log(group);
+        let unFiler = null;
+        for(let i=0;i<itemtagscombinationRes.length;i++){
+            const currItem = itemtagscombinationRes[i];
+            const {tagnames} = currItem;
+           
+
+                let isTrue = true;
+                let labelFilter = labelRecord;
+                
+                for(let i=0;i<valuesSelected.length;i++){
+                  
+                    if(!tagnames.includes(valuesSelected[i])){
+                        isTrue = false
+                        
+                        unFiler = labelFilter;
+                        break;
+                    }
+                    labelFilter[group[valuesSelected[i]]] = true;
+                }
+    
+                if(isTrue){
+                    console.log(itemtagscombinationRes[i],'itemtagscombinationRes[i]');
+                    const {quantity} = itemtagscombinationRes[i];
+                    if(quantity>=$('#quantity').val() && quantity>=1){
+                        currentComb = itemtagscombinationRes[i];
+                        // $('.productname').html(itemtagscombinationRes[i].itemname)
+                        // $('.price').html(itemtagscombinationRes[i].pricelist);
+                        // location.hash = itemtagscombinationRes[i].itemname.trim();
+                        // appendSpecs(itemtagscombinationRes[i].itemid)
+                        history.replaceState(null, null, `#itemid=${itemtagscombinationRes[i].itemid}#${itemtagscombinationRes[i].itemname.trim()}`);
+
+                        // $('#skudetailitem').val(itemtagscombinationRes[i].sku)
+                        // $('.des_productdes').html(itemtagscombinationRes[i].itemdescription);
+                        updateDetailsByObj(itemtagscombinationRes[i]);
+                    }else{
+                      
+                        let name = itemtagscombinationRes[i].itemname.split('-')[0];
+                        $('#addtocart').addClass('disabled');
+                        $('.buynow').attr('disabled', true);
+                        let itemsName = name;
+                        $('.borderselector').each(function (i,e){
+                            itemsName += ` ${$(e).html().trim()}`;
+                        });
+
+                        updateItemId(null);
+
+                       specification_wrap_action.remove();
+                        $('#skudetailitem').val(-1)
+                         $('.productname').html(itemsName)
+                         history.replaceState(null, null, `#`);
+                         
+                         $('.msgErrorDetailsItem').removeClass('d-none');
+                         $('.des_productdes').html('');
+                        $('.price').html('');
+                    }
+                  
+                    initAddToCart()
+                    return;
+                  
+                }
+            
+        }
+
+        let name = itemtagscombinationRes[0].itemname.split('-')[0];
+        let itemsName = name;
+        $('.borderselector').each(function (i,e){
+            itemsName += `- ${$(e).html().trim()}`;
+        })
+        specification_wrap_action.remove();
+            $('.productname').html(itemsName)
+            $('#skudetailitem').val(-1)
+        $('.price').html('');
+        $('#addtocart').addClass('disabled');
+        $('.buynow').attr('disabled', true);
+        $('.msgErrorDetailsItem').removeClass('d-none');
+        
+        initAddToCart()
+    }
+
+    function getAllCombination(){
+     const currClickAttr =  $(currentClick).html().trim();
+
+     let isThere = [];
+     for(let item in isThereInLabel){
+        let {tagnames} = isThereInLabel[item];
+        if(tagnames.includes(currClickAttr)){
+            isThere.push( isThereInLabel[item])
+        }
+     }
+        let selected = [];
+        $('.borderselector').each(function (i,e){
+            selected.push($(e).html().trim())
+        });
+        
+        // console.log(selected);
+        // console.log(isThere);
+
+        let ishashObj = {};
+
+        for(let i=0;i<isThere.length;i++){
+            let  {tagnames,tagids} = isThere[i];
+            tagnames = tagnames.split('|');
+            tagids = tagids.split('|');
+
+            for(let j=0;j<tagnames.length;j++){
+                if(!ishashObj[tagnames[j]]){
+                    ishashObj[tagnames[j]] = tagids[j];
+                }
+            }
+        }
+
+        // console.log(ishashObj);
+
+        // for(let i=0;i<itemtagscombinationRes.length;i++){
+            
+        // }
+    
+    }
+
+
+    async function getProductDetails(id){
+        
+ 
+
+        // let res = await getStatAPIService(`${SERVERNAME}/apis/v4/bizgaze/integrations/products/productattributelist/productid/${id}`);
+  
+        let resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/productattributelist/productid/${id}`,true);
+console.log(resData,'resDataresDataresDataresDataresData');
+        if(resData.isError){
+            loadingActions.removeLoader();
+            alert(resData.errorMsg.message);
+            return;
+        }
+
+        let res = resData.response;
+            
+        res = JSON.parse(res.result);
+        // console.log(res);
+
+      if(!res) {
+        loadingActions.removeLoader();
+        return;
+      };
+
+        
+       
+
+        let html = '';
+     
+        for(let i=0;i<res.length;i++){
+            const currItem = res[i];
+            // parenttagid means under what label
+            // tag id means it know unquie id
+            const {parentattribute,parenttagid,tagid,attribute,productid} = currItem;
+
+            if(labels[parentattribute]){
+                labels[parentattribute].items.push({
+                    attribute,
+                    tagid:tagid
+                });
+            }else{
+                labels[parentattribute] = {
+                    id:parenttagid,
+                    items:[{
+                        attribute,
+                        tagid:tagid
+                    }]
+                };
+                html += getParentHTML(parentattribute,productid,parenttagid,i==0);
+            }
+
+        }
+        $('#spec-container-details').html(html);
+       
+
+        // console.log(labels,'labels');
+
+        let childIds = [];
+
+        for(let item in labels){
+            let {id,items} = labels[item];
+            // $(`[data-tagid=${id}]`)
+            let html = '';
+          
+            for(let i=0;i<items.length;i++){
+                const {attribute,tagid} = items[i]
+                childIds.push(tagid);
+                group[attribute] = item;
+                html +=  getChildHTML(tagid,attribute,i==0);
+            }
+            $(`[data-tagid="${id}"]`).html(html);
+        }
+
+        // itemtagscombinationRes = await API_SERVICES_ACTIONS.getAPIService(`pis/v4/bizgaze/integrations/products/getitemwithoutbranch/productid/${id}`,true); 
+        itemtagscombinationRes = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/itemtagscombination/productid/${id}`,true); 
+
+        itemtagscombinationRes = JSON.parse(itemtagscombinationRes.response.result);
+         console.log(itemtagscombinationRes);
+
+        let valuesSelected = [];
+
+        $('.borderselector').each(function (i,el){
+        
+            let val = $(el).html();
+            valuesSelected.push(val.trim());
+        });
+    
+        let searchParams = window.location.search.split("&");
+        let skuId = window.location.hash.split('#')[1].split('=')[1];
+        // skuId = skuId.split('=')[1]
+        let isGo = true;
+        for(let i=0;i<itemtagscombinationRes.length;i++){
+            const currItem = itemtagscombinationRes[i];
+           
+            const {tagnames,sku,itemid} = currItem;
+          
+            isThereInLabel[tagnames] = itemtagscombinationRes[i];
+
+
+            let isTrue = true;
+            if(isGo){
+                // for(let i=0;i<valuesSelected.length;i++){
+                //     if(!tagnames.includes(valuesSelected[i])){
+                //         isTrue = false
+                //     }
+                // }
+                if(skuId != itemid){
+                    isTrue = false
+                }
+    
+                if(isTrue){
+                    
+                    console.log(itemtagscombinationRes[i],'itemtagscombinationRes[i]');
+
+
+                    currentComb = itemtagscombinationRes[i];
+                   // location.hash = itemtagscombinationRes[i].itemname.trim();
+
+                    // $('.productname').html(itemtagscombinationRes[i].itemname);
+                    // $('#skudetailitem').val(itemtagscombinationRes[i].sku)
+                    // $('.price').html(itemtagscombinationRes[i].pricelist)
+               
+                    // appendSpecs(itemtagscombinationRes[i].itemid);
+                    // $('.des_productdes').html(itemtagscombinationRes[i].itemdescription);
+
+                    updateDetailsByObj(itemtagscombinationRes[i]);
+
+
+
+                    isGo = false;
+                    let {tagnames,tagids,pricelist} = itemtagscombinationRes[i];
+                        tagids = tagids.split('|');
+                        tagnames = tagnames.split('|');
+                        $('.optiontaganwi').removeClass('borderselector');
+             
+                        for(let i=0;i<tagids.length;i++){
+                        
+                            $(`[data-tagiditem="${tagids[i]}"]`).addClass('borderselector');
+                        } 
+                   // tagiditem
+                }
+            }
+        }
+
+
+        if(isGo){
+            if(itemtagscombinationRes.length === 0){
+                loadingActions.removeLoader();
+                toasterHelper("error","Something went wrong!",`toast-top-right`)
+                return;
+            }
+            console.log(itemtagscombinationRes[0]);
+            let {tagnames,tagids,pricelist} = itemtagscombinationRes[0];
+            tagids = tagids.split('|');
+            tagnames = tagnames.split('|');
+            $('.optiontaganwi').removeClass('borderselector');
+            currentComb = itemtagscombinationRes[0];
+           // updateItemId(itemtagscombinationRes[0].itemid);
+            
+            for(let i=0;i<tagids.length;i++){
+             
+                $(`[data-type="${tagids[i]}-${tagnames[i]}"]`).addClass('borderselector');
+            }
+
+            // $('.price').html(pricelist);
+            // $('.des_productdes').html(itemtagscombinationRes[0].itemdescription);
+            // appendSpecs(itemtagscombinationRes[0].itemid);
+
+            updateDetailsByObj(itemtagscombinationRes[0]);
+            //console.log(childIds);
+            // 
+          
+        }
+      
+        //getAllCombination(valuesSelected)
+
+      
+        
+        // for(let i=0;i<itemtagscombinationRes.length;i++){
+        //     const {tagnames} = itemtagscombinationRes[i];
+            
+        // }
+
+        $('#spec-container-details').children().find('.specsmallcard').removeClass('specsmallcard');
+
+        addeventlisteners();
+        loadingActions.removeLoader();
+        return;
+        // let resTwo = await postStatAPIService(`${SERVERNAME}/apis/v4/bizgaze/integrations/products/itemtagscombination/productid/${id}`);
+            
+      
+        //let html = '';
+        let attributesObj = {};
+        for(let i=0;i<res.length;i++){
+            const {parentattribute,tagid,productid} = res[i];
+            // let attributes = await postStatAPIService(`${SERVERNAME}/apis/v4/bizgaze/integrations/products/productattributelist/parenttagid/${tagid}`);
+            // attributesObj[tagid] = JSON.parse(attributes.data.result);
+            // console.log(attributes.data.result,tagid);
+            html += getParentHTML(parentattribute,productid,tagid,i==0);
+        }
+
+        $('#spec-container-details').html(html);
+
+       
+        // let attributes = await postStatAPIService(`${SERVERNAME}/apis/v4/bizgaze/integrations/products/productattributelist/parenttagid/${tagid}`);
+        return;
+        for(let attr in attributesObj){
+            const arr = attributesObj[attr];
+           
+            let html = '';
+            for(let i=0;i<arr.length;i++){
+                const {attribute,tagid} = arr[i];
+                html += getChildHTML(tagid,attribute,i==0);
+            }
+
+            
+            $(`[data-tagid="${attr}"]`).html(html);
+
+
+        }
+
+        let defaultValues = await postStatAPIService(`${SERVERNAME}/apis/v4/bizgaze/integrations/products/sellableitemlist/productid/${id}`);
+        defaultValues = JSON.parse(defaultValues.data.result);
+        let {itemname,price} = defaultValues[0];
+        $('.productname').html(itemname);
+        $('.price').html(price)
+
+        $('#spec-container-details').children().slice(1).find('.specsmallcard').removeClass('specsmallcard');
+
+
+        
+
+       // getQuantityById(id)
+       
+    
+
+    }
+
+    
+}
+
+startDetails();
+

dist/js/productdetails_old.js

@@ -0,0 +1,243 @@
+const mainPhoto = $('.productDetailsMain > img');
+let currentTypeModal = null;
+
+function onClickHandler(e) {
+    $(e).parent().find('.borderselector').removeClass('borderselector');
+
+    $(e).addClass('borderselector')
+
+}
+
+
+function setProductData(data) {
+    if (!data) return;
+    const productname = data.displayName;
+
+    $('.productname').html(data.displayName)
+
+    const type = data.productType;
+    switch (type) {
+        case 'ram':
+            // setRamProduct(data.type)
+             setProductRam_new(data.type)
+            break;
+
+        default:
+            break;
+    }
+}
+
+// new
+
+function setProductRam_new(data){
+    const {name,specs} = data;
+
+    $('.productname').html(name);
+    let parent = $('.memory-parent').find('.borderselector').html();
+    let ramTech =  parent.trim().toLowerCase()
+    genrateChildMem(ramTech);
+
+}
+
+function getChildHTML(name,isTrue,attr){
+    let data_attr = attr;
+    if(data_attr == undefined){
+        return ` <div data-${attr}="${attr}" type="button" onclick="onClickHandler(this)" class="specsmallcard-mini ${isTrue?'borderselector':''} card small-font p-3" data-version="${name}">
+        ${name}
+    </div>`;
+    }else{
+        return ` <div data-${attr}="${attr}" type="button" onclick="onClickHandler(this)" class="specsmallcard-mini ${isTrue?'borderselector':''} card small-font p-3" data-gb="${name}">
+        ${name}
+    </div>`;
+    }
+
+}
+
+function computerSizeClick(obj){
+    $(`[data-computersize="computersize"]`).off().click(function (e){
+        let size = $(e.target).html().trim().toLowerCase();
+       
+        setPrice(size);
+        // if(size == '16gb'){
+        //     const str = './dist/assets/imgs/Home_new/Home_Carousel_2.png';
+        //     $('.productDetailsMain > img').attr('src',str);
+
+        // }
+    })
+
+    // console.log($($(`[data-computersize="computersize"]`)[0]).html().trim().toLowerCase());
+    function setPrice(size){
+        let namehelper = $('.ramtech').find('.borderselector').html().trim().toLowerCase();
+        let devHelper = $('.memorycontainer').find('.borderselector').html().trim().toLowerCase();
+        let name = '';
+        let realName = '';
+        let imgURL = '';
+        if(namehelper === 'ddr4' &&  devHelper === 'desktop'){
+            name = 'priceddr4d'
+       
+        }else if(namehelper === 'ddr5' &&  devHelper === 'desktop'){
+            name = 'priceddr5d'
+        }else if(namehelper === 'ddr4' &&  devHelper === 'laptop'){
+            name = 'priceddr4l'
+        }else {
+            name = 'priceddr5l'
+        }
+    if(size == '16gb'){
+        $('.price').html(obj[name][1]);
+        $('.productname').html(obj[`${name}name`][1]);
+        $('.productDetailsMain img').attr('src',obj[`${name}img`][1])
+    }else if(size == '32gb'){
+        $('.price').html(obj[name][2]);
+        $('.productname').html(obj[`${name}name`][2]);
+        $('.productDetailsMain img').attr('src',obj[`${name}img`][2])
+    }else{
+        $('.price').html(obj[name][0]);
+        $('.productname').html(obj[`${name}name`][0]);
+        $('.productDetailsMain img').attr('src',obj[`${name}img`][0]);
+    }
+    }
+
+    let size = $($(`[data-computersize="computersize"]`)[0]).html().trim().toLowerCase();
+    setPrice(size);
+}
+
+function genrateChildMem(ramTech,attr){
+    let remTechArr = obj[ramTech];
+    let items = '';
+    for(let i=0;i<remTechArr.length;i++){
+        items += getChildHTML(remTechArr[i],i==0,attr); 
+    }
+
+    $('.ramtech').html(items);
+    $(`[data-${attr}="${attr}"]`).off().click(function (e){
+        let ram = $(e.target).html().trim().toLowerCase();
+        const ans = obj[ram];
+        let html ='';
+        for(let i=0;i<ans.length;i++){
+            html += getChildHTML(ans[i],i==0,'computersize')
+        }
+        $('.computersize').html(html);
+        computerSizeClick(obj);
+    })  
+
+    const ans = obj[remTechArr[0].toLowerCase()];
+    let html ='';
+    for(let i=0;i<ans.length;i++){
+        html += getChildHTML(ans[i],i==0,'computersize')
+    }
+    $('.computersize').html(html);
+
+    computerSizeClick(obj);
+
+
+}
+
+$('.memorycontainer').click(function (e){
+    const type = $(e.target).data('type');
+    if(type !== 'memory-desktop' && type !== 'memory-laptop') return;
+
+    $(e.target).parent().find('.borderselector').removeClass('borderselector');
+    $(e.target).addClass('borderselector');
+
+    if(type == 'memory-desktop'){
+        debugger;
+        genrateChildMem('desktop','ramtech');
+    }else{
+        genrateChildMem('laptop','ramtech');
+    }
+})
+
+
+
+// new end
+
+function init() {
+    $('.product-item-gallery > img').each(function (i, el) {
+        $(el).click(function (e) {
+            $('.product-item-gallery.active-gallery-img').removeClass('active-gallery-img');
+            let src = $(e.target).attr('src');
+
+            $(e.target).parent().addClass('active-gallery-img');
+            mainPhoto.attr('src', src);
+        })
+    })
+
+
+    // const data = getDataProduct();
+    setProductRam_new(obj);
+
+    // setProductItemData(rams);
+
+}
+
+
+
+let obj = {
+    name:'ORA3',
+    desktop:['DDR4','DDR5'],
+    laptop:['DDR4','DDR5'],
+    ddr4:['8GB','16GB','32GB'],
+    ddr5:['8GB','16GB','32GB'],
+    priceddr4l:[2990, 4750, 8450],
+     priceddr5l:[5150, 7800, 13900],
+     priceddr4d:[2990, 4750, 9450],
+     priceddr5d:[5800, 7600, 15500],
+     priceddr4lname:['ORA 8GB DDR4 3200MHz Laptop RAM','ORA 16GB DDR4 3200MHz Laptop RAM','ORA 32GB DDR4 3200MHz Laptop RAM'],
+     priceddr5lname:['ORA 8GB DDR5 4800MHz Laptop RAM','ORA 16GB DDR5 4800MHz Laptop RAM','ORA 32GB DDR5 4800MHz Laptop RAM'], 
+
+     priceddr4dname:['ORA 8GB DDR4 3200MHz Desktop RAM','ORA 16GB DDR4 3200MHz Desktop RAM','ORA 32GB DDR4 3200MHz Desktop RAM'],
+     priceddr5dname:['ORA 8GB DDR5 4800MHz Desktop RAM','ORA 16GB DDR5 4800MHz Desktop RAM','ORA 32GB DDR5 4800MHz Desktop RAM'],
+   
+
+    priceddr4limg:['../dist/assets/imgs/accessiories/ram/ddr4-laptop.jpg','../dist/assets/imgs/accessiories/ram/ddr4-laptop.jpg', '../dist/assets/imgs/accessiories/ram/ddr4-laptop.jpg'],
+    priceddr5limg:['../dist/assets/imgs/accessiories/ram/ddr5-laptop.jpg', '../dist/assets/imgs/accessiories/ram/ddr5-laptop.jpg', '../dist/assets/imgs/accessiories/ram/ddr5-laptop.jpg'], 
+
+    priceddr4dimg:['../dist/assets/imgs/accessiories/ram/ddr4-desktop.jpg', '../dist/assets/imgs/accessiories/ram/ddr4-desktop.jpg','../dist/assets/imgs/accessiories/ram/ddr4-desktop.jpg'],
+    priceddr5dimg:['../dist/assets/imgs/accessiories/ram/ddr5-desktop.jpg','../dist/assets/imgs/accessiories/ram/ddr5-desktop.jpg','../dist/assets/imgs/accessiories/ram/ddr5-desktop.jpg'],
+}
+
+
+
+init();
+
+
+// function startDetails(){
+
+//     let productId = window.location.search.split('=')[1];
+//     console.log(productId);
+//     getProductDetails(productId);
+
+//     function getParentHTML(name,productid,id){
+//         return `<div class="pb-2 $${name?.replace(" ",'')}-parent">
+//         <h5 class="py-2 smallHeadingProductDetails">${name}</h5>
+//         <div class="d-flex gap-2 ${id}container" data-tagid="${id}">
+           
+//         </div>
+//     </div>`;
+//     }
+
+
+//     async function getProductDetails(id){
+//         let res = await postStatAPIService(`${SERVERNAME}/apis/v4/bizgaze/integrations/products/producttagname/productid/${id}`);
+//         res = JSON.parse(res.data.result);
+//         console.log(res);
+//         let html = '';
+
+//         for(let i=0;i<res.length;i++){
+//             const {parentattribute,tagid,productid} = res[i];
+//             debugger;
+//             html += getParentHTML(parentattribute,productid,tagid);
+//         }
+
+//         $('#spec-container-details').html(html);
+
+
+
+
+
+
+//     }
+// }
+
+// startDetails();
+

dist/js/products/accessories.js

@@ -0,0 +1,188 @@
+function initAcc(){
+    INIT();
+    async function INIT(){
+        const productsIds =  await getProductIds(['SSD ORA',"RAM ORA"]);
+        appendWithIds(productsIds);
+    }
+
+    async function appendWithIds(productsIds){
+        let html = '';
+        for(let i=0;i<productsIds.length;i++){
+            let productId = productsIds[i];
+            let res = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/itemtagscombination/productid/${productId}`,true);
+
+            if(res.isError){
+                alert("something went wrong");
+                return;
+            }
+
+            res = JSON.parse(res.response.result);
+            console.log(res);
+
+            
+            for(let j=0;j<res.length;j++){
+                html += getRamCardHTML(res[j]);
+            }
+        }
+
+        $('.product_card_section').html(html)
+    }
+
+    async function getProductIds(productsIdReqArr){
+        let resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/getallproducts`,true);
+        
+        if(resData.isError){
+            alert("Something went wrong");
+            return;
+        }
+
+        resData = JSON.parse(resData.response.result);
+
+        let productsIds = [];
+
+        for(let i=0;i<resData.length;i++){
+            let curr = resData[i];
+            let productname = curr.productname;
+            if(productsIdReqArr.includes(productname)){
+                productsIds.push(curr.productid)
+            }
+        }
+        console.log(productsIds);
+
+        console.log(resData);
+        return productsIds;
+
+    }
+
+    function getRamCardHTML({itemname,pricelist,itemid,sku,itemimageurl,productid}){
+        let img = itemimageurl ? imgServerNameBuild(itemimageurl) : './dist/assets/imgs/nophoto.png'
+        let tags = itemname.split('-');
+        let ramTech = tags[tags.length-2];
+        let gb =  tags[tags.length-1];
+        const [currencySymbol,amount] = getCurrencySymbol(pricelist);
+        let priceAmt = `${currencySymbol} ${amount}`;
+
+        let detailPageName;
+        let addSearch = '?';
+        if (window.location.href.includes('laptops')) {
+            detailPageName = 'laptopdetails';
+            let name = itemname.toLowerCase().includes('zeno') ? 'Zeno' : 'Fyro';
+            addSearch = `?${name}`;
+        } else {
+            detailPageName = 'productdetails';
+        };
+      
+        debugger;
+        return `<div class="col-lg-4 col-md-6 mb-4 col-md-6 ram_card cursor-pointer">
+            <div class="card border bg-gray-3 rounded-3 p-1 h-100">
+            
+            <a href="/${detailPageName}.html${addSearch}productId=${productid}#itemid=${itemid}" class=""><img  src="${img}" alt="${itemname}" class="w-100 h-100 p-5"></a>
+                <div class="card-body">
+                    <a href="/${detailPageName}.html${addSearch}productId=${productid}#itemid=${itemid}" class="">
+                        <h5 class="card-title satoshi_font mb-0 px-2 text-center font-weight-600">${itemname}</h5>
+                        </a>
+                </div>
+                <hr>
+                <ul class="border-0 d-flex h-100 justify-content-between px-md-3 px-4 list-group-flush p-0 text-secondary" style="list-style: none;">
+                    <li class="border-0 py-0">
+                        <span class="satoshi_font">  <h6>${gb}</h6> <h6>${ramTech}</h6></span>
+                    </li>
+                    <li class="border-0 py-0">
+                        <span class="satoshi_font"><h6>${pricelist?priceAmt:'Comming Soon'}</h6></span>
+                    </li>
+                </ul>
+                <div class="card-body text-center">
+                    <a href="/${detailPageName}.html?productId=${productid}#itemid=${itemid}" class="btn bg-white font-1-2 px-5 w-100">Details
+                    </a>
+                </div>
+        
+            </div>
+        </div>`
+        
+        return `<div class="col-lg-4 col-md-6 mb-4 col-md-6 ram_card cursor-pointer">
+        <div class="card border bg-gray-3 rounded-3 p-1 h-100">
+        
+        <a href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}" class=""><img src="${img}" alt="${itemname}" class="w-100 h-100"></a>
+            <div class="card-body">
+            <a href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}" class="">
+                <h5 class="card-title satoshi_font mb-0 px-2 text-center font-weight-600">${itemname}</h5>
+                </a>
+            </div>
+            <ul class="border-0 d-flex h-100 justify-content-between px-md-3 px-4 list-group-flush p-0 text-secondary" style="list-style: none;">
+                <li class="border-0 py-0">
+                    <span class="satoshi_font">  <h6>${gb}</h6> <h6>${ramTech}</h6></span>
+                </li>
+                <li class="border-0 py-0">
+                    <span class="satoshi_font"><h6>${priceAmt}</h6></span>
+                </li>
+            </ul>
+            <div class="card-body text-center">
+                <a href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}" class="btn bg-white font-1-2 px-5 w-100">Details
+                </a>
+            </div>
+    
+        </div>
+    </div>`;
+
+        //abhi anna design
+        return ` 
+        
+            <!--desktop--->
+            <div class="col-sm-4 p-3">
+                <div class="product_card_3 shadow ram_card">
+                    <div class="card-item-header">
+                        <div class="card-header-sub-3"><a class=" py-md-1" href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}">
+                        <img src="${img}" class="w-100 h-100"></a>
+                        </div>
+                    </div>
+                    <div class="card-item-body">
+                      <h3 cclass="mb-2"> <a href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}" class="" >  ${itemname} </a></h3>
+                      <hr>
+                        <h6>${gb}</h6> <h6>${ramTech}</h6><h6>${priceAmt}</h6>
+                        <div class="py-2 card_product_footer">
+                            <button   data-sku="${sku}" data-itemid="${itemid}" class="w-100 border-0 ramcard bg-transparent satoshi_font ram_btn" data_name="ORA 8GB DDR4 3200MHz Desktop RAM "  data_version="DDR4" data_device="Desktop" data_gb="8GB"   data_price="2900">Details </button>
+                        </div>
+                    </div>
+                </div>
+         </div>
+           `;
+        return `<div class="col-lg-3 col-md-6 ram_card">
+        <div class="card shadow border-0 p-1 h-100">
+            <a href="#">
+                <img src="../dist/assets/imgs/Navbar/ora_ddr5_laptop.png" class="card-img-top" alt="...">
+            </a>
+            <div class="card-body">
+                <a href="#" class="text-decoration-none text-dark">
+                    <h5 class="card-title satoshi_font mb-0">
+                        ${itemname}
+                    </h5>
+                </a>
+            </div>
+            <ul class="list-group list-group-flush">
+                <li class="list-group-item border-0 py-0">
+                    <span class="satoshi_font">${gb} ${ramTech}</span>
+                </li>
+                <li class="list-group-item border-0 py-0">
+                    <span class="satoshi_font">3200 Mhz</span>
+                </li>
+            </ul>
+            <div class="card-body d-none">
+                <button class="btn--md btn-primary w-100 card-link">
+                    <span class="cost currency-symbol">₹</span><span class="cost product-price satoshi_font">${pricelist}</span>
+                </button>
+            </div>
+            <div class="card-body text-center">
+                <div  data-sku="${sku}" data-itemid="${itemid}" class="bg-black ramcard btn font-1-2 px-5 text-white w-100 satoshi_font" data_des="Upgrade your laptop with DDR4 Laptop
+                    Memory, oering 3200 MHz speed in 8, 16,
+                    and 32 GB capacities. Experience enhanced
+                    thermal performance, increased longevity,
+                    and superior performance with our
+                    innovative graphene sticker technology." data_name="ORA 8GB DDR4 3200MHz Laptop RAM ">Details
+                </div>
+            </div>
+        </div>
+    </div>`
+    }
+}
+
+initAcc();

dist/js/products/allinoneproduct.js

@@ -0,0 +1,316 @@
+function ramProductsInit(){
+    let RAM_ID =  '';
+  
+    async function init(){
+        let id 
+        if(location.search==''&&(location.href.includes('laptops')||location.href.includes('allinones'))){
+            id = await  getallproductsFun();
+        }else{
+            id = await getProductIdService();
+        }
+        getRamData(id)
+    }
+
+    async function getProductsIds(nameArr){
+        let resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/getallproducts`,true); 
+        if(resData.isError){
+            toasterHelper("error","Something went wrong!")
+            return;
+        }
+
+        let res = resData.response;
+                
+        res = JSON.parse(res.result);
+        let ids = [];
+
+        for(let i=0;i<nameArr.length;i++){
+            const currName = nameArr[i];
+            let id = res.find((item)=>{
+                if(currName === item.productname){
+                    return item.productid;
+                }
+            })
+            if(id){
+                ids.push(id);
+            }
+        }
+
+        return ids;
+
+    }
+
+    async function getallproductsFun(){
+        let laptopStr = ['FYRO Flagship','Zeno Dualbook','Zeno Sleekbook'];
+        let allInOnesStr = ['AIO Zeno','AIO Fyro']; 
+
+        
+
+        let name = window.location.href;
+
+        name = name.includes('laptops') ?laptopStr : allInOnesStr;
+
+        const ids = await getProductsIds(name);
+
+        console.log(ids);
+
+        return ids;
+
+    }
+
+    function getProductIdService(){
+        return new Promise(async (reslove,reject)=>{
+            
+            let resData =await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/getallproducts`,true); 
+           if(resData.isError){
+                alert(resData.errorMsg.message);
+                return;
+            }
+
+            let res = resData.response;
+                
+            res = JSON.parse(res.result);
+
+            console.log(res);
+
+            let searchName = window.location.search.split('?')[1];
+            let urlPathName = window.location.pathname; 
+            let searchTerm = '';
+             if(urlPathName.includes('ram')){
+                searchTerm = "RAM ORA";
+            }else if(urlPathName.includes('storage')){
+                searchTerm = `SSD ORA`;
+            }else{
+                searchTerm = searchName.replaceAll('%20',' ');
+            }
+            let resultItem = [];
+            
+            if(searchTerm.toLowerCase() === 'zeno'){
+                for(let i=0;i<res.length;i++){
+                    if(res[i].productname.includes("Zeno Sleekbook")||res[i].productname.includes("Zeno Dualbook")){
+                        resultItem.push( res[i])
+                        
+                    }
+                }
+                
+                return reslove(resultItem)
+            }else if(searchTerm.toLowerCase() === 'fyro'){
+                for(let i=0;i<res.length;i++){
+                    if(res[i].productname.includes("FYRO Flagship")){
+                        resultItem.push( res[i]);
+                        return reslove(resultItem)
+                    }
+                }
+            }else{
+                for(let i=0;i<res.length;i++){
+                    if(res[i].productname.includes(searchTerm)){
+                        resultItem.push( res[i])
+                        
+                    }
+                }
+         
+                return reslove(resultItem)
+            }
+
+            
+
+        });
+    }
+
+    async function getRamData(ids){
+        let resData;
+        let res
+        let data = [];
+       let windowSearch = window.location.href;
+        for(let i=0;i<ids.length;i++){
+            let id = ids[i].productid;
+            if (windowSearch.includes('laptops')||windowSearch.includes('allinones')) {
+                resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/Bizgaze/integrations/products/getitemwithoutbranch/productid/${id}`, true);
+            }
+            else {
+                resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/itemtagscombination/productid/${id}`, true);
+            }
+            if(resData.isError){
+                alert(resData.errorMsg.message);
+                return;
+            }
+    
+            res = resData.response;
+            
+            res = JSON.parse(res.result);
+            data = [...data,...res];
+        }
+        
+        
+        
+       
+
+        console.log(data);
+        let html = '';
+
+        for(let i=0;i<data.length;i++){
+            if(data[i].itemname.includes('AIO Fyro - 32')) continue;
+            html += getRamCardHTML(data[i]);
+        }
+
+        $('.product_card_section').html(html);
+
+        if(window.location.href.includes("?AIO%20Fyro")){
+            $(".processor_name").text("i7 / i9");
+            $('.product_card_section div.ram_card').addClass("d-none");
+            $('.product_card_section div.ram_card:nth-child(1)').removeClass("d-none");
+        }
+        if(window.location.href.includes("?AIO%20Zeno")){
+             $('.product_card_section div.ram_card').addClass("d-none");
+             $('.product_card_section div.ram_card:nth-child(14)').removeClass("d-none");
+             $('.product_card_section div.ram_card:nth-child(15)').removeClass("d-none");
+        }
+        // $('.ramcard').click(function(e){
+     
+        //     let sku = $(e.target).data('itemid');
+        //     let itemid = $(e.target).data('itemid');
+   
+        //     window.location.href = `/productdetails.html?productId=${RAM_ID}#itemid=${itemid}`
+
+        // })
+    }
+
+    function getRamCardHTML({itemname,pricelist,itemid,sku,itemimageurl,productid}){
+        let img = itemimageurl ? imgServerNameBuild(itemimageurl) : './dist/assets/imgs/nophoto.png'
+        let tags = itemname.split('-');
+        let ramTech = tags[tags.length-2];
+        let gb =  tags[tags.length-1];
+        const [currencySymbol,amount] = getCurrencySymbol(pricelist);
+        let priceAmt = `${currencySymbol} ${amount}`;
+
+        let detailPageName;
+        debugger;
+        let addSearch = '';
+        if (window.location.href.includes('laptops')||window.location.href.includes('allinones')) {
+            detailPageName = 'laptopdetails';
+            let name = itemname.toLowerCase().includes('zeno') ? 'Zeno' : 'Fyro';
+            addSearch = `?${name}`;
+        } else {
+            // detailPageName = 'productdetails';
+           detailPageName = 'laptopdetails';
+        };
+        return `<div class="col-lg-4 col-md-6 mb-4 col-md-6 ram_card cursor-pointer">
+            <div class="card border bg-gray-3 rounded-3 p-1 h-100">
+            
+            <a href="/${detailPageName}.html${addSearch}#productId=${productid}#itemid=${itemid}" class=""><img loading="lazy" src="${img}" alt="${itemname}" class="w-100 h-100 p-5"></a>
+                <div class="card-body">
+                    <a href="/${detailPageName}.html${addSearch}#productId=${productid}#itemid=${itemid}" class="">
+                        <h5 class="card-title satoshi_font mb-0 px-2 text-center font-weight-600">${itemname}</h5>
+                        </a>
+                </div>
+                <hr>
+                <ul class="border-0 d-flex h-100 justify-content-between px-md-3 px-4 list-group-flush p-0 text-secondary" style="list-style: none;">
+                    <li class="mb-0 processor_name">i3 / 15 / i7</li>
+                </ul>
+                <ul class="border-0 d-flex h-100 justify-content-between px-md-3 px-4 list-group-flush p-0 text-secondary" style="list-style: none;">
+                    <li class="border-0 py-0">
+                        <span class="satoshi_font">
+                            <h6>${gb}</h6> 
+                            <h6 class="d-none">${ramTech}</h6>
+                        </span>
+                    </li>
+                    <li class="border-0 py-0">
+                        <span class="satoshi_font"><h6>${pricelist?priceAmt:'Comming Soon'}</h6></span>
+                    </li>
+                </ul>
+                <div class="card-body text-center">
+                    <a href="/${detailPageName}.html${addSearch}#productId=${productid}#itemid=${itemid}" class="btn bg-white font-1-2 px-5 w-100">Details
+                    </a>
+                </div>
+        
+            </div>
+        </div>`
+        
+        return `<div class="col-lg-4 col-md-6 mb-4 col-md-6 ram_card cursor-pointer">
+        <div class="card border bg-gray-3 rounded-3 p-1 h-100">
+        
+        <a href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}" class=""><img src="${img}" alt="${itemname}" class="w-100 h-100"></a>
+            <div class="card-body">
+            <a href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}" class="">
+                <h5 class="card-title satoshi_font mb-0 px-2 text-center font-weight-600">${itemname}</h5>
+                </a>
+            </div>
+            <ul class="border-0 d-flex h-100 justify-content-between px-md-3 px-4 list-group-flush p-0 text-secondary" style="list-style: none;">
+                <li class="border-0 py-0">
+                    <span class="satoshi_font">  <h6>${gb}</h6> <h6>${ramTech}</h6></span>
+                </li>
+                <li class="border-0 py-0">
+                    <span class="satoshi_font"><h6>${priceAmt}</h6></span>
+                </li>
+            </ul>
+            <div class="card-body text-center">
+                <a href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}" class="btn bg-white font-1-2 px-5 w-100">Details
+                </a>
+            </div>
+    
+        </div>
+    </div>`;
+
+        //abhi anna design
+        return ` 
+        
+            <!--desktop--->
+            <div class="col-sm-4 p-3">
+                <div class="product_card_3 shadow ram_card">
+                    <div class="card-item-header">
+                        <div class="card-header-sub-3"><a class=" py-md-1" href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}">
+                        <img src="${img}" class="w-100 h-100"></a>
+                        </div>
+                    </div>
+                    <div class="card-item-body">
+                      <h3 cclass="mb-2"> <a href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}" class="" >  ${itemname} </a></h3>
+                      <hr>
+                        <h6>${gb}</h6> <h6>${ramTech}</h6><h6>${priceAmt}</h6>
+                        <div class="py-2 card_product_footer">
+                            <button   data-sku="${sku}" data-itemid="${itemid}" class="w-100 border-0 ramcard bg-transparent satoshi_font ram_btn" data_name="ORA 8GB DDR4 3200MHz Desktop RAM "  data_version="DDR4" data_device="Desktop" data_gb="8GB"   data_price="2900">Details </button>
+                        </div>
+                    </div>
+                </div>
+         </div>
+           `;
+        return `<div class="col-lg-3 col-md-6 ram_card">
+        <div class="card shadow border-0 p-1 h-100">
+            <a href="#">
+                <img src="../dist/assets/imgs/Navbar/ora_ddr5_laptop.png" class="card-img-top" alt="...">
+            </a>
+            <div class="card-body">
+                <a href="#" class="text-decoration-none text-dark">
+                    <h5 class="card-title satoshi_font mb-0">
+                        ${itemname}
+                    </h5>
+                </a>
+            </div>
+            <ul class="list-group list-group-flush">
+                <li class="list-group-item border-0 py-0">
+                    <span class="satoshi_font">${gb} ${ramTech}</span>
+                </li>
+                <li class="list-group-item border-0 py-0">
+                    <span class="satoshi_font">3200 Mhz</span>
+                </li>
+            </ul>
+            <div class="card-body d-none">
+                <button class="btn--md btn-primary w-100 card-link">
+                    <span class="cost currency-symbol">₹</span><span class="cost product-price satoshi_font">${pricelist}</span>
+                </button>
+            </div>
+            <div class="card-body text-center">
+                <div  data-sku="${sku}" data-itemid="${itemid}" class="bg-black ramcard btn font-1-2 px-5 text-white w-100 satoshi_font" data_des="Upgrade your laptop with DDR4 Laptop
+                    Memory, oering 3200 MHz speed in 8, 16,
+                    and 32 GB capacities. Experience enhanced
+                    thermal performance, increased longevity,
+                    and superior performance with our
+                    innovative graphene sticker technology." data_name="ORA 8GB DDR4 3200MHz Laptop RAM ">Details
+                </div>
+            </div>
+        </div>
+    </div>`
+    }
+
+    init();
+}
+
+ramProductsInit();

dist/js/products/laptopproduct.js

@@ -0,0 +1,419 @@
+function ramProductsInit(){
+    let RAM_ID =  '';
+  
+    async function init(){
+        let id 
+        if(location.search==''&&(location.href.includes('laptops')||location.href.includes('allinones'))){
+            id = await  getallproductsFun();
+        }else{
+            id = await getProductIdService();
+        }
+        getRamData(id)
+    }
+
+    async function getProductsIds(nameArr){
+        let resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/getallproducts`,true); 
+        if(resData.isError){
+            toasterHelper("error","Something went wrong!")
+            return;
+        }
+
+        let res = resData.response;
+                
+        res = JSON.parse(res.result);
+        let ids = [];
+
+        for(let i=0;i<nameArr.length;i++){
+            const currName = nameArr[i];
+            let id = res.find((item)=>{
+                if(currName === item.productname){
+                    return item.productid;
+                }
+            })
+            if(id){
+                ids.push(id);
+            }
+        }
+
+        return ids;
+
+    }
+
+    async function getallproductsFun(){
+        let laptopStr = ['FYRO Flagship','Zeno Dualbook','Zeno Sleekbook'];
+        let allInOnesStr = ['AIO Zeno','AIO Fyro']; 
+
+        
+
+        let name = window.location.href;
+
+        name = name.includes('laptops') ?laptopStr : allInOnesStr;
+
+        const ids = await getProductsIds(name);
+
+        console.log(ids);
+
+        return ids;
+
+    }
+
+    function getProductIdService(){
+        return new Promise(async (reslove,reject)=>{
+            
+            let resData =await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/getallproducts`,true); 
+           if(resData.isError){
+                alert(resData.errorMsg.message);
+                return;
+            }
+
+            let res = resData.response;
+                
+            res = JSON.parse(res.result);
+
+            // console.log(res);
+
+            let searchName = window.location.search.split('?')[1];
+            let urlPathName = window.location.pathname; 
+            let searchTerm = '';
+             if(urlPathName.includes('ram')){
+                searchTerm = "RAM ORA";
+            }else if(urlPathName.includes('storage')){
+                searchTerm = `SSD ORA`;
+            }else{
+                searchTerm = searchName.replaceAll('%20',' ');
+            }
+            let resultItem = [];
+            
+            if(searchTerm.toLowerCase() === 'zeno'){
+                for(let i=0;i<res.length;i++){
+                    if(res[i].productname.includes("Zeno Sleekbook")||res[i].productname.includes("Zeno Dualbook")){
+                        resultItem.push( res[i])
+                        
+                    }
+                }
+                
+                return reslove(resultItem)
+            }else if(searchTerm.toLowerCase() === 'fyro'){
+                for(let i=0;i<res.length;i++){
+                    if(res[i].productname.includes("FYRO Flagship")){
+                        resultItem.push(res[i]);
+                        return reslove(resultItem)
+                    }
+                }
+            }else{
+                for(let i=0;i<res.length;i++){
+                    if(res[i].productname.includes(searchTerm)){
+                        resultItem.push(res[i])
+                        
+                    }
+                }
+         
+                return reslove(resultItem)
+            }
+
+            
+
+        });
+    }
+
+    async function getRamData(ids){
+        let resData;
+        let res
+        let data = [];
+       let windowSearch = window.location.href;
+        for(let i=0;i<ids.length;i++){
+            let id = ids[i].productid;
+            if (windowSearch.includes('laptops')||windowSearch.includes('allinones')) {
+                resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/Bizgaze/integrations/products/getitemwithoutbranch/productid/${id}`, true);
+            }
+            else {
+                resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/itemtagscombination/productid/${id}`, true);
+            }
+            if(resData.isError){
+                alert(resData.errorMsg.message);
+                return;
+            }
+    
+            res = resData.response;
+            
+            res = JSON.parse(res.result);
+            data = [...data,...res];
+        }
+        
+        
+        
+       
+
+        console.log(data);
+        let html = '';
+
+        for(let i=0;i<data.length;i++){
+            console.log(data[i].tagids);
+            let tags_id = data[i].tagids;
+            let tags_filter = tags_id.includes("106631360000087");
+            let tags_filter_2 = tags_id.includes("106631360000088");
+            let tags_filter_3 = tags_id.includes("106631360000089");
+            
+            if(tags_filter == false && tags_filter_2 == false && tags_filter_3 == false){
+                        if(data[i].itemname.includes('AIO Fyro - 32')) continue;
+                        html += getRamCardHTML(data[i]);
+            }
+            else{
+                let data_name = tags_id.includes("106631360000087");
+                let name_id = data[i].tagids.includes("106631360000087");
+                if(data_name === true && name_id === true){
+                    for(let j=0;j<data.length;j++){
+                        if(j==0){
+                            if(data[j].itemname.includes('AIO Fyro - 32')) continue;
+                            html += getRamCardHTML(data[i]);
+                        }
+                    }
+                   
+                } 
+            } 
+        }
+        $('.product_card_section').html(html);
+        if(window.location.href.includes("?Zeno")){
+            $('.product_card_section div.ram_card:nth-child(1)').addClass("d-none");
+            $('.product_card_section div.ram_card:nth-child(6)').addClass("d-none");
+        }
+        if(window.location.href.includes("?FYRO")){
+             $('.product_card_section div.ram_card:nth-child(3)').addClass("d-none");
+             $('.product_card_section div.ram_card:nth-child(7)').addClass("d-none");
+             $('.product_card_section div.ram_card:nth-child(8)').addClass("d-none");
+        }
+        // $('.ramcard').click(function(e){
+     
+        //     let sku = $(e.target).data('itemid');
+        //     let itemid = $(e.target).data('itemid');
+   
+        //     window.location.href = `/productdetails.html?productId=${RAM_ID}#itemid=${itemid}`
+
+        // })
+    }
+
+    function getRamCardHTML({itemname,pricelist,itemid,sku,itemimageurl,productid,tagnames}){
+        let img = itemimageurl ? imgServerNameBuild(itemimageurl) : './dist/assets/imgs/nophoto.png'
+        let tags = itemname.split('-');
+        let ramTech = tags[tags.length-2];
+        let tag_name = tagnames.split('|');
+       
+        let gb =  tags[tags.length-1];
+        const [currencySymbol,amount] = getCurrencySymbol(pricelist);
+        let priceAmt = `${currencySymbol} ${amount}`;
+
+        let detailPageName;
+        let addSearch = '';
+        if (window.location.href.includes('laptops')) {
+            detailPageName = 'laptopdetails';
+            let name = itemname.toLowerCase().includes('zeno') ? 'Zeno' : 'Fyro';
+            addSearch = `?${name}`;
+        } else {
+            detailPageName = 'productdetails';
+            
+        };
+
+        let color_name = tag_name[tag_name.length-1].trim();
+        let processor_name1 = tagnames.includes("i7");
+        let processor_name2 = tagnames.includes("i5");
+        let processor_name3 = tagnames.includes("i3");
+        let dul_core = itemname.includes("Zeno Dualbook");
+       
+    
+        let processor;
+        if( processor_name1 === true){
+            if(dul_core === true){
+                processor = `i7`
+            }else{
+                processor = `i5 / i7`
+            }
+           
+        }else if( processor_name2 === true){
+            if(dul_core === true){
+                processor = `i7`
+            }else{
+                processor = `i5 / i7`
+            }
+        }else if( processor_name3 === true){
+            processor = `i3`
+        }
+        else if(itemname.includes("I7") || itemname.includes("i7")){
+            let fyro_data_2 = itemname.includes("RTX 4060");
+            if(fyro_data_2 === true){
+                processor = `i5 / i7 / i9`
+            }else{
+                processor = `i5 / i7`
+            }
+           
+        }else if(itemname.includes("I9") || itemname.includes("i9")){
+            let fyro_data_1 = itemname.includes("RTX 4050");
+            let fyro_data_2 = itemname.includes("RTX 4060");
+            if(fyro_data_1 === true || fyro_data_2 === true){
+                processor = `i5 / i7 / i9`
+            }else{
+                processor = `i9`
+            }
+          
+        }else if(itemname.includes("I5") || itemname.includes("i5")){
+            let fyro_data = itemname.includes("RTX 4060");
+            if(fyro_data === true){
+                processor = `i5 / i7 / i9`
+            }
+            else{
+                processor = `i5 / i7 / i9`
+            }
+           
+        }
+
+       
+        let item_color_1;
+        let item_color_2;
+        let item_color_3;
+        let item_color_4;
+        if(color_name == "Eucalyptus Green" || color_name == "Desert Brown"){
+            item_color_1 = `#5e7975`;
+            item_color_2 = `#624839`;
+            item_color_3 = `#253746`;
+        }else if( color_name == "Deep Sea Blue"){
+            item_color_1 = `#5e7975`;
+            item_color_2 = `#624839`;
+            item_color_3 = `#253746`;
+        }
+        else{
+            if(color_name.length <=14){
+                item_color_4 = ``;
+            }else{
+                item_color_4 = `#0d0a08`;
+            }
+        }
+        debugger;
+        return `<div class="col-lg-4 col-md-6 mb-4 col-md-6 ram_card cursor-pointer">
+            <div class="card border bg-gray-3 rounded-3 p-1 h-100">
+            
+            <a href="/${detailPageName}.html${addSearch}#productId=${productid}#itemid=${itemid}" class="">
+            <img  src="${img}" alt="${itemname}" class="p-5" style="width:350px;height:300px"></a>
+                <div class="card-body">
+                    <a href="/${detailPageName}.html${addSearch}#productId=${productid}#itemid=${itemid}" class="">
+                        <h5 class="card-title satoshi_font mb-0 px-2 text-center font-weight-600">${itemname}</h5>
+                        </a>
+                </div>
+                <hr>
+                <ul class="border-0 mb-0 d-flex h-100 justify-content-between px-md-3 px-4 list-group-flush p-0 text-secondary" style="list-style: none;">
+                    <li class="processor_name"><img src="../dist/assets/imgs/processor.svg" class="w-20p pe-1"/><span class="pt-1">${processor?processor:""}</span></li>
+                    <li class="d-flex justify-content-between">
+                        <p item_color=${item_color_1} class="colors mb-0 me-1" ${item_color_1?`style="width:18px;height:18px;border-radius:0%;background-color:${item_color_1}"`:''}></p>
+                        <p item_color=${item_color_2} class="mb-0 me-1" ${item_color_2?`style="width:18px;height:18px;border-radius:0%;background-color:${item_color_2}"`:''}></p>
+                        <p item_color=${item_color_3} class="mb-0" ${item_color_3?`style="width:18px;height:18px;border-radius:0%;background-color:${item_color_3}"`:''}></p>
+                        <p item_color=${item_color_4} class="mb-0" ${item_color_4?`style="width:18px;height:18px;border-radius:0%;background-color:${item_color_4}"`:''}></p>
+                    </li>
+                </ul>
+                <ul class="border-0 d-flex h-100 justify-content-between px-md-3 px-4 list-group-flush p-0 text-secondary" style="list-style: none;">
+                   
+                    <li class="border-0 py-0">
+                        <span class="satoshi_font">
+                            <h6><img src="../dist/assets/imgs/laptop-icon.png" class="w-20p pe-1"/>${gb}</h6>
+                        </span>
+                    </li>
+                    <li class="border-0 py-0">
+                        <span class="satoshi_font"><h6>${pricelist?priceAmt:'Comming Soon'}</h6></span>
+                    </li>
+                </ul>
+                <div class="card-body text-center">
+                    <a href="/${detailPageName}.html${addSearch}#productId=${productid}#itemid=${itemid}" class="btn bg-white font-1-2 px-5 w-100">Details
+                    </a>
+                </div>
+        
+            </div>
+        </div>`;
+        
+        
+        
+        return `<div class="col-lg-4 col-md-6 mb-4 col-md-6 ram_card cursor-pointer">
+        <div class="card border bg-gray-3 rounded-3 p-1 h-100">
+        
+        <a href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}" class=""><img src="${img}" alt="${itemname}" class="w-100 h-100"></a>
+            <div class="card-body">
+            <a href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}" class="">
+                <h5 class="card-title satoshi_font mb-0 px-2 text-center font-weight-600">${itemname}</h5>
+                </a>
+            </div>
+            <ul class="border-0 d-flex h-100 justify-content-between px-md-3 px-4 list-group-flush p-0 text-secondary" style="list-style: none;">
+                <li class="border-0 py-0">
+                    <span class="satoshi_font">  <h6>${gb}</h6> <h6>${ramTech}</h6></span>
+                </li>
+                <li class="border-0 py-0">
+                    <span class="satoshi_font"><h6>${priceAmt}</h6></span>
+                </li>
+            </ul>
+            <div class="card-body text-center">
+                <a href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}" class="btn bg-white font-1-2 px-5 w-100">Details
+                </a>
+            </div>
+    
+        </div>
+    </div>`;
+
+        //abhi anna design
+        return ` 
+        
+            <!--desktop--->
+            <div class="col-sm-4 p-3">
+                <div class="product_card_3 shadow ram_card">
+                    <div class="card-item-header">
+                        <div class="card-header-sub-3"><a class=" py-md-1" href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}">
+                        <img src="${img}" class="w-100 h-100"></a>
+                        </div>
+                    </div>
+                    <div class="card-item-body">
+                      <h3 cclass="mb-2"> <a href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}" class="" >  ${itemname} </a></h3>
+                      <hr>
+                        <h6>${gb}</h6> <h6>${ramTech}</h6><h6>${priceAmt}</h6>
+                        <div class="py-2 card_product_footer">
+                            <button   data-sku="${sku}" data-itemid="${itemid}" class="w-100 border-0 ramcard bg-transparent satoshi_font ram_btn" data_name="ORA 8GB DDR4 3200MHz Desktop RAM "  data_version="DDR4" data_device="Desktop" data_gb="8GB"   data_price="2900">Details </button>
+                        </div>
+                    </div>
+                </div>
+         </div>
+           `;
+        return `<div class="col-lg-3 col-md-6 ram_card">
+        <div class="card shadow border-0 p-1 h-100">
+            <a href="#">
+                <img src="../dist/assets/imgs/Navbar/ora_ddr5_laptop.png" class="card-img-top" alt="...">
+            </a>
+            <div class="card-body">
+                <a href="#" class="text-decoration-none text-dark">
+                    <h5 class="card-title satoshi_font mb-0">
+                        ${itemname}
+                    </h5>
+                </a>
+            </div>
+            <ul class="list-group list-group-flush">
+                <li class="list-group-item border-0 py-0">
+                    <span class="satoshi_font">${gb} ${ramTech}</span>
+                </li>
+                <li class="list-group-item border-0 py-0">
+                    <span class="satoshi_font">3200 Mhz</span>
+                </li>
+            </ul>
+            <div class="card-body d-none">
+                <button class="btn--md btn-primary w-100 card-link">
+                    <span class="cost currency-symbol">₹</span><span class="cost product-price satoshi_font">${pricelist}</span>
+                </button>
+            </div>
+            <div class="card-body text-center">
+                <div  data-sku="${sku}" data-itemid="${itemid}" class="bg-black ramcard btn font-1-2 px-5 text-white w-100 satoshi_font" data_des="Upgrade your laptop with DDR4 Laptop
+                    Memory, oering 3200 MHz speed in 8, 16,
+                    and 32 GB capacities. Experience enhanced
+                    thermal performance, increased longevity,
+                    and superior performance with our
+                    innovative graphene sticker technology." data_name="ORA 8GB DDR4 3200MHz Laptop RAM ">Details
+                </div>
+            </div>
+        </div>
+    </div>`
+    }
+
+    init();
+}
+
+ramProductsInit();

dist/js/products/products.js

@@ -0,0 +1,302 @@
+function ramProductsInit(){
+    let RAM_ID =  '';
+  
+    async function init(){
+        let id 
+        if(location.search==''&&(location.href.includes('laptops')||location.href.includes('allinones'))){
+            id = await  getallproductsFun();
+        }else{
+            id = await getProductIdService();
+        }
+        getRamData(id);
+
+        swapSectionsVideo();
+    }
+
+    async function getProductsIds(nameArr){
+        let resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/getallproducts`,true); 
+        if(resData.isError){
+            toasterHelper("error","Something went wrong!")
+            return;
+        }
+
+        let res = resData.response;
+                
+        res = JSON.parse(res.result);
+        let ids = [];
+
+        for(let i=0;i<nameArr.length;i++){
+            const currName = nameArr[i];
+            let id = res.find((item)=>{
+                if(currName === item.productname){
+                    return item.productid;
+                }
+            })
+            if(id){
+                ids.push(id);
+            }
+        }
+
+        return ids;
+
+    }
+
+    async function getallproductsFun(){
+        let laptopStr = ['FYRO Flagship','Zeno Dualbook','Zeno Sleekbook'];
+        let allInOnesStr = ['AIO Zeno','AIO Fyro']; 
+
+        
+
+        let name = window.location.href;
+
+        name = name.includes('laptops') ?laptopStr : allInOnesStr;
+
+        const ids = await getProductsIds(name);
+
+        console.log(ids);
+
+        return ids;
+
+    }
+
+    function getProductIdService(){
+        return new Promise(async (reslove,reject)=>{
+            
+            let resData =await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/getallproducts`,true); 
+           if(resData.isError){
+                alert(resData.errorMsg.message);
+                return;
+            }
+
+            let res = resData.response;
+                
+            res = JSON.parse(res.result);
+
+            console.log(res);
+
+            let searchName = window.location.search.split('?')[1];
+            let urlPathName = window.location.pathname; 
+            let searchTerm = '';
+             if(urlPathName.includes('ram')){
+                searchTerm = "RAM ORA";
+            }else if(urlPathName.includes('storage')){
+                searchTerm = `SSD ORA`;
+            }else{
+                searchTerm = searchName.replaceAll('%20',' ');
+            }
+            let resultItem = [];
+            
+            if(searchTerm.toLowerCase() === 'zeno'){
+                for(let i=0;i<res.length;i++){
+                    if(res[i].productname.includes("Zeno Sleekbook")||res[i].productname.includes("Zeno Dualbook")){
+                        resultItem.push( res[i])
+                        
+                    }
+                }
+                
+                return reslove(resultItem)
+            }else if(searchTerm.toLowerCase() === 'fyro'){
+                for(let i=0;i<res.length;i++){
+                    if(res[i].productname.includes("FYRO Flagship")){
+                        resultItem.push( res[i]);
+                        return reslove(resultItem)
+                    }
+                }
+            }else{
+                for(let i=0;i<res.length;i++){
+                    if(res[i].productname.includes(searchTerm)){
+                        resultItem.push( res[i])
+                        
+                    }
+                }
+         
+                return reslove(resultItem)
+            }
+
+            
+
+        });
+    }
+
+    async function getRamData(ids){
+        let resData;
+        let res
+        let data = [];
+       let windowSearch = window.location.href;
+        for(let i=0;i<ids.length;i++){
+            let id = ids[i].productid;
+            if (windowSearch.includes('laptops')||windowSearch.includes('allinones')) {
+                resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/Bizgaze/integrations/products/getitemwithoutbranch/productid/${id}`, true);
+            }
+            else {
+                resData = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/itemtagscombination/productid/${id}`, true);
+            }
+            if(resData.isError){
+                alert(resData.errorMsg.message);
+                return;
+            }
+    
+            res = resData.response;
+            
+            res = JSON.parse(res.result);
+            data = [...data,...res];
+        }
+        
+        
+        
+       
+
+        console.log(data);
+        let html = '';
+
+        for(let i=0;i<data.length;i++){
+            if(data[i].itemname.includes('AIO Fyro - 32')) continue;
+            html += getRamCardHTML(data[i]);
+        }
+
+        $('.product_card_section').html(html);
+
+        // $('.ramcard').click(function(e){
+     
+        //     let sku = $(e.target).data('itemid');
+        //     let itemid = $(e.target).data('itemid');
+   
+        //     window.location.href = `/productdetails.html?productId=${RAM_ID}#itemid=${itemid}`
+
+        // })
+    }
+
+    function getRamCardHTML({itemname,pricelist,itemid,sku,itemimageurl,productid}){
+        let img = itemimageurl ? imgServerNameBuild(itemimageurl) : './dist/assets/imgs/nophoto.png'
+        let tags = itemname.split('-');
+        let ramTech = tags[tags.length-2];
+        let gb =  tags[tags.length-1];
+        const [currencySymbol,amount] = getCurrencySymbol(pricelist);
+        let priceAmt = `${currencySymbol} ${amount}`;
+
+        let detailPageName;
+        let addSearch = '?';
+        if (window.location.href.includes('laptops')) {
+            detailPageName = 'laptopdetails';
+            let name = itemname.toLowerCase().includes('zeno') ? 'Zeno' : 'Fyro';
+            addSearch = `?${name}`;
+        } else {
+            detailPageName = 'productdetails';
+        };
+      
+        debugger;
+        return `<div class="col-lg-4 col-md-6 mb-4 col-md-6 ram_card cursor-pointer">
+            <div class="card border bg-gray-3 rounded-3 p-1 h-100">
+            
+            <a href="/${detailPageName}.html${addSearch}productId=${productid}#itemid=${itemid}" class=""><img  src="${img}" alt="${itemname}" class="w-100 h-100 p-5"></a>
+                <div class="card-body">
+                    <a href="/${detailPageName}.html${addSearch}productId=${productid}#itemid=${itemid}" class="">
+                        <h5 class="card-title satoshi_font mb-0 px-2 text-center font-weight-600">${itemname}</h5>
+                        </a>
+                </div>
+                <hr>
+                <ul class="border-0 d-flex h-100 justify-content-between px-md-3 px-4 list-group-flush p-0 text-secondary" style="list-style: none;">
+                    <li class="border-0 py-0">
+                        <span class="satoshi_font">  <h6>${gb}</h6> <h6>${ramTech}</h6></span>
+                    </li>
+                    <li class="border-0 py-0">
+                        <span class="satoshi_font"><h6>${pricelist?priceAmt:'Comming Soon'}</h6></span>
+                    </li>
+                </ul>
+                <div class="card-body text-center">
+                    <a href="/${detailPageName}.html?productId=${productid}#itemid=${itemid}" class="btn bg-white font-1-2 px-5 w-100">Details
+                    </a>
+                </div>
+        
+            </div>
+        </div>`
+        
+        return `<div class="col-lg-4 col-md-6 mb-4 col-md-6 ram_card cursor-pointer">
+        <div class="card border bg-gray-3 rounded-3 p-1 h-100">
+        
+        <a href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}" class=""><img src="${img}" alt="${itemname}" class="w-100 h-100"></a>
+            <div class="card-body">
+            <a href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}" class="">
+                <h5 class="card-title satoshi_font mb-0 px-2 text-center font-weight-600">${itemname}</h5>
+                </a>
+            </div>
+            <ul class="border-0 d-flex h-100 justify-content-between px-md-3 px-4 list-group-flush p-0 text-secondary" style="list-style: none;">
+                <li class="border-0 py-0">
+                    <span class="satoshi_font">  <h6>${gb}</h6> <h6>${ramTech}</h6></span>
+                </li>
+                <li class="border-0 py-0">
+                    <span class="satoshi_font"><h6>${priceAmt}</h6></span>
+                </li>
+            </ul>
+            <div class="card-body text-center">
+                <a href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}" class="btn bg-white font-1-2 px-5 w-100">Details
+                </a>
+            </div>
+    
+        </div>
+    </div>`;
+
+        //abhi anna design
+        return ` 
+        
+            <!--desktop--->
+            <div class="col-sm-4 p-3">
+                <div class="product_card_3 shadow ram_card">
+                    <div class="card-item-header">
+                        <div class="card-header-sub-3"><a class=" py-md-1" href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}">
+                        <img src="${img}" class="w-100 h-100"></a>
+                        </div>
+                    </div>
+                    <div class="card-item-body">
+                      <h3 cclass="mb-2"> <a href="/productdetails.html?productId=${RAM_ID}#itemid=${itemid}" class="" >  ${itemname} </a></h3>
+                      <hr>
+                        <h6>${gb}</h6> <h6>${ramTech}</h6><h6>${priceAmt}</h6>
+                        <div class="py-2 card_product_footer">
+                            <button   data-sku="${sku}" data-itemid="${itemid}" class="w-100 border-0 ramcard bg-transparent satoshi_font ram_btn" data_name="ORA 8GB DDR4 3200MHz Desktop RAM "  data_version="DDR4" data_device="Desktop" data_gb="8GB"   data_price="2900">Details </button>
+                        </div>
+                    </div>
+                </div>
+         </div>
+           `;
+        return `<div class="col-lg-3 col-md-6 ram_card">
+        <div class="card shadow border-0 p-1 h-100">
+            <a href="#">
+                <img src="../dist/assets/imgs/Navbar/ora_ddr5_laptop.png" class="card-img-top" alt="...">
+            </a>
+            <div class="card-body">
+                <a href="#" class="text-decoration-none text-dark">
+                    <h5 class="card-title satoshi_font mb-0">
+                        ${itemname}
+                    </h5>
+                </a>
+            </div>
+            <ul class="list-group list-group-flush">
+                <li class="list-group-item border-0 py-0">
+                    <span class="satoshi_font">${gb} ${ramTech}</span>
+                </li>
+                <li class="list-group-item border-0 py-0">
+                    <span class="satoshi_font">3200 Mhz</span>
+                </li>
+            </ul>
+            <div class="card-body d-none">
+                <button class="btn--md btn-primary w-100 card-link">
+                    <span class="cost currency-symbol">₹</span><span class="cost product-price satoshi_font">${pricelist}</span>
+                </button>
+            </div>
+            <div class="card-body text-center">
+                <div  data-sku="${sku}" data-itemid="${itemid}" class="bg-black ramcard btn font-1-2 px-5 text-white w-100 satoshi_font" data_des="Upgrade your laptop with DDR4 Laptop
+                    Memory, oering 3200 MHz speed in 8, 16,
+                    and 32 GB capacities. Experience enhanced
+                    thermal performance, increased longevity,
+                    and superior performance with our
+                    innovative graphene sticker technology." data_name="ORA 8GB DDR4 3200MHz Laptop RAM ">Details
+                </div>
+            </div>
+        </div>
+    </div>`
+    }
+
+    init();
+}
+
+ramProductsInit();

dist/js/ramproducts/ramproducts.js

@@ -0,0 +1,81 @@
+function ramProductsInit(){
+    const RAM_ID = 106633230000024;
+    function init(){
+        getRamData(RAM_ID)
+    }
+    async function getRamData(id){
+        let resData =await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/itemtagscombination/productid/${id}`,true); 
+
+        if(resData.isError){
+            alert(resData.errorMsg.message);
+            return;
+        }
+
+        let res = resData.response;
+            
+        res = JSON.parse(res.result);
+
+        console.log(res);
+        let html = '';
+
+        for(let i=0;i<res.length;i++){
+            html += getRamCardHTML(res[i]);
+        }
+
+        $('.ramsContainer').html(html);
+
+        $('.ramcard').click(function(e){
+            let sku = $(e.target).data('sku');
+            let itemid = $(e.target).data('itemid');
+
+            window.location.href = `/productdetails.html?productId=${RAM_ID}?sku=${sku}`
+
+        })
+    }
+
+    function getRamCardHTML({itemname,pricelist,itemid,sku}){
+        let tags = itemname.split('-');
+        let ramTech = tags[tags.length-2];
+        let gb =  tags[tags.length-1];
+        return `<div class="col-lg-3 col-md-6 ram_card">
+        <div class="card shadow border-0 p-1 h-100">
+            <a href="#">
+                <img src="../dist/assets/imgs/Navbar/ora_ddr5_laptop.png" class="card-img-top" alt="...">
+            </a>
+            <div class="card-body">
+                <a href="#" class="text-decoration-none text-dark">
+                    <h5 class="card-title satoshi_font mb-0">
+                        ${itemname}
+                    </h5>
+                </a>
+            </div>
+            <ul class="list-group list-group-flush">
+                <li class="list-group-item border-0 py-0">
+                    <span class="satoshi_font">${gb} ${ramTech}</span>
+                </li>
+                <li class="list-group-item border-0 py-0">
+                    <span class="satoshi_font">3200 Mhz</span>
+                </li>
+            </ul>
+            <div class="card-body d-none">
+                <button class="btn--md btn-primary w-100 card-link">
+                    <span class="cost currency-symbol">₹</span><span class="cost product-price satoshi_font">${pricelist}</span>
+                </button>
+            </div>
+            <div class="card-body text-center">
+                <div  data-sku="${sku}" data-itemid="${itemid}" class="bg-black ramcard btn font-1-2 px-5 text-white w-100 satoshi_font" data_des="Upgrade your laptop with DDR4 Laptop
+                    Memory, oering 3200 MHz speed in 8, 16,
+                    and 32 GB capacities. Experience enhanced
+                    thermal performance, increased longevity,
+                    and superior performance with our
+                    innovative graphene sticker technology." data_name="ORA 8GB DDR4 3200MHz Laptop RAM ">Details
+                </div>
+            </div>
+        </div>
+    </div>`
+    }
+
+    init();
+}
+
+ramProductsInit();

dist/js/shoppingcart/addtocart.js

@@ -0,0 +1,248 @@
+const CART_DATA = 'CART_DATA';
+
+let cartLength = 0;
+const CART_ADD = 'CART_ADD';
+function getCartData(){
+    const data = localStorage.getItem(CART_DATA);
+    if(data) return JSON.parse(data);
+    return null;
+}
+
+function removeCartData(){
+    localStorage.removeItem(CART_DATA);
+}
+
+function setCartData(data){
+    localStorage.setItem(CART_DATA,JSON.stringify(data));
+}
+
+function setLengthCart(){
+  const data =   getCartData();
+  if(!data) return;
+
+  
+  let length = 0;
+
+  for(let item in data){
+    let curr = data[item];
+    length += parseInt(curr.quantity);
+  }
+
+  if(length>0){
+    $('.cartnumcount').removeClass('d-none').html(length);
+  }else{
+    $('.cartnumcount').addClass('d-none').html(0);
+  }
+
+}
+
+
+function getQuantityById(id){
+   const data =  getCartData();
+   if(!data) return;
+
+   for(let item in data){
+        if(id == item){
+            $('#quantity').val(products[item].quantity);
+        }
+    }
+}
+
+function updateCartQuantity(id,val){
+    const data = getCartData();
+    if(!data) return;
+
+
+    data[id].quantity = val;
+
+    
+    setCartData(data);
+    updateSummaryPriceAdd();
+
+}
+
+function removeCartItem(id){
+  
+    let data = getCartData();
+    if(!data) return;
+
+    let newdata = {};
+   
+    for(let item in data){
+        if(item != id){
+            newdata[item] = data[item];
+        }
+    }
+
+    setCartData(newdata);
+    updateSummaryPriceAdd();
+
+    return Object.keys(newdata).length;
+}
+
+function updateSummaryPriceAdd(){
+    let data = getCartData();
+    let totalSummaryPrice = $('.totalSummaryPrice');
+    let totalPrice = $('.totalPrice');
+    let currecy = $('.currecy');
+    let noofitems = $('.noofitems');
+    if(!data) return;
+    let len = 0;
+    let totalAmt = 0;
+    for(let item in data) {
+        let {price,quantity} = data[item];
+        totalAmt += parseInt(price*quantity);
+        len += parseInt(quantity);
+    }
+    const [currencySymbol,amount] = getCurrencySymbol(totalAmt);
+    noofitems.html(len);
+
+    totalSummaryPrice.html(amount);
+    totalPrice.html(amount);
+    currecy.html(currencySymbol);
+
+
+}
+
+function initAddToCart(){
+
+    addEventListeners();
+
+    function addToCartFun(){
+        const data = getCartData();
+          
+        let id =  window.location.search.split('=')[1];
+        const qty = parseInt($('#addtocart').data('qty'));
+        if(!data){
+            
+            let cartObj = {};
+          
+      
+            cartObj[$('#skudetailitem').val()]  = {
+                name:$('.productname').html(),
+                price:$('.price').data('price'),
+                quantity:$('#quantity').val(),
+                img:$('.productDetailsMain img').attr('src'),
+                sku:$('#skudetailitem').val(),
+                totalQty:qty,
+                productid:$('#productidtag').val(),
+                itemid:$('#itemidtag').val()
+            }
+
+
+            addtoCart(cartObj);
+            //$('.cartnumcount').removeClass('d-none').html(1);
+            setLengthCart();
+           
+        }else{
+            //if(!data[id]) data['length']++;
+            let name = $('.productname').html();
+            let price = $('.price').data('price');
+            let quantity = $('#quantity').val();
+            let img = $('.productDetailsMain img').attr('src');
+            let sku = $('#skudetailitem').val();
+
+           
+       
+            if(data[$('#skudetailitem').val()]){
+                data[$('#skudetailitem').val()] = {
+                    name:name,
+                    price:price,
+                    quantity: parseInt(data[sku].quantity)+parseInt(quantity),
+                    img:img,
+                    sku:sku,
+                    totalQty:qty,
+                    productid:$('#productidtag').val(),
+                    itemid:$('#itemidtag').val()
+                }
+                addtoCart(data);
+            }else{
+                data[$('#skudetailitem').val()] = {
+                    name:name,
+                    price:price,
+                    quantity:parseInt(quantity),
+                    img:img,
+                    sku:sku,
+                    totalQty:qty,
+                    productid:$('#productidtag').val(),
+                    itemid:$('#itemidtag').val()
+                }
+                addtoCart(data);
+            }
+            
+        }
+
+        setLengthCart();
+
+    }
+    
+    function addEventListeners(){
+        $('#addtocart').html('Add to cart');
+        $('#addtocart').removeAttr('gotocart');
+        $('#addtocart').off('click').click((e)=>{
+     debugger
+            $('.insufficientqty').addClass('d-none');
+            const qty = parseInt($('#addtocart').data('qty'));
+      
+            if(parseInt($('#quantity').val())>qty){
+                $('.insufficientqty').removeClass('d-none');
+                return;
+            }
+            $('#addtocart').off().click(function (el){
+                window.location.href = '/shopping-cart.html';
+
+            });
+
+            addToCartFun();
+       
+            toasterHelper('success',"Item added to cart","toast-top-right");
+           
+           $('#addtocart').html('Go to cart');
+   
+           $('#addtocart').attr('gotocart',1);
+        });
+
+        // $('.quantityHTML #quantity').off('change').change(function (e){
+        //    let sku =  $('#skudetailitem').val();
+        //    let data = getCartData();
+        //    const qty = parseInt($('#addtocart').data('qty'));
+        //    let isCart =   $('#addtocart').attr('gotocart');
+        //    if(!isCart) return;
+        //    if(parseInt($('#quantity').val())>qty){
+        //     $('.insufficientqty').removeClass('d-none');
+        //     return;
+        // }
+        //    if(!data[sku]){
+        //     return;
+        //    }
+
+        //    data[sku].quantity =  $('.quantityHTML #quantity').val();
+        //    toasterHelper("success","Your item quantity was been updated","toast-top-right")
+        //    setCartData(data);
+        //    setLengthCart();
+        // })
+
+        $('.buynow').off('click').click(async (e)=>{
+            addToCartFun();
+            const res = await COOKIE_HELPER.validateToken();
+            if(!res.response){
+                localStorage.setItem(CART_ADD,true);
+                window.location.href = '/login.html';
+                
+                $('.checkoutbtn').find('span').removeClass('d-none');
+                $('.checkoutbtn').find('div').addClass('d-none');
+                 return;
+            }
+            window.location.href = '/selectdelivery.html';
+
+        }); 
+    }
+
+    function addtoCart(data){
+        const currData = getCartData();
+        let newData = {...currData,...data};
+        setCartData(newData);
+    }
+}
+
+initAddToCart();

dist/js/shoppingcart/select_delivery.js

@@ -0,0 +1,825 @@
+function initSelectDevlivery() {
+    let editMode = false;
+    let countryId = null;
+    let currencyId = null;
+    let billingInfo = null;
+    let userName = null;
+    let stateArr = [];
+debugger;
+
+
+let Newuser =window.localStorage.getItem('isaccountCreated');
+        let Loginstatus =window.localStorage.getItem('Isloggedintoaster')
+        if(Newuser == 'true'){
+           
+            toasterHelper("success","Account Created Successfully");
+            window.localStorage.removeItem('isaccountCreated')
+            
+        }
+        if(Loginstatus == 'true'){
+            toasterHelper("success","Isloggedintoaster");
+            window.localStorage.removeItem('Isloggedintoaster')
+            
+        }
+
+    $('.mianselectdelivery').removeClass('d-none');
+    $('.containermaindev').removeClass('d-none');
+   
+    let orderBtnAction = {
+        removeOrdernowBtn() {
+            $('.ordernowbtn').parent().addClass('d-none');
+        },
+
+        addOrdernowBtn() {
+            $('.ordernowbtn').parent().removeClass('d-none');
+        }
+    }
+
+    let addresslistAction = {
+        removeAddressContainer(){
+            $('.addresslist').addClass('d-none');
+        },
+        addAddressContainer(){
+            $('.addresslist').removeClass('d-none');
+        }
+    }
+
+    let changeAddressBtnAction = {
+        removeChangeAddressBtn() {
+            $('.changeAddressBtn').addClass('d-none');
+        },
+        addChangeAddressBtn() {
+            $('.changeAddressBtn').removeClass('d-none');
+        }
+        
+    }
+
+    let changesaveCancelBtnAction = {
+        removeChangeCancelBtn() {
+            $('.saveanddeliverCanel').addClass('d-none');
+        },
+        addChangeCancelBtn() {
+            $('.saveanddeliverCanel').removeClass('d-none');
+        }
+        
+    }
+
+    let saveFormLoading = {
+        addSpinner(){
+            $('.saveanddeliver').find('.spinner-border').removeClass('d-none');
+            $('.saveanddeliver').find('span').addClass('d-none');
+        },
+
+        removeSpinner(){
+            $('.saveanddeliver').find('.spinner-border').addClass('d-none');
+            $('.saveanddeliver').find('span').removeClass('d-none');
+        },
+    }
+    let paymentgatewaypageAction = {
+        addPaymentgatewaypage(){
+            $('.paymentgatewaypage').removeClass('d-none');
+        },
+
+        removePaymentgatewaypage(){
+            $('.paymentgatewaypage').addClass('d-none');
+        }
+    }
+
+    let paymentContainerAction = {
+        paymentContainerAdd(){
+            $('.orderslist').parent().removeClass('d-none');
+        },
+
+        paymentContainerRemove(){
+            $('.orderslist').parent().addClass('d-none');
+        }
+    }
+
+    const {phonenumber_errorhandler,addressdes_errorhandler,zipcode_errorhandler,state_errorhandler} = factoryErrorControl();
+
+    function init() {
+        getAddressRes();
+        loadEvents();
+        updateSummaryPriceAdd();
+        // changeAddressBtnAction.removeChangeAddressBtn();
+
+    }
+
+    function removeAllFormError(){
+        phonenumber_errorhandler.removeError();
+        addressdes_errorhandler.removeError();
+        zipcode_errorhandler.removeError();
+        state_errorhandler.removeError();
+
+        $('.errMsgFormEdit').addClass('d-none');
+        $('.errMsgFormEdit').html('');
+
+    }
+
+    function clearAllInputs(){
+        // $("#state").select2({
+        //     placeholder: "Select a City",
+        //     allowClear: true
+        // });
+
+        $('#state').val(null);
+
+        $('#phonenumber').val(null);
+        $('#addressdes').val(null);
+        $('#zipcode').val(null);
+    }
+
+    async function appendFormDetails(){
+        let cookieRes = COOKIE_HELPER_ACTIONS.getCookie();
+        console.log(cookieRes);
+        const { errorMsg, isError, response } = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/anwiauth/getbillinginfo/contactid/${cookieRes.userId}`);
+        let res = JSON.parse(response.result)[0];
+        debugger;
+        const {cityid, lobid,organizationname,addressline,cityname,phonenumber,zipcode,name } =res;
+
+        setAddressHeader({name:organizationname,phonenumber,addressline,cityname,zipcode});
+
+        $('#phonenumber').val(phonenumber);
+            $('#addressdes').val(addressline);
+            $('#zipcode').val(zipcode);
+            debugger;
+             $('#state').attr('data-id',cityid);
+            $('#state').val(cityname)
+            $('.userNamelogin').html(`${userName}`);
+
+        editMode = true;
+//        console.log(stateArr);
+        renderCustomStateDropdown(stateArr);
+        //renderStates(stateArr);
+
+    }
+
+    async function getAddressRes() {
+        let cookieRes = COOKIE_HELPER_ACTIONS.getCookie();
+        console.log(cookieRes);
+        const { errorMsg, isError, response } = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/anwiauth/getbillinginfo/contactid/${cookieRes.userId}`);
+
+        let res = JSON.parse(response.result);
+        console.log(res, 'befores');
+        res = res[res.length - 1];
+
+        //createBillingForm();
+
+        const {cityid, lobid,organizationname,addressline,cityname,phonenumber,zipcode,name } =res;
+        billingInfo = res;
+        debugger;
+        console.log(res);
+        if (cityid != 0) {
+            $('.addnewAddressContainer').addClass('d-none');
+            $('.detailsAddressBg').removeClass('detailsAddressBg');
+            $('.ordersummaryheader').addClass('detailsAddressBg');
+            $('.displayadress').removeClass('d-none')
+            // $('.addresslist').removeClass('d-none');
+            loadShippingProducts();
+            userName = organizationname;
+            
+            setAddressHeader({name:organizationname,phonenumber,addressline,cityname,zipcode});
+            debugger;
+           
+            editMode = true;
+
+
+            // adding values
+
+            $('#phonenumber').val(phonenumber);
+            $('#addressdes').val(addressline);
+            $('#zipcode').val(zipcode);
+            debugger;
+             $('#state').attr('data-id',cityid);
+            $('#state').val(cityname);
+            $('.userNamelogin').html(`${userName}`);
+            changeAddressBtnAction.addChangeAddressBtn()
+            getCountryStateCurrency();
+        }else{
+            $('.userNamelogin').html(`${organizationname}`);
+            loadShippingProducts();
+            paymentContainerAction.paymentContainerRemove();
+            getCountryStateCurrency();
+            orderBtnAction.removeOrdernowBtn();
+            $('.detailsAddressBg').removeClass('detailsAddressBg');
+            $('.selectAddress').addClass('detailsAddressBg');
+        }
+    }
+
+    function setAddressHeader({name,phonenumber,addressline,cityname,zipcode}){
+        $('.innerDisplayAddress').html(`${phonenumber}, ${addressline}, ${cityname} - `);
+        $('.zipcodeAddress').html(`${zipcode}`);
+
+    }
+
+    function checkForm(){
+   
+        let number = $('#phonenumber').val();
+        let zipcode = $('#zipcode').val();
+        let state = $('#state').data('id');
+        let address = $('#addressdes').val();
+
+        let isTrue = false;
+        if(!number || number.length!=10){
+            isTrue = true;
+            phonenumber_errorhandler.addError();
+        }
+
+        if(zipcode.length<6 || zipcode.length>6){
+            isTrue = true;
+            zipcode_errorhandler.addError();
+        }
+
+        if(!state){
+            isTrue = true;
+            state_errorhandler.addError();
+        }
+
+        if(!address){
+            isTrue = true;
+            addressdes_errorhandler.addError();
+        }
+
+        return isTrue;
+
+
+    }
+
+    async function createBillingForm(){
+        debugger;
+        let cookieRes = COOKIE_HELPER_ACTIONS.getCookie();
+        let { userId, name } = cookieRes;
+        const ctyId =   await getCountryId();
+        
+        let stateId = parseInt($('#state').data('id'));
+         let payload = {
+                "cityid": stateId,
+                "CityName":$(`[data-id="${stateId}"`).html(),
+                "addressline1": $('#addressdes').val(),
+
+                "OrganizationType": 2,
+                "organizationname": name,
+                //"OrganizationId":,
+                "ContactName": name,
+                "ContactId": userId,
+                "countryname": 'india',
+                "countryid": ctyId,
+                "statename":$(`[data-id="${stateId}"`).html(),
+                "phonenumber": $('#phonenumber').val(),
+
+                "OrganizationId": userId,
+                "currencyid": 2,
+                "taxno": '0',
+                "BillingInfoExists": false,
+                "lobid": 0,
+                "lobname": "IT Products",
+                "gstindetailid": 0,
+                zipcode:$('#zipcode').val()
+            }
+            const res = await API_SERVICES_ACTIONS.postAPIService('apis/v4/bizgaze/crm/address/savebillinginfo', payload);
+            // http://localhost:3088/apis/v4/bizgaze/crm/address/savebillinginfo
+
+
+            setAddressHeader({name,phonenumber:$('#phonenumber').val(),addressline: $('#addressdes').val(),cityname:$('#state').val(),zipcode:$('#zipcode').val()});
+
+            return new Promise((reslove,reject) => {
+                reslove(res);
+            })
+        console.log(res);
+    }
+
+    async function saveForm() {
+        
+        let cookieRes = COOKIE_HELPER_ACTIONS.getCookie();
+        let { userId, name } = cookieRes;
+        const { errorMsg, isError, response } = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/anwiauth/getbillinginfo/contactid/${cookieRes.userId}`);
+
+        let resAnwi = JSON.parse(response.result);
+        console.log(resAnwi, 'befores');
+        resAnwi = resAnwi[resAnwi.length - 1];
+
+        let stateId = parseInt($('#state').data('id'));
+        let payload = {
+            ...resAnwi,
+            phonenumber:$('#phonenumber').val(),
+            addressline1:$('#addressdes').val(),
+            zipcode:$('#zipcode').val(),
+            cityid:stateId,
+            CityName:$('#state').val(),
+           
+        }
+
+        console.log(payload,"ertyuioghjkl");
+
+
+      
+        //
+        const res = await API_SERVICES_ACTIONS.postAPIService('apis/v4/bizgaze/crm/address/savebillinginfo', payload);
+
+        return new Promise((reslove,reject) => {
+            reslove(res);
+        })
+    }
+
+
+    function onChangeState(e){
+        let userItem = e.target.value.toLowerCase();
+        let limit = 10;
+        let results = [];
+        let maxLen = stateArr.length > 10 ? 10 :stateArr.length;
+        debugger
+        for(let i=0;i<stateArr.length;i++){
+            let currItem = stateArr[i];
+            let stateName = currItem.cityname.toLowerCase();
+            if(stateName.includes(userItem)){
+                results.push(currItem);
+                if(results.length>=10) break;
+            }
+        }
+
+        renderCustomStateDropdown(results);
+        loadDropdownStateEvents();
+
+
+    }
+
+    function loadDropdownStateEvents(){
+        $('#state').off().focus(function (){
+            $('.stateBox').removeClass('d-none');
+            $(document).off('click').click(closeDrop);
+
+           
+        })
+
+     
+        $(document).off().click(closeDrop);
+
+        function closeDrop(e){
+            let id = $(e.target).hasClass('stateoption');
+            if($(e.target).attr('id')==='state') return;
+            if(id) {
+                $('.stateBox').addClass('d-none');
+                $(document).off();
+            }else{
+                $('.stateBox').addClass('d-none');
+                $(document).off();
+            }
+
+        }
+
+        $('#state').keyup(debounce(function (event){
+            onChangeState(event)
+        })); 
+    }
+    
+
+    async function loadEvents() {
+
+        loadDropdownStateEvents();
+
+        $('.addnewAddressContainer').off('click').click(function (e) {
+            $('.addnewAddressContainer').addClass('d-none');
+            $('.addresslist').removeClass('d-none');
+            changeAddressBtnAction.removeChangeAddressBtn();
+            changesaveCancelBtnAction.addChangeCancelBtn();
+           
+        });
+
+        $('.saveanddeliverCanel').off('click').click(function (){
+           if(!editMode){
+            $('.addnewAddressContainer').removeClass('d-none');
+            $('.addresslist').addClass('d-none');
+            changeAddressBtnAction.removeChangeAddressBtn();
+            changesaveCancelBtnAction.removeChangeCancelBtn();
+           }else{
+            loadShippingProducts();
+            addresslistAction.removeAddressContainer()
+            changeAddressBtnAction.addChangeAddressBtn();
+            paymentContainerAction.paymentContainerAdd();
+            $('.displayadress').removeClass('d-none');
+           }
+
+           clearAllInputs();
+        });
+
+        $('.changeAddressBtn').off('click').click(function (e){
+            console.log(e.target);
+            //getAddressRes();
+            appendFormDetails();
+            removeOrderSummary();
+            changeAddressBtnAction.removeChangeAddressBtn();
+            $('.displayadress').addClass('d-none')
+        })
+
+        
+        $('.saveanddeliver').off('click').click(async function (e) {
+           debugger;
+            saveFormLoading.addSpinner()
+            let isErrorForm =  checkForm();
+
+            if(isErrorForm){ 
+                saveFormLoading.removeSpinner();
+                return;
+            }
+            let res;
+            if(editMode){
+                res = await saveForm();
+            }else{
+                res = await createBillingForm();
+            }
+            saveFormLoading.removeSpinner();
+
+       
+            const {isError,errorMsg,response} = res;
+            console.log(errorMsg);
+            if(isError){
+
+                $('.errMsgFormEdit').removeClass('d-none');
+                $('.errMsgFormEdit').html(`${errorMsg.message}`);
+
+
+
+                return;
+            }
+            debugger;
+            editMode = true;
+            let {name} = COOKIE_HELPER.getCookie();
+            // phonenumber:$('#phonenumber').val(),
+            // addressline1:$('#addressdes').val(),
+            // zipcode:$('#zipcode').val(),
+            // cityid:stateId,
+            // CityName:$(`[data-id="${stateId}"`).html(),
+            let stateId = parseInt($('#state').data('id'));
+            setAddressHeader({name,addressline:$('#addressdes').val(),cityname:$(`#state`).val(),phonenumber:$('#phonenumber').val(),zipcode:$('#zipcode').val()});
+
+
+            $('.errMsgFormEdit').html('');
+             loadShippingProducts();
+            addresslistAction.removeAddressContainer()
+            changeAddressBtnAction.addChangeAddressBtn();
+            paymentContainerAction.paymentContainerAdd();
+            $('.displayadress').removeClass('d-none');
+         
+
+        });
+       
+
+        $('.ordernowbtn').off().click(async function (e){
+            let cookieRes = COOKIE_HELPER_ACTIONS.getCookie();
+            let { userId, name } = cookieRes;
+           
+            paymentgatewaypageAction.addPaymentgatewaypage();
+            let payload = {
+                "OrganizationName": name,
+                "BranchId": 106632280000001,
+                "OrderItems": [
+                    {            
+                        "UnitPrice": 20,
+                        "Quantity": 1,
+                        "SKU": "11",
+                        "DiscountValue": 0,
+                        "DiscountPercent": 0
+                    }
+                ]
+            }
+            $('.paymentgatewaypage').removeClass('d-none');
+            const data = getCartData();
+       
+            let orderItems = [];
+            for(let i in data){
+                const {price,quantity,sku} = data[i];
+                let payload = {
+                    "UnitPrice": price,
+                    "Quantity": quantity,
+                    "SKU": sku,
+                    "DiscountValue": 0,
+                    "DiscountPercent": 0
+                }
+                orderItems.push(payload)
+            }
+
+            payload['OrderItems'] = orderItems;
+
+            debugger;
+            
+          try {
+            const res =  await API_SERVICES_ACTIONS.postAPIService(`apis/v4/bizgaze/integrations/salesorder/save`,payload);
+          console.log(res.response.result);;
+
+          if(!res.response.result){
+            paymentgatewaypageAction.removePaymentgatewaypage();
+          }
+
+
+         
+        //   `http://localhost:3088/apis/v4/bizgaze/transact/orders/getpaymentgatewaytransaction/refid/106633780000069`
+
+          let response =  await  API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/transact/orders/getpaymentgatewaytransaction/refid/${res.response.result}`);
+         let  {PaymentLink} = JSON.parse(response.response.result);
+         window.location.href = PaymentLink;
+          } catch (error) {
+            paymentgatewaypageAction.removePaymentgatewaypage();
+          }
+        });
+    }
+
+    function getItemProductHTML(item) {
+        const { img, name, price, quantity, sku, id } = item;
+
+        return ` <div class="align-items-center item-product-add d-flex w-100" data-id="${id}" data-sku="${sku}">
+        <div style="max-width: 100px;" class="">
+            <img class="w-100" src="${img}" alt="">
+        </div>
+       <div class="" style="margin-left:10px">
+        <div>
+            <div style="font-size:12px">${name}</div>
+        </div>
+        <div>
+            <span style="font-size:12px" class="font-weight-600">${getCurrencySymbol(price)}</span> <span>x <span class="qtyitem" style="font-size:12px">${quantity}</span></span>
+        </div>
+       </div>
+    </div>`;
+        return ` <div class="item-product-add" data-id="${id}" data-sku="${sku}">
+        <div class="row py-2">
+            <div class="col-sm-2">
+               <div class="w-100 d-flex justify-content-around">
+                <div class="d-flex flex-column align-items-baseline">
+                    <div class="px-4 py-2 selectaddressimgshow">
+                        <img class="w-100" src="${img}" alt="" class="w-100">
+                    </div>
+                    <div class="addresscontrol w-100 d-flex justify-content-center gap-1">
+                        <div class="rounded-contain btnminus">
+                            -
+                        </div>
+                        <div class="w-100p">
+                            <input class="qtyshowinput" disabled value="${quantity}" type="number">
+                        </div>
+                        <div class="rounded-contain btnplus">
+                            +
+                        </div>
+                    </div>
+                   </div>
+               </div>
+            </div>
+            <div class="col-sm-10">
+                <div class="row h-100">
+                   <div class="col-sm-8">
+                    <div class="h-100 d-flex flex-column justify-content-between">
+                        <div> ${name}</div>
+                        <div>
+                           <span>$</span> ${price} <span class="d-none">56% Off 2 offers applied</span>
+                        </div>
+                    <div class="d-flex gap-3">
+                        <span class="text-uppercase d-none">Save for later</span>
+                        <span class="text-uppercase cursor-pointer removecartItem">Remove</span>
+                    </div>
+                    </div>
+                   </div>
+                </div>
+            </div>
+        </div>
+      </div>`;
+    }
+
+    async function getCountryId(){
+        const countryRes = await API_SERVICES_ACTIONS.getAPIService('apis/v4/bizgaze/integrations/anwiauth/getcountry');;
+        
+        if (countryRes.isError) {
+            alert("something went wrong");
+            console.log(countryRes);
+            return;
+        }
+
+        let ctyId = 0
+        let countryData = JSON.parse(countryRes.response.result);
+
+        console.log(countryData);
+
+        for (let i = 0; i < countryData.length; i++) {
+            if (countryData[i].countryname.toLowerCase() === 'india') {
+                debugger;
+                countryId = countryData[i].countryid;
+                ctyId = countryId
+                countrynameData = countryData[i].countryname;
+                break;
+            }
+        }
+
+        return ctyId;
+
+    }
+
+    function renderStates(data){
+        $('#state').off('select2:select');
+        let html = '';
+        for (let i = 0; i < 10; i++) {
+            html += `<option value="${data[i].cityid}" data-id="${data[i].cityid}">${data[i].cityname}</option>`
+
+        }
+
+        $('#state').append(html);
+        $("#state").select2({
+            placeholder: "Select a City",
+            allowClear: true
+        });
+    }
+
+    async function getCountryStateCurrency() {
+        const countryRes = await API_SERVICES_ACTIONS.getAPIService('apis/v4/bizgaze/integrations/anwiauth/getcountry');;
+
+        if (countryRes.isError) {
+            alert("something went wrong");
+            console.log(countryRes);
+            return;
+        }
+
+
+        let countryData = JSON.parse(countryRes.response.result);
+
+        console.log(countryData);
+
+        for (let i = 0; i < countryData.length; i++) {
+            if (countryData[i].countryname.toLowerCase() === 'india') {
+                countryID = countryData[i].countryid;
+                countrynameData = countryData[i].countryname;
+                break;
+            }
+        }
+
+        //    const stateRes = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/unibase/platform/forms/autocomplete/docpropertyid/116631530005773/columnname/statusid/value/1%7C/formpropertyid/116631620000066/formid/116631640000040/bindeddata/undefined/term/h/authtoken/2cd31fdd-440b-4eea-9039-659ab090628a?term=h&type=GET`);
+        const stateRes = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/anwiauth/getcities/countryid/${countryID}`);
+
+        if (stateRes.isError) {
+            alert("something went wrong");
+            console.log(stateRes);
+            return;
+        }
+
+        let stateData = JSON.parse(stateRes.response.result);
+
+//        console.log(stateData, 'state');
+
+
+        $('#state').val(null);
+        console.log("start")
+        let html = '';
+        statesList = stateData;
+        stateArr = stateData;
+        renderCustomStateDropdown(stateArr);
+        //renderStates(stateArr)
+
+       
+
+        const currencyRes = await API_SERVICES_ACTIONS.getAPIService('apis/v4/bizgaze/integrations/anwiauth/getcurrencies');
+
+        if(currencyRes.isError){
+            alert("something went wrong");
+            console.log(currencyRes);
+            return;
+        }
+
+        let currencyData = JSON.parse(currencyRes.response.result);
+
+        console.log(currencyData,'currencyDatacurrencyDatacurrencyData');
+
+        for(let i=0;i<currencyData.length;i++){
+            const curr = currencyData[i];
+            if(curr.currencyname.toLowerCase().includes('india')){
+                currencyid = curr.currencyid;
+            }
+        }
+    }
+
+    function getCustomDropDownHTML({cityid,cityname,countryid}){
+        return ` <div class="bg-white stateoption px-2 border-bottom py-2 cursor-pointer" data-name="${cityname}" data-value="${cityid}">${cityname}</div>`;
+    }
+
+    function renderCustomStateDropdown(stateList){
+        let html = ``;
+        debugger;;
+        let maxLen = stateList.length > 10 ? 10 :stateList.length
+        for(let i=0;i<maxLen;i++){
+            let currItem = stateList[i];
+            html+=getCustomDropDownHTML(currItem);
+        }
+
+        $('.stateBox').html(html);
+
+        $('.stateoption').off().click(function(e){
+            debugger;
+            const name = $(e.target).data('name');
+            const id = $(e.target).data('value');
+            $('#state').val(name);
+            $('#state').attr('data-id',id);
+        })
+    }
+
+    function loadShippingProducts(){
+        $('.detailsAddressBg').removeClass('detailsAddressBg');
+        $('.ordersummaryheader ').addClass('detailsAddressBg')
+debugger;
+        const products = getCartData();
+        console.log(products);
+        if (Object.keys(products||{}).length) orderBtnAction.addOrdernowBtn();
+
+        let productsHTML = '';
+        for (let item in products) {
+            const currItem = products[item];
+            productsHTML += getItemProductHTML({ ...currItem, id: item })
+        }
+        $('.orderlistcart').html(productsHTML);
+        // $('.orderslist').html(productsHTML);
+        $('.orderslist').addClass("p-3")
+        $('.orderslist').html(` <label for="online">
+        <input checked data-op="online" name="payment" type="radio" class="paymentbtn   " id="online">
+        <span>Pay Via (Card, Net Banking, Wallet)</span>
+       
+    </label>
+    <label for="cod" class="d-none">
+        Cash on delivery
+        <input data-op="cod" name="payment" type="radio" class="paymentbtn  " id="cod">
+    </label>`);
+
+    $('.paymentbtn').off().click(function (e){
+        const data = $(e.target).data('op');
+        if(data == 'online'){
+            orderBtnAction.addOrdernowBtn();
+        }else{
+            orderBtnAction.removeOrdernowBtn();
+        }
+    })
+        $('.btnminus').each(function (i, el) {
+            $(el).off().click(function (elm) {
+                let id = $(elm.target).parents('.item-product-add').data('id');
+                let val = parseInt($(elm.target).parents('.item-product-add').find('.qtyshowinput').val());
+                if (val <= 1) return;
+                val--;
+                updateCartQuantity(id, val)
+                $(elm.target).parents('.item-product-add').find('.qtyshowinput').val(val)
+            });
+        })
+        $('.btnplus').each(function (i, el) {
+            $(el).off().click(function (elm) {
+                let id = $(elm.target).parents('.item-product-add').data('id');
+                let val = parseInt($(elm.target).parents('.item-product-add').find('.qtyshowinput').val());
+                if (val >= 11) return;
+                val++;
+                updateCartQuantity(id, val)
+                $(elm.target).parents('.item-product-add').find('.qtyshowinput').val(val);
+            });
+        })
+        $('.removecartItem').each(function (i, el) {
+            $(el).click(function (elm) {
+                let id = $(elm.target).parents('.item-product-add').data('id');
+
+                let len = removeCartItem(id);
+                $(`.item-product-add[data-id="${id}"]`).remove();
+                if (!len) {
+                    orderBtnAction.removeOrdernowBtn();
+                }
+            });
+
+
+        })
+    }
+
+    function removeOrderSummary(){
+        $('.detailsAddressBg').removeClass('detailsAddressBg');
+        $('.selectAddress').addClass('detailsAddressBg');
+        $('.orderslist').html('');
+        $('.orderslist').removeClass("p-3");
+        orderBtnAction.removeOrdernowBtn();
+
+       // $('.detailsAddressBtn').addClass('d-none');
+        addresslistAction.addAddressContainer();
+        $('.saveanddeliver').removeClass('d-none');
+        $('.saveanddeliverCanel').removeClass('d-none')
+    }
+
+    function factoryErrorControl(){
+        let inputsArr = ['phonenumber','addressdes','zipcode','state'];
+
+        let controls = {};
+        for(let i=0;i<inputsArr.length;i++){
+            const id =inputsArr[i];
+
+            controls[`${id}_errorhandler`] = {
+                addError(){
+                    debugger;
+                    $(`#${id}`).parents('.col-sm-6').find('.invalid-feedback').addClass('d-block');
+                },
+                removeError(){
+                    $(`#${id}`).parents('.col-sm-6').find('.invalid-feedback').addClass('d-block');
+                }
+            }
+
+        }
+
+        return controls;
+    }
+
+    init();
+
+}
+
+checkValidAuth(initSelectDevlivery);

dist/js/shoppingcart/shoppingcart.js

@@ -0,0 +1,287 @@
+shoppingCartInit();
+
+function shoppingCartInit() {
+
+    shoppingCartAppend();
+    let DELETE_FILTER = null;
+
+    let insufficientQtyActions = {
+        moreQtyAdd(e) {
+            $(e.target).parents('.mainselectcontainer').find('.insufficientqty').removeClass('d-none');
+        },
+
+        moreQtyRemove(e) {
+            $(e.target).parents('.mainselectcontainer').find('.insufficientqty').addClass('d-none');
+        }
+
+    }
+
+    function shoppingCartAppend() {
+        let data = getCartData();
+
+        if (!data) {
+            $('.emptyShow').removeClass('d-none');
+            $('.checkoutbtn').addClass('d-none');
+            return;
+        };
+
+        let html = '';
+        let products = data;
+
+
+
+        // for(let i=0;i<products.length;i++){
+        //     const {img,name,price,quantity,total} = products[i];
+        //     debugger;
+        //     html += shoppingCartDesktopHTML(products[i]);
+        // }
+        if (Object.keys(data).length === 0) {
+            $('.checkoutbtn').addClass('d-none');
+            $('.emptyShow').removeClass('d-none');
+        }
+        setLengthCart();
+        console.log(products, 'products');
+        for (let product in products) {
+
+            html += shoppingCartDesktopHTML({ ...products[product], total: products[product].quantity * products[product].price, id: product });
+        }
+
+        $('.appendItems').html(html);
+
+
+        addEventListenerCart();
+
+    }
+
+    // event listeners
+    function addEventListenerCart() {
+
+        $('.quantitySelect').each(function (i, element) {
+            if (!$(element).hasClass('d-none')) {
+                $(element).off().change(function (e) {
+                    insufficientQtyActions.moreQtyRemove(e);
+                    let num = e.target.value;
+                    if (num == 5) {
+                        $(e.target).parents('.mainselectcontainer').find('.inputcartaddmore').removeClass('d-none');
+                        $(e.target).addClass('d-none');
+                        $(e.target).parents('.mainselectcontainer').find('.inputcartaddmore button').off().click(function (item) {
+                            const val = $(item.target).parent().find('input').val();
+                            debugger;
+                            let totalQty = $(this).parents('.mainselectcontainer').data('qty');
+
+                            if (val <= 0 || totalQty < val) {
+                                insufficientQtyActions.moreQtyAdd(e);
+                                return;
+                            }
+
+                            let id = $(item.target).parents('.mainselectcontainer').data('id');
+
+                            updateCartQuantity(id, val);
+                            //    $(item.target).parents('.mainselectcontainer').find('.inputcartaddmore').addClass('d-none');
+                            //    $(e.target).removeClass('d-none');
+                            setLengthCart();
+                            shoppingCartAppend();
+
+                        })
+                    } else {
+                        let totalQty = $(e.target).parents('.mainselectcontainer').data('qty');
+                        const val = $(e.target).parent().find('input').val();
+                        if (val <= 0 || totalQty < val) {
+                            insufficientQtyActions.moreQtyAdd(e);
+                            return;
+                        }
+                        let id = $(e.target).parents('.mainselectcontainer').data('id');
+                        updateCartQuantity(id, num);
+                        setLengthCart();
+                        shoppingCartAppend();
+                    }
+                });
+            } else {
+                $(element).parents('.mainselectcontainer').find('.inputcartaddmore button').off().click(function (item) {
+                    debugger;
+
+                    const val = $(item.target).parent().find('input').val()
+                    let totalQty = $(this).parents('.mainselectcontainer').data('qty');
+
+                    if (val <= 0 || totalQty < val) {
+                        insufficientQtyActions.moreQtyAdd(item);
+
+                        return;
+                    }
+
+                    let id = $(item.target).parents('.mainselectcontainer').data('id');
+                    updateCartQuantity(id, val);
+                    //    $(item.target).parents('.mainselectcontainer').find('.inputcartaddmore').addClass('d-none');
+                    //    $(e.target).removeClass('d-none');
+                    setLengthCart();
+                    shoppingCartAppend();
+
+                })
+            }
+        });
+
+        $('.removeitemcartmodal').off('click').click(function () {
+
+
+            setCartData(DELETE_FILTER);
+            setLengthCart();
+            shoppingCartAppend();
+
+            let len = Object.keys(DELETE_FILTER).length
+            if (!len) {
+
+                $('.checkoutbtn').addClass('d-none');
+                $('.emptyShow').removeClass('d-none');
+            } else {
+                $('.checkoutbtn').removeClass('d-none');
+                $('.emptyShow').addClass('d-none');
+            }
+
+
+        });
+
+        $('.btndeletecart').each(function (i, element) {
+            $(element).click(function (e) {
+                const cardId = $(e.target).data('cartid');
+                let data = getCartData();
+                console.log(data, 'cardId', cardId);
+                if (!data) return;
+                debugger;
+                const products = data;
+                const productsFilter = {};
+
+                $('#modalremovecart').html(products[cardId].name);
+                for (let product in products) {
+                    if (product != cardId) productsFilter[product] = products[product];
+                }
+
+
+                data = productsFilter;
+
+                console.log(data);
+                DELETE_FILTER = data;
+                // setCartData(data);
+                // setLengthCart();
+                // shoppingCartAppend();
+            });
+        });
+
+        $('.checkoutbtn').click(async function (e) {
+            $('.checkoutbtn').find('span').addClass('d-none');
+            $('.checkoutbtn').find('div').removeClass('d-none');
+            const res = await COOKIE_HELPER.validateToken();
+            if (!res.response) {
+                localStorage.setItem(CART_ADD, true);
+                window.location.href = '/login.html';
+
+                $('.checkoutbtn').find('span').removeClass('d-none');
+                $('.checkoutbtn').find('div').addClass('d-none');
+                return;
+            }
+            window.location.href = '/selectdelivery.html';
+            $('.checkoutbtn').find('span').removeClass('d-none');
+            $('.checkoutbtn').find('div').addClass('d-none');
+
+
+        });
+    }
+
+    function getQuantityHTML(value, totalQty, id) {
+        return `<div data-id="${id}" data-qty="${totalQty}" class="mainselectcontainer w-100">
+        <div class="w-50">
+       
+        <select  class="quantitySelect form-select ${value >= 5 ? 'd-none' : ''}" value="${value}">
+                <option ${value == 1 ? 'selected="selected"' : null} value="1">
+                    1
+                </option>
+                <option  ${value == 2 ? 'selected="selected"' : null} value="2">
+                    2
+                </option>
+                <option  ${value == 3 ? 'selected="selected"' : null} value="3">
+                    3
+                </option>
+                <option  ${value == 4 ? 'selected="selected"' : null} value="4">
+                    4
+                </option>
+                <option  ${value == 5 ? 'selected="selected"' : null} value="5">
+                    5+
+                </option>
+            </select>
+    </div>
+
+    <div class=" inputcartaddmore d-flex gap-2 ${value >= 5 ? '' : 'd-none'}">
+        <input min="1" class="form-control" style="max-width:100px" value="${value <= 5 ? '5' : value}" type="number" />
+        <button class="bg-gradient-anwi border-none btn text-white">Add</button>
+    </div>
+        <div class="text-danger pt-2 insufficientqty d-none">Insufficient quantity</div>
+        </div>`
+    }
+
+    function shoppingCartDesktopHTML({ id, img, name, price, description, quantity, total, totalQty, productid, itemid }) {
+        const [currencySymbol, amount] = getCurrencySymbol(price);
+        debugger;
+      let tamt = 0;
+        {
+            const [currencySymbol, amount] = getCurrencySymbol(total);
+            tamt = amount;
+        }
+        return `
+       <div class="d-none d-md-block">
+       
+       <div  class="row bg-white   border-bottom py-4 d-flex justify-content-center align-items-center">
+       <div class="col-md-2 text-center"><img src="${img}" alt="${name}" class="img-fluid"></div>
+       <div class="col-md-4 ">
+         
+           <a class="text-decoration-none text-blue fw-600 cursor-pointer" href="productdetails.html?productId=${productid}#itemid=${itemid}">${name}</a>
+           <small>${description || ''}</small>
+           <span class="badge d-none text-bg-warning">8 Offers ></span>   
+       </div>
+       <div class="col-md-2">
+           <p class="text-right m-0"><span>${currencySymbol}</span> ${amount}</p>
+       </div>
+       <div class="col-md-2 ">
+  
+           ${getQuantityHTML(quantity, totalQty, id)}
+       </div>
+       <div class="col-md-2 ">
+           <div class="d-flex justify-content-between w-100">
+               <p class="fw-bold m-0">
+                 ${currencySymbol}${tamt}</p>
+               <span class="btndeletecart cursor-pointer fw-500 text-danger" data-cartid="${id}" data-bs-toggle="modal" data-bs-target="#deletecartmodal">x</span>
+           </div>
+       </div>
+       
+   </div>
+
+       </div>
+    <div class="row d-block d-md-none smallcart py-3">
+    <div class="row bg-white py-5 m-0">
+    <div class="col-4 text-center">
+    <img src="${img}" alt="${name}" class="img-fluid">
+</div>
+<div class="col-8 position-relative d-flex flex-column gap-1">
+
+    <div class="">
+        <span>
+            <a class="text-decoration-none text-blue fw-600 cursor-pointer" href="productdetails.html?productId=${productid}#itemid=${itemid}"><span class="">${name}</span></a>
+        </span>
+    </div>
+    <div>
+    <p class="fw-bold m-0">
+    ${currencySymbol}${tamt}</p>
+    </div>
+    <div class="text-truncate d-none">
+            <small>${description || ''}</small>
+    </div>
+     <div class="">
+
+        ${getQuantityHTML(quantity, totalQty, id)}
+    </div>
+   
+    <span class="btndeletecart cursor-pointer fw-500 text-danger" data-cartid="${id}" data-bs-toggle="modal" data-bs-target="#deletecartmodal">x</span>
+    </div>
+    </div>
+</div>
+        `;
+    }
+}

dist/js/support/supportticket.js

@@ -0,0 +1,29 @@
+function supportTicketNoInit(){
+    let ticketId = null;
+
+    INIT();
+
+    function INIT(){
+        ticketId = window.location.search.split("=")[1];
+        getTicketData(ticketId);
+    }
+
+    async function getTicketData(id){
+       let res =  await API_SERVICES_ACTIONS.getAPIService(`apis/v4/anwisystems/integrations/products/getticketdetails/ticketno/${id}`);
+
+       if(res.isError){
+        toasterHelper("error",res.errorMsg,`toast-top-right`);
+        return;
+       }
+
+       res = JSON.parse(res.response.result)[0];
+
+       $('.description_support').html(res['Description']);
+       $('.ticketidsupport').html(res['ticketno']);
+       $('.raiseddate').html(res['Raised Date']);
+
+       console.log(res);
+    } 
+}
+
+supportTicketNoInit();

dist/js/utils/helpers.js

@@ -0,0 +1,150 @@
+
+const uid = function () {
+    return Date.now().toString(36) + Math.random().toString(36).substr(2);
+}
+
+function loadScript(src) {
+    return new Promise(function (resolve, reject) {
+        var s;
+        s = document.createElement('script');
+        s.src = src;
+        s.onload = resolve;
+        s.onerror = reject;
+        document.head.appendChild(s);
+    });
+}
+
+
+function shuffleArray(array) {
+    for (let i = array.length - 1; i > 0; i--) {
+        const j = Math.floor(Math.random() * (i + 1));
+        [array[i], array[j]] = [array[j], array[i]];
+    }
+}
+
+function debounce(func, delay=500) {
+    let timeoutId;
+    return function(...args) {
+      const context = this;
+      clearTimeout(timeoutId);
+      timeoutId = setTimeout(() => {
+        func.apply(context, args);
+      }, delay);
+    };
+  }
+
+function getCurrencySymbol(value = 0) {
+    let type = 'INR'
+    if (type) {
+        const ans = new Intl.NumberFormat('en-IN', { style: 'currency', currency: type }).format(value);;
+        const res = ans.split(/(\D+)/);
+        const currencySymbol = res[1];
+        const amount = res.slice(2, res.length).join('')
+
+
+        return [currencySymbol, amount]
+    } else {
+        console.log("errrrrrrrrrrrrrrrrrrrrrrrrr", type);
+        return ['', 0];
+    }
+}
+
+function toasterHelper(type, message, align = 'toast-top-center') {
+    // toasterOpts()
+    debugger;
+    toastr.clear()
+    toasterOpts(align);
+    Command: toastr[type](message);
+
+    function toasterOpts(align) {
+        toastr.options = {
+            "closeButton": true,
+            "debug": false,
+            "newestOnTop": true,
+            "progressBar": true,
+            "positionClass": align,
+            "preventDuplicates": true,
+            "onclick": null,
+            "showDuration": "300",
+            "hideDuration": "1000",
+            "timeOut": "5000",
+            "extendedTimeOut": "1000",
+            "showEasing": "swing",
+            "hideEasing": "linear",
+            "showMethod": "fadeIn",
+            "hideMethod": "fadeOut"
+        }
+    }
+}
+
+async function getMulFileToGetBase64(event) {
+    let files = event.target.files;
+    let filePromise = [];
+    for (let i = 0; i < files.length; i++) {
+      let currFile = files[i];
+      let currFilePromise = new Promise((resolve, reject) => {
+        const reader = new FileReader();
+        reader.readAsDataURL(currFile);
+        // Wait till complete
+        reader.onloadend = function () {
+          let base64String = reader.result
+            .toString()
+            .replace(/^data:.+;base64,/, "");
+          let fileReq = {
+            FileData: base64String,
+            FileName: currFile.name.split(".").slice(0, -1).join("."),
+            FileType: currFile.name.split(".").pop(),
+            RefId: 0,
+            "ByteData": null,
+            "FilePath": ""
+          };
+          resolve(fileReq);
+        };
+        // Make sure to handle error states
+        reader.onerror = function (e) {
+          reject(e);
+        };
+      });
+      filePromise.push(currFilePromise)
+    }
+  
+    return Promise.all(filePromise);
+}
+
+
+function containsSpecialCharsHelper(str) {
+    const specialChars = /[`!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?~]/;
+    return specialChars.test(str);
+}
+const isUpperCaseHelper = (string) => /^(?=.*[A-Z])/.test(string);
+const isLowerCaseHelper = (string) => /^(?=.*[a-z])/.test(string);
+const isNumberContainsHelper = (string) => /\d/.test(string);
+
+function swapSectionsVideo(){
+    function swapSections() {
+        var sectionOne = document.querySelector('.section-one');
+        var sectionTwo = document.querySelector('.section-two');
+
+        let nextSibling = sectionOne.nextSibling;
+        var isMobile = window.matchMedia("(max-width: 768px)").matches;
+        if(!isMobile) return;
+
+        if(nextSibling){
+            sectionOne.insertAdjacentElement("beforeBegin",sectionTwo)
+        }else{
+            sectionOne.parentNode.insertBefore(sectionOne, sectionTwo);
+        }
+    
+       // sectionOne.parentNode.insertBefore(sectionOne, sectionTwo);
+    }
+    swapSections();
+    
+    // Call the swapSections function on load and resize
+    // window.addEventListener('load', swapSections);
+    window.addEventListener('resize', swapSections);
+    
+    setTimeout(function (){
+        document.querySelector('auth-loader').hide();   
+        $('.loading-main').removeClass('d-none');
+    },1000);
+}

dist/js/warranty.js

@@ -0,0 +1,187 @@
+function wattantyFunction() {
+  setLengthCart();
+  let order_card = `<div class=warranty_product><div class="py-3 warranty_productform"><div class=mb-3><label class=form-label for=Add_serial_number_inp>Enter Your Serial Number</label><input class=form-control id=Add_serial_number_inp  required><label class="form-label text-danger d-none error_serial_num" for=Add_serial_number_inp >Serial Number should not be empty</label></div><div class=mb-3><label class="form-label d-none Add_phonenumber_inp_label" for=Add_phonenumber_inp>Enter Your Phone Number</label> <input type="number" inputmode="tel" class="form-control d-none" pattern="[1-9]{1}[0-9]{9}^[0-9]*$" onKeyPress="if(this.value.length==10) return false;"maxlength="10"  id=Add_phonenumber_inp  required><label class="text-danger d-none form-label error_phonenumber" for=Add_phonenumber_inp>Enter Valid Phone Number</label></div><div class=mb-3><label class="form-label d-none Add_Contact_inp_label" for=Add_contactname_inp>Enter Your Contactname</label> <input class="form-control d-none" id=Add_contactname_inp required></div><div class="serial_submit text-end"><button class="btn btn-dark warranty_serialNumber_check" type="button">Submit</button><button class="btn btn-dark warranty_serialNumber_submit d-none" type="button">Submit</button></div></div></div>`;
+  $(".user_orders").append(order_card);
+  $(".add_serialNum").click(function () {
+    $(".warranty_productform").removeClass("d-none");
+    $(this).addClass("d-none");
+  });
+  $(".warranty_serialNumber_submit").click(async function () {
+    debugger 
+    let serial_no_inp = $("#Add_serial_number_inp").val();
+    let phonenumber_inp = $("#Add_phonenumber_inp").val();
+    let contactname_inp = $("#Add_contactname_inp").val();
+    if (serial_no_inp && phonenumber_inp != "") {
+      $(".error_serial_num").addClass("d-none");
+      $(".error_phonenumber").addClass("d-none");
+      $("#Add_serial_number_inp").removeClass("border-danger");
+      $("#Add_phonenumber_inp").removeClass("border-danger");
+      let port = SERVERNAME;
+      debugger;
+      let url = `${port}/apis/v4/Bizgaze/integrations/products/warrantyservice/serialno/${serial_no_inp}`;
+      console.log(url);
+      //const STAT = `05b2f2ca510344968c65e1ebf49a5595`;
+      const config = {
+        url,
+        method: "get",
+        headers: {
+          Authorization: `stat ${STAT}`,
+        },
+      };
+      let response = await axios(config);
+      debugger;
+      console.log(response);
+      let product_res = response.data.result;
+      debugger;
+      if (product_res != null) {
+        let warrenty_res = JSON.parse(product_res);
+        let new_arr = [warrenty_res];
+        $.each(new_arr, function (key, value) {
+          console.log(value);
+          if (response.data.result == "[]") {
+            $(".user_Warranty_details").html(
+              `<div class="text-danger d-flex align-items-center bg-dangerLite text-dark p-2 rounded-4 mb-3" style="background-color: #ffe2e0!important;display:block"><div class="mr-1 d-flex justify-content-center align-items-center" style="width: 30px; height: 10px;"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.2646 3.41366C11.7212 3.15681 12.2788 3.15681 12.7354 3.41366L19.2354 7.06991C19.7077 7.33558 20 7.83536 20 8.37727V15.6227C20 16.1646 19.7077 16.6644 19.2354 16.9301L12.7354 20.5863C12.2788 20.8432 11.7212 20.8432 11.2646 20.5863L4.76461 16.9301C4.29229 16.6644 4 16.1646 4 15.6227V8.37727C4 7.83536 4.29229 7.33559 4.76461 7.06991L11.2646 3.41366Z" fill="#FF3A2E"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M11 7.4C11 7.17909 11.1791 7 11.4 7H12.6C12.8209 7 13 7.17909 13 7.4V12.6C13 12.8209 12.8209 13 12.6 13H11.4C11.1791 13 11 12.8209 11 12.6V7.4Z" fill="white"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M11 16C11 15.4477 11.4477 15 12 15C12.5523 15 13 15.4477 13 16C13 16.5523 12.5523 17 12 17C11.4477 17 11 16.5523 11 16Z" fill="white"></path></svg></div><div class="d-flex justify-content-center align-items-center  font-12">Serial Number Not Found</div></div>`
+            );
+            setTimeout(function () {
+              $(".bg-dangerLite").hide();
+            }, 1000);
+            return;
+          } else {
+            const warrantyEnabled = value[0].warrantyenabled;
+            $(".warranty_status_main_container").addClass("d-none");
+            if (warrantyEnabled == false) {
+              let phonenumber_updated = Number(phonenumber_inp);
+              $(".user_Warranty_details").removeClass("d-none");
+              let Warrentypayload = {
+                sku: value[0].sku,
+                serialno: serial_no_inp,
+                phonenumber: phonenumber_updated,
+                contactname: contactname_inp,
+                warrantyfromdate: value[0].purchasedate,
+              };
+              warrentyService(Warrentypayload);
+            } else {
+             alert('warranty enabled')
+            }
+          }
+        });
+      }
+    } else {
+      if (serial_no_inp == "") {
+        $("#Add_serial_number_inp").addClass("border-danger");
+        $(".error_serial_num").removeClass("d-none");
+      } else if (phonenumber_inp == "") {
+        $("#Add_phonenumber_inp").addClass("border-danger");
+        $(".error_phonenumber").removeClass("d-none");
+      }
+    }
+  });
+  $(".warranty_serialNumber_check").click(async function () {
+    let serial_no_inp = $("#Add_serial_number_inp").val();
+    if (serial_no_inp != "") {
+      $(".error_serial_num").addClass("d-none");
+      $("#Add_serial_number_inp").removeClass("border-danger");
+      let port = SERVERNAME;
+      debugger;
+      let url = `${port}/apis/v4/Bizgaze/integrations/products/warrantyservice/serialno/${serial_no_inp}`;
+      console.log(url);
+      // const STAT = `05b2f2ca510344968c65e1ebf49a5595`;
+      const config = {
+        url,
+        method: "get",
+        headers: {
+          Authorization: `stat ${STAT}`,
+        },
+      };
+
+      let response = await axios(config);
+      debugger;
+      console.log(response);
+      let product_res = response.data.result;
+      debugger;
+      let warrenty_res = JSON.parse(product_res);
+      if (product_res != null) {
+        if (response.data.result == "[]") {
+          $(".bg-dangerLite").removeClass("d-none");
+          $(".user_Warranty_details").html(
+            `<div class="text-danger d-flex align-items-center bg-dangerLite text-dark p-2 rounded-4 mb-3" style="background-color: #ffe2e0!important;display:block"><div class="mr-1 d-flex justify-content-center align-items-center" style="width: 30px; height: 10px;"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.2646 3.41366C11.7212 3.15681 12.2788 3.15681 12.7354 3.41366L19.2354 7.06991C19.7077 7.33558 20 7.83536 20 8.37727V15.6227C20 16.1646 19.7077 16.6644 19.2354 16.9301L12.7354 20.5863C12.2788 20.8432 11.7212 20.8432 11.2646 20.5863L4.76461 16.9301C4.29229 16.6644 4 16.1646 4 15.6227V8.37727C4 7.83536 4.29229 7.33559 4.76461 7.06991L11.2646 3.41366Z" fill="#FF3A2E"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M11 7.4C11 7.17909 11.1791 7 11.4 7H12.6C12.8209 7 13 7.17909 13 7.4V12.6C13 12.8209 12.8209 13 12.6 13H11.4C11.1791 13 11 12.8209 11 12.6V7.4Z" fill="white"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M11 16C11 15.4477 11.4477 15 12 15C12.5523 15 13 15.4477 13 16C13 16.5523 12.5523 17 12 17C11.4477 17 11 16.5523 11 16Z" fill="white"></path></svg></div><div class="d-flex justify-content-center align-items-center  font-12">Serial Number Not Found</div></div>`
+          );
+          // );
+          setTimeout(function () {
+            $(".bg-dangerLite").hide();
+          }, 1000);
+          return;
+        }
+         else {
+          if (warrenty_res[0].warrantyenabled == true) {
+            
+            $(".backtoform").removeClass("d-none");
+            let new_arr = [warrenty_res];
+            $.each(new_arr, function (key, value) {
+              console.log(value);
+            let warrenty_date = value[0].warrantytodate;
+            let userwarrenty_product = `<div class="p-3 bg-white my-3 rounded warranty-card"id=warranty-card><div class="mb-3 card rounded-3 text-white"><div class="row align-items-center g-0 justify-content-between"><div class="col-md-3 text-center"><img alt=guarantee src=../dist/assets/imgs/guarantee.png class="h-50p img-fluid w-50p"></div><div class=col-md-9><div class=card-body><h5 class=card-title>Congratulations,</h5><p class=card-text><small>Thanks for registering with <span class=fw-bold>anwi systems </span>.You have successfully availed your warranty.</small></div></div></div></div><div class=col-md-12><h4>Here is your warranty Details</h4></div><div class="p-3 border rounded-3"><div class=row><div class=col-6><img alt=Warranty-product src="../dist/assets/imgs/anwi-logo-1.png" class="w-50"></div><div class=col-6><p class="mb-0 text-secondary"><small>Serail No</small><p class="mb-0 fs-9 serial_no_warrantynumber"><p class="fw-500">${value[0].serialno}</p><p class="mb-0 text-secondary"><small>Warranty will be applicable till</small><p class="mb-0 fs-9 rounded-2 warrenty_date"><small class="fw-500">${value[0].warrantytodate}</small></div></div><h6>Order details</h6><div class="row mb-3"><div class=col-6><p class="mb-0 text-secondary"><small>Sku</small><p class="mb-0 fs-9 rounded-2 warranty_sku"><small class="fw-500">${value[0].sku}</small></div><div class=col-6><p class="mb-0 text-secondary"><small>Itemname</small><p class="mb-0 fs-9 rounded-2 warranty_item_name"><small class="fw-500">${value[0].itemname}</small></div></div><h6>Warranty details</h6><div class=row><div class=col-6><p class="mb-0 text-secondary"><small>Warranty Start</small><p class="mb-0 fs-9  rounded-2"><small class="purchase_date fw-500" >${value[0].warrantyfromdate}</small></div><div class=col-6><p class="mb-0 text-secondary"><small>Warranty status</small><p class="mb-0 fs-9 text-secondary rounded-2"><small class="text-white bg-success is_warranty_enable p-1 rounded-pill">{value[0].warrantyenabled}</small></div></div></div><div class=guide-lines><p class=mb-0><small>Follow Below steps to request your warranty claim.</small><ol><small class=text-secondary><li class=text-secondary>Go to My account</small><small class=text-secondary><li class=text-secondary>Tap on request claim</small><small class=text-secondary><li class=text-secondary>Enter information and send claim request</small></ol></div></div>`;
+            let is_warranty_enable = value[0].warrantyenabled;
+            debugger;
+            $(".user_Warranty_details").html(userwarrenty_product);
+            $(".warranty_status_main_container").addClass("d-none");
+            if (is_warranty_enable == true) {
+              $(".is_warranty_enable").text("Activated");
+            } else {
+              $(".is_warranty_enable").text("Not Activated");
+            }
+            if (warrenty_date == "") {
+              $(".warrenty_date").addClass("d-none");
+            } else {
+              $(".warrenty_date").removeClass("d-none");
+            }
+            $("#Add_serial_number_inp").addClass("border-success");
+            $(".error_serial_num").addClass("d-none");
+            $(".add_serialNum").removeClass("d-none");
+            return
+          });
+          }
+           else {
+            $(".bg-dangerLite").addClass("d-none");
+            $(".Add_phonenumber_inp_label").removeClass("d-none");
+            $("#Add_phonenumber_inp").removeClass("d-none");
+            $(".Add_Contact_inp_label").removeClass("d-none");
+            $("#Add_contactname_inp").removeClass("d-none");
+            $(".warranty_serialNumber_submit").removeClass("d-none");
+            $(this).addClass("d-none");
+            $(".Serial_numb_notfound").addClass("d-none");
+          }
+         
+        }
+      }
+    } else {
+      if (serial_no_inp == "") {
+        $("#Add_serial_number_inp").addClass("border-danger");
+        $(".error_serial_num").removeClass("d-none");
+      }
+    }
+  });
+
+  async function warrentyService(Warrentypayload) {
+    const res = await postAPIServiceWarranty(
+      `apis/v4/bizgaze/transact/items/savewarrantyasync`,
+      Warrentypayload
+    );
+    console.log(res);
+    if (res.data.status == 2) {
+      $(".warranty_status_main_container").removeClass("d-none");
+      $(".bg-dangerLite").removeClass("d-none");
+      $(".user_Warranty_details").html(
+        `<div class="text-danger d-flex align-items-center bg-dangerLite text-dark p-2 rounded-4 mb-3" style="background-color: #ffe2e0!important;display:block"><div class="mr-1 d-flex justify-content-center align-items-center" style="width: 30px; height: 10px;"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.2646 3.41366C11.7212 3.15681 12.2788 3.15681 12.7354 3.41366L19.2354 7.06991C19.7077 7.33558 20 7.83536 20 8.37727V15.6227C20 16.1646 19.7077 16.6644 19.2354 16.9301L12.7354 20.5863C12.2788 20.8432 11.7212 20.8432 11.2646 20.5863L4.76461 16.9301C4.29229 16.6644 4 16.1646 4 15.6227V8.37727C4 7.83536 4.29229 7.33559 4.76461 7.06991L11.2646 3.41366Z" fill="#FF3A2E"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M11 7.4C11 7.17909 11.1791 7 11.4 7H12.6C12.8209 7 13 7.17909 13 7.4V12.6C13 12.8209 12.8209 13 12.6 13H11.4C11.1791 13 11 12.8209 11 12.6V7.4Z" fill="white"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M11 16C11 15.4477 11.4477 15 12 15C12.5523 15 13 15.4477 13 16C13 16.5523 12.5523 17 12 17C11.4477 17 11 16.5523 11 16Z" fill="white"></path></svg></div><div class="d-flex justify-content-center align-items-center  font-12">No Serial number found / Product not Delivered</div></div>`
+      );
+      setTimeout(function () {
+        $(".bg-dangerLite").hide();
+      }, 1000);
+    } else if (res.data.status == "0") {
+      $(".user_Warranty_details").html(
+        `<div class="text-danger d-flex align-items-center bg-dangerLite text-dark p-2 rounded-4 mb-3" style="background-color:#fff!important;display:block"><div class="mr-1 d-flex justify-content-center align-items-center" style="width: 30px; height: 10px;"><svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 48 48" width="48px" height="48px" baseProfile="basic"><circle cx="24" cy="24" r="20" fill="#6be3a2"/><path fill="#324561" d="M22.5,33c-0.226,0-0.446-0.076-0.625-0.219l-7.5-6c-0.431-0.345-0.501-0.974-0.156-1.405	c0.347-0.431,0.975-0.501,1.406-0.156l6.667,5.334l9.889-14.126c0.316-0.454,0.94-0.562,1.393-0.246	c0.453,0.317,0.562,0.94,0.246,1.393l-10.5,15c-0.158,0.227-0.403,0.377-0.677,0.417C22.595,32.997,22.547,33,22.5,33z"/></svg></div><div class="d-flex justify-content-center align-items-center font-12">${res.data.message}</div></div>`
+      );
+    }
+  }
+}
+wattantyFunction();