// This script will be run within the webview itself
// It cannot access the main VS Code APIs directly.
(function () {
  let userAgent = navigator.userAgent.toLowerCase();
  var isSafari = /safari/.test(userAgent) && !/chrome/.test(userAgent);
  var shareText = '';

  // 颜色转化rgb
  function hexToRgba(hex, alpha) {
    // Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
    var shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
    hex = hex.replace(shorthandRegex, function (m, r, g, b) {
      return r + r + g + g + b + b;
    });

    var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
    return result
      ? `rgba(
          ${parseInt(result[1], 16)},
          ${parseInt(result[2], 16)},
          ${parseInt(result[3], 16)},
          ${alpha}
      )`
      : null;
  }

  // Handle messages sent from the extension to the webview
  window.addEventListener('message', (event) => {
    var message = event.data; // The json data that the extension sent
    switch (message.type) {
      // 切换模式
      case 'metawork.changeShareTime': {
        document.getElementById('shareTime').innerText = message.shareTime;
        break;
      }
      case 'metawork.changeFollow': {
        if(message.data){
          shareText = message.data.shareText;
        }
        if (message.data && message.data.userName) {
          var data = message.data;
          document.getElementById('followName').innerText = data.userName;
          document.getElementById('followAvatar').style['background-image'] = `url(${data.followAvatar})`;
          document.getElementById('followPanel').style['background-color'] = hexToRgba(data.followColor, 0.2);
          document.getElementById('followPanel').style['border-color'] = hexToRgba(data.followColor, 0.5);
          document.getElementById('followPanel').style['display'] = 'flex';
        } else {
          document.getElementById('followPanel').style['display'] = 'none';
        }
        break;
      }
    }
  });

  // 加载完毕后展示dom
  window.addEventListener(
    'load',
    function () {
      var vscode = acquireVsCodeApi();
      document.body.className = '';
      vscode.postMessage({ type: 'metawork.ready' });

      if(isSafari){
        new Clipboard('.invite', {
          text: function (trigger) {
            return shareText;
          }
        }).on('success', function (e) {
          e.clearSelection();
        });
      }

      document.querySelector('#followClose').addEventListener('click', () => {
        document.getElementById('followPanel').style['display'] = 'none';
        //document.getElementById('followPanel').setAttribute('style', 'display:none;');
        vscode.postMessage({ type: 'metawork.free' });
      });

      document.querySelector('.invite').addEventListener('click', () => {
        vscode.postMessage({ type: 'metawork.invite' });
      });

      document.querySelector('.stop').addEventListener('click', () => {
        vscode.postMessage({ type: 'metawork.stop' });
      });

      document.querySelector('.quit').addEventListener('click', () => {
        vscode.postMessage({ type: 'metawork.quit' });
      });
    },
    false
  );

})();
