|
|
@@ -56,6 +56,66 @@
|
|
|
'.navbarBottom .links .link'];
|
|
|
|
|
|
var run = function () {
|
|
|
+
|
|
|
+ // #region - Examples playgrounds
|
|
|
+ var examplesButton = document.getElementsByClassName("examplesButton");
|
|
|
+ var isExamplesDisplayed = false;
|
|
|
+ for(var i = 0; i < examplesButton.length; i++) {
|
|
|
+ examplesButton[i].onclick = function () {
|
|
|
+ isExamplesDisplayed = !isExamplesDisplayed;
|
|
|
+ if (isExamplesDisplayed) {
|
|
|
+ document.getElementById("exampleList").style.display = "block";
|
|
|
+ document.getElementsByClassName("wrapper")[0].style.width = "calc(100% - 400px)";
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ document.getElementById("exampleList").style.display = "none";
|
|
|
+ document.getElementsByClassName("wrapper")[0].style.width = "100%";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ var filterBarClear = document.getElementById("filterBarClear");
|
|
|
+ var filterBar = document.getElementById("filterBar");
|
|
|
+ var filter = function () {
|
|
|
+ var filterText = filterBar.value.toLowerCase();
|
|
|
+ if (filterText == "") filterBarClear.style.display = "none";
|
|
|
+ else filterBarClear.style.display = "inline-block";
|
|
|
+
|
|
|
+ var lines = document.getElementsByClassName("itemLine");
|
|
|
+ for (var lineIndex = 0; lineIndex < lines.length; lineIndex++) {
|
|
|
+ var line = lines[lineIndex];
|
|
|
+ if (line.innerText.toLowerCase().indexOf(filterText) > -1) {
|
|
|
+ line.style.display = "";
|
|
|
+ } else {
|
|
|
+ line.style.display = "none";
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ var categories = document.getElementsByClassName("categoryContainer");
|
|
|
+ var displayCount = categories.length;
|
|
|
+
|
|
|
+ for (var categoryIndex = 0; categoryIndex < categories.length; categoryIndex++) {
|
|
|
+ var category = categories[categoryIndex];
|
|
|
+ category.style.display = "block";
|
|
|
+ if (category.clientHeight < 25) {
|
|
|
+ category.style.display = "none";
|
|
|
+ displayCount--;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ if (displayCount == 0) document.getElementById("noResultsContainer").style.display = "block";
|
|
|
+ else document.getElementById("noResultsContainer").style.display = "none";
|
|
|
+ }
|
|
|
+ filterBar.oninput = function () {
|
|
|
+ filter();
|
|
|
+ }
|
|
|
+ filterBarClear.onclick = function () {
|
|
|
+ filterBar.value = "";
|
|
|
+ filter();
|
|
|
+ }
|
|
|
+ // #endregion
|
|
|
+
|
|
|
var blockEditorChange = false;
|
|
|
|
|
|
var markDirty = function () {
|
|
|
@@ -63,11 +123,9 @@
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
-
|
|
|
- setToMultipleID("currentScript", "innerHTML", "Custom");
|
|
|
+ // setToMultipleID("currentScript", "innerHTML", "Custom");
|
|
|
setToMultipleID("safemodeToggle", "addClass", "checked");
|
|
|
setToMultipleID("minimapToggle", "addClass", "checked");
|
|
|
-
|
|
|
setToMultipleID('safemodeToggle', 'innerHTML', 'Safe mode <i class="fa fa-check-square" aria-hidden="true"></i>');
|
|
|
}
|
|
|
|
|
|
@@ -107,7 +165,7 @@
|
|
|
blockEditorChange = false;
|
|
|
compileAndRun();
|
|
|
|
|
|
- setToMultipleID("currentScript", "innerHTML", title);
|
|
|
+ // setToMultipleID("currentScript", "innerHTML", title);
|
|
|
|
|
|
currentSnippetToken = null;
|
|
|
}
|
|
|
@@ -133,33 +191,86 @@
|
|
|
var loadScriptsList = function () {
|
|
|
var xhr = new XMLHttpRequest();
|
|
|
|
|
|
- xhr.open('GET', 'scripts/scripts.txt', true);
|
|
|
+ xhr.open('GET', 'examples/list.json', true);
|
|
|
|
|
|
xhr.onreadystatechange = function () {
|
|
|
if (xhr.readyState === 4) {
|
|
|
if (xhr.status === 200) {
|
|
|
- scripts = xhr.responseText.split("\n");
|
|
|
+ scripts = JSON.parse(xhr.response)["examples"];
|
|
|
+
|
|
|
+ function sortScriptsList(a, b) {
|
|
|
+ if (a.title < b.title) return -1;
|
|
|
+ else return 1;
|
|
|
+ return 0;
|
|
|
+ }
|
|
|
+ scripts.sort(sortScriptsList);
|
|
|
+
|
|
|
+ var exampleList = document.getElementById("exampleList");
|
|
|
+
|
|
|
+ for (var i = 0; i < scripts.length; i++) {
|
|
|
+ scripts[i].samples.sort(sortScriptsList);
|
|
|
+
|
|
|
+ var exampleCategory = document.createElement("div");
|
|
|
+ exampleCategory.classList.add("categoryContainer");
|
|
|
+
|
|
|
+ var exampleCategoryTitle = document.createElement("p");
|
|
|
+ exampleCategoryTitle.innerText = scripts[i].title;
|
|
|
+ exampleCategory.appendChild(exampleCategoryTitle);
|
|
|
|
|
|
- for (var i = 0; i < multipleSize.length; i++) {
|
|
|
- var ul = document.getElementById("scriptsList" + multipleSize[i]);
|
|
|
+ for (var ii = 0; ii < scripts[i].samples.length; ii++) {
|
|
|
+ var example = document.createElement("div");
|
|
|
+ example.classList.add("itemLine");
|
|
|
+ example.id = ii;
|
|
|
|
|
|
- var index;
|
|
|
- for (index = 0; index < scripts.length; index++) {
|
|
|
- var option = document.createElement("li");
|
|
|
- var a = document.createElement("a");
|
|
|
- a.href = "#";
|
|
|
- a.innerHTML = (index + 1) + " - " + scripts[index];
|
|
|
- a.scriptLinkIndex = index + 1;
|
|
|
- //a.onclick = onScriptClick;
|
|
|
- option.scriptLinkIndex = index + 1;
|
|
|
- option.onclick = onScriptClick;
|
|
|
+ var exampleImg = document.createElement("img");
|
|
|
+ exampleImg.src = "examples/" + scripts[i].samples[ii].icon;
|
|
|
|
|
|
- option.appendChild(a);
|
|
|
+ var exampleContent = document.createElement("div");
|
|
|
+ exampleContent.classList.add("itemContent");
|
|
|
|
|
|
- ul.appendChild(option);
|
|
|
+ var exampleContentLink = document.createElement("div");
|
|
|
+ exampleContentLink.classList.add("itemContentLink");
|
|
|
+
|
|
|
+ var exampleTitle = document.createElement("h3");
|
|
|
+ exampleTitle.classList.add("exampleCategoryTitle");
|
|
|
+ exampleTitle.innerText = scripts[i].samples[ii].title;
|
|
|
+ var exampleDescr = document.createElement("div");
|
|
|
+ exampleDescr.classList.add("itemLineChild");
|
|
|
+ exampleDescr.innerText = scripts[i].samples[ii].description;
|
|
|
+
|
|
|
+ var exampleDocLink = document.createElement("a");
|
|
|
+ exampleDocLink.classList.add("itemLineDocLink");
|
|
|
+ exampleDocLink.innerText = "Documentation";
|
|
|
+ exampleDocLink.href = scripts[i].samples[ii].doc;
|
|
|
+ exampleDocLink.target = "_blank";
|
|
|
+
|
|
|
+ var examplePGLink = document.createElement("a");
|
|
|
+ examplePGLink.classList.add("itemLinePGLink");
|
|
|
+ examplePGLink.innerText = "Display";
|
|
|
+ examplePGLink.href = scripts[i].samples[ii].PGID;
|
|
|
+
|
|
|
+ exampleContentLink.appendChild(exampleTitle);
|
|
|
+ exampleContentLink.appendChild(exampleDescr);
|
|
|
+ exampleContent.appendChild(exampleContentLink);
|
|
|
+ exampleContent.appendChild(exampleDocLink);
|
|
|
+ exampleContent.appendChild(examplePGLink);
|
|
|
+
|
|
|
+ example.appendChild(exampleImg);
|
|
|
+ example.appendChild(exampleContent);
|
|
|
+
|
|
|
+ exampleCategory.appendChild(example);
|
|
|
}
|
|
|
+
|
|
|
+ exampleList.appendChild(exampleCategory);
|
|
|
}
|
|
|
|
|
|
+ var noResultContainer = document.createElement("div");
|
|
|
+ noResultContainer.id = "noResultsContainer";
|
|
|
+ noResultContainer.classList.add("categoryContainer");
|
|
|
+ noResultContainer.style.display = "none";
|
|
|
+ noResultContainer.innerHTML = "<p id='noResults'>No results found.</p>";
|
|
|
+ exampleList.appendChild(noResultContainer);
|
|
|
+
|
|
|
if (!location.hash) {
|
|
|
// Query string
|
|
|
var queryString = window.location.search;
|
|
|
@@ -932,7 +1043,7 @@
|
|
|
blockEditorChange = false;
|
|
|
compileAndRun();
|
|
|
|
|
|
- setToMultipleID("currentScript", "innerHTML", "Custom");
|
|
|
+ // setToMultipleID("currentScript", "innerHTML", "Custom");
|
|
|
} else if (firstTime) {
|
|
|
location.href = location.href.replace(location.hash, "");
|
|
|
if (scripts) {
|
|
|
@@ -1026,4 +1137,4 @@
|
|
|
}
|
|
|
};
|
|
|
xhr.send(null);
|
|
|
-})();
|
|
|
+})();
|
Jaskar
