Skip to content

Commit 209ea45

Browse files
committed
Updated loader
1 parent aa01749 commit 209ea45

8 files changed

+84
-28
lines changed

demo_galnet.html

-6
Original file line numberDiff line numberDiff line change
@@ -32,12 +32,6 @@
3232
<div id="edmap"></div>
3333

3434

35-
<!-- Loader -->
36-
<div id="loader">
37-
<svg width="100" height="100" viewbox="0 0 40 40"><path d="m5,8l5,8l5,-8z" class="l1 d1" /><path d="m5,8l5,-8l5,8z" class="l1 d2" /><path d="m10,0l5,8l5,-8z" class="l1 d3" /><path d="m15,8l5,-8l5,8z" class="l1 d4" /><path d="m20,0l5,8l5,-8z" class="l1 d5" /><path d="m25,8l5,-8l5,8z" class="l1 d6" /><path d="m25,8l5,8l5,-8z" class="l1 d7" /><path d="m30,16l5,-8l5,8z" class="l1 d8" /><path d="m30,16l5,8l5,-8z" class="l1 d9" /><path d="m25,24l5,-8l5,8z" class="l1 d10" /><path d="m25,24l5,8l5,-8z" class="l1 d11" /><path d="m20,32l5,-8l5,8z" class="l1 d13" /><path d="m15,24l5,8l5,-8z" class="l1 d14" /><path d="m10,32l5,-8l5,8z" class="l1 d15" /><path d="m5,24l5,8l5,-8z" class="l1 d16" /><path d="m5,24l5,-8l5,8z" class="l1 d17" /><path d="m0,16l5,8l5,-8z" class="l1 d18" /><path d="m0,16l5,-8l5,8z" class="l1 d19" /><path d="m10,16l5,-8l5,8z" class="l2 d0" /><path d="m15,8l5,8l5,-8z" class="l2 d3" /><path d="m20,16l5,-8l5,8z" class="l2 d6" /><path d="m20,16l5,8l5,-8z" class="l2 d9" /><path d="m15,24l5,-8l5,8z" class="l2 d12" /><path d="m10,16l5,8l5,-8z" class="l2 d15" /></svg>
38-
</div>
39-
40-
4135
<!-- jQuery -->
4236
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
4337
<!-- Three.js -->

demo_infos.html

-5
Original file line numberDiff line numberDiff line change
@@ -58,11 +58,6 @@ <h1>Milky Way</h1>
5858
<div id="debug"></div>
5959

6060

61-
<!-- Loader -->
62-
<div id="loader">
63-
<svg width="100" height="100" viewbox="0 0 40 40"><path d="m5,8l5,8l5,-8z" class="l1 d1" /><path d="m5,8l5,-8l5,8z" class="l1 d2" /><path d="m10,0l5,8l5,-8z" class="l1 d3" /><path d="m15,8l5,-8l5,8z" class="l1 d4" /><path d="m20,0l5,8l5,-8z" class="l1 d5" /><path d="m25,8l5,-8l5,8z" class="l1 d6" /><path d="m25,8l5,8l5,-8z" class="l1 d7" /><path d="m30,16l5,-8l5,8z" class="l1 d8" /><path d="m30,16l5,8l5,-8z" class="l1 d9" /><path d="m25,24l5,-8l5,8z" class="l1 d10" /><path d="m25,24l5,8l5,-8z" class="l1 d11" /><path d="m20,32l5,-8l5,8z" class="l1 d13" /><path d="m15,24l5,8l5,-8z" class="l1 d14" /><path d="m10,32l5,-8l5,8z" class="l1 d15" /><path d="m5,24l5,8l5,-8z" class="l1 d16" /><path d="m5,24l5,-8l5,8z" class="l1 d17" /><path d="m0,16l5,8l5,-8z" class="l1 d18" /><path d="m0,16l5,-8l5,8z" class="l1 d19" /><path d="m10,16l5,-8l5,8z" class="l2 d0" /><path d="m15,8l5,8l5,-8z" class="l2 d3" /><path d="m20,16l5,-8l5,8z" class="l2 d6" /><path d="m20,16l5,8l5,-8z" class="l2 d9" /><path d="m15,24l5,-8l5,8z" class="l2 d12" /><path d="m10,16l5,8l5,-8z" class="l2 d15" /></svg>
64-
</div>
65-
6661

6762
<!-- jQuery -->
6863
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>

demo_no_jsonfile.html

-6
Original file line numberDiff line numberDiff line change
@@ -46,12 +46,6 @@ <h1>NO JSon file test</h1>
4646
<div id="edmap"></div>
4747

4848

49-
<!-- Loader -->
50-
<div id="loader">
51-
<svg width="100" height="100" viewbox="0 0 40 40"><path d="m5,8l5,8l5,-8z" class="l1 d1" /><path d="m5,8l5,-8l5,8z" class="l1 d2" /><path d="m10,0l5,8l5,-8z" class="l1 d3" /><path d="m15,8l5,-8l5,8z" class="l1 d4" /><path d="m20,0l5,8l5,-8z" class="l1 d5" /><path d="m25,8l5,-8l5,8z" class="l1 d6" /><path d="m25,8l5,8l5,-8z" class="l1 d7" /><path d="m30,16l5,-8l5,8z" class="l1 d8" /><path d="m30,16l5,8l5,-8z" class="l1 d9" /><path d="m25,24l5,-8l5,8z" class="l1 d10" /><path d="m25,24l5,8l5,-8z" class="l1 d11" /><path d="m20,32l5,-8l5,8z" class="l1 d13" /><path d="m15,24l5,8l5,-8z" class="l1 d14" /><path d="m10,32l5,-8l5,8z" class="l1 d15" /><path d="m5,24l5,8l5,-8z" class="l1 d16" /><path d="m5,24l5,-8l5,8z" class="l1 d17" /><path d="m0,16l5,8l5,-8z" class="l1 d18" /><path d="m0,16l5,-8l5,8z" class="l1 d19" /><path d="m10,16l5,-8l5,8z" class="l2 d0" /><path d="m15,8l5,8l5,-8z" class="l2 d3" /><path d="m20,16l5,-8l5,8z" class="l2 d6" /><path d="m20,16l5,8l5,-8z" class="l2 d9" /><path d="m15,24l5,-8l5,8z" class="l2 d12" /><path d="m10,16l5,8l5,-8z" class="l2 d15" /></svg>
52-
</div>
53-
54-
5549
<!-- jQuery -->
5650
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
5751
<!-- Three.js -->

demo_routes.html

-6
Original file line numberDiff line numberDiff line change
@@ -58,12 +58,6 @@ <h1>Milky Way</h1>
5858
<div id="debug"></div>
5959

6060

61-
<!-- Loader -->
62-
<div id="loader">
63-
<svg width="100" height="100" viewbox="0 0 40 40"><path d="m5,8l5,8l5,-8z" class="l1 d1" /><path d="m5,8l5,-8l5,8z" class="l1 d2" /><path d="m10,0l5,8l5,-8z" class="l1 d3" /><path d="m15,8l5,-8l5,8z" class="l1 d4" /><path d="m20,0l5,8l5,-8z" class="l1 d5" /><path d="m25,8l5,-8l5,8z" class="l1 d6" /><path d="m25,8l5,8l5,-8z" class="l1 d7" /><path d="m30,16l5,-8l5,8z" class="l1 d8" /><path d="m30,16l5,8l5,-8z" class="l1 d9" /><path d="m25,24l5,-8l5,8z" class="l1 d10" /><path d="m25,24l5,8l5,-8z" class="l1 d11" /><path d="m20,32l5,-8l5,8z" class="l1 d13" /><path d="m15,24l5,8l5,-8z" class="l1 d14" /><path d="m10,32l5,-8l5,8z" class="l1 d15" /><path d="m5,24l5,8l5,-8z" class="l1 d16" /><path d="m5,24l5,-8l5,8z" class="l1 d17" /><path d="m0,16l5,8l5,-8z" class="l1 d18" /><path d="m0,16l5,-8l5,8z" class="l1 d19" /><path d="m10,16l5,-8l5,8z" class="l2 d0" /><path d="m15,8l5,8l5,-8z" class="l2 d3" /><path d="m20,16l5,-8l5,8z" class="l2 d6" /><path d="m20,16l5,8l5,-8z" class="l2 d9" /><path d="m15,24l5,-8l5,8z" class="l2 d12" /><path d="m10,16l5,8l5,-8z" class="l2 d15" /></svg>
64-
</div>
65-
66-
6761
<!-- jQuery -->
6862
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
6963
<!-- Three.js -->

js/components/galaxy.class.js

-2
Original file line numberDiff line numberDiff line change
@@ -51,8 +51,6 @@ var Galaxy = {
5151
Action.moveInitalPositionNoAnim();
5252
}
5353

54-
Ed3d.showScene();
55-
5654
};
5755

5856
//-- load img source

js/components/hud.class.js

+3
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ var HUD = {
88
*/
99
'init' : function() {
1010

11+
Loader.update('Init HUD');
1112
this.initHudAction();
1213
this.initControls();
1314

@@ -258,6 +259,8 @@ var HUD = {
258259

259260
'initFilters' : function(categories) {
260261

262+
Loader.update('HUD Filter...');
263+
261264
var grpNb = 1;
262265
$.each(categories, function(typeFilter, values) {
263266

js/ed3dmap.js

+80-2
Original file line numberDiff line numberDiff line change
@@ -136,7 +136,7 @@ var Ed3d = {
136136
showGalaxyInfos: false
137137
}, options);
138138

139-
$('#loader').show();
139+
Loader.start();
140140

141141
//-- Set Option
142142
this.basePath = options.basePath;
@@ -157,6 +157,7 @@ var Ed3d = {
157157

158158

159159
//-- Load dependencies
160+
Loader.update('Load core files');
160161

161162
if(typeof isMinified !== 'undefined') return Ed3d.launchMap();
162163

@@ -184,6 +185,7 @@ var Ed3d = {
184185

185186
).done(function() {
186187

188+
Loader.update('Done !');
187189
Ed3d.launchMap();
188190

189191
});
@@ -196,6 +198,8 @@ var Ed3d = {
196198

197199
'rebuild' : function(options) {
198200

201+
Loader.start();
202+
199203
// Remove System & HUD filters
200204
System.remove();
201205
HUD.removeFilters();
@@ -206,6 +210,8 @@ var Ed3d = {
206210

207211
Action.moveInitalPosition();
208212

213+
Loader.stop();
214+
209215
},
210216

211217
/**
@@ -214,8 +220,11 @@ var Ed3d = {
214220

215221
'launchMap' : function() {
216222

223+
224+
Loader.update('Textures');
217225
Ed3d.loadTextures();
218226

227+
Loader.update('Launch scene');
219228
Ed3d.initScene();
220229

221230
// Create grid
@@ -232,9 +241,11 @@ var Ed3d = {
232241
HUD.create("ed3dmap");
233242

234243
// Add galaxy center
244+
Loader.update('Add Sagittarius A*');
235245
Galaxy.addGalaxyCenter();
236246

237247
// Load systems
248+
Loader.update('Loading json file');
238249
if(this.jsonPath != null) Ed3d.loadDatasFromFile();
239250
else if(this.jsonContainer != null) Ed3d.loadDatasFromContainer();
240251

@@ -344,7 +355,7 @@ var Ed3d = {
344355

345356
'showScene' : function() {
346357

347-
$('#loader').hide();
358+
Loader.stop();
348359
scene.visible = true;
349360

350361
},
@@ -355,6 +366,7 @@ var Ed3d = {
355366

356367
'loadDatasFromFile' : function() {
357368

369+
358370
$.getJSON(this.jsonPath, function(data) {
359371

360372
Ed3d.loadDatas(data);
@@ -363,6 +375,8 @@ var Ed3d = {
363375

364376
Ed3d.loadDatasComplete();
365377

378+
Ed3d.showScene();
379+
366380
});
367381
},
368382

@@ -380,6 +394,8 @@ var Ed3d = {
380394

381395
Ed3d.loadDatasComplete();
382396

397+
Ed3d.showScene();
398+
383399
},
384400

385401
'loadDatas' : function(data) {
@@ -395,6 +411,7 @@ var Ed3d = {
395411

396412
//-- Init Routes
397413

414+
Loader.update('Routes...');
398415
if(data.routes != undefined) {
399416
$.each(data.routes, function(key, route) {
400417
Route.initRoute(key, route);
@@ -403,6 +420,7 @@ var Ed3d = {
403420

404421
//-- Loop into systems
405422

423+
Loader.update('Systems...');
406424
$.each(list, function(key, val) {
407425

408426
system = System.create(val);
@@ -498,6 +516,11 @@ var Ed3d = {
498516

499517
function animate(time) {
500518

519+
if(scene.visible == false) {
520+
requestAnimationFrame( animate );
521+
return;
522+
}
523+
501524
refreshWithCamPos();
502525
//controls.noRotate().set(false);
503526
//controls.noPan().set(false);
@@ -736,3 +759,58 @@ function refreshWithCamPos() {
736759
camSave.z = Math.round(camera.position.z/p)*p;
737760

738761
}
762+
763+
764+
var Loader = {
765+
766+
/**
767+
* Start loader
768+
*/
769+
770+
'start' : function() {
771+
772+
$('#loader').remove();
773+
$('<div></div>')
774+
.attr('id','loader')
775+
.html(Loader.svgAnim)
776+
.css('color','rgb(200, 110, 37)')
777+
.css('font-size','1.5rem')
778+
.css('font-family','Helvetica')
779+
.css('font-variant','small-caps')
780+
.appendTo('body');
781+
782+
783+
clearInterval(this.animCount);
784+
this.animCount = setInterval(function () {
785+
var animProgress = $('#loader #loadTimer');
786+
animProgress.append('.');
787+
if(animProgress.html().length > 10) animProgress.html('.');
788+
}, 1000);
789+
790+
},
791+
792+
/**
793+
* Refresh infos for current loading step
794+
*/
795+
796+
'update' : function(info) {
797+
798+
$('#loader #loadInfos').html(info);
799+
800+
},
801+
802+
/**
803+
* Stop loader
804+
*/
805+
806+
'stop' : function() {
807+
808+
$('#loader').remove();
809+
clearInterval(this.animCount);
810+
811+
},
812+
813+
'animCount' : null,
814+
'svgAnim' : '<div id="loadInfos"></div><div id="loadTimer">.</div><svg width="100" height="100" viewbox="0 0 40 40"><path d="m5,8l5,8l5,-8z" class="l1 d1" /><path d="m5,8l5,-8l5,8z" class="l1 d2" /><path d="m10,0l5,8l5,-8z" class="l1 d3" /><path d="m15,8l5,-8l5,8z" class="l1 d4" /><path d="m20,0l5,8l5,-8z" class="l1 d5" /><path d="m25,8l5,-8l5,8z" class="l1 d6" /><path d="m25,8l5,8l5,-8z" class="l1 d7" /><path d="m30,16l5,-8l5,8z" class="l1 d8" /><path d="m30,16l5,8l5,-8z" class="l1 d9" /><path d="m25,24l5,-8l5,8z" class="l1 d10" /><path d="m25,24l5,8l5,-8z" class="l1 d11" /><path d="m20,32l5,-8l5,8z" class="l1 d13" /><path d="m15,24l5,8l5,-8z" class="l1 d14" /><path d="m10,32l5,-8l5,8z" class="l1 d15" /><path d="m5,24l5,8l5,-8z" class="l1 d16" /><path d="m5,24l5,-8l5,8z" class="l1 d17" /><path d="m0,16l5,8l5,-8z" class="l1 d18" /><path d="m0,16l5,-8l5,8z" class="l1 d19" /><path d="m10,16l5,-8l5,8z" class="l2 d0" /><path d="m15,8l5,8l5,-8z" class="l2 d3" /><path d="m20,16l5,-8l5,8z" class="l2 d6" /><path d="m20,16l5,8l5,-8z" class="l2 d9" /><path d="m15,24l5,-8l5,8z" class="l2 d12" /><path d="m10,16l5,8l5,-8z" class="l2 d15" /></svg>'
815+
816+
}

js/ed3dmap.min.js

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)