Proof of concept HTML Editor
This is purely just a proof of concept HTML editor, which I have decided to publically release. I appologise now to all those people who cringe at my code, but as i said it is a proof of concept and when I have a better idea of how to use the Pythonista fuctions I will recreate it. Download the project here.
The editor currently includes:
- Tag completions
- Builtin Customizable lan server
- Code checker for html and css
- Builtin page previewer
The layout could use some work, but the code works. Good start. I had been working on something like this for Editorial, but much more basic.
@TutorialDoctor just curious as to what you mean by the layout could use so work, I agree that is not the best, but I do not fully understand how I would go about improving it. My current plan is to completely rewrite the code and the ui to make it cleaner and easier to work on.
I would also be interested in seeing your Editorial version.
FWIW, it is not actually necessary to run a httpserver to preview,
load_urlaccepts an abspath of a local file, at least not if you are just serving plain html. If you are running some sort of dynamic content, then that's another story.
@JonB yes I agree that in most cases it would not be neccisary for the use of a httpserver, however the intention is so that custom servers and server side scripts can also be programed and tested in side the app and I am uncertain as to whether that would have been possible to do through the load_url function.
Maybe in the rewrite I will split those two functions up into seperate programs, one for the server and one for the HTML editing.
Thankyou for the feedback, at the moment any/all feedback is well apprciated while I work on the concept. It could be a while however before I am able to update/improve the scripts due to school.
Just played around with it a little, very nice work. The top menu bar is very effective.
You might consider a custom keyboard, or shortcuts for commonly used html elements.
@JonB thanks, I will consider the custom keyboard, as for the short cuts, that will give me something to put in the currently empty red area. I was considering making it an area to show options similar to how Adobe Dreamweaver does, however I was unsure how to implement that.
As a side note to anyone, is it possible to assign custom keyboard shortcuts to a hardware keyboard (e.g. Shift+Return for code completion)? I understand that not everyone has hardware keyboards but it would be a nice feature to implement.
This would’ve been so useful in my own iOS app, Servr - mobile edition, made in Pythonista. I really should’ve made an HTML completion system a long time ago… ;-)
Unless the hardware keyboard inserts a character, or moves the cursor, there is not a good way to "trap" keyboard events. You could use special characters for this -- I don't have an external ios keyboard, but I understand option-c for example inserts ç, which you could look for in the delegate methods and take special action.
@Gerzer I had a look at your IOS Servr App, it looks like it could be a very useful App with many possibilities.
@JonB I'll look into it and consider the possibility of an implementation of it eventually. Can keyboard events not be nicely "trapped" in Pythonista or can they not be trapped in general other than by the OS?
mostly a pythonista thing, i think. not sure if it will be possible with the new
@JonB I would be interested to see if it would work, however it is not essential and capturing the characters after they have been pressed is a usable work around for now.
In FileManager.py is it possible to capture the <code>ui.NavigationView.pop_view</code> event? and if so how?
I want to use this to be able to transverse the folder structure of the Manager class visually in the FileViewer program.
Never mind solved my own problem, just stopped the transversal of the file structure and instead added a data item to the ListDataSource dict
Would it be possible to create syntax highlighting with in the ui.TextView class?
For some reason upon opening a file the ui.WebView loses focus and can no longer regain focus, is there something I am missing in my code or is this a bug?
A new update is avaliable here
Edit: The ui.Webview is a container for the ACE code syntax highlighter
try calling editor.focus().
is the ace editor working well for you? back when I was working on something similar, ace gave me tons of problems, for instance selecting text and copy/paste didn't work. the developer had. o interest in supporting iOS ( there were various branches with some iOS support, but some required changes in the main branch that jjelmer never wanted to pursue)
I ended up using CodeMirror, which while not quite as full featured, worked just fine.
Atombe an option for embedding into a ui.WebView or is it to heavyweight for that? Does the choice of
Coffeescriptmake it a non-starter?
edit: focus didn't work. but I noticed if you open the settings dialog, click in the textfield, then dismiss it, the keyboard stays. that suggests you could have a hidden textarea, then after you send text to the editor, you would use
begin_editingon the textfield to show the keyboard, then call
as an aside, you should consider ways for the threads to terminate, for instance by checking
@JonB ACE does show some errors and can be troublesome on occasions, I will look into CodeMirror as another option if I cannot get this to work.
Thank you for pointing out the threading issue, I currently only do a check when the ui.View is closed to update a variable in the thread to close it. I will look into it as I have not got that issue.
@ccc I believe Atom would be a little to heavyweight for what I am doing but thank you for the suggestion anyway.
I don't quite understand what you mean by using coffeescript