share plugin: cleanup, fix icon not highlighting properly

1 files changed, 31 insertions, 27 deletions

diff --git a/plugins/share/share.js b/plugins/share/share.js
index 3fc42d654..09fb145c9 100644
--- a/plugins/share/share.js
+++ b/plugins/share/share.js
@@ -1,9 +1,7 @@
-/* global Plugins, xhrJson, Notify, fox, xhrPost, __ */
+/* global dojo, Effect, Plugins, xhrJson, Notify, fox, xhrPost, __ */
 
 Plugins.Share = {
 	shareArticle: function(id) {
-		const query = "backend.php?op=pluginhandler&plugin=share&method=shareArticle&param=" + encodeURIComponent(id);
-
 		const dialog = new fox.SingleUseDialog({
 			id: "shareArticleDlg",
 			title: __("Share article by URL"),
@@ -17,20 +15,23 @@ Plugins.Share = {
 					xhrJson("backend.php", query, (reply) => {
 						if (reply) {
 							const new_link = reply.link;
-							const e = $('gen_article_url');
+							const target = dialog.domNode.querySelector(".target-url");
 
-							if (new_link) {
+							if (new_link && target) {
 
-								e.innerHTML = e.innerHTML.replace(/\&key=.*$/,
+								target.innerHTML = target.innerHTML.replace(/&key=.*$/,
 									"&key=" + new_link);
 
-								e.href = e.href.replace(/\&key=.*$/,
+								target.href = target.href.replace(/&key=.*$/,
 									"&key=" + new_link);
 
-								new Effect.Highlight(e);
+								// eslint-disable-next-line no-new
+								new Effect.Highlight(target);
+
+								const icon = document.querySelector(".share-icon-" + id);
 
-								const img = $("SHARE-IMG-" + id);
-								img.addClassName("shared");
+								if (icon)
+									icon.addClassName("is-shared");
 
 								Notify.close();
 
@@ -44,32 +45,35 @@ Plugins.Share = {
 			},
 			unshare: function () {
 				if (confirm(__("Remove sharing for this article?"))) {
+					xhrPost("backend.php", {op: "pluginhandler", plugin: "share", method: "unshare", id: id}, (transport) => {
+						Notify.info(transport.responseText);
 
-					const query = {op: "pluginhandler", plugin: "share", method: "unshare", id: id};
-
-					xhrPost("backend.php", query, () => {
-						try {
-							const img = $("SHARE-IMG-" + id);
+						const icon = document.querySelector(".share-icon-" + id);
 
-							if (img) {
-								img.removeClassName("shared");
-								img.up("div[id*=RROW]").removeClassName("shared");
-							}
+						if (icon)
+							icon.removeClassName("is-shared");
 
-							dialog.hide();
-						} catch (e) {
-							console.error(e);
-						}
+						dialog.hide();
 					});
 				}
 
 			},
-			href: query
+			content: __("Loading, please wait...")
 		});
 
-		dialog.show();
+		const tmph = dojo.connect(dialog, 'onShow', function () {
+			dojo.disconnect(tmph);
 
-		const img = $("SHARE-IMG-" + id);
-		img.addClassName("shared");
+			xhrPost("backend.php", {op: "pluginhandler", plugin: "share", method: "shareDialog", id: id}, (transport) => {
+				dialog.attr('content', transport.responseText)
+
+				const icon = document.querySelector(".share-icon-" + id);
+
+				if (icon)
+					icon.addClassName("is-shared");
+			});
+		});
+
+		dialog.show();
 	}
 }