TIpHTMLPanel
lazarus / 5-Lazarus Extra Components

----------------------------------------------------------------------
CCRDude · 2018-11-05 21:21

While making my project cross-platform, my last hurdle today was HTML
display (used for displaying update notice and the integrated help).

I've been using TFrameViewer09 for many years, but it displays a blank
page on Cocoa. To use RichMemo, my first alternative, I would have
needed a HTML to RTF converter.

I then found TIpHTMLPanel. TurboPower is a name that rings a bell, I
used libraries from a company by that name like 25 years ago for
creating GUIs on Turbo Pascal 5.5.

Works fine - except for the background color. The background is always
white for me.

I do set the default colors this way:
Code: [Select]   if Assigned(FHTMLIP) then begin
      FHTMLIP.Color := AStyle.Window.BackgroundColor;
      FHTMLIP.DefaultTypeFace := AStyle.Window.FontName;
      FHTMLIP.LinkColor :=
AStyle.Table.Header.ActionFont.FontHoveredColor;
      FHTMLIP.BgColor := AStyle.Window.BackgroundColor;
      FHTMLIP.ALinkColor :=
AStyle.Table.Header.ActionFont.FontHoveredColor;
   end;This is called in SetParent before the HTML is loaded from the
files resources. Settng the type face and link color works correctly.

What can I do to get the background correct?

(adding it as css is not an option, since due to support for Dark Mode
in Windows and MacOS I need to toggle background & font colors.

----------------------------------------------------------------------
wp · 2018-11-05 22:31

Using the BgColor property, I did not get it to work either. But
setting the background color with a style works. So why don't you
replace the text "<body" of your html by "<body style="background-
color:yellow" to force a yellow background?

----------------------------------------------------------------------
lucamar · 2018-11-05 23:35

Quote from: CCRDude on November 05, 2018, 10:21:57 pm(adding it as css
is not an option, since due to support for Dark Mode in Windows and
MacOS I need to toggle background & font colors.

If nothing else works and you must add CSS--as suggested by wp--you
could try using something like this to convert any TColor to a CSS-
color string:

Code: Pascal  [Select][+][-]window.onload = function(){var x1 =
document.getElementById("main_content_section"); if (x1) { var x =
document.getElementsByClassName("geshi");for (var i = 0; i function
ColorToHTML(const AColor: TColor): String;begin  Result := '#' +
HexStr(ColorToRGB(AColor), 6);end;

----------------------------------------------------------------------
CCRDude · 2018-11-06 08:15

Many thanks for the confirmation that BgColor does not seem to work.

Changing the HTML content would mean that I would have to cache/reload
the content. I looked into TipHTML to see how it handles CSS, and
found another way:

Code: [Select]procedure
TCustomSpybot3DocumentFrame.HtmlEnumerator(Document: TIpHtml);
var
   n: TIpHtmlNode;
   nb: TIpHtmlNodeBODY;
begin
   if not Assigned(Document.HtmlNode) then begin
      Exit;
   end;
   if Document.HtmlNode.ChildCount < 1 then begin
      Exit;
   end;
   n := Document.HtmlNode.ChildNode[0];
   if not (n is TIpHtmlNodeBODY) then begin
      Exit;
   end;
   TIpHtmlNodeBODY(n).BgColor := FHTMLIP.BgColor;
end;
And where the style change is applied:
Code: [Select]      FHTMLIP.EnumDocuments(@HtmlEnumerator);

----------------------------------------------------------------------
bobix · 2018-11-06 09:18

I dont think that TIpHTMLPanel has css support, but this maight be
supported:

 <html>
<body bgcolor="#E6E6FA">
<h1>Hello world!</h1>
<p>Hello world!</p>
</body>
</html>

----------------------------------------------------------------------
wp · 2018-11-06 09:30

I fixed BgColor in the current trunk version, and it is a published
property now. It is used unless a background color or background image
is defined inside the html string.

Not sure about backporting to v2.0RC3 as the new version will soon be
released. If you don't use trunk you can fix your version with these
changes:
Open the file iphtml.pas in the folder components/turbopower_ipro.
Make a backup copy first.Find procedure TIpHtmlFrame.InitHtml and add
the line: "FHtmlBgColor := FViewer.BgColor;", maybe after
"FHtml.VLinkColor := ..."Find procedure TIpHtmlNodeBODY.Render. In the
"else" branch of "if ScaleBitmaps" there is a
"Owner.Target.Brush.Color := clWhite;". Replace the "clWhite" by
"Owner.BgColor". You probably can replace also the two other
"clWhite"s in this procedure in the same way.Find the "published"
declaration section of TIpHtmlPanel. Add a "property
BgColor;".Reinstall the component.

----------------------------------------------------------------------
wp · 2018-11-06 09:32

Quote from: bobix on November 06, 2018, 10:18:50 amI dont think that
TIpHTMLPanel has css support
Wrong, it does have css support, but not for all fancy features.
"background-color" is supported.

----------------------------------------------------------------------
CCRDude · 2018-11-06 11:50

Thank you very much @wp!
Glad to hear this is still in development and gets improved so
quickly!
Good to have a fix instead of having to use a workaround