Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

AppGameKit Studio Chat / Storing data in an image

Author
Message
blink0k
Moderator
11
Years of Service
User Offline
Joined: 22nd Feb 2013
Location: the land of oz
Posted: 15th Dec 2020 02:29 Edited at: 16th Dec 2020 02:18
Going back and forth with Kevin Cross about the best way to store a fair amount of data and we ended up agreeing that a .zip file was the best way to go.
However images are the currency of the new internet age and sharing them is only a touch away for most users.
So i had a play around with it and found that i could store some 107K of data by zipping it and storing it in a 94x94 image (35kb)
Not much of a saving but very very portable in this day and age.
Anyway, here it is if anyone wants to use it;

Sample of a generated image;


Project is attached. Note that it is not very robust


Added a "No alpha" encoder (500k+ data in this image)

Attachments

Login to view attachments
Kevin Cross
20
Years of Service
User Offline
Joined: 15th Nov 2003
Location: London, UK
Posted: 15th Dec 2020 08:09 Edited at: 15th Dec 2020 08:14
Cool. Haven't tried this yet, but wanted to say quickly that while it might not be much of a saving the biggest benefit here over a zip file is that one user can share this with ShareFile(), and because it is an image other users can load this into their app from their mobile device gallery, and the app can convert it back to data.

You can't do this with a zip file on mobile because from what I can tell AppGameKit doesn't let a user browse file directories on their mobile device. They only have access to their gallery and zip files aren't in their gallery. That first user would have to upload that zip file to a forum, github, cloud drive, or to their own website for others to be able to get that zip file into their copy of the app, and view/use the data contained in it (on a mobile)

This is where the single image wins over a zip file!

Thanks for sharing. I'll have a look at it later on tonight and will test it with some large json files saved within the image.
OryUI - A WIP AGK2 UI Framework
Xaby
FPSC Reloaded TGC Backer
17
Years of Service
User Offline
Joined: 17th Apr 2007
Location: Berlin
Posted: 15th Dec 2020 19:31
I wrote something about data storage in my Bachelor Thesis. Also had a case study about that.
You could use RGB PNG, but have to make sure that your ALPHA channel would stay 100% visable.
Also Tumblr was nearly the only image hosting website that didn't changed any PNG back in 2017 or so, when I made that study.
You couldn't use PNGs in Facebook, they would recompress them to JPEGs.

I wanted to figure out a way how to export data from a Nintendo Switch, Because you only would have 1280 x 720 Pixel for Screenshots and they are stored in compressed JPEG. So that would be also a problem.

7Zip is a good compression and even if the PNG would not be compressed, you wold have your 7Zip-File inside.
But PNG is also compressed nearly like ZIP, so I guess, you could gave it a try without "pre"-zipping before.

The benefit of the PNG file with using RGB+complete Alpha would be, you have a small file that is ZIPed and could be created via SAVE-PNG and also be Loaded into a MEMBLOCK and would be nearly uncompressed there.
But would take 25% space, because you can't use the ALPHA Channel.

But the implementation would not that hard.

Xaby
FPSC Reloaded TGC Backer
17
Years of Service
User Offline
Joined: 17th Apr 2007
Location: Berlin
Posted: 15th Dec 2020 19:37
Also if you are using PNG, you could also attach directly the data itself. That is the way Fireworks and some other programs save there files.
I guess, APNG does it nearly the same way. In a JPEG the MetaData would be interesting. But in most cases you don't know what the platform does with your files.
If they check them for viruses or something like that, they would trunc these metadatas or attached files. Of if they make compression you are also lost.

You could try to send you PNG to TinyPNG and after it was compressed, look, if the file is still "readable". I guess, you should use only some specific colors and also try to implement recovering data.
But than you maybe would end up with something like a Black-And-White-QR-Code
blink0k
Moderator
11
Years of Service
User Offline
Joined: 22nd Feb 2013
Location: the land of oz
Posted: 15th Dec 2020 20:24 Edited at: 15th Dec 2020 20:29
@kevin That's what i thought. Sharing images is ubiquitous! Everybody knows how to share a photo right?
@xaby if you look at the code it compresses the data to a zip file and then encodes it in a .png and using the alpha channel isn't a problem
Xaby
FPSC Reloaded TGC Backer
17
Years of Service
User Offline
Joined: 17th Apr 2007
Location: Berlin
Posted: 16th Dec 2020 00:05
Why wouldn't it be a problem?
from what I see in your code you are doing exactly that. Or do I miss something? So I have to ask, what is, if the alpha has the value = 0? Now we are saving the PNG?
Also R, G, and B are now 0, even if your memblock before would have had some other values in it.
At least that is how mostly the PNG compression would handle that.
blink0k
Moderator
11
Years of Service
User Offline
Joined: 22nd Feb 2013
Location: the land of oz
Posted: 16th Dec 2020 00:22
Quote: "You could use RGB PNG, but have to make sure that your ALPHA channel would stay 100% visable."

I'm am also using the ALPHA channel to store data.
Xaby
FPSC Reloaded TGC Backer
17
Years of Service
User Offline
Joined: 17th Apr 2007
Location: Berlin
Posted: 16th Dec 2020 00:37 Edited at: 16th Dec 2020 00:43
Yeah. I see. And I am wondering, why it works Maybe PureBasic e.g. uses another PNGLib then AGK. Back a few years I made exactly what you have done and after compression the PNG I had a data-lost, because the PNG compression made sure that if the alpha channel is zero, it makes no sense to have the other values saved.
Because you wouldn't see that pixel anyway. So I had to make sure to convert the data before or don't use the alpha channel in a way you do it.
I am glad to see, that it works. But also wondering, what will happen, if we save that PNG again in another program like Photoshop.

Mostly other programs will compress it. And my try to save the PNG again with PhotoShop changed the filesize. So I guess, it would have data loss.

Great work. Nice code.
blink0k
Moderator
11
Years of Service
User Offline
Joined: 22nd Feb 2013
Location: the land of oz
Posted: 16th Dec 2020 01:25 Edited at: 16th Dec 2020 03:38
@xaby. I will have to check that out. It may make sense to be on the safe side there

I updated it to include a header. This image contains 500k+ data


So the idea is the header defines how wide the image will be. The Compression just adds rows until it has exhausted all the data
So the idea would be more data = wider header. I guess you could do that on the fly but i haven't in this instance

UPDATE: ADDED "NO ALPHA" ENCODER IN FIRST POST


It appears that posting on fb/twitter/instagram won't work (Image compression etc)
Posting on discord does work
Both SMS and Messenger do work
Kevin Cross
20
Years of Service
User Offline
Joined: 15th Nov 2003
Location: London, UK
Posted: 16th Dec 2020 09:49 Edited at: 16th Dec 2020 10:13
Just found out that hiding messages inside another is called Steganography and that people do this with images to store level data in them etc. Something I may need to research some more into now.

So with your example you can attach the data a long with a logo? I see the AppGameKit header/logo in the image. That might be a better way to share images rather than just an image with random coloured pixels. I wonder if it would be possible to create an image with a logo, some text, and the random coloured pixel block at the bottom or in one corner etc.? Just so its clearer to the user that's got the image what it is, and they don't just delete it because the image looks curropted/fishy. Some things you'd need on the image all of the time is the app name needed to load the image, and where to get the app from so that it's clearer what to do with the image.

EDIT: Just downloaded the latest version with the image file and it looks promising. I could in theory create an image in the app with a logo, some text created by the user i.e. a title/description about the data, and then attach the zip file data at the bottom. At least then it's more apparent what the image is for.
OryUI - A WIP AGK2 UI Framework
Xaby
FPSC Reloaded TGC Backer
17
Years of Service
User Offline
Joined: 17th Apr 2007
Location: Berlin
Posted: 16th Dec 2020 10:32
Back in 2009, I tried to create something like a MIDI / PNG music program in Scratch.
The idea was, to have saved the notes as pixels. But Scratch only supported weired colors and I would have to convert Bytes into there scheme.

https://scratch.mit.edu/projects/767674/



The idea was, to be able to change the music in any image manipulation software, save it and listen to the changed music
I guess, we maybe could do something like that also in AGK. It is a combination of MIDI and MOD music.
Kevin Cross
20
Years of Service
User Offline
Joined: 15th Nov 2003
Location: London, UK
Posted: 16th Dec 2020 10:35
What did the image look like that you would have shared? The one with the music in it?
OryUI - A WIP AGK2 UI Framework
Xaby
FPSC Reloaded TGC Backer
17
Years of Service
User Offline
Joined: 17th Apr 2007
Location: Berlin
Posted: 16th Dec 2020 11:36 Edited at: 16th Dec 2020 11:38
Yes, the complete part at the buttom. But you could also share only one block.
The idea was, that any block would contain something like a melody or drums. That is why we see pink and cyan.
Also the coding is not really binary, the pixels would contain the length of the note. And the color of the pixel would be the pitch. And every second line would contain instrument and volume.
So a simple decoding would be to only read every second line of such a block and have a standard instrument. So you would get the melody or the beat.
On the beginning of every block also some "sync" data was there. The first block would have to contain "meta-data", so it would be possible to not only have blocks, but a complete song.
Name of the song, and how many blocks combined are the instruments and when a pattern would end or loop.

Let's say a block could contain 3 instruments with there notes or 6 drums. So you could combine 3 blocks in parallel. That would make 6 notes and 6 percussion things at the same time.
Or you would only use drums or only one block of melody, so you could have a song that could contain 3 times more "music", depending on your patterns.

If you would send the image, it would be the best if all the images would have the same size. Also I thought, no matter if it contains music or level-data, it would have to look more like an ID card.

some other layouts for combining these blocks or have seperate instruments or other "editors"



Don't want to hi-jack this thread. The idea was, to have the music in the buttom of the screen. And you could make a screenshot 480 x 360, I believe and import it directly into Scratch and be able to re-play the music.
You could also only use block-parts of it and re-play that as well.

using the music-blocks in a level editor or game, and Pinano-Roll with these blocks.

Also the maximum size is important to be able to upload and show these images directly.

idea, example for other "VST"s that would also create these visual blocks

Attachments

Login to view attachments
Xaby
FPSC Reloaded TGC Backer
17
Years of Service
User Offline
Joined: 17th Apr 2007
Location: Berlin
Posted: 16th Dec 2020 11:52 Edited at: 16th Dec 2020 12:05
@Kevin Cross
something like that, I guess for "Twitter", but that was also the problem, that Twitter would change the data. Also for images JPEG are the better option.
and to be useful, I would have to create a JavaScript music replayer. And maybe also people don't want to gave away there compositions, or would listen to OGG / MP3 streams anyway.



Also it would be very limited. Or you have to integrate also instrument creation like in HVL (Hivley Tracker), or a combination with (Amiga) Module.

Here some of the board tried to make some noise and I was also "talking" about the idea of that composer a bit.
https://forum.thegamecreators.com/thread/218355
Kevin Cross
20
Years of Service
User Offline
Joined: 15th Nov 2003
Location: London, UK
Posted: 16th Dec 2020 12:19
Thanks, that album cover example in your last picture is how I picture BlinkOk's version would be even more useful when sharing images. With the app name and other information it becomes clearer to the end user what they need to do with the image. Yours doesn't tell the user what to do or how to load it though.

I'm going to have to play around with this over the holidays. This seems like the best of both worlds. It allows for zip files with multiple files, and the ability to easily share and load with images, without needing to upload them somewhere first. I'll have to cross the twitter and facebook problems when I come to it, but happy to tell users to not share on those. I read somewhere this morning that you can with Twitter, but you have to tell the user to download the larger version and not the thumbnail version shown in the tweet. Don't know how true this is as I've not tested it. I found it when looking at blog posts where developers were using this method for sharing user created game levels and content.
OryUI - A WIP AGK2 UI Framework
Kevin Cross
20
Years of Service
User Offline
Joined: 15th Nov 2003
Location: London, UK
Posted: 16th Dec 2020 12:38
By the way, this also seems perfect for maybe saving local variables so that the user couldn't easily access the data for their session and change it. In my current app I save data in text files, something as basic as: numberOfKeys=2. Probably not something I'd do again. This was before JSON was added to AGK. It's probably easy for a user with the know how to find those text files on their device and amend them to give themselves more keys, or in a game, more coins. Maybe just as easy to change the json files. Having all of that data saved in a small png would make it harder for the normal user to amend it to give themselves a million coins.
OryUI - A WIP AGK2 UI Framework
Xaby
FPSC Reloaded TGC Backer
17
Years of Service
User Offline
Joined: 17th Apr 2007
Location: Berlin
Posted: 16th Dec 2020 16:45
I also thought about saving save files as images. But that also makes problems if we are looking at the iPhone e.g.
When I used my iPod all images nearly were at the same image library and it would be mixed up with all other taken pictures.
So don't know, if the user experience would be great.

Also I made the music-card up like a mock-up. But it would be possible to add a HTML-Link or another QR code or so.
I guess, something like a link shortener would be a thing as well. (bitly or so)

So I guess, you would also need to establish your own platform. I also saw some websites that share there information in the URL itself.
So some do it like that way: https://onlinesequencer.net/1665485

Complete song in the Link
https://www.beepbox.co/#8n42sbk0l00e0dt2cm0a7g0fj07i0r1o331300T0v0L5u00q0d0fay1ziC2w2c1h6T0v0L2u00q0d0fay0z2C2w3c0h0T0v0L4u00q0d0fay0z2C2w2c0h0T0v0L5u00q0d1fay0z1C0w2c2h6T2v1L4u02q1d1fay0z1C2w0T2v1L4u02q1d1fay0z1C0w0b4zkQdjgRd00id3gQd3gQ018Qd3gQd3g000004zhmu00k8Rozlydm000j4xci4N80p2aZFBMUa2wo6CGKOCGKOCGKiLwo60FGHIFGHIFGHOs50gc1jln9Mk10M5dlsD1g43aMk10OA50McF1gc3FIwEa1FGHIAU61IJwbU6C1GwGGHbrFakwGGXdRRlkzn8RllnlllkRmRRSlQMddRdRJQFj1XE61GAp6iLwGGWqrbrWqp2OKOhFHB8eOSOGMndQ-cADoABsSLE8Fi2ajDWvghiPEO-MyOCFndwhwxbjVTmCR_HhjhUsgQOsgllQO4f9Rildtegx8eoEa89eGgxVwy2o8unxWqDkxY-GGG-lxVeGhxWXK1g-ankRRTlRRnlnmxkY-VvA1dBUlyq_CFTTfUg2qDGJd7OCLWA_vsCPJ5dAq7wFkWXEs43KE2ChA9jI2WuvsLA0Xa0VIL27oU2GsR_tlte-V_Xkw7djYBQ1leqfKGsR_DaOC9--4oLXh5oF0iKReoHFRTgW94HTp02LanDsVDq7HitclditkCz9jnEiqYgSIH9OsKXNqqB2SkQruiAmSyyz9EWD9PYzRekClz9WLdjejhhBp0q2__pHi7rhhhhhjjJ0FGn-VwKpOWcB8JR556jPZ57yqAPLQk9GiGeoLjaNPCrhhCmkQqavav6aeE1jejhnhhTd2prqaa2Cz0iewzE8W2ewzE8W2ewzQ4t17ghFB8EEEO2ewzE8W2fghQ4t16CsyyywDO2ewzE8M0

so maybe that could be a thing. And in Twitter that would be like that: https://twitter.com/beepboxco
Kevin Cross
20
Years of Service
User Offline
Joined: 15th Nov 2003
Location: London, UK
Posted: 16th Dec 2020 17:28
For what I want to do next its important that users share files themselves and it isn't relying on URLs that all go to one server where they can get the relevant data. I believe that's what you're suggesting. I already do this with ChastiKey. Users share URLs which loads the users shared content in the app i.e. https://chastikey.com/sharedlock/7JAWFWX7JJ28MWU

If they have the app installed and press open in ChastiKey button on the web page it will access the server and database and the user will get the data behind that lock.

That ideally would be the best way to do what I want to do next but there are legal reasons why it wouldn't be suitable for my next app idea.
OryUI - A WIP AGK2 UI Framework
blink0k
Moderator
11
Years of Service
User Offline
Joined: 22nd Feb 2013
Location: the land of oz
Posted: 17th Dec 2020 01:36
Something like this maybe;
Virtual Nomad
Moderator
18
Years of Service
Recently Online
Joined: 14th Dec 2005
Location: SF Bay Area, USA
Posted: 17th Dec 2020 03:45 Edited at: 17th Dec 2020 03:46
THIS is interesting where i believe all images with any "extra data" inside could look identical?
the steps there aren't practical as it advises "winrar and a windows command line required" but whatever mechanics are behind it could be.
i expect the file/image would be considerably larger than necessary but it would look a lot more "professional" and even double the kb would be worth it, IMHO.
[My Itch.io Home] [Now Playing]
[AGK Resource Directory] [TGC @ GitHub]
[CODE lang=AGK] YOUR CODE HERE [/CODE]
[VIDEO=youtube] VIDEO ID [/VIDEO]
[Google Forum Search]
blink0k
Moderator
11
Years of Service
User Offline
Joined: 22nd Feb 2013
Location: the land of oz
Posted: 17th Dec 2020 03:50
Some technical details
It looks like a good idea for low volume data but in this case, where it's 100k+ compressed, the image would be too large i think

Login to post a reply

Server time is: 2024-04-19 15:48:17
Your offset time is: 2024-04-19 15:48:17