The document introduces HTML 5 and discusses new capabilities it provides such as canvas/SVG for graphics, video playback, geolocation, application caching, and web workers. It notes that these features are solving key challenges for developers and that browser development is accelerating, bringing web applications closer to native applications. The document argues HTML 5 provides a chance to build upon lessons from past technologies like AJAX to do things differently.
Hdc09 Keynote - Browser, Mobile, Cloud, Social, Geo Portrait of the developer...Patrick Chanezon
slides for my keynote at heartland developer conference 2009 in Omaha, Nebraska
http://www.heartlanddc.com/omaha/sessions.aspx#81
In the past 2 years developer platforms have evolved very fast making it easy to create applications with a rich user interface used by million of users, leveraging their friends, profile and location information, and accessible from their mobile device. There has never been a better time to be a developer!
demos at http://delicious.com/chanezon/hdc09+demos
Talk by Tomas Lin on Building Killer RIAs with Flex and Grails at the Groovy ...Skills Matter
Adobe Flex is a Rich Internet Application framework that allows developers to build robust and powerful applications for the web and the desktop. In this talk, Tomas Lin discusses the major technologies and tools available within the Grails / Flex ecosystem and dive into building a simple and fun application using the Flex plugin, BlazeDS, Grails and Flash Builder 4.
Find the podcast of this talk here:
http://skillsmatter.com/podcast/java-jee/building-killer-rias-with-flex-and-grails/zx-489
Hdc09 Keynote - Browser, Mobile, Cloud, Social, Geo Portrait of the developer...Patrick Chanezon
slides for my keynote at heartland developer conference 2009 in Omaha, Nebraska
http://www.heartlanddc.com/omaha/sessions.aspx#81
In the past 2 years developer platforms have evolved very fast making it easy to create applications with a rich user interface used by million of users, leveraging their friends, profile and location information, and accessible from their mobile device. There has never been a better time to be a developer!
demos at http://delicious.com/chanezon/hdc09+demos
Talk by Tomas Lin on Building Killer RIAs with Flex and Grails at the Groovy ...Skills Matter
Adobe Flex is a Rich Internet Application framework that allows developers to build robust and powerful applications for the web and the desktop. In this talk, Tomas Lin discusses the major technologies and tools available within the Grails / Flex ecosystem and dive into building a simple and fun application using the Flex plugin, BlazeDS, Grails and Flash Builder 4.
Find the podcast of this talk here:
http://skillsmatter.com/podcast/java-jee/building-killer-rias-with-flex-and-grails/zx-489
Pequeña introducción al uso de los Frameworks CSS.
Desde la problemática al desarrollo CSS al empleo de algunos frameworks (1kb CSS Grid, 960.gs, Blueprint, Foundation y Bootstrap) como mejora de la productividad.
Introducción a los conceptos y caracteristicas mas importantes sobre el Web2.0. Transparencias del seminario de doctorado impartido en el DIT-UPM, en la Universidad de Oviedo y la Pontificia Universidad Catolica de Peru a traves de Isabel.
Presentación de Alejandro Villanueva
Director de Relaciones con Desarrolladores para Latinoamérica de Google, primera charla de la conferencia WebConfLatino 2009.
Pequeña introducción al uso de los Frameworks CSS.
Desde la problemática al desarrollo CSS al empleo de algunos frameworks (1kb CSS Grid, 960.gs, Blueprint, Foundation y Bootstrap) como mejora de la productividad.
Introducción a los conceptos y caracteristicas mas importantes sobre el Web2.0. Transparencias del seminario de doctorado impartido en el DIT-UPM, en la Universidad de Oviedo y la Pontificia Universidad Catolica de Peru a traves de Isabel.
Presentación de Alejandro Villanueva
Director de Relaciones con Desarrolladores para Latinoamérica de Google, primera charla de la conferencia WebConfLatino 2009.
Adobe Flex: Creating Widgets for the Desktop and WebColin Loretz
Do you have an idea for a cool widget or application? Learn how Adobe Flex can be used to develop your own widgets that run on the web, desktop, and flash-enabled handheld devices. No prior experience is necessary. Download a trial version of Flex to follow along during the workshop. Presented at the Nevada Interactive Media Summit on March 7, 2009
Introduction to First Commercial Memcached Service for CloudGear6
Gear6 introduced the first commercial Memcached service for cloud platforms on Dec. 8, 2009. The deck provides an overview of the new offering. More info at http://www.gear6.com/memcached-product/cloud-aws.
Essentials of Automations: Optimizing FME Workflows with ParametersSafe Software
Are you looking to streamline your workflows and boost your projects’ efficiency? Do you find yourself searching for ways to add flexibility and control over your FME workflows? If so, you’re in the right place.
Join us for an insightful dive into the world of FME parameters, a critical element in optimizing workflow efficiency. This webinar marks the beginning of our three-part “Essentials of Automation” series. This first webinar is designed to equip you with the knowledge and skills to utilize parameters effectively: enhancing the flexibility, maintainability, and user control of your FME projects.
Here’s what you’ll gain:
- Essentials of FME Parameters: Understand the pivotal role of parameters, including Reader/Writer, Transformer, User, and FME Flow categories. Discover how they are the key to unlocking automation and optimization within your workflows.
- Practical Applications in FME Form: Delve into key user parameter types including choice, connections, and file URLs. Allow users to control how a workflow runs, making your workflows more reusable. Learn to import values and deliver the best user experience for your workflows while enhancing accuracy.
- Optimization Strategies in FME Flow: Explore the creation and strategic deployment of parameters in FME Flow, including the use of deployment and geometry parameters, to maximize workflow efficiency.
- Pro Tips for Success: Gain insights on parameterizing connections and leveraging new features like Conditional Visibility for clarity and simplicity.
We’ll wrap up with a glimpse into future webinars, followed by a Q&A session to address your specific questions surrounding this topic.
Don’t miss this opportunity to elevate your FME expertise and drive your projects to new heights of efficiency.
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...Jeffrey Haguewood
Sidekick Solutions uses Bonterra Impact Management (fka Social Solutions Apricot) and automation solutions to integrate data for business workflows.
We believe integration and automation are essential to user experience and the promise of efficient work through technology. Automation is the critical ingredient to realizing that full vision. We develop integration products and services for Bonterra Case Management software to support the deployment of automations for a variety of use cases.
This video focuses on the notifications, alerts, and approval requests using Slack for Bonterra Impact Management. The solutions covered in this webinar can also be deployed for Microsoft Teams.
Interested in deploying notification automations for Bonterra Impact Management? Contact us at sales@sidekicksolutionsllc.com to discuss next steps.
Connector Corner: Automate dynamic content and events by pushing a buttonDianaGray10
Here is something new! In our next Connector Corner webinar, we will demonstrate how you can use a single workflow to:
Create a campaign using Mailchimp with merge tags/fields
Send an interactive Slack channel message (using buttons)
Have the message received by managers and peers along with a test email for review
But there’s more:
In a second workflow supporting the same use case, you’ll see:
Your campaign sent to target colleagues for approval
If the “Approve” button is clicked, a Jira/Zendesk ticket is created for the marketing design team
But—if the “Reject” button is pushed, colleagues will be alerted via Slack message
Join us to learn more about this new, human-in-the-loop capability, brought to you by Integration Service connectors.
And...
Speakers:
Akshay Agnihotri, Product Manager
Charlie Greenberg, Host
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024Albert Hoitingh
In this session I delve into the encryption technology used in Microsoft 365 and Microsoft Purview. Including the concepts of Customer Key and Double Key Encryption.
DevOps and Testing slides at DASA ConnectKari Kakkonen
My and Rik Marselis slides at 30.5.2024 DASA Connect conference. We discuss about what is testing, then what is agile testing and finally what is Testing in DevOps. Finally we had lovely workshop with the participants trying to find out different ways to think about quality and testing in different parts of the DevOps infinity loop.
Dev Dives: Train smarter, not harder – active learning and UiPath LLMs for do...UiPathCommunity
💥 Speed, accuracy, and scaling – discover the superpowers of GenAI in action with UiPath Document Understanding and Communications Mining™:
See how to accelerate model training and optimize model performance with active learning
Learn about the latest enhancements to out-of-the-box document processing – with little to no training required
Get an exclusive demo of the new family of UiPath LLMs – GenAI models specialized for processing different types of documents and messages
This is a hands-on session specifically designed for automation developers and AI enthusiasts seeking to enhance their knowledge in leveraging the latest intelligent document processing capabilities offered by UiPath.
Speakers:
👨🏫 Andras Palfi, Senior Product Manager, UiPath
👩🏫 Lenka Dulovicova, Product Program Manager, UiPath
UiPath Test Automation using UiPath Test Suite series, part 4DianaGray10
Welcome to UiPath Test Automation using UiPath Test Suite series part 4. In this session, we will cover Test Manager overview along with SAP heatmap.
The UiPath Test Manager overview with SAP heatmap webinar offers a concise yet comprehensive exploration of the role of a Test Manager within SAP environments, coupled with the utilization of heatmaps for effective testing strategies.
Participants will gain insights into the responsibilities, challenges, and best practices associated with test management in SAP projects. Additionally, the webinar delves into the significance of heatmaps as a visual aid for identifying testing priorities, areas of risk, and resource allocation within SAP landscapes. Through this session, attendees can expect to enhance their understanding of test management principles while learning practical approaches to optimize testing processes in SAP environments using heatmap visualization techniques
What will you get from this session?
1. Insights into SAP testing best practices
2. Heatmap utilization for testing
3. Optimization of testing processes
4. Demo
Topics covered:
Execution from the test manager
Orchestrator execution result
Defect reporting
SAP heatmap example with demo
Speaker:
Deepak Rai, Automation Practice Lead, Boundaryless Group and UiPath MVP
Neuro-symbolic is not enough, we need neuro-*semantic*Frank van Harmelen
Neuro-symbolic (NeSy) AI is on the rise. However, simply machine learning on just any symbolic structure is not sufficient to really harvest the gains of NeSy. These will only be gained when the symbolic structures have an actual semantics. I give an operational definition of semantics as “predictable inference”.
All of this illustrated with link prediction over knowledge graphs, but the argument is general.
GraphRAG is All You need? LLM & Knowledge GraphGuy Korland
Guy Korland, CEO and Co-founder of FalkorDB, will review two articles on the integration of language models with knowledge graphs.
1. Unifying Large Language Models and Knowledge Graphs: A Roadmap.
https://arxiv.org/abs/2306.08302
2. Microsoft Research's GraphRAG paper and a review paper on various uses of knowledge graphs:
https://www.microsoft.com/en-us/research/blog/graphrag-unlocking-llm-discovery-on-narrative-private-data/
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf91mobiles
91mobiles recently conducted a Smart TV Buyer Insights Survey in which we asked over 3,000 respondents about the TV they own, aspects they look at on a new TV, and their TV buying preferences.
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...DanBrown980551
Do you want to learn how to model and simulate an electrical network from scratch in under an hour?
Then welcome to this PowSyBl workshop, hosted by Rte, the French Transmission System Operator (TSO)!
During the webinar, you will discover the PowSyBl ecosystem as well as handle and study an electrical network through an interactive Python notebook.
PowSyBl is an open source project hosted by LF Energy, which offers a comprehensive set of features for electrical grid modelling and simulation. Among other advanced features, PowSyBl provides:
- A fully editable and extendable library for grid component modelling;
- Visualization tools to display your network;
- Grid simulation tools, such as power flows, security analyses (with or without remedial actions) and sensitivity analyses;
The framework is mostly written in Java, with a Python binding so that Python developers can access PowSyBl functionalities as well.
What you will learn during the webinar:
- For beginners: discover PowSyBl's functionalities through a quick general presentation and the notebook, without needing any expert coding skills;
- For advanced developers: master the skills to efficiently apply PowSyBl functionalities to your real-world scenarios.
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
Google html5 Tutorial
1. Introduction to HTML 5
Brad Neuberg
Developer Programs, Google
Wednesday, October 7, 2009
2. The Web Platform is Accelerating
Chrome 2.0:
May 21, 2009
canvas
User Experience
Firefox 3.5b4: video
Apr 27, 2009 geolocation
canvas app cache
video database
geolocation workers
app cache SVG
Android 1.5: database
Apr 13, 2009 workers
canvas SVG
Opera Labs: geolocation
Mar 26, 2009 app cache
Safari 4.0b:
canvas database
Feb 29, 2009
video workers
canvas
XHR iPhone 2.2: video geolocation
Nov 22, 2008 app cache SVG
CSS
DOM canvas database
app cache workers
HTML
database SVG
SVG
native web
1990 -- 2008 Q408 Q109 Q209 ...
Wednesday, October 7, 2009
3. And It’s Solving Key Developer Challenges
Graphics Location Storage Speed
User Experience
XHR
CSS
DOM
HTML
native web
1990 -- 2008 Q408 Q109 Q209 ...
Wednesday, October 7, 2009
8. Cautionary Tales of Latent Lemonade
AJAX (2004)
xml (1998)
css xhr
(1996) (1999)
Wednesday, October 7, 2009
9. HTML 5: A Chance to Do Things Differently
Wednesday, October 7, 2009
10. canvas/SVG video geolocation app cache & web workers
database
Wednesday, October 7, 2009
11. Until Recently, You Couldn’t Draw on the Web
0
0 X
y
x
height
Y width
Wednesday, October 7, 2009
12. And Graphics Weren’t Very Interactive
javascript:onClick(Draw());
Wednesday, October 7, 2009
13. The Usual Options Do This...
Silverlight
VML
Flash
Wednesday, October 7, 2009
14. ... But canvas and SVG Are Intrinsic to the Web
Document Object Model (DOM) Specification
Original: http://www.w3.org/TR/REC-DOM-Level-1/
Latest: http://www.w3.org/TR/DOM-Level-3-Core/
Contributors: Netscape, Sun, Microsoft, W3C, IBM,
DOM Novell, JavaSoft, SoftQuad Inc., Inso EPS, Texcel
Research, Arbortext
Transparent Stack
Hypertext Markup Language (HTML)
Original: http://tools.ietf.org/html/rfc1866
Latest: http://www.w3.org/TR/html5/
HTML Contributors: T. Berners-Lee, D. Connolly, L. Masinter,
MIT, W3C, AT&T, IBM, Microsoft, Netscape, Novell,
SoftQuad, Spyglass, Adobe, Lotus, CWI, Reuters,
JavaSoft, HP, GRIF, Sun, Opera, Mozilla, Google, Apple
Hypertext Transfer Protocol (HTTP)
Original: http://tools.ietf.org/html/rfc1945
Latest: http://tools.ietf.org/html/rfc2616
Contributors: UC Urvine, Compaq, MIT, Xerox,
HTTP Microsoft, W3C, T. Berners-Lee, R. Fielding, J. Gettys,
J. Mogul, H. Frystyk, L. Masinter, P. Leach
Wednesday, October 7, 2009
30. Canvas API
• JavaScript API ("Scriptable Image Tag")
18
Wednesday, October 7, 2009
31. Canvas API
• JavaScript API ("Scriptable Image Tag")
<canvas id="myCanvas" width="150" height="150">
</canvas>
18
Wednesday, October 7, 2009
32. Canvas API
• JavaScript API ("Scriptable Image Tag")
<canvas id="myCanvas" width="150" height="150">
</canvas>
var canvas = document.getElementById('myCanvas');
18
Wednesday, October 7, 2009
33. Canvas API
• JavaScript API ("Scriptable Image Tag")
<canvas id="myCanvas" width="150" height="150">
</canvas>
var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d');
18
Wednesday, October 7, 2009
34. Canvas API
• JavaScript API ("Scriptable Image Tag")
<canvas id="myCanvas" width="150" height="150">
</canvas>
var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d');
ctx.fillStyle = "rgb(200,0,0)";
18
Wednesday, October 7, 2009
35. Canvas API
• JavaScript API ("Scriptable Image Tag")
<canvas id="myCanvas" width="150" height="150">
</canvas>
var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d');
ctx.fillStyle = "rgb(200,0,0)";
ctx.fillRect (10, 10, 55, 50);
18
Wednesday, October 7, 2009
36. Canvas API
• JavaScript API ("Scriptable Image Tag")
<canvas id="myCanvas" width="150" height="150">
</canvas>
var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d');
ctx.fillStyle = "rgb(200,0,0)";
ctx.fillRect (10, 10, 55, 50);
ctx.fillStyle = "rgba(0, 0, 200, 0.5)";
18
Wednesday, October 7, 2009
37. Canvas API
• JavaScript API ("Scriptable Image Tag")
<canvas id="myCanvas" width="150" height="150">
</canvas>
var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d');
ctx.fillStyle = "rgb(200,0,0)";
ctx.fillRect (10, 10, 55, 50);
ctx.fillStyle = "rgba(0, 0, 200, 0.5)";
ctx.fillRect (30, 30, 55, 50);
18
Wednesday, October 7, 2009
38. Canvas API
• JavaScript API ("Scriptable Image Tag")
<canvas id="myCanvas" width="150" height="150">
</canvas>
var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d');
ctx.fillStyle = "rgb(200,0,0)";
ctx.fillRect (10, 10, 55, 50);
ctx.fillStyle = "rgba(0, 0, 200, 0.5)";
ctx.fillRect (30, 30, 55, 50);
18
Wednesday, October 7, 2009
39. • Mozilla Download Center (FF)
• First Person Gifter (FF)
• Population Demo (FF)
• Bespin (Safari)
• German Election Atlas (Safari)
canvas and SVG demos
Wednesday, October 7, 2009
51. Embedding Video
<video src="http://example.com/myMovie.ogg" controls>
27
Wednesday, October 7, 2009
52. Embedding Video
<video src="http://example.com/myMovie.ogg" controls>
Your browser does not support the video element.
27
Wednesday, October 7, 2009
53. Embedding Video
<video src="http://example.com/myMovie.ogg" controls>
Your browser does not support the video element.
</video>
27
Wednesday, October 7, 2009
54. Multiple Files & Scripting
<video controls>
<source src="foo.ogg" type="video/ogg">
<source src="foo.mp4">
Your browser does not support the video element.
</video>
28
Wednesday, October 7, 2009
55. Multiple Files & Scripting
<video controls>
<source src="foo.ogg" type="video/ogg">
<source src="foo.mp4">
Your browser does not support the video element.
</video>
var v = document.getElementsByTagName("video")[0];
v.play();
28
Wednesday, October 7, 2009
56. • Basic Player (FF 3.5)
• YouTube (Safari 4) - View Source
<video> demos
Wednesday, October 7, 2009
57. HTML 5 Support
Chrome Firefox Safari Opera
canvas/SVG
video
geolocation
app cache
database
workers
Wednesday, October 7, 2009
58. canvas/SVG video geolocation app cache & web workers
database
Wednesday, October 7, 2009
59. Life’s Better with Location
2.8 mi
Places
Social Ads Games
CRM Photos
2.1 mi
1.1 mi
500 ft
20 ft
75 ft
Wednesday, October 7, 2009
65. Geolocation Sample
navigator.geolocation.getCurrentPosition(
function(position) {
var lat = position.coords.latitude;
35
Wednesday, October 7, 2009
66. Geolocation Sample
navigator.geolocation.getCurrentPosition(
function(position) {
var lat = position.coords.latitude;
var lon = position.coords.longitude;
35
Wednesday, October 7, 2009
67. Geolocation Sample
navigator.geolocation.getCurrentPosition(
function(position) {
var lat = position.coords.latitude;
var lon = position.coords.longitude;
showLocation(lat, lon);
35
Wednesday, October 7, 2009
68. Geolocation Sample
navigator.geolocation.getCurrentPosition(
function(position) {
var lat = position.coords.latitude;
var lon = position.coords.longitude;
showLocation(lat, lon);
}
35
Wednesday, October 7, 2009
69. Geolocation Sample
navigator.geolocation.getCurrentPosition(
function(position) {
var lat = position.coords.latitude;
var lon = position.coords.longitude;
showLocation(lat, lon);
}
);
35
Wednesday, October 7, 2009
70. • Google Maps (FF 3.5)
geolocation demos
Wednesday, October 7, 2009
71. HTML 5 Support
Chrome Firefox Safari Opera
canvas/SVG
video
geolocation
(iPhone)
app cache
database
workers
Wednesday, October 7, 2009
72. canvas/SVG video geolocation app cache & web workers
database
Wednesday, October 7, 2009
73. Web Apps Need to Work Everywhere
Wednesday, October 7, 2009
74. // database and
app cache store
user data and
app resources
locally
Wednesday, October 7, 2009
76. App Cache
• List resources that you want to take offline
CACHE MANIFEST
/static/stickies.html
/media/deleteButton.png
/media/deleteButtonPressed.png
/css/stickies.css
/js/stickies.js
42
Wednesday, October 7, 2009
77. App Cache
• List resources that you want to take offline
CACHE MANIFEST
/static/stickies.html
/media/deleteButton.png
/media/deleteButtonPressed.png
/css/stickies.css
/js/stickies.js
<body manifest="./cache.manifest">
</body>
42
Wednesday, October 7, 2009
80. Database
var db = window.openDatabase("NoteTest", "1.0",
44
Wednesday, October 7, 2009
81. Database
var db = window.openDatabase("NoteTest", "1.0",
"Example DB",
44
Wednesday, October 7, 2009
82. Database
var db = window.openDatabase("NoteTest", "1.0",
"Example DB",
200000);
44
Wednesday, October 7, 2009
83. Database
var db = window.openDatabase("NoteTest", "1.0",
"Example DB",
200000);
function saveMe(id, text, timestamp, left, top, zIndex) {
44
Wednesday, October 7, 2009
84. Database
var db = window.openDatabase("NoteTest", "1.0",
"Example DB",
200000);
function saveMe(id, text, timestamp, left, top, zIndex) {
db.transaction(
44
Wednesday, October 7, 2009
85. Database
var db = window.openDatabase("NoteTest", "1.0",
"Example DB",
200000);
function saveMe(id, text, timestamp, left, top, zIndex) {
db.transaction(
function (tx) {
44
Wednesday, October 7, 2009
86. Database
var db = window.openDatabase("NoteTest", "1.0",
"Example DB",
200000);
function saveMe(id, text, timestamp, left, top, zIndex) {
db.transaction(
function (tx) {
tx.executeSql(
44
Wednesday, October 7, 2009
87. Database
var db = window.openDatabase("NoteTest", "1.0",
"Example DB",
200000);
function saveMe(id, text, timestamp, left, top, zIndex) {
db.transaction(
function (tx) {
tx.executeSql(
"INSERT INTO WebKitStickyNotes "
44
Wednesday, October 7, 2009
88. Database
var db = window.openDatabase("NoteTest", "1.0",
"Example DB",
200000);
function saveMe(id, text, timestamp, left, top, zIndex) {
db.transaction(
function (tx) {
tx.executeSql(
"INSERT INTO WebKitStickyNotes "
+ "(id, note, timestamp, left, top, zindex) "
44
Wednesday, October 7, 2009
89. Database
var db = window.openDatabase("NoteTest", "1.0",
"Example DB",
200000);
function saveMe(id, text, timestamp, left, top, zIndex) {
db.transaction(
function (tx) {
tx.executeSql(
"INSERT INTO WebKitStickyNotes "
+ "(id, note, timestamp, left, top, zindex) "
+ "VALUES (?, ?, ?, ?, ?, ?)",
44
Wednesday, October 7, 2009
90. Database
var db = window.openDatabase("NoteTest", "1.0",
"Example DB",
200000);
function saveMe(id, text, timestamp, left, top, zIndex) {
db.transaction(
function (tx) {
tx.executeSql(
"INSERT INTO WebKitStickyNotes "
+ "(id, note, timestamp, left, top, zindex) "
+ "VALUES (?, ?, ?, ?, ?, ?)",
[id, text, timestamp, left, top, zIndex]);
44
Wednesday, October 7, 2009
91. Database
var db = window.openDatabase("NoteTest", "1.0",
"Example DB",
200000);
function saveMe(id, text, timestamp, left, top, zIndex) {
db.transaction(
function (tx) {
tx.executeSql(
"INSERT INTO WebKitStickyNotes "
+ "(id, note, timestamp, left, top, zindex) "
+ "VALUES (?, ?, ?, ?, ?, ?)",
[id, text, timestamp, left, top, zIndex]);
}
44
Wednesday, October 7, 2009
92. Database
var db = window.openDatabase("NoteTest", "1.0",
"Example DB",
200000);
function saveMe(id, text, timestamp, left, top, zIndex) {
db.transaction(
function (tx) {
tx.executeSql(
"INSERT INTO WebKitStickyNotes "
+ "(id, note, timestamp, left, top, zindex) "
+ "VALUES (?, ?, ?, ?, ?, ?)",
[id, text, timestamp, left, top, zIndex]);
}
);
44
Wednesday, October 7, 2009
93. Database
var db = window.openDatabase("NoteTest", "1.0",
"Example DB",
200000);
function saveMe(id, text, timestamp, left, top, zIndex) {
db.transaction(
function (tx) {
tx.executeSql(
"INSERT INTO WebKitStickyNotes "
+ "(id, note, timestamp, left, top, zindex) "
+ "VALUES (?, ?, ?, ?, ?, ?)",
[id, text, timestamp, left, top, zIndex]);
}
);
}
44
Wednesday, October 7, 2009
94. HTML 5 Support
Chrome Firefox Safari Opera
canvas/SVG
video
geolocation
(iPhone)
app cache
(mobile)
database
(mobile)
workers
Wednesday, October 7, 2009
95. canvas/SVG video geolocation app cache & web workers
database
Wednesday, October 7, 2009
96. A More Powerful Web == More Powerful Apps
Wednesday, October 7, 2009
97. But More Power == More Responsibility
I will not hose the browser with JavaScript
I will not hose the browser with JavaScript
I will not hose the browser with JavaScript
I will not hose the browser with JavaScript
I will not hose the browser with JavaScript
I will not hose the browser with JavaScript
Wednesday, October 7, 2009
98. // web workers
defines an API
for running
background
scripts
Wednesday, October 7, 2009
99. • Bad Primes (FF 3.5)
• Good Primes (FF 3.5)
• Motion Tracker (FF)
web workers demos
Wednesday, October 7, 2009
101. Web Workers
<script>
51
Wednesday, October 7, 2009
102. Web Workers
<script>
var worker = new Worker('worker.js');
51
Wednesday, October 7, 2009
103. Web Workers
<script>
var worker = new Worker('worker.js');
worker.onmessage = function (event) {
51
Wednesday, October 7, 2009
104. Web Workers
<script>
var worker = new Worker('worker.js');
worker.onmessage = function (event) {
console.log('Results: ' + event.data);
51
Wednesday, October 7, 2009
105. Web Workers
<script>
var worker = new Worker('worker.js');
worker.onmessage = function (event) {
console.log('Results: ' + event.data);
};
51
Wednesday, October 7, 2009
106. Web Workers
<script>
var worker = new Worker('worker.js');
worker.onmessage = function (event) {
console.log('Results: ' + event.data);
};
</script>
51
Wednesday, October 7, 2009
107. worker.js
function findPrimes() {
// ... prime algorithm here
postMessage(nextPrime);
}
findPrimes();
52
Wednesday, October 7, 2009
108. HTML5 Support
Chrome Firefox Safari Opera
canvas/SVG
video
geolocation
(iPhone)
app cache
(mobile)
database
(mobile)
workers
(mobile)
Wednesday, October 7, 2009
109. Download Slides
• http://codinginparadise.org/presentations/intro_html5.pdf
54
Wednesday, October 7, 2009
110. Introduction to HTML 5
Brad Neuberg
Developer Programs, Google
Wednesday, October 7, 2009