Sticker.js – js lib for creating Sticker Effect

Sticker.js
Sticker.js is a Javascript library that allows you to create a Sticker Effect. Good thing with this libraty is that there is no dependency on any other libraries link jQuery. So, this can be used independently. It is released under MIT License. Inspiration for this project came from
Sanghee Cho’s Heroes Project. Continue reading “Sticker.js – js lib for creating Sticker Effect”

Typing effect mimicking human behavior using TheatreJS

TheaterJS is a typing effect mimicking human behavior. This is an open source project and hosted on GitHub. Everything that is in this is demonstrated and explained in this codepen. The demo is also available on the TheaterJS page.
Usage:

var theater = new TheaterJS();
  theater
    .describe("Vader", .8, "#vader")
    .describe("Luke", .6, "#luke");
  theater
    .write("Vader:Luke.", 600)
    .write("Luke:What?", 400)
    .write("Vader:I am...", 400, " your father.");
  theater
    .on("say:start, erase:start", function () {
      // add blinking caret
    })
    .on("say:end, erase:end", function () {
      // remove blinking caret
    })
    .on("*", function () {
      // do something
    });

Documentation – https://github.com/Zhouzi/TheaterJS#documentation
GitHub – https://github.com/Zhouzi/TheaterJS

Using Array.prototype.filter() with arguments

In JavaScript, the filter() method is used to search for array items which satisfy the condition that is passed to it. Technically this method creates a new array with all elements that pass the test implemented by the provided function. But there is a confusion around how to use it with arguments. For example, we want to search for an employee with id = 101 in an array of employee objects.
Let us see the typical use of Array.prototype.filter().
function isBigEnough(element) {
return element >= 10;
}
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44]

Now, we shall see how to implement it with arguments.

function GetEmployee(EmpId) {
    return function(element) {
        if(element.ID === EmpId)
        {
             return element;
        }
    }
}
employeeArray.filter(GetEmployee(101));

Simple, yet useful tip. Happy Coding!

Resources: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/filter

Hello.js – A JavaScript SDK for Authentication

Hello.js is a client-side Javascript SDK for authenticating with OAuth2 (and OAuth1 with a oauth proxy) web services and querying their REST API’s. HelloJS standardizes paths and responses to common API’s like Google Data Services, Facebook Graph and Windows Live Connect. It’s modular, so that list is growing. No more spaghetti code!

Hello.js

Homepage: http://adodson.com/hello.js/#hellojs
GitHub: https://github.com/MrSwitch/hello.js

How to know what HTML5 tags can I use?

While working with HTML5, its quite common to get a doubt about what tags can we use and which tags are implemented/supported by which browsers. Isn’t it cool if we have a tool to provide tag name and get the supported browsers along with their versions? Such tool is Can I Use

caniuse.com is very handy tool to HTML5 developers to check the new tags based on the browsers they mainly target until HTML5 is finalized.