From 5b65b54eaa4c43d6d48d0f4378fe75ed5d4144d0 Mon Sep 17 00:00:00 2001 From: Mihir Okte Date: Wed, 30 Jun 2021 12:18:26 +0530 Subject: [PATCH 1/8] Testing some initial code --- index.html | 20 +++++++++++++++++++- package.json | 2 +- src/css/problem-pane.css | 16 ++++++++++++++++ 3 files changed, 36 insertions(+), 2 deletions(-) create mode 100644 src/css/problem-pane.css diff --git a/index.html b/index.html index 44abdc6..82e2186 100644 --- a/index.html +++ b/index.html @@ -13,6 +13,7 @@ + @@ -71,7 +72,24 @@
- + +
diff --git a/package.json b/package.json index a96b38b..f35802a 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "Kanon", + "name": "kanon", "version": "1.0.0", "description": "A live programming environment specialized for data structure programming.", "main": "app.js", diff --git a/src/css/problem-pane.css b/src/css/problem-pane.css new file mode 100644 index 0000000..006c2d1 --- /dev/null +++ b/src/css/problem-pane.css @@ -0,0 +1,16 @@ +.problem-ball { + position: absolute; + right: 20px; + bottom: 20px; + color:#ffffff; + background: #ff2424; + font-size:1.5em; + text-align: center; + z-index: 2; + width: 30px; + height: 30px; + border-radius: 15px; + line-height: 30px; + border: none; + /* outline: none; */ +} \ No newline at end of file From b112403a146f3a0d0b014b6037cbd008080a398e Mon Sep 17 00:00:00 2001 From: Mihir Okte Date: Fri, 2 Jul 2021 22:53:02 +0530 Subject: [PATCH 2/8] Code for global object errors and unhandled rejections events added --- index.html | 31 ++++++++++++++---------------- package.json | 1 + src/css/problem-pane.css | 34 +++++++++++++++++++++++++++++++++ src/import.js | 2 ++ src/js/problem-pane.js | 41 ++++++++++++++++++++++++++++++++++++++++ 5 files changed, 92 insertions(+), 17 deletions(-) create mode 100644 src/js/problem-pane.js diff --git a/index.html b/index.html index 82e2186..43cc53d 100644 --- a/index.html +++ b/index.html @@ -72,23 +72,10 @@
- -
@@ -104,6 +91,16 @@
+
+ + +
diff --git a/package.json b/package.json index f35802a..10ebbf4 100644 --- a/package.json +++ b/package.json @@ -30,6 +30,7 @@ "jquery": "3.6.0", "jquery-ui-dist": "1.12.1", "split-pane": "0.5.1", + "uncaught": "0.0.5", "vis": "4.17.0" }, "devDependencies": { diff --git a/src/css/problem-pane.css b/src/css/problem-pane.css index 006c2d1..c8ab189 100644 --- a/src/css/problem-pane.css +++ b/src/css/problem-pane.css @@ -13,4 +13,38 @@ line-height: 30px; border: none; /* outline: none; */ +} + +#probem-panel{ + background-color: white; + width: inherit; + height: inherit; + top:0; + left: 0; + right:0; + bottom: 0; + position: absolute; +} + +#close-button{ + right: 0; + top: 0; + display: none; + border:none; + background-color: transparent; + color: grey; + margin-top: 20px; + margin-bottom: 20px; + font-size: 1rem; + text-decoration: underline; +} + +#problems{ + top:0; + left:0; + display: none; + color:black; + font-size: 0.8rem; + height: auto; + overflow-y: scroll; } \ No newline at end of file diff --git a/src/import.js b/src/import.js index af6cdfe..379b08d 100644 --- a/src/import.js +++ b/src/import.js @@ -7,6 +7,7 @@ document.write(''); document.write(''); document.write(''); +document.write(''); document.write(''); document.write(''); document.write(''); @@ -30,3 +31,4 @@ document.write(''); document.write(''); document.write(''); +document.write(''); diff --git a/src/js/problem-pane.js b/src/js/problem-pane.js new file mode 100644 index 0000000..ec5ad92 --- /dev/null +++ b/src/js/problem-pane.js @@ -0,0 +1,41 @@ +var errors_list = ""; +var num_errors = 0; + +window.addEventListener('load', + function() { + if(num_errors){ + document.getElementById("problem-ball").style.display = "inline-block"; + } + else{ + document.getElementById("problem-ball").style.display = "none"; + } + + document.getElementById("problems-all").innerHTML = errors_list; + document.getElementById("problem-ball").innerHTML = num_errors; + }, false); + + + +uncaught.start(); +uncaught.addListener(function (error) { + errors_list += + "
" + error.message + "
"; + num_errors++; + document.getElementById("problems-all").innerHTML = errors_list; + document.getElementById("problem-ball").innerHTML = num_errors; +}); + + +function openPanel() { + document.getElementById("problem-panel").style.display = "block"; + document.getElementById("callTree").style.display = "none"; + document.getElementById("close-button").style.display = "block"; + document.getElementById("problems-all").style.display = "block"; + } + +function closePanel() { + document.getElementById("problem-panel").style.display = "none"; + document.getElementById("callTree").style.display = "block"; + document.getElementById("close-button").style.display = "none"; + document.getElementById("problems-all").style.display = "none"; + } \ No newline at end of file From c4227ba67ed9e14c480bd3e57346074056f05b8d Mon Sep 17 00:00:00 2001 From: Mihir Okte Date: Mon, 5 Jul 2021 23:22:34 +0530 Subject: [PATCH 3/8] Added Themes to select in editor --- index.html | 12 ++++++++-- json/themes.json | 41 +++++++++++++++++++++++++++++++++ src/import.js | 3 +++ src/js/editor.js | 6 +++++ src/js/loadThemes.js | 54 ++++++++++++++++++++++++++++++++++++++++++++ 5 files changed, 114 insertions(+), 2 deletions(-) create mode 100644 json/themes.json create mode 100644 src/js/loadThemes.js diff --git a/index.html b/index.html index 43cc53d..5d704bd 100644 --- a/index.html +++ b/index.html @@ -63,6 +63,14 @@ + + + + Select Themes: + + + +
@@ -74,7 +82,7 @@
-
@@ -92,7 +100,7 @@
- ') document.write(''); document.write(''); document.write(''); +document.write('') +document.write('') document.write(''); document.write(''); document.write(''); @@ -32,3 +34,4 @@ document.write(''); document.write(''); document.write(''); +document.write(''); diff --git a/src/js/editor.js b/src/js/editor.js index 1a2be47..ffda813 100644 --- a/src/js/editor.js +++ b/src/js/editor.js @@ -1,8 +1,13 @@ __$__.langTools = ace.require('ace/ext/language_tools'); +__$__.beautify = ace.require("ace/ext/beautify"); +__$__.themes = ace.require("ace/ext/themelist"); __$__.Range = ace.require('ace/range').Range; __$__.editor = ace.edit("editor"); __$__.editor.setOption('enableBasicAutocompletion', true); +__$__.editor.setOption('enableSnippets', true); +__$__.editor.setOption('enableLiveAutocompletion', false); __$__.startAutocomplete = __$__.editor.keyBinding.$handlers[0].commands.startAutocomplete.exec; +// __$__.beautify.beautify(__$__editor.getSession()); try { let code = window.localStorage.getItem('Kanon-Code'); @@ -14,6 +19,7 @@ try { __$__.editor.setValue(''); } + __$__.editor.getSession().setMode('ace/mode/javascript'); // __$__.editor.getSession().setUseWorker(false); diff --git a/src/js/loadThemes.js b/src/js/loadThemes.js new file mode 100644 index 0000000..d621a1f --- /dev/null +++ b/src/js/loadThemes.js @@ -0,0 +1,54 @@ +var kindvalue = 0; + +__$__.createSelectBoxTheme = function () { + // The list of themes files on the server is kept in .json format. + + const path_themes = 'json/themes.json' + + function jsonToArray(data) { + var arr = []; + for (var i = 0; i < data.length; i++) { + arr.push(data[i]); + } + return arr; + } + + // Delete all old elements in the select box + let parentElement = document.getElementById("selectTheme"); + while (parentElement.firstChild) { + parentElement.removeChild(parentElement.firstChild); + } + + // Insert new nodes to the select box + function makeNodes(arr) { + for (var i = 0; i < arr.length; i++) { + let op = document.createElement("option"); + op.value = arr[i]; + op.text = arr[i]; + parentElement.appendChild(op); + } + } + + function getJSONFrom(path, callback) { + jQuery.getJSON(path, function (data) { + callback(data); + }); + } + + getJSONFrom(path_themes, function (data) { + var arr = jsonToArray(data).reverse(); + makeNodes(arr); + }); + +}; + +__$__.pasteTheme = function () { + let selectedElement = jQuery("#selectTheme").val(); + + if (selectedElement) { + __$__.editor.setTheme('ace/theme/'+selectedElement); + } + else { + alert("Select one of the theme."); + } +} \ No newline at end of file From d99b1dc2bb87d096b3a39662eeedaf39763386c4 Mon Sep 17 00:00:00 2001 From: Mihir Okte Date: Tue, 6 Jul 2021 01:46:25 +0530 Subject: [PATCH 4/8] problems panel initial stage complete --- index.html | 13 +++++------- src/css/problem-pane.css | 13 +++++------- src/js/loadThemes.js | 2 +- src/js/problem-pane.js | 44 +++++++++++++++++++++++----------------- 4 files changed, 36 insertions(+), 36 deletions(-) diff --git a/index.html b/index.html index 5d704bd..18fc789 100644 --- a/index.html +++ b/index.html @@ -65,7 +65,6 @@ - Select Themes: @@ -80,10 +79,9 @@
+ - -
@@ -100,12 +98,11 @@
- -
diff --git a/src/css/problem-pane.css b/src/css/problem-pane.css index c8ab189..ee19790 100644 --- a/src/css/problem-pane.css +++ b/src/css/problem-pane.css @@ -1,4 +1,4 @@ -.problem-ball { +#problem-ball { position: absolute; right: 20px; bottom: 20px; @@ -24,10 +24,12 @@ right:0; bottom: 0; position: absolute; + height: auto; + overflow-y: scroll; } #close-button{ - right: 0; + left: 0; top: 0; display: none; border:none; @@ -39,12 +41,7 @@ text-decoration: underline; } -#problems{ - top:0; - left:0; +#all-errors{ display: none; color:black; - font-size: 0.8rem; - height: auto; - overflow-y: scroll; } \ No newline at end of file diff --git a/src/js/loadThemes.js b/src/js/loadThemes.js index d621a1f..cf4bc30 100644 --- a/src/js/loadThemes.js +++ b/src/js/loadThemes.js @@ -36,7 +36,7 @@ __$__.createSelectBoxTheme = function () { } getJSONFrom(path_themes, function (data) { - var arr = jsonToArray(data).reverse(); + var arr = jsonToArray(data); makeNodes(arr); }); diff --git a/src/js/problem-pane.js b/src/js/problem-pane.js index ec5ad92..1d6376f 100644 --- a/src/js/problem-pane.js +++ b/src/js/problem-pane.js @@ -3,39 +3,45 @@ var num_errors = 0; window.addEventListener('load', function() { - if(num_errors){ - document.getElementById("problem-ball").style.display = "inline-block"; - } - else{ - document.getElementById("problem-ball").style.display = "none"; - } - - document.getElementById("problems-all").innerHTML = errors_list; - document.getElementById("problem-ball").innerHTML = num_errors; + __$__.getErrors(); }, false); +__$__.goToLine = function(row,column){ + __$__.editor.getSession().documentToScreenPosition(row,column); +} + +__$__.getErrors = function(e){ + var annotations = __$__.editor.getSession().getAnnotations(); -uncaught.start(); -uncaught.addListener(function (error) { + for(var i=0; i" + error.message + "
"; + "
" + annotations[i].type.toUpperCase() + "
" + annotations[i].text + "
" + "

"; num_errors++; - document.getElementById("problems-all").innerHTML = errors_list; - document.getElementById("problem-ball").innerHTML = num_errors; -}); + } + document.getElementById("problem-ball").innerHTML = num_errors; + document.getElementById("all-errors").innerHTML = errors_list; + + num_errors = 0; + errors_list = ""; +} + +__$__.editor.on('change', function(e){ + setTimeout(__$__.getErrors(e), 0); +}); -function openPanel() { +__$__.openPanel = function() { document.getElementById("problem-panel").style.display = "block"; document.getElementById("callTree").style.display = "none"; document.getElementById("close-button").style.display = "block"; - document.getElementById("problems-all").style.display = "block"; + document.getElementById("all-errors").style.display = "block"; } -function closePanel() { +__$__.closePanel = function() { + document.getElementById("problem-panel").style.display = "none"; document.getElementById("callTree").style.display = "block"; document.getElementById("close-button").style.display = "none"; - document.getElementById("problems-all").style.display = "none"; + document.getElementById("all-errors").style.display = "none"; } \ No newline at end of file From d42434e48989254ce8663b1981c9511e83dc4c90 Mon Sep 17 00:00:00 2001 From: Mihir Okte Date: Wed, 14 Jul 2021 01:05:09 +0530 Subject: [PATCH 5/8] Fixed errors loading error --- src/js/problem-pane.js | 33 ++++++++++++++++++--------------- 1 file changed, 18 insertions(+), 15 deletions(-) diff --git a/src/js/problem-pane.js b/src/js/problem-pane.js index 1d6376f..650dc4a 100644 --- a/src/js/problem-pane.js +++ b/src/js/problem-pane.js @@ -1,5 +1,4 @@ var errors_list = ""; -var num_errors = 0; window.addEventListener('load', function() { @@ -11,25 +10,29 @@ __$__.goToLine = function(row,column){ __$__.editor.getSession().documentToScreenPosition(row,column); } -__$__.getErrors = function(e){ - var annotations = __$__.editor.getSession().getAnnotations(); +if(__$__.editor){ + __$__.editor.on('change', function(e){ + __$__.getErrors(e); + },false); +} - for(var i=0; i" + annotations[i].type.toUpperCase() + "
" + annotations[i].text + "
" + "

"; - num_errors++; - } +setInterval(__$__.getErrors,100); - document.getElementById("problem-ball").innerHTML = num_errors; - document.getElementById("all-errors").innerHTML = errors_list; +__$__.getErrors = function(){ - num_errors = 0; - errors_list = ""; + var annotations = __$__.editor.getSession().getAnnotations(); + document.getElementById("problem-ball").innerHTML = annotations.length; + + for(var i=0; i" + annotations[i].type.toUpperCase() + "
" + annotations[i].text + "
" + "

"; + } + + document.getElementById("all-errors").innerHTML = errors_list; + + errors_list = ""; } -__$__.editor.on('change', function(e){ - setTimeout(__$__.getErrors(e), 0); -}); __$__.openPanel = function() { document.getElementById("problem-panel").style.display = "block"; From c371fa5c36f5742fd9599f28fe2cfaf2c9f1a4a3 Mon Sep 17 00:00:00 2001 From: Mihir Okte Date: Wed, 14 Jul 2021 02:36:47 +0530 Subject: [PATCH 6/8] Some experimental changes --- src/js/problem-pane.js | 41 +++++++++++++++++++++-------------------- 1 file changed, 21 insertions(+), 20 deletions(-) diff --git a/src/js/problem-pane.js b/src/js/problem-pane.js index 650dc4a..a15ebdc 100644 --- a/src/js/problem-pane.js +++ b/src/js/problem-pane.js @@ -1,39 +1,40 @@ var errors_list = ""; +var annotations; window.addEventListener('load', - function() { - __$__.getErrors(); + function(e) { + setInterval(__$__.getErrors,100); }, false); -__$__.goToLine = function(row,column){ - __$__.editor.getSession().documentToScreenPosition(row,column); -} - if(__$__.editor){ __$__.editor.on('change', function(e){ - __$__.getErrors(e); + setInterval(__$__.getErrors,100); },false); } -setInterval(__$__.getErrors,100); -__$__.getErrors = function(){ +__$__.getErrors = function(e){ + annotations = __$__.editor.getSession().getAnnotations(); + document.getElementById("problem-ball").innerText = annotations.length; - var annotations = __$__.editor.getSession().getAnnotations(); - document.getElementById("problem-ball").innerHTML = annotations.length; - - for(var i=0; i" + annotations[i].type.toUpperCase() + "
" + annotations[i].text + "
" + "

"; - } - - document.getElementById("all-errors").innerHTML = errors_list; + for(var i=0; i" + annotations[i].type.toUpperCase() + "
" + annotations[i].text + "
" + + `

"; + } - errors_list = ""; + document.getElementById("all-errors").innerHTML = errors_list; + + + for(var i=0; i Date: Fri, 16 Jul 2021 22:10:04 +0530 Subject: [PATCH 7/8] Added beautify inbuilt extension --- index.html | 4 ++++ src/js/beautifyenable.js | 5 +++++ src/js/editor.js | 2 -- 3 files changed, 9 insertions(+), 2 deletions(-) create mode 100644 src/js/beautifyenable.js diff --git a/index.html b/index.html index 18fc789..6c083f9 100644 --- a/index.html +++ b/index.html @@ -56,6 +56,10 @@
+ + + + Select Examples: diff --git a/src/js/beautifyenable.js b/src/js/beautifyenable.js new file mode 100644 index 0000000..3257ed6 --- /dev/null +++ b/src/js/beautifyenable.js @@ -0,0 +1,5 @@ +__$__.beautify = ace.require("ace/ext/beautify"); + +__$__.beautifyEnable = function(){ + __$__.beautify.beautify(__$__.editor.getSession()); +} \ No newline at end of file diff --git a/src/js/editor.js b/src/js/editor.js index ffda813..e74b6b4 100644 --- a/src/js/editor.js +++ b/src/js/editor.js @@ -1,5 +1,4 @@ __$__.langTools = ace.require('ace/ext/language_tools'); -__$__.beautify = ace.require("ace/ext/beautify"); __$__.themes = ace.require("ace/ext/themelist"); __$__.Range = ace.require('ace/range').Range; __$__.editor = ace.edit("editor"); @@ -7,7 +6,6 @@ __$__.editor.setOption('enableBasicAutocompletion', true); __$__.editor.setOption('enableSnippets', true); __$__.editor.setOption('enableLiveAutocompletion', false); __$__.startAutocomplete = __$__.editor.keyBinding.$handlers[0].commands.startAutocomplete.exec; -// __$__.beautify.beautify(__$__editor.getSession()); try { let code = window.localStorage.getItem('Kanon-Code'); From 511caed4b3b8391720fac2a7ee58eeaf6c683ee6 Mon Sep 17 00:00:00 2001 From: Mihir Okte Date: Sat, 17 Jul 2021 02:01:01 +0530 Subject: [PATCH 8/8] Error to move cursor resolved --- index.html | 2 +- package.json | 1 + src/import.js | 1 + src/js/beautifyenable.js | 12 ++++++++- src/js/problem-pane.js | 56 ++++++++++++++++++++++------------------ 5 files changed, 45 insertions(+), 27 deletions(-) diff --git a/index.html b/index.html index 6c083f9..9e0e77e 100644 --- a/index.html +++ b/index.html @@ -59,7 +59,7 @@ - + Select Examples: diff --git a/package.json b/package.json index 10ebbf4..121cd02 100644 --- a/package.json +++ b/package.json @@ -29,6 +29,7 @@ "esprima": "3.1.3", "jquery": "3.6.0", "jquery-ui-dist": "1.12.1", + "js-beautify": "^1.14.0", "split-pane": "0.5.1", "uncaught": "0.0.5", "vis": "4.17.0" diff --git a/src/import.js b/src/import.js index 463adb2..c644df7 100644 --- a/src/import.js +++ b/src/import.js @@ -10,6 +10,7 @@ document.write(''); document.write(''); document.write(''); +document.write(''); document.write(''); document.write(''); document.write(''); diff --git a/src/js/beautifyenable.js b/src/js/beautifyenable.js index 3257ed6..8d2c641 100644 --- a/src/js/beautifyenable.js +++ b/src/js/beautifyenable.js @@ -1,5 +1,15 @@ __$__.beautify = ace.require("ace/ext/beautify"); +__$__.js_beautify = require("js-beautify").js; __$__.beautifyEnable = function(){ - __$__.beautify.beautify(__$__.editor.getSession()); + // __$__.beautify.beautify(__$__.editor.getSession()); + __$__.val = editor.session.getValue(); + + __$__.array = __$__.val.split(/\n/); + __$__.array[0] = __$__.array[0].trim(); + __$__.val = __$__.array.join("\n"); + + //Actual beautify (prettify) + __$__.val = __$__.js_beautify(__$__.val); + __$__.editor.getSession().setValue(__$__.val); } \ No newline at end of file diff --git a/src/js/problem-pane.js b/src/js/problem-pane.js index a15ebdc..46931e1 100644 --- a/src/js/problem-pane.js +++ b/src/js/problem-pane.js @@ -1,40 +1,46 @@ var errors_list = ""; -var annotations; + +__$__.getErrors = async function(e) { + + await new Promise((resolve, reject) => setTimeout(resolve, 1000)); + + let annotations = await __$__.editor.getSession().getAnnotations(); + + document.getElementById("problem-ball").innerText = annotations.length; + + for(var i=0; i" + annotations[i].type.toUpperCase() + "
" + annotations[i].text + "
" + + `

"; + } + + document.getElementById("all-errors").innerHTML = errors_list; + + for(var i=0; i" + annotations[i].type.toUpperCase() + "
" + annotations[i].text + "
" + - `

"; - } - - document.getElementById("all-errors").innerHTML = errors_list; - - - for(var i=0; i