This post is intended to assist folks who are trying to install and work with grunt on mac osx
First, install Homebrew by typing in the following command ruby -e “$(curl -fsSL https://raw.github.com/Homebrew/homebrew/go/install)"
Then, type in brew update to ensure your Homebrew is up to date.
brew update
Run
brew doctor
to make sure your system is all good.
Follow any other recommendations from brew doctor.
This is second part of the tutorial about getting started with Raphael.js. To see this first part go here.
Some code first ;)
var canvas = Raphael(0, 0, 250, 250 );
var t1 = canvas.text(50, 50, *"Some text Goes here"*);
var t2 = canvas.text(60,90,"First line \n Second Line \n Third line");
var t3 = canvas.text(214, 140, "1079").attr({"text-anchor":"middle",'font-size':16,"font-family":"arial","fill":"#fff"});
In the above examples canvas.text will create a simple text element at 50,50. Strangely VML /SVG do not have Line breaks therefore the programmer is responsible for creating new lines,in most cases appending** ‘\n’** does the trick.
This post is probably out too late ,as almost all IDE’s these days (which support android development) ,probably have an Integrated release signing or debug signing utility/wizard built in, but if somebody is using an old IDE or perhaps want to integrate release in a CI(continues integration) environment , this tutorial might come in handy.
Basically one has to sign an apk either with a debug key (which is generally present in your .android folder) or a create a fresh application specific keystore , to know more go here
Raphael.JS is a SVG/VML library which helps you to create quick vector shapes and images. Its very small and compact (only 86kb),easy to use,well documented and works in all browsers and yes even IE. Here is a list of all major browsers this library works on: Chrome 5.0+ Firefox 3.0+, Safari 3.0+, Opera 9.5+ and Internet Explorer 6.0+
,finally its distributed under MIT license. In this tutorial ,I intend to introduce basics of this library and help you get started.
I love JavaScript and code a lot in it .Since I code, I also encounter problems and bugs from time to time and therefore need a Debugger and a debug mechanism to view whats going on.
In good old days when I learned this language, I used JavaScript’s inbuilt alert mechanism to view the value of a variable or a property of an object. This was a terrible mechanism, calling alert was blocking, one had to press OK to continue and if you had to take a look inside an array then well it was emotionally an overwhelming task is all I would say here.
When I first started web programming, creating a center aligned div was one of the most common task that I saw myself doing.
since div is a block element, i.e. it takes up the full width available, and has a line break before and after it, it can easily be centered using relative styling
{
margin-left:auto;
margin-right:auto;
width:70%;
background-color:#b0e0e6;
}
However lately I have preferred using absolute positioning technique over relative, this works for all browsers and is best for login screens or alert messages over a translucent shim.
Web.py has been one of my favorite web frameworks as its pretty easy to get cracking on it.
It’s super quick to install and one can come up with a prototype and rapid web services in matter of minutes.
If you haven’t configured easy_install on windows, then read this article.
Once easy_install has been configured believe it or not, all you have to do is open a command prompt and type
If one has been using python, then installing various libraries and modules is basically a breeze using easy_install utility, however for folks using windows, easy_install utility has to be setup properly before using it.
First lets make sure that python is properly installed and PYTHON_HOME environment variable is configured:
If not already installed download python installer from here.
After it’s done downloading, double click to run the installer, and select default options (unless you have other custom needs of course ).
This post is basically a way of quick appreciation to the Google maps Team, they are obviously a bunch of caring, loving people ,who make useful (although surreptitious) tools for the betterment of Geek Kind.
So as most of you may have accidently clicked a mysterious looking link at the bottom of your Google maps page ( on the left hand panel)
This awesome looking link opens up a popup which lets you choose wonderful goodies which makes your Google maps page more useful than it already is:
Redis is an open source, advanced key-value store, and is quickly picking up momentum in real-time software development , it is now a well known and trusted product and can be used in various problem scenarios as a No SQL implementation.
Redis is often referred to as a data structure server since keys can contain strings, hashes, lists, sets and sorted sets.
Here is quick guide to Install Redis in Ubuntu 10.04, and it should be similar for higher versions and similar deb environment.
HTML5 WebSockets, defines a full-duplex communication channel that operates through a single socket over the web. WebSocket is not just another incremental enhancement to conventional HTTP communications, it represents a large advance, especially for real-time, event driven web applications.
Normally when a browser visits a web page, an HTTP request is sent to the web server that hosts that page. The web server acknowledges this request and sends back the response. In many cases—for example, for stock prices, news reports, ticket sales, traffic patterns, medical device readings, and so on—the response could be stale by the time the browser renders the page.
Its been a while since my last post, had been busy with office work…sigh!!!
Anyways, I was poking around web to come up with interesting water simulation techniques, as you could see in many games these days, so I did find a reference to an old C-based technique, after little refinement, what I have is a water simulation which uses a very old algorithm based on two heightmaps.
As always it’s a grid based animation which divides the screen into a mesh(more slices better this simulation looks), I use a jagged array in c# to do this (load it with a texture of 640 X 480 dimension ), to animate I use another array of same dimensions, now to make every thing move I kinda do something like this
After ages of constantly being one of the most used browser as well as a serious pain in Butt!!! IE is finally about to mature into something good and perhaps a useful software , with its support to most of the standards being used today , IE will join back the league of web 3.0 browsers, hopefully very soon
So I was going through various experiments done with Canvas and came across a great example on Liquid Particle physics simulation, which amazingly is written in JavaScript and Canvas element, I was so mesmerized by the application that I had to port it to SilverLight, using WritableBitmap.
Here is another of many JavaScript based Image Carousel, I had seen many similar to these made in SilverLight and Flash, I came across a wonderful carousel made in SilverLight sometimes back which was very fluid in behavior and could easily be customized and configured to take various shape and form.
I have managed to port it to JavaScript, it works best on chrome or FF, hope this would be fun to play with.
One of the amazing features of i-phone user interface is smooth panning/scrolling animation.
I-phone “List Scrolling” perhaps gives a very funky and usable List –View to its users and allows them to scroll up and down the interface without any need of a scroll bar.
This interface is sensitive to the push speed and also shows traces of resilience.
I have been experimenting with various techniques to bring out similar effect using JavaScript and HTML, I am not quite sure if this would be useful in its present form but with some modifications may be this sample could prove its worthiness somewhere.
Few days ago I was experimenting with a nifty technique of embedding images in web pages by base64 encoding them first and then using a standard known as Data URI Scheme, which basically defines a method of assigning a ‘src’ of an image tag as a base64 serialized string, like this:
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAUBAMAAACKWYuOAAAAMFBMVEX///92dnZ2dnZ2dnZ2dnZ2dnZ2dnZ2dnZ2dnZ2dnZ2dnZ2dnZ2dnZ2dnZ2dnZ2dnYvD4PNAAAAD3RSTlMAACTkfhvbh3iEewTtxBIFliR3AAAAUklEQVQY02NgIBMwijgKCgrAef5fkHnz/y9E4kn+/4XEE6z/34jEE///A4knev7zAwQv7L8RQk40/7MiggeUQpjJff+zIpINykbIbhFSROIRDQAWUhW2oXLWAQAAAABJRU5ErkJggg==");
Although this technique could save some server round trips, however Microsoft ver. (IE < 8). does not support this scheme even though its a standard, which then makes this technique unfavorable to use as its not cross browser.