Skip to content

Commit

Permalink
Merge pull request #305 from ceccopierangiolieugenio/303-web-sanbox-i…
Browse files Browse the repository at this point in the history
…s-broken

#303 - Fix Run routine in the Sandbox
  • Loading branch information
ceccopierangiolieugenio authored Jan 18, 2025
2 parents d8587db + 270c274 commit d080083
Show file tree
Hide file tree
Showing 3 changed files with 51 additions and 52 deletions.
91 changes: 45 additions & 46 deletions tests/sandbox/sandbox.NerdFont.html
Original file line number Diff line number Diff line change
Expand Up @@ -48,56 +48,55 @@
</head>
<body>
<div id="layout" style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px"></div>

<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({
box: '#layout',
name: 'layout_pyTermTk_sandbox',
padding: 4,
panels: [
//{ type: 'top', size: 50, resizable: true, style: pstyle, html: 'top' },
{ type: 'left', size: 200, resizable: true, style: pstyle,
html: '<div id="sidebar" style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px"></div>' },
{ type: 'main', style: pstyle,
toolbar: {
items: [
{ type: 'button', id: 'run_button', text: 'Run', icon: 'far fa-play-circle' },
{ type: 'html', id: 'uri',
html(item) {
let html =
'<div style="padding: 0px 10px; margin-top: -2px;" >'+
' URI: <input id="codeUri" size="50"/>'+
' FPS Cap: <input id="fpsCap" value="30" size="1">'+
'</div>';
return html;
},
},
],
onClick(event) { run(); }
},
html: '<div id="codeArea" style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 25px"></div>'+
`<div id="codeArea" style="position: absolute; left: 15px; right: 0px; bottom: 0px">
<a href="https://github.com/ceccopierangiolieugenio/pyTermTk">pyTermTk</a> sandbox,
Powered by <a href="https://pyodide.org/">Pyodide</a>
and <a href="https://xtermjs.org">xterm.js</a>
and <a href="https://codemirror.net/5/">CodeMirror5</a>
and <a href="https://w2ui.com/">w2ui</a>
</div>`},
{ type: 'right', size: 1000, resizable: true, style: pstyle,
html: '<div id="terminal" oncontextmenu="return false;" style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px"></div>' }
]
});
new w2field({ el: query('#fpsCap')[0], type: 'int', autoFormat: false })
</script>

<input type="file" id="file-input" hidden />

<script type="module">
import { TTkProxy } from './js/ttkproxy.js'
import { w2sidebar, w2utils, w2layout, w2field, query } from './www/w2ui/w2ui.es6.min.js'
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';
let run = function(){};

new w2layout({
box: '#layout',
name: 'layout_pyTermTk_sandbox',
padding: 4,
panels: [
//{ type: 'top', size: 50, resizable: true, style: pstyle, html: 'top' },
{ type: 'left', size: 200, resizable: true, style: pstyle,
html: '<div id="sidebar" style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px"></div>' },
{ type: 'main', style: pstyle,
toolbar: {
items: [
{ type: 'button', id: 'run_button', text: 'Run', icon: 'far fa-play-circle' },
{ type: 'html', id: 'uri',
html(item) {
let html =
'<div style="padding: 0px 10px; margin-top: -2px;" >'+
' URI: <input id="codeUri" size="50"/>'+
' FPS Cap: <input id="fpsCap" value="30" size="1">'+
'</div>';
return html;
},
},
],
onClick(event) { run(); }
},
html: '<div id="codeArea" style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 25px"></div>'+
`<div id="codeArea" style="position: absolute; left: 15px; right: 0px; bottom: 0px">
<a href="https://github.com/ceccopierangiolieugenio/pyTermTk">pyTermTk</a> sandbox,
Powered by <a href="https://pyodide.org/">Pyodide</a>
and <a href="https://xtermjs.org">xterm.js</a>
and <a href="https://codemirror.net/5/">CodeMirror5</a>
and <a href="https://w2ui.com/">w2ui</a>
</div>`},
{ type: 'right', size: 1000, resizable: true, style: pstyle,
html: '<div id="terminal" oncontextmenu="return false;" style="position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px"></div>' }
]
});
new w2field({ el: query('#fpsCap')[0], type: 'int', autoFormat: false })

// 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)");
Expand Down Expand Up @@ -211,7 +210,7 @@

ttkProxy.preRun()

let run = function(){
run = function(){
let filename = document.getElementById("codeUri").value
let fps = document.getElementById("fpsCap").value
ttkProxy.run(getCode(), filename,fps)
Expand Down
10 changes: 5 additions & 5 deletions tests/t.ui/test.ui.018.TextEdit.03.Pygments.py
Original file line number Diff line number Diff line change
Expand Up @@ -49,17 +49,17 @@ def demoTextEdit(root, filename):
# te.setLineWrapMode(ttk.TTkK.FixedWidth)
# te.setWrapWidth(100)

frame.layout().addWidget(te,1,0,1,9)
frame.layout().addWidget(te,1,0,1,10)
frame.layout().addWidget(ttk.TTkLabel(text="Wrap: ", maxWidth=6),0,0)
frame.layout().addWidget(lineWrap := ttk.TTkComboBox(list=['NoWrap','WidgetWidth','FixedWidth']),0,1)
frame.layout().addWidget(ttk.TTkLabel(text=" Type: ",maxWidth=7),0,2)
frame.layout().addWidget(wordWrap := ttk.TTkComboBox(list=['WordWrap','WrapAnywhere'], enabled=False),0,3)
frame.layout().addWidget(ttk.TTkLabel(text=" FixW: ",maxWidth=7),0,4)
frame.layout().addWidget(fixWidth := ttk.TTkSpinBox(value=te.wrapWidth(), maximum=500, minimum=10, enabled=False),0,5)
frame.layout().addWidget(ttk.TTkLabel(text=" Lexer: ",maxWidth=8),0,5)
frame.layout().addWidget(lexers := ttk.TTkComboBox(list=ttk.TextDocumentHighlight.getLexers()),0,6)
frame.layout().addWidget(ttk.TTkLabel(text=" Style: ",maxWidth=8),0,7)
frame.layout().addWidget(styles := ttk.TTkComboBox(list=ttk.TextDocumentHighlight.getStyles()),0,8)
frame.layout().addWidget(ttk.TTkLabel(text=" Lexer: ",maxWidth=8),0,6)
frame.layout().addWidget(lexers := ttk.TTkComboBox(list=ttk.TextDocumentHighlight.getLexers()),0,7)
frame.layout().addWidget(ttk.TTkLabel(text=" Style: ",maxWidth=8),0,8)
frame.layout().addWidget(styles := ttk.TTkComboBox(list=ttk.TextDocumentHighlight.getStyles()),0,9)


lineWrap.setCurrentIndex(0)
Expand Down
2 changes: 1 addition & 1 deletion tutorial/002-layout.rst
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ Intro

TTkLayouts_ are specialised classes that allow the placement of the widgets.

.. image:: https://ceccopierangiolieugenio.github.io/pyTermTk/_images/Layout.HLD.001.svg
.. image:: https://ceccopierangiolieugenio.github.io/pyTermTk-Docs/_images/Layout.HLD.001.svg

TTkLayout_
----------
Expand Down

0 comments on commit d080083

Please sign in to comment.