MapOfWorld/index.html at master · canbax/MapOfWorld · GitHub

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
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, maximum-scale=1.0">

    <link rel="icon" type="image/x-icon" href="images/favicon.ico"/>
    <title>Map Of World</title>

    <!-- WinJS references -->
    <link href="WinJS/css/ui-dark.css" rel="stylesheet" />
    <script src="WinJS/js/base.js"></script>
    <script src="WinJS/js/ui.js"></script>
    <script src="Scripts/jquery-3.1.0.min.js"></script>
    <script src="Scripts/jquery-ui-1.12.0.js"></script>
    <!-- MapOfWorld references -->
    <link href="css/default.css" rel="stylesheet" />
    <script src="js/default.js"></script>
    <!--<script src="/js/map-js.js"></script>-->
    <script src="js/svg-pan-zoom.min.js"></script>
    <script src="js/hammer.js"></script>
</head>
<body role="application" class="win-type-body">
    <div id="app">
        <div class="splitView" data-win-control="WinJS.UI.SplitView" data-win-options="{
            openedDisplayMode: 'inline',
            closedDisplayMode: 'inline'
         }">
            <!-- Pane area -->
            <div>
                <div class="header">
                    <button class="win-splitviewpanetoggle"
                            data-win-control="WinJS.UI.SplitViewPaneToggle"
                            data-win-options="{ splitView: select('.splitView') }"></button>
                    <div class="title">Map of World</div>
                </div>

                <div class="nav-commands">
                    <div data-win-control="WinJS.UI.SplitViewCommand" id="playButton" data-win-options="{ label: 'play', icon: 'play', oninvoked: mySplitView.playClicked}"></div>
                    <div data-win-control="WinJS.UI.SplitViewCommand" data-win-options="{ label: 'find', icon: 'find', oninvoked: mySplitView.searchClicked}"></div>
                    <div data-win-control="WinJS.UI.SplitViewCommand" data-win-options="{ label: 'zoom in', icon: 'zoomin', oninvoked: mySplitView.zoomInClicked}"></div>
                    <div data-win-control="WinJS.UI.SplitViewCommand" data-win-options="{ label: 'zoom out', icon: 'zoomout', oninvoked: mySplitView.zoomOutClicked}"></div>
                    <div data-win-control="WinJS.UI.SplitViewCommand" data-win-options="{ label: 'settings', icon: 'settings', oninvoked: mySplitView.settingsClicked}"></div>

                </div>

            </div>

            <!-- Content area -->
            <div  id="settingsDiv">
                <table>
                    <tr>
                        <th colspan="3"><h3>Settings</h3></th>
                    </tr>
                    <tr><th>Territories</th><th>All Maps</th><th>Stats</th></tr>
                    <tr>
                        <td>
                            <div id="TerritoriesListView"
                                 class="win-selectionstylefilled"
                                 data-win-control="WinJS.UI.ListView"
                                 data-win-options="{
                        selectionMode: WinJS.UI.SelectionMode.single,
                        tapBehavior: WinJS.UI.TapBehavior.directSelect,
                        onselectionchanged : mySplitView.territoryItemClicked,
                        layout: { type: WinJS.UI.ListLayout }
                        }">
                            </div>
                        </td>
                        <td>
                            <div id="AllMapsListView"
                                 class="win-selectionstylefilled"
                                 data-win-control="WinJS.UI.ListView"
                                 data-win-options="{
                        itemDataSource:SearchUtils.allFileNames.dataSource,
                        selectionMode: WinJS.UI.SelectionMode.single,
                        tapBehavior: WinJS.UI.TapBehavior.directSelect,
                        onselectionchanged : mySplitView.mapItemClicked,
                        layout: { type: WinJS.UI.ListLayout }
                        }">
                            </div>
                        </td>
                        <td>
                            <p>True answers:<b id="trueAnsTxt"> </b></p>
                            <p>False answers:<b id="falseAnsTxt"> </b></p>
                            <p>Total time spent:<b id="playTimeTxt"> </b></p>

                        </td>
                    </tr>
                </table>
            </div>

            <table>
                <tr>
                    <td>
                        <div class="search topAppBar"
                             data-win-control="WinJS.UI.SearchBox"
                             id="searchDiv"
                             data-win-options="{
                chooseSuggestionOnEnter: true,
                focusOnKeyboardInput : true,
                placeholderText: 'start typing anywhere',
                searchHistoryDisabled: true,
                onquerysubmitted:SearchUtils.selectionChosen,
                onsuggestionsrequested:SearchUtils.suggestionsRequested }">
                        </div>
                    </td>
                    <td>
                        <span id="choicesSpan" class="topAppBar">
                            <button class="win-button"></button>
                            <button class="win-button"></button>
                            <button class="win-button"></button>
                            <button class="win-button"></button>
                        </span>
                    </td>
                </tr>
                <tr>
                    <td>
                        <h1 class="win-h1 topAppBar" id="selectedPlace"></h1>
                        <h2 class="win-h2 topAppBar" id="pointedPlace"></h2>
                    </td>
                    <td> <a id="creditLink" href="https://www.amcharts.com/"> Powered By AMCHARTS</a></td>
                </tr>
            </table>

            <div class="contentHost" id="contentHost"></div>

            </div>
    </div>

    <div data-win-control="WinJS.UI.ContentDialog" data-win-options="{
             title: 'Must Select!',
             primaryCommandText: 'OK',
             }">
        please select a suggested item from searchbox
    </div>
</body>
</html>