MediaWiki:Common.js

From USC Nanofab Wiki
Revision as of 16:47, 18 August 2026 by Chandanr (talk | contribs)
Jump to navigation Jump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* Any JavaScript here will be loaded for all users on every page load. */
/*Update by Chandan Ramakrishnaiah Aug 18 2026*/
/* NanoFab Chat Assistant — embed iframe widget on every page */
(function () {
  if (window.self !== window.top) return;

  var action = mw.config.get('wgAction');
  if (action && action !== 'view') return;

  var CHAT_URL = 'https://nanofab-assistant.tailf13c08.ts.net';

  var btn = document.createElement('button');
  btn.id = 'nanofab-chat-btn';
  btn.setAttribute('aria-label', 'Open NanoFab Assistant');
  btn.textContent = '💬';

  var frameWrap = document.createElement('div');
  frameWrap.id = 'nanofab-chat-wrap';

  var iframe = document.createElement('iframe');
  iframe.src = CHAT_URL;
  iframe.title = 'NanoFab Assistant';
  iframe.setAttribute('sandbox', 'allow-scripts allow-same-origin allow-forms');
  iframe.setAttribute('loading', 'lazy');
  frameWrap.appendChild(iframe);

  var greeting = document.createElement('div');
  greeting.id = 'nanofab-chat-greeting';
  greeting.innerHTML = "Hi! I'm your NanoFab chatbot — ask me any question!" +
    '<button id="nanofab-chat-greeting-close" aria-label="Dismiss">×</button>';

  document.body.appendChild(frameWrap);
  document.body.appendChild(btn);
  document.body.appendChild(greeting);

  function openChat() {
    frameWrap.classList.add('open');
    btn.textContent = '✕';
    btn.classList.add('is-open');
    greeting.classList.remove('show');
  }
  function closeChat() {
    frameWrap.classList.remove('open');
    btn.textContent = '💬';
    btn.classList.remove('is-open');
  }

  btn.addEventListener('click', function () {
    btn.classList.remove('pulse');
    btn.classList.add('toggle-pop');
    var isOpen = frameWrap.classList.contains('open');
    if (isOpen) { closeChat(); } else { openChat(); }
  });

  btn.addEventListener('animationend', function (e) {
    if (e.animationName === 'nanofab-pulse') btn.classList.remove('pulse');
    if (e.animationName === 'nanofab-toggle-pop') btn.classList.remove('toggle-pop');
  });

  greeting.addEventListener('click', function () {
    openChat();
  });
  greeting.querySelector('#nanofab-chat-greeting-close').addEventListener('click', function (e) {
    e.stopPropagation();
    greeting.classList.remove('show');
  });

  // Fade in the greeting bubble ~1.5s after the page loads.
  setTimeout(function () {
    greeting.classList.add('show');
  }, 1500);

  // Pulse the button a few times shortly after load to draw attention.
  setTimeout(function () {
    btn.classList.add('pulse');
  }, 800);
})();