Creating a 'virtual dartboard'

[sjorrel]

Hi,

For a little fun project I want to make a program that does scoring for various darts games.

What I want is a large picture of a dartboard. The user clicks on it to represent where the darts have hit, and the program works out everything else.

I'm having trouble thinking of a smart way of working out which section has been hit. There are 20 segments which form a curved-edged triangle, along with a bulls eye of two circles.

Any smart ideas to work out, given the coords of the mouse, where on the board the user has clicked?

One nasty hack I thought of was using slightly different shades of colour, and pixelgetcolor. Would autoit be sensitive enough?

I'm sure there is a better way!

Edited January 25, 2006 by sjorrel

[PsaltyDS]

Hi,

For a little fun project I want to make a program that does scoring for various darts games.

What I want is a large picture of a dartboard. The user clicks on it to represent where the darts have hit, and the program works out everything else.

I'm having trouble thinking of a smart way of working out which section has been hit. There are 20 segments which form a curved-edged triangle, along with a bulls eye of two circles.

Any smart ideas to work out, given the coords of the mouse, where on the board the user has clicked?

One nasty hack I thought of was using slightly different shades of colour, and pixelgetcolor. Would autoit be sensitive enough?

I'm sure there is a better way!

How's your math? You can get the mouse position with MouseGetPos(), then do the math to calculate what it's over. I would add the kind of highlight you usually see in that kind of thing, though, where the the segment under the mouse pointer "glows" or is otherwise highlighted. That would remove ambiguity at the margins of the segments.

[sjorrel]

How's your math? You can get the mouse position with MouseGetPos(), then do the math to calculate what it's over.

Rusty, to say the least. Any clues?

[CyberSlug]

Use polar coordinates. Unfortunately, I can't figure out how to draw an image on top of the dart board when you click because AutoIt dislikes overlapping images......

I have to run right now, but this should help you determine the tracks/sectors where a click occurs.

expandcollapse popup

; CyberSlug - 25 January 2006
; DartBoard sketch
; Convert rectangular (x,y) coordinates to polar (r,theta)
; Note:  We want the bullseye to correspond to (0,0).

#include <GuiConstants.au3>
Global Const $image = "dartBoard.bmp", $imageSize = 375, $image_Top = 10, $image_Left = 10
Opt("PixelCoordMode", 2)

$GUI = GuiCreate("foo")
Global $dartboard = GuiCtrlCreatePic($image, $image_Top, $image_Left, $imageSize, $imageSize)
Global $canvas = GuiCtrlCreateGraphic($image_Left, $image_Top, $imageSize, $imageSize)
GuiCtrlSetState($dartboard, $GUI_DISABLE)


GuiSetState()
While 1
    $msg = GUIGetMsg()
    $mouseInfo = GUIGetCursorInfo($GUI)
    If Not IsArray($mouseInfo) Then continueLoop
    
    $colorName = "color???"
;$color = PixelGetColor($mouseInfo[0], $mouseInfo[1])
;If $color = 0xFBFDFB Then $colorName = "green"
;If $color = 0xEB0A0B Then $colorName = "red"
;If $color = 0xEB0A0B Then $colorName = "black"
;If $color = 0xFFFFFF Then $colorName = "white"
        
    ToolTip("(" & getR() & "," & getTheta() & ")  " & $colorName)
        
    If $msg = $GUI_EVENT_CLOSE Then
        Exit
    ElseIf $msg = $canvas Then;mouse click
        GuiCtrlSetGraphic($canvas, $GUI_GR_Dot, $mouseInfo[0], $mouseInfo[1])
        GuiCtrlSetGraphic($canvas, $GUI_GR_REFRESH)
    EndIf
WEnd

; gets x coord of mouse where bullseye is at 0,0
Func getX()
    Local $info, $x
    $info = GUIGetCursorInfo($GUI)
    If @error Then Return 0
    $x = $info[0] - $image_Left - $imageSize/2 - 0.5
    Return $x
EndFunc


; gets y coord of mouse where bullseye is at 0,0
Func getY()
    Local $info, $y
    $info = GUIGetCursorInfo($GUI)
    If @error Then Return 0 
    $y = $info[1] - $image_Top - $imageSize/2 - 0.5
    Return -$y
EndFunc

; gets polar R coord corresponding to x,y
Func getR()
    Local $x = GetX(), $y = GetY(), $r
    $r = Sqrt($x^2 + $y^2)
    If $x < 0 Then $r = -$r
    Return Round($r, 2)
EndFunc

; gets polar Theta coord corresponding to x,y
Func getTheta()
    Local $x = GetX(), $y = GetY(), $theta
    $theta = ATan($y/$x)
    Return Round($theta, 2)
EndFunc

Edited January 25, 2006 by CyberSlug

[sjorrel]

I have to run right now, but this should help you determine the tracks/sectors where a click occurs.

Dude, you've just blown my mind.

Thanks for this, way more than I expected!

[CyberSlug]

Idea: Use labels to show where darts landed. Also added a sound effect.

HOWEVER: There might be a problem with the positive/negative sign of r and/or theta. I forget exactly how that works, and it seems the current code makes it difficult to describe the bounds of the 20-point region....

expandcollapse popup

; CyberSlug - 25 January 2006
; DartBoard sketch
; Convert rectangular (x,y) coordinates to polar (r,theta)
; Note:  We want the bullseye to correspond to (0,0).

#include <GuiConstants.au3>
Opt("PixelCoordMode", 2)

Global Const $image = "dartBoard.bmp", $sound = "arrow.wav"
Global Const $imageSize = 375, $image_Top = 10, $image_Left = 10

$GUI = GuiCreate("foo")
$dartboard = GuiCtrlCreatePic($image, $image_Top, $image_Left, $imageSize, $imageSize)

GuiSetState()
While 1
    $msg = GUIGetMsg()
    $mouseInfo = GUIGetCursorInfo($GUI)
    If Not IsArray($mouseInfo) Then continueLoop
    
    $colorName = "color???"
;$color = PixelGetColor($mouseInfo[0], $mouseInfo[1])
;If $color = 0xFBFDFB Then $colorName = "green"
;If $color = 0xEB0A0B Then $colorName = "red"
;If $color = 0xEB0A0B Then $colorName = "black"
;If $color = 0xFFFFFF Then $colorName = "white"
        
   ;ToolTip("(" & getR() & "," & getTheta() & ")  " & $colorName)
    WinSetTitle($GUI,"",  "(" & getR() & "," & getTheta() & ")  "  )
        
    If $msg = $GUI_EVENT_CLOSE Then
        Exit
    ElseIf $msg = $dartboard Then;mouse click
        Local $r = Abs(getR())
        
        If $r > 180 Then
            ToolTip("WAY OFF!")
        ElseIf $r > 140 Then
            ToolTip("You're in the black!")
        ElseIf $r > 125 Then
            ToolTip("Good shot!")
        ElseIf $r > 85 Then
            ToolTip("Nice one!")
        ElseIf $r > 71 Then
            ToolTip("The inner ring!")
        ElseIf $r > 17 Then
            ToolTip("Very good!")
        ElseIf $r > 7 Then
            ToolTip("Soooo close!")
        Else
            ToolTip("Bullseye!!!")
        EndIf
        SoundPlay($sound, 1);wait for sound to finish
        GuiCtrlCreateLabel("^",$mouseInfo[0]-4, $mouseInfo[1]-4, 8, 8)
        GuiCtrlSetColor(-1, 0x0000FF)
        GuiCtrlSetBkColor(-1,0xAAAAAA)
        sleep(150)
        ToolTip('')
        
        $r = getR();want the signed value of R
        $t = getTheta()
        If 1.1004 < $t And $t < 1.4193 Then
            If $r > 0 Then
                MsgBox(4096,"","One-point region",1)
            Else
                MsgBox(4096,"","Nineteen-point region",1)
            EndIf
        ElseIf -1.0969 < $t And $t < -0.8010 Then
            If $r > 0 Then
                MsgBox(4096,"","Two-point region",1)
            Else
                MsgBox(4096,"","Twelve-point region",1)
            EndIf
        EndIf
        
    EndIf
WEnd

; gets x coord of mouse where bullseye is at 0,0
Func getX()
    Local $info, $x
    $info = GUIGetCursorInfo($GUI)
    If @error Then Return 0
    $x = $info[0] - $image_Left - $imageSize/2 - 0.5
    Return $x
EndFunc


; gets y coord of mouse where bullseye is at 0,0
Func getY()
    Local $info, $y
    $info = GUIGetCursorInfo($GUI)
    If @error Then Return 0 
    $y = $info[1] - $image_Top - $imageSize/2 - 0.5
    Return -$y
EndFunc

; gets polar R coord corresponding to x,y
Func getR()
    Local $x = GetX(), $y = GetY(), $r
    $r = Sqrt($x^2 + $y^2)
    If $x < 0 Then $r = -$r
    Return Round($r, 4)
EndFunc

; gets polar Theta coord corresponding to x,y
Func getTheta()
    Local $x = GetX(), $y = GetY(), $theta
    $theta = ATan($y/$x)
    Return Round($theta, 4)
EndFunc

arrow.wav