mirror
/
pyTermTk
mirror of https://github.com/ceccopierangiolieugenio/pyTermTk.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

improved the sandbox

pull/305/head
Eugenio Parodi 🌶️ 1 year ago
parent
22dabad4db
commit
bad8f96b8d
3 changed files with 82 additions and 34 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 103
      tests/sandbox/sandbox.NerdFont.html
  2. 10
      tools/webExporter/index.html
  3. 3
      tools/webExporter/js/ttkproxy.js

103
tests/sandbox/sandbox.NerdFont.html
Unescape View File

@ -15,15 +15,18 @@
<link href="www/fontawesome/fontawesome.min.css" rel="stylesheet">
<link href="www/fontawesome/regular.min.css" rel="stylesheet">
<script type="text/javascript" src="www/w2ui/w2ui-2.0.min.js"></script>
<!--
<script type="text/javascript" src="www/w2ui/w2ui-2.0.min.js"></script>
<script type="text/javascript" src="https://rawgit.com/vitmalina/w2ui/master/dist/w2ui.es6.min.js"></script>
-->
<link rel="stylesheet" type="text/css" href="www/w2ui/w2ui-2.0.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link href="www/codemirror/theme/mbo.css" rel="stylesheet" >
<link href="www/codemirror/codemirror.css" rel="stylesheet" />
<script src="www/codemirror/codemirror.js"></script>
<script src="www/codemirror/modes/python.js"></script>
<script src="js/ttkproxy.js"></script>
<style>
.CodeMirror { height: 100%; }
/*
@ -34,12 +37,20 @@
src: url(www/fonts/nerdfonts/DejaVuSansMNerdFont-Regular.ttf) format("truetype");
}
*/
/* Custom style for the selected node */
.w2ui-sidebar .w2ui-selected {
background-color: #0056b3 !important; /* Darker background */
color: #ffffff !important; /* Lighter text */
font-weight: bold !important; /* Bold text */
border: 1px solid #004085 !important; /* Add a border */
}
</style>
</head>
<body>
<div id="layout" style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px"></div>
<script type="text/javascript">
<script type="module">
import { w2sidebar, w2utils, w2layout, w2field, query } from './www/w2ui/w2ui.es6.min.js'
let pstyle = 'border: 1px solid #efefef; padding: 5px;';
let expand = 'position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px';
new w2layout({
@ -81,33 +92,37 @@
});
new w2field({ el: query('#fpsCap')[0], type: 'int', autoFormat: false })
</script>
<input type="file" id="file-input" hidden />
<script type="text/javascript">
<script type="module">
import { TTkProxy } from './js/ttkproxy.js'
import { w2sidebar, w2utils, w2layout, w2field, query } from './www/w2ui/w2ui.es6.min.js'
// Workaround from: https://developer.mozilla.org/en-US/docs/Web/API/CSS_Font_Loading_API
const font = new FontFace("NerdFont", "url(www/fonts/nerdfonts/DejaVuSansMNerdFont-Regular.ttf)");
document.fonts.add(font);
font.load();
document.fonts.ready.then(() => {main()});
/* Code Mirror */
let myCodeMirror = CodeMirror(document.getElementById('codeArea'), {
mode: "python",
lineNumbers: true,
styleActiveLine: true,
matchBrackets: true
});
myCodeMirror.setOption("theme", "mbo");
let getCode = function(){
return myCodeMirror.getValue()
}
let setCode = function(txt){
myCodeMirror.setValue(txt)
}
/* Code Mirror */
let myCodeMirror = CodeMirror(document.getElementById('codeArea'), {
mode: "python",
lineNumbers: true,
styleActiveLine: true,
matchBrackets: true
});
myCodeMirror.setOption("theme", "mbo");
let getCode = function(){
return myCodeMirror.getValue()
}
let setCode = function(txt){
myCodeMirror.setValue(txt)
}
/* pyodide demo */
async function mainTTK(term){
ttkProxy = new TTkProxy(term)
let ttkProxy = new TTkProxy(term)
await ttkProxy.init()
await ttkProxy.loadLib("bin/TermTk.tgz");
@ -127,17 +142,50 @@
And push them in the sidebar
*/
let files = ttkProxy.getAllFiles(ttkProxy.currentPath())
new w2sidebar({
let sidebar = new w2sidebar({
box: '#sidebar',
name: 'sidebar',
icon: {
text : function(node){
if (node.nodes && node.nodes.length > 0) {
if (node.expanded) {
return '<i class="fa fa-folder-open-o"></i>'
}else{
return '<i class="fa fa-folder-o"></i>'
}
}else{
return '<i class="fa fa-file-text-o"></i>'
}
return ''
}
},
nodes: files })
w2ui.sidebar.on('click', function (event) {
console.log('Last Event: ' + event.type + ' Target: ' + event.target);
loadFile(event.target)
sidebar.on('click', function (event) {
let path = event.target;
console.log('Last Event: ' + event.type + ' Target: ' + path);
let sidebar = this;
let node = sidebar.get(path);
// Toggle expand/collapse on single click
if (node.nodes && node.nodes.length > 0) {
if (node.expanded) {
// node.icon = 'fa fa-folder-o';
sidebar.collapse(path);
} else {
// node.icon = 'fa fa-folder-open-o';
sidebar.expand(path);
}
}else{
loadFile(path)
}
});
var loadFile = function(f){
let path = ttkProxy.currentPath() + '/' + f
//let targetNode = sidebar.get(path);
sidebar.select(path);
// sidebar.scrollIntoView(path);
let content = ttkProxy.readFile(f)
setCode(content)
document.getElementById("codeUri").value = f
@ -148,8 +196,8 @@
const queryString = window.location.search;
console.log(queryString);
const urlParams = new URLSearchParams(queryString);
fileUri = urlParams.get("fileUri")
filePath = urlParams.get("filePath")
let fileUri = urlParams.get("fileUri")
let filePath = urlParams.get("filePath")
if (fileUri != null){
await ttkProxy.loadFile(fileUri, "test_file.py");
loadFile("test_file.py")
@ -158,13 +206,12 @@
}else{
loadFile("demo/demo.py")
}
w2ui.sidebar.select("demo/demo.py")
term.write('Starting Demo...\n\r')
ttkProxy.preRun()
run = function(){
let run = function(){
let filename = document.getElementById("codeUri").value
let fps = document.getElementById("fpsCap").value
ttkProxy.run(getCode(), filename,fps)

10
tools/webExporter/index.html
Unescape View File

@ -15,7 +15,6 @@
<script src="www/xterm/addon-unicode11/addon-unicode11.js"></script>
<script src="www/file-saver/FileSaver.js"></script>
<script src="js/ttkproxy.js"></script>
<style>
body {
height: 100%;
@ -30,7 +29,8 @@
<div id="terminal" contenteditable="true" onpaste="pasteFunction()" oncontextmenu="return false;" style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px"></div>
<input type="file" id="file-input" hidden />
<script type="text/javascript">
<script type="module">
import { TTkProxy } from './js/ttkproxy.js'
function pasteFunction(abc) {
text = abc.clipboardData.getData("Text")
@ -79,15 +79,15 @@
/* pyodide demo */
async function mainTTk(term,json){
ttkProxy = new TTkProxy(term)
let ttkProxy = new TTkProxy(term)
await ttkProxy.init()
for (lib of json['libs']){
for (let lib of json['libs']){
await ttkProxy.loadLib(lib['pkg']);
term.write(`${lib['name']} - Loaded\n\r`)
}
for (pkg of json['pkgs']){
for (let pkg of json['pkgs']){
await ttkProxy.loadPackage(pkg);
term.write(`${pkg} - Loaded\n\r`)
}

3
tools/webExporter/js/ttkproxy.js
Unescape View File

@ -332,4 +332,5 @@ class TTkProxy {
this.ttk_log(filename + " - LOADED")
}
}
}
export {TTkProxy};
Write Preview
Loading…
Cancel
Save