Posts Tagged ‘Web Development’

PHP unexplainable errors on line 1

Posted in Programing, Web Development on September 25th, 2014 by Jarred – Comments Off on PHP unexplainable errors on line 1

Just throwing this out there for anyone who might be experiencing some crazy PHP errors that don’t make any sense. I have been away from PHP for a while but started working on little project that requires a php back-end. But, right from the get-go I was getting some really simple errors that I knew could not be the issue (such as “unexpected end of file” or simple syntax errors for unexpected strings etc.) At first I thought it might be that I was just a little rusty on the php syntax, but could not figure out what was going on and could not get anything to work. The files I was working with were extremely small and it was obvious the syntax was correct, but the weird errors were persisting. Thing was they were were all occurring at line 1, which was puzzling at the time, but I didn’t give it much thought (which should have been a huge red flag to me). So, it turns out my editor of choice (Notepad++) was only inserting a CR (carriage return) and not the full CRLF (carriage return line feed) not quite sure why this behavior was happening (or why PHP engine could not figue it out), but as soon as I replaced the CRs with CRLFs everything started working as expected. I did not investigate this all the way, but I am assuming this probably has something to do with how my host has PHP configured or something simple like that, but for the uninitiated this can really perplexing (and incredibly frustrating). So, the take away here is if you are having some unexplainable PHP errors that are all occurring on line one, maybe check out what you are using for your EOL (end of line) characters and see if that is the issue.

Transit – CSS transformations plug-in for jQuery

Posted in Web Development on September 15th, 2014 by Jarred – Comments Off on Transit – CSS transformations plug-in for jQuery

I came across a little jquery plug-in that I found quite nifty and thought it deserved a shout out. The plug-in is called Transit and can be found here: The plug-in not only makes css transformations a breeze the end animations produced are incredibly smooth. It is very simple and straightforward to use. Anybody already familiar with jquery .animate() will be able to pick it up with little or no effort. As of version 0.9.12 the minified file is only about 8kb. I built a little game using the plug-in (game to be released publicly in a post to come) and was very pleased with the outcome. I really couldn’t be more happy with the the whole thing with the and figured I would little post it here so A: I can remember it personally and also B: give the project a bit of love so hopefully development will continue.

Jquery click not binding to checkbox (or any other element)

Posted in Geekdom, Programing, Web Development on January 24th, 2014 by Jarred – Comments Off on Jquery click not binding to checkbox (or any other element)

I am just writing this down for the sake of my own personal sanity. I just spent way too much time trying to trouble shoot why I could not bind a click event to a checkboxes in jquery. This post here gave me a clue what I was doing wrong. If by chance you are having a similar issue make sure that the element you are trying to bind to is already created and part of the DOM or it will not work and you will be left befuddled why exactly nothing is happening (at least I was).

CSS3 Gradient Generator Tool

Posted in Geekdom, Web Development on November 6th, 2013 by Jarred – Comments Off on CSS3 Gradient Generator Tool

For my next project I am working on achieving a web 2.0 look/feel and wanted to include shadows and gradients. I came across a css gradient generator tool that I absolutely love and made my life easier so I thought I would post it here really quick. You can find it here:

Reflections upon my last project

Posted in Entrepreneurship, Programing, Web Development on August 24th, 2013 by Jarred – Comments Off on Reflections upon my last project

So, I have come to the realization that I may not have the best ability to pick projects that end up being significant sources of income. In light of this realization, a few months ago I decided it was time to try and to a few “speed” projects rather than invest monumental amounts of time on a single project that more than likely will have lackluster resulted. While in theory this idea seems to make sense, in practice I am afraid once again I fell short of the mark.


While trying to find some decent rates for a personal HSA (health savings accounts) accounts, I found that useful online resources were few and far between. I decided that this might be a perfect niche opportunity to not only track and compare the interest rates offered by different custodians (something I was doing anyways), but also hopefully create a quick little site that others would find useful. I imagined the adsense keywords related to a health savings account site would be higher paying and the structure/layout of the site could be extremely simple and easy. All in all I judged it would be a lightning quick sprint of a project that would have some income generating potential.


I judged wrong (at least on the “lightning quick sprint of a project “ part). If you like, take a look at it here: While I am extremely happy with the final product, I logged about 66 hours so far getting it up and running. I started out using a Google doc spreadsheet as the database as I believed this would be fairly easy to maintain. Realizing that the maintenance of such a site would be significant, as an afterthought I decided to try and integrate with Amazon Mechanical Turk to try and crowdsource a lot of the nitty gritty upkeep. But I failed to account for how long this integration would take, and then how much I actually would have to pay to get the quality upkeep I was looking for. So, in the end, after taking all the time to integrate, I decided that the original spreadsheet idea was a much better idea and switched back (of course I deleted most of the previous versions so I had to rewrite much of it from scratch again). This took much longer than expected. In short, some of the takeaway lessons from the project are: I need to do a better job planning out my projects from the get go, and also I need to keep all of the past revisions (even if I don’t think I am going to end up re-using them).


So despite being disappointed by the much longer than expected time frame, I think the site turned out looking pretty good and could be quite useful for anyone looking to compare rates on HSA account. If by any chance you are looking for for a HSA account check the site out here: HSA Rates  As of yet there is next to no traffic to the site and of course this means as of yet it has not produced any real income. I am hopeful however that as the site gets indexed and gets some backlinks it will help improve income rate and bring me closer to my goal.

Remove an Element with a Relative Position from the Normal Flow of a Web Page

Posted in Programing, Web Development on March 8th, 2013 by Jarred – Comments Off on Remove an Element with a Relative Position from the Normal Flow of a Web Page

Here is a nifty little trick I found on a post from StackOverflow. I usually prefer to “relatively” position elements in my pages so that I can have a more fluid designs. However relatively positioned elements are not taken out of the normal flow of the document and so often I am left with a big ugly blank space where they would normally be found. This can lead to all sorts of issues especially when you try and relatively position every element thereafter to cover the ever growing blank spaces. Here is a novel solution that will create a 0 height 0 width pseudo-relative element to wrap around a absolutely positioned element to give you a relative reference point that will not leave that dreaded big blank space.

<div style=”position: relative; width: 0; height: 0″>
<div style=”position: absolute; left: 100px; top: 100px”>
Hi there, I’m 100px offset from where I ought to be, from the top and left.

Taken From:

Getting the back button to work with Backbone and jquery mobile

Posted in Programing, Web Development on January 3rd, 2013 by Jarred – Comments Off on Getting the back button to work with Backbone and jquery mobile

I was getting some strange errors in my app when trying to get the back button to work with the pushState history provided by Backbone.js. I was getting this error: Uncaught TypeError: Cannot call method ‘replace’ of undefined I suspected it was a conflict between the “routing” systems provided by jquery mobile and the backbone frameworks. In my search to figure out how to make it work I came across this post here The solution presented in the article however did not work for my as apparently (unknown to me) I was using some of the features that were being disabled. To solve my issues I pared down what the article suggested I disable and then just inserted the code into script tags right after I loaded all the frameworks. I now have a functioning back button in my hybrid jquery mobile/backbone app.

$.mobile.hashListeningEnabled = false;
$.mobile.pushStateEnabled = false;

Combining JSON objects from the google datastore problems

Posted in Geekdom, Programing on December 10th, 2012 by Jarred – Comments Off on Combining JSON objects from the google datastore problems

So, here is the story: I have two different JSON objects stored as strings in the google app engine datastore. I have been trying to fetch both of the two JSON object in a single ajax call in an attempt to reduce the number of request made to the server which hopefully will make my application more efficient/quick. However It took me a great deal of time to figure out exactly how to merge / combine the two different JSON objects into a single object server side for ajax transfer over to the client. I kept on getting JSON validation errors even though the code looked perfectly good to me. Even worse the online JSON validators would tell me that there was an unexpected character, but they would either not tell me where it was, or the location they specified was perfectly valid JSON. So, eventually I figured out my problem (at least one of them); I was encoding (unwittingly) the objects in the datastore as UTF-8 with the “byte order mark” which was causing validation errors when I tried to merge the two object. Once I encoded the files that were creating my datastore object without the byte order mark, they successfully merged into a unified JSON object that I was able to pass via ajax and successfully parse.

In case anyone is wondering (or I have to figure out how to do it again), here is the way I combined the two python JSON objects server-side:

combinedObject = { 'obj1' : dataObj1, 'obj2' : dataObj2 }

However, for some reason (as of yet I do not fully understand) I have to call the JSON.parse on both the parent object and then child objects in order to get the objects correctly parsed into javascript.

EDIT: Another note regarding unexpected character errors when trying to parse JSON: I was pasting in formatted and what I thought was validated data from one of the many online tools, however I think I was also inadvertently pasting in hidden characters which was causing all sorts of confusion and problems. Another thing you might want to check this if you are having parsing errors.

Google Chart Tools

Posted in Web Development on August 2nd, 2012 by Jarred – Comments Off on Google Chart Tools

So, I have been using the Highcharts JavaScript API to draw the income charts on this site. I spent a lot of time figuring them out and I really really liked how the high-charts looked on my site. However, the free version just did not offer very good ways to display really dense data sets. My experiment has been going on long enough that the charts were getting unreadable and cluttered and so I went searching for free alternative charting API that had scroll bars and could better handle dense data. I found out about Google Chart Tools and really liked them. They are the charts you can currently find on my site are the ones documented here. It did take me several hours to figure everything out but all in all I highly recommend them if you are looking for a free charting API and need to display dense data.

More free animated explosions on transparent backgrounds

Posted in Geekdom, Web Development on March 2nd, 2012 by Jarred – Comments Off on More free animated explosions on transparent backgrounds

I don’t really know why or how but for some reason the single post on my blog that has received the most traffic has been my post back in 7/11 titled “free Animated explosion on transparent background. This does seem a bit strange to me as it really is not all that relevant to the keywords I am trying to target with my blog. Nonetheless, I am currently working on another HTML5 game and have some additional animated explosion sprite sheets and am going to post there here as kind of an experiment to see what happens.  You can save them by right click – save image as.

explosion with transparent background

Free animated explosion

Free animated explosion small

Free animated explosion small

I did not draw these, I simply re-sized them and removed the background. They are saved in .png format and have a transparent background making them perfect for use as a sprite sheet in a game. You are free to use them in any way you see fit. I got the original files from

If you are looking for some more free animated sprite sheets I highly recommend you take a look around all the things Lostgarden has to offer. There are a lot of free to use pixel art animations including several other explosions. They do not however have transparent backgrounds so you will have to edit them out yourself.