Skip to content

Commit 3937917

Browse files
committed
Adding in Image parsing.
1 parent 5073489 commit 3937917

3 files changed

Lines changed: 31 additions & 42 deletions

File tree

v3/src/loader/BaseLoader.js

Lines changed: 5 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,6 @@ var BaseLoader = function ()
99
{
1010
// To finish the loader ...
1111
//
12-
// 1) Image Tag loader
13-
// 2) Events (or Signals?) for the various stages
1412
// 3) Progress update
1513
// 4) JSON loader
1614
// 5) XML Loader
@@ -19,6 +17,8 @@ var BaseLoader = function ()
1917

2018
this.events = new EventDispatcher();
2119

20+
this.forceImageTags = false;
21+
2222
// Move to a 'setURL' method?
2323
this.baseURL = '';
2424
this.path = '';
@@ -230,22 +230,9 @@ BaseLoader.prototype = {
230230
this.events.dispatch(new Event.LOADER_COMPLETE_EVENT(this));
231231
},
232232

233-
getLoadedFiles (group = '', output = []) {
234-
235-
var output = [];
236-
237-
// Return an array of all files that have state = COMPLETE (which means loaded + processed)
238-
239-
for (let file of this.storage)
240-
{
241-
if (file.state === FILE.COMPLETE && file.tag === group && (type !== '' && file.type === type))
242-
{
243-
output.push(file);
244-
}
245-
}
246-
247-
return output;
248-
233+
getLoadedFiles: function ()
234+
{
235+
return this.storage.slice();
249236
},
250237

251238
reset: function ()

v3/src/loader/File.js

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -57,20 +57,21 @@ File.prototype = {
5757
// ProgressEvent
5858
onLoad: function (event)
5959
{
60-
console.log('image loaded');
61-
console.log(event);
62-
60+
// console.log('image loaded');
61+
// console.log(event);
6362
// this.onStateChange(LOADING);
6463

64+
this.process();
65+
6566
this.resetXHR();
6667

6768
this.callback(this, true);
6869
},
6970

7071
onError: function (event)
7172
{
72-
console.log('image error');
73-
console.log(event);
73+
// console.log('image error');
74+
// console.log(event);
7475

7576
this.resetXHR();
7677

@@ -87,14 +88,16 @@ File.prototype = {
8788
console.log(this.percentComplete + '% (' + this.bytesLoaded + ' bytes)');
8889
},
8990

90-
onProcess: function ()
91+
process: function ()
9192
{
92-
console.log('process the image');
93+
// Override by an extending class
9394
},
9495

9596
onComplete: function ()
9697
{
97-
console.log('image completed and added to the loader store');
98+
console.log('File completed, ready to add to the Loader store');
99+
100+
this.state = CONST.FILE_COMPLETE;
98101
},
99102

100103
// Called by the Loader, starts the actual file downloading
@@ -106,8 +109,6 @@ File.prototype = {
106109

107110
this.src = GetURL(this, baseURL);
108111

109-
console.log('LOADING2', this.src);
110-
111112
this.xhrLoader = XHRLoader(this, globalXHR);
112113
}
113114
};
Lines changed: 15 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,14 @@
1-
// var FILE_CONST = require('../const');
21

2+
var CONST = require('../const');
33
var File = require('../File');
44

5-
// Different images based on device-pixel ratio
6-
// And maybe on screen resolution breakpoints
7-
8-
// 2 options - can either return the File object, so they can listen to it specifically
9-
// Or can return the Loader, so they can chain calls?
10-
115
var ImageFile = function (key, url, path)
126
{
137
if (path === undefined) { path = ''; }
148

159
if (!key)
1610
{
17-
console.warn('Loader: You tried to load an Image, but no key was given');
18-
19-
return false;
11+
throw new Error('Error calling \'Loader.image\' invalid key provided.');
2012
}
2113

2214
if (!url)
@@ -28,17 +20,26 @@ var ImageFile = function (key, url, path)
2820
url = path.concat(url);
2921
}
3022

31-
var file = new File('image', key, url, 'arraybuffer');
32-
33-
return file;
23+
File.call(this, 'image', key, url, 'blob');
3424
};
3525

3626
ImageFile.prototype = Object.create(File.prototype);
3727
ImageFile.prototype.constructor = ImageFile;
3828

39-
ImageFile.prototype.onProcess = function ()
29+
ImageFile.prototype.process = function ()
4030
{
31+
this.state = CONST.FILE_PROCESSING;
32+
33+
this.data = new Image();
34+
35+
this.data.onload = function ()
36+
{
37+
window.URL.revokeObjectURL(this.src);
38+
39+
this.onComplete();
40+
};
4141

42+
this.data.src = window.URL.createObjectURL(this.xhrLoader.response);
4243
};
4344

4445
module.exports = ImageFile;

0 commit comments

Comments
 (0)