Skip to content

a new version of Piethon online #2

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
B3ns44d wants to merge 6 commits into
base: master
Choose a base branch
from
Open

a new version of Piethon online #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
bd705dc
add a container and make thing more clear
B3ns44d Feb 7, 2021
f67d04a
change the whole style
B3ns44d Feb 7, 2021
c520d2b
// position: 'absolute' from this..css
B3ns44d Feb 7, 2021
fc7cf64
add ability change editor theme
B3ns44d Feb 7, 2021
d0b60ab
editor theme list
B3ns44d Feb 7, 2021
4002874
optimise css
B3ns44d Feb 7, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
122 changes: 122 additions & 0 deletions editorTheme.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,122 @@
var editorTheme = [
{
name: "Github",
theme: "github",
},
{
name: "Terminal",
theme: "terminal",
},
{
name: "Ambiance",
theme: "ambiance",
},
{
name: "Chaos",
theme: "chaos",
},
{
name: "Chrome",
theme: "chrome",
},
{
name: "Clouds Midnight",
theme: "clouds_midnight",
},
{
name: "Clouds",
theme: "clouds",
},
{
name: "Cobalt",
theme: "cobalt",
},
{
name: "Crimson Editor",
theme: "crimson_editor",
},
{
name: "Dawn",
theme: "dawn",
},
{
name: "Dreamweaver",
theme: "dreamweaver",
},
{
name: "Eclipse",
theme: "eclipse",
},
{
name: "Idle Fingers",
theme: "idle_fingers",
},
{
name: "Kr",
theme: "kr",
},
{
name: "Merbivore",
theme: "merbivore",
},
{
name: "Merbivore Soft",
theme: "merbivore_soft",
},
{
name: "Mono Industrial",
theme: "mono_industrial",
},
{
name: "Monokai",
theme: "monokai",
},
{
name: "Pastel on dark",
theme: "pastel_on_dark",
},
{
name: "Solarized dark",
theme: "solarized_dark",
},
{
name: "Solarized light",
theme: "solarized_light",
},
{
name: "Textmate",
theme: "textmate",
},
{
name: "Tomorrow",
theme: "tomorrow",
},
{
name: "Tomorrow night",
theme: "tomorrow_night",
},
{
name: "Tomorrow night blue",
theme: "tomorrow_night_blue",
},
{
name: "Tomorrow night bright",
theme: "tomorrow_night_bright",
},
{
name: "Tomorrow night eighties",
theme: "tomorrow_night_eighties",
},
{
name: "Twilight",
theme: "twilight",
},
{
name: "Vibrant ink",
theme: "vibrant_ink",
},
{
name: "Xcode",
theme: "xcode",
},
];
173 changes: 99 additions & 74 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,85 +1,110 @@
<!DOCTYPE html>
<html lang="en">

<head>
<title>Piethon online</title>
<script src="grammar/piethon.js"></script>
<script src="main.js"></script>
<script src="examples.js"></script>
<link rel="stylesheet" type="text/css" media="screen" href="styles.css">
<title>Piethon online</title>
<script src="grammar/piethon.js"></script>
<script src="main.js"></script>
<script src="examples.js"></script>
<script src="editorTheme.js"></script>
<link rel="stylesheet" type="text/css" media="screen" href="styles.css">
</head>

<body>
<div id="editor"># Say hello!
x = "Hello, piethon"
print x
</div>
<div id="navbar">
<button id="runbtn">Run</button>
<select id="examples" name="Examples">
<option value="-1">Examples</option>
</select>
</div>
<div id="console">
<button id="clearbtn">Clear</button>
</div>
<div class="container">
<div id="editor">print "Hello, World"</div>
<div id="navbar">
<button id="runbtn">Run</button>
<button id="clearbtn">Clear</button>
<select id="examples" name="Examples">
<option value="-1">Examples</option>
</select>

</div>
<div id="console">

</div>
<div id="footer">
<select id="editorTheme" name="editorTheme">
<option value="-1">Theme</option>
</select>
<!-- fork it on github -->
</div>
</div>

<script src="lib/jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="lib/jqconsole.js" type="text/javascript" charset="utf-8"></script>
<script src="lib/ace/ace.js" type="text/javascript" charset="utf-8"></script>
<script>
// Set up the console
var jqconsole = $('#console').jqconsole('', '>>>');
var startPrompt = function () {
// Start the prompt with history enabled.
jqconsole.Prompt(true, function (input) {
// Output input with the class jqconsole-output.
jqconsole.Write(input + '\n', 'jqconsole-output');
// Restart the prompt.
startPrompt();
});
};
//startPrompt();
jqconsole.Write('>> ', 'jqconsole-output');
// Set up the editor
var editor = ace.edit("editor");
var editorThemeColor = "idle_fingers";
editor.setTheme(`ace/theme/idle_fingers`)
editor.getSession().setMode("ace/mode/python");

<script src="lib/jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="lib/jqconsole.js" type="text/javascript" charset="utf-8"></script>
<script src="lib/ace/ace.js" type="text/javascript" charset="utf-8"></script>
<script>
// Set up the console
var jqconsole = $('#console').jqconsole('', '>>>');
var startPrompt = function () {
// Start the prompt with history enabled.
jqconsole.Prompt(true, function (input) {
// Output input with the class jqconsole-output.
jqconsole.Write(input + '\n', 'jqconsole-output');
// Restart the prompt.
startPrompt();
});
};
//startPrompt();
jqconsole.Write('>> ','jqconsole-output');
// Set up the editor
var editor = ace.edit("editor");
editor.setTheme("ace/theme/idle_fingers");
editor.getSession().setMode("ace/mode/python");
// Handle run button interaction
$("#runbtn").click(function () {
resetForRun();
try {
// Grammar is not perfect, have to have it end with a line break
var output = piethon.parse(editor.getValue() + '\n')
if (output == true) {
jqconsole.Write('piethon\nSyntactically correct program: ' + output + '\nRunning program:\n', 'jqconsole-output');
eval(finalprogram);
jqconsole.Write('\n', 'jqconsole-output');
}
} catch (exception) {
jqconsole.Write(exception + '\n\n', 'jqconsole-output');
}
jqconsole.Write('>> ', 'jqconsole-output');
});

// Handle run button interaction
$( "#runbtn" ).click(function() {
resetForRun();
try {
// Grammar is not perfect, have to have it end with a line break
var output = piethon.parse(editor.getValue()+'\n')
if(output == true) {
jqconsole.Write('piethon\nSyntactically correct program: '+output+'\nRunning program:\n', 'jqconsole-output');
eval(finalprogram);
jqconsole.Write('\n', 'jqconsole-output');
}
} catch(exception) {
jqconsole.Write(exception + '\n\n', 'jqconsole-output');
// Clear console button
$("#clearbtn").click(function () {
jqconsole.Reset();
});
// Populate the dropdown editor theme select
var editorThemeSelect = $("#editorTheme");
for (var i = 0; i < editorTheme.length; i++) {
editorThemeSelect.append(
'<option value="' + i + '">--' + editorTheme[i].name + "</option>"
);
}
jqconsole.Write('>> ','jqconsole-output');
});

// Clear console button
$( "#clearbtn" ).click(function() {
jqconsole.Reset();
});

// Populate the dropdown examples select
var select = $('#examples');
for(var i =0;i<examples.length;i++) {
select.append('<option value="'+i+'">--'+examples[i].name+'</option>');
}
select.change(function() {
var selectedndx = parseInt($( "#examples option:selected" ).attr('value'), 10);
if(selectedndx > -1) {
editor.setValue(examples[selectedndx].code);
editor.gotoLine(1);
editorThemeSelect.change(function () {
var selected = parseInt($("#editorTheme option:selected").attr("value"), 10);
if (selected > -1) {
editor.setTheme(`ace/theme/${editorTheme[selected].theme}`);
}
});

// Populate the dropdown examples select
var select = $('#examples');
for (var i = 0; i < examples.length; i++) {
select.append('<option value="' + i + '">--' + examples[i].name + '</option>');
}
});


</script>
select.change(function () {
var selectedndx = parseInt($("#examples option:selected").attr('value'), 10);
if (selectedndx > -1) {
editor.setValue(examples[selectedndx].code);
editor.gotoLine(1);
}
});


</script>
</body>

</html>
2 changes: 1 addition & 1 deletion lib/jqconsole.js
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading