[bb] ImageMap by Techlord [ 1+ years ago ]

Started by BlitzBot, June 29, 2017, 00:28:38

Previous topic - Next topic

BlitzBot

Title : ImageMap
Author : Techlord
Posted : 1+ years ago

Description : Creating a simple 'imagemap' system is the easiest way to create a simple GUI.
 A imagemap is  is single graphic image containing more than one clickable areas
often called HotSpots that link to a url.

They're many Free ImageMap Editors that output html map files defining the hotspots.
 So, you just load your pre-drawn image, draw your hotspots, and save. I've written
 a simple html map loader. It will only recognize RECTangle shaped hotspots,
but its a simple start.

Copy the image and code and give it a try!

test.jpg
<a href="../Community/posts7f5b.html?topic=39819" target="_blank"></a>

test.htm
<BODY>
<MAP NAME="">
<!-- #$-:Image Map file created by Map THIS! -->
<!-- #$-:Map THIS! free image map editor by Todd C. Wilson -->
<!-- #$-:Please do not edit lines starting with "#$" -->
<!-- #$VERSION:1.30 -->
<!-- #$DATE:Mon Dec 06 04:34:48 2004 -->
<!-- #$PATH:C:Program FilesBlitz3Dmyprojectsppf2k4.5gamefpsclientui -->
<!-- #$GIF:test.jpg -->
<AREA SHAPE=RECT COORDS="281,86,484,109" HREF="#" TARGET="none">
<AREA SHAPE=RECT COORDS="318,122,486,145" HREF="#" TARGET="none">
<AREA SHAPE=RECT COORDS="335,156,486,179" HREF="#" TARGET="none">
<AREA SHAPE=RECT COORDS="362,190,487,213" HREF="#" TARGET="none">
</MAP></BODY>


Html Map file generated with <a href="http://www.abdn.ac.uk/tools/ibmpc/mapthis/mpths131.exe" target="_blank">Map This! 1.3</a> [/i]

Code :
Code (blitzbasic) Select
;ImageMap by Frankie 'TechLord' Taylor 12/06/2004

Const IMAGEMAP_AREA_MAX%=256

Global imagemapCurrent.imagemap

Type imagemap
;Purpose: Store Image and HotSpots
Field id%
Field name$
Field x#
Field y#
Field imgsrc$
Field image%
Field hotspots%
Field hotspot.hotspot[IMAGEMAP_AREA_MAX%]
Field state%
End Type

Type hotspot
;Purpose: Stores Coords, target, and command information
Field id%
Field typeid%
Field coord[3]
Field target$
Field command$
Field state%
End Type

Function imagemapLoad.imagemap(imagemapname$,imagemapfilename$,imagemapsrcname$="")
;Purpose: Parses html client side imagemap file.
;Parameters:
; imagemapname$ - name of imagemap. Can be used for reference purposes.
; imagemapfilename$ - html map file name, *.htm extension not required.
; imagemapsrcname$ - image file name. Valid map format extension required.
;Return:
imagemapfile%=OpenFile(imagemapfilename+".htm") ;*.map
If Not imagemapfile% Return Null
While Not Eof(imagemapfile%)
imagemapfileline$=Lower(ReadLine(imagemapfile%))
imagemapfilelinelength%=Len(imagemapfileline$)

For loop% = 1 To imagemapfilelinelength%
imagemapchar$=Mid$(imagemapfileline$,loop%,1)

Select imagemapchar$
Case " ","<",">","=",Chr(34),Chr(39)
;ignor whitespace and tags
imagemapword$=nil$
Default
imagemapword$=imagemapword$+imagemapchar$
End Select

Select imagemapword$

Case "name"
this.imagemap=New imagemap
thisimgsrc$=imagemapsrcname$
thisimage%=LoadImage(thisimgsrc$)
this
ame$=imagemapname$
thisstate%=1

Case "area"
thishotspots%=thishotspots%+1
thishotspot[thishotspots%] = New hotspot
hotspot.hotspot=thishotspot[thishotspots%]  ;testing

Case "coords" ;coords define shape, rect by by limitation
For loop% = loop%+1 To imagemapfilelinelength%
imagemapchar$=Mid$(imagemapfileline$,loop%,1)
Select imagemapchar$
Case "="," "
hotspotcoord%=0
imagemapword$=nil$
Case ","
thishotspot[thishotspots%]coord[hotspotcoord%]=imagemapword$
hotspotcoord%=hotspotcoord%+1
imagemapword$=nil$
Case Chr(34),Chr(39);quotes
If hotspotcoord%>0 Or imagemapword$<>nil$
thishotspot[thishotspots%]coord[hotspotcoord%]=imagemapword$
Exit
EndIf
Default
imagemapword$=imagemapword$+imagemapchar$
End Select
Next

Case "href" ;command$
For loop% = loop%+1 To imagemapfilelinelength%
imagemapchar$=Mid$(imagemapfileline$,loop%,1)
Select imagemapchar$
Case "="," "
imagemapword$=nil$
Case Chr(34),Chr(39);quotes
If imagemapword$<>nil$
thishotspot[thishotspots%]command$=imagemapword$
Exit
EndIf
Default
imagemapword$=imagemapword$+imagemapchar$
End Select
Next

Case "target"
For loop% = loop%+1 To imagemapfilelinelength%
imagemapchar$=Mid$(imagemapfileline$,loop%,1)
Select imagemapchar$
Case "="," "
imagemapword$=nil$
Case Chr(34),Chr(39);quotes
If imagemapword$<>nil$
thishotspot[thishotspots%] arget$=imagemapword$
Exit
EndIf
Default
imagemapword$=imagemapword$+imagemapchar$
End Select
Next

End Select
Next
Wend
Return this
End Function

Function imagemapDestroy(this.imagemap)
;Purpose: Removes imagemap, hotspots, and image from memory
;Parameters: imagemap object
;Return: none
If this<>Null
For loop = 1 To hotspots%
If thishotspot[loop%]<>Null
Delete thishotspot[loop%]
EndIf
Next
If thisimage% FreeImage(thisimage)
Delete this
EndIf
End Function

Function imagemapUpdate()
;Purpose: Checks for mouse and hotspot events. called in main loop
;Parameters: none
;Return: none
this.imagemap=imagemapCurrent
If imagemapCurrentstate%

If thisimage DrawBlock(thisimage%,thisx,thisy)

;check mouse and hotspot events
For loop% = 1 To thishotspots%

If MouseX()>=thishotspot[loop%]coord%[0] And MouseX()<thishotspot[loop%]coord%[2]
If MouseY()>=thishotspot[loop%]coord%[1] And MouseY()<thishotspot[loop%]coord%[3]

Color 0,255,0

If MouseDown(1)

Color 255,0,0 ; do something

EndIf

Rect thishotspot[loop%]coord%[0],thishotspot[loop%]coord%[1],thishotspot[loop%]coord%[2]-thishotspot[loop%]coord%[0],thishotspot[loop%]coord%[3]-thishotspot[loop%]coord%[1],0

EndIf
EndIf
Next
EndIf
End Function


;DEMO ==========================================================================================
.MAIN
Graphics 512,256,16,2
SetBuffer(BackBuffer())

;load a imagemap
imagemapCurrent=imagemapLoad("test","test","test.jpg")

While Not KeyDown(1)
imagemapUpdate()
Flip()
Wend

imagemapDestroy(imagemapCurrent)

End


Comments : none...