MediaWiki:Common.js
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
// Add 'csharp' class to all <pre> tags for easier targeting
document.querySelectorAll("pre").forEach(pre => pre.classList.add("csharp"));
// Define C# keywords
const csharpKeywords = [
"abstract", "as", "base", "bool", "break", "byte", "case", "catch", "char", "checked",
"class", "const", "continue", "decimal", "default", "delegate", "do", "double", "else", "enum",
"event", "explicit", "extern", "false", "finally", "fixed", "float", "for", "foreach",
"goto", "if", "implicit", "in", "int", "interface", "internal", "is", "lock", "long", "namespace",
"new", "null", "object", "operator", "out", "override", "params", "private", "protected",
"public", "readonly", "ref", "return", "sbyte", "sealed", "short", "sizeof", "stackalloc",
"static", "string", "struct", "switch", "this", "throw", "true", "try", "typeof", "uint",
"ulong", "unchecked", "unsafe", "ushort", "using", "virtual", "void", "volatile", "while"
];
// Highlight C# keywords
document.querySelectorAll("pre.csharp").forEach(pre => {
let code = pre.innerHTML;
const regex = new RegExp(`\\b(${csharpKeywords.join("|")})\\b`, "g");
code = code.replace(regex, '<span class="csharp-keyword">$1</span>');
pre.innerHTML = code;
});
// Define C# types
const csharpTypes = [
"int", "long", "float", "double", "decimal", "char", "string", "bool", "byte", "object",
"void", "var", "dynamic", "sbyte", "ushort", "uint", "ulong"
];
// Highlight C# types
document.querySelectorAll("pre.csharp").forEach(pre => {
let code = pre.innerHTML;
const regexTypes = new RegExp(`\\b(${csharpTypes.join("|")})\\b`, "g");
code = code.replace(regexTypes, '<span class="csharp-type">$1</span>');
pre.innerHTML = code;
});
// Highlight C# method names
document.querySelectorAll("pre.csharp").forEach(pre => {
let code = pre.innerHTML;
// Define the regex pattern for method names (excluding C# keywords and types)
const regexMethods = /\b([a-zA-Z_][a-zA-Z0-9_]*)\s*(?=\()/g;
// Apply the method name highlighting
code = code.replace(regexMethods, '<span class="csharp-method">$1</span>');
pre.innerHTML = code;
});
// Function to check if a word is a keyword
function isKeyword(word) {
return csharpKeywords.includes(word);
}
// Highlight C# class names and property names
document.querySelectorAll("pre.csharp").forEach(pre => {
let code = pre.innerHTML;
// Define the regex pattern for class names (PascalCase)
const regexClasses = /\b([A-Z][a-zA-Z0-9_]*)\b/g;
code = code.replace(regexClasses, (match, p1) => {
return isKeyword(p1) ? p1 : `<span class="csharp-class">${p1}</span>`;
});
// Define the regex pattern for property names (PascalCase, followed by getter/setter)
const regexProperties = /\b([a-zA-Z_][a-zA-Z0-9_]*)\s*(?=\s*{)/g;
code = code.replace(regexProperties, (match, p1) => {
return isKeyword(p1) ? p1 : `<span class="csharp-property">${p1}</span>`;
});
pre.innerHTML = code;
});
// Add rainbow curly braces highlighting with matched colors for each pair
const rainbowColors = [
"red", "green", "blue", "purple", "orange", "yellow", "pink", "cyan", "lime", "brown"
];
document.querySelectorAll("pre.csharp").forEach(pre => {
let code = pre.innerHTML;
let braceStack = [];
let braceCount = 0;
// Regex for matching curly braces and adding colors
code = code.replace(/{|}/g, (brace, offset) => {
const color = rainbowColors[braceCount % rainbowColors.length];
// Check if this is an opening brace
if (brace === "{") {
braceStack.push(color); // Push color for opening brace
} else {
const pairColor = braceStack.pop(); // Pop the last opened brace's color for closing brace
braceCount++;
return `<span class="csharp-brace" style="color: ${pairColor};">${brace}</span>`;
}
// Apply color to opening brace
braceCount++;
return `<span class="csharp-brace" style="color: ${color};">${brace}</span>`;
});
pre.innerHTML = code;
});
// Highlight C# comments (single-line and multi-line)
document.querySelectorAll("pre.csharp").forEach(pre => {
let code = pre.innerHTML;
// Regex for matching single-line comments (//)
const regexSingleLineComments = /\/\/[^\n]*/g;
code = code.replace(regexSingleLineComments, match => {
return `<span class="csharp-comment">${match}</span>`;
});
// Regex for matching multi-line comments (/* */)
const regexMultiLineComments = /\/\*[\s\S]*?\*\//g;
code = code.replace(regexMultiLineComments, match => {
return `<span class="csharp-comment">${match}</span>`;
});
// Now highlight C# keywords, types, methods, etc. (excluding anything inside comments)
// Highlight C# keywords
const regexKeywords = new RegExp(`\\b(${csharpKeywords.join("|")})\\b`, "g");
code = code.replace(regexKeywords, '<span class="csharp-keyword">$1</span>');
// Highlight C# types
const regexTypes = new RegExp(`\\b(${csharpTypes.join("|")})\\b`, "g");
code = code.replace(regexTypes, '<span class="csharp-type">$1</span>');
// Highlight C# method names
const regexMethods = /\b([a-zA-Z_][a-zA-Z0-9_]*)\s*(?=\()/g;
code = code.replace(regexMethods, '<span class="csharp-method">$1</span>');
// Highlight C# class names
const regexClasses = /\b([A-Z][a-zA-Z0-9_]*)\b/g;
code = code.replace(regexClasses, (match, p1) => {
return isKeyword(p1) ? p1 : `<span class="csharp-class">${p1}</span>`;
});
// Highlight C# property names
const regexProperties = /\b([a-zA-Z_][a-zA-Z0-9_]*)\s*(?=\s*{)/g;
code = code.replace(regexProperties, (match, p1) => {
return isKeyword(p1) ? p1 : `<span class="csharp-property">${p1}</span>`;
});
// Set the processed code back to the pre tag
pre.innerHTML = code;
});