☰

Search By Image

Search By Image | 以图搜图

  1. // ==UserScript==
  2. // @name        Search By Image
  3. // @version     1.6.9
  4. // @description Search By Image | 以图搜图
  5. // @match       <all_urls>
  6. // @include     *
  7. // @author      864907600cc
  8. // @icon        http://1.gravatar.com/avatar/147834caf9ccb0a66b2505c753747867
  9. // @run-at      document-start
  10. // @grant       GM.getValue
  11. // @grant       GM.setValue
  12. // @grant       GM.openInTab
  13. // @grant       GM.registerMenuCommand
  14. // @grant       GM_getValue
  15. // @grant       GM_setValue
  16. // @grant       GM_openInTab
  17. // @grant       GM_registerMenuCommand
  18. // @namespace   http://ext.ccloli.com
  19. // ==/UserScript==
  20.  
  21.  
  22. // 本脚本基于 GPLv3 协议开源 http://www.gnu.org/licenses/gpl.html
  23. // (c) 86497600cc. Some Rights Reserved.
  24. // Default setting: Press Ctrl and click right key on a image to search.
  25.  
  26. 'use strict';
  27. var default_setting = {
  28. 	"site_list": {
  29. 		"Google": "https://lens.google.com/uploadbyurl?url={%s}",
  30. 		"Baidu": "https://graph.baidu.com/details?isfromtusoupc=1&tn=pc&carousel=0&promotion_name=pc_image_shituindex&extUiData%5bisLogoShow%5d=1&image={%s}",
  31. 		"Bing": "https://www.bing.com/images/searchbyimage?cbir=sbi&iss=sbi&imgurl={%s}",
  32. 		"TinEye": "https://www.tineye.com/search?url={%s}",
  33. 		//"Cydral": "http://www.cydral.com/#url={%s}",
  34. 		"Yandex": "https://yandex.com/images/search?rpt=imageview&url={%s}", // change "Яндекс (Yandex)" to "Yandex"
  35. 		"Sogou": "https://pic.sogou.com/ris?query=https%3A%2F%2Fimg03.sogoucdn.com%2Fv2%2Fthumb%2Fretype_exclude_gif%2Fext%2Fauto%3Fappid%3D122%26url%3D{%ss}&flag=1&drag=0",
  36. 		"360 ShiTu": "http://st.so.com/stu?imgurl={%s}",
  37. 		"SauceNAO": "https://saucenao.com/search.php?db=999&url={%s}",
  38. 		"IQDB": "https://iqdb.org/?url={%s}",
  39. 		"3D IQDB": "https://3d.iqdb.org/?url={%s}",
  40. 		"WhatAnime": "https://trace.moe/?url={%s}",
  41. 		"Ascii2D": "https://ascii2d.net/search/url/{%s}"
  42. 	},
  43. 	"site_option": ["Google", "Baidu", "Bing", "TinEye", "Yandex", "Sogou", "360 ShiTu", "SauceNAO", "IQDB", "3D IQDB", "WhatAnime", "Ascii2D"],
  44. 	"hot_key": "ctrlKey",
  45. 	"server_url": "//sbi.ccloli.com/img/upload.php"
  46. };
  47.  
  48. /*var server_url = "//sbi.ccloli.com/img/upload.php";*/
  49. // 请直接在设置页进行设置（Firefox 请尽量选择支持 https 的服务器）
  50. // 地址前使用"//"表示按照当前页面设定决定是否使用 https
  51. // 地址前使用"http://"表示强制使用 http
  52. // 地址前使用"https://"表示强制使用 https（需确认服务器支持 ssl）
  53. // 如果需要自己架设上传服务器的话请访问 GitHub 项目页（https://github.com/ccloli/Search-By-Image）获取服务端
  54. // 其他可用的上传服务器如下：
  55. // Heroku: //search-by-image.herokuapp.com/img/upload.php （支持 https）
  56. // BeGet: http://fh13121a.bget.ru/img/upload.php （不支持 https）
  57. // OpenShift: //searchbyimage-864907600cc.rhcloud.com/img/upload.php （支持 https）
  58. // DigitalOcean VPS: //sbi.ccloli.com/img/upload.php （支持 https，thanks to Retaker）
  59. // 注意，部分服务器可能仅支持 http 协议，若您选择了这些服务器，请务必注明 "http://"，且若您使用的是 Firefox 浏览器，在 https 页面下将不能上传文件搜索搜索（除非设置 security.mixed_content.block_active_content 为 false）
  60.  
  61. var search_panel = null;
  62. var setting = default_setting;
  63. var disable_contextmenu = false;
  64. var img_src = null;
  65. var data_version = 0;
  66. var last_update = 0;
  67. var xhr = new XMLHttpRequest();
  68. var reader = new FileReader();
  69. reader.onload = function(file) {
  70. 	upload_file(this.result);
  71. };
  72. var asyncGMAPI = false;
  73.  
  74. var i18n = {
  75. 	'zh': {
  76. 		'u2s': '上传图片并搜索',
  77. 		'dh': '拖拽文件至此',
  78. 		'ca': '确认终止上传文件吗？',
  79. 		'a': '多搜',
  80. 		'n': '名称',
  81. 		'l': '地址（图片地址以 {%s} 代替）',
  82. 		'cr': '确定将所有设置初始化么？\n(初始化将清除所有所有设置，且不可逆)',
  83. 		'us': '上传完成！',
  84. 		'uf': '上传失败！',
  85. 		'sh': '热键',
  86. 		'sa': '添加',
  87. 		'sr': '重置',
  88. 		'ss': '保存',
  89. 		'sc': '取消'
  90. 	},
  91. 	'en': {
  92. 		'u2s': 'Upload image to search',
  93. 		'dh': 'Drag file to here',
  94. 		'ca': 'Are you sure to cancel uploading?',
  95. 		'a': 'All',
  96. 		'n': 'Name',
  97. 		'l': 'Location (Image URL should be replace with {%s})',
  98. 		'cr': 'Are you sure to reset all preferences (irreversible) ?',
  99. 		'us': 'Upload finished!',
  100. 		'uf': 'Upload failed!',
  101. 		'sh': 'Hot Key',
  102. 		'sa': 'Add',
  103. 		'sr': 'Reset',
  104. 		'ss': 'Save',
  105. 		'sc': 'Cancel'
  106. 	}
  107. };
  108. var lang = i18n[navigator.language] ? navigator.language : navigator.languages ? navigator.languages.filter(function(elem){
  109. 	return i18n[elem];
  110. })[0] : null;
  111. if (lang == null) lang = 'en';
  112.  
  113. var getValue;
  114. if (typeof GM_getValue === 'undefined' && typeof GM !== 'undefined') {
  115. 	self.GM_getValue = GM.getValue;
  116. 	self.GM_setValue = GM.setValue;
  117. 	self.GM_openInTab = GM.openInTab;
  118. 	self.GM_registerMenuCommand = GM.registerMenuCommand;
  119. 	getValue = GM.getValue;
  120. 	asyncGMAPI = true;
  121. }
  122. else {
  123. 	getValue = function(key, init) {
  124. 		return new Promise(function(resolve, reject){
  125. 			try {
  126. 				resolve(GM_getValue(key, init));
  127. 			}
  128. 			catch(e) {
  129. 				reject(e);
  130. 			}
  131. 		});
  132. 	};
  133. }
  134.  
  135. function init() {
  136. 	return Promise.all([getValue('setting'), GM_getValue('version', 0), GM_getValue('timestamp', 0)]).then(function(res) {
  137. 		var s = res[0], v = res[1], t = res[2];
  138. 		setting = s ? JSON.parse(s) : default_setting;
  139. 		data_version = v;
  140. 		last_update = t;
  141. 		var cur = 9;
  142.  
  143. 		var applyMap = {
  144. 			3: function () {
  145. 				var new_site_list = {};
  146. 				var new_site_option = [];
  147.  
  148. 				for (var i in setting.site_list) {
  149. 					// use for loop to keep order, will use array in 2.x
  150. 					switch (i) {
  151. 						case 'Baidu ShiTu':
  152. 						case 'Baidu Image':
  153. 							new_site_list['Baidu'] = default_setting.site_list['Baidu'];
  154. 							break;
  155.  
  156. 						case 'Bing':
  157. 						case 'Sogou':
  158. 							new_site_list[i] = default_setting.site_list[i];
  159. 							break;
  160.  
  161. 						default:
  162. 							new_site_list[i] = setting.site_list[i];
  163. 					}
  164. 				}
  165. 				new_site_list['WhatAnime'] = default_setting.site_list['WhatAnime'];
  166.  
  167. 				for (var i = 0; i < setting.site_option.length; i++) {
  168. 					if ((setting.site_option[i] === 'Baidu ShiTu' || setting.site_option[i] === 'Baidu Image') && !(/,?Baidu,?/.test(new_site_option.join(',')))) {
  169. 						new_site_option.push('Baidu');
  170. 					}
  171. 					else {
  172. 						new_site_option.push(setting.site_option[i]);
  173. 					}
  174. 				}
  175. 				new_site_option.push('WhatAnime');
  176.  
  177. 				setting.site_list = new_site_list;
  178. 				setting.site_option = new_site_option;
  179. 			},
  180. 			4: function () {
  181. 				setting.site_list['Ascii2D'] = default_setting.site_list['Ascii2D'];
  182. 				setting.site_option.push('Ascii2D');
  183. 			},
  184. 			5: function () {
  185. 				if (setting.site_list['WhatAnime']) {
  186. 					setting.site_list['WhatAnime'] = default_setting.site_list['WhatAnime'];
  187. 				}
  188. 			},
  189. 			6: function () {
  190. 				if (setting.site_list['Baidu']) {
  191. 					setting.site_list['Baidu'] = default_setting.site_list['Baidu'];
  192. 				}
  193. 			},
  194. 			7: function () {
  195. 				if (setting.site_list['Yandex']) {
  196. 					setting.site_list['Yandex'] = default_setting.site_list['Yandex'];
  197. 				}
  198. 			},
  199. 			8: function () {
  200. 				if (setting.site_list['Google']) {
  201. 					setting.site_list['Google'] = default_setting.site_list['Google'];
  202. 				}
  203. 				if (setting.site_list['Sogou']) {
  204. 					setting.site_list['Sogou'] = default_setting.site_list['Sogou'];
  205. 				}
  206. 			}
  207. 		}
  208.  
  209. 		if (data_version < cur) {
  210. 			for (var i = data_version; i < cur; i++) {
  211. 				if (applyMap[i]) {
  212. 					applyMap[i]();
  213. 				}
  214. 			}
  215. 			set_setting(setting);
  216. 			GM_setValue('version', data_version = cur);
  217. 		}
  218.  
  219. 		var repeatTest = {};
  220. 		var finalOpt = [];
  221. 		for (var i = 0, len = setting.site_option.length; i < len; i++) {
  222. 			var cur = setting.site_option[i];
  223. 			if (!repeatTest[cur] && setting.site_list[cur]) {
  224. 				finalOpt.push(cur);
  225. 				repeatTest[cur] = 1;
  226. 			}
  227. 		}
  228. 		setting.site_option = finalOpt;
  229.  
  230. 		if (setting.server_url == null || setting.server_url == '') {
  231. 			setting.server_url = default_setting.server_url;
  232. 			set_setting(setting);
  233. 		}
  234. 	});
  235. }
  236.  
  237. var server_url = setting.server_url;
  238.  
  239. function set_setting(data) {
  240. 	GM_setValue('setting', JSON.stringify(data));
  241. 	GM_setValue('timestamp', new Date().getTime());
  242. }
  243.  
  244. function create_panel() {
  245. 	search_panel = document.createElement('div');
  246. 	search_panel.style.cssText = 'width: 198px; font-size: 14px; text-align: center; position: absolute; color: #000; z-index: 9999999999; box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5); border: 1px solid #CCC; background: rgba(255, 255, 255, 0.9); border-top-right-radius: 2px; border-bottom-left-radius: 2px; font-family: "Arial"; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;';
  247. 	document.body.appendChild(search_panel);
  248. 	var search_top = document.createElement('div');
  249. 	search_top.style.cssText = 'height: 24px; line-height: 24px; font-size: 12px; overflow: hidden; margin: 0 auto; padding: 0 5px;';
  250. 	search_top.className = 'image-search-top';
  251. 	search_top.innerHTML = '<div class="search_top_url" style="overflow: hidden; white-space: nowrap; text-overflow: ellipsis; width: 100%; height: 24px;"></div><div class="search_top_file" style="width: 100%; height: 24px; line-height: 24px;" draggable="true"><label for="image-search-file">' + i18n[lang]['u2s'] + '</label><input type="file" id="image-search-file" accept="image/*" style="width: 0px; height: 0px; max-height: 0px; max-width: 0px; margin: 0; padding: 0;"></div><div class="search_top_progress"><progress style="width: 100%; height: 16px; vertical-align: middle; margin: 4px 0;" max="1"></progerss></div><style>.image-search-item{color: #000000; transition: all 0.2s linear; -webkit-transition: all 0.1s linear;}.image-search-item:hover{background: #eeeeee;}</style>';
  252. 	search_panel.appendChild(search_top);
  253. 	var search_item = document.createElement('div');
  254. 	search_item.style.cssText = 'width: 100%; height: 24px; line-height: 24px; cursor: pointer;';
  255. 	search_item.className = 'image-search-item';
  256. 	for (var i in setting.site_list) {
  257. 		var search_item_child = search_item.cloneNode(true);
  258. 		search_item_child.textContent = i;
  259. 		search_item_child.setAttribute('search-option', i);
  260. 		search_panel.appendChild(search_item_child);
  261. 	}
  262. 	search_item.textContent = 'All';
  263. 	search_item.setAttribute('search-option', 'all');
  264. 	search_panel.appendChild(search_item);
  265. 	var search_item_setting = search_item.cloneNode(true);
  266. 	search_item_setting.textContent = 'Setting';
  267. 	search_item_setting.setAttribute('search-option', 'setting');
  268. 	search_panel.appendChild(search_item_setting);
  269. 	search_top.getElementsByTagName('input')[0].onchange = function() {
  270. 		reader.readAsDataURL(this.files[0]);
  271. 	};
  272. 	search_panel.ondragenter = function(event) {
  273. 		event.preventDefault();
  274. 		search_top.getElementsByTagName('label')[0].textContent = i18n[lang]['dh'];
  275. 	};
  276. 	search_panel.ondragleave = function(event) {
  277. 		event.preventDefault();
  278. 		search_top.getElementsByTagName('label')[0].textContent = i18n[lang]['u2s'];
  279. 	};
  280. 	search_panel.ondragover = function(event) {
  281. 		search_top.getElementsByTagName('label')[0].textContent = i18n[lang]['dh'];
  282. 		event.preventDefault();
  283. 	};
  284. 	search_panel.ondrop = function(event) {
  285. 		event.stopPropagation();
  286. 		event.preventDefault();
  287. 		var files = event.target.files || event.dataTransfer.files;
  288. 		if (files[files.length - 1].type.indexOf('image') >= 0) reader.readAsDataURL(files[files.length - 1]);
  289. 	};
  290. 	search_top.getElementsByTagName('progress')[0].onclick = function() {
  291. 		if (xhr.readyState != 0 && confirm(i18n[lang]['ca']) == true) {
  292. 			xhr.abort();
  293. 			search_panel.getElementsByClassName('search_top_url')[0].style.marginTop = '-24px';
  294. 		}
  295. 	};
  296. 	if (navigator.userAgent.indexOf('Firefox') >= 0) {
  297. 		var paste_node_firefox = document.createElement('div');
  298. 		paste_node_firefox.setAttribute('contenteditable', 'true');
  299. 		paste_node_firefox.className = 'image-search-paste-node-firefox';
  300. 		paste_node_firefox.style.cssText = 'width: 0!important; height: 0!important; position: absolute; overflow: hidden;';
  301. 		paste_node_firefox.addEventListener('paste', get_clipboard, false);
  302. 		search_top.appendChild(paste_node_firefox);
  303. 	}
  304. }
  305.  
  306. function call_setting() {
  307. 	var setting_panel = document.createElement('div');
  308. 	setting_panel.style.cssText = 'width: 520px; font-size: 14px; position: fixed; color: #000; z-index: 9999999999; box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5); border: 1px solid #CCC; background: rgba(255, 255, 255, 0.9); border-top-right-radius: 2px; border-bottom-left-radius: 2px; padding: 10px; left: 0; right: 0; top: 0; bottom: 0; margin: auto; font-family: "Arial"; height: 400px; max-height: 90%; overflow: auto; text-align: center; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;';
  309. 	document.body.appendChild(setting_panel);
  310. 	var setting_header = document.createElement('div');
  311. 	setting_header.style.cssText = 'width: 100%; height: 32px; line-height: 32px; font-size: 18px; line-height: 32px;';
  312. 	setting_header.className = 'image-search-setting-header';
  313. 	setting_header.textContent = 'Search By Image Setting';
  314. 	setting_panel.appendChild(setting_header);
  315. 	var setting_item = document.createElement('div');
  316. 	setting_item.style.cssText = 'width: 100%; height: 24px; line-height: 24px; margin: 1px 0;';
  317. 	setting_item.className = 'image-search-setting-title';
  318. 	setting_item.innerHTML = '<div style="text-align: center; display: inline-block; width: 30px;">' + i18n[lang]['a'] + '</div><div style="width: 100px; text-align: center; display: inline-block;">' + i18n[lang]['n'] + '</div><div style="width: 350px; text-align: center; display: inline-block;">' + i18n[lang]['l'] + '</div><div style="width: 20px; display: inline-block;"></div>';
  319. 	setting_panel.appendChild(setting_item);
  320. 	for (var i in setting.site_list) {
  321. 		var setting_item_child = setting_item.cloneNode(true);
  322. 		setting_item_child.className = 'image-search-setting-item';
  323. 		setting_item_child.innerHTML = '<div style="text-align: center; display: inline-block; width: 30px; vertical-align: middle;"><input type="checkbox"' + (setting.site_option.join('\n').indexOf(i) >= 0 ? ' checked="checked"' : '') + '></div><div style="width: 100px; text-align: center; display: inline-block;"><input style="width: 90px;" type="text" value="' + i + '"></div><div style="width: 350px; text-align: center; display: inline-block;"><input style="width: 340px;" type="text" value="' + setting.site_list[i] + '"></div><div style="text-align: center; display: inline-block; cursor: pointer; width: 20px;">×</div>';
  324. 		setting_panel.appendChild(setting_item_child);
  325. 		setting_item_child.getElementsByTagName('div')[3].onclick = function() {
  326. 			var parent = this.parentElement;
  327. 			parent.parentElement.removeChild(parent);
  328. 		};
  329. 	}
  330. 	var setting_server = document.createElement('div');
  331. 	setting_server.className = 'image-search-setting-server';
  332. 	setting_server.innerHTML = 'Upload Server <input type="text" value="' + setting['server_url'] + '" placeholder="//sbi.ccloli.com/img/upload.php" style="width: 350px;">';
  333. 	setting_panel.appendChild(setting_server);
  334. 	var setting_footer = document.createElement('div');
  335. 	setting_footer.style.cssText = 'width: 100%; height: 32px; line-height: 32px; margin-top: 5px; text-align: right;';
  336. 	setting_footer.className = 'image-search-setting-footer';
  337. 	setting_panel.appendChild(setting_footer);
  338. 	var setting_hotkey = document.createElement('div');
  339. 	var setting_add = document.createElement('div');
  340. 	var setting_reset = document.createElement('div');
  341. 	var setting_save = document.createElement('div');
  342. 	var setting_cancel = document.createElement('div');
  343. 	setting_hotkey.style.cssText = 'height: 32px; display: inline-block; text-align: left; float: left;';
  344. 	setting_add.style.cssText = 'width: 90px; height: 32px; margin: 0 5px; background: #666; color: #FFF; display: inline-block; text-align: center; cursor: pointer;';
  345. 	setting_reset.style.cssText = 'width: 90px; height: 32px; background: #666; color: #FFF; display: inline-block; text-align: center; cursor: pointer;';
  346. 	setting_save.style.cssText = 'width: 90px; height: 32px; margin: 0 5px; background: #666; color: #FFF; display: inline-block; text-align: center; cursor: pointer;';
  347. 	setting_cancel.style.cssText = 'width: 90px; height: 32px; background: #666; color: #FFF; display: inline-block; text-align: center; cursor: pointer;';
  348. 	setting_add.textContent = i18n[lang]['sa'];
  349. 	setting_reset.textContent = i18n[lang]['sr'];
  350. 	setting_save.textContent = i18n[lang]['ss'];
  351. 	setting_cancel.textContent = i18n[lang]['sc'];
  352. 	setting_hotkey.innerHTML = i18n[lang]['sh'] + ' <select><option value="ctrlKey"' + (setting.hot_key == 'ctrlKey' ? ' selected' : '') + '>Ctrl</option><option value="shiftKey"' + (setting.hot_key == 'shiftKey' ? ' selected' : '') + '>Shift</option><option value="altKey"' + (setting.hot_key == 'altKey' ? ' selected' : '') + '>Alt</option></select>';
  353. 	setting_footer.appendChild(setting_hotkey);
  354. 	setting_footer.appendChild(setting_add);
  355. 	setting_footer.appendChild(setting_reset);
  356. 	setting_footer.appendChild(setting_save);
  357. 	setting_footer.appendChild(setting_cancel);
  358. 	setting_add.onclick = function() {
  359. 		var setting_item_child = setting_item.cloneNode(true);
  360. 		setting_item_child.className = 'image-search-setting-item';
  361. 		setting_item_child.innerHTML = '<div style="text-align: center; display: inline-block; width: 30px; vertical-align: middle;"><input type="checkbox"></div><div style="width: 100px; text-align: center; display: inline-block;"><input style="width: 90px;" type="text"></div><div style="width: 350px; text-align: center; display: inline-block;"><input style="width: 340px;" type="text"></div><div style="text-align: center; display: inline-block; cursor: pointer; width: 20px;">×</div>';
  362. 		setting_panel.insertBefore(setting_item_child, setting_footer);
  363. 		setting_item_child.getElementsByTagName('div')[3].onclick = function() {
  364. 			var parent = this.parentElement;
  365. 			parent.parentElement.removeChild(parent);
  366. 		};
  367. 		setting_panel.scrollTop = setting_panel.scrollHeight;
  368. 	};
  369. 	setting_reset.onclick = function() {
  370. 		if (confirm(i18n[lang]['cr']) == true) {
  371. 			setting = default_setting;
  372. 			set_setting(setting);
  373. 			setting_panel.outerHTML = '';
  374. 			if (search_panel != null) {
  375. 				search_panel.parentElement && search_panel.parentElement.removeChild(search_panel);
  376. 				search_panel = null;
  377. 			}
  378. 			call_setting();
  379. 		}
  380. 	};
  381. 	setting_save.onclick = function() {
  382. 		var setting_items = document.getElementsByClassName('image-search-setting-item');
  383. 		var setting_data = {
  384. 			"site_list": {},
  385. 			"site_option": [],
  386. 			"hot_key": null,
  387. 			"server_url": null
  388. 		};
  389. 		for (var i = 0; i < setting_items.length; i++) {
  390. 			if (setting_items[i].getElementsByTagName('input')[1].value != '') {
  391. 				if (setting_items[i].getElementsByTagName('input')[0].checked) setting_data.site_option.push(setting_items[i].getElementsByTagName('input')[1].value);
  392. 				setting_data.site_list[setting_items[i].getElementsByTagName('input')[1].value] = setting_items[i].getElementsByTagName('input')[2].value;
  393. 			}
  394. 		}
  395. 		setting_data.hot_key = setting_hotkey.getElementsByTagName('select')[0].value;
  396. 		setting_data.server_url = document.getElementsByClassName('image-search-setting-server')[0].getElementsByTagName('input')[0].value;
  397. 		if (setting_data.server_url == null || setting_data.server_url == '') {
  398. 			setting_data.server_url = default_setting.server_url;
  399. 		}
  400. 		setting = setting_data;
  401. 		server_url = setting.server_url;
  402. 		set_setting(setting);
  403. 		document.body.removeChild(setting_panel);
  404. 		if (search_panel != null) {
  405. 			search_panel.parentElement && search_panel.parentElement.removeChild(search_panel);
  406. 			search_panel = null;
  407. 		}
  408. 	};
  409. 	setting_cancel.onclick = function() {
  410. 		document.body.removeChild(setting_panel);
  411. 	};
  412. }
  413.  
  414. function upload_file(data) {
  415. 	if (xhr.readyState != 0) xhr.abort();
  416. 	xhr.onreadystatechange = function() {
  417. 		if (xhr.readyState == 4) {
  418. 			if (xhr.status == 200) {
  419. 				img_src = xhr.responseText;
  420. 				search_panel.getElementsByClassName('search_top_url')[0].style.marginTop = '0px';
  421. 				search_panel.getElementsByClassName('search_top_url')[0].textContent = i18n[lang]['us'];
  422. 			}
  423. 		}
  424. 	};
  425. 	xhr.upload.onprogress = function(event) {
  426. 		search_panel.getElementsByTagName('progress')[0].value = event.loaded / event.total;
  427. 	};
  428. 	xhr.onerror = function() {
  429. 		alert(i18n[lang]['uf']);
  430. 	};
  431. 	var form = new FormData();
  432. 	xhr.open('POST', server_url);
  433. 	form.append('imgdata', data);
  434. 	xhr.send(form);
  435. 	search_panel.getElementsByClassName('search_top_url')[0].style.marginTop = '-48px';
  436. }
  437.  
  438. function get_clipboard(event) {
  439. 	var items = event.clipboardData.items;
  440. 	if (items[items.length - 1].type.indexOf('image') >= 0) reader.readAsDataURL(items[items.length - 1].getAsFile());
  441. }
  442.  
  443. function hide_panel() {
  444. 	if (!search_panel || !search_panel.parentElement) return;
  445. 	img_src = null;
  446. 	search_panel.parentElement && search_panel.parentElement.removeChild(search_panel); // Remove search panel to fix the bug that it may be left in some WYSIWYG editor (eg. MDN WYSIWYG editor). See issue: http://tieba.baidu.com/p/3682475061
  447. 	document.removeEventListener('paste', get_clipboard, false);
  448. }
  449.  
  450. function upload_blob_url(url) {
  451. 	if (!url) return;
  452. 	var req = new XMLHttpRequest();
  453. 	req.open('GET', url);
  454. 	req.responseType = 'blob';
  455. 	req.onload = function() {
  456. 		reader.readAsDataURL(req.response);
  457. 	};
  458. 	req.onerror = function() {
  459. 		alert(i18n[lang]['uf']);
  460. 	};
  461. 	req.send();
  462. }
  463.  
  464. document.addEventListener(document.onpointerdown === undefined ? 'mousedown' : 'pointerdown', function(event) {
  465. 	//console.log('Search Image >>\nevent.ctrlKey: '+event.ctrlKey+'\nevent.button: '+event.button+'\nevent.target:'+event.target+'\nevent.target.tagName: '+event.target.tagName+'\nevent.target.src: '+event.target.src+'\nevent.pageX: '+event.pageX+'\nevent.pageY: '+event.pageY+'\ndocument.documentElement.clientWidth: '+document.documentElement.clientWidth+'\ndocument.documentElement.clientHeight: '+document.documentElement.clientHeight+'\ndocument.documentElement.scrollWidth: '+document.documentElement.scrollWidth+'\ndocument.documentElement.scrollHeight: '+document.documentElement.scrollHeight+'\ndocument.documentElement.scrollLeft: '+document.documentElement.scrollLeft+'\ndocument.documentElement.scrollTop: '+document.documentElement.scrollTop);
  466. 	if (disable_contextmenu == true) {
  467. 		document.oncontextmenu = null;
  468. 		disable_contextmenu = false;
  469. 	}
  470. 	if (event[setting.hot_key] == true && event.button == 2) {
  471. 		if (search_panel == null) create_panel();
  472. 		// GM 4.x api is async, so we cannot update it in time
  473. 		else {
  474. 			if (!asyncGMAPI) {
  475. 				if (last_update != GM_getValue('timestamp', 0)) {
  476. 					last_update = GM_getValue('timestamp', 0);
  477. 					search_panel.parentElement && search_panel.parentElement.removeChild(search_panel);
  478. 					setting = GM_getValue('setting') ? JSON.parse(GM_getValue('setting')) : default_setting;
  479. 					create_panel();
  480. 				}
  481. 				else document.body.appendChild(search_panel);
  482. 			}
  483. 			else {
  484. 				document.body.appendChild(search_panel);
  485. 				GM_getValue('timestamp', 0).then(function (t) {
  486. 					if (last_update != t) {
  487. 						last_update = t;
  488. 						search_panel.parentElement && search_panel.parentElement.removeChild(search_panel);
  489. 						GM_getValue('setting').then(function (s) {
  490. 							setting = s ? JSON.parse(s) : default_setting;
  491. 						});
  492. 					}
  493. 				});
  494. 			}
  495. 		}
  496. 		search_panel.style.left = (document.documentElement.offsetWidth + (document.documentElement.scrollLeft || document.body.scrollLeft) - event.pageX >= 200 ? event.pageX : event.pageX >= 200 ? event.pageX - 200 : 0) + 'px';
  497. 		search_panel.style.top = (event.pageY + search_panel.offsetHeight < (document.documentElement.scrollTop || document.body.scrollTop) + document.documentElement.clientHeight ? event.pageY : event.pageY >= search_panel.scrollHeight ? event.pageY - search_panel.offsetHeight : 0) + 'px';
  498. 		// Firefox doesn't support getComputedStyle(element).marginLeft/marginRight and it would return "0px" while the element's margin is "auto". See bugzila/381328.
  499. 		//search_panel.style.marginLeft = '-' + (navigator.userAgent.indexOf('Firefox') < 0 ? getComputedStyle(document.body).marginLeft : (document.documentElement.offsetWidth - document.body.offsetWidth) / 2 + 'px');
  500. 		//search_panel.style.marginTop = '-' + getComputedStyle(document.body).marginTop;
  501. 		disable_contextmenu = true;
  502. 		document.oncontextmenu = function() {
  503. 			return false;
  504. 		};
  505. 		if (event.target.tagName.toLowerCase() == 'img' && event.target.src != null) {
  506. 			search_panel.getElementsByClassName('search_top_url')[0].style.marginTop = '0px';
  507. 			search_panel.getElementsByClassName('search_top_url')[0].textContent = event.target.src;
  508. 			if (/^data:\s*.*?;\s*base64,\s*/.test(event.target.src)) upload_file(event.target.src);
  509. 			else if (/^(?:blob:|filesystem:)/.test(event.target.src)) upload_blob_url(event.target.src);
  510. 			else img_src = event.target.src;
  511. 		}
  512. 		else {
  513. 			search_panel.getElementsByClassName('search_top_url')[0].style.marginTop = '-24px';
  514. 			var firefoxPasteNode = document.getElementsByClassName('image-search-paste-node-firefox')[0];
  515. 			if (navigator.userAgent.indexOf('Firefox') >= 0 && firefoxPasteNode) {
  516. 				firefoxPasteNode.innerHTML = '';
  517. 				firefoxPasteNode.focus();
  518. 			}
  519. 			else document.addEventListener('paste', get_clipboard, false);
  520. 		}
  521. 	}
  522. 	else if (search_panel != null) {
  523. 		if (event.target.compareDocumentPosition(search_panel) == 10 || event.target.compareDocumentPosition(search_panel) == 0) {
  524. 			if (event.target.className == 'image-search-item' && event.button == 0) {
  525. 				switch (event.target.getAttribute('search-option')) {
  526. 					case 'all':
  527. 						if (img_src != null) {
  528. 							for (var i = setting.site_option.length - 1; i >= 0; i--) {
  529. 								var rsrc = img_src;
  530. 								var turl = setting.site_list[setting.site_option[i]];
  531. 								if (turl.split(/{%s+}/).shift().indexOf('?') >= 0) {
  532. 									var token = turl.match(/{%s+}/)[0];
  533. 									for (var j = 0; j < token.length - 3; j++) {
  534. 										rsrc = encodeURIComponent(rsrc);
  535. 									}
  536. 								}
  537. 								GM_openInTab(turl.replace(/{%s+}/, rsrc), event[setting.hot_key]);
  538. 							}
  539. 							hide_panel();
  540. 						}
  541. 						break;
  542. 					case 'setting':
  543. 						call_setting();
  544. 						hide_panel();
  545. 						break;
  546. 					default:
  547. 						if (img_src != null) {
  548. 							var rsrc = img_src;
  549. 							var turl = setting.site_list[event.target.getAttribute('search-option')];
  550. 							if (turl.split(/{%s+}/).shift().indexOf('?') >= 0) {
  551. 								var token = turl.match(/{%s+}/)[0];
  552. 								for (var j = 0; j < token.length - 3; j++) {
  553. 									rsrc = encodeURIComponent(rsrc);
  554. 								}
  555. 							}
  556.  
  557. 							GM_openInTab(turl.replace(/{%s+}/, rsrc), event[setting.hot_key]);
  558. 							hide_panel();
  559. 						}
  560. 				}
  561. 			}
  562. 			else if (event.button != 0) hide_panel();
  563. 		}
  564. 		else hide_panel();
  565. 	}
  566. }, true);
  567.  
  568. if (typeof GM_registerMenuCommand !== 'undefined') {
  569. 	var gm_callsetting = GM_registerMenuCommand('Search By Image Setting', call_setting);
  570. }
  571. init();

欢迎访问Greasy Fork镜像

土豆服务器，请按需使用

镜像地址随时可能被墙，建议加群获取最新地址

加入Q群

QingJ © 2025

镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址