easy way to draw cards in LB (from bitmaps)

[tsh73]

follow-up to this thread
libertybasiccom.proboards.com/thread/2321/liberty-basic-active?page=2

So there is a single picture with cards
iitutor.com/wp-content/uploads/h5p/content/2557/images/file-60924ed47fc9b.png
(actually I added it as attachment below, it's only 36k)

Create a folder
Save it there as a cards.bmp
(or save as your browser allows you, then resave it as BMP with Paint)

Run this program, it will save single cards as 2C.bmp...TS.bmp (52 bitmaps)

'read in cards images
'https://iitutor.com/wp-content/uploads/h5p/content/2557/images/file-60924ed47fc9b.png
'   save it as "cards.bmp"
nomainwin

path$=DefaultDir$+"\cards.bmp"
'950x392
'73x98
w1=73:h1=98
w=72:h=96   'some trial and error needed to ge exact card size

suite$ = "C,D,H,S"                                                       ' Club,Diamond,Heart,Spades
card$  = "A,2,3,4,5,6,7,8,9,T,J,Q,K"                                     ' Cards Ace to King
suite$ = "C,S,H,D"  'change to match to actual picture

WindowWidth=1000
WindowHeight=500

open "cards" for graphics_nsb_nf as #gr
#gr "trapclose [quit]"
#gr "down"
loadbmp "cards", path$  'read all sheet
#gr "drawbmp cards 1 1" 'draw all sheet
'we need it all because way to load part of bitmap is to grab it back off screen

for r = 1 to 4  'rows
   for c= 1 to 13  'cols
       x=(c-1)*w1+2
       y=(r-1)*h1+2
       bmpName$="b";r;c 'like, 12 or 310  or 413
       #gr "getbmp ";bmpName$;" ";x;" ";y;" ";w;" ";h
       'print r,c,"getbmp ";bmpName$;" ";x;" ";y;" ";w;" ";h
   next
next

'now draw what we got
#gr "cls"
#gr "fill cyan"
for r = 1 to 4  'rows
   for c= 1 to 13  'cols
       x=(c-1)*w1+2
       y=(r-1)*h1+2
       bmpName$="b";r;c 'like, 12 or 310  or 413
       'print r,c,"drawbmp ";bmpName$;" ";x;" ";y
       'if rnd(0)<0.2 then
           #gr "drawbmp ";bmpName$;" ";x;" ";y
       'end if
       'now save them under names RB program expects them
        s    = r                                        ' determine suite  'suite = row
        c    = c                                        ' determine card   'happened to be card = column
       cardId$ = word$(card$,c,",");word$(suite$,s,",");".bmp" 'because native format for LB is BMP
       bmpsave bmpName$, cardId$
   next
next

#gr "flush"
wait

[quit]
close #gr
end



Now here's modified RB program that will work in LB - read these cards and draw it in graphic window.
projectDir$    = "a_project"                                            ' project directory
imageDir$     = DefaultDir$ + "\projects\" + projectDir$ + "\image\"   ' directory of deck images
imagePath$    = "../";projectDir$;"/image/"                            ' path of deck images

suite$ = "C,D,H,S"                                                       ' Club,Diamond,Heart,Spades
card$  = "A,2,3,4,5,6,7,8,9,T,J,Q,K"                                     ' Cards Ace to King

dim n(55)                                                                ' make ordered deck
for i = 1 to 52                                                          '  of 52 cards
n(i)     = i
next i

for i = 1 to 52 * 3                                                      ' shuffle deck 3 times
 i1    = int(rnd(1)*52) + 1
 i2    = int(rnd(1)*52) + 1
 h2    = n(i1)
 n(i1) = n(i2)
 n(i2) = h2
next i

nomainwin   'set console window off
'open window to draw upon

WindowWidth=600
WindowHeight=300

open "cards" for graphics_nsb_nf as #gr
#gr "trapclose [quit]"  'set "close" handler
#gr "down"              'put pen down so we can draw


for yy = 1 to 8                                                        ' display 7 across and 8 down
 for xx = 1 to 7
   card = card + 1
   s    = (n(card) mod 4)  + 1                                        ' determine suite
   c    = (n(card) mod 13) + 1                                        ' determine card
   'cardId$ = word$(card$,c,",");word$(suite$,s,",");".gif"
   'native LB format is BMP
   cardId$ = word$(card$,c,",");word$(suite$,s,",");".bmp"
   'html "<div style='position: relative; left:";(xx -1) * 80;"px; top:";(yy -1) * 20;"px; height:0px; width:0px;>"
   'html "<div style='width:100px; height:100px; border:solid 0px #000;'>"
   'html "<img src=";imagePath$;cardId$;" width=70px >"
   'html "</div></div>"
   'get that position
   left=(xx -1) * 80
   top=(yy -1) * 20
   'load bitmap by name    (here we laad all cards to single "card" name, overriding them.
   'Could as well use different names to draw it without loading again)
   loadbmp "card", cardId$
   'loadbmp cardId$, cardId$   'different names
   'put it to desired place
   #gr "drawbmp card ";left;" ";top
   '#gr "drawbmp "; cardId$;" ";left;" ";top   'different names

   'if card = 52 then end                                              ' out of cards
   if card = 52 then #gr, "flush":wait  'wait for close event (allow to see what we draw)
 next xx
next yy


[quit]  'close window then "X" clicked
close #gr
end



Attachments:

[badbug]

Thanks ths73,
Looks good.. Won't be able to fully check it out tell next week.

[tsh73]

While playing with it, I found that
   s    = (n(card) mod 4)  + 1                                        ' determine suite
   c    = (n(card) mod 13) + 1                                        ' determine card
is wrong.
To fix it, n() should contain numbers 0..51 (not 1..52 as now), and suite/cards should be calculated as follows
   s    = int(n(card) / 13) + 1
   c    = (n(card) mod 13) + 1


[tsh73]

Jumping cards animation made of these bitmaps


You'll need one more picture - cards back, here is code that draws one
It is saved as back01.bmp
'playing with card bitmaps
'making card back

nomainwin

WindowWidth=590     'Windows solitaire size (consistent with card size)
WindowHeight=440
'bitmap size
w=72
h=96
x0=8
y0=4

menu #gr, "&Game", "E&xit", [mnuExit]
menu #gr, "&Help", "&About", [mnuAbout]

open "Cards" for graphics_nsb_nf as #gr
#gr "trapclose [quit]"  
#gr "down; fill darkgreen; flush"

#gr "place ";x0; " ";y0
#gr "boxfilled ";w+x0-1;" "; h+y0
#gr "boxfilled ";w+x0;" "; h+y0 'right black 2 pixels width
'#gr "drawbmp "; "2C.bmp";" 12 4" 'this shows size is right
'let's try and make some back for a cards
' looks nice. I just need to clip lines
'oh wait. I could just grab needed portion discarding the rest!!
#gr "color red"
for i = 0 to h+w step 3
if sin(i/10)>0.1 or sin(i/10)<-0.9 then  
#gr "line ";x0;" ";y0+i;" ";x0+i;" ";y0
end if
next
#gr "color blue"
for i = 0 to h+w step 3
if sin(i/10)>0.1 or sin(i/10)<-0.9 then  
#gr "line ";x0;" ";y0+h-i;" ";x0+i;" ";y0+h
end if
next
'redraw box
#gr "color black"
#gr "place ";x0; " ";y0
#gr "box ";w+x0-1;" "; h+y0 'EMPTY box, no fill
#gr "box ";w+x0;" "; h+y0 'right black 2 pixels width
#gr "getbmp back ";x0; " ";y0;" ";w;" ";h

#gr "cls;fill darkgreen; flush"
#gr "place ";x0; " ";y0
#gr "drawbmp "; "back";" 8 4"

bmpsave "back", "back01.bmp"

wait

[quit]
close #gr
end

[mnuExit]
goto [quit]

[mnuAbout]
notice "Cards!"+chr$(13)+ _
"Playing with card bitmaps"+chr$(13)+ _
""+chr$(13)+ _
"havng fun, actually"
wait



Here's code that makes animation
Run it, then select from the menu Game|JumpCards
'playing with card bitmaps

nomainwin

gosub [init]
gosub [shuffle]
gosub [loadCards]

WindowWidth=590     'Windows solitaire size (consistent with card size)
WindowHeight=440
'bitmap size
w=72
h=96
x0=8
y0=4

menu #gr, "&Game", "Shuffle", [mnuShuffle], "Show 4", [mnuShow4],"JumpCards", [mnuJump], |, "E&xit", [mnuExit]
menu #gr, "&Help", "&About", [mnuAbout]

open "Cards" for graphics_nsb_nf as #gr
#gr "trapclose [quit]"  'set "close" handler
#gr "home; posxy cx cy"
#gr "down; fill darkgreen; flush"              'put pen down so we can draw

' #gr "place ";x0; " ";y0
' #gr "boxfilled ";w+x0-1;" "; h+y0
' #gr "boxfilled ";w+x0;" "; h+y0 'right black 2 pixels width

' wait

'gosub [show7x8]
gosub [show4]
'goto [jumpCards]

wait  'wait for close event (allow to see what we draw)

[quit]
timer 0
close #gr
end

[mnuExit]
goto [quit]

[mnuShuffle]
timer 0
gosub [shuffle]
gosub [show7x8]
wait

[mnuShow4]
timer 0
gosub [show4]
wait

[mnuJump]
timer 0
gosub [show4]
goto [jumpCards]

[mnuAbout]
notice "Cards!"+chr$(13)+ _
"Playing with card bitmaps"+chr$(13)+ _
""+chr$(13)+ _
"havng fun, actually"
wait

'-----------------------------------------
[init]
suite$ = "C D H S"                         ' Club,Diamond,Heart,Spades
card$  = "A 2 3 4 5 6 7 8 9 T J Q K"       ' Cards Ace to King

dim n(52)                                  ' make ordered deck
for i = 1 to 52                            '  of 52 cards
n(i) = i-1      'from 0 is natural to use MOD
next i
return

[shuffle]
'Fisher–Yates shuffle
for i = 52 to 2 step -1
j = int(rnd(1)*i) + 1
'print i, j, n(j) ,  n(i)
tmp  = n(j)
n(j) = n(i)
n(i) = tmp
next
return

[loadCards]
for i = 0 to 51 'from 0 is natural to use MOD
s    = int(i / 13) + 1                 ' determine suite
c    = (i mod 13) + 1                  ' determine card
cardId$ = word$(card$,c);word$(suite$,s);".bmp"
       'print cardId$
loadbmp cardId$, cardId$  
next
loadbmp "back", "back01.bmp"
return

[show7x8]
#gr "cls;fill darkgreen; flush"

card = 0
exFor=0
for yy = 1 to 8                                ' display 7 across and 8 down
 for xx = 1 to 7
card = card + 1
s    = int(n(card) / 13) + 1               ' determine suite
c    = (n(card) mod 13) + 1                ' determine card
cardId$ = word$(card$,c);word$(suite$,s);".bmp"
'print cardId$
'get that position
left=x0+(xx -1) * 82
top=y0+(yy -1) * 20
if rnd(0)>1/4 then
#gr "drawbmp "; cardId$;" ";left;" ";top  
else
#gr "drawbmp "; "back";" ";left;" ";top  
end if
if card = 52 then exFor=1:exit for
 next xx
 if exFor then exit for 'nested exit for
next yy
#gr, "flush"

return

[show4]
#gr "cls;fill darkgreen; flush"
yy = 1
for xx = 4 to 7
left=x0+(xx -1) * 82
top=y0+(yy -1) * 20
#gr "drawbmp "; "back";" ";left;" ";top  
next

#gr, "flush"
return

[jumpCards]
dim left(7), top(7), dx(7), dy(7), card$(7)
card=0
for xx = 4 to 7
gosub [resetXX]
next

timer 30, [tick]
[tick]
for xx = 4 to 7
left(xx)=left(xx)+dx(xx)
top(xx)=top(xx)+dy(xx)
dy(xx)=dy(xx)+1
#gr "drawbmp "; card$(xx);" ";left(xx);" ";top(xx)  
'is card down?
if top(xx)>2*cy-h then top(xx)=top(xx)-dy(xx):dy(xx)=0-dy(xx)/2
'is card out?
if left(xx)<0-w or left(xx)>2*cx then gosub [resetXX]
next

wait
return

[resetXX]
left(xx)=x0+(xx -1) * 82
top(xx)=y0+(yy -1) * 20
do
dx(xx)=5-(rnd(0)*15) 'mostly negative
loop while abs(dx(xx))<2 'but not 0
dy(xx)=rnd(0)*10-10
card=card+1
if card<=52 then
s    = int(n(card) / 13) + 1
c    = (n(card) mod 13) + 1
cardId$ = word$(card$,c);word$(suite$,s);".bmp"
else
cardId$ ="back"
end if
if card>52+8 then timer 0 : wait 'over then 52 cards and 4 backs are out
card$(xx)=cardId$
#gr "discard"
return