☰

Instagram - 为关注的用户添加备注

为所关注的用户添加备注功能，以帮助识别

目前为 2019-07-29 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name                Instagram为关注用户添加备注
  3. // @name:en             Instagram - Add notes to following
  4. // @name:zh             Instagram - 为关注的用户添加备注
  5. // @name:zh-CN          Instagram - 为关注的用户添加备注
  6. // @name:zh-HK          INstagram - 為追蹤的用戶添加備註
  7. // @name:zh-TW          Instagram - 為追蹤的用戶添加備註
  8. // @name:ja             Instagram - 興味のあるユーザーにメモを追加する
  9. // @name:ko             Instagram - 관심있는 사용자에게 메모 추가
  10. // @namespace           https://greasyfork.org/zh-CN/users/193133-pana
  11. // @homepage            https://www.sailboatweb.com
  12. // @icon                data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yMCwxNSBMMjAsNCBMNCw0IEw0LDIwIEwxNSwyMCBMMTUsMTcgQzE1LDE1Ljg5NTQzMDUgMTUuODk1NDMwNSwxNSAxNywxNSBMMjAsMTUgWiBNMTkuNTg1Nzg2NCwxNyBMMTcsMTcgTDE3LDE5LjU4NTc4NjQgTDE5LjU4NTc4NjQsMTcgWiBNNCwyMiBDMi44OTU0MzA1LDIyIDIsMjEuMTA0NTY5NSAyLDIwIEwyLDQgQzIsMi44OTU0MzA1IDIuODk1NDMwNSwyIDQsMiBMMjAsMiBDMjEuMTA0NTY5NSwyIDIyLDIuODk1NDMwNSAyMiw0IEwyMiwxNy40MTQyMTM2IEwxNy40MTQyMTM2LDIyIEw0LDIyIFogTTcsMTcgTDcsMTUgTDEzLDE1IEwxMywxNyBMNywxNyBaIE03LDEzIEw3LDExIEwxNywxMSBMMTcsMTMgTDcsMTMgWiBNNyw5IEw3LDcgTDE3LDcgTDE3LDkgTDcsOSBaIi8+Cjwvc3ZnPgo=
  13. // @version             1.1.0
  14. // @description         为所关注的用户添加备注功能，以帮助识别
  15. // @description:en      Add notes to users you follow to help identify
  16. // @description:zh      为所关注的用户添加备注功能，以帮助识别
  17. // @description:zh-CN   为所关注的用户添加备注功能，以帮助识别
  18. // @description:zh-HK   為所追蹤的用戶添加備註功能，以幫助識別
  19. // @description:zh-TW   為所追蹤的用戶添加備註功能，以幫助識別
  20. // @description:ja      識別しやすくするために、気になるユーザーにメモを追加します
  21. // @description:ko      식별에 도움이되는 관심 사용자에게 메모 추가
  22. // @author              pana
  23. // @include             http*://www.instagram.com/*
  24. // @require             https://code.jquery.com/jquery-3.4.1.min.js
  25. // @require             https://cdnjs.cloudflare.com/ajax/libs/arrive/2.4.1/arrive.min.js
  26. // @grant               GM_getValue
  27. // @grant               GM_setValue
  28. // ==/UserScript==
  29.  
  30. (function() {
  31. 	'use strict';
  32. 	const LANG = {
  33. 		ZH: {
  34. 			div_title: '备注',
  35. 			input_placeholder: '(请输入备注，置空时删除)',
  36. 			save_button_text: '保存',
  37. 			cancel_button_text: '取消',
  38. 		},
  39. 		ZH_TW: {
  40. 			div_title: '備註',
  41. 			input_placeholder: '(請輸入備註，置空時刪除)',
  42. 			save_button_text: '保存',
  43. 			cancel_button_text: '取消',
  44. 		},
  45. 		EN: {
  46. 			div_title: 'note',
  47. 			input_placeholder: '(Please enter a note and delete it when blanked)',
  48. 			save_button_text: 'Save',
  49. 			cancel_button_text: 'Cancel',
  50. 		},
  51. 		JA: {
  52. 			div_title: '備考',
  53. 			input_placeholder: '(コメントを入力し、空白になったら削除してください)',
  54. 			save_button_text: '保存する',
  55. 			cancel_button_text: 'キャンセル',
  56. 		},
  57. 		KO: {
  58. 			div_title: '비고',
  59. 			input_placeholder: '(주석을 입력하고 공백으로 표시되면 삭제하십시오)',
  60. 			save_button_text: '저장',
  61. 			cancel_button_text: '취소',
  62. 		},
  63. 	};
  64. 	var lang_value = {
  65. 		div_title: 'note',
  66. 		input_placeholder: '(Please enter a note and delete it when blanked)',
  67. 		save_button_text: 'Save',
  68. 		cancel_button_text: 'Cancel',
  69. 	};
  70. 	var user_handle = {
  71. 		user_id: '',
  72. 		user_tag: '',
  73. 	};
  74. 	var instagram_config = {};
  75. 	var default_config = {
  76. 		user_array: [],
  77. 	};
  78. 	const PAGE_REG = {
  79. 		HOMEPAGE: /^https?:\/\/www\.instagram\.com\/?(\?[a-z]+=[a-z\-]+)?$/i,
  80. 		USER_PAGE: /^https?:\/\/www\.instagram\.com\/[^/]*\/?(\?[a-z]+=[a-z\-]+)?$/i,
  81. 		STORIES: /^https?:\/\/www\.instagram\.com\/stories\/[^/]*\/?(\?[a-z]+=[a-z\-]+)?$/i,
  82. 	};
  83.  
  84. 	function judge_User(user_title) {
  85. 		for (let i = 0; i < instagram_config.user_array.length; i++) {
  86. 			if (user_title === instagram_config.user_array[i].user_id) {
  87. 				return i
  88. 			}
  89. 		}
  90. 		return -1
  91. 	}
  92. 	function write_User(user_title, input_tag) {
  93. 		let judge_value = judge_User(user_title);
  94. 		if (judge_value !== -1) {
  95. 			if (input_tag) {
  96. 				instagram_config.user_array[judge_value].user_tag = input_tag
  97. 			} else {
  98. 				instagram_config.user_array.splice(judge_value, 1)
  99. 			}
  100. 		} else {
  101. 			if (input_tag) {
  102. 				let temp_user_obj = {
  103. 					user_id: user_title,
  104. 					user_tag: input_tag,
  105. 				};
  106. 				instagram_config.user_array.push(temp_user_obj)
  107. 			}
  108. 		}
  109. 		GM_setValue('instagram_config', instagram_config)
  110. 	}
  111. 	function create_Add_Input_Div(user_title) {
  112. 		let presentation_div = document.createElement('div');
  113. 		presentation_div.className = 'presentation_div_for_user';
  114. 		presentation_div.style.display = 'flex';
  115. 		presentation_div.style.position = 'fixed';
  116. 		presentation_div.style.backgroundColor = 'rgba(0, 0, 0, .5)';
  117. 		presentation_div.style.top = '0';
  118. 		presentation_div.style.bottom = '0';
  119. 		presentation_div.style.left = '0';
  120. 		presentation_div.style.right = '0';
  121. 		presentation_div.style.zIndex = '1';
  122. 		presentation_div.style.alignItems = 'center';
  123. 		presentation_div.style.justifyContent = 'center';
  124. 		presentation_div.addEventListener('click', function(event) {
  125. 			if (event.target === this) {
  126. 				$('.presentation_div_for_user').remove()
  127. 			}
  128. 		});
  129. 		let dialog_div = document.createElement('div');
  130. 		dialog_div.className = 'dialog_div_for_user';
  131. 		dialog_div.style.position = 'relative';
  132. 		dialog_div.style.width = '400px';
  133. 		dialog_div.style.backgroundColor = '#fff';
  134. 		dialog_div.style.border = '0 solid #000';
  135. 		dialog_div.style.borderRadius = '12px';
  136. 		let user_title_p = document.createElement('button');
  137. 		user_title_p.className = 'user_title_span_for_user';
  138. 		user_title_p.innerText = user_title;
  139. 		user_title_p.style.minHeight = '48px';
  140. 		user_title_p.style.textAlign = 'center';
  141. 		user_title_p.style.border = '1px solid #efefef';
  142. 		user_title_p.style.color = 'red';
  143. 		user_title_p.style.fontWeight = 'bold';
  144. 		user_title_p.style.backgroundColor = 'rgba(0, 0, 0, 0)';
  145. 		user_title_p.style.borderTopLeftRadius = '12px';
  146. 		user_title_p.style.borderTopRightRadius = '12px';
  147. 		let tag_input = document.createElement('input');
  148. 		tag_input.className = 'tag_input_for_user';
  149. 		tag_input.type = 'text';
  150. 		tag_input.placeholder = lang_value.input_placeholder;
  151. 		tag_input.style.minHeight = '32px';
  152. 		tag_input.style.margin = '5px';
  153. 		let judge_value = judge_User(user_title);
  154. 		if (judge_value !== -1) {
  155. 			tag_input.value = instagram_config.user_array[judge_value].user_tag
  156. 		} else {
  157. 			tag_input.value = ''
  158. 		}
  159. 		let save_button = document.createElement('button');
  160. 		save_button.className = 'save_button_for_user';
  161. 		save_button.type = 'button';
  162. 		save_button.innerText = lang_value.save_button_text;
  163. 		save_button.style.minHeight = '48px';
  164. 		save_button.style.cursor = 'pointer';
  165. 		save_button.style.border = '1px solid #efefef';
  166. 		save_button.style.backgroundColor = 'rgba(0, 0, 0, 0)';
  167. 		save_button.addEventListener('click', function() {
  168. 			write_User(user_title, $('.tag_input_for_user').val());
  169. 			save_Update_Event(user_title);
  170. 			$('.presentation_div_for_user').remove()
  171. 		});
  172. 		let cancel_button = document.createElement('button');
  173. 		cancel_button.className = 'cancel_button_for_user';
  174. 		cancel_button.type = 'button';
  175. 		cancel_button.innerText = lang_value.cancel_button_text;
  176. 		cancel_button.style.minHeight = '48px';
  177. 		cancel_button.style.cursor = 'pointer';
  178. 		cancel_button.style.border = '1px solid #efefef';
  179. 		cancel_button.style.backgroundColor = 'rgba(0, 0, 0, 0)';
  180. 		cancel_button.style.borderBottomLeftRadius = '12px';
  181. 		cancel_button.style.borderBottomRightRadius = '12px';
  182. 		cancel_button.addEventListener('click', function(event) {
  183. 			$('.presentation_div_for_user').remove()
  184. 		});
  185. 		dialog_div.appendChild(user_title_p);
  186. 		dialog_div.appendChild(tag_input);
  187. 		dialog_div.appendChild(save_button);
  188. 		dialog_div.appendChild(cancel_button);
  189. 		presentation_div.appendChild(dialog_div);
  190. 		return presentation_div
  191. 	}
  192. 	function create_Add_Tags_Div(user_title) {
  193. 		let tags_div = document.createElement('div');
  194. 		tags_div.className = 'Tags_A';
  195. 		tags_div.href = 'javascript:;';
  196. 		tags_div.title = lang_value.div_title;
  197. 		tags_div.style.width = '32px';
  198. 		tags_div.style.height = '32px';
  199. 		tags_div.style.backgroundImage = 'url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yMCwxNSBMMjAsNCBMNCw0IEw0LDIwIEwxNSwyMCBMMTUsMTcgQzE1LDE1Ljg5NTQzMDUgMTUuODk1NDMwNSwxNSAxNywxNSBMMjAsMTUgWiBNMTkuNTg1Nzg2NCwxNyBMMTcsMTcgTDE3LDE5LjU4NTc4NjQgTDE5LjU4NTc4NjQsMTcgWiBNNCwyMiBDMi44OTU0MzA1LDIyIDIsMjEuMTA0NTY5NSAyLDIwIEwyLDQgQzIsMi44OTU0MzA1IDIuODk1NDMwNSwyIDQsMiBMMjAsMiBDMjEuMTA0NTY5NSwyIDIyLDIuODk1NDMwNSAyMiw0IEwyMiwxNy40MTQyMTM2IEwxNy40MTQyMTM2LDIyIEw0LDIyIFogTTcsMTcgTDcsMTUgTDEzLDE1IEwxMywxNyBMNywxNyBaIE03LDEzIEw3LDExIEwxNywxMSBMMTcsMTMgTDcsMTMgWiBNNyw5IEw3LDcgTDE3LDcgTDE3LDkgTDcsOSBaIi8+Cjwvc3ZnPgo=)';
  200. 		tags_div.style.backgroundRepeat = 'no-repeat';
  201. 		tags_div.style.backgroundPosition = 'center';
  202. 		tags_div.style.backgroundSize = '24px auto';
  203. 		tags_div.style.marginLeft = '5px';
  204. 		tags_div.addEventListener('click', function() {
  205. 			document.body.appendChild(create_Add_Input_Div(user_title))
  206. 		});
  207. 		return tags_div
  208. 	}
  209. 	function create_Add_Tag_P(tag_string) {
  210. 		let tag_p = document.createElement('p');
  211. 		tag_p.className = 'tag_p';
  212. 		tag_p.style.marginLeft = '5px';
  213. 		tag_p.style.color = '#990033';
  214. 		tag_p.style.whiteSpace = 'nowrap';
  215. 		tag_p.innerText = '(' + tag_string + ')';
  216. 		return tag_p
  217. 	}
  218. 	function create_Add_Tag_Span(tag_string, font_size) {
  219. 		let tag_span = document.createElement('span');
  220. 		tag_span.className = 'tag_span';
  221. 		tag_span.style.marginLeft = '5px';
  222. 		tag_span.style.color = '#990033';
  223. 		tag_span.style.fontSize = font_size;
  224. 		tag_span.innerText = '(' + tag_string + ')';
  225. 		return tag_span
  226. 	}
  227. 	function homepage_Event(dom_container) {
  228. 		let user_title = $(dom_container).find('a.nJAzx').attr('title');
  229. 		let judge_value = judge_User(user_title);
  230. 		if (judge_value !== -1) {
  231. 			$(dom_container).find('.e1e1d').append(create_Add_Tag_P(instagram_config.user_array[judge_value].user_tag))
  232. 		}
  233. 		$(dom_container).find('.e1e1d').append(create_Add_Tags_Div(user_title));
  234. 		$(dom_container).find('.e1e1d').css('overflow', 'visible')
  235. 	}
  236. 	function homepage_Stories_Event(dom_container) {
  237. 		let user_title = $(dom_container).find('.jQgLo').text();
  238. 		let judge_value = judge_User(user_title);
  239. 		if (judge_value !== -1) {
  240. 			$(dom_container).find('.jQgLo').append(create_Add_Tag_Span(instagram_config.user_array[judge_value].user_tag, '12px'))
  241. 		}
  242. 	}
  243. 	function user_Page_Event(selector_container) {
  244. 		let user_title = selector_container.find('.KV-D4').text();
  245. 		selector_container.find('.AFWDX').after(create_Add_Tags_Div(user_title));
  246. 		let judge_value = judge_User(user_title);
  247. 		if (judge_value !== -1) {
  248. 			selector_container.find('.AFWDX').after(create_Add_Tag_Span(instagram_config.user_array[judge_value].user_tag, '16px'))
  249. 		}
  250. 		$.each(selector_container.find('span._32eiM'), function(index, item) {
  251. 			let em_user_title = item.innerText;
  252. 			let em_judge_value = judge_User(em_user_title);
  253. 			if (em_judge_value !== -1) {
  254. 				item.innerText = em_user_title + ' (' + instagram_config.user_array[em_judge_value].user_tag + ')'
  255. 			}
  256. 		})
  257. 	}
  258. 	function stories_Page_Event(selector_container) {
  259. 		let user_title = selector_container.find('.FPmhX').text();
  260. 		let judge_value = judge_User(user_title);
  261. 		if (judge_value !== -1) {
  262. 			selector_container.append(create_Add_Tag_Span(instagram_config.user_array[judge_value].user_tag, '14px'))
  263. 		}
  264. 	}
  265. 	function follow_Page_Event(selector_container) {
  266. 		if (selector_container.find('.tag_span').length === 0) {
  267. 			let user_title = selector_container.find('a.FPmhX').attr('title');
  268. 			let judge_value = judge_User(user_title);
  269. 			if (judge_value !== -1) {
  270. 				selector_container.find('a.FPmhX').parent().append(create_Add_Tag_Span(instagram_config.user_array[judge_value].user_tag, '14px'))
  271. 			}
  272. 		}
  273. 	}
  274. 	function save_Update_Event(user_title) {
  275. 		let old_url = location.href;
  276. 		if (PAGE_REG.HOMEPAGE.test(old_url)) {
  277. 			$.each($('article'), function(index, item) {
  278. 				let page_user_title = $(item).find('a.nJAzx').attr('title');
  279. 				if (user_title === page_user_title) {
  280. 					let judge_value = judge_User(user_title);
  281. 					if (judge_value !== -1) {
  282. 						if ($(item).find('p.tag_p').length !== 0) {
  283. 							$(item).find('p.tag_p').text('(' + instagram_config.user_array[judge_value].user_tag + ')')
  284. 						} else {
  285. 							$(item).find('.Tags_A').before(create_Add_Tag_P(instagram_config.user_array[judge_value].user_tag))
  286. 						}
  287. 					} else {
  288. 						if ($(item).find('p.tag_p').length !== 0) {
  289. 							$(item).find('p.tag_p').remove()
  290. 						}
  291. 					}
  292. 				}
  293. 			});
  294. 			$.each($('.BI5t6'), function(index, item) {
  295. 				let page_user_selector = $(item).find('.jQgLo').clone();
  296. 				page_user_selector.find('.tag_span').remove();
  297. 				let page_user_title = page_user_selector.text();
  298. 				if (user_title === page_user_title) {
  299. 					let judge_value = judge_User(user_title);
  300. 					if (judge_value !== -1) {
  301. 						if ($(item).find('span.tag_span').length !== 0) {
  302. 							$(item).find('span.tag_span').text('(' + instagram_config.user_array[judge_value].user_tag + ')')
  303. 						} else {
  304. 							$(item).find('.jQgLo').append(create_Add_Tag_Span(instagram_config.user_array[judge_value].user_tag, '12px'))
  305. 						}
  306. 					} else {
  307. 						if ($(item).find('span.tag_span').length !== 0) {
  308. 							$(item).find('span.tag_span').remove()
  309. 						}
  310. 					}
  311. 				}
  312. 			})
  313. 		} else if (PAGE_REG.USER_PAGE.test(old_url)) {
  314. 			let user_title = $('.KV-D4').text();
  315. 			let judge_value = judge_User(user_title);
  316. 			if (judge_value !== -1) {
  317. 				if ($('.tag_span').length !== 0) {
  318. 					$('.tag_span').text('(' + instagram_config.user_array[judge_value].user_tag + ')')
  319. 				} else {
  320. 					$('.AFWDX').after(create_Add_Tag_Span(instagram_config.user_array[judge_value].user_tag, '16px'))
  321. 				}
  322. 			} else {
  323. 				if ($('.tag_span').length !== 0) {
  324. 					$('.tag_span').remove()
  325. 				}
  326. 			}
  327. 		}
  328. 	}
  329. 	function set_Language(lang_string) {
  330. 		switch (lang_string) {
  331. 		case 'zh':
  332. 		case 'zh-cn':
  333. 			lang_value = LANG.ZH;
  334. 			break;
  335. 		case 'zh-hk':
  336. 		case 'zh-tw':
  337. 			lang_value = LANG.ZH_TW;
  338. 			break;
  339. 		case 'en':
  340. 			lang_value = LANG.EN;
  341. 			break;
  342. 		case 'ja':
  343. 			lang_value = LANG.JA;
  344. 			break;
  345. 		case 'ko':
  346. 			lang_value = LANG.KO;
  347. 			break;
  348. 		default:
  349. 			lang_value = LANG.EN;
  350. 			break
  351. 		}
  352. 	}
  353. 	function init() {
  354. 		set_Language($('html:first').attr('lang'));
  355. 		$.each($('article'), function(index, item) {
  356. 			homepage_Event(item)
  357. 		});
  358. 		setTimeout(function() {
  359. 			$.each($('.BI5t6'), function(index, item) {
  360. 				homepage_Stories_Event(item)
  361. 			})
  362. 		}, 1000);
  363. 		$('#react-root').arrive('article', function() {
  364. 			homepage_Event(this)
  365. 		});
  366. 		$('#react-root').arrive('.BI5t6', function() {
  367. 			homepage_Stories_Event(this)
  368. 		});
  369. 		if ($('.zwlfE').length !== 0) {
  370. 			user_Page_Event($('.zwlfE'))
  371. 		}
  372. 		$('#react-root').arrive('.zwlfE', function() {
  373. 			user_Page_Event($(this))
  374. 		});
  375. 		if ($('.yn6BW').length !== 0) {
  376. 			stories_Page_Event($('.yn6BW'))
  377. 		}
  378. 		$('#react-root').arrive('.yn6BW', function() {
  379. 			stories_Page_Event($(this))
  380. 		});
  381. 		$('body').arrive('.isgrP li', {
  382. 			onceOnly: true
  383. 		}, function() {
  384. 			follow_Page_Event($(this))
  385. 		});
  386. 		$('body').arrive('.d7ByH', function() {
  387. 			follow_Page_Event($(this))
  388. 		})
  389. 	}
  390. 	Promise.all([GM_getValue('instagram_config')]).then(function(data) {
  391. 		if (data[0] !== undefined) {
  392. 			instagram_config = data[0]
  393. 		} else {
  394. 			instagram_config = default_config
  395. 		}
  396. 		init()
  397. 	})
  398. })();