189 lines
6.4 KiB
HTML
189 lines
6.4 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Test Http Request From JS</title>
|
|
<link href="asciidoctor/asciidoctor.css" rel="stylesheet" />
|
|
</head>
|
|
<body onload="init()">
|
|
<h3><label for="branch-name-selector">Repository branch</label></h3>
|
|
<select id="branch-name-selector" onchange="onChangeBranch(this.value)">
|
|
<!-- dynamically filled by initBranchNameSelector() -->
|
|
</select>
|
|
<h3><label for="rule-key-selector">Rule Key</label></h3>
|
|
<select id="rule-key-selector" onchange="onChangeRuleKey(this.value)">
|
|
<!-- dynamically filled by initRuleKeySelector() -->
|
|
</select>
|
|
<br />
|
|
<div id="div-result"></div>
|
|
</body>
|
|
<script src="asciidoctor/asciidoctor.js"></script>
|
|
<script>
|
|
function init() {
|
|
initBranchNameSelector();
|
|
}
|
|
|
|
/** @type HTMLSelectElement */
|
|
function branchNameSelector() {
|
|
return /** @type HTMLSelectElement */ document.getElementById("branch-name-selector");
|
|
}
|
|
|
|
/** @type HTMLSelectElement */
|
|
function ruleKeySelector() {
|
|
return /** @type HTMLSelectElement */ document.getElementById("rule-key-selector");
|
|
}
|
|
|
|
/** @type HTMLDivElement */
|
|
function divResult() {
|
|
return /** @type HTMLDivElement */ document.getElementById("div-result");
|
|
}
|
|
|
|
function initBranchNameSelector() {
|
|
const selectElement = branchNameSelector();
|
|
clearSelect(selectElement);
|
|
addSelectOption(selectElement, "", "loading...");
|
|
httpGetGithubApi("/repos/SonarSource/rspec/branches", function(body) {
|
|
const branchList = JSON.parse(body);
|
|
clearSelect(selectElement);
|
|
for (let i = 0; i < branchList.length; i++) {
|
|
const branchName = branchList[i].name;
|
|
addSelectOption(selectElement, branchName, branchName);
|
|
if (branchName === "master") {
|
|
selectElement.selectedIndex = i;
|
|
}
|
|
}
|
|
initRuleKeySelector();
|
|
});
|
|
}
|
|
|
|
function fileList(/*string*/relativePath, /*string*/branchName, /*function*/fileListConsumer) {
|
|
httpGetGithubApi("/repos/SonarSource/rspec/contents/" + relativePath + "?ref=" + branchName, function (body) {
|
|
let files = /** @type object[] */ JSON.parse(body);
|
|
fileListConsumer(files);
|
|
});
|
|
}
|
|
|
|
function initRuleKeySelector() {
|
|
const selectElement = ruleKeySelector();
|
|
const branchName = branchNameSelector().value;
|
|
clearSelect(selectElement);
|
|
addSelectOption(selectElement, "", "loading...");
|
|
fileList("rules", branchName, function(files) {
|
|
clearSelect(selectElement);
|
|
files.filter(file => file.type === "dir")
|
|
.sort((a,b) => (parseInt(a.name.substr(1)) < parseInt(b.name.substr(1))) ? -1 : 1)
|
|
.forEach(file => addSelectOption(selectElement, file.name, file.name));
|
|
displaySelectedRule();
|
|
});
|
|
}
|
|
|
|
function displaySelectedRule() {
|
|
const branchName = branchNameSelector().value;
|
|
const ruleKey = ruleKeySelector().value;
|
|
divResult().innerHTML = "loading...";
|
|
if (ruleKey === "") {
|
|
return;
|
|
}
|
|
fileList("rules/" + ruleKey, branchName, function(files) {
|
|
const languages = /** @type string[] */ files.filter(file => file.type === "dir")
|
|
.map(file => file.name)
|
|
.sort();
|
|
divResult().innerHTML = "" +
|
|
"<p>" +
|
|
"Languages: " + languages.map(language => "<a href='#language-" + language + "'>" + language + "</a>").join(", ") +
|
|
"</p>";
|
|
|
|
languages.forEach(language => {
|
|
const asciiDoctor = Asciidoctor();
|
|
const rulesDir = "https://raw.githubusercontent.com/SonarSource/rspec/" + branchName + "/rules";
|
|
const ruleFile = rulesDir + "/" + ruleKey + "/" + language + "/rule.adoc";
|
|
httpGet(ruleFile, function(body) {
|
|
const baseDir = parentDirectory(ruleFile);
|
|
const opts = {safe: 'safe', base_dir: baseDir, attributes: { } };
|
|
divResult().innerHTML += "<hr /><h1 id='language-" + language + "'>◖ " + language + " ◗</h1><hr />";
|
|
divResult().innerHTML += asciiDoctor.convert(body, opts);
|
|
},
|
|
"*",
|
|
function(errorMessage) {
|
|
divResult().innerHTML += "<hr /><h1 id='language-" + language + "'>◖ " + language + " ◗</h1><hr />";
|
|
divResult().innerHTML += "<p>" + errorMessage + + "</p>";
|
|
});
|
|
});
|
|
});
|
|
}
|
|
|
|
function clearSelect(/*HTMLSelectElement*/selectElement) {
|
|
while (selectElement.options.length > 0) {
|
|
selectElement.options.remove(0);
|
|
}
|
|
}
|
|
|
|
function addSelectOption(/*HTMLSelectElement*/selectElement, /*string*/value, /*string*/text) {
|
|
const opt = document.createElement('option');
|
|
opt.appendChild(document.createTextNode(text));
|
|
opt.value = value;
|
|
selectElement.appendChild(opt);
|
|
}
|
|
|
|
function onChangeBranch(/*string*/branchName) {
|
|
initRuleKeySelector();
|
|
}
|
|
|
|
function onChangeRuleKey(/*string*/ruleKey) {
|
|
displaySelectedRule();
|
|
}
|
|
|
|
function httpGet(/*string*/url, /*function*/bodyConsumer, /*string?*/accept, /*function*/errorConsumer) /*void*/ {
|
|
if (typeof accept === "undefined") {
|
|
accept = "*";
|
|
}
|
|
if (typeof errorConsumer === "undefined") {
|
|
errorConsumer = function (errorMessage) {
|
|
console.error(errorMessage);
|
|
};
|
|
}
|
|
try {
|
|
const xhr = new XMLHttpRequest();
|
|
xhr.open('GET', url, true);
|
|
xhr.setRequestHeader("Accept", accept);
|
|
xhr.onreadystatechange = function () {
|
|
if (xhr.readyState === 4) {
|
|
if (xhr.status === 0 /*local files*/ || xhr.status === 200) {
|
|
bodyConsumer(xhr.responseText);
|
|
} else {
|
|
errorConsumer("ERROR " + xhr.status + " while loading " + url);
|
|
}
|
|
}
|
|
}
|
|
xhr.send();
|
|
} catch (e) {
|
|
errorConsumer("ERROR: " +exceptionMessage(e));
|
|
}
|
|
}
|
|
|
|
function httpGetGithubApi(/*string*/relativeUrl, /*function*/bodyConsumer) {
|
|
const url = "https://api.github.com" + relativeUrl;
|
|
httpGet(url, bodyConsumer, "application/vnd.github.v3.html");
|
|
}
|
|
|
|
|
|
function exceptionMessage(e) {
|
|
let message = "";
|
|
if (e.message) {
|
|
message += e.message;
|
|
}
|
|
if (e.stack) {
|
|
message += ' | stack: ' + e.stack;
|
|
}
|
|
if (!e.message && !e.stack) {
|
|
message += e;
|
|
}
|
|
return message;
|
|
}
|
|
|
|
function parentDirectory(/*string*/path) {
|
|
return path.replace(/\/[^/]*$/, "/");
|
|
}
|
|
</script>
|
|
</html>
|