http://www.goodreads.com/book/show/4193454-mouse-guard

http://cdn.eslbase.com/wp-content/uploads/2014/09/storytelling.jpg

https://streamcoimg-a.akamaihd.net/000/373/933/6a7b88949db445b4ab7bf84252779904.jpg

http://mythcreants.com/wp-content/uploads/2013/11/mouse-guard.jpg

http://railsinstallfest.org/

https://reinteractive.com/

http://adhelper.biz/wp-content/uploads/2013/08/blog-layout-outaboutcomm-2.jpg

https://rpgfreak.files.wordpress.com/2012/01/mg_map.jpg

http://leafletjs.com/

0, 0

Zoom Level 0

0, 0

0, 1

1, 0

1, 1

Zoom Level 1

Zoom Level 0

Zoom Level 1

Zoom Level 2

http://leafletjs.com/reference-1.0.2.html

Leaflet API

rails generate scaffold MouseGuard 

name:string
lat:decimal
long:decimal
catagory:string
description:text
inhabitants:text
exploits:text
reputation:integer

rails generate scaffold MouseGuard 

name:string
lat:decimal
long:decimal
catagory:string
description:text
inhabitants:text
exploits:text
reputation:integer

map.on("contextmenu", onMapRightClick)

function onMapRightClick(e) {
    L.marker([e.latlng.lat, e.latlng.lng], {icon: redIcon} )
            .addTo(map)

    $(".new_area_form").show()
    $(".area_form").hide()

    $("input#area_lat").val(e.latlng.lat.toFixed(2))
    $("input#area_long").val(e.latlng.lng.toFixed(2))
}

map.on("contextmenu", onMapRightClick)

function onMapRightClick(e) {
    L.marker([e.latlng.lat, e.latlng.lng], {icon: redIcon} )
            .addTo(map)

    $(".new_area_form").show()
    $(".area_form").hide()

    $("input#area_lat").val(e.latlng.lat.toFixed(2))
    $("input#area_long").val(e.latlng.lng.toFixed(2))
}

map.on("contextmenu", onMapRightClick)

function onMapRightClick(e) {
    L.marker([e.latlng.lat, e.latlng.lng], {icon: redIcon} )
            .addTo(map)

    $(".new_area_form").show()
    $(".area_form").hide()

    $("input#area_lat").val(e.latlng.lat.toFixed(2))
    $("input#area_long").val(e.latlng.lng.toFixed(2))
}

map.on("contextmenu", onMapRightClick)

function onMapRightClick(e) {
    L.marker([e.latlng.lat, e.latlng.lng], {icon: redIcon} )
            .addTo(map)

    $(".new_area_form").show()
    $(".area_form").hide()

    $("input#area_lat").val(e.latlng.lat.toFixed(2))
    $("input#area_long").val(e.latlng.lng.toFixed(2))
}

function onMarkerLeftClick(form) {
    return function(){
        $(".area_form").hide()
        $(".new_area_form").hide()
        $(form).show()
    }
}

function showAllMarkers() {
    $(".area_form").hide()

    $(".area_form").each(function(index, form) {

       var lat     = $("input#area_lat", form).val()
       var lng 	   = $("input#area_long", form).val()
       var name    = $("input#area_name", form).val()
       var marker  = L.marker([lat, lng], {icon: orangeIcon})

       marker.addTo(map).bindPopup(name)
       marker.on("click", onMarkerLeftClick(form))
    });
}

function onMarkerLeftClick(form) {
    return function(){
        $(".area_form").hide()
        $(".new_area_form").hide()
        $(form).show()
    }
}

function showAllMarkers() {
    $(".area_form").hide()

    $(".area_form").each(function(index, form) {

       var lat     = $("input#area_lat", form).val()
       var lng 	   = $("input#area_long", form).val()
       var name    = $("input#area_name", form).val()
       var marker  = L.marker([lat, lng], {icon: orangeIcon})

       marker.addTo(map).bindPopup(name)
       marker.on("click", onMarkerLeftClick(form))
    });
}

function onMarkerLeftClick(form) {
    return function(){
        $(".area_form").hide()
        $(".new_area_form").hide()
        $(form).show()
    }
}

function showAllMarkers() {
    $(".area_form").hide()

    $(".area_form").each(function(index, form) {

       var lat     = $("input#area_lat", form).val()
       var lng 	   = $("input#area_long", form).val()
       var name    = $("input#area_name", form).val()
       var marker  = L.marker([lat, lng], {icon: orangeIcon})

       marker.addTo(map).bindPopup(name)
       marker.on("click", onMarkerLeftClick(form))
    });
}

Demo Time!

WELLINGTON ROOM 1

Games and FOSS

Demo from Mice and Maps

Today at 4:30pm

References

1. LeafletJs.com
2. RailsInstallfest.org
3. Reinteractive.com
4. MouseGuard.net

Rhiana Heath

1. mouseguard.heath.cc
2. rhiana.heath.cc
3. github.com/Rhiana/mouse_guard
4. slides.com/rhianaheath/

@RhianaHeath