Routing in Ember.js

One of the distinguishing features of Ember is the heavy emphasis it puts on URLs. In many other frameworks, having separate URLs for separate screens is either lacking or is tacked on as an afterthought. In Ember, the router is the component that manages urls and transitions between them. Ember Routing Guides: http://emberjs.com/guides/routing/(link) Ember.Route class details: http://emberjs.com/api/classes/Ember.Route.html(link) Here we will take a look at different ways of adding routes: Dynamic Segments in Routes: A dynamic segment is a portion of a URL that starts with a

Ember Computed Properties

Ember computed property is the most powerful thing ember has and here we are going to get overview of how we can make use of these properties. Ember guides has explained it very nice way, and here I would like to add some more.. Bind property to nested resources Many times we need to depend on nested resources for ex: Find the count of comments or likes for post OR find number of items in cart etc. Here we want to update property as its nested resource is changed. Consider example: here we have property itemCount on cart, which should

Using Selenium IDE

What is selenium IDE: Selenium-IDE (Integrated Development Environment) is a tool that you use to develop your Selenium test cases. It’s a Firefox plug-in. The 'record' button in selenium IDE enables user to record his actions and is a real time saver. Although, many-a-times, due to the external plugins used in our app, we need to manually write scripts or atleast modify the recorded scripts. Why should developers know about selenium IDE? In many of our applications, we have multiple forms and features that require testing/checking whenever we make slightest of change in our code. Selenium IDE provides

CSS and ActionMailer in Rails3.

Lately, I was working on a project where I found an issue that emails sent using ActionMailer were not applying css styles to the html elements of the email. On adding style tag in the email view files, I was able to view stylings on thunderbird mail and ymail but still I was unable to view css stylings for emails in gmail. On furthur investigating the issue, I found that gmail requires inline stylings to be applied to the email templates. I found some gems which could fix this problem by converting external css to inline css. I tried the

Retrieve image dimensions

There are various ways to retrieve when using Carrierwave. They are as follows: Using RMagick gem: class ImageUploader Using ImageMagick gem: class ImageUploader These are pretty good ways to retrieve image dimensions on server-side. It would be much more easier if we could handle it on client-side (JQuery). There could be many ways to do so. Below is the way I adopted in one of the project using FileReader API. $("input[type='file']").live 'change', (e) -> file = this.files[0] reader = new FileReader() img = new Image() reader.onload = (e) -> img.src = e.target.result img.onload = (e) ->

Send notification to flowdock-group from rails application

If you want to send any notification message from your rails application, its easy to send it with following steps: To send notification to your flowdock group, you will need email-address of flowdock grouYou can get it from flow-settings of your group. example: "xxxx@xxxx.flowdock.com" In your application, define mailer class and send email-message to above email. class UserMailer Thanks.

Facebook API versioning

Facebook's Platform supports both versioning and migrations so that app builders can roll out changes over time. Goal of versioning: The goal for having versioning is for developers building apps to be able to understand in advance when an API or SDK might change. They help with web development, but are critical with mobile development because a person using your app on their phone may take a long time to upgrade (or may never upgrade). Faecbook recommends to use graph-api version 2: Older versions of Facebook's API will expire April 30, 2015 and there are some significant changes between the

PRY gem - Smarter replacement to irb

PRY GEM Pry is a powerful alternative to the standard IRB shell for Ruby. It is a REPL (it reads, evaluates, prints, loops). Pry’s advantages over irb are Pry adds additional features such as syntax-highlighting, managing history, Live help system etc. CONFIGURE YOUR RAILS APP TO USE PRY INSTEAD OF IRB: Add this line to your gemfile: gem 'pry-rails', :group => :development then run: bundle install you can go ahead and load the console normally using: rails console Once you have the gem installed, you can enter into a session with pry, by just typing pry in your Terminal. pry

Numeric input in Ember.js

Easy way to create a numeric input, which accepts only numbers (i.e. 0-9 and no other characters). app/components/numeric-input.js import Ember from 'ember'; export default Ember.TextField.extend({ tagName: "input", type: "number", attributeBindings: [ "name", "type", "value", "maxlength", "id" ], keyDown: function(e) { var key = e.charCode || e.keyCode || 0; // allow enter, backspace, tab, delete, numbers, keypad numbers, home, end only. return ( key === 13 || key === 8 || key === 9 || key === 46 || (key >= 35 && key = 48 && key = 96 && key And in your template, call it as {{numeric-input value=mobilePhone name="mobilePhone" id="mobile" maxlength="8" }} As the number input displays up

ActiveSkin gem

ActiveSkin gem provides an easy way to customize Active Admin CSS depending upon your website's color scheme in just few minutes. Steps: 1/ Add to your Gemfile: gem 'active_skin' 2/ Run: bundle install 3/ Add to active_admin.css.scss: //Add the Website's logo. This is displayed on the top-left corner of the page. $skinLogo: url("logo.png") no-repeat 0 0; //This color is applied to buttons, drop-down lists etc. in the AA UI $skinActiveColor: #05B6C7; //Applied to the main header of Active Admin $skinHeaderBck: #000000; //Applied to the header of AA filters. $panelHeaderBck: #000000; @import "active_skin"; Sample