Social app update

Well, I finally got my search and my sorting figured out in the Firebase data. So, not I can show the latest info and allow searching that info as well.

My other concern is that the OpenFB doesn’t seem to be working on devices, only in the simulator as well as on the PhoneGap dev app, which I believe uses the local address which is why it could be working. My best guess at this point is that its an issue with the Auth Urls on the Facebook site, but as the buttons don’t seem to respond at all it certainly could be something in the code. As I am using Firebase anyway I will be looking at the Facebook integration there as well…

Ionic, Angular and Firebase

I have been looking for a backend for my app development and have come to the conclusion that Firebase is going to be the best choice for cost and features.

I have implemented Firebase in a social media style app I am doing and it is working very well using angularFire samples. I had a bit of an issue working with the database in separate views of the app but I think I have that figured out now. I actually had to ref the firebase database in each controller. Not sure if this is the best way to do it, but its working well.

I am using the OpenFB js to implement the sharing features, it seems to be working very well on my test device. I will probably touch more on OpenFB in a future post as it seems pretty easy to use and I think a lot of people would like to learn more about it.

Stay tuned for when I announce the app!

Ionic and AngularJS Timer App

As I work on several projects I figured maybe a timer app that I could add new projects, put in a time and have it alert me when its over. So I started with the very good sample code here: http://goo.gl/DJR0En from siddii and was easily able to adapt the array of jobs to include a bit of editing as well as adding a stop and remove button. I bumped up the interface a bit using Ionic Cards. But, I feel the interface could be better. Maybe swipe cards for each timer, a little animation etc.  Not too bad for the few hours I put in to learn Ionic and AngularJS.

The video of the app in action can be seen here: http://youtu.be/8KX8pa-dtZs

Angluar-timer / Ionic Test

So I recently found this timer for angular: https://github.com/siddii/angular-timer

I decided to play around with it with some of the samples and it looks very intriguing if you need a timer function. Here are a couple of the samples:

http://siddii.github.io/angular-timer/

Why do I bring this up? Being an independent developer I thought it might be neat to create a simple count down timer to split my time on my current projects. So my idea is to just implement this into a project timer. Ok, I know there are tons of timers out there that I could probably use. And, I have even done timers in Javascript that would probably be just as easy. But, as I focus on learning more Ionic and AngularJS I thought this would be a good opportunity to do that.

After all learning how to do the same things in different ways can expand our knowledge base on the technologies and I think focusing on implementing something you have a good understanding of, like in this case how to create a timer, will make it easier to learn. To paraphrase the old saying, who wants to learn just one way to skin a cat.

var brandon.mood = {{happy.coder}};

Ionic – Facebook and Pull-to-Refresh

Ok, added two new features to the demo app. I implemented a Facebook login and sharing using the OpenFB library.

https://github.com/ccoenraets/OpenFB

I also added a Pull to Refresh feature for one of the pages using the sample from Ionic

Actually the implementation was very easy, but since I still haven’t figured out what I am using for the back end its all show right now. But I am thinking it will be pretty easy to add my data refresher to the that function.

Delete Friend added!

I was pretty surprised that adding the delete friend feature didn’t take all that long this morning. I had to do two things.

The first was to get the app not to use the default friend id number as this was being assigned as the next one in the list depending on the array length. This becomes a problem when you want to delete something based on it. If you have 5 items and delete number three, based on the length alone you will have a duplicate. I manage to drop the id all together. I had to change the ng-repeat track by to the name, so I can assume I will have to add some checking to make sure the end user does not use a duplicate name. But for now this works well.

The second thing I had to do was to use the index of the list to delete from the array. Turned out to be easier that I thought. In the href I was able to simply use {{$index}}, this is scoped to the list so it passes the index that is clicked on. As the code that was already in there sets the parameter I just used that in the array splice call.

Just a note, if you have ran this before you may need to delete you local storage as the previous one still used the ID variable.

http://cincyplanet.com/ionic/

More Ionic

So, playing around with Ionic a bit more I decided to pull the initial data from the server and then store that onto the device using local storage, a technique I have used a lot in the past. It worked well except for a problem when using the ng-repeat. It seems that angular adds a hash key to the array to keep track of them The problem was when reading this back from local storage it had a repeating key, which broke the repeater. After much searching on removing these to no avail I finally found out how to stop it. In the hg-repeat you have to add a ‘track by ‘ that angular can use to keep track of the repeater. This allowed it to stop adding the hash key and breaking the app.

You can see the current result here: http://cincyplanet.com/ionic

It loads the first time from the server. Then saves that to local storage. This allows you to add new friends and save them on the device. Currently you cannot delete a friend. This is due to using the Ionic template set us to read the id number that has to correspond to the array position. I plan to change this to allow deleting of the friends, just not sure the best way to do it as of this writing.

Been a while

It’s been a while since I’ve posted so I thought I would share a bit of what I’ve been up to.

I’ve been working in MyEclipse using the Ionic framework. It does have a bit of a learning curve, but seems to be well worth it. I was able to modify one of the sample projects that uses their tabs, add a slider and a little data modifying to the sample. Certainly something I will focus on more in the future.