// ==UserScript==
// @name         智能话席助手
// @description   一个在电信领域的智能助手
// @namespace    http://tampermonkey.net/
// @license      GPL-3.0-only
// @version      0.22
// @description  智能话席助手
// @author       xiaoliang
// @match        https://123.147.219.22:9114/
// @resource customCSS1 https://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css
// @resource customCSS2 http://jqueryui.com/resources/demos/style.css
// @grant        GM_addStyle
// @grant        GM_getResourceText
// @require      http://cdn.bootcss.com/jquery/1.8.3/jquery.min.js
// @require      https://code.jquery.com/ui/1.10.4/jquery-ui.js
// @downloadURL none
// ==/UserScript==

(function () {
	'use strict';

	// Your code here...
	if (!$) {
		var s = document.createElement("script");
		s.src = "http://cdn.bootcss.com/jquery/1.8.3/jquery.min.js";
		s.async = false;
		document.documentElement.appendChild(s);
	}

	let LOGO_CLOSE_SRC = 'https://cq.infowell.cn/image/close-logo.png'
	let LOGO_INACTIVE_SRC = 'https://cq.infowell.cn/image/in-intelligent-assistant.png'
	let LOGO_ACTIVE_SRC = 'https://cq.infowell.cn/image/intelligent-assistant.png'
	let PAGE_SERVER_URL = 'https://cq.infowell.cn/'
	let WS_SERVER_URL = 'ws://127.0.0.1:7789/ws'

	let openFlag = 1
	let socket = null
	let pre_status = ''
	let cur_status = ''
	let pre_phone = ''
	let cur_phone = ''
	let Phone = ''
	let ProductName = ''
	let StatusChangeMsg = {}
	let InitParameterMsg = {
		EventId: "InitParameter",
		Data: {
			ProjectId: 16,
			ProjectName: '5G升级包外呼营销',
			AgentName: ''
		}
	}

	//加载在线样式
	const css1 = GM_getResourceText("customCSS1");
	const css2 = GM_getResourceText("customCSS2");
	GM_addStyle(css1)
	GM_addStyle(css2)

	//构造文档
	function createHTML() {
		let logo = document.querySelector(".appContent")
		let example = document.createElement("div")
		example.classList.add("div-box")
		example.innerHTML = `
     <div id="draggable" class="container">
        <div class="content">
            <div class="close-btn">
                <img class="close-img" title="" src="" alt="">
            </div>
        </div>
        <button class="open-btn">
            <img class="open-img" title="" src="" alt="">
        </button>
    </div>`

		logo.appendChild(example)

	}

	//渲染样式
	function addStyle() {
		let css = `.container {
            position: fixed;
            z-index: 99999999;
            top: 40px;
            right: 0px;
        }

        .content {
            position: relative;
        }

        .content iframe {
            border: none;
        }

        .content .close-btn {
            position: absolute;
            z-index:999;
            top: 36px;
            left: -20px;
            display: flex;
            align-items: center;
            padding-left: 8px;
            box-sizing: border-box;
            width: 50px;
            height: 50px;
            border-radius: 50%;
            background-color: #ffffff;
            cursor: pointer;
            box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.2);
        }
        .content .close-btn img {
            width: 25px;
            height: 25px;
        }
        .open-btn {
            position: fixed;
            z-index: 99999999;
            bottom: 0px;
            right: 0px;
            display: flex;
            border:none;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            width: 80px;
            height: 80px;
            border-radius: 50%;
            box-shadow: 1px 1px 15px rgba(0, 0, 0, 0.2);
            background-color: #ffffff;
            font-size: 16px;d
            cursor: pointer;
            margin: 50px 50px;
        }

        .open-btn img {
            width: 60px;
            height: 60px;
        }`

		GM_addStyle(css)
	}

	//发送消息
	function sendMessage(msg) {
		console.log('正在向websocket发送消息,消息如下：')
		console.log(msg)
		socket.send(msg);
	}

	//连接webocket
	function openSocket() {
		const socketUrl = WS_SERVER_URL;
		console.log(socketUrl);
		if (socket != null) {
			socket.close();
			socket = null;
		}
		socket = new WebSocket(socketUrl);
		console.log('socket对象：');
		console.log(socket);

		//打开事件
		socket.onopen = function () {
			$('.open-btn').attr({
				disabled: false
			})
			$('.open-img').attr({
				src: LOGO_ACTIVE_SRC,
				title: "双击打开坐席助手"
			})
			console.log("websocket已打开");
		};
		//获得消息事件
		socket.onmessage = function (msg) {
			// alert("收到消息：" + msg.data);
			console.log(msg.data);
			//发现消息进入,开始处理前端触发逻辑
		};
		//关闭事件
		socket.onclose = function () {
			$('.open-btn').attr({
				disabled: true
			})
			$('.open-img').attr({
				src: LOGO_INACTIVE_SRC,
				title: "无法连接到坐席助手"
			})
			console.log("websocket已关闭");
		};
		//发生了错误事件
		socket.onerror = function () {
			$('.open-btn').attr({
				disabled: true
			})
			$('.open-img').attr({
				src: LOGO_INACTIVE_SRC,
				title: "无法连接到坐席助手"
			})
			console.log("websocket发生了错误");
		}
	}

	//文档加载完毕后执行
	$(document).ready(function () {
		console.log('文档已加载完毕，坐席脚本正在启动...')
		createHTML()
		addStyle()
		openSocket()
		$(".content").hide()

		$('.close-img').attr({
			src: LOGO_CLOSE_SRC,
			title: "双击关闭坐席助手"
		})

		setInterval(() => {
			if (openFlag && document.querySelector('.layout')) {
				$(".open-btn").show()
			} else {
				$(".open-btn").hide()
			}

			if (document.querySelector('.loginMain')) {
				$(".content").hide()
			}

			// 通话状态：无效 通话中 整理
			if (document.querySelector('.text')) {
				cur_status = document.querySelector('.text').innerHTML
			}

			// 号码
			if (document.querySelectorAll('.value').length > 0) {
				document.querySelectorAll('.value').forEach((item) => {
					if (item.innerHTML > 10000000000) {
						Phone = item.innerHTML
						cur_phone = item.innerHTML
						return false
					}
				})
			}

			//话务员
			if (document.querySelector('.userName') && document.querySelector('.userName').innerHTML) {
				InitParameterMsg.Data.AgentName = document.querySelector('.userName').innerHTML.replace('JYX', '')
			}

			//产品名
			if (document.querySelector('.ivu-tag-text') && document.querySelector('.ivu-tag-text').innerHTML) {
				ProductName = document.querySelector('.ivu-tag-text').innerHTML
			}

			if (cur_phone != pre_phone && cur_status == '通话中') {
				pre_phone = cur_phone
				pre_status = cur_status


				//如果ws断开，则重连并发送消息
				if (socket.readyState == 3) {
					console.log('socket已断开...')
					openSocket()
					console.log('socket已断开重连...')
					//数据初始化
					sendMessage(JSON.stringify(InitParameterMsg))
					StatusChangeMsg = {
						EventId: "StateChange",
						Data: {
							PreState: pre_status,
							NowState: cur_status,
							Phone: Phone,
							ProductName: ProductName
						}
					}

					sendMessage(JSON.stringify(StatusChangeMsg))

				}

				//否则发送消息
				else {
					console.log('socket已连接...')
					sendMessage(JSON.stringify(InitParameterMsg))
					StatusChangeMsg = {
						EventId: "StateChange",
						Data: {
							PreState: pre_status,
							NowState: cur_status,
							Phone: Phone,
							ProductName: ProductName
						}
					}

					sendMessage(JSON.stringify(StatusChangeMsg))

				}

			}

			// 只允许在状态改变的时候发消息
			if (cur_status != pre_status && cur_status != '通话中') {

				//把当前号码赋值给上一通号码，当当前号码与上一通号码不一样时再发送消息
				pre_phone = cur_phone
				pre_status = cur_status


				//如果ws断开，则重连并发送消息
				if (socket.readyState == 3) {
					console.log('socket已断开...')
					openSocket()
					console.log('socket已断开重连...')
					//数据初始化
					sendMessage(JSON.stringify(InitParameterMsg))
					StatusChangeMsg = {
						EventId: "StateChange",
						Data: {
							PreState: pre_status,
							NowState: cur_status,
							Phone: Phone,
							ProductName: ProductName
						}
					}

					sendMessage(JSON.stringify(StatusChangeMsg))

				}

				//否则发送消息
				else {
					console.log('socket已连接...')
					sendMessage(JSON.stringify(InitParameterMsg))
					StatusChangeMsg = {
						EventId: "StateChange",
						Data: {
							PreState: pre_status,
							NowState: cur_status,
							Phone: Phone,
							ProductName: ProductName
						}
					}

					sendMessage(JSON.stringify(StatusChangeMsg))

				}

			}
		}, 200)

		// 异步加载iframe，连接上websocket并接受消息
		setTimeout(() => {
			let scriptContent = document.querySelector(".content")
			let iframeDom = document.createElement("iframe")
			iframeDom.src = PAGE_SERVER_URL
			iframeDom.width = '1020px'
			iframeDom.height = '770px'
			iframeDom.frameborder = '0'
			iframeDom.scrolling = 'no'
			iframeDom.marginheight = '4'
			iframeDom.marginwidth = '8'

			scriptContent.appendChild(iframeDom)
		}, 500)

		$(document).tooltip()
		$(".open-btn").dblclick(function () {
			openFlag = 0
			$(".open-btn").hide()
			$(".content").show()
		})

		$(".close-btn").dblclick(function () {
			openFlag = 1
			$(".content").hide()
			$(".open-btn").show()
		})

	});
})();