Mobile-Web-App

Saturday, May 19, 2012

How gmail work

Story of Send on Google Green Follow an email on its journey to see what happens when you send a message. Along the way, find out how we minimize our impact on the environment.
http://www.google.com/green/storyofsend

Friday, May 18, 2012

Simple example of RGraph Radar chart

RGraph is a charts library that uses Javascript and HTML5 to draw and supports over twenty different types of charts. Using the new HTML5 canvas tag, RGraph creates these charts inside the web browser using Javascript, meaning quicker pages and less web server load. This leads to smaller page sizes, lower costs and faster websites - everybody wins!

RGraph Radar charts example:

<!DOCTYPE html>
<html>
<head>
<title>RGraph Radar charts example</title>
<script src="http://www.rgraph.net/libraries/RGraph.common.core.js" ></script>
<script src="http://www.rgraph.net/libraries/RGraph.common.context.js" ></script>
<script src="http://www.rgraph.net/libraries/RGraph.common.dynamic.js" ></script>
<script src="http://www.rgraph.net/libraries/RGraph.common.tooltips.js" ></script>
<script src="http://www.rgraph.net/libraries/RGraph.common.key.js" ></script>
<script src="http://www.rgraph.net/libraries/RGraph.radar.js" ></script>

<script>
window.onload = function ()
{
 var radar = new RGraph.Radar('radar_canvas', [10,9,6,6,8,7,7]);
 radar.Set('chart.strokestyle', 'black');
 radar.Set('chart.colors.alpha', 0.5);
 radar.Set('chart.colors', ['blue']);
 radar.Set('chart.key', ['Radar Chart Data']);
 radar.Set('chart.labels', ['Sun', 'Mon', 'Tues', 'Wed', 'Thurs', 'Fri', 'Sat']);
 radar.Draw();
}
</script>

</head>
<body>
<h1>Mobile-Web-App: RGraph Radar charts example</h1>

<canvas id="radar_canvas" width="450" height="300">
Sorry! Canvas not supported on your browser.
</canvas>

</body>
</html>

Thursday, May 17, 2012

jQuery .click() - click event handler

In the following example, if clicked on <p id="clickme">, the click event handlers of both <p id="clickme"> and document will be triggered; if click on any space outside <p id="clickme">, only the event handler of document will be triggered.

<!doctype html>
<head>
 <title>Mobile-Web-App: jQuery .click()</title>
 <meta charset="utf-8">
 <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
 <script>
  $(document).ready(function(){
   $("#clickme").click(function(){
    alert("'clickme' Clicked!");
   });
   
   $(document).click(function(){
    alert("document Clicked!");
   });
  });
 </script>
 
</head>
<body>
<p><b>Mobile-Web-App: jQuery .click()</b></P>
<p id="clickme">Click Me</p>

</body>
</html>

Sunday, May 13, 2012

jQuery .appendTo() - add something on HTML at run-time

Example to add something to HTML at run-time using jQuery .appendTo()

<!doctype html>
<head>
 <title>Mobile-Web-App: jQuery, .attr()</title>
 <meta charset="utf-8">
 <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
 <script type="text/javascript">

  $(document).ready(function(){
  
   $("<p>Add what you want to HTML</p>")
    .appendTo("#addhere");

  });
 </script> 
 
</head>
<body>
<p><b>Mobile-Web-App: jQuery, add to HTML</b></P>
<div id="addhere"></div>
</body>
</html>

Related:
- Add HTML elements using Javascript code

The iOS 5 Developer's Cookbook: Core Concepts and Essential Recipes for iOS Programmers (3rd Edition)

***This is the updated and corrected edition ofThe iOS 5 Developer's Cookbook.***

The iOS 5 Developer’s Cookbook, Third Edition

Covers iOS 5, Xcode 4.2, Objective-C 2.0’s ARC, LLVM, and more!

In this book, bestselling author and iOS development guru Erica Sadun brings together all the information you need to quickly start building successful iOS apps for iPhone, iPad, and iPod touch. Sadun has thoroughly revised this book to focus on powerful new iOS 5 features, the latest version of Objective-C, and the Xcode 4 development tools.

The iOS 5 Developer’s Cookbook, Third Edition is packed with ready-made code solutions for the iOS 5 development challenges you’re most likely to face, eliminating trial-and-error and helping you build reliable apps from the very beginning. Sadun teaches each new concept and technique through robust code that is easy to reuse and extend. This isn’t just cut-and-paste: Using her examples, Sadun fully explains both the “how” and “why” of effective iOS 5 development.

Sadun’s tested recipes address virtually every major area of iOS development, from user interface design to view controllers, gestures and touch, to networking and security. Every chapter groups related tasks together, so you can jump straight to your solution, without having to identify the right class or framework first. Coverage includes:

Mastering the iOS 5 SDK, Objective-C essentials, and the iOS development lifecycle
Designing and customizing interfaces with Interface Builder and Objective-C
Organizing apps with view controllers, views, and animations featuring the latest Page View controllers and custom containers
Making the most of touch and gestures—including custom gesture recognizers
Building and using controls from the ground up
Working with Core Image and Core Text
Implementing fully featured Table View edits, reordering, and custom cells
Creating managed database stores; then adding, deleting, querying, and displaying data
Alerting users with dialogs, progress bars, local and push notifications, popovers, and pings
Requesting and using feedback
Connecting to networks and services, handling authentication, and managing downloads
Deploying apps to devices, testers, and the App Store

About the Author

Erica Sadun is the bestselling author, coauthor, and contributor to several dozen books on programming, digital video and photography, and other technology topics. Sadun has authored dozens of iPhone-native applications, offers rapid-prototype consulting, and has blogged for many sites including Ars Technica, O’Reilly, and LifeHacker. She currently blogs regularly for TUAW. She holds a Ph.D. in Computer Science from Georgia Tech.

Saturday, May 12, 2012

FREE eBook download: jQuery Succinctly by Cody Lindley

jQuery Succinctly is the simple quick-start guide to intermediate and advanced jQuery development.

jQuery Succinctly was written to express, in short-order, the concepts essential to intermediate and advanced jQuery development. Its purpose is to instill in you, the reader, practices that jQuery developers take as common knowledge. Each chapter contains concepts essential to becoming a seasoned jQuery developer.

This book is intended for two types of readers. The first is someone who has read introductory material on jQuery and is looking for the next logical step. The second type of reader is a JavaScript developer, already versed in another library, now trying to quickly learn jQuery. I crafted this book to be used as my own personal reference point for jQuery concepts. This is exactly the type of book I wish every JavaScript library had available.

- Download jQuery Succinctly here

Table of Contents
- Core jQuery
- Selecting
- Traversing
- Manipulation
- HTML Forms
- Events
- jQuery and the Web Browser
- Plugins
- Effects
- AJAX

Friday, May 11, 2012

jQuery: .attr()

When attr() is called with two parameters, it's used to change the value of the attribute. The first parameter is the attribute, the second parameter is the new value. It attr() is called with one parameter, it's used to get the value of the attribute.

Example:

<!doctype html>
<head>
 <title>Mobile-Web-App: jQuery, .attr()</title>
 <meta charset="utf-8">
 <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
 <script type="text/javascript">

  $(document).ready(function(){
  
   //get value of attr "class"
   var myattr = $("#p1").attr("class");
   $("#p1").text("my class is: " + myattr);
   
   //change value of attr "class"  
   $("#p1").attr("class", "newclass");
   
   //get updated value of attr "class"
   myattr = $("#p1").attr("class");
   var oldmsg = $("#p1").text();
   $("#p1").html(
    "<p>" + oldmsg + "</p>" + 
    "<p>" + "my new class is: " + myattr + "</p>");

  });
 </script> 
 
</head>
<body>
<p><b>Mobile-Web-App: jQuery, .attr()</b></P>
<p class="myclass" id="p1"></p>
</body>
</html>