Made Autoloader and Diff Highlight compatible (#2580)

Author: RunDevelopment

plugins/autoloader/prism-autoloader.js

@@ -460,7 +460,13 @@
 		}
 
 		var deps = getDependencies(element);
-		deps.push(language);
+		if (/^diff-./i.test(language)) {
+			// the "diff-xxxx" format is used by the Diff Highlight plugin
+			deps.push('diff');
+			deps.push(language.substr('diff-'.length));
+		} else {
+			deps.push(language);
+		}
 
 		if (!deps.every(isLoaded)) {
 			// the language or some dependencies aren't loaded

plugins/autoloader/prism-autoloader.min.js

@@ -24,8 +24,14 @@ <h1>How to use</h1>
 
 		<p>Replace the <code>language-diff</code> of your code block with a <code>language-diff-xxxx</code> class to enable syntax highlighting for diff blocks.</p>
 
-		<p>Optional:<br>
-			You can add the <code>diff-highlight</code> class to your code block to indicate changes using the background color of a line rather than the color of the text.</p>
+		<p>
+			Optional:<br>
+			You can add the <code>diff-highlight</code> class to your code block to indicate changes using the background color of a line rather than the color of the text.
+		</p>
+
+		<h2>Autoloader</h2>
+
+		<p>The <a href="plugins/autoloader">Autoloader plugin</a> understands the <code>language-diff-xxxx</code> format and will ensure that the language definitions for both Diff and the code language are loaded.</p>
 	</section>
 
 	<section>
@@ -63,12 +69,27 @@ <h1>Example</h1>
 +    const foo = bar.baz([1, 2, 3]) + 1;
      console.log(`foo: ${foo}`);</code></pre>
 
+		<p>
+			Using <code>class="language-diff-rust diff-highlight"</code>:<br>
+			(Autoloader is used to load the Rust language definition.)
+		</p>
+
+		<pre><code class="language-diff-rust diff-highlight">@@ -111,6 +114,9 @@
+         nasty_btree_map.insert(i, MyLeafNode(i));
+     }
+
++    let mut zst_btree_map: BTreeMap&lt;(), ()> = BTreeMap::new();
++    zst_btree_map.insert((), ());
++
+     // VecDeque
+     let mut vec_deque = VecDeque::new();
+     vec_deque.push_back(5);</code></pre>
 	</section>
 
 	<footer data-src="assets/templates/footer.html" data-type="text/html"></footer>
 
 	<script src="prism.js"></script>
-	<script src="components/prism-diff.js"></script>
+	<script src="plugins/autoloader/prism-autoloader.js"></script>
 	<script src="plugins/diff-highlight/prism-diff-highlight.js"></script>
 	<script src="assets/utopia.js"></script>
 	<script src="components.js"></script>

plugins/diff-highlight/index.html

@@ -1,28 +1,33 @@
 (function () {
 
-	if (typeof Prism === 'undefined' || !Prism.languages['diff']) {
+	if (typeof Prism === 'undefined') {
 		return;
 	}
 
 
-	var LANGUAGE_REGEX = /diff-([\w-]+)/i;
+	var LANGUAGE_REGEX = /^diff-([\w-]+)/i;
 	var HTML_TAG = /<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/gi;
 	//this will match a line plus the line break while ignoring the line breaks HTML tags may contain.
 	var HTML_LINE = RegExp(/(?:__|[^\r\n<])*(?:\r\n?|\n|(?:__|[^\r\n<])(?![^\r\n]))/.source.replace(/__/g, function () { return HTML_TAG.source; }), 'gi');
 
-	var PREFIXES = Prism.languages.diff.PREFIXES;
-
+	var warningLogged = false;
 
 	Prism.hooks.add('before-sanity-check', function (env) {
 		var lang = env.language;
 		if (LANGUAGE_REGEX.test(lang) && !env.grammar) {
-			env.grammar = Prism.languages[lang] = Prism.languages['diff'];
+			env.grammar = Prism.languages[lang] = Prism.languages.diff;
 		}
 	});
 	Prism.hooks.add('before-tokenize', function (env) {
+		if (!warningLogged && !Prism.languages.diff && !Prism.plugins.autoloader) {
+			warningLogged = true;
+			console.warn("Prism's Diff Highlight plugin requires the Diff language definition (prism-diff.js)." +
+				"Make sure the language definition is loaded or use Prism's Autoloader plugin.");
+		}
+
 		var lang = env.language;
 		if (LANGUAGE_REGEX.test(lang) && !Prism.languages[lang]) {
-			Prism.languages[lang] = Prism.languages['diff'];
+			Prism.languages[lang] = Prism.languages.diff;
 		}
 	});
 
@@ -39,8 +44,10 @@
 			diffGrammar = Prism.languages[diffLanguage];
 		}
 
+		var PREFIXES = Prism.languages.diff && Prism.languages.diff.PREFIXES;
+
 		// one of the diff tokens without any nested tokens
-		if (env.type in PREFIXES) {
+		if (PREFIXES && env.type in PREFIXES) {
 			/** @type {string} */
 			var content = env.content.replace(HTML_TAG, ''); // remove all HTML tags