Advertisement
Guest User

Context.js Patch ctrlClick Safari

a guest
Jan 17th, 2015
775
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /*
  2.  * Context.js
  3.  * Copyright Jacob Kelley
  4.  * MIT License
  5.  * Safari ctrl-click patch – http://stackoverflow.com/a/27973894/3702797
  6.  */
  7.  
  8. var context = context || (function () {
  9.    
  10.     var options = {
  11.         fadeSpeed: 100,
  12.         filter: function ($obj) {
  13.             // Modify $obj, Do not return
  14.         },
  15.         above: 'auto',
  16.         preventDoubleContext: true,
  17.         compress: false
  18.     };
  19.  
  20.     function initialize(opts) {
  21.        
  22.         options = $.extend({}, options, opts);
  23.        
  24. $(document).on('click', 'html', function (e) {
  25.     if(e.ctrlKey)return;
  26.     $('.dropdown-context').fadeOut(options.fadeSpeed, function(){
  27.         $('.dropdown-context').css({display:''}).find('.drop-left').removeClass('drop-left');
  28.     });
  29. });
  30.         if(options.preventDoubleContext){
  31.             $(document).on('contextmenu', '.dropdown-context', function (e) {
  32.                 e.preventDefault();
  33.             });
  34.         }
  35.         $(document).on('mouseenter', '.dropdown-submenu', function(){
  36.             var $sub = $(this).find('.dropdown-context-sub:first'),
  37.                 subWidth = $sub.width(),
  38.                 subLeft = $sub.offset().left,
  39.                 collision = (subWidth+subLeft) > window.innerWidth;
  40.             if(collision){
  41.                 $sub.addClass('drop-left');
  42.             }
  43.         });
  44.        
  45.     }
  46.  
  47.     function updateOptions(opts){
  48.         options = $.extend({}, options, opts);
  49.     }
  50.  
  51.     function buildMenu(data, id, subMenu) {
  52.         var subClass = (subMenu) ? ' dropdown-context-sub' : '',
  53.             compressed = options.compress ? ' compressed-context' : '',
  54.             $menu = $('<ul class="dropdown-menu dropdown-context' + subClass + compressed+'" id="dropdown-' + id + '"></ul>');
  55.         var i = 0, linkTarget = '';
  56.         for(i; i<data.length; i++) {
  57.             if (typeof data[i].divider !== 'undefined') {
  58.                 $menu.append('<li class="divider"></li>');
  59.             } else if (typeof data[i].header !== 'undefined') {
  60.                 $menu.append('<li class="nav-header">' + data[i].header + '</li>');
  61.             } else {
  62.                 if (typeof data[i].href == 'undefined') {
  63.                     data[i].href = '#';
  64.                 }
  65.                 if (typeof data[i].target !== 'undefined') {
  66.                     linkTarget = ' target="'+data[i].target+'"';
  67.                 }
  68.                 if (typeof data[i].subMenu !== 'undefined') {
  69.                     $sub = ('<li class="dropdown-submenu"><a tabindex="-1" href="' + data[i].href + '">' + data[i].text + '</a></li>');
  70.                 } else {
  71.                     $sub = $('<li><a tabindex="-1" href="' + data[i].href + '"'+linkTarget+'>' + data[i].text + '</a></li>');
  72.                 }
  73.                 if (typeof data[i].action !== 'undefined') {
  74.                     var actiond = new Date(),
  75.                         actionID = 'event-' + actiond.getTime() * Math.floor(Math.random()*100000),
  76.                         eventAction = data[i].action;
  77.                         console.log(eventAction);
  78.                     $sub.find('a').attr('id', actionID);
  79.                     $('#' + actionID).addClass('context-event');
  80.                     $(document).on('click', '#' + actionID, eventAction);
  81.                 }
  82.                 $menu.append($sub);
  83.                 if (typeof data[i].subMenu != 'undefined') {
  84.                     var subMenuData = buildMenu(data[i].subMenu, id, true);
  85.                     $menu.find('li:last').append(subMenuData);
  86.                 }
  87.             }
  88.             if (typeof options.filter == 'function') {
  89.                 options.filter($menu.find('li:last'));
  90.             }
  91.         }
  92.         return $menu;
  93.     }
  94.  
  95.     function addContext(selector, data) {
  96.        
  97.         var d = new Date(),
  98.             id = d.getTime(),
  99.             $menu = buildMenu(data, id);
  100.            
  101.         $('body').append($menu);
  102.        
  103.        
  104.         $(document).on('contextmenu', selector, function (e) {
  105.             e.preventDefault();
  106.             e.stopPropagation();
  107.            
  108.             $('.dropdown-context:not(.dropdown-context-sub)').hide();
  109.            
  110.             $dd = $('#dropdown-' + id);
  111.             if (typeof options.above == 'boolean' && options.above) {
  112.                 $dd.addClass('dropdown-context-up').css({
  113.                     top: e.pageY - 20 - $('#dropdown-' + id).height(),
  114.                     left: e.pageX - 13
  115.                 }).fadeIn(options.fadeSpeed);
  116.             } else if (typeof options.above == 'string' && options.above == 'auto') {
  117.                 $dd.removeClass('dropdown-context-up');
  118.                 var autoH = $dd.height() + 12;
  119.                 if ((e.pageY + autoH) > $('html').height()) {
  120.                     $dd.addClass('dropdown-context-up').css({
  121.                         top: e.pageY - 20 - autoH,
  122.                         left: e.pageX - 13
  123.                     }).fadeIn(options.fadeSpeed);
  124.                 } else {
  125.                     $dd.css({
  126.                         top: e.pageY + 10,
  127.                         left: e.pageX - 13
  128.                     }).fadeIn(options.fadeSpeed);
  129.                 }
  130.             }
  131.         });
  132.     }
  133.    
  134.     function destroyContext(selector) {
  135.         $(document).off('contextmenu', selector).off('click', '.context-event');
  136.     }
  137.    
  138.     return {
  139.         init: initialize,
  140.         settings: updateOptions,
  141.         attach: addContext,
  142.         destroy: destroyContext
  143.     };
  144. })();
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement