-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
144 lines (120 loc) · 5.17 KB
/
index.html
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
138
139
140
141
142
143
144
<!DOCTYPE html>
<html ng-app="ploxworld">
<head>
<meta charset="utf-8">
<title>PloxWorld</title>
<link rel="stylesheet" type="text/css" href="css/common.css">
<link rel="stylesheet" type="text/css" href="css/main.css">
<link rel="stylesheet" type="text/css" href="css/tradeWindow.css">
<link rel="stylesheet" type="text/css" href="css/animation.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
</head>
<body ng-controller="Controller">
<div id="title" class="clear">
<!--{{ 'World' | greet }}-->
</div>
<div id="menu">
menus lol
</div>
<div class="float-left">
<ul id="navbar" class="nav nav-pills">
<li id="tab-overview-persons"><a id="tab-overview-persons-link" href="#overview-persons" data-toggle="tab">1. Persons</a></li>
<li id="tab-overview-planets"><a href="#overview-planets" data-toggle="tab">2. Planets</a></li>
<li id="tab-overview-empires"><a href="#overview-empires" data-toggle="tab">3. Empires</a></li>
<li id="tab-overview-hide" class="hide"><a href="#overview-hide" data-toggle="tab"></a></li>
<!--hax to hide tabs-->
</ul>
<div id="map-container">
<div id="map">
<div class="absolute">
<canvas width="960" height="600" id="canvas-trade"/>
</div>
<div class="absolute">
<canvas width="960" height="600" id="canvas-travel"/>
</div>
<!--planets-->
<!-- -15 comes from half the planet size, so the center of the planet image always is the planet position -->
<div ng-repeat="object in planets" class="absolute"
ng-style="{'top': (object.y-15)+'px','left': (object.x-15)+'px'}">
<a ng-click="showPlanetDropdown(object)" ng-mouseover="hoverPlanet(object)" href="javascript:void(0)"><img src="img/planet.png"/></a>
<span ng-style="{'color': (object.getColor())}">{{object.name}}</span>
</div>
<!--ships-->
<div ng-repeat="object in ships" class="absolute ship"
ng-style="{'top': (object.position.y-25)+'px','left': (object.position.x-25)+'px'}">
<div class="ship-image-container">
<img ng-src="img/{{object.getImageName()}}.png"/>
</div>
</div>
<!-- planet dropdown -->
<div class="dropdown" id="menu1" ng-style="{'top': (selectedPlanet.y-20)+'px','left': (selectedPlanet.x-20)+'px'}">
<a class="dropdown-toggle" data-toggle="dropdown" href="#menu1" id="foo"></a>
<ul id="planet-dropdown-menu" class="dropdown-menu">
<li><a ng-click="showPlanet()" href="javascript:void(0)">1. Inspect</a></li>
<li><a ng-click="travelTo(selectedPlanet)" href="javascript:void(0)">2. Travel to</a></li>
<li><a ng-click="trade(selectedPlanet)" href="javascript:void(0)">3. Trade</a></li>
<li class="divider"></li>
<li><a href="#">cuddle</a></li>
</ul>
</div>
</div>
<div ng-include src="'tabsContent.html'"></div>
</div>
</div>
<div id="info">
<ul class="nav nav-tabs">
<li id="tab-galaxy"><a href="#tab1" data-toggle="tab">Galaxy</a></li>
<li id="tab-empires" class="active"><a href="#tab2" data-toggle="tab">Empires</a></li>
<li id="tab-whaeva"><a href="#">whaeva</a></li>
</ul>
<div class="tab-content">
<div id="tab1" class="tab-pane">
<p> Stardate: {{4000+tics/10}}</p>
<p> Total population: {{totPop}}</p>
</div>
<div id="tab2" class="tab-pane active">
<h5>Empire relations</h5>
<div id="empire-relations"></div>
<!-- filled with jquery currently... -->
</div>
</div>
</div>
<div id="actions">
<button ng-click="tic()" class="btn-primary">tic</button>
<button ng-click="startGame()" class="btn-primary">new game</button>
<button ng-click="calculateTradeMap()" class="btn-primary">test</button>
<button ng-click="openTrade()" class="btn-primary {{isPlayerAtPlanet()?'':'hide'}}">Trade</button>
<button ng-click="clearCache()" class="btn-primary">Clear cache</button>
<p>Current decision: {{player.decision.toString()}}</p>
<p>Current ship order: {{player.shipOrder.toString()}}</p>
</div>
<!--XXX use minimilized angular someday in the FUTURE-->
<!--XXX do we need sanitize?-->
<!--XXX use cdn when all is said and done-->
<!--<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>-->
<!--<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.js"></script>-->
<script src="js/moduls/jquery.min.js"></script>
<script src="js/moduls/bootstrap.min.js"></script>
<script src="js/moduls/underscore-min.js"></script>
<script src="js/moduls/angular.min.js"></script>
<script src="js/moduls/ui-bootstrap-custom-0.7.0.js"></script>
<script src="js/moduls/ui-bootstrap-custom-tpls-0.7.0.js"></script>
<script src="js/moduls/seedrandom.js"></script>
<script src="js/common.js"></script>
<script src="js/canvas.js"></script>
<script src="js/findPath.js"></script>
<script src="js/tradeWindow.js"></script>
<script src="js/resources.js"></script>
<script src="js/traderoutesCalculate.js"></script>
<script src="js/traderoutes.js"></script>
<script src="js/ship.js"></script>
<script src="js/planet.js"></script>
<script src="js/planetGenerator.js"></script>
<script src="js/empire.js"></script>
<script src="js/empireGenerator.js"></script>
<script src="js/person.js"></script>
<script src="js/personGenerator.js"></script>
<script src="js/tradeLogic.js"></script>
<script src="js/controller.js"></script>
</body>
</html>