aboutsummaryrefslogtreecommitdiff
path: root/node_modules/montage/ui/map.reel/map.html
blob: 5cd3a5b58bc7200a1f149460046da380e22976f5 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<!DOCTYPE html>
<!-- <copyright>
 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
 (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
 </copyright> -->
<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="map.css">
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&callback=initialize&libraries=places"></script>


    <script type="text/montage-serialization">
    {
        "types": {
            "prototype": "montage/ui/select-input.reel",
            "properties": {
                "element": {"#": "types"}
            }
        },
        "owner": {
            "prototype": "montage/ui/map.reel",
            "properties": {
                "element": {"#": "map-container"},
                "mapEl": {"#": "map"}
            },
            "bindings": {
                "category": {
                    "boundObject": {"@": "types"},
                    "boundObjectPropertyPath": "value"
                }
            }
        }
    }
    </script>

    <style>

        .montage-google-map {
            margin: 0;
            padding: 0;
            width: 600px;
            height: 700px;
        }

    </style>

</head>
<body>
    
    <div data-montage-id="map-container">
        <div>
            Show: 
            <select data-montage-id="types">
                <option value=''>Select a Category</option>
                <option value='cafe'>Coffee</option>
                <option value='hospital'>Hospitals</option>
                <option value='museum'>Museums</option>
                <option value='restaurant'>Restaurants</option>
                
            </select>
        </div>
        <div data-montage-id="map" id="map" class="montage-google-map">MAP</div>
        
    </div>

</body>
</html>