Page 7 of 8
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 13 Sep 2019, 07:53
by joedf
The code seems fine overall except for the setAttribute() calls. They should change class instead, but dont use that. You can access the class with ".className"
Also you gotta check if IE or whatever browser is running, that it supports "filter".
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 13 Sep 2019, 17:56
by Mipha
joedf wrote: ↑13 Sep 2019, 07:53
The code seems fine overall except for the setAttribute() calls. They should change
class instead, but dont use that. You can access the class with ".className"
Also you gotta check if IE or whatever browser is running, that it supports "filter".
The browser does not support filter. I've tried more things like loading a html file into ahk and the same file into chrome and trying the same thing it it would work for chrome but not for ahk. Are there any alternatives?
I've tried changing class instead of classname in the
setAttribute() before posting the code here but that didn't work at all.
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 13 Sep 2019, 20:27
by kczx3
You should use classList.add actually.
And yes, Internet Explorer doesn’t support the filter css property at all. So it won’t work.
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 14 Sep 2019, 05:30
by malcev
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 14 Sep 2019, 06:28
by kczx3
@malcev
What’s your point? It used to be supporters but didn’t follow any standards and was thus removed
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 14 Sep 2019, 06:33
by malcev
They were not removed.
You can still use it using proper document mode (<10) and modifying security settings.
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 14 Sep 2019, 06:48
by kczx3
Both I wouldn’t recommend to anyone
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 14 Sep 2019, 07:10
by malcev
Why?
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 14 Sep 2019, 11:54
by joedf
If you open your HTML file directly in IE and it doesn't work... but it works in chrome. Then it will not work with your current script since it will utilize IE.
You might have to try something like Chrome.ahk
https://www.autohotkey.com/boards/viewtopic.php?f=6&t=42890
If not you can also consider alternatives such using a js-canvas or consider different image files. Either way, filter is not a necessity.
Help with HTML and CSS in GUIs
Posted: 09 Jun 2020, 07:05
by rick123
I can't figure out why my code doesn't work.
Anyone may help me, please?
The function "myFunctionInput" doens't work in AHK, althoug it's working correctly when I open html page directly.
My HTML page
Code: Select all
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<link rel="stylesheet" href="assets/css/github-markdown.css">
<style>
html{margin:0;padding:0;overflow:auto;}
*{text-shadow:0px 1px 0px #FFFFFF;font-family:tahoma;}
div {color: #888888;font-size:30px}
</style>
</head>
<body style="background-color: #dde4ec">
<div>Title</div>
<p><b>Note:</b>This is an example page.</p>
<p>A function is triggered when the user releases a key in the input field. The function outputs the actual key/letter that was released inside the text field.</p>
Enter your name: <input type="text" id="fname" onkeyup="myFunctionInput()">
<p>My name is: <span id="demo"></span></p>
<script>
function myFunctionInput(s) {
MyInput = document.getElementById("fname").value;
document.getElementById('demo').innerHTML = MyInput;
}
</script>
</body>
</html>
This is my AHK program
Code: Select all
#SingleInstance off
#NoTrayIcon
SendMode Input
#Include Lib\Webapp.ahk
__Webapp_AppStart:
;<< Header End >>
;Get our HTML DOM object
iWebCtrl := getDOM()
;Change App name on run-time
setAppName("Minha Tabela Filtrável")
; cut auto run main thread.
Return
; Webapp.ahk-only Sensitive hotkeys
#IfWinActive, ahk_group __Webapp_windows
!Enter::
;!toggle
setFullscreen(!__Webapp_FullScreen)
Return
#IfWinActive
; Our custom protocol's url event handler
app_call(args) {
MsgBox %args%
if InStr(args,"msgbox/hello")
MsgBox, % "Hello world!"
}
; function to run when page is loaded
app_page(NewURL) {
wb := getDOM()
setZoomLevel(100)
}
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 09 Jun 2020, 09:14
by joedf
myFunctionInput() is only javascript. there's no AHK there.
If you want to use an AHK function, you'll need to call it like so
AHK('myAHKFunctionName', parameter1, parameter2) or similar.
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 09 Jun 2020, 13:41
by rick123
Thanks joedf, but I was following the example in the file
https://github.com/joedf/Webapp.ahk/blob/master/src/page2.html where we can see a function named
normal_js_function that is called from javascript alone.
Code: Select all
...
<button type="button" onclick="normal_js_function()">Normal js alert</button>
...
<script>
function normal_js_function(s) {
alert("hello from javascript alone.");
}
</script>
Is it not the same thing I'm trying to do?
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 10 Jun 2020, 08:17
by joedf
Hmm.. not sure why the keyup event isn't working
but you can this instead (seems to work flawlessly):
<input type="text" id="fname" oninput="myFunctionInput()" onpropertychange="myFunctionInput()">
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 10 Jun 2020, 10:58
by rick123
Great, now it's working.
I apreciate your help.
Thank you very much!
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 10 Jun 2020, 17:57
by joedf
glad it works
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 25 Jan 2021, 01:37
by Hobby77
Very cool project!
Thank you for your contribution!
I want to know that I have many js files and css files, they are stored in different folders.
I want ahk2exe to compile only contain html, how should it call js or css code other than rdata
sorry for my poor english.
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 25 Jan 2021, 10:18
by joedf
Have you tried the following?
Webapp.ahk
https://www.autohotkey.com/boards/viewtopic.php?f=6&t=21516
Neutron.ahk
https://www.autohotkey.com/boards/viewtopic.php?f=6&t=76865
You can directly include files by using relative file paths in your scripts and html.
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 27 Jan 2021, 09:38
by Hobby77
Thank you for your reply! It works fine on webapp
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 12 May 2021, 22:50
by jsong55
I'm using
https://www.autohotkey.com/boards/viewtopic.php?t=35199
WebPic function. However, somehow can't seem to get the image to have border-radius: 50%; circular effect
even after I changed this part of the code
Code: Select all
(RTRIM
"<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color: #" C ";
}
img {
<!--This was changed-->
border-radius: 40%;
}
</style>
</head>
<body>
<img src=""" Website """ alt=""Picture"" style=""width:" W "px;height:" H "px;"" />
</body>
</html>"
)
Re: [GUI] Use HTML and CSS for your GUIs!
Posted: 13 May 2021, 08:22
by joedf
Not familiar with WebPic ...
perhaps try inline style?
<img src=""" Website """ alt=""Picture"" style=""width:" W "px;height:" H "px; border-radius: 50%;"" />