Vector Graphics Experiments

[Hutchboy]

Hi,
[Update...removed stack for revisions]

Happy President's day. The enclosed stack covers my recent experiments with vector graphics, with the ultimate goal of seeing how far I can get in recreating an Atari Tempest style game or to use the routines in other apps.

Most of the explanations for the scripts are in the script headers and inline comments.

In the Vector Lightning code I have a stub for creating random branch lightning, but have not been successful (yet) in getting what should be an easy mod working.

Happy Coding, - Mike

[stam]

That is pretty cool, thank you for sharing.
Look forward to seeing this in action

[Hutchboy]

Hi,

[Update: file superseded, see new post below]

Attached is my take on a 7 segment LED display simulation. I know this has been done before but I thought I'd take a crack at it. Next up will be a 14 segment LED display and a way to string a number of them together to use for scoring and timers in a game.

Everything is pretty well documented in the card script for this stack. I used "regular" polygons for the segments so you could easily revise the number of sides (polySides) and rotation angles to change the display to your liking.

Happy Coding,

- Mike

[stam]

that's clever

just had a quick tinker - it crashes on trying to manually change any settings using the sliders.

On sliders that change the number, it crashes on

Code: Select all

card id 10035: execution error at line 110 (Object: can't set object property), char 7

on the backdrop settings, it crashes on

Code: Select all

card id 10035: execution error at line 98 (penColor: bad color), char 1

Also - setting the number to 5 or 6 generates a 7 in the group

[stam]

As far as I can tell, it's crashing because the numbers you're using for RBG & alpha must be integers but your sliders are not set up to generate integers, but floats instead (e.g. instead of '133' it generates '133.524752')

you can change all of your sliders to generate integers only, but it may be simpler (and safer) to change your script from

Code: Select all

put the thumbPosition of scrollBar ...

to

Code: Select all

put the round of the thumbPosition of scrollBar ...

on a quick test that got rid of the crashes for me...


PS: You do have some strange code, which I wonder may have been generated by your chatGPT helper?
for example:

Code: Select all

call ("TurnOn" && quote & tSegmentsOn & quote)

in actual liveCodeScript would be:

Code: Select all

TurnOn tSegmentsOn

[stam]

Also looking into why '5' and '6' don't work (still not sure why!) I would also suggest a refactor to the displayDigit handler. This currently actually involves 3 handlers: DisplayDigit, TurnOn and TurnOff, and you are keeping a list of both segments to show and segments to hide.

Your current code is 69 lines long with 3 handlers:

Code: Select all

command DisplayDigit pDigit
    local tSegmentsOn, tSegmentsOff, tempOn, tempOff
    switch pDigit
        case "0"
            put "A,B,C,D,E,F" into tSegmentsOn
            put "G" into tSegmentsOff
            break
        case "1"
            put "B,C" into tSegmentsOn
            put "A,D,E,F,G" into tSegmentsOff
            break
        case "2"
            put "A,B,D,E,G" into tSegmentsOn
            put "C,F" into tSegmentsOff
            break
        case "3"
            put "A,B,C,D,G" into tSegmentsOn
            put "E,F" into tSegmentsOff
            break
        case "4"
            put "B,C,F,G" into tSegmentsOn
            put "A,D,E" into tSegmentsOff
            break
        case "5"
            put "A,C,D,F,G" into tSegmentsOn
            put "B,E" into tSegmentsOff
        case "6"
            put "A,C,D,E,F,G" into tSegmentsOn
            put "B" into tSegmentsOff
        case "7"
            put "A,B,C" into tSegmentsOn
            put "D,E,F,G" into tSegmentsOff
            break
        case "8"
            put "A,B,C,D,E,F,G" into tSegmentsOn
            -- No segments to turn off
            break
        case "9"
            put "A,B,C,F,G" into tSegmentsOn
            put "D,E" into tSegmentsOff
            break
        default
            put "Invalid digit: " & pDigit into field "ErrorMessage"
            exit DisplayDigit
    end switch
    
    -- Correctly formatted call statements
    if tSegmentsOn is not empty then
       call ("TurnOn" && quote & tSegmentsOn & quote)
    end if
    if tSegmentsOff is not empty then
       call ("TurnOff" && quote & tSegmentsOff & quote)
    end if
end DisplayDigit

command TurnOn pSegments
  -- Turn on specified segments
  repeat for each item tSegment in pSegments
     set the visible of graphic ("segment" & tSegment) to true
  end repeat
end TurnOn

command TurnOff pSegments
  -- Turn off specified segments
  repeat for each item tSegment in pSegments
     set the visible of graphic ("segment" & tSegment) to false
  end repeat
end TurnOff

This can be very efficiently refactored by setting the visibility of each graphic to a condition that resolves to True or False, rather than acting on lists of graphics to show and graphics to hide (so you don't need the turnOn and turnOff handlers), and declaring the visible graphics for each digit as constants.
The refactored code is 10 lines of constant declarations and a single handler with only 7 lines of code as the displayDigit hander!

Code: Select all

constant k0 = "A,B,C,D,E,F"
constant k1 = "B,C"
constant k2 = "A,B,D,E,G"
constant k3 = "A,B,C,D,G"
constant k4 = "B,C,F,G"
constant k5 = "A,C,D,F,G"
constant k6 = "A,C,D,E,F,G"
constant k7 = "A,B,C"
constant k8 = "A,B,C,D,E,F,G"
constant k9 = "A,B,C,F,G"

Code: Select all

command displayDigit pDigit
    local tSegmentsOn
    put value("k" & pDigit) into tSegmentsOn   
    repeat for each item tSegment in "A,B,C,D,E,F,G"
        set the visible of graphic ("segment" & tSegment) to tSegmentsOn contains tSegment
    end repeat
end displayDigit

This would be my preferred approach as it makes it much easier to read/understand/debug...

Stam

[Hutchboy]

Hi, thanks for the feedback. The 5 and 6 numbers had been working correctly previously but now they don't. I am noticing that segmentG is not responding the same as the other segments with respect to the glow slider settings. I had to regroup these elements a few times but I don't see anything obvious after looking through the project browser.

I changed the slider code to use "put the round of the thumbPosition" to ensure I am working with integers per your suggestion. I don't really understand why it doesn't crash on my machine without that change.

Your refactoring suggestions look good...I think I need to do a bit more text munging because I would NEVER have thought of this: "set the visible of graphic ("segment" & tSegment) to tSegmentsOn contains tSegment". I had to read this several times to figure out what you were doing here, it's not intuitive to me.

69 lines down to 7, yikes! I'm going to have to have a serious discussion with my chatGPT helper. :shock: - Mike

[stam]

Your refactoring suggestions look good...I think I need to do a bit more text munging because I would NEVER have thought of this: "set the visible of graphic ("segment" & tSegment) to tSegmentsOn contains tSegment". I had to read this several times to figure out what you were doing here, it's not intuitive to me.

69 lines down to 7, yikes! I'm going to have to have a serious discussion with my chatGPT helper. - Mike

I use conditional visibility quite a lot, so it stood out for me.

It boils down to

Code: Select all

set the visible of <item> to <expression that evaluates to true or false>

This expression can be a variable, but the cool thing is that instead of a variable, you can put the full expression into the bit that evaluates to a boolean (this is commonplace in other languages). So this just means set visibility to true if the the letter iterated is contained in tSegmentOn and to false if not...
Hope that makes sense

But you must have a chat with your GPT helper about the 'call' code I mentioned in the previous post above. This is not really correct.

[Hutchboy]

I think I found the problem with the 5 & 6...I am missing break statements in the switch control structure for those cases. Once I get this all sorted out and boot the "call" command to the curb I will upload a new version and delete the old.

[stam]

I think I found the problem with the 5 & 6...I am missing break statements in the switch control structure for those cases.

Yep, now you mention it, it's obvious
That is the main reason I try to make my handler shorter - too much text makes it difficult to spot errors that don't trigger an exception.
Sometimes not possible, but it is here...

[Hutchboy]

Hi,

I've updated my LED stack to handle both 7 and 14 segment LED's and to incorporate Stam's welcome recommendations. The 14 segment LED handles both single digits and single characters and it uses line graphics in contrast to the regular polygons used as the segments in the 7 segment version.

Next up is to set up a multiple LED display and create a demo of different use cases.

-Mike

[stam]

Thanks Mike, great stuff!

The thorny issue of re-sizing may be quite a bit of work, especially with the 14 segment version... This has to be an important feature I guess. You'd need to maintain the aspect ratio and resize/reposition individual graphics in the resizeControl handler.

Do you think your ChatGPT helper can streamline this? this is a common thing I do with my group controls and it's always a pain, would be fantastic if ChatGPT could automate but not sure that would be feasible...


In the meantime, could I suggest a tiny (and quite trivial) change to the script of field "inputField"?
I keep hitting 'enter' and it's annoying because it makes me delete and I'm lazy

Code: Select all

on returnInField
    if the text of me is not empty then click at loc of button "displayButton"
end returnInField

Rather than generating an error if wrong/too many chars, just don't let me:
7 segment:

Code: Select all

on keyDown pKeyName
    if length(the text of me) < 1  and pKeyName is in "0123456789" then pass keyDown
end keyDown

14 segment:

Code: Select all

on keyDown pKeyName
    if length(the text of me) < 1 then pass keyDown
end keyDown

Stam

[bn]

Hi Mike,

there is a small glitch in button "glow toggle" of card "14...". It refers to group "LED" instead of "LED14". Throws an error when turning glow off.

Another small glitch: The line size of the graphics of group "LED14" is 12. But so is the height/width of the graphics. That cuts some of the graphics off.

Use this code and watch the graphics:

Code: Select all

on mouseUp
   repeat with i = 1 to the number of graphics in group "LED14"
      set the lineSize of grc i of group "LED14" to the lineSize of grc i of group "LED14"
   end repeat
end mouseUp

This will reset the with/height of the graphics to 14 which is what is needed for line graphics.

It is a bit confusing but LC works differently for

"regular polygon graphic", "oval graphic", "round rectangle graphic", and "rectangle graphic" as opposed to

"curve graphic", "line graphic", and "polygon graphic"

For the first four types of graphics rect of the graphic stays the same when you increase the line size. The border moves "inwards"

For the second group (those that are point based) increasing the line size will increase the width and height of the graphic. The border moves outwards.
This is probably due to the fact that the points are respected as the main determinant of the graphic.

In your case a line size of 12 will result in a width of 14 for vertical lines and height of 14 for horizontal lines. That will not cut off any of the graphic.

I hope this makes sense.

Kind regards
Bernd

[bn]

Thanks Mike, great stuff!
The thorny issue of re-sizing may be quite a bit of work, especially with the 14 segment version... This has to be an important feature I guess. You'd need to maintain the aspect ratio and resize/reposition individual graphics in the resizeControl handler.

Thank you Mike for posting your stack.
Here is my attempt at resizing the 14 elements LCD:
it is all in the group "LED14" script. It was a bit "thorny" to do...
In fact it is the card from Mike's stack with the option to change width and height of group "LED14" via a slider.
Of course you can also select the group and change the size of the group via the handles manually.

You have to go to card 2 to see the LED, card 1 is empty.

The coding of segments Mike used for LED

LED14.jpg (24.66 KiB) Viewed 721 times

Kind regards
Bernd

[bn]

Hi Mike,

this is an example again with your 14 LED card. But the resize code of group LED14 is cleaned up and I hope a bit more precise.


KInd regards
Bernd

There was a bug in the previous uploaded cleaned up stack that crashed LC (I inverted the start and end value of a scrollbar) which manifested itself only on start up of the stack. That is fixed now. Please excuse any inconvenience. Reported to Quality Control Center as Bug 24500.