Jump to content

AutoItHelp v3.3.16.1 with external CSS loading


Go to solution Solved by argumentum,

Recommended Posts

The chopping out the unnecessary extra empty rows looks nice in my view.

In regards to the links:

image.png.7aa2bb881f8179c9022c9c5c8777967c.png  image.png.bef6cb5686eca880c02bc08819166393.png

Keeping the " buttons / links " right there, in that position / place, is ideal for when is not an IE browser or not a chm file, the looks are the same.
Keeping that I believe is important, given that the same html, is the one used for the web and chm help interfaces. That is, for general distribution.

All this, that worked in this patch of the chm, has to be transferred/coded, to the scripts and sources that builds the htm files, that in turn builds the chm.
All keeping the default look and feel as it always was. And, the same in a 1080p as in a 4k scaled. Unfortunately 4k scaled don't have a great look as is right now**:
image.png.9c33c994ec30dad1eef49cb3cd2e5598.png

That's the idea anyway ( with the freedom to make it look like you just did above )

I don't have time right now to get knee deep into it and revise it :(

After all, if I don't present an acceptable solution to the devs, I don't think they are not going to devote time to change something that is functional and already in place. 
Hopefully I'll have a full weekend to have a "go at it" and get it done. But I don't see such weekend in sight close by for now.

> Actually, a further note, there was needless (?) empty space above the example text, so I modified the following:
> .codeSnippetContainerCode
> margin-top:14px;

** coming back to that. In a 4k 200% scale, "14px" would not be the same as in 1080p 100% scale.
We need a CSS solution for that, that will work for IE11/CHM :think:

 

Follow the link to my code contribution ( and other things too ).
FAQ - Please Read Before Posting.
autoit_scripter_blue_userbar.png

Link to comment
Share on other sites

Alright @argumentum, thank you for the detailed explanation, it has helped a lot. I wasn't aware of what the complete goal was in the end, other than making some nice CSS files, in regards to colour. But I see your point of not changing more than is necessary (for an overall patch to submit). I'll have to go back to the drawing board on the distances etc. Though I do hope someone more experienced, if not you, has time to come up with a solution, I'm still figuring the whole thing out. (I haven't used CSS or HTML before this week). :) I wasn't aware that it would change much with monitor size, though it does make sense. Other than scaling, I unfortunately don't have an opportunity to try it on a bigger monitor, let alone 4k, but I'm guessing instead of px, a percentage or else "em", or "vw" needs to be used, but that's still just a thought.

Edited by donnyh13

LibreOffice UDF  ; Scite4AutoIt Spell-Checker Using LibreOffice

Spoiler

"Life is chiefly made up, not of great sacrifices and wonderful achievements, but of little things. It is oftenest through the little things which seem so unworthy of notice that great good or evil is brought into our lives. It is through our failure to endure the tests that come to us in little things, that the habits are molded, the character misshaped; and when the greater tests come, they find us unready. Only by acting upon principle in the tests of daily life can we acquire power to stand firm and faithful in the most dangerous and most difficult positions."

 

Link to comment
Share on other sites

4 hours ago, donnyh13 said:

Other than scaling, I unfortunately don't have an opportunity to try it on a bigger monitor, let alone 4k

4k is nice to look at. Never gave it 2 thoughts until I got me one.
But the problem is the scaling, not the size of the monitor.
The only difference is that at 200% a 1080p ( 1k ), it would look like 800x600 monitor ( give or take ). A 4k is not needed to code the scaling. The visual oddness can be seen in a 1k all the same.
200% is too easy ( pixel wise )  so I do 175% or 225% just to accentuate the ugliness ( or better named: "misalignment" ) :)

Just like you, am not a web developer. So all this CSS stuff. Mind boggling. :baby:

Follow the link to my code contribution ( and other things too ).
FAQ - Please Read Before Posting.
autoit_scripter_blue_userbar.png

Link to comment
Share on other sites

7 minutes ago, argumentum said:

But the problem is the scaling, not the size of the monitor.

Okay. Thank you very much for that information. I can at least reproduce it now.

LibreOffice UDF  ; Scite4AutoIt Spell-Checker Using LibreOffice

Spoiler

"Life is chiefly made up, not of great sacrifices and wonderful achievements, but of little things. It is oftenest through the little things which seem so unworthy of notice that great good or evil is brought into our lives. It is through our failure to endure the tests that come to us in little things, that the habits are molded, the character misshaped; and when the greater tests come, they find us unready. Only by acting upon principle in the tests of daily life can we acquire power to stand firm and faithful in the most dangerous and most difficult positions."

 

Link to comment
Share on other sites

I came across @media (Resolution) for CSS, and thought it might be an answer, but its only for IE9 and up, and the CHM viewer is IE7 max 😕

(https://stackoverflow.com/questions/11300887/which-css-versions-are-supported-in-chm-files)

(https://weblog.west-wind.com/posts/2012/feb/15/make-your-chm-help-files-show-html5-and-css3-content)

so it doesn't work. Wonder if there's another CHM viewer AutoIt could ship with? Probably not. Going to have to get inventive on this one....

 

 

Edited by donnyh13

LibreOffice UDF  ; Scite4AutoIt Spell-Checker Using LibreOffice

Spoiler

"Life is chiefly made up, not of great sacrifices and wonderful achievements, but of little things. It is oftenest through the little things which seem so unworthy of notice that great good or evil is brought into our lives. It is through our failure to endure the tests that come to us in little things, that the habits are molded, the character misshaped; and when the greater tests come, they find us unready. Only by acting upon principle in the tests of daily life can we acquire power to stand firm and faithful in the most dangerous and most difficult positions."

 

Link to comment
Share on other sites

image.png.cbff39df7d059c3962e25839f771fac2.png

.. I think that it uses IE from your current version. IE11 in Win10.
There is code for finding out the browser version:
https://stackoverflow.com/questions/10964966/detect-ie-version-prior-to-v9-in-javascript
( untested by me )

Follow the link to my code contribution ( and other things too ).
FAQ - Please Read Before Posting.
autoit_scripter_blue_userbar.png

Link to comment
Share on other sites

4 minutes ago, argumentum said:

that it uses IE from your current version.

According to those two links i referenced, it stopped at IE7 no matter what version is installed, but I'll see if I can figure out how to use the code you posted.

Edit: it could be I don't have an up-to-date IE install. Will check

Edited by donnyh13

LibreOffice UDF  ; Scite4AutoIt Spell-Checker Using LibreOffice

Spoiler

"Life is chiefly made up, not of great sacrifices and wonderful achievements, but of little things. It is oftenest through the little things which seem so unworthy of notice that great good or evil is brought into our lives. It is through our failure to endure the tests that come to us in little things, that the habits are molded, the character misshaped; and when the greater tests come, they find us unready. Only by acting upon principle in the tests of daily life can we acquire power to stand firm and faithful in the most dangerous and most difficult positions."

 

Link to comment
Share on other sites

Posted (edited)

http://download.jgsoft.com/helpscribble/UserAgent.chm

Turns out that yes:

HTML Help User Agent
navigator.userAgent = Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 10.0; Win64; x64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; Tablet PC 2.0) 

https://stackoverflow.com/questions/11300887/which-css-versions-are-supported-in-chm-files

Ok then. We'll have to work with what we've got.

Edit:
Where to get "Windows Internet Explorer 7 for Windows XP" from.

Edited by argumentum
more

Follow the link to my code contribution ( and other things too ).
FAQ - Please Read Before Posting.
autoit_scripter_blue_userbar.png

Link to comment
Share on other sites

At least we know now what to look for.

LibreOffice UDF  ; Scite4AutoIt Spell-Checker Using LibreOffice

Spoiler

"Life is chiefly made up, not of great sacrifices and wonderful achievements, but of little things. It is oftenest through the little things which seem so unworthy of notice that great good or evil is brought into our lives. It is through our failure to endure the tests that come to us in little things, that the habits are molded, the character misshaped; and when the greater tests come, they find us unready. Only by acting upon principle in the tests of daily life can we acquire power to stand firm and faithful in the most dangerous and most difficult positions."

 

Link to comment
Share on other sites

On 3/20/2024 at 2:04 PM, donnyh13 said:

I'm using a program called "Precision Helper"

I checked and the engine that it uses, is the same as a chm file somehow.
navigator.userAgent = Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.2; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; Tablet PC 2.0)

Maybe is a good "web browser" for viewing these files.

Follow the link to my code contribution ( and other things too ).
FAQ - Please Read Before Posting.
autoit_scripter_blue_userbar.png

Link to comment
Share on other sites

31 minutes ago, argumentum said:

Maybe is a good "web browser" for viewing these files.

This works:

as per: https://stackoverflow.com/questions/11300887/which-css-versions-are-supported-in-chm-files

Quote

The same applies to WebBrowser controls. You can override the rendering mode (but not browser mode) by adding <meta http-equiv="X-UA-Compatible" content="IE=edge" /> to your HTML file. You can override both for HTML Help Viewer (hh.exe) by setting a registry key.

– Lexikos

Jan 29, 2014 at

in the htm file,

<!-- <META HTTP-EQUIV="Content-Type" CONTENT="text-html;charset=UTF-8"> -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />

and @media works in the chm!

Edit: actually I don't have to comment out the other Meta either. But I'm not sure if it serves purpose? with the new one?

Edited by donnyh13

LibreOffice UDF  ; Scite4AutoIt Spell-Checker Using LibreOffice

Spoiler

"Life is chiefly made up, not of great sacrifices and wonderful achievements, but of little things. It is oftenest through the little things which seem so unworthy of notice that great good or evil is brought into our lives. It is through our failure to endure the tests that come to us in little things, that the habits are molded, the character misshaped; and when the greater tests come, they find us unready. Only by acting upon principle in the tests of daily life can we acquire power to stand firm and faithful in the most dangerous and most difficult positions."

 

Link to comment
Share on other sites

Posted (edited)
On 3/22/2024 at 5:48 PM, donnyh13 said:

But I'm not sure if it serves purpose? with the new one?

Fear not citizen for I am here :lol:

I put together a CHM with "modernizr" to test stuff. The file is "modernizr4ChmTestBed_v0.0.0.3.zip".

It has descriptions and links and is all very ugly looking but a good tool for discovery and learning.

Edit: v0.0.0.2 has better looking links.
Edit: v0.0.0.3 has more information about compatibility mode

Edited by argumentum
more

Follow the link to my code contribution ( and other things too ).
FAQ - Please Read Before Posting.
autoit_scripter_blue_userbar.png

Link to comment
Share on other sites

13 hours ago, argumentum said:

tested the chm

Excellent, so 4k 175% is pretty now too?

LibreOffice UDF  ; Scite4AutoIt Spell-Checker Using LibreOffice

Spoiler

"Life is chiefly made up, not of great sacrifices and wonderful achievements, but of little things. It is oftenest through the little things which seem so unworthy of notice that great good or evil is brought into our lives. It is through our failure to endure the tests that come to us in little things, that the habits are molded, the character misshaped; and when the greater tests come, they find us unready. Only by acting upon principle in the tests of daily life can we acquire power to stand firm and faithful in the most dangerous and most difficult positions."

 

Link to comment
Share on other sites

No clue yet. You are not familiar with CSS, neither am I. We needed a tool to find out what would work and what wouldn't, hence the "modernizr4ChmTestBed".
That way, frustration of "this :censored: isn't working" is minimized.

Now I ( or any willing soul ) has to make a better CSS that don't rely just on "px" measurements. This "ex" uses the size of the letter "o" or "x" to determine the size ( as far as I read so far anyway ). In any case "ex" may not work that well either. It has to be tried and tested.

Another thing  that I noticed is that with IE7, in the browser area there is a border, and with emulations it ain't there.

image.png.4f0556d0b378aef079087e74b9d9722a.png   image.png.3301bbde43618a3914a11e2444fa2ddf.png

So that'll need attention too.

Follow the link to my code contribution ( and other things too ).
FAQ - Please Read Before Posting.
autoit_scripter_blue_userbar.png

Link to comment
Share on other sites

Ah, okay. I misunderstood. Thank you. Okay. we are at least one step closer. With easier testing tools.

Good catch on the border, almost looks like the inner page is overlapping?

I can take a swing at a CSS for now as time permits, till you get a chance, maybe we can compare results if anything is successful on my end.  I may try percentages too, besides ex, since, from my understanding, ex would vary with font size, which could cause unexpected results? Not sure, I also tend to over-think things. 🙄

LibreOffice UDF  ; Scite4AutoIt Spell-Checker Using LibreOffice

Spoiler

"Life is chiefly made up, not of great sacrifices and wonderful achievements, but of little things. It is oftenest through the little things which seem so unworthy of notice that great good or evil is brought into our lives. It is through our failure to endure the tests that come to us in little things, that the habits are molded, the character misshaped; and when the greater tests come, they find us unready. Only by acting upon principle in the tests of daily life can we acquire power to stand firm and faithful in the most dangerous and most difficult positions."

 

Link to comment
Share on other sites

>ex would vary with font size,
Yes.

>which could cause unexpected results?
No idea. For what I read not all fonts are well behaved either. So maybe ?.
If the help file worked well ( aesthetically speaking ) in WinXP, that would be grand. If Win7 is the minimum, then that's that.
The idea is to make it look as good as possible for as far back as possible.
8k PC monitor are the next thing. Have to keep that in mind to make the chm future proof.
But for now I have to go do the dailys:laser:

>I also tend to over-think things
Same here. 😅

Follow the link to my code contribution ( and other things too ).
FAQ - Please Read Before Posting.
autoit_scripter_blue_userbar.png

Link to comment
Share on other sites

Posted (edited)

The CHM testbed is in v0.0.0.3 now and explains/shows what goes on when the "X-UA-Compatible" declares something, and what actually got done in the browser.
Nicer looking too. It has checkmarks ( ✔ )  instead of the plus ( + ) signs for when something is functional ( very important ) :lol:

Edited by argumentum

Follow the link to my code contribution ( and other things too ).
FAQ - Please Read Before Posting.
autoit_scripter_blue_userbar.png

Link to comment
Share on other sites

Thanks for the updated testbed...and the checkmarks! 🤩

I guess I got ahead of myself... I'm not able to reproduce the ugly affect, with scale at 175% the regular autoIt chm doesn't seem to do the same as you are having, where the "Open script" gets messed up. I could try some more stuff and see, maybe 225% scale. Unless I misunderstood you again.

On a side note, adjusting font setting in chm causes the "open Script" to raise or drop above/below the line similar to what you experienced... And with that, I have completed transferring the px values to ex using the highly accurate method of eyeballing it to see if it moved any... 🧐 It looks the same as the original autoIt chm, but does the same adjustments when font is adjusted as noted above.... BUT, if we do the modification of changing "Open Script" from an Object to a link, it stays put pretty good. (For me). That would require a minor modification of the CSS, but I would need to know what way you wish to go. You said you would prefer not to add another Class, which can be done by re-using the class ".codeSnippetContainerTabSingle" for the new "open Script" link, instead of the custom one you added before.

To change the "open Script" from an Object to a Link the CSS would have to specify the font size for the link to match the "copy to Clipboard" size, and also "float:left;, which I did already add as it didn't break the looks of the object either. maybe other stuff to match "Copy To Clipboard".

Tests:

Font adjustment, regular AutoIt CHM -- ex Units

Spoiler

"medium (Normal)" font.2024-03-2510_02_46-AutoItHelp(v3.3_16.1).thumb.png.fdabf9aa9094276abe439c976dee1ea7.png

"smallest" font.

2024-03-2510_02_37-AutoItHelp(v3.3_16.1).thumb.png.7a1f0bedaea51d36711ff8343f1afd60.png

"Largest" font

2024-03-2510_02_30-AutoItHelp(v3.3_16.1).thumb.png.065809392239dd9585a502db9fd89c6c.png

 

Font adjustment, "Open Script" as link CHM -- ex Units (NOTE: font size not set for link)

Spoiler

"medium (Normal)" font.

2024-03-2510_14_45-Testing123HelpFile.png.b55707436029325739b0dc1542a85399.png

"smallest" font.

2024-03-2510_15_13-Testing123HelpFile.png.450beda873711a5ec5f6f81b854c59a5.png

"Largest" font

2024-03-2510_15_00-Testing123HelpFile.png.1d6fb08b5a43a7ef2e9f64f986df17e0.png

 

My results at 175% scale

Spoiler

New CSS

2024-03-2510_19_51-Greenshot-Copy.thumb.png.bfc7ce62bf07043a50fa042c4a3f0ea6.png

Regular CSS

2024-03-2510_22_03-Greenshot-Copy.thumb.png.ee99b6d27918d42430225992496e5016.png

 

Here's the CSS if you want to test it.

Edit: haven't gotten a chance to look at the oddities with emulation yet.

AutoIt.css

Edited by donnyh13

LibreOffice UDF  ; Scite4AutoIt Spell-Checker Using LibreOffice

Spoiler

"Life is chiefly made up, not of great sacrifices and wonderful achievements, but of little things. It is oftenest through the little things which seem so unworthy of notice that great good or evil is brought into our lives. It is through our failure to endure the tests that come to us in little things, that the habits are molded, the character misshaped; and when the greater tests come, they find us unready. Only by acting upon principle in the tests of daily life can we acquire power to stand firm and faithful in the most dangerous and most difficult positions."

 

Link to comment
Share on other sites

Posted (edited)

Looks great !
image.thumb.png.87a26b30fbbb7b6e983da0f671753660.png

( this is a pic. of some testing with the worth of changing the IE engine )

So, CSS. Look at that. Awesome !.

No longer relevant but here's the testing I was doing:

Spoiler


normal IE ( 7 )

navigator.userAgent: Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 10.0; Win64; x64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; Tablet PC 2.0)

navigator.userAgentData: undefined

navigator.appName: Microsoft Internet Explorer

navigator.appVersion: 4.0 (compatible; MSIE 7.0; Windows NT 10.0; Win64; x64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; Tablet PC 2.0)

document.documentMode: (MSIE v.): 7

document.compatMode: CSS1Compat



with IE as edge

navigator.userAgent: Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 10.0; Win64; x64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; Tablet PC 2.0)

navigator.userAgentData: undefined

navigator.appName: Netscape

navigator.appVersion: 4.0 (compatible; MSIE 7.0; Windows NT 10.0; Win64; x64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; Tablet PC 2.0)

document.documentMode: (MSIE v.): 11

document.compatMode: CSS1Compat


Here it shows clearly to me that the CHM is internally emulated to have the quirks of IE7 but does in fact use the current IE in the user's PC

Even the "Open this Script" button looks good, ..until I Ctrl + "+" to zoom in. Then the link style ( Example 2 ) is the winner, as it behaves impeccably as far as size and alignment. 
image.png.1c591c6fd90281117a94527511542506.png   image.png.86b73872b331b7db2ec3022762e213a5.png

Ok, then emulation is not needed and it looks just great with the CSS tweaks. :cheer:

Edited by argumentum
more pics

Follow the link to my code contribution ( and other things too ).
FAQ - Please Read Before Posting.
autoit_scripter_blue_userbar.png

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...