I had previously discussed a Python app to create Python and Java Interfaces.
This app ports it to HTML and has features to make it even more convnient.
I have only finished the Python part, but I think it is complex enough to merit a discussion. I will post an update when the Java part is complete.
There is a help section, but I think the interface is descriptive enough that the help may never be needed.
Once again the first thing is to choose the language, for this post Python.
Next, the Control must be chosen.
When this is done, some changes will be noticed in that the background color of certain boxes will change. Boxes highlighted yellow are required, while light green highlighted boxes are optional. Here is how it looks on choosing to add a frame:
Also notice the change in color of the background box, indicating the background color has been changed. This is a warning that all future widgets will have the new color unless it is changed again.
To set values for the widgets, first doubleclick the box and it will change to gray. Then insert the new value. The graying is an indication that the value has already been set. When all yellow boxes have been converted to gray, click the red button and that code will be added. Here is how it now looks:
Next we are going to add a button to the frame.
On selecting button, notice a couple of new things; the Parent box has turned yellow, as well as the Function box. For a button it is required to Subclass and a choice must be made between the window and frame as to the parent.
This is the appearance after adding the button information and clicking the red button:
Notice that a function has been created.
><!DOCTYPE html PUBLIC ‘-//W3C//DTD XHTML 1.0 Transitional//EN’ ‘
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd’>
<html xmlns=’
http://www.w3.org/1999/xhtml’>
<head profile=’
http://gmpg.org/xfn/11′>
<title>Python-Java-IDE</title>
<style type=’text/css’>
body {margin-left:0;margin-right:0;font:normal normal normal 12px Arial; }
a{ text-decoration: }
:link { color: rgb(0, 0, 255) }
:visited {color :rgb(100, 0,100) }
:hover { }
:active { }
#widget{background: #0000AA; color: white}
#go{background: #FF0033; color: white}
table{position: relative; width: 90%; left: 5%; empty-cells: show; background: #EEEEEE}
#ta{width: 100%; height:1000px}
input{font-size:10pt; width:90px}
#deffont{width: 150px}
#langu{background: #000000; color: white}
#fnd,#cse,#rplace,#rall,#bold,#ital,#under,#selected,#nbook{width: 20px}
#sze{width: 50px}
#file, #edit, #java, #help{background: #EEEEEE}
select{font-size: 10pt}
</style>
</head>
<body>
<table>
<tr>
<td><input type=”text” id=”width” name=”width” value=”width” ondblclick=’rset(“width”);’/></td>
<td><input type=”button” id=”go” name=”go” value=”Go” onclick=’wrt();’ /></td>
<td></td>
<td colspan=”4″><select id=”file” name=”file” onchange=’fileop();’>
<option>File</option>
<option>New</option>
<option>Local Storage</option>
<option>Open LS</option>
</select>
<select id=”edit” name=”edit” onchange=’undo();’>
<option>Edit</option>
<option>Undo</option>
<option>Redo</option>
<option>BgColor</option>
<option>FgColor</option>
</select>
<select id=”java” name = “java”>
<option>Java</option>
<option>Compile</option>
<option>Run</option>
<option>Make Jar</option>
</select>
<select id=”help” name=”help” onchange=’hlp();’>
<option>Help</option>
<option>View Help</option>
<option>Return</option>
</select>
</td>
<td></td>
<td></td>
<td><input type=”checkbox” id=”fnd” name=”fnd” value=”find” onmousedown=’f_r(“find”);’ />find<td>
</tr>
<tr>
<td><input type=”text” id=”height” name=”height” value=”height” ondblclick=’rset(“height”);’ /></td>
<td><select id=”widget” name=”widget” onchange= ‘hilite();’>
<option>Control</option>
<option>Python</option>
<option></option>
<option>Window</option>
<option>Entry</option>
<option>Button</option>
<option>Label</option>
<option>Text</option>
<option>ScrolledText</option>
<option>Listbox</option>
<option>Combobox</option>
<option>Checkbutton</option>
<option>Radiobutton</option>
<option>Frame</option>
<option>Canvas</option>
<option>Scrollbar</option>
<option>Menu</option>
<option>Progressbar</option>
<option>Notebook</option>
<option></option>
<option>Java</option>
</select></td>
<td><input type=”text” id=”Text” name=”Text” value=”” ondblclick=’rset(“Text”);’ /></td>
<td><input type=”text” id=”name” name=”name” value=”” ondblclick=’rset(“name”);’ /></td>
<td><select id=”langu” name=”langu” onchange= ‘lng();’>
<option>Language</option>
<option>Python</option>
<option>Java</option>
</select>
</td>
<td></td>
<td><input type=’color’ id=’color’ value= simple color /></td>
<td><input type=”text” id=”find” name=”find” value=”find” /></td>
<td><input type=”text” id=”replace” name=”replace” value=”replace” /></td>
<td><input type=”checkbox” id=”cse” name=”cse” value=”case” checked />case<td>
</tr>
<tr>
<td><input type=”text” id=”left” name=”left” value=”left” ondblclick=’rset(“left”);’ /></td>
<td><input type=”text” id=”strvar” name=”strvr” value=”” ondblclick=’rset(“strvar”);’ /></td>
<td id=”slct”></td>
<td><input type=”text” id=”func” name=”func” value=”” ondblclick=’rset(“func”);’ /></td>
<td>
Selected
</td>
<td><select id=”parent” name=”parent” onmousedown=’rset(“parent”);’><option>window</option></select></td>
<td><input type=”checkbox” id=”nbook” name=”nbook” value=”nbook” />Notebook</td>
<td></td>
<td></td>
<td><input type=”checkbox” id=”rplace” name=”rplace” value=”replace” onmousedown=’f_r(“replace”);’ />replace</td>
</tr>
<tr>
<td><input type=”text” id=”top” name=”top” value=”top” ondblclick=’rset(“top”);’ /></td>
<td><input type=”text” id=”deffont” name=”deffont” value=”” ‘ onmousedown=’document.getElementById(“deffont”),style.backgroundColor=”#FFDDAA”;’ /></td>
<td><input type=”text” id=”fg” name=”fg” value=’fg=”#000000″‘ onmousedown=’document.getElementById(“fg”),style.backgroundColor=”#FFDDAA”;’/></td>
<td><input type=”text” id=”bg” name=”bg” value=’bg=”#EEEEEE”” onmousedown=’document.getElementById(“bg”),style.backgroundColor=”#FFDDAA”;’ /></td>
<td><input type=”checkbox” id=”bold” name=”bold” value=”bold” checked />bold</td>
<td><input type=”checkbox” id=”ital” name=”ital” value=”italic” />italic</td>
<td><input type=”checkbox” id=”under” name=”under” value=”underline” />underline</td>
<td><input type=”text” id=”sze” name=”sze” value=’fontsize’ ondblclick=’rset(“sze”);’/></td>
<td id=”fontselect”>
<select id=”font” name=”font” onchange=’getFont();’>
<option>Font</option>
<option>Arial</option>
<option>Times New Roman</option>
<option>Courier</option>
<option>Georgia</option>
<option>Cancun</option>
<option>Verbana</option>
<option>Impact</option>
<option>Comic Sans MS</option>
</select>
</td>
<td><input type=”checkbox” id=”rall” name=”rall” value=”replace all” onmousedown=’f_r(“rall”);’ />replace all<td>
</tr>
<tr>
<td colspan=”12″><textarea id=”ta” name=”ta” rows=”rows” cols=”columns”>
</textarea></td>
</tr>
</table>
var strt; var ta; var fn; var selectionText; var repl; var strt2 = 0; var beginText; var endText; var width; var height; var titl; var width2; var height2; var wdth; var hgt; var lft; var tp; var strbind = “”; var fntstr= “”; var txt2 = “”; var oldstr=””; var newstr = “”; var slcted = “”; var parnt2; var mnucnt = false; var width3; var height3;
function fileop() {
var op = document.getElementById(“file”).value;
if (op == “New”) document.getElementById(“ta”).value = “”;
if (op == “Local Storage”) {
var savestr = prompt(“Save Key”, “”);
localStorage.setItem(savestr, document.getElementById(“ta”).value);
}
if (op == “Open LS”) {
var opnstr = prompt(“Open Key”, “”);
var recovstr = localStorage.getItem(opnstr);
document.getElementById(“ta”).value = recovstr;
}
}
function hlp() {
if (document.getElementById(“help”).value == “View Help”) {
document.getElementById(“ta”).value = ‘General\nStart by choosing Python or Java from the Language black box.\nif Python select Window from the blue box.\nThe values to be entered will be highlighted in yellow. Double click a yellow box and it will turn gray.\nEnter the value and go to the next yellow box.\nWhen no yellow boxes remain, click the red box.\nRepeat the procedure with any controls to be added. Control dimensions are entered as a percentage of the parent.\nClick Undo to remove the last change and Redo to reverse the Undo.\nClick View Help to see this file and Return to go back to the workspace.\n\nPython\nIf you plan to create a Notebook, check Notebook. With a few exceptions entry is very straightforward. If the input is text, doubleclick and enter the value. If the input is select, choose a value from the list. Yellow boxes are compulsory and values must be entered. Light blue-green boxes are optional. If a Frame or Canvas has been added, it can serve as a parent. Therefore the parent box will turn yellow and a parent must be chosen for any subsequent widget. The WidgetText holds any caption or text that will be displayed. The WidgetName box holds the widget id.\nThe differences:\nButton:\nButtons are bound to a function, which must be given a name.\nCheckbox, Radiobox and Progressbar:\nThese need a variable whose name must be added. Additionally, to work properly, a determinate Progressbar must be tied to some function, although it is not itself bound. Therefore, give the function a name, use the same name for a function created by a bound widget and transfer the code to the new function\nListbox & Combobox:\nIt is bound to a function, which must be given a name. . To populate the list fill the WidgetText box in the following manner: \’item1\’,\’item2\’, \’item3\’ etc. Combobox is similar, only there is an option for the type of binding.\nScrollbar:\nThe widget to which the scrollbar is attached may not be the same as its parent. Therefore in the WidgetName box, the scrollbar id is entered followed by a comma and the id of the widget to which it is attached.\nMenus:\nNo position entries are needed. A Title such as Edit goes in the mnutitle box. The menu items are entered in the WidgetText as an item name followed by a comma, including a comma after the last item name. After the red box is clicked, repeat for the next menu, if needed.\nNotebook:\nCreate the Frames or ScrolledText boxes or other widgets that will populate the Notebook and fill them in the normal manner. Do not bother with Frame or ScrolledText dimensions. Click on Notebook and put in a width. Then make a comma separated list of the widgets to go in the notebook, followed by a comma after the last one. As with everything else, finish by clicking the red button’;
} else {
document.getElementById(“ta”).value = newstr;
}
}
function rset(layr) {
document.getElementById(layr).style.backgroundColor = “#CCCCCC”;
}
function getFont() {
if (document.getElementById(“langu”).value == “Python”) {
fntstr = ‘font= (“‘ + document.getElementById(“font”).value + ‘”,’;
fntstr += ‘ ‘ + document.getElementById(“sze”).value + ‘,’;
if (document.getElementById(“bold”).checked) fntstr += ‘ “bold”,’;
if (document.getElementById(“ital”).checked) fntstr += ‘ “italic”,’;
if (document.getElementById(“under”).checked) fntstr += ‘ “underline”‘;
fntstr += ‘)’;
document.getElementById(“deffont”).value = fntstr;
}
document.getElementById(“deffont”).style.backgroundColor=”#FFDDAA”;
}
function f_r(op) {
document.getElementById(“ta”).focus();
ta = document.getElementById(“ta”).value;
if (op == “rall”) {
document.getElementById(“ta”).focus();
ta = document.getElementById(“ta”).value;
fn = document.getElementById(“find”).value;
repl = document.getElementById(“replace”).value;
document.getElementById(“ta”).value = ta.replace(new RegExp(fn, ‘g’), repl);
}
if (op == “find”) {
fn = document.getElementById(“find”).value;
if (document.getElementById(“cse”).checked) {
strt = ta.indexOf(fn, strt2);
} else {
strt = ta.toLowerCase().indexOf(fn.toLowerCase(), strt2);
}
beginText = ta.substr(0, strt);
endText = ta.substr(beginText.length + fn.length, ta.length – beginText.length – fn.length );
selectionText = ta.substr(strt, fn.length);
strt2 = strt + fn.length + 1;
}
if (op == “replace”) {
document.getElementById(“ta”).focus();
repl = document.getElementById(“replace”).value;
if (strt != -1)document.getElementById(“ta”).value = beginText + repl + endText;
}
}
function lng() {
if (document.getElementById(“langu”).value == “Python”) {
document.getElementById(“fontselect”).innerHTML = ‘FontArialTimes New RomanCalibriCourier NewCancunGeorgiaImpactVerbanaSnell Blk BTComic Sans MSPrincetownDWeddingText BTManorlyEngrvrsOldEng Bd BT’;
document.getElementById(“Text”).value = “WidgetText”;
document.getElementById(“name”).value = “WidgetName”;
document.getElementById(“strvar”).value = “Variable”;
document.getElementById(“slct”).innerHTML = ‘Bind ActionButtonRelease-1ButtonRelease-2Return’;
document.getElementById(“func”).value = “Function”;
document.getElementById(“deffont”).value = ‘font= (“Arial”, 10, “bold”)’;
} else {
document.getElementById(“Text”).value = “Caption”;
document.getElementById(“name”).value = “Control Name”;
document.getElementById(“strvar”).value = “Panel”;
document.getElementById(“slct”).innerHTML = ”;
document.getElementById(“func”).value = “*,jar”;
document.getElementById(“deffont”).value = ‘”Arial”, Font.BOLD | Font.ITALIC, 15)’;
}
}
function hilite() {
if (document.getElementById(“ta”).value.indexOf(“Frame”) != -1 || document.getElementById(“ta”).value.indexOf(“Canvas”) != -1 ) document.getElementById(“parent”).style.backgroundColor = “yellow”;
var el = document.getElementById(“widget”).value;
document.getElementById(“sze”).value = “fontsize”;
document.getElementById(“d1”).style.backgroundColor = “#EEEEEE”;
if (el != “Scrollbar” && el != “Menu” && el != “Progressbar” && el != “Notebook”) {
document.getElementById(“width”).style.backgroundColor = “yellow”;
document.getElementById(“height”).style.backgroundColor = “yellow”;
}
document.getElementById(“left”).style.backgroundColor = “white”;
document.getElementById(“top”).style.backgroundColor = “white”;
document.getElementById(“name”).style.backgroundColor = “white”;
document.getElementById(“Text”).style.backgroundColor = “white”;
document.getElementById(“strvar”).style.backgroundColor = “white”;
document.getElementById(“func”).style.backgroundColor = “white”;
document.getElementById(“bnd”).style.backgroundColor = “white”;
document.getElementById(“sze”).style.backgroundColor = “white”;
if (el != “Window” && el != “Scrollbar” && el != “Menu” && el != “Progressbar” && el != “Notebook”) {
document.getElementById(“left”).style.backgroundColor = “yellow”;
document.getElementById(“top”).style.backgroundColor = “yellow”;
document.getElementById(“name”).style.backgroundColor = “yellow”;
if (el != “Frame” && el != “Canvas” && el != “Text” && el != “ScrolledText”) document.getElementById(“Text”).style.backgroundColor = “yellow”;
}
if (el == “Checkbutton” || el == “Radiobutton”) document.getElementById(“strvar”).style.backgroundColor = “yellow”;
if (el == “Button” || el == “Listbox” || el == “Combobox”) document.getElementById(“func”).style.backgroundColor = “yellow”;
if (el == “Entry” || el == “Radiobutton” || el == “Frame” || el == “Canvas”) {
document.getElementById(“func”).style.backgroundColor = “#CCFFF5”;
document.getElementById(“bnd”).style.backgroundColor = “#CCFFF5”;
}
if (el == “Combobox”) document.getElementById(“bnd”).style.backgroundColor = “yellow”;
if (el == “Radiobutton”) document.getElementById(“d1”).style.backgroundColor = “#CCFFF5”;
if (document.getElementById(“widget”).value == “Scrollbar” && (document.getElementById(“ta”).value.indexOf(“Frame”) != -1 || document.getElementById(“ta”).value.indexOf(“Canvas”) != -1 || document.getElementById(“ta”).value.indexOf(“Listbox”) != -1)) document.getElementById(“parent”).style.backgroundColor = “yellow”;
if (el == “Scrollbar”) document.getElementById(“name”).style.backgroundColor = “yellow”;
if (el == “Menu”) {
document.getElementById(“sze”).value = “mnutitle”;
document.getElementById(“sze”).style.backgroundColor = “yellow”;
document.getElementById(“name”).style.backgroundColor = “yellow”;
document.getElementById(“Text”).style.backgroundColor = “yellow”;
document.getElementById(“func”).style.backgroundColor = “yellow”;
document.getElementById(“width”).style.backgroundColor = “white”;
document.getElementById(“height”).style.backgroundColor = “white”;
}
if (el == “Progressbar”) {
document.getElementById(“width”).value = “length”;
document.getElementById(“left”).value = “value”;
document.getElementById(“width”).style.backgroundColor = “yellow”;
document.getElementById(“left”).style.backgroundColor = “yellow”;
document.getElementById(“name”).style.backgroundColor = “yellow”;
document.getElementById(“strvar”).style.backgroundColor = “yellow”;
document.getElementById(“func”).style.backgroundColor = “yellow”;
}
if (el == “Notebook”) {
document.getElementById(“width”).style.backgroundColor = “yellow”;
document.getElementById(“height”).style.backgroundColor = “white”;
document.getElementById(“name”).style.backgroundColor = “yellow”;
document.getElementById(“parent”).style.backgroundColor = “white”;
}
if (el == “Control”) {
oldstr = document.getElementById(“ta”).value;
document.getElementById(“width”).style.backgroundColor = “white”;
document.getElementById(“height”).style.backgroundColor = “white”;
document.getElementById(“top”).style.backgroundColor = “white”;
document.getElementById(“top”).style.backgroundColor = “white”;
document.getElementById(“left”).style.backgroundColor = “white”;
document.getElementById(“top”).style.backgroundColor = “white”;
document.getElementById(“name”).style.backgroundColor = “white”;
document.getElementById(“Text”).style.backgroundColor = “white”;
document.getElementById(“strvar”).style.backgroundColor = “white”;
document.getElementById(“func”).style.backgroundColor = “white”;
document.getElementById(“bnd”).style.backgroundColor = “white”;
document.getElementById(“sze”).style.backgroundColor = “white”;
}
}
function undo() {
if (document.getElementById(“edit”).value == “Undo”) {
document.getElementById(“ta”).value = oldstr;
} else if (document.getElementById(“edit”).value == “Redo”) {
document.getElementById(“ta”).value = newstr;
}
if (document.getElementById(“edit”).value == “BgColor”) {
document.getElementById(“bg”).value = ‘bg=”‘ + document.getElementById(“color”).value + ‘”‘;
document.getElementById(“bg”).style.backgroundColor = “#FFDDAA”;
}
if (document.getElementById(“edit”).value == “FgColor”) {
document.getElementById(“fg”).value = ‘fg=”‘ + document.getElementById(“color”).value + ‘”‘;
document.getElementById(“fg”).style.backgroundColor = “#FFDDAA”;
}
}
function wrt() {
parnt2 = document.getElementById(“parent”).value;
oldstr = document.getElementById(“ta”).value;
if (document.getElementById(“langu”).value == “Python”) {
pthon();
}
newstr = document.getElementById(“ta”).value;
}
function pthon() {
if (document.getElementById(“selected”).checked) {
slcted = document.getElementById(“name”).value + ‘.select()’;
} else {
slcted = “”;
}
if (document.getElementById(“bnd”).value != “Bind Action”) {
strbind = ‘\n’ + document.getElementById(“name”).value +’.bind(“”, ‘ + document.getElementById(“func”).value + ‘)’ ;
} else {
strbind = “”;
}
width = document.getElementById(“width”).value;
height = document.getElementById(“height”).value;
titl= document.getElementById(“Text”).value;
if ( document.getElementById(“widget”).value == “Window”) {
width2 = width;
height2 = height;
document.getElementById(“ta”).value += “import os\nimport tkinter\nfrom tkinter import *\nfrom tkinter import ttk\nfrom tkinter import scrolledtext\nfrom tkinter import filedialog\n\nwindow = tkinter.Tk()\nwindow.title(‘” + titl + “‘)\nwindow.maxsize(” + width + “,” + height + “)\nwindow.configure(” + document.getElementById(‘bg’).value + “)\n# notebook\n\n\n\nwindow.mainloop()”;
}
if ( document.getElementById(“widget”).value != “Window” && document.getElementById(“parent”).value == “window”) {
wdth = Math.round(parseFloat(document.getElementById(“width”).value)/100 * .97 * width2);
lft = Math.round(parseFloat(document.getElementById(“left”).value)/100 * .97 * width2);
hgt = Math.round(parseFloat(document.getElementById(“height”).value)/100 * .94 * height2);
tp = Math.round(parseFloat(document.getElementById(“top”).value)/100 * .94 * height2);
} else {
wdth = Math.round(parseFloat(document.getElementById(“width”).value)/100 * .97 * width3);
lft = Math.round(parseFloat(document.getElementById(“left”).value)/100 * .97 * width3);
hgt = Math.round(parseFloat(document.getElementById(“height”).value)/100 * .94 * height3);
tp = Math.round(parseFloat(document.getElementById(“top”).value)/100 * .94 * height3);
}
if ( document.getElementById(“widget”).value == “Entry” || document.getElementById(“widget”).value == “Frame” || document.getElementById(“widget”).value == “Canvas” ) {
ta = document.getElementById(“ta”).value;
var pos = ta.indexOf(“\n\n\n”);
beginText = ta.substr(0, pos);
if (document.getElementById(“Text”).value != “” && document.getElementById(“widget”).value == “Entry” ) {
titl = document.getElementById(“name”).value + ‘.insert(0, “‘ + document.getElementById(“Text”).value + ‘”);’;
var fn = ‘,’ + document.getElementById(“fg”).value + ‘,’ + document.getElementById(“bg”).value + ‘,’ + document.getElementById(“deffont”).value;
} else {
titl = “”;
fn = ‘, ‘ + document.getElementById(“bg”).value;
}
if ( document.getElementById(“widget”).value == “Frame” || document.getElementById(“widget”).value == “Canvas” || document.getElementById(“widget”).value == “Listbox” ) {
document.getElementById(“parent”).innerHTML += “” + document.getElementById(“name”).value + “”;
width3 = wdth;
height3 = hgt;
}
if (document.getElementById(“nbook”).checked && document.getElementById(“widget”).value == “Frame”) {
document.getElementById(“ta”).value = beginText + ‘\n\n’ + document.getElementById(“name”).value + ‘ = tkinter.Frame(nb, ‘ + document.getElementById(“bg”).value + ‘)\n\n\nwindow.mainloop()\n’;
} else {
document.getElementById(“ta”).value = beginText + ‘\n\n’ + document.getElementById(“name”).value + ‘ = tkinter.’ + document.getElementById(“widget”).value + ‘(‘ + parnt2 + fn + ‘ )\n’ + document.getElementById(“name”).value + ‘.place(x= “‘ + lft + ‘”, y=”‘ + tp + ‘”, width=”‘ + wdth + ‘”, height=”‘ + hgt + ‘”)’ + strbind +’\n’ + titl + ‘\n\n\nwindow.mainloop()\n’;
}
if (strbind !=””) {
ta = document.getElementById(“ta”).value;
pos = ta.indexOf(“\n\n”);
beginText = ta.substr(0, pos);
var endText = ta.substr(beginText.length, ta.length – beginText.length);
document.getElementById(“ta”).value = beginText + ‘\ndef ‘ + document.getElementById(“func”).value + ‘(event):\n code = “your code goes here”‘ + endText;
}
}
if ( document.getElementById(“widget”).value == “Label” || document.getElementById(“widget”).value == “Text” || document.getElementById(“widget”).value == “ScrolledText”) {
if ( document.getElementById(“widget”).value == “Label”) {
txt2 = ‘, text=”‘ + titl + ‘”‘;
} else {
txt2 = “”;
}
if (document.getElementById(“widget”).value == “ScrolledText”) {
var parnt =”scrolledtext” ;
} else {
parnt = “tkinter”;
}
ta = document.getElementById(“ta”).value;
var pos = ta.indexOf(“\n\n\n”);
beginText = ta.substr(0, pos);
if (document.getElementById(“nbook”).checked && document.getElementById(“widget”).value == “ScrolledText”) {
document.getElementById(“ta”).value = beginText + ‘\n\n’ + document.getElementById(“name”).value + ‘ = scrolledtext.ScrolledText(nb, ‘ + document.getElementById(“bg”).value + ‘)\n\n\nwindow.mainloop()\n’;
} else {
document.getElementById(“ta”).value = beginText + ‘\n\n’ + document.getElementById(“name”).value + ‘ = ‘ + parnt + ‘.’ + document.getElementById(“widget”).value + ‘(‘ + parnt2 + ‘, ‘ + document.getElementById(“fg”).value + ‘,’ + document.getElementById(“bg”).value + ‘,’ + document.getElementById(“deffont”).value + txt2 + ‘)\n’ + document.getElementById(“name”).value + ‘.place(x= “‘ + lft + ‘”, y=”‘ + tp + ‘”, width=”‘ + wdth + ‘”, height=”‘ + hgt + ‘”)\n\n\nwindow.mainloop()\n’;
}
}
if ( document.getElementById(“widget”).value == “Button”) {
ta = document.getElementById(“ta”).value;
var pos = ta.indexOf(“\n\n\n”);
beginText = ta.substr(0, pos);
document.getElementById(“ta”).value = beginText + ‘\n\n’ + document.getElementById(“name”).value + ‘ = tkinter.Button(‘ + parnt2 + ‘, ‘ + document.getElementById(“fg”).value + ‘,’ + document.getElementById(“bg”).value + ‘,’ + document.getElementById(“deffont”).value + ‘, text=”‘ + titl + ‘”, command=’ + document.getElementById(“func”).value + ‘)\n’ + document.getElementById(“name”).value + ‘.place(x= “‘ + lft + ‘”, y=”‘ + tp + ‘”, width=”‘ + wdth + ‘”, height=”‘ + hgt + ‘”)\n\n\nwindow.mainloop()\n’;
ta = document.getElementById(“ta”).value;
pos = ta.indexOf(“\n\n”);
beginText = ta.substr(0, pos);
var endText = ta.substr(beginText.length, ta.length – beginText.length);
document.getElementById(“ta”).value = beginText + ‘\ndef ‘ + document.getElementById(“func”).value + ‘():\n a = “put code here”‘ + endText;
}
if ( document.getElementById(“widget”).value == “Combobox”) {
ta = document.getElementById(“ta”).value;
var pos = ta.indexOf(“\n\n\n”);
beginText = ta.substr(0, pos);
document.getElementById(“ta”).value = beginText + ‘\n\nvallist = [‘ + document.getElementById(“Text”).value + ‘]\n’ + document.getElementById(“name”).value + ‘ = ttk.Combobox(window,’ + document.getElementById(“deffont”).value + ‘, values=vallist)\n’ + document.getElementById(“name”).value + ‘.place(x=”‘ + lft + ‘”, y=”‘ + tp + ‘”, width=”‘ + wdth + ‘”, height=”‘ + hgt + ‘”)\n’ + document.getElementById(“name”).value + ‘.insert(0,”Choose”)’ + strbind + ‘\n\n\nwindow.mainloop()\n’ ;
ta = document.getElementById(“ta”).value;
pos = ta.indexOf(“\n\n”);
beginText = ta.substr(0, pos);
var endText = ta.substr(beginText.length, ta.length – beginText.length);
document.getElementById(“ta”).value = beginText + ‘\ndef ‘ + document.getElementById(“func”).value + ‘(event):\n a = “enter your code”‘ + endText;
}
if ( document.getElementById(“widget”).value == “Listbox”) {
document.getElementById(“parent”).innerHTML += “” + document.getElementById(“name”).value + “”;
ta = document.getElementById(“ta”).value;
var pos = ta.indexOf(“\n\n\n”);
beginText = ta.substr(0, pos);
document.getElementById(“ta”).value = beginText + ‘\n\n’ + document.getElementById(“name”).value + ‘ = tkinter.Listbox(window,’ + document.getElementById(“deffont”).value + ‘)\n’ + document.getElementById(“name”).value + ‘.place(x=”‘ + lft + ‘”, y=”‘ + tp + ‘”, width=”‘ + wdth + ‘”, height=”‘ + hgt + ‘”)\nfor item in ([‘ + document.getElementById(“Text”).value + ‘]):\n ‘ + document.getElementById(“name”).value + ‘.insert(0, item)\n’ + document.getElementById(“name”).value + ‘.bind(“”,’ + document.getElementById(“func”).value + ‘)\n\n\nwindow.mainloop()\n’ ;
ta = document.getElementById(“ta”).value;
pos = ta.indexOf(“\n\n”);
beginText = ta.substr(0, pos);
var endText = ta.substr(beginText.length, ta.length – beginText.length);
document.getElementById(“ta”).value = beginText + ‘\ndef ‘ + document.getElementById(“func”).value + ‘(event):\n index =’ + document.getElementById(“name”).value + ‘.curselection()[0]\n seltext = ‘ + document.getElementById(“name”).value + ‘.get(index)’ + endText;
}
if ( document.getElementById(“widget”).value == “Checkbutton”) {
txt2 = ‘, text=”‘ + titl + ‘”‘;
ta = document.getElementById(“ta”).value;
var pos = ta.indexOf(“\n\n\n”);
beginText = ta.substr(0, pos);
document.getElementById(“ta”).value = beginText + ‘\n\n’ + document.getElementById(“strvar”).value + ‘ = StringVar()\n’ + document.getElementById(“name”).value + ‘ = tkinter.’ + document.getElementById(“widget”).value + ‘(‘ + parnt2 + ‘, ‘ + document.getElementById(“fg”).value + ‘,’ + document.getElementById(“bg”).value + ‘,’ + document.getElementById(“deffont”).value + txt2 + ‘, variable=’ + document.getElementById(“strvar”).value + ‘, onvalue=”yes”, offvalue=”no”)\n’ + document.getElementById(“name”).value + ‘.place(x= “‘ + lft + ‘”, y=”‘ + tp + ‘”, width=”‘ + wdth + ‘”, height=”‘ + hgt + ‘”)\n\n\nwindow.mainloop()\n ‘;
}
if ( document.getElementById(“widget”).value == “Radiobutton”) {
txt2 = ‘, text=”‘ + titl + ‘”‘;
ta = document.getElementById(“ta”).value;
var pos = ta.indexOf(“\n\n\n”);
beginText = ta.substr(0, pos);
document.getElementById(“ta”).value = beginText + ‘\n\n’ + document.getElementById(“strvar”).value + ‘ = StringVar()\n’ + document.getElementById(“name”).value + ‘ = tkinter.’ + document.getElementById(“widget”).value + ‘(‘ + parnt2 + ‘, ‘ + document.getElementById(“fg”).value + ‘,’ + document.getElementById(“bg”).value + ‘,’ + document.getElementById(“deffont”).value + txt2 + ‘, variable=’ + document.getElementById(“strvar”).value + ‘, value = “‘ + document.getElementById(“Text”).value + ‘”)\n’ + document.getElementById(“name”).value + ‘.place(x= “‘ + lft + ‘”, y=”‘ + tp + ‘”, width=”‘ + wdth + ‘”, height=”‘ + hgt + ‘”)’ + strbind + ‘\n’ + slcted + ‘\n\n\nwindow.mainloop()\n ‘;
if (strbind != “”) {
ta = document.getElementById(“ta”).value;
pos = ta.indexOf(“\n\n”);
beginText = ta.substr(0, pos);
var endText = ta.substr(beginText.length, ta.length – beginText.length);
document.getElementById(“ta”).value = beginText + ‘\ndef ‘ + document.getElementById(“func”).value + ‘(event):\n a = “enter code here”‘ + endText;
}
}
if ( document.getElementById(“widget”).value == “Scrollbar” ) {
var pos2 = document.getElementById(“name”).value.indexOf(“,”);
var id = document.getElementById(“name”).value.substr(0,pos2);
var attach = document.getElementById(“name”).value.substr(pos2 + 1, document.getElementById(“name”).value.length – pos2);
ta = document.getElementById(“ta”).value;
var pos = ta.indexOf(“\n\n\n”);
beginText = ta.substr(0, pos);
document.getElementById(“ta”).value = beginText + ‘\n\n’ + id + ‘ = tkinter.Scrollbar(‘ + parnt2 + ‘, orient=”vertical”, command=’+ attach + ‘.yview)\n’ + attach + ‘.configure(yscrollcommand=’ + id + ‘.set)\n’ + id + ‘.pack(side=RIGHT, fill=Y)\n\n\nwindow.mainloop()\n ‘;
}
if ( document.getElementById(“widget”).value == “Progressbar” ) {
var vr = document.getElementById(“strvar”).value;
ta = document.getElementById(“ta”).value;
var pos = ta.indexOf(“\n\n\n”);
beginText = ta.substr(0, pos);
document.getElementById(“ta”).value = beginText + ‘\n\nglobal ‘ + vr + ‘\n’ + vr + ‘ = ‘ + document.getElementById(“left”).value + ‘\n’ + document.getElementById(“name”).value + ‘ = ttk.Progressbar(‘ + parnt2 + ‘, orient=”horizontal”, mode=”determinate”, length=’ + document.getElementById(“width”).value + ‘, value=’ + vr + ‘)\n’ + document.getElementById(“name”).value + ‘.pack(side=”bottom”, fill=Y)\n\n\nwindow.mainloop()\n ‘;
ta = document.getElementById(“ta”).value;
pos = ta.indexOf(“\n\n”);
beginText = ta.substr(0, pos);
var endText = ta.substr(beginText.length, ta.length – beginText.length);
document.getElementById(“ta”).value = beginText + ‘\ndef ‘ + document.getElementById(“func”).value + ‘(event):\n global ‘ + document.getElementById(“strvar”).value + ‘\n\n ‘ + document.getElementById(“name”).value + ‘.step(‘ + document.getElementById(“strvar”).value + ‘)\n’ + endText;
}
if ( document.getElementById(“widget”).value == “Menu” ) {
var a = 0;
var b=0;
var txt2 = document.getElementById(“Text”);
var c = 0;
var d=0;
strmenu = “”;
var txt1 = document.getElementById(“func”);
ta = document.getElementById(“ta”).value;
var pos = ta.indexOf(“\n\n\n”);
beginText = ta.substr(0, pos);
if (! mnucnt) var strmenu = ‘menubar = ‘ + document.getElementById(“widget”).value + ‘(‘ + document.getElementById(“parent”).value + ‘)\n’
strmenu += document.getElementById(“name”).value + ‘ = Menu(menubar, tearoff=0)\n’;
for (var i=0; i
</body></html>
Since javascript is unable to save files, I have used Local Storage for saving in the functions fileop() and OpenLS().
There is a find and replace, text and background colors can be changed either by clicking a color dialog or manually entering the text and the font can be changed either by choosing from a list or entering manually;
I will eventually convert to PHP which will allow both saving and testing, but right now, to save and test, the text has to be copied and pasted into another application.