November 25, 2020, 05:01:54 AM

Author Topic: [bb] ImageMap by Techlord [ 1+ years ago ]  (Read 850 times)

Offline BlitzBot

  • Jr. Member
  • **
  • Posts: 1
[bb] ImageMap by Techlord [ 1+ years ago ]
« on: June 29, 2017, 12:28:38 AM »
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">[/url]

test.htm
Code: [Select]
<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[/url] [/i]

Code :
Code: BlitzBasic
  1. ;ImageMap by Frankie 'TechLord' Taylor 12/06/2004
  2.  
  3. Const IMAGEMAP_AREA_MAX%=256
  4.  
  5. Global imagemapCurrent.imagemap
  6.  
  7. Type imagemap
  8.         ;Purpose: Store Image and HotSpots
  9.         Field id%
  10.         Field name$
  11.         Field x#
  12.         Field y#
  13.         Field imgsrc$
  14.         Field image%
  15.         Field hotspots%
  16.         Field hotspot.hotspot[IMAGEMAP_AREA_MAX%]
  17.         Field state%
  18. End Type
  19.  
  20. Type hotspot
  21.         ;Purpose: Stores Coords, target, and command information
  22.         Field id%
  23.         Field typeid%
  24.         Field coord[3]
  25.         Field target$
  26.         Field command$
  27.         Field state%
  28. End Type
  29.  
  30. Function imagemapLoad.imagemap(imagemapname$,imagemapfilename$,imagemapsrcname$="")
  31.         ;Purpose: Parses html client side imagemap file.
  32.         ;Parameters:
  33.         ;       imagemapname$ - name of imagemap. Can be used for reference purposes.
  34.         ;       imagemapfilename$ - html map file name, *.htm extension not required.
  35.         ;       imagemapsrcname$ - image file name. Valid map format extension required.       
  36.         ;Return:
  37.         imagemapfile%=OpenFile(imagemapfilename+".htm") ;*.map
  38.         If Not imagemapfile% Return Null
  39.         While Not Eof(imagemapfile%)
  40.                 imagemapfileline$=Lower(ReadLine(imagemapfile%))
  41.                 imagemapfilelinelength%=Len(imagemapfileline$)
  42.                
  43.                 For loop% = 1 To imagemapfilelinelength%
  44.                         imagemapchar$=Mid$(imagemapfileline$,loop%,1)
  45.                
  46.                         Select imagemapchar$
  47.                                 Case " ","<",">","=",Chr(34),Chr(39)
  48.                                         ;ignor whitespace and tags     
  49.                                         imagemapword$=nil$                     
  50.                                 Default
  51.                                         imagemapword$=imagemapword$+imagemapchar$
  52.                         End Select
  53.        
  54.                         Select imagemapword$
  55.                        
  56.                                 Case "name"
  57.                                         this.imagemap=New imagemap
  58.                                         thisimgsrc$=imagemapsrcname$                                   
  59.                                         thisimage%=LoadImage(thisimgsrc$)
  60.                                         this
  61. ame$=imagemapname$
  62.                                         thisstate%=1
  63.  
  64.                                 Case "area"
  65.                                         thishotspots%=thishotspots%+1
  66.                                         thishotspot[thishotspots%] = New hotspot
  67.                                         hotspot.hotspot=thishotspot[thishotspots%]  ;testing
  68.                                        
  69.                                 Case "coords" ;coords define shape, rect by by limitation
  70.                                         For loop% = loop%+1 To imagemapfilelinelength%
  71.                                                 imagemapchar$=Mid$(imagemapfileline$,loop%,1)
  72.                                                 Select imagemapchar$
  73.                                                         Case "="," "
  74.                                                                 hotspotcoord%=0
  75.                                                                 imagemapword$=nil$             
  76.                                                         Case ","
  77.                                                                 thishotspot[thishotspots%]coord[hotspotcoord%]=imagemapword$
  78.                                                                 hotspotcoord%=hotspotcoord%+1
  79.                                                                 imagemapword$=nil$
  80.                                                         Case Chr(34),Chr(39);quotes
  81.                                                                 If hotspotcoord%>0 Or imagemapword$<>nil$
  82.                                                                         thishotspot[thishotspots%]coord[hotspotcoord%]=imagemapword$                                                           
  83.                                                                         Exit
  84.                                                                 EndIf  
  85.                                                         Default
  86.                                                                 imagemapword$=imagemapword$+imagemapchar$      
  87.                                                 End Select
  88.                                         Next
  89.                                        
  90.                                 Case "href" ;command$
  91.                                         For loop% = loop%+1 To imagemapfilelinelength%
  92.                                                 imagemapchar$=Mid$(imagemapfileline$,loop%,1)
  93.                                                 Select imagemapchar$
  94.                                                         Case "="," "
  95.                                                                 imagemapword$=nil$
  96.                                                         Case Chr(34),Chr(39);quotes
  97.                                                                 If imagemapword$<>nil$
  98.                                                                         thishotspot[thishotspots%]command$=imagemapword$
  99.                                                                         Exit
  100.                                                                 EndIf  
  101.                                                         Default
  102.                                                                 imagemapword$=imagemapword$+imagemapchar$      
  103.                                                 End Select
  104.                                         Next
  105.                                        
  106.                                 Case "target"
  107.                                         For loop% = loop%+1 To imagemapfilelinelength%
  108.                                                 imagemapchar$=Mid$(imagemapfileline$,loop%,1)
  109.                                                 Select imagemapchar$
  110.                                                         Case "="," "
  111.                                                                 imagemapword$=nil$
  112.                                                         Case Chr(34),Chr(39);quotes
  113.                                                                 If imagemapword$<>nil$
  114.                                                                         thishotspot[thishotspots%]      arget$=imagemapword$
  115.                                                                         Exit
  116.                                                                 EndIf  
  117.                                                         Default
  118.                                                                 imagemapword$=imagemapword$+imagemapchar$      
  119.                                                 End Select
  120.                                         Next
  121.                                                
  122.                         End Select
  123.                 Next   
  124.         Wend
  125.         Return this
  126. End Function
  127.  
  128. Function imagemapDestroy(this.imagemap)
  129.         ;Purpose: Removes imagemap, hotspots, and image from memory
  130.         ;Parameters: imagemap object
  131.         ;Return: none
  132.         If this<>Null
  133.                 For loop = 1 To hotspots%
  134.                         If thishotspot[loop%]<>Null
  135.                                 Delete thishotspot[loop%]
  136.                         EndIf
  137.                 Next
  138.                 If thisimage% FreeImage(thisimage)
  139.                 Delete this
  140.         EndIf
  141. End Function
  142.  
  143. Function imagemapUpdate()
  144.         ;Purpose: Checks for mouse and hotspot events. called in main loop
  145.         ;Parameters: none
  146.         ;Return: none
  147.         this.imagemap=imagemapCurrent
  148.         If imagemapCurrentstate%
  149.                
  150.                 If thisimage DrawBlock(thisimage%,thisx,thisy)
  151.                
  152.                 ;check mouse and hotspot events
  153.                 For loop% = 1 To thishotspots%
  154.                        
  155.                         If MouseX()>=thishotspot[loop%]coord%[0] And MouseX()<thishotspot[loop%]coord%[2]
  156.                                 If MouseY()>=thishotspot[loop%]coord%[1] And MouseY()<thishotspot[loop%]coord%[3]
  157.                                        
  158.                                         Color 0,255,0
  159.                                        
  160.                                         If MouseDown(1)
  161.                                                
  162.                                                 Color 255,0,0 ; do something
  163.                                                                                                                
  164.                                         EndIf
  165.                                        
  166.                                         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
  167.                                        
  168.                                 EndIf
  169.                         EndIf  
  170.                 Next
  171.         EndIf
  172. End Function
  173.  
  174.  
  175. ;DEMO ==========================================================================================
  176. .MAIN
  177. Graphics 512,256,16,2
  178. SetBuffer(BackBuffer())
  179.  
  180. ;load a imagemap
  181. imagemapCurrent=imagemapLoad("test","test","test.jpg")
  182.  
  183. While Not KeyDown(1)
  184.         imagemapUpdate()
  185.         Flip()
  186. Wend
  187.  
  188. imagemapDestroy(imagemapCurrent)
  189.  
  190. End


Comments : none...

 

SimplePortal 2.3.6 © 2008-2014, SimplePortal