Mobile-Web-App: Library

Showing posts with label Library. Show all posts

Saturday, September 29, 2012

Ext JS 4 Web Application Development Cookbook

This is a cookbook with easy to follow recipes containing practical and detailed examples which are all fully backed up with code, illustrations, and tips. The Ext JS 4 Web Application Development Cookbook is aimed at both newcomers and those experienced with Ext JS who want to expand their knowledge and learn how to create interactive web applications with Ext JS 4.

Saturday, September 15, 2012

jQuery Mobile 1.2.0 RC1 released!

jQuery Mobile: Touch-Optimized Web Framework for Smartphones & Tablets

A unified, HTML5-based user interface system for all popular mobile device platforms, built on the rock-solid jQuery and jQuery UI foundation. Its lightweight code is built with progressive enhancement, and has a flexible, easily themeable design.

Web Site: http://jquerymobile.com/

Monday, September 10, 2012

Tile5 - opensource HTML5 mapping javascript library

Tile5 is an opensource HTML5 mapping javascript library that gives developers the ability to use existing mapping engines and provide a rich HTML5 experience. Tile5 can also be used to create more generic HTML5 tiling interfaces.

Tile5 is targeted primarily at mobile devices that support HTML5. The goal is to achieve compatibility with all mobile devices considered “Class A” on the jQuery Mobile GBS chart. Longer term intend to support the various desktop browsers as well (some even work right now).

Tile5 Code Playground

Monday, June 4, 2012

Facebook open source internal C++ library

Facebook release Folly(Facebook Open-source LibrarY), an open-source C++ library developed and used at Facebook.

~ https://github.com/facebook/folly

Tuesday, May 22, 2012

Sample of RGraph LED Grids

<!DOCTYPE html >
<html>
<head>
 <title>RGraph LED Grids</title>
 <script src="http://www.rgraph.net/libraries/RGraph.common.core.js" ></script>
 <script src="http://www.rgraph.net/libraries/RGraph.led.js" ></script>
 
 <script>
  window.onload = function ()
  { var led = new RGraph.LED('led_canvas', 'Mobile-Web-App');
   led.Set('chart.light', '#0F0');
   led.Draw();
  }
 </script>

</head>
<body>
<h1>Mobile-Web-App: LED Grids</h1>
<canvas id="led_canvas" width="450" height="100">
Sorry! Canvas not supported on your browser.
</canvas>

</body>
</html>

Reference: RGraph LED Grid documentation

Monday, May 21, 2012

Simple example of RGraph 3D bar chart

<!DOCTYPE html >
<html>
<head>
 <title>RGraph 3D Bar chart example</title>
 <script src="http://www.rgraph.net/libraries/RGraph.common.core.js" ></script>
 <script src="http://www.rgraph.net/libraries/RGraph.common.dynamic.js" ></script>
 <script src="http://www.rgraph.net/libraries/RGraph.bar.js" ></script>
 
 <script>
  window.onload = function ()
  {     var barchart = new RGraph.Bar(
     'barchart_canvas', [[17], [13], [12], [11], [3], [2], [2], [2], [2], [2]]);
    barchart.Set('chart.colors', ['#0000FF']); 
    barchart.Set('chart.labels', 
     ['US', 'China', 'Russia', 'Netherlands', 'Ukraine', 
     'Germany', 'United Kingdom', 'South Korea', 'Denmark', 'Brazil']);
    barchart.Set('chart.ymax', 20);
    barchart.Set('chart.ylabels.count', 5);
    barchart.Set('chart.gutter.left', 35);
    barchart.Set('chart.variant', '3d');
    barchart.Set('chart.strokestyle', 'rgba(0,0,0,0.1)');
    barchart.Set('chart.scale.round', true);
    barchart.Set('chart.text.angle', 15);
    barchart.Set('chart.text.size', 6);
    barchart.Draw();
  }
 </script>

</head>
<body>
<h1>Mobile-Web-App: RGraph 3D Bar Chart</h1>
<canvas id="barchart_canvas" width="450" height="300">
Sorry! Canvas not supported on your browser.
</canvas>

</body>
</html>

Reference: RGraph Bar charts documentation

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>

Tuesday, April 24, 2012

Datejs - JavaScript Date library

Datejs is an open-source JavaScript Date library.

Example:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Mobile-Web-App: Javascript Exercise - Datejs</title>
<script src="http://www.datejs.com/build/date.js" type="text/javascript"></script>
<script>

function test(){

info = "<p><b>Datejs: an open-source JavaScript Date library</b></p>"
 + "<p> Today's date: " + Date.today() + "</p>"
 + "<p> Add 5 days to today: " + Date.today().add(5).days() + "</p>"
 + "<p> Get Friday of this week: " + Date.friday() + "</p>" 
 + "<p> Get March of this year: " + Date.march() + "</p>"
 + "<p> Is today Friday? " + Date.today().is().friday() + "</p>";

document.getElementById("prompt").innerHTML=info;
}

</script>
</head>
<body onload="test();">
<h1>Mobile-Web-App: Javascript Exercise - Datejs</h1>
<div id="prompt"></div>
</body>
</html>

Sunday, April 8, 2012

jQuery Mobile 1.1.0 RC2 Released

jQuery Mobile is a Touch-Optimized UI Framework built with jQuery and HTML5. the easiest way to build sites and apps that are accessible on all popular smartphone, tablet and desktop devices. For jQuery 1.6.4 and 1.7.1.

jQuery Mobile 1.1.0 RC2 Released, read details: http://jquerymobile.com/blog/2012/04/06/jquery-mobile-1-1-0-rc2/

Visit jQuery Mobile 1.1.0 RC2

Thursday, March 22, 2012

Raphaël—JavaScript Library

Raphaël is a small JavaScript library that should simplify your work with vector graphics on the web. If you want to create your own specific chart or image crop and rotate widget, for example, you can achieve it simply and easily with this library.

Raphaël ['ræfeɪəl] uses the SVG W3C Recommendation and VML as a base for creating graphics. This means every graphical object you create is also a DOM object, so you can attach JavaScript event handlers or modify them later. Raphaël’s goal is to provide an adapter that will make drawing vector art compatible cross-browser and easy.

Raphaël currently supports Firefox 3.0+, Safari 3.0+, Chrome 5.0+, Opera 9.5+ and Internet Explorer 6.0+.

Web Site: http://raphaeljs.com/

Friday, October 28, 2011

jQuery CDN

For all web page utilize jQuery Mobile have to links to jQuery, jQuery Mobile and also jQuery Mobile stylesheet.

http://code.jquery.com/ is CDN-hosted versions of the libraries and css. You can link to it from your web page directly, without download to your host.

However, if your web app have to work offline, you can download it to your local host. And also, the latest version of CDN-hosted versions will be changed constantly, you can specify the fixed version for your libraries, or download it.

Refer to the post Basic jQuery Mobile Web Page for example to link to jQuery CDN.

jQuery Mobile: Touch-Optimized Web Framework for Smartphones & Tablets

jQuery Mobile is a unified, HTML5-based user interface system for all popular mobile device platforms, built on the rock-solid jQuery and jQuery UI foundation. Its lightweight code is built with progressive enhancement, and has a flexible, easily themeable design.

jQuery Mobile 1.0 RC2 RELEASED!

Website: http://jquerymobile.com/