-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
138 lines (107 loc) · 11.8 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
<!DOCTYPE html>
<!-- saved from url=(0071)http://visjs.org/examples/timeline/items/backgroundAreasWithGroups.html -->
<html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Star Wars | Timeline of Galactic History</title>
<script src="./groups_files/vis.js"></script>
<link href="./groups_files/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css">
<link href="./groups_files/style.css" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Space+Mono:400,700" rel="stylesheet">
</head>
<body>
<input type="button" id="window1" value="Reset" class="buttonreset"><br>
<div id="visualization">
</div>
</div>
<script>
var items = new vis.DataSet([
// first level eras
{id: 'A', className: 'prehistory', content: 'Prehistory', start: new Date(-6021,0,1), end: new Date(-3277,0,1), type: 'background'},
{id: 'B', className: 'falloftheoldrepublic', content: 'Fall of the Old Republic (Dark Age)', start: new Date(-3278,0,1), end: new Date(-1032,0,1), type: 'background'},
{id: 'C', content: 'Republic Era', start: new Date(-1032,0,1), end: new Date(-0033,0,1), type: 'background', group: 1},
{id: 'D', className: 'falloftherepublic', content: 'Fall of the Republic', start: new Date(-0033,0,1), end: new Date(-0019,0,1), type: 'background', group: 1},
{id: 'E', className: 'imperialera', content: 'Imperial Era (The Empire)', start: new Date(-0019,0,1), end: '0004', type: 'background', group: 1},
{id: 'F', content: 'New Republic Era', start: '0005', end: '0050', type: 'background', group: 1},
{id: 'G', className: 'preclone ', content: 'Cold War', start: '0005', end: '0034', type: 'background', group: 2 },
{id: 'H', className: 'firstorder', content: 'First Order', title: 'First Order - Resistance War', start: '0034', end: '0050', type: 'background', group: 2 },
// sub eras
{id: 'I', className: 'preclone', content: 'Pre-clone Wars', start: new Date(-0032,0,1), end: new Date(-0022,0,1), type: 'background', group: 2},
// BUG this entry is not rendering correctly with the start year of 22 and end of 19. Used alternate so it will render
{id: 'J', className: 'theclonewars', content: 'Clone Wars', start: new Date(-0018,0,1), end: new Date(-0015,0,1), type: 'background', group: 2},
{id: 'K', className: 'preclone', content: 'Pre-galactic Civil War', start: new Date(-0015,0,1), end: '0000', type: 'background', group: 2},
{id: 'L', className: 'theclonewars', content: 'Galactic Civil War', start: '0000', end: '0004', type: 'background', group: 2},
{id: 'M', className: 'theclonewars', content: '√', title: 'Senator Lanever Villecham is elected Chancellor of the New Republic', start: '0033', group: 1},
{id: 'n', className: 'blacktored', content: 'First Order Emergence', title: 'The First Order begins using Rinnrivin Dis cartel and the Amaxine warriors to procure funds for rebuilding its navy', start: '0021', end: '0034', type: 'background', group: 2 },
{id: 'O', className: 'bluebg', content: 'Separatists', title: 'Thousands of star systems leave the Republic and join the Confederacy of Independent Systems and Count Dooku.', start: new Date(-0024,0,1), end: new Date(-0019,0,1), type: 'range', group: 1},
{id: 'P', className: 'bluebg', content: 'Jedi–Sith war', start: new Date(-2032,0,1), end: new Date(-1032,0,1), type: 'range', group: 4 },
// Group 10 = Media, movies, etc
{id: 1, className: 'movie', content: 'I', title: 'Episode 1: The Phantom Menace',start: new Date(-0032,0,1), group: 1},
{id: 2, className: 'movie', content: 'II', title: 'Episode 2: Attack of the Clones', start: new Date(-0022,0,1), group: 1},
{id: 3, className: 'movie', content: 'III', title: 'Episode 3: Revenge of the Sith', start: new Date(-0019,0,1), group: 1},
{id: 4, className: 'movie', content: 'IV', title: 'Episode 4: A New Hope', start: '0000', group: 1},
{id: 5, className: 'movie', content: 'V', title: 'Episode 5: The Empire Strikes Back', start: '0003', group: 1},
{id: 6, className: 'movie', content: 'VI', title: 'Episode 6: Return of the Jedi', start: '0004', group: 1},
{id: 7, className: 'movie', content: 'VII', title: 'Episode 7: The Force Awakens', start: '0034', group: 1},
{id: 8, className: 'movie', content: 'VIII', title: 'Episode 8: The Last Jedi', start: '0035', group: 1},
{id: 9, className: 'movie', content: 'R1', title: 'Rogue One', start: new Date(-0013,0,1), end: new Date(-0001,0,1), group: 1},
// Group 4 Conflict
{id: 10, className: 'battlegood', content: '<a href="http://starwars.wikia.com/wiki/Battle_of_Yavin" target="_blank">*</a>', title: 'Battle of Yavin - The destruction of the first Death Star',start: '0000', group: 4},
{id: 11, className: 'theclonewars', content: '<a href="http://starwars.wikia.com/wiki/Military_Disarmament_Act" target="_blank">∆</a>', title: 'Military Disarmament Act',start: '0004', group: 1},
{id: 12, className: 'battlegood', content: '<a href="http://starwars.wikia.com/wiki/Battle_of_Jakku" target="_blank">*</a>', title: 'Battle of Jakku',start: '0005', group: 4},
{id: 13, className: 'battlebad', content: '<a href="http://starwars.wikia.com/wiki/Attack_on_Tuanul" target="_blank">*</a>', title: 'Attack on Tuanul',start: '0034', group: 4},
{id: 14, className: 'battlegood', content: '<a href="http://starwars.wikia.com/wiki/Battle_on_Takodana" target="_blank">*</a>', title: 'Battle on Takodana',start: '0034', group: 4},
{id: 15, className: 'battlebad', content: '<a href="http://starwars.wikia.com/wiki/Assault_on_Starkiller_Base" target="_blank">*</a>', title: 'Assault on Starkiller Base',start: '0034', group: 4},
{id: 16, className: 'battlegood', content: '<a href="http://starwars.wikia.com/wiki/Alliance_to_Restore_the_Republic" target="_blank">Rebel Alliance</a>', title: 'The Alliance to Restore the Republic',start: '0002', end: '0004', group: 2},
{id: 17, className: 'battlegood', content: 'Formation of the New Republic', title: 'The Rebel Alliance begins reorganizing into the New Republic',start: '0004', end: '0005', group: 2},
{id: 18, className: 'battlegood', content: '<a href="http://starwars.wikia.com/wiki/Battle_of_Endor" target="_blank">*</a>', title: 'Battle of Endor',start: '0004', group: 4},
{id: 19, className: 'battlebad', content: '<a href="http://starwars.wikia.com/wiki/Battle_of_Hoth" target="_blank">*</a>', title: 'Battle of Hoth (Echo Base)',start: '0003', group: 4},
{id: 20, className: 'blacktoblue', content: 'Rebel Uprising', title: 'Bail Organa and Ahsoka Tano organize a rebel network',start: new Date(-0018,0,1), end: '0002', group: 2},
{id: 21, className: 'battlebad', content: '•', title: 'The Death Star moved to Scarif', start: new Date(-009,0,1), group: 4},
{id: 22, className: 'battlebad', content: '*', title: 'Jedha City is destroyed by the Death Star.', start: '0000', group: 4},
{id: 23, className: 'battlebad', content: '*', title: 'Alderaan is destroyed by the Death Star', start: '0000', group: 4},
{id: 24, className: 'battlebad', content: '•', title: 'Construction of the Death Star begins over Geonosis', start: new Date(-0020,0,1), group: 4},
{id: 25, className: 'battlebad', content: '<a href="http://starwars.wikia.com/wiki/Destruction_of_Luke_Skywalker%27s_Jedi" target="_blank">Destruction of Skywalker Jedi</a>', title: 'Luke Skywalker goes into exile. Unknown period of time between 28 ABY and 34 ABY', type: 'range',start: '0028', end:'0032', group: 4},
{id: 27, className: 'theclonewars', content: '<a href="http://starwars.wikia.com/wiki/Imperial-Republic_peace_talks" target="_blank">∆</a>', title: 'Imperial-Republic peace talks',start: '0005', group: 2},
{id: 28, className: 'theclonewars', content: '∆', title: 'The New Republic restores the Galactic Senate on Chandrila, its capital.',start: '0004', group: 1},
{id: 29, className: 'theclonewars', type: 'point', content: 'Ω', title: 'Obi-Wan Kenobi goes into exile on Tatooine. Yoda goes into exile on Dagobah.',start: new Date(-0019,0,1), group: 5},
{id: 39, className: 'theclonewars', content: '<a href="http://starwars.wikia.com/wiki/Order_66" target="_blank">∆</a>', title: 'Order 66 wipes out the Jedi Order and nearly all Jedi.', start: new Date(-0019,0,1), group: 1},
{id: 40, className: 'battlebad', content: '<a href="http://starwars.wikia.com/wiki/Battle_of_Geonosis">*</a>', title: 'Battle of Geonosis', start: new Date(-0022,0,1), group: 4},
{id: 41, className: 'battlebad', content: '<a href="http://starwars.wikia.com/wiki/Invasion_of_Naboo">*</a>', title: 'Invasion of Naboo', start: new Date(-0032,0,1), group: 4},
{id: 42, className: 'theclonewars', content: '<a href="http://starwars.wikia.com/wiki/Order_66" target="_blank">∆</a>', title: 'Senator Sheev Palpatine is elected Supreme Chancellor of the Republic, replacing Finis Valorum.', start: new Date(-0032,0,1), group: 1},
{id: 43, className: 'theclonewars', content: '<a href="http://starwars.wikia.com/wiki/Order_66" target="_blank">?</a>', title: 'The Galactic Senate debates the Military Creation Act to determine whether the Galactic Republic should raise an army', start: new Date(-0024,0,1), group: 2},
{id: 44, className: 'theclonewars', content: '<a href="http://starwars.wikia.com/wiki/Order_66" target="_blank">!</a>', title: 'Plot to assassinate Padmé Amidala. Separatist leaders hope to silence the senator from Naboo, who opposes the Military Creation Act.', start: new Date(-0022,0,1), group: 2},
{id: 45, className: 'theclonewars', content: '<a href="http://starwars.wikia.com/wiki/Order_66" target="_blank">∆</a>', title: 'Jar Jar Binks proposes that Chancellor Palpatine be given emergency powers to raise an army without the interference of the Senate.', start: new Date(-0022,0,1), group: 2},
{id: 46, className: 'theclonewars', content: '<a href="http://starwars.wikia.com/wiki/Order_66" target="_blank">∆</a>', title: 'Anakin Skywalker is anointed Darth Vader, Dark Lord of the Sith.', start: new Date(-0019,0,1), group: 2},
{id: 47, className: 'theclonewars', content: '<a href="http://starwars.wikia.com/wiki/Order_66" target="_blank">∆</a>', title: 'The Republic is reorganized into the first Galactic Empire by Chancellor Palpatine – secretly the Dark Lord of the Sith Darth Sidious – who declares himself Galactic Emperor', start: new Date(-0019,0,1), group: 1},
{id: 48, className: 'theclonewars', content: '<a href="http://starwars.wikia.com/wiki/Galactic_Concordance" target="_blank">∆</a>', title: 'The Galactic Concordance. The New Republic and Galactic Empire cease hostilities and both powers begin a process of disarmament.<br>The remaining forces of the Galactic Empire retreat to the Unknown Regions',start: '0005', group: 1},
]);
var groups = new vis.DataSet([
{id: 1, content: 'Era'},
{id: 2, content: 'Sub Era'},
{id: 4, content: 'Conflict'},
]);
var container = document.getElementById('visualization');
var options = {
min: new Date(-6021, 0, 1),
max: '0050',
start: new Date(-0040,0,1), // start and end dictate where the window is zoomed to on load
end: '0045', // start and end dictate where the window is zoomed to on load
height: '100vh',
orientation: 'both',
showCurrentTime: false,
zoomMin: 1000 * 60 * 60 * 24 * 365 * 12 // Cannot zoom closer than 1 year increment
};
var timeline = new vis.Timeline(container, items, groups, options);
document.getElementById('window1').onclick = function() {
timeline.setWindow(new Date(-0040,0,1), '0045');
};
</script>
<div style="display: none;"><div class="niice-bar" id="niice-bar">
<div class="boards">
</div>
<div class="loading-spinner">Loading…</div>
<div class="error-text">
<span class="msg"></span>
<span class="close-cross">×</span>
</div>
</div>
</div></body></html>