Преобразование JavaScript в usercript

Question

У меня есть JavaScript, выполняющий вызовы ajax на сервер.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
<script type="text/javascript"> 

    var div = '<div id="OverlayDialog">'; 
    $.Coral = function (options) { 
     $.extend(options, { 
      data: JSON.stringify(options.data), 
      dataType: 'json', 
      type: 'POST', 
      async: false, 
      contentType: 'application/json', 
      processData: false, 
      headers: { 
       'Content-Encoding': 'abc', 
       'Target': options.operation 
      }, 

      dataFilter: function(data, type) { 
       return data || "{}"; 
      } 
     }); 
     return $.ajax(options); 
    }; 

    $.MyService = function (options) { 
     $.extend(options, { 
      url: "link to myservice", 
      operation: 'dummyOperation' 
     }); 
     return $.Coral(options); 
    }; 

    function test() { 

     try { 
      var myOptionsData = { 
       storeUrlList: [document.getElementById('normalizedStoreUrl1').value,document.getElementById('normalizedStoreUrl2').value] 
      }; 
      var myOptions = {data: myOptionsData,crossDomain: true}; 
      response = $.MyService(myOptions).responseText; 
      var subString = ""; 
      var startIndex = response.indexOf('{',1); 
      var endIndex = response.lastIndexOf('}'); 
      responseText = response.substring(startIndex,endIndex); 
      var subString = JSON.parse(responseText); 
      var map2 = new Map(); 
      $.each(subString, function(key, value) { 
       var map1 = new Map(); 
       div+='<p>'+JSON.stringify(key)+'</p>'; 
       $.each(value, function(ky, val) { 
        console.log('ky => '+ky); 
        console.log('val => '+val); 
        map1.set(ky, val); 
        div += '<p>'+JSON.stringify(ky)+':'+JSON.stringify(val)+'</p>'; 
        }); 

       }); 
     } catch(e) { 
      alert(e); 
     } 
     div += '</div>'; 
     $('body').append(div); 
     return false; 
    } 

</script> 

Сценарий работает отлично для меня. Я хочу преобразовать это в скрипт greasemonkey, показывая результаты в отдельном диалоговом окне, используя диалог jqueryUI. Часть создания оверлейного диалога и записи данных в него отлично работает, но я не могу выполнять функции $ MyOptions и. $ Coral в пользовательском языке.

Ниже это userScript я использую:

// ==UserScript== 
// @name  Get Data for each unique URL 
// @namespace SellerSupportScript 
// @include  * 
// @require  http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js 
// @require  http://ajax.googleapis.com/ajax/libs/jquery/ui/1.11.0/jquery-ui.min.js 
// @resource jqUI_CSS http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/themes/redmond/jquery-ui.css 
// @grant  GM_addStyle 
// @grant  GM_getResourceText 
// @grant  GM_getResourceURL 
// @run-at  document-end 
// allow pasting 
// ==/UserScript== 

var snapshotResults = document.evaluate('//a[contains(@href,"http")]/@href', document, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null); 
var windowWidth = $(window).width()-800; 
var windowHeight = 'auto'; 
var div = '<div id="SSOverlayDialog">'; 

var zNode = document.createElement ('input'); 
zNode.setAttribute ('id', 'SSButton'); 
zNode.setAttribute('type', 'image'); 
zNode.setAttribute('src', 'http://www.veryicon.com/icon/64/System/Longhorn%20R2/Back%20Button.png'); 

document.body.appendChild (zNode); 

var uniqueHostnameSet = new Set(); 
var uniqueURLArray = []; 
uniqueHostnameSet.add(window.location.hostname); 
var finalUrl = window.location.protocol + '//' + window.location.hostname; 
uniqueURLArray.push(finalUrl); 
var linkToDisplay = '<a href="' + finalUrl + '">' + finalUrl + '</a>'; 
linkToDisplay += '<br/><br/>'; 
div += linkToDisplay; 
for (var iterate = 0; iterate < snapshotResults.snapshotLength; iterate++) 
{ 
    var hrefContent = snapshotResults.snapshotItem(iterate).textContent; 
    var regex = /http.*/; 
    var href = regex.exec(hrefContent); 
    var a = document.createElement('a'); 
    a.href = href; 
    if (!uniqueHostnameSet.has(a.hostname)) 
    { 
    uniqueHostnameSet.add(a.hostname); 
    finalUrl = a.protocol + '//' + a.hostname; 
    uniqueURLArray.push(finalUrl); 
    linkToDisplay = '<a href="' + finalUrl + '">' + finalUrl + '</a>'; 
    linkToDisplay += '<br/><br/>'; 
    div += linkToDisplay; 
    } 
} 

var size = 10; 
for (var i=0; i<uniqueURLArray.length; i+=size) { 
    var urlList = uniqueURLArray.slice(i,i+size); 
    try { 
     var myOptionsData = { 
      storeUrlList: urlList 
     }; 
     var myOptions = {data: myOptionsData,crossDomain: true}; 
     response = $.MyService(myOptions).responseText; 
     var subString = ""; 
     var startIndex = response.indexOf('{',1); 
     var endIndex = response.lastIndexOf('}'); 
     responseText = response.substring(startIndex,endIndex); 
     var subString = JSON.parse(responseText); 
     var AttributeMap = {}; 
     var map2 = new Map(); 
     $.each(subString, function(key, value) { 
      var map1 = new Map(); 
      div+='<p>'+JSON.stringify(key)+'</p>'; 
      $.each(value, function(ky, val) { 
       console.log('ky => '+ky); 
       console.log('val => '+val); 
       map1.set(ky, val); 
       div += '<p>'+JSON.stringify(ky)+'->'+JSON.stringify(val)+'</p>'; 
       div += '<br/><br/>' 
       }); 
      map2.set(key, map1); 
      }); 
     } catch(e) { 
     alert(e); 
     } 

} 
div += '</div>'; 
$('body').append(div); 

$('#mobiusSSOverlayDialog').dialog({ 

    autoOpen: false, 
    modal: false, 
    title: 'Unique URLs on Page (press "Esc" button to close)', 
    position: { 
    at: 'right top' 
    }, 
    width: windowWidth, 
    height: windowHeight, 
    zIndex: 11111111, 
    buttons: [ 
    { 
     text: 'Close', 
     click: function() { 
     $(this).dialog('close'); 
     } 
    } 
    ] 
}); 

//} 
$("#SSButton").click(function() { 

    ($("#SSOverlayDialog").dialog("isOpen") == false) ? $("#SSOverlayDialog").dialog("open") : $("#SSOverlayDialog").dialog("close") ; 
}); 

var jqUI_CssSrc = GM_getResourceText('jqUI_CSS'); 
jqUI_CssSrc = jqUI_CssSrc.replace(/\.ui-front \{[\s]*z-index:\s100\;[\s]*\}/g,".ui-front \{\n z-index: 10000000 \; \n\}"); 
GM_addStyle(jqUI_CssSrc); 
//--- Style our newly added elements using CSS. 
GM_addStyle (multilineStr (function() {/*! 
    #SSButton { 
    background-repeat: no-repeat; 
    position: absolute; 
    top: 50%; 
    right: 0; 
    z-index: 22222222; 
    width: 40px; 
    height: 40px; 
} 
*/})); 

function multilineStr (dummyFunc) { 
    var str = dummyFunc.toString(); 
    str  = str.replace (/^[^\/]+\/\*!?/, '') // Strip function() { /*! 
      .replace (/\s*\*\/\s*\}\s*$/, '') // Strip */ } 
      .replace (/\/\/.+$/gm, '') // Double-slash comments wreck CSS. Strip them. 
      ; 
    return str; 
} 

$.Coral = function (options) { 
     $.extend(options, { 
      data: JSON.stringify(options.data), 
      dataType: 'json', 
      type: 'POST', 
      async: false, 
      contentType: 'application/json', 
      processData: false, 
      headers: { 
       'Content-Encoding': 'abc', 
       'Target': options.operation 
      }, 

      dataFilter: function(data, type) { 
       return data || "{}"; 
      } 
     }); 
     return $.ajax(options); 
    }; 

    $.MyService = function (options) { 
     $.extend(options, { 
      url: "link to myservice", 
      operation: 'dummyOperation' 
     }); 
     return $.Coral(options); 
    }; 

Я получаю следующее сообщение об ошибке в окне предупреждения:

TypeError: $.MyService is not a function

Может кто-то помочь, как это преодолеть?

Я искал проблему с помощью stackoverflow, но не смог найти предыдущий вопрос, относящийся к этому вопросу.

Answer 1

Вы звоните $.MyService(), прежде чем определять его в конце. Функция объявлена ​​как

var functionName = function() {...

определяется только для кода после него в объеме, в то время как функция объявлена ​​как

function functionName() {...

определяется для всего кода в том же объеме.