// import type Peer from 'peerjs';
// import type { DataConnection, MediaConnection } from 'peerjs';
// import type MessageDistributor from '../MessageDistributor';
// import type { Message } from '../messages'
// import store from 'App/store';
// import type { LocalStream } from './LocalStream';
// import { update, getState } from '../../store';
// import { iceServerConfigFromString } from 'App/utils'


// export enum CallingState {
//   Reconnecting,
//   Requesting,
//   True,
//   False,
// };

// export enum ConnectionStatus {
//   Connecting,
//   WaitingMessages,
//   Connected,
//   Inactive,
//   Disconnected,
//   Error,
// };


// export function getStatusText(status: ConnectionStatus): string {
//   switch(status) {
//     case ConnectionStatus.Connecting:
//       return "Connecting...";
//     case ConnectionStatus.Connected:
//       return "";
//     case ConnectionStatus.Inactive:
//       return "Client tab is inactive";
//     case ConnectionStatus.Disconnected:
//       return "Disconnected";
//     case ConnectionStatus.Error:
//       return "Something went wrong. Try to reload the page.";
//     case ConnectionStatus.WaitingMessages:
//       return "Connected. Waiting for the data... (The tab might be inactive)"
//   }
// }
 
// export interface State {
//   calling: CallingState,
//   peerConnectionStatus: ConnectionStatus,
//   remoteControl: boolean,
// }

// export const INITIAL_STATE: State = {
//   calling: CallingState.False,
//   peerConnectionStatus: ConnectionStatus.Connecting,
//   remoteControl: false,
// }

// const MAX_RECONNECTION_COUNT = 4;


// function resolveURL(baseURL: string, relURL: string): string {
//   if (relURL.startsWith('#') || relURL === "") {
//     return relURL;
//   }
//   return new URL(relURL, baseURL).toString();
// }


// var match = /bar/.exec("foobar");
// const re1 = /url\(("[^"]*"|'[^']*'|[^)]*)\)/g
// const re2 = /@import "(.*?)"/g
// function cssUrlsIndex(css: string): Array<[number, number]> {
//   const idxs: Array<[number, number]> = [];
//   const i1 = css.matchAll(re1);
//   // @ts-ignore
//   for (let m of i1) {
//     // @ts-ignore
//     const s: number = m.index + m[0].indexOf(m[1]);
//     const e: number = s + m[1].length;
//     idxs.push([s, e]);
//   }
//   const i2 = css.matchAll(re2);
//   // @ts-ignore
//   for (let m of i2) {
//     // @ts-ignore
//     const s = m.index + m[0].indexOf(m[1]);
//     const e = s + m[1].length;
//     idxs.push([s, e])
//   }
//   return idxs;
// }
// function unquote(str: string): [string, string] {
//   str = str.trim();
//   if (str.length <= 2) {
//     return [str, ""]
//   }
//   if (str[0] == '"' && str[str.length-1] == '"') {
//     return [ str.substring(1, str.length-1), "\""];
//   }
//   if (str[0] == '\'' && str[str.length-1] == '\'') {
//     return [ str.substring(1, str.length-1), "'" ];
//   }
//   return [str, ""]
// }
// function rewriteCSSLinks(css: string, rewriter: (rawurl: string) => string): string {
//   for (let idx of cssUrlsIndex(css)) {
//     const f = idx[0]
//     const t = idx[1]
//     const [ rawurl, q ] = unquote(css.substring(f, t));
//     css = css.substring(0,f) + q + rewriter(rawurl) + q + css.substring(t);
//   }
//   return css
// }

// function resolveCSS(baseURL: string, css: string): string {
//   return rewriteCSSLinks(css, rawurl => resolveURL(baseURL, rawurl));
// }

// export default class AssistManager {
//   constructor(private session, private md: MessageDistributor, private config) {}

//   private setStatus(status: ConnectionStatus) {
//     if (status === ConnectionStatus.Connecting) {
//       this.md.setMessagesLoading(true);
//     } else {
//       this.md.setMessagesLoading(false);
//     }
//     if (status === ConnectionStatus.Connected) {
//       this.md.display(true);
//     } else {
//       this.md.display(false);
//     }
//     update({ peerConnectionStatus: status });
//   }

//   private get peerID(): string {
//     return `${this.session.projectKey}-${this.session.sessionId}`
//   }

//   private peer: Peer | null = null;
//   connectionAttempts: number = 0;
//   private peeropened: boolean = false;
//   connect() {
//     if (this.peer != null) {
//       console.error("AssistManager: trying to connect more than once");
//       return;
//     }
//     this.setStatus(ConnectionStatus.Connecting)
//     import('peerjs').then(({ default: Peer }) => {
//       const _config = {
//         // @ts-ignore
//         host: new URL(window.ENV.API_EDP).host,
//         path: '/assist',
//         port:  location.protocol === 'https:' ? 443 : 80,
//       }

//       if (this.config) {
//         _config['config'] = {
//           iceServers: this.config,
//           sdpSemantics: 'unified-plan',
//           iceTransportPolicy: 'relay',
//         };
//       }

//       const peer = new Peer(_config);
//       this.peer = peer;
//       peer.on('error', e => {
//         if (e.type !== 'peer-unavailable') {
//           console.warn("AssistManager PeerJS peer error: ", e.type, e)
//         }
//         if (['peer-unavailable', 'network', 'webrtc'].includes(e.type)) {
//           if (this.peer && this.connectionAttempts++ < MAX_RECONNECTION_COUNT) {
//             this.setStatus(ConnectionStatus.Connecting);
//             this.connectToPeer();
//           } else {
//             this.setStatus(ConnectionStatus.Disconnected);
//             this.dataCheckIntervalID && clearInterval(this.dataCheckIntervalID);
//           }
//         } else {
//           console.error(`PeerJS error (on peer). Type ${e.type}`, e);
//           this.setStatus(ConnectionStatus.Error)
//         }
//       })
//       peer.on("open", () => {
//         if (this.peeropened) { return; }
//         this.peeropened = true;
//         this.connectToPeer();        
//       });
//     });
//   }

//   private dataCheckIntervalID: ReturnType<typeof setInterval> | undefined;
//   private connectToPeer() {
//     if (!this.peer) { return; }
//     this.setStatus(ConnectionStatus.Connecting);
//     const id = this.peerID;
//     const conn = this.peer.connect(id, { serialization: 'json', reliable: true});
//     conn.on('open', () => {
//       window.addEventListener("beforeunload", ()=>conn.open &&conn.send("unload"));

//       //console.log("peer connected")


//       if (getState().calling === CallingState.Reconnecting) {
//         this._call()
//       }
      
//       let i = 0;
//       let firstMessage = true;

//       this.setStatus(ConnectionStatus.WaitingMessages)

//       conn.on('data', (data) => {
//         if (!Array.isArray(data)) { return this.handleCommand(data); }
//         this.disconnectTimeout && clearTimeout(this.disconnectTimeout);
//         if (firstMessage) {
//           firstMessage = false;
//           this.setStatus(ConnectionStatus.Connected)
//         }

//         let time = 0;
//         let ts0 = 0;
//         (data as Array<Message & { _id: number}>).forEach(msg => {

//           // TODO: more appropriate way to do it.
//           if (msg._id === 60) {
//             // @ts-ignore
//             if (msg.name === 'src' || msg.name === 'href') {
//                           // @ts-ignore
//               msg.value = resolveURL(msg.baseURL, msg.value);
//                           // @ts-ignore
//             } else if (msg.name === 'style') {
//                          // @ts-ignore
//               msg.value = resolveCSS(msg.baseURL, msg.value);
//             }     
//             msg._id = 12;       
//           } else if (msg._id === 61) { // "SetCSSDataURLBased"
//                           // @ts-ignore
//             msg.data = resolveCSS(msg.baseURL, msg.data);
//             msg._id = 15;
//           } else if (msg._id === 67) { // "insert_rule"
//              // @ts-ignore
//             msg.rule = resolveCSS(msg.baseURL, msg.rule);
//             msg._id = 37;
//           }


//           msg.tp = ID_TP_MAP[msg._id];  // _id goes from tracker
          
//           if (msg.tp === "timestamp") {
//             ts0 = ts0 || msg.timestamp
//             time = msg.timestamp - ts0;
//             return;
//           }
//           const tMsg: TimedMessage = Object.assign(msg, {
//             time,
//             _index: i,
//           });
//           this.md.distributeMessage(tMsg, i++);
//         });
//       });
//     });


//     const onDataClose = () => {
//       this.onCallDisconnect()
//       //console.log('closed peer conn. Reconnecting...')
//       this.connectToPeer();
//     }

//     // this.dataCheckIntervalID = setInterval(() => {
//     //   if (!this.dataConnection && getState().peerConnectionStatus === ConnectionStatus.Connected) {
//     //     onDataClose();
//     //   }
//     // }, 3000);
//     conn.on('close', onDataClose);// Does it work ?
//     conn.on("error", (e) => {
//       this.setStatus(ConnectionStatus.Error);
//     })
//   }


//   private get dataConnection(): DataConnection | undefined {
//     return this.peer?.connections[this.peerID]?.find(c => c.type === 'data' && c.open);
//   }

//   private get callConnection(): MediaConnection | undefined {
//     return this.peer?.connections[this.peerID]?.find(c => c.type === 'media' && c.open);
//   } 

//   private send(data: any) {
//     this.dataConnection?.send(data);
//   }


//   private forceCallEnd() {
//     this.callConnection?.close();
//   }
//   private notifyCallEnd() {
//     const dataConn = this.dataConnection;
//     if (dataConn) {
//       dataConn.send("call_end");
//     }
//   }
//   private initiateCallEnd = () => {
//     this.forceCallEnd();
//     this.notifyCallEnd();
//     this.localCallData && this.localCallData.onCallEnd();
//   }

//   private onTrackerCallEnd = () => {
//     console.log('onTrackerCallEnd')
//     this.forceCallEnd();
//     if (getState().calling === CallingState.Requesting) {
//       this.localCallData && this.localCallData.onReject();
//     }
//     this.localCallData && this.localCallData.onCallEnd();
//   }

//   private onCallDisconnect = () => {
//     if (getState().calling === CallingState.True) {
//       update({ calling: CallingState.Reconnecting });
//     }
//   }


//   private disconnectTimeout: ReturnType<typeof setTimeout> | undefined;
//   private handleCommand(command: string) {
//     console.log("Data command", command)
//     switch (command) {
//       case "unload":
//         //this.onTrackerCallEnd();
//         this.onCallDisconnect()
//         this.dataConnection?.close();
//         this.disconnectTimeout = setTimeout(() => {
//           this.onTrackerCallEnd();
//           this.setStatus(ConnectionStatus.Disconnected);
//         }, 15000); // TODO: more convenient way
//         //this.dataConnection?.close();
//         return;
//       case "call_end":
//         this.onTrackerCallEnd();
//         return;
//       case "call_error":
//         this.onTrackerCallEnd();
//         this.setStatus(ConnectionStatus.Error);
//         return;
//     }
//   }

//   // private mmtid?:ReturnType<typeof setTimeout>
//   private onMouseMove = (e: MouseEvent): void => {
//     // this.mmtid && clearTimeout(this.mmtid)
//     // this.mmtid = setTimeout(() => {
//     const data = this.md.getInternalCoordinates(e);
//     this.send({ x: Math.round(data.x), y: Math.round(data.y) });
//     // }, 5)
//   }


//   // private wtid?: ReturnType<typeof setTimeout>
//   // private scrollDelta: [number, number] = [0,0]
//   private onWheel = (e: WheelEvent): void => {
//     e.preventDefault()
//     //throttling makes movements less smooth
//     // this.wtid && clearTimeout(this.wtid)
//     // this.scrollDelta[0] += e.deltaX
//     // this.scrollDelta[1] += e.deltaY
//     // this.wtid = setTimeout(() => {
//     this.send({ type: "scroll",  delta: [ e.deltaX, e.deltaY ]})//this.scrollDelta });
//     this.onMouseMove(e)
//     //   this.scrollDelta = [0,0]
//     // }, 20)
//   }

//   private onMouseClick = (e: MouseEvent): void => {
//     const conn = this.dataConnection;
//     if (!conn) { return; }
//     const data = this.md.getInternalCoordinates(e);
//     // const el = this.md.getElementFromPoint(e); // requires requestiong node_id from domManager
//     const el = this.md.getElementFromInternalPoint(data)
//     if (el instanceof HTMLElement) {
//       el.focus()
//       el.oninput = e => e.preventDefault();
//       el.onkeydown = e => e.preventDefault();
//     }
//     conn.send({ type: "click",  x: Math.round(data.x), y: Math.round(data.y) });
//   }

//   private toggleRemoteControl = (flag?: boolean) => {
//     const state = getState().remoteControl;
//     const newState = typeof flag === 'boolean' ? flag : !state;
//     if (state === newState) { return }
//     if (newState) {
//       this.md.overlay.addEventListener("click", this.onMouseClick);
//       this.md.overlay.addEventListener("wheel", this.onWheel)
//       update({ remoteControl: true })
//     } else {
//       this.md.overlay.removeEventListener("click", this.onMouseClick);
//       this.md.overlay.removeEventListener("wheel", this.onWheel);
//       update({ remoteControl: false })
//     }
//   }

//   private localCallData: {
//     localStream: LocalStream,
//     onStream: (s: MediaStream)=>void,
//     onCallEnd: () => void,
//     onReject: () => void, 
//     onError?: ()=> void
//   } | null = null

//   call(localStream: LocalStream, onStream: (s: MediaStream)=>void, onCallEnd: () => void, onReject: () => void, onError?: ()=> void): { end: Function, toggleRemoteControl: Function } {
//     this.localCallData = {
//       localStream,
//       onStream,
//       onCallEnd: () => {
//         onCallEnd();
//         this.toggleRemoteControl(false);
//         this.md.overlay.removeEventListener("mousemove",  this.onMouseMove);
//         this.md.overlay.removeEventListener("click",  this.onMouseClick);
//         update({ calling: CallingState.False });
//         this.localCallData = null;
//       },
//       onReject,
//       onError,
//     }
//     this._call()
//     return {
//       end: this.initiateCallEnd,
//       toggleRemoteControl: this.toggleRemoteControl,
//     }
//   }

//   private _call() {
//     if (!this.peer || !this.localCallData || ![CallingState.False, CallingState.Reconnecting].includes(getState().calling)) { return null; }
    
//     update({ calling: CallingState.Requesting });

//     //console.log('calling...', this.localCallData.localStream)
    
//     const call =  this.peer.call(this.peerID, this.localCallData.localStream.stream);
//     this.localCallData.localStream.onVideoTrack(vTrack => {
//       const sender = call.peerConnection.getSenders().find(s => s.track?.kind === "video")
//       if (!sender) {
//         //logger.warn("No video sender found")
//         return
//       }
//       //logger.log("sender found:", sender)
//       sender.replaceTrack(vTrack)
//     })

//     call.on('stream', stream => {
//       update({ calling: CallingState.True });
//       this.localCallData && this.localCallData.onStream(stream);
//       this.send({ 
//         name: store.getState().getIn([ 'user', 'account', 'name']),
//       });

//       this.md.overlay.addEventListener("mousemove", this.onMouseMove)
//       // this.md.overlay.addEventListener("click", this.onMouseClick)
//     });
//     //call.peerConnection.addEventListener("track", e => console.log('newtrack',e.track))

//     call.on("close", this.localCallData.onCallEnd);
//     call.on("error", (e) => {
//       console.error("PeerJS error (on call):", e)
//       this.initiateCallEnd();
//       this.localCallData && this.localCallData.onError && this.localCallData.onError();
//     });

//     window.addEventListener("beforeunload", this.initiateCallEnd)
//   }

//   clear() {
//     this.initiateCallEnd();
//     this.dataCheckIntervalID && clearInterval(this.dataCheckIntervalID);
//     if (this.peer) {
//       //console.log("destroying peer...")
//       const peer = this.peer; // otherwise it calls reconnection on data chan close
//       this.peer = null;
//       peer.destroy();
//     }
//   }
// }