Pushing Subfolder to Heroku

At first, our project was built in the root folder, which get pushed/deployed to Heroku without any issue. But after we have re-structured the folders (due to unit testing), we have a few issues pushing in anymore.

Issue 1:

Unit testing framework by xolvio as a submodule, cannot be pushed.

 Solution:

Since the unit testing framework is a submodule, we will need to modify the .gitmodules file to change ssh transport URLs to readonly git transport URLs (i.e., from git@github.com:xolvio/rtd.git to git://github.com/xolvio/rtd.git).

***

Issue 2:

Heroku will only look for root folder for deployment, if you need to deploy a subfolder, we only push the subfolder.

Solution:

Note:

For deploying Meteor app, we will add the build pack as below before pushing to heroku

Update:

For whatever reason fail to push, we can always force push with:

 

FB App notification and flow issue

We are currently building a Page Tab on FB for client. The app will have a FANGATE for user to LIKE the page, and proceed for a contest. The contest is using FB api to invite friends of participant. After several testing, we found out the notification is not working! Without too much effort of googling, we know that in order a FB app to send out notification, we have to make sure it is an APP (fig. 1) as one of the platforms.

FB App

Problem solved? No! While we are happy receiving notifications, clicking on them lead us to the App Canvas, which is the FANGATE, but not the Page Tab (App Canvas has no ‘LIKE’ button on it)! Our faces turned green! How could that happen? Obviously, it was because FB uses the link of the ‘Canvas URL’ as the notification! In order to meet the deadline, we need something quick.

We have a few options to solve this:

  1. Build two different app for the same campaign. Not a great idea.
  2. Put a LIKE button on the FANGATE page. Better, though not fast enough
  3. Redirect the user to the Page Tab. Great! But how?

Quick and dirty solution:

  1. Update the link of the Canvas URLs to http://example.com/redirect/ (FB need this to be a folder)
  2. Create a new directory and one index.html (index.php) as below:

Problem solved. Everyone is happy!

Quirkiness of JS parseFloat()

A client told me that the inventory system we are working on has a bug! He thought it was rounding issue. So, I looked into the issue and found out that it was a small issue caused by parsing a string to float. parseFloat() would stop at “,” (comma) character and return only the parts before the comma!

If you were working on php to spit out the number such as 1,200.00, and thinking parsing it through JavaScript would give you 1200.00 then you might be surprised! It will return 1 instead.

One work around would be removed the ‘,’ before parsing it to float. Such as:

 

 

First day at work!

Couldn’t believe I started working on own company today, from home office! I was supposed to start the day with 6:30am jogging. No, I did not do it not because I am lazy; it’s because we don’t have water!

Why? Got a note from the landlady said breakage of pipe, so she shut off the main water pipe! No way! I couldn’t even have a proper shower if I have gone for jogging!

As chinese men believe water = money. First day of work and we got water shut off? No! I don’t believe in it. Not this small case to block my path to my dream!

Chase for your dream.

Prevent Multiple Event Firing

Sometimes we would like to listen for dynamic element event binding. Let say, we are listening to all either current or future <a> tags. We would do:

Instead we will eventually find out there will be x number of events being registered to the <a>, and the click event will fire x number of times. That is not what we want. I have search the web for help, and encounter a post to solve this problem.

Simply put:

Seems we cant avoid the events being registered but we can filter them out. In order to differentiate from other event, we could add a ‘namespace’ to the event, which just a string will do the job.

:empty pseudo-class

Found it quite useful sometimes, when you need to hide the element when it is empty, use :empty pseudo-class. Like:

Note: A small caveat though, dont expect empty/void elements (such as <br />, <hr />, <img />, <input />) to work since they always match the :empty pseudo-class.