Posted on by George Henne

Hacking the Print statement

AppStudio 3.0 introduced a much improved Print statement. It wasn’t long before one of our users, Erkan Kaplan, started wondering whether he could do to make it do more. He realized the text in it is HTML. That opened up all kinds of possibilities.

First, he had it display some text and a picture:

  s = "Hello World!"
  s = s & "<br><img src=mario.jpg>"
  Print s

Next, he tried resizing it. Realizing that it was a control with the internal name of NSB_Progress, he came up with this code. He found it needs to be executed after the Print statement, so NSB_Progress exists.

  top1 = (window.innerHeight/2)-150
  left1 = (window.innerWidth/2)-150
  NSB_Progress.style.top = top1 + "px"
  NSB_Progress.style.left = left1 + "px"
  NSB_Progress.style.height="250px"
  NSB_Progress.style.width="175px"

He experimented the changing the background. Using a handy tool called CSSmatic, he generated a nice looking gradient background:

  NSB_Progress.style.background="-webkit-gradient(left top, right top, 
color-stop(0%, rgba(76,76,76,1)), color-stop(12%, rgba(89,89,89,0.96)), 
color-stop(18%, rgba(98,98,98,0.94)), color-stop(21%, rgba(102,102,102,0.94)), 
color-stop(32%, rgba(71,71,71,0.94)), color-stop(42%, rgba(44,44,44,0.94)), 
color-stop(53%, rgba(0,0,0,0.94)), color-stop(75%, rgba(17,17,17,0.94)), 
color-stop(86%, rgba(43,43,43,0.94)));"

Changing the font size and color was no problem:

  NSB_text.style.fontSize="20px"
  NSB_text.style.color="red"

Here’s what it ended up looking like:
Print1