weratius Posted June 29, 2015 Share Posted June 29, 2015 Hello! there is a boot.js file:game.load.image('weapon_2_2', 'img/profile/res/' + playerInfoObject.w4.id + '.png');game.load.image('weapon_2_3', 'img/profile/res/' + playerInfoObject.w5.id + '.png');I need to change the keys of already loaded images I do this like that:var loader = new Phaser.Loader(game);var myObject = this; //(my own parent object)loader.image('weapon_2_3', 'img/profile/res/' + playerInfoObject.w4.id + '.png', true);loader.image('weapon_2_2', 'img/profile/res/' + playerInfoObject.w5.id + '.png', true);loader.onLoadComplete.add(myObject.refresh);// Why can't I just load image without any callback (onLoadComplete)?//If I delete this callback method the loader won't work at allloader.start();and here is the problem: I don't need a callback method (refresh method is empty) I have problems smth like that (On image) What should I do? Thank you =) Link to comment Share on other sites More sharing options...
drhayes Posted June 29, 2015 Share Posted June 29, 2015 Can't tell for sure, but I bet the image hasn't finished loading yet. That means there's nothing there, that means the drawImage call fails. If you really and truly need the same image under different keys try adding a cache-breaker as a query param to the image name, e.g. "img/gun.png?23480293840" where that's from a call to Math.random(). Link to comment Share on other sites More sharing options...
weratius Posted June 30, 2015 Author Share Posted June 30, 2015 Can't tell for sure, but I bet the image hasn't finished loading yet. That means there's nothing there, that means the drawImage call fails. If you really and truly need the same image under different keys try adding a cache-breaker as a query param to the image name, e.g. "img/gun.png?23480293840" where that's from a call to Math.random().I can't do that =(Because I need all keys of images to be constant I am creating a profile of a user. There are a lot of items it in and I just need to swap them. The objects and keys of items are swapped but I also need to swap the keys of images Thank you Link to comment Share on other sites More sharing options...
drhayes Posted July 1, 2015 Share Posted July 1, 2015 The keys would be the same, but the paths would be different. Instead of "this.game.load.image('key', 'path/to/image.png');" you'd have "this.game.load.image('key', 'path/to/image.png?' + Math.random());". But I'm not sure I'm giving you a solution to the problem you're describing at this point. ( = Link to comment Share on other sites More sharing options...
InsaneHero Posted July 2, 2015 Share Posted July 2, 2015 If I remember correctly the keys are used to access the raw ImageData in a Pixi database which is way way down deep in the guts of the system.To change the keys you need to get all the way down to where the images are stored. I can't help you more with that because I don't really know how Pixi works to store textures... I would guess they have a dictionary of keys and ImageData records... but it could be doing some clever stuff with hash table lookups to speed access, in which case changing the key for an existing resource is likely to be extraordinarily hard. You also asked (in comments): // Why can't I just load image without any callback (onLoadComplete)?//If I delete this callback method the loader won't work at all And the answer to that is because your browser won't let you. Calling the load image function doesn't actually "load the image"... it adds it to a queue of things that your browser will (asynchronously) access from various places on your hard-drive or over the network from various servers and folders. You have to have a callback to know when the browser has finished getting all those bits from where-ever they are stored. As you can imagine that sometimes takes quite a long time (in computer terms) so they made it all asynchronous so that you can do something else while you're waiting (even if it's just showing a loader bar to the user). Without the callback, the loader is actually still working, but you don't know when it's finished so none of the rest of your code knows whether the images are ready or not. Link to comment Share on other sites More sharing options...
weratius Posted July 3, 2015 Author Share Posted July 3, 2015 The keys would be the same, but the paths would be different. Instead of "this.game.load.image('key', 'path/to/image.png');" you'd have "this.game.load.image('key', 'path/to/image.png?' + Math.random());". But I'm not sure I'm giving you a solution to the problem you're describing at this point. ( =That didn't help me, at all =(But that's very interesting =) Link to comment Share on other sites More sharing options...
weratius Posted July 3, 2015 Author Share Posted July 3, 2015 If I remember correctly the keys are used to access the raw ImageData in a Pixi database which is way way down deep in the guts of the system.To change the keys you need to get all the way down to where the images are stored. I can't help you more with that because I don't really know how Pixi works to store textures... I would guess they have a dictionary of keys and ImageData records... but it could be doing some clever stuff with hash table lookups to speed access, in which case changing the key for an existing resource is likely to be extraordinarily hard. You also asked (in comments): // Why can't I just load image without any callback (onLoadComplete)?//If I delete this callback method the loader won't work at all And the answer to that is because your browser won't let you. Calling the load image function doesn't actually "load the image"... it adds it to a queue of things that your browser will (asynchronously) access from various places on your hard-drive or over the network from various servers and folders. You have to have a callback to know when the browser has finished getting all those bits from where-ever they are stored. As you can imagine that sometimes takes quite a long time (in computer terms) so they made it all asynchronous so that you can do something else while you're waiting (even if it's just showing a loader bar to the user). Without the callback, the loader is actually still working, but you don't know when it's finished so none of the rest of your code knows whether the images are ready or not.Thank you very much for such an interesting information =) But is that possible to change them? Is that so that developers of Phaser Framework didn't want to make an opportunity of changing images? Link to comment Share on other sites More sharing options...
InsaneHero Posted July 3, 2015 Share Posted July 3, 2015 "Is that so that developers of Phaser Framework didn't want to make an opportunity of changing images?"As I mentioned, I'm not entirely familiar with the whole system, but it's important to remember that you're dealing with two separate systems here: the Phaser framework is sitting on top of the Pixi drawing framework. Because of this certain unusual types of action require good knowledge of both systems.What you are trying to do (access a previously loaded image with a new key) is very unusual, and is almost certainly not something that the designers of either of these two systems intended you to do. Can I suggest that you'd probably get the result you want without trying to change keys? There are many ways to achieve your goal, but the most obvious one is to make a Dictionary of your own where each 'key' which an image was loaded with, is referenced by another key which you can rename as you please. I haven't tested this, so I'm not entirely sure that JS will let you use strings as array indices like this, but the language is ripe for abuse so it'll probably be ok:// creatingmyDictionary = [];// addingmyDictionary["whatever_I_want_to_call_it_now"] = originalImageKey;// accessingvar imageKey = myDictionary["whatever_I_want_to_call_it_now"];// now get the image from Phaser using imageKey which is the originalImageKey...Doing it this way, you can have several new keys with your own names, which all access the same originalImageKey. Link to comment Share on other sites More sharing options...
weratius Posted July 5, 2015 Author Share Posted July 5, 2015 "Is that so that developers of Phaser Framework didn't want to make an opportunity of changing images?"As I mentioned, I'm not entirely familiar with the whole system, but it's important to remember that you're dealing with two separate systems here: the Phaser framework is sitting on top of the Pixi drawing framework. Because of this certain unusual types of action require good knowledge of both systems.What you are trying to do (access a previously loaded image with a new key) is very unusual, and is almost certainly not something that the designers of either of these two systems intended you to do. Can I suggest that you'd probably get the result you want without trying to change keys? There are many ways to achieve your goal, but the most obvious one is to make a Dictionary of your own where each 'key' which an image was loaded with, is referenced by another key which you can rename as you please. I haven't tested this, so I'm not entirely sure that JS will let you use strings as array indices like this, but the language is ripe for abuse so it'll probably be ok:// creatingmyDictionary = [];// addingmyDictionary["whatever_I_want_to_call_it_now"] = originalImageKey;// accessingvar imageKey = myDictionary["whatever_I_want_to_call_it_now"];// now get the image from Phaser using imageKey which is the originalImageKey...Doing it this way, you can have several new keys with your own names, which all access the same originalImageKey.Thank you for your answer!But I didn't understand how I should be able to use it For example: I have a boot file that preuploads everything (images) and there is the key of image set to each one this way, i.e:game.load.image('item16', 'img/profile/res/16.png');game.load.image('item17', 'img/profile/res/17.png');game.load.image('item18', 'img/profile/res/18.png');game.load.image('item19', 'img/profile/res/19.png');how can I do that? Thank you=) Link to comment Share on other sites More sharing options...
Recommended Posts