diff --git a/static/css/gofly-front.css b/static/css/gofly-front.css new file mode 100644 index 0000000..317de98 --- /dev/null +++ b/static/css/gofly-front.css @@ -0,0 +1,49 @@ +.launchButton{ + position: fixed!important; + bottom: 55px!important; + right: 20px!important; + left: auto!important; + height: 48px!important; + width: auto!important; + z-index: 10000000000000!important; + background: #20B2BB!important; + border: 0!important; + border-radius: 100px!important; + box-shadow: 0 3px 15px 0 rgba(0,0,0,.25)!important; + box-sizing: border-box!important; + padding: 0 20px!important; + transition: all .4s,bottom .8s ease-in-out!important; + cursor: pointer!important; + outline: 0!important; + display: inline-block; + margin: 0!important; + -webkit-font-smoothing: antialiased!important; + -webkit-tap-highlight-color: transparent!important; + animation-name: loadBubble; + animation-iteration-count: 1; + animation-timing-function: ease-in-out; + animation-duration: .2s; + color: #ffffff !important; +} +.launchButton:hover { + box-shadow: 0 3px 20px 0 rgba(0,0,0,.5)!important; +} +.launchButton svg{ + width: 28px; + height: 48px; +} +.launchButtonText { + color: #fff!important; + display: inline-block!important; + font-family: -apple-system,BlinkMacSystemFont,segoe ui,Roboto,Oxygen,Ubuntu,Cantarell,fira sans,droid sans,helvetica neue,sans-serif!important; + font-size: 1em!important; + line-height: 48px!important; + font-weight: 700!important; + margin: 0 0 0 12px!important; + overflow: hidden!important; + text-overflow: ellipsis!important; + vertical-align: top!important; + white-space: nowrap!important; + padding: 0!important; + transition: .6s ease-in-out!important; +} \ No newline at end of file diff --git a/static/html/index.html b/static/html/index.html index f9aca75..3da68dd 100644 --- a/static/html/index.html +++ b/static/html/index.html @@ -6,9 +6,7 @@ GO-FLY - {{.WebDesc}} - - - +
@@ -122,11 +130,25 @@ {{end}} +
+    <script src="https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js"></script>
+    <script src="https://cdn.bootcdn.net/ajax/libs/layer/3.1.1/layer.min.js"></script>
+    <link href="https://gofly.sopans.com/static/css/gofly-front.css" rel="stylesheet" type="text/css"/>
+    <div id="launchButton" class="launchButton">
+    <svg x="0px" y="0px" viewBox="0 0 27 21.9" aria-labelledby="title desc" role="img" class="xhl-launch-button-svg"><title>Chat Icon </title><desc>three small dots to indicate that an agent is available to chat</desc><path fill="#ffffff" d="M23.2,0L2.6,1.7C1,1.9,0,3.2,0,4.9v8c0,1.6,0.8,3,2.4,3.1l5.3,0.5c0,0,1,1.6,0.3,3.2C7.2,21.3,6,21.9,6,21.9 c4.2,0,6.6-3.1,7.8-4.9l9.4,0.7c1.8,0.2,3.8-1.3,3.8-3.1V3.1C27,1.3,25-0.1,23.2,0z M6.4,10.1c-0.9,0-1.7-0.7-1.7-1.7 c0-0.9,0.7-1.7,1.7-1.7C7.3,6.8,8,7.5,8,8.5C8,9.4,7.3,10.1,6.4,10.1z M13.2,10.1c-0.9,0-1.7-0.7-1.7-1.7c0-0.9,0.7-1.7,1.7-1.7 c0.9,0,1.7,0.7,1.7,1.7C14.8,9.4,14.1,10.1,13.2,10.1z M19.9,10.1c-0.9,0-1.7-0.7-1.7-1.7c0-0.9,0.7-1.7,1.7-1.7 c0.9,0,1.7,0.7,1.7,1.7C21.6,9.4,20.9,10.1,19.9,10.1z"></path></svg>
+    <div class="launchButtonText">
+    Chat with us
+    </div>
+    </div>
+    <script>
+    var GOFLY_URL="https://gofly.sopans.com";
+    </script>
+    <script src="https://gofly.sopans.com/static/js/gofly-front.js"></script>
+
+ + + + + +
+ Chat Icon three small dots to indicate that an agent is available to chat +
+ Chat with us +
+
+ + + + + \ No newline at end of file diff --git a/static/js/gofly-front.js b/static/js/gofly-front.js new file mode 100644 index 0000000..1a003df --- /dev/null +++ b/static/js/gofly-front.js @@ -0,0 +1,46 @@ +var launchButtonFlag=false; +$("#launchButton").click(function() { + if (launchButtonFlag) return; + layer.open({ + type: 2, + title: "Chat with us", + closeBtn: 1, //不显示关闭按钮 + shade: [0], + area: ['520px', '530px'], + offset: 'rb', //右下角弹出 + anim: 2, + content: [GOFLY_URL+'/chat_page', 'no'], //iframe的url，no代表不显示滚动条 + end: function(){ + launchButtonFlag=false; + $(".launchButton").show(); + } + }); + launchButtonFlag=true; + $(".launchButton").hide(); +}); + +var titleTimer,titleNum=0; +var originTitle = document.title; +function flashTitle() { + titleNum++; + if (titleNum == 3) { + titleNum = 1; + } + if (titleNum == 1) { + document.title = '【】' + originTitle; + } + if (titleNum == 2) { + document.title = '【你有一条消息】' + originTitle; + } + titleTimer = setTimeout("flashTitle()", 500); +} +window.addEventListener('message',function(e){ + var msg=e.data; + if(msg.type=="message"){ + flashTitle();//标题闪烁 + } +}); +window.onfocus = function () { + clearTimeout(titleTimer); + document.title = originTitle; +};