function toggle(elmt1,elmt2)
        {
          if(elmt1.classList.contains('mdl-button--accent'))
          {
             elmt2.hidden=true;
             elmt1.classList.remove('mdl-button--accent');
             elmt1.classList.add('mdl-button--colored');
          }else{
            elmt2.hidden=false;
            elmt1.classList.add('mdl-button--accent');
             elmt1.classList.remove('mdl-button--colored');
          }
           
        }

        
       
        function set_msg(usr)
        {
            curUser=usr.replace('#','');
        }     
        function add_msg(msg)
        {
            if(!pgs.includes(msg.UserStr))
            {
                window.location.reload();
            }else if(msg.UserStr != 'me')
            {
                var elmt = document.getElementById(`messages-${msg.UserStr}`);
                
                var elmnt0=document.createElement('li');
                elmnt0.classList.add('him');
                elmnt0.innerText=msg.Content;
                
                elmt.appendChild(elmnt0);
                elmnt0.scrollIntoView(false);
                
            }
            send_notification_basic(msg.Content,msg.Name);
           //if(msg.UserStr)
        }
        const dialog = document.getElementById('clear_all_dlg');
        function clear_all()
        {
            dialog.show();
        }
        function clear_all_cancel()
        {
            dialog.close();
        }
        function clear_all_confirm()
        {
          var ws_data={
                PacketType: 6,
                Data: {
                    UserStr:curUser
                }
            };
            ws.send(JSON.stringify(ws_data));
            dialog.close();
            var elmt = document.getElementById(`messages-${curUser}`);
            elmt.innerHTML="";
        }
        function send_msg_to()
        {
          
          var tb = document.getElementById('msg_tb');
        
            
            
            var ws_data={
                PacketType: 3,
                Data: {
                    Content:tb.value,
                    UserStr:curUser
                }
            };
            window.ws.send(JSON.stringify(ws_data));

            var elmt = document.getElementById(`messages-${curUser}`);
                
                var elmnt0=document.createElement('li');
                elmnt0.classList.add('me');
                elmnt0.innerText=tb.value;
                elmt.appendChild(elmnt0);

                elmnt0.scrollIntoView(false);

                tb.value="";

        }
        function setup_notifications()
        {
               Notification.requestPermission();
              return false;
        }
        
        function send_notification_basic(text,name)
        {
          if(Notification.permission === "granted"){
            const msg = new Notification(`Chatr Message From: ${name}`,{
                body: text
            });
          }
        }
        function handle_notification_event(props)
        {
            /*
              props.BotNotificationId, props.BotOwnerUserName, props.BotUserString, props.Button  send to server
              props.Url, props.Type for client
            */

            if(props.Type === 0)
            {
              return;
            }
            if(props.Type === 1 || props.Type === 2)
            {
                window.open(props.Url,"_blank")

            }
            if(props.Type > 2)
            {
                window.ws.send(JSON.stringify({
                    BotUserString: props.BotUserString,
                    BotNotificationId: props.BotNotificationId,
                    SourceUserName: props.BotOwnerUserName,
                    Button:props.Button 
                }));
            }
        }
        function send_notification_bot(msg)
        {
            if(Notification.permission === "granted")
            {
               var actions = [];
                msg.NotificationButtons.forEach((e)=>{
                  actions.push({
                      action: e,
                      title: e.Text
                  });
                });
                const not = new Notification(`(${msg.BotName} (${msg.BotOwnerName}'s Bot)) ${msg.Title}`,{
                  body: msg.Body,
                  actions: actions
                });
                
                not.onclick = (e)=>{
                    console.log(e.action);

                    var url="";
                    var type = 0;
                    var buttonTxt="";
                    if(!e.action)
                    {
                      type=msg.OnClick.Type;
                      if(type === 0) return;
                      if(type === 1 || type === 2)
                      {
                        url = msg.OnClick.Data.Url;
                      }
                    }else{
                      type=e.Event.Type;
                      if(type === 0)return;
                      if(type===1 || type === 2)
                      {
                        url = e.Event.Data.Url;
                      }
                      buttonTxt=e.Text;
                    }
                   
                    handle_notification_event({
                        BotOwnerUserName:msg.BotOwnerUserName,
                        BotUserString:msg.BotUserString,
                        BotNotificationId:msg.BotNotificationId,
                        Button:buttonTxt,
                        Url:url,
                        Type:type
                    });
                };
            }
        }
        
        function set_user_callback(v)
        {
            var elmt = document.getElementById(`link-${v}`);
            elmt.onclick = function(e){
              set_msg(v);
            };
        }
        function getCookie(name) {
            const value = `; ${document.cookie}`;
            const parts = value.split(`; ${name}=`);
            if (parts.length === 2) return parts.pop().split(';').shift();
        }
        function init_ws()
        {
            const b1=document.getElementById('moreBtn');
            const div = document.getElementById('moreBtns');
            b1.onclick = (e)=>{
              toggle(b1,div);

            };
            var j=null;
            set_user_callback('me');
            pgs.forEach(e=>{
              set_user_callback(e);
            });
            fetch("./api/appconfig.json",{credentials:"same-origin"}).then(e=>e.json()).then(e=>{
              
                    var wsStr="";
                   //
                   console.log(e.WS_SAME_AS_HTTP);
                   if(e.WS_SAME_AS_HTTP)
                   {
                      var scheme=  window.location.protocol == "http:" ? "ws" : "wss";
                      wsStr=`${scheme}://${window.location.host}${window.location.pathname}chatr-ws`;
                   }else{
                   var scheme = e.WSS ? 'wss' : 'ws';
                   wsStr=`${scheme}://${window.location.hostname}:${e.WSPort}${window.location.pathname}chatr-ws`;
                   }
                  
                   var cses=getCookie("Chatr-Session");
                  
                   if(cses != null && cses != undefined){
                  window.ws=new WebSocket(wsStr);
                   window.ws.onopen = function(e){
                      window.ws.send(JSON.stringify({
                          PacketType: 1,
                          Data: {
                            SessionId: cses
                          }
                      }));
                   };
                   window.ws.onmessage=function(e){
                    console.log(e.data);
                      var jsonData=JSON.parse(e.data);
                         switch(jsonData.PacketType)
                          {
                              case 3:
                                add_msg(jsonData.Data);
                                break;
                              case 4:
                                //send_notification_bot(jsonData.Data);
                                break;
                          }
                      
                   };
                  }
              
            });
            
        }