AHK HTML Editor test (W.I.P.)

[burque505]

I got off on this tangent after a post elsewhere regarding RTF <-> HTML. I believe this is the start of an HTML Editor, impoverished though it may be at this time. I think the rest is just digging into MSDN for the proper editing commands.
EDIT: From now on I'll put the latest version in this post. I'm leaving the rest of the versions where they are for now.
EDIT: (20181223). IE-based variant with design-mode toggle in my last post below.
(Edited 20181222 - 1755 MST, some updates, in ZIP, NOT in spoiler. Needed image files now included.)
(Edited 20220413 - pseudo-fix Ctrl-C, Ctrl-X, Ctrl-V in GUi)
(Edited 20220415 - fix Ctrl-C, Ctrl-X, Ctrl-V, add 'Paste" button again)
Latest version is 0.0.4 (attached)

• Bullets

• Numbering

• Indent

• Outdent

• Undo

• TextArea

• iFrame

• Marquee

• InsertImage

• Improved InsertLink

• Insert <BR>

• Insert Button

• Improved Insert txt/HTML/js (at current position)

Many bugs and missing features still. Still very much W.I.P. For example:

• No .ini yet, no settings dialog.

• Still need to be able to set properties from GUI, not source, and not by just inserting HTML

EDIT: Removing 20181219 code.

Regards,
burque505
EDIT: Forgot the HTML! Don't think it's needed anymore. It isn't.
(GIF is a little corrupted at the end. The file itself displays correctly.) New GIF 20181222

122218.gif (223.04 KiB) Viewed 4713 times

[adegard]

Great @burque505!
good idea... It's a good start, I subscribe!
Note: I personally use bootstrap templates... is'it a way to make an editor for it? There'is a lot of commercial solution, but few are adapt ot boostrap in open source...

[r2997790]

Nice job. I can see this having a lot of potential. Particularly if you want say 'intelligent' HTML formatting of content you could dump it something like this and parse the text and call the HTML tag functions.

[burque505]

@adegard, @r2997790, thanks for the encouragement. Here's another iteration, same HTML file. There are still bugs and missing features galore. It needs a menu bar, toolbar, so it looks like it was designed by a human. Baby steps ...

Spoiler

Code: Select all

; burque505, December 16, 2018
; using code filched from:
; https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/platform-apis/aa753622%28v%3dvs.85%29
; and
; https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/platform-apis/aa969613%28v%3dvs.85%29
; See also
; https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/platform-apis/ms536419%28v%3dvs.85%29

full_command_line := DllCall("GetCommandLine", "str")

if not (A_IsAdmin or RegExMatch(full_command_line, " /restart(?!\S)"))
{
    try ; leads to having the script re-launching itself as administrator
    {
        if A_IsCompiled
            Run *RunAs "%A_ScriptFullPath%" /restart
        else
            Run *RunAs "%A_AhkPath%" /restart "%A_ScriptFullPath%"
    }
    ExitApp
}


Gui, Add, Button, Default w80, Bold
Gui, Add, Button, x+10 w80, Italic
Gui, Add, Button, x+10 w80 gFontSize, FontSize
Gui, Add, DDL, x+10 w80 vFntSz, 1|2|3|4||5|6|7
Gui, Add, Button, x+10 w80 vBgColor gBg, Back Color
Gui, Add, Button, x+10 w80, Reset
Gui Add, ActiveX, x10 w980 h640 vWB, Shell.Explorer  
WB.Visible := true
Gosub, ButtonReset

Gui Show
return

ButtonBold:
doc.execCommand("Bold", false, null)
Gui, Submit, NoHide
return

ButtonReset:
WB.Navigate(A_ScriptDir . "\html.html")
doc := WB.Document
Sleep, 500
doc.DesignMode := "On"
allColl := doc.All
elem := allColl.Item("editableblock")
elem.contentEditable := true
Gui +Resize

Gui Show
Gui, Submit, NoHide

return

ButtonItalic:
doc.execCommand("Italic", false, null)
Gui, Submit, NoHide
return

FontSize:
doc.execCommand("FontSize", false, FntSz)
Gui, Submit, NoHide
return

Bg:
doc.execCommand("BackColor", false, "white")
Gui, Submit, NoHide
return

return

GuiClose:
Escape::ExitApp

HTML Edit 3.gif (206.64 KiB) Viewed 5094 times

[burque505]

A few steps forward ... much to do still. No HTML for this one, it navigates to "about:blank". You can save it, though. More on that later.

Spoiler

Code: Select all

; burque505, December 16, 2018
; using code filched from:
; https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/platform-apis/aa753622%28v%3dvs.85%29
; and
; https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/platform-apis/aa969613%28v%3dvs.85%29
; See also
; https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/platform-apis/ms536419%28v%3dvs.85%29

full_command_line := DllCall("GetCommandLine", "str")

if not (A_IsAdmin or RegExMatch(full_command_line, " /restart(?!\S)"))
{
    try ; leads to having the script re-launching itself as administrator
    {
        if A_IsCompiled
            Run *RunAs "%A_ScriptFullPath%" /restart
        else
            Run *RunAs "%A_AhkPath%" /restart "%A_ScriptFullPath%"
    }
    ExitApp
}


Gui, Add, Button, Default w80, Bold
Gui, Add, Button, x+10 w80, Italic
Gui, Add, Button, x+10 w80, Underline
Gui, Add, Button, x+10 w80 gFontSize, FontSize
Gui, Add, DDL, x+10 w80 vFntSz, 1|2|3|4||5|6|7
Gui, Add, Button, x+10 w80 vBgColor gBg, Back Color
Gui, Add, Button, x+10 w40 vCut, Cut
Gui, Add, Button, x+10 w40 vCopy, Copy
Gui, Add, Button, x+10 w80 vSuperscript, Superscript
Gui, Add, Button, x+10 w40 vSubscript, Subscript
Gui, Add, Button, x+10 w80, Reset
Gui Add, ActiveX, x10 w1200 h800 vWB, Shell.Explorer  
WB.Visible := true
Gosub, ButtonReset

Gui Show
return

ButtonBold:
doc.execCommand("Bold", false, null)
Gui, Submit, NoHide
return

ButtonReset:
WB.Navigate("about:blank")
;WB.Navigate(A_ScriptDir . "\html.html")
doc := WB.Document
Sleep, 500
doc.DesignMode := "On"
allColl := doc.All
elem := allColl.Item("editableblock")
elem.contentEditable := true
Gui +Resize

Gui Show
Gui, Submit, NoHide

return

ButtonItalic:
doc.execCommand("Italic", false, null)
Gui, Submit, NoHide
return

FontSize:
doc.execCommand("FontSize", false, FntSz)
Gui, Submit, NoHide
return

Bg:
doc.execCommand("BackColor", false, 0xe6ffe6)
Gui, Submit, NoHide
return

ButtonCut:
doc.execCommand("Cut", false, null)
Gui, Submit, NoHide
return

ButtonCopy:
doc.execCommand("Copy", false, null)
Gui, Submit, NoHide
return

ButtonSuperscript:
doc.execCommand("Superscript", false, null)
Gui, Submit, NoHide
return

ButtonSubscript:
doc.execCommand("Subscript", false, null)
Gui, Submit, NoHide
return

ButtonUnderline:
doc.execCommand("Underline", false, null)
Gui, Submit, NoHide
return


return

GuiClose:
Escape::ExitApp

HTML Edit 4.gif (156.15 KiB) Viewed 5059 times

[burque505]

Hmmm ... editing MS Word content in the browser. Sort of ...

HTML Edit 5.gif (190.3 KiB) Viewed 5055 times

[kczx3]

Check this out if you haven’t already - https://msdn.microsoft.com/en-us/window ... 0(v=vs.71)

[burque505]

Thanks for the tip. I had seen this one but yours looks more on point for sure.
Regards,
burque505

[Delta Pythagorean]

So far, I love the idea and the work you put into it, but I think you could definitely work on getting this to be a lot easier to not only use, but read in your code. As of right now, I'm currently working on that.
I'd love to see anyone else chipping in and getting this to fully be functional and working.

[tmplinshi]

Nice!

BTW, this also works:

Code: Select all

Gui, Add, Button, Default w80, Bold
Gui, Add, ActiveX, w980 h640 vWB, about:Bold Me
Gui, Show

doc := WB.Document
doc.DesignMode := "On"
return

ButtonBold:
	doc.execCommand("Bold")
return

GuiClose:
ExitApp

[DRocks]

Very cool

[burque505]

@tmplinshi, @Delta Pythagorean, thank you for your help and comments. As always, I am grateful for any help. I know the code is uncommented as of yet, sorry.
Latest version is in OP from now on. Bugs to be squashed and features glaringly missing:

• Links "self-activate" on "Refresh", which for now is the only way to save.

• Opening and saving are cumbersome and not intuitive.

• Need to be able to change background color easily.

• Need to add font color, customizeable font size

• Need color picker.

• Need table support.

• Javascript support desperately needed.

At the end of the animated GIF, the last link activates after refresh. Epic fail ... next candidate for squashing. I think I need to disable navigation.

HTML Edit 6.gif

[burque505]

Teaser. Progress with JS and active content. More soon.
EDIT: See OP for 20181219 version. Thanks. GIF removed from this post.

[burque505]

(December 21, 2018) Latest version in ZIP in OP.

[DRocks]

this is getting good pretty quickly! good job

[burque505]

Thanks, DRocks, I appreciate the encouragement. I hope to have buttons, textareas, marquees, and iFrames by the end of the day, although they will all still need a lot of work, especially in setting properties.
Regards,
burque505

[burque505]

IE version, design mode, proof of concept only. First try.

122318-3.gif (806.01 KiB) Viewed 4680 times

Browser HTML Editor.zip

(13.9 KiB) Downloaded 116 times

[Delta Pythagorean]

I think it'd be better to attach the AHK gui to the IE window and then have the IE window be its own thing.

Also, I highly suggest putting most of these actions into menus instead of having everything be button-based.

[burque505]

DP, thanks for your suggestions.
At some point, hopefully, there will be menus, a floating toolbar, .ini file, settings dialog, template chooser, form builder, a selector inspector, and a help file.
And bells. And whistles
Regards, and happy holidays,
burque505

[kczx3]

And a one horse, open sleigh?