feat: refactor app.js

public/src/ajaxify.js

@@ -186,12 +186,94 @@ ajaxify = window.ajaxify || {};
 				$('#content, #footer').removeClass('ajaxifying');
 
 				// Only executed on ajaxify. Otherwise these'd be in ajaxify.end()
-				app.refreshTitle(data.title);
-				app.updateTags();
+				updateTitle(data.title);
+				updateTags();
 			});
 		});
 	}
 
+	function updateTitle(title) {
+		if (!title) {
+			return;
+		}
+		require(['translator'], function (translator) {
+			title = config.titleLayout.replace(/{/g, '{').replace(/}/g, '}')
+				.replace('{pageTitle}', function () { return title; })
+				.replace('{browserTitle}', function () { return config.browserTitle; });
+
+			// Allow translation strings in title on ajaxify (#5927)
+			title = translator.unescape(title);
+
+			translator.translate(title, function (translated) {
+				window.document.title = $('<div></div>').html(translated).text();
+			});
+		});
+	}
+
+	function updateTags() {
+		var metaWhitelist = ['title', 'description', /og:.+/, /article:.+/].map(function (val) {
+			return new RegExp(val);
+		});
+		var linkWhitelist = ['canonical', 'alternate', 'up'];
+
+		// Delete the old meta tags
+		Array.prototype.slice
+			.call(document.querySelectorAll('head meta'))
+			.filter(function (el) {
+				var name = el.getAttribute('property') || el.getAttribute('name');
+				return metaWhitelist.some(function (exp) {
+					return !!exp.test(name);
+				});
+			})
+			.forEach(function (el) {
+				document.head.removeChild(el);
+			});
+
+		// Add new meta tags
+		ajaxify.data._header.tags.meta
+			.filter(function (tagObj) {
+				var name = tagObj.name || tagObj.property;
+				return metaWhitelist.some(function (exp) {
+					return !!exp.test(name);
+				});
+			})
+			.forEach(function (tagObj) {
+				var metaEl = document.createElement('meta');
+				Object.keys(tagObj).forEach(function (prop) {
+					metaEl.setAttribute(prop, tagObj[prop]);
+				});
+				document.head.appendChild(metaEl);
+			});
+
+		// Delete the old link tags
+		Array.prototype.slice
+			.call(document.querySelectorAll('head link'))
+			.filter(function (el) {
+				var name = el.getAttribute('rel');
+				return linkWhitelist.some(function (item) {
+					return item === name;
+				});
+			})
+			.forEach(function (el) {
+				document.head.removeChild(el);
+			});
+
+		// Add new link tags
+		ajaxify.data._header.tags.link
+			.filter(function (tagObj) {
+				return linkWhitelist.some(function (item) {
+					return item === tagObj.rel;
+				});
+			})
+			.forEach(function (tagObj) {
+				var linkEl = document.createElement('link');
+				Object.keys(tagObj).forEach(function (prop) {
+					linkEl.setAttribute(prop, tagObj[prop]);
+				});
+				document.head.appendChild(linkEl);
+			});
+	}
+
 	ajaxify.end = function (url, tpl_url) {
 		ajaxify.loadScript(tpl_url, function done() {
 			$(window).trigger('action:ajaxify.end', { url: url, tpl_url: tpl_url, title: ajaxify.data.title });