Views

I hit a snag but it's okay now!

Written by: OG Jappleng

Developing the Poll / Quiz system was more difficult than I had originally anticipated, and the reason being was because on how I was attempting to go about uploading the data.  (Screenshots of the quiz inside!)



base64 vs original (The compression story)
base64 is essentially the file itself turned into a lossless version. For instance, if you were to upload a jpg as a base64 png, it would be significantly larger in file size but you could at the very least use HTML5 canvas to edit the image before uploading like you could in photoshop. The downside is that unless you write a very complex javascript library to compress the file prior to upload, it will be about 33% larger in file size.

This is how I normally go about doing things for avatars, and smaller image files simply because I want to give the user the option to crop or resize their images. But for the Poll system, the images are not cropped, they remain their original file dimensions and a 1000x1000 image can easily become 7mb in size depending on the complexity of the image. This is why I didn't use this method, because I didn't want it to be a burden for those on mobile or limited bandwidth networks.



Uploading a file with data
This is where I got into a little snag, I thought it would be fairly straightforward to upload a file with an array of other information but it wasn't. Traditionally, Jappleng uses jQuery's POST method to do all of the dirty work, but sometimes that isn't the case. When it came down to uploading a file and other data asynchronously, I couldn't correctly send the file's information. I had to return to AJAX and do it that way but as it turned out I couldn't just upload a file at the same time of sending the other information due to how JSON works.

With plenty of research done, I came to the conclusion that there wasn't enough documentation to explain the situation well for me. So I decided to improvise my own setup. First, the information is passed, and if there's an image attached, it won't finalize the post. If there isn't, the poll will get uploaded immediately. If the image is attached, it sends an OK signal back to the user asking for the file, then if it receives the file, it will continue the process. If it can't continue the process like let's say the user aborted, or there was a security issue it will not publish the poll.

Security is crucial
I'm more of a PHP developer than a Javascript developer, I spend most of my time in PHP and because of that I'm highly in tuned with security. All data that goes through Jappleng's CMS / Web engine ends up getting thoroughly scanned for any openings. Images also get dissected for malicious code and it gets really crazy.



Moving forward
Now I have a nifty poll system ready to be used for Club Jappleng! It took 2 1/2-days to develop and it was more complicated than it should have been. The code can be re-used (mostly) to create club Quizzes which will come in a bit. For now I will finalize a few more things on the poll system and move on to the Wiki.