Search This Blog

Thursday, September 6, 2012

HTML 5 gaming

Few people around me were working with HTML 5. After seeing those cool stuffs it was irresistible to start working in it. Canvas element is the most attractive part of HTML5 according to me. Using it we can develop very cool stuffs like animations and games!
I decided to develop a game. I was playing Road Fighter ( classic nes game, which makes me nostalgic whenever i play it now ) yesterday night. So i thought of developing a similar game.
Games require lot of intelligent coding. I was introduced to game development basics by a colleague. So i don't use while(1) for looping infinitely anymore.
I started of with a simple gameloop for which i set an interval of 1000/60 . Which means the loop runs again and again after 1000/60 milliseconds. (ie)  1/60th of a second. This gives us 60 frames per second speed in which our game runs.
Inside the game loop i called functions to drawlines and then clear the canvas.
By drawing lines vertically and moving it down for every loop i had a road movement like effect.
Next i placed mycar at the bottom of the canvas.
Used jquery to capture key press and moved the car left and right based on keys i press.
Finally made another car to come in opposite direction.
Still lot of things left to be complete, but before moving any further i thought of refactoring my code.
At this point i came across requestAnimFrame function which gives smooth animations in html5.
It took some time to figure out how to use the Animation frame. It works like this, our gameloop has to be given as a callback function to the requestAnimFrame event of windows. Inside the function which gets called when we request a animation frame, we setInterval of 60fps and call our gameloop after getting a new animation frame each time. I don't know how exactly it speeds up my animation/game. But i will research and tell you soon.
Stay in touch. See you in next blog.

Cows and Bulls : back to JavaScript

No ROR today. My aim for the day was to develop cows and bulls game. Sadly many friends of mine didn't know about the game! Its a very popular time pass game in school.

http://en.wikipedia.org/wiki/Bulls_and_cows

check this link to know the rules of the game :)

What i did is basically a word game. The word to be guessed correctly can be a 3 or 4 or 5 letter word . User's can adjust word length.
So the major problem here is , the words chosen by computer and words given by users as guess should be all proper English words.
To solve this problem,

  • i downloaded a text file containing all dictionary words
  • made a new file containing words of length only from 3 to 6 using grep command
  • from inside the webpage sent a xmlhttp request (AJAX request) to the local file
  • fetched the words and loaded them into array
  • used this array to check if the word entered by user is a proper english word
The solution worked perfectly on Firefox. Chrome didn't allow AJAX request to be sent to some local file. Seems like they are strict with security issues associated with accessing resources in local system.
I have to find some workaround for making the game work in Chrome.

To add more spice to the game, i implemented a scratch pad kind of thing ( using tables) which has all 26 English alphabets. Users can mark them red/green so that they can easily track what alphabets are rejected(red) and what alphabets are present(green).

It looked like a small application when i started coding. But it took one full day to fix all bugs and make it work smoothly in a user friendly way.Wrote the game from scratch using pure JS and html.
I shall share the code with you soon.
See you in next post with more interesting applications :)

Tuesday, September 4, 2012

ROR strong and steady


My experience:
Today opened my project again and decided to do a bit of refactoring. The command
rake routes
was very helpful. I saw the route name there and modified my redirect to statements. Code became more readable and clear.
Then came the devise problem. Controller of devise was nowhere to be seen ! After sign out i wanted users to be redirected to home page. But how do i do it without the controllers of devise. (for those who don't know devise,.. its a gem which helps in implementing authentication in your application) After a bit of googling i found that everything i needed to know about devise is in wiki page of devise in github itself!
by implementing the following private method in application_controller i was able to control the redirection.


  def after_sign_out_path_for(users)
    home_path
  end


in routes i have written this,
 get "/home/index", :to=>"home#index", :as=>"home" 
so everything works nicely as expected !
after the user signs out , action: index of controller: home is called.




Monday, September 3, 2012

ROR more concepts

Control over caching:
ActiveRecord comes in handy for doing lot of operations on associated tables and models.
For example, consider the following scenario

class Person <ActiveRecord::Base

    has_many: accounts
end

class Account <ActiveRecord::Base

   belongs_to: person
end

in the above case , the following association is made,

a person has many accounts and each account belongs to one person.

This association creates many methods automatically with the help of meta programming!
one such method is 'accounts',a instance method for Person class.
we can do,
@person1.accounts
this will fetch all accounts of person1.
next we do,
@person1.accounts.size
this will tell number of accounts of person1. Normally people would expect that the above statement will run some query again to find the size. But its not the case. During first statement itself @person.accounts is cached. Next time when we do, @person.accounts.size the cached copy is only used, thus saving lot of time !
What if we specifically require to fire a new query for finding size (since some other application could have changed the database in meantime). There is a way to achieve it.
@person.accounts(true).size
will fetch the current size after executing a new query instead of using cached version of orders.

My experience today:
Probably many might not have heard about collaborative story writing . There are few websites for the purpose though. It means user's registered in the website can start writing a story and also contribute to  stories written by other users. I took up this application for learning Rails. Today is my first day. I implemented sign up,sign in and other authentication stuffs using devise gem.
Its a very neat and efficient gem for doing all sort of functionality like "forgot password" , "remember me" etc..
I designed the basic schema of my application and started coding.
I implemented "edit profile" functionality for users. It would seem very less for a day. But as i mentioned in my previous post learning curve of rails is very steep. I will be able to speed up once i get hold of Rails :)
See you in next post with more interesting stuffs! stay in touch.