Greasy Fork 还支持 简体中文。

More UI part4

The fourth part to The GT UI+

  1. // ==UserScript==
  2. // @name More UI part4
  3. // @namespace http://use.i.E.your.homepage/
  4. // @version v1.0.2.1
  5. // @description The fourth part to The GT UI+
  6. // @match http://www.ghost-trappers.com/fb/*
  7. // @copyright 2015+, GTNoAPI
  8. // @grant GM_xmlhttpRequest
  9. // ==/UserScript==
  10.  
  11. initUIv4();
  12.  
  13. function initUIv4(){
  14. var word_container = $('.wordsWithGhostsContainer').css({
  15. 'position': 'relative',
  16. 'cursor': 'pointer'
  17. });
  18. var form = $('<form></form>').css({
  19. 'width':'187px',
  20. 'position': 'absolute',
  21. 'top': '84px',
  22. 'left': '0px',
  23. 'display':'none',
  24. 'background-color': '#fff',
  25. 'padding': '5px'
  26. });
  27. var word = $('.campWordsWithGhostsChar').html();
  28. $('.campWordsWithGhostsChar')[0].addEventListener('click', function(){
  29. if(form.css('display') == 'none'){
  30. form.show();
  31. }
  32. else{
  33. form.hide();
  34. }
  35. });
  36. ($('<div class="form-group"></div>')
  37. .append($('<label>types (max 3 choices):</label>'))
  38. .append($('<select class="ghost-type" multiple></select>').css({'width':'100%','border': '1px solid rgb(34, 34, 34)'})
  39. .append('<option value="Normal">Normal</option>')
  40. .append('<option value="Midnight">Midnight</option>')
  41. .append('<option value="Alien">Alien</option>')
  42. .append('<option value="Party">Party</option>')
  43. .append('<option value="Rhombus red">Rhombus red</option>')
  44. .append('<option value="Gaussgreen">Gaussgreen</option>')
  45. .append('<option value="Ultraviolet">Ultraviolet</option>')
  46. .append('<option value="Infrayellow">Infrayellow</option>')
  47. .append('<option value="Nightmare">Nightmare</option>')
  48. .append('<option value="Special">Special</option>')
  49. .append('<option value="Minion">Minion</option>')
  50. .append('<option value="Boss">Boss</option>')
  51. .append('<option value="Mystic-resistant">Mystic-resistant</option>')
  52. .append('<option value="Monster">Monster</option>')
  53. .append('<option value="Brute force">Brute force</option>')
  54. .append('<option value="Gift">Gift</option>')
  55. .append('<option value="Vintage">Vintage</option>')
  56. )
  57. .append($('<label>location:</label>'))
  58. .append($('<select class="ghost-location"></select>').css({'width':'100%','border': '1px solid rgb(34, 34, 34)'})
  59. .append('<option value="All regions">All regions</option>')
  60. .append('<option value="Alien visitors">Alien visitors</option>')
  61. .append('<option value="Region 1: Dumfries and Galloway">Region 1: Dumfries and Galloway</option>')
  62. .append('<option value="Region 2: Borders">Region 2: Borders</option>')
  63. .append('<option value="Region 3: Strathclyde">Region 3: Strathclyde</option>')
  64. .append('<option value="Region 4: Lothian">Region 4: Lothian</option>')
  65. .append('<option value="Region 5: Fife">Region 5: Fife</option>')
  66. .append('<option value="Region 6: Central">Region 6: Central</option>')
  67. ))
  68. .appendTo(form);
  69. ($('<div class="form-group"></div>').append($('<a class="filter">filter</a>').css({
  70. 'padding': '5px 12px',
  71. 'background-color': 'rgb(34, 51, 65)',
  72. 'border': '1px solid rgb(34, 34, 34)',
  73. 'text-decoration': 'none',
  74. 'color': 'white',
  75. 'text-transform':' uppercase',
  76. 'font-weight': 'bold',
  77. 'display': 'inline-block',
  78. 'margin-top': '20px'
  79. }))).appendTo(form);
  80. form.appendTo(word_container);
  81. $('.form-group').css({
  82. 'font-size': '16px',
  83. 'float':'left'
  84. });
  85. var button = $('.form-group').find('.filter');
  86. button[0].addEventListener('click', function(){
  87. var types = $(".ghost-type");
  88. var filter = [];
  89. var url = 'https://gtnoapi.herokuapp.com/api/ghosts/search?';
  90. var length = 0;
  91. for(var x = 0; x < types.length; x++){
  92. var input = $(types[x]).find('option');
  93. filter = [];
  94. var count = 0;
  95. for(var y = 0; y < input.length; y++){
  96. if($(input[y]).attr('selected')){
  97. if(length == 0){
  98. url += 'type'+(count+1) +'='+ $(input[y]).val();
  99. }
  100. else{
  101. url += '&type'+(count+1) +'='+ $(input[y]).val();
  102. }
  103. length++;
  104. count++;
  105. }
  106. }
  107. }
  108. var types = $(".ghost-location");
  109. for(var x = 0; x < types.length; x++){
  110. var input = $(types[x]).find('option');
  111. filter = [];
  112. var count = 0;
  113. for(var y = 0; y < input.length; y++){
  114. if($(input[y]).attr('selected')){
  115. if(length == 0){
  116. url += 'location'+(count+1) +'='+ $(input[y]).val();
  117. }
  118. else{
  119. url += '&location'+(count+1) +'='+ $(input[y]).val();
  120. }
  121. length++;
  122. count++;
  123. }
  124. }
  125. }
  126. GM_xmlhttpRequest({
  127. method: 'GET',
  128. url: url,
  129. headers: {
  130. "Accept": "application/json",
  131. "Pragma": "no-cache",
  132. "Cache-Control": "no-cache"
  133. },
  134. onload: function(rD) {
  135. if($('.popup-moreUIv4-result').length > 0){
  136. $('.popup-moreUIv4-result').remove();
  137. }
  138. $('.campWordsWithGhostsChar').css('color', '#223341');
  139. var childEle = $('<div class="popup-moreUIv4-result"></div>').css({
  140. 'position': 'absolute',
  141. 'top': '0',
  142. 'right': '120px',
  143. 'z-index': '9999999',
  144. 'font-size': '14px',
  145. 'display': 'none',
  146. 'background-color': '#223341',
  147. 'border': '1px solid #222',
  148. 'border-radius': '7px',
  149. 'padding': '10px',
  150. 'width':'400px'
  151. });
  152. var db = getGhostFromDB(rD.response);
  153. for(var x = 0; x< db.length; x++){
  154. if(db[x].name.indexOf(word) == 0){
  155. ($('<div></div>').css('color', 'white').html(db[x].name + ': ' +(db[x].location[1]? ' ' + db[x].location[1]:'')+(db[x].location[2]? ', ' + db[x].location[2]:''))).appendTo(childEle);
  156. }
  157. }
  158. childEle.appendTo(word_container);
  159. $('.campWordsWithGhostsChar').hover(function(){
  160. if($(childEle).css('display')=='none'){
  161. $(childEle).show();
  162. $(this).css('color', '#fff');
  163. }
  164. else{
  165. $(childEle).hide();
  166. $(this).css('color', 'inherit');
  167. }
  168. });
  169. }
  170. });
  171. });
  172. }
  173.  
  174. function getGhostFromDB(jsonTxt){
  175. var obj = jQuery.parseJSON(jsonTxt);
  176. var result = [];
  177. for(var x = 0; x < obj.length; x++){
  178. result.push({
  179. 'name':obj[x].name,
  180. 'location':obj[x].location,
  181. 'type':obj[x].type,
  182. 'loot':obj[x].loot,
  183. })
  184. }
  185. return result;
  186. }