Anandamakaranda

MediaWiki:Gadget-GrAnnotations.js: Difference between revisions

← Older editNewer edit →
No edit summary
No edit summary
Line 79: Line 79:
       '    <span class="gra-icon gra-icon-search" aria-hidden="true"></span>',
       '    <span class="gra-icon gra-icon-search" aria-hidden="true"></span>',
       '    <span class="gra-fab-btn-label">Search</span>',
       '    <span class="gra-fab-btn-label">Search</span>',
      '  </button>',
      '  <button class="gra-fab-btn gra-fab-btn-dismiss" id="gra-fab-dismiss" type="button" aria-label="Dismiss">',
      '    <span class="gra-icon gra-icon-dismiss" aria-hidden="true">\u2715</span>',
      '    <span class="gra-fab-btn-label">Close</span>',
       '  </button>',
       '  </button>',
       '</div>',
       '</div>',
Line 243: Line 247:
     var fabW, fabH, top, left;
     var fabW, fabH, top, left;
     if (_mobile) {
     if (_mobile) {
      fabW = 200; fabH = 48;
       /* Docked as a fixed bar below the reader toolbar.
       /* Strategy B: place fab BELOW the selection — the native iOS/Android
         All positioning is handled by CSS via .gra-fab-mobile-docked,
         selection menu appears ABOVE it, so the two never collide. */
        so it never collides with the native selection menu and never
      top  = rect.bottom + window.scrollY + 14;
        clips at screen edges or causes horizontal scroll. */
      left = rect.left + rect.width / 2 - fabW / 2;
       $fab.css({ position: '', top: '', left: '', visibility: '' })
      /* Near viewport bottom: flip above, clearing the native bar (~42px) */
           .addClass('gra-fab-visible gra-fab-mobile-docked');
      if (rect.bottom + fabH + 22 > window.innerHeight) {
        top = rect.top + window.scrollY - fabH - 56;
      }
      top  = clamp(top,  window.scrollY + 8, window.scrollY + window.innerHeight - fabH - 8);
      left = clamp(left, 8, window.innerWidth - fabW - 8);
       $fab.css({ position: 'absolute', top: '108' + 'px', left: '20%' })
           .addClass('gra-fab-visible');
       return;
       return;
     }
     }
Line 267: Line 264:
   }
   }


   function hideFab() { $fab.removeClass('gra-fab-visible'); }
   function hideFab() { $fab.removeClass('gra-fab-visible gra-fab-mobile-docked'); }
   function hideActions() { hideFab(); }
   function hideActions() { hideFab(); }


Line 647: Line 644:
       else if (q) { $(document).trigger($.Event('keydown', {ctrlKey:true, key:'k', keyCode:75})); }
       else if (q) { $(document).trigger($.Event('keydown', {ctrlKey:true, key:'k', keyCode:75})); }
     });
     });
    /* ── Dismiss button: hide toolbar + clear selection (mobile) ── */
    (function () {
      var dismissEl = document.getElementById('gra-fab-dismiss');
      if (!dismissEl) return;
      function doDismiss(e) {
        e.preventDefault(); e.stopPropagation();
        hideActions();
        _selRange = null; _selText = ''; _selRect = null;
        if (window.getSelection) {
          var s = window.getSelection();
          if (s && s.removeAllRanges) s.removeAllRanges();
        }
      }
      dismissEl.addEventListener('touchend', doDismiss, { passive: false });
      dismissEl.addEventListener('click', doDismiss);
    }());


     /* Feedback composer */
     /* Feedback composer */
Retrieved from "https://anandamakaranda.in/MediaWiki:Gadget-GrAnnotations.js"