yonge
/
dy-admin-live


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
							<!DOCTYPE html>
<html lang="zh">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" href="/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>管乐迷</title>
    <style>
      .hide {
        display: none !important;
      }
      .el-notification {
        display: flex;
        width: 330px;
        padding: 14px 26px 14px 13px;
        border-radius: 8px;
        box-sizing: border-box;
        border: 1px solid #ebeef5;
        position: fixed;
        background-color: #fff;
        box-shadow:0 2px 12px 0 rgba(0, 0, 0, 0.1);
        transition: opacity 0.3s,transform 0.3s,left 0.3s,right 0.3s,top .4s,bottom 0.3s;
        overflow-wrap: anywhere;
        overflow: hidden;
        z-index: 9999;
        top: 16px;
        z-index: 2011;
        right: 16px;
      }
      .el-icon {
        --color: inherit;
        height: 1em;
        width: 1em;
        line-height: 1em;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        position: relative;
        fill: currentColor;
        color: var(--color);
        font-size: inherit;
      }
      .el-notification .el-notification--info {
          color: #909399;
      }
      .el-notification .el-notification__icon {
          height: 24px;
          width: 24px;
          font-size: 24px;
      }
      .el-icon svg {
          height: 1em;
          width: 1em;
      }

      .el-notification__group {
          margin-left: 13px;
          margin-right: 8px;
      }
      .el-notification__title {
        font-weight: 700;
        font-size: 16px;
        line-height: 24px;
        color: #303133;
        margin: 0;
      }
      .el-notification__content {
          font-size: 14px;
          line-height: 24px;
          margin: 6px 0 0 0;
          color: #606266;
          text-align: justify;
      }
      .el-notification__content p {
          margin: 0;
      }
      .el-notification .el-notification__closeBtn {
          position: absolute;
          top: 18px;
          right: 15px;
          cursor: pointer;
          color: #909399;
          font-size: 16px;
      }
    </style>
  </head>
  <body>
    <div id="app"></div>
    <script type="module" src="/src/main.ts"></script>

    <div id="notification_1" class="el-notification right hide" role="alert" style="top: 16px; z-index: 2011;"><i class="el-icon el-notification__icon el-notification--info"><svg class="icon" width="200" height="200" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M512 64a448 448 0 110 896.064A448 448 0 01512 64zm67.2 275.072c33.28 0 60.288-23.104 60.288-57.344s-27.072-57.344-60.288-57.344c-33.28 0-60.16 23.104-60.16 57.344s26.88 57.344 60.16 57.344zM590.912 699.2c0-6.848 2.368-24.64 1.024-34.752l-52.608 60.544c-10.88 11.456-24.512 19.392-30.912 17.28a12.992 12.992 0 01-8.256-14.72l87.68-276.992c7.168-35.136-12.544-67.2-54.336-71.296-44.096 0-108.992 44.736-148.48 101.504 0 6.784-1.28 23.68.064 33.792l52.544-60.608c10.88-11.328 23.552-19.328 29.952-17.152a12.8 12.8 0 017.808 16.128L388.48 728.576c-10.048 32.256 8.96 63.872 55.04 71.04 67.84 0 107.904-43.648 147.456-100.416z"></path></svg></i><div class="el-notification__group"><h2 class="el-notification__title">提示</h2><div class="el-notification__content"><p>为了保障更好的直播体验，建议使用chrome浏览器</p></div><i id="noClose" class="el-icon el-notification__closeBtn"><svg class="icon" width="200" height="200" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M764.288 214.592L512 466.88 259.712 214.592a31.936 31.936 0 00-45.12 45.12L466.752 512 214.528 764.224a31.936 31.936 0 1045.12 45.184L512 557.184l252.288 252.288a31.936 31.936 0 0045.12-45.12L557.12 512.064l252.288-252.352a31.936 31.936 0 10-45.12-45.184z"></path></svg></i></div></div>

    <script>
      var is360ByUserActivationProperty = () => {
        var navigator = window.navigator;
        if(navigator.userActivation){
          return false;//chrome
        }else{
          return true;//360极速
        }
      }
      function _mime(option, value) {
        var mimeTypes = navigator.mimeTypes;
        for (var mt in mimeTypes) {
          if (mimeTypes[mt][option] == value) {
            return true;
          }
        }
        return false;
      }

      var isChrome = navigator.userAgent.indexOf("Chrome") !== -1
      var is360 = is360ByUserActivationProperty() || _mime("type", "application/vnd.chromium.remoting-viewer")

      var isCloseBrowser = sessionStorage.getItem('isCloseBrowser')
      console.log(isChrome, is360, isCloseBrowser)
      // 如果不是360浏览器会提示
      if((!isChrome || is360) && !isCloseBrowser) {
        document.querySelector('#notification_1').classList.remove('hide')
        sessionStorage.removeItem('isCloseBrowser')
      }
      document.querySelector('#noClose').onclick = function() {
        document.querySelector('#notification_1').classList.add('hide')
        sessionStorage.setItem('isCloseBrowser', 1)
      }
    </script>
  </body>
</html>