diveintomark / diveintohtml5 Goto Github PK
View Code? Open in Web Editor NEWDive Into HTML5 online book
Home Page: https://diveintohtml5.info/
License: Other
Dive Into HTML5 online book
Home Page: https://diveintohtml5.info/
License: Other
Considering...it became his repo too when you guys merged.
https://github.com/diveintomark/diveintohtml5/blob/master/canvas.html#L96
This is rather outdated, now that WebGL exists and is supported in quite a few modern browsers, including Chrome and Firefox.
I would fix this myself and send a pull request, however, I feel this needs much more in-depth updating than I can provide (knowing exactly nothing about WebGL)
http://diveintohtml5.info/geolocation.html
While trying to understand how geolocation works, I got an error on page load saying the param sensor is not set correctly. I took a look at the source code and noticed a typo pasted below:
<script src="http://maps.googleapis.com/maps/api/js?sensor=""true"></script>
It should be:
<script src="http://maps.googleapis.com/maps/api/js?sensor="true"></script>
Hello,
I'm not sure this is issue but anyway; I have just started to read your work and run into "disinformation" in introduction section (Five Things You Should Know About HTML5). In chapter 4, there is sentence; Even Microsoft — rarely known for blazing the trail of standards support — will be supporting most HTML5 features in the upcoming Internet Explorer 9.
IE9 is already released so you should correct the sentence if you want your book to be up to date.
greetings,
Matjaž
The section on geoPosition.js can't decide which variables it wants to use for geoPosition.getCurrentPosition()
For each HTML element we should confirm whether it's supported on BlackBerry 10. I can provide the list of tags that are correctly parsed by the browser engine.
As part of my new full-time career working on open-source projects, I believe I should officially kick off with this ticket, an announcement that I would like to complete a tablet and mobile themed edition of Dive Into HTML5 before August.
The screenshot is a brief beginning. I'd like to have a small menu across the top that lets users quickly navigate to other sections.
Anyway, so it begins!
I'm proposing that we change "asterism" art from its current inline form like this:
.a {
font-size: xx-large;
line-height: .875;
text-shadow: 0 0 2px #667;
}
<p class="a">❧
To a styled pseudo form like this:
.a {
font-size: xx-large;
line-height: .875;
text-shadow: 0 0 2px #667;
}
.rotatedFloralHeartBullet:before {
content: '\2767';
}
<p class="a rotatedFloralHeartBullet">
The result is a more manageable and meaningful source which better separates content from style without making much change.
I'm also proposing that we change the "fancy" first letters from their current img tag form like this:
.f img {
float: left;
margin-right: 5px;
margin-bottom: 5px;
-ms-interpolation-mode: bicubic;
}
<p class="f">
<img src="i/aoc-d.png" alt="D" width="104" height="105">ive Into <abbr>HTML5</abbr> elaborates on...
To a styled pseudo form like this:
.f:first-letter {
background-size: 100% 100%;
float: left;
height: 105px;
margin: 0 5px 5px 0;
overflow: hidden;
text-indent: 100%;
width: 104px;
}
.f-d:first-letter {
background: url(i/aoc-d.png);
}
<p class="f f-d">
Dive Into <abbr>HTML5</abbr> elaborates on...
The result is, again, cleaner source, in fact, much cleaner, but with the added benefit of a selectable "Dive Into HTML5", whereas the present form results in a selection of "ive into HTML5" since the img's alt is not captured as a text character.
According to: http://validator.w3.org/checklink?uri=http%3A%2F%2Fdiveintohtml5.info%2Fvideo.html&hide_type=all&depth=&check=Check#d1code_404
There are many broken links.
Line: 75 http://www.apple.com/itunes/whatson/movies.html
Status: 404 Not Found
The link is broken. Double-check that you have not made any typo, or mistake in copy-pasting. If the link points to a resource that no longer exists, you may want to remove or fix the link.
Lines: 552, 755 http://www.whatwg.org/specs/web-apps/current-work/multipage/video.html
Status: 404 Not Found
The link is broken. Double-check that you have not made any typo, or mistake in copy-pasting. If the link points to a resource that no longer exists, you may want to remove or fix the link.
Broken fragments:
http://www.whatwg.org/specs/web-apps/current-work/multipage/video.html#video (line 755)
http://www.whatwg.org/specs/web-apps/current-work/multipage/video.html#dom-media-currenttime (line 552)
http://www.whatwg.org/specs/web-apps/current-work/multipage/video.html#playing-the-media-resource (line 552)
http://www.whatwg.org/specs/web-apps/current-work/multipage/video.html#dom-media-volume (line 552)
http://www.whatwg.org/specs/web-apps/current-work/multipage/video.html#dom-media-muted (line 552)
Page: http://diveintohtml5.info/storage.html
where: “5 megabytes” is how much storage space each origin gets by default.
the link: https://html.spec.whatwg.org/multipage/origin-0.html#origin-0
I use Arista Transcoder on Gnu/Linux to generate my HTML5 videos and find this to be a brilliant solution (similar to Miro on Windows and Mac, by the looks of the screenshots). As I believe this is the simplest way to make all the relevant formats on a Gnu/Linux machine, I think that this should be featured in the page on encoding video.
Whois record:
Domain Name:DIVEINTOHTML5.INFO
Domain ID: D42815552-LRMS
Creation Date: 2011-10-05T03:34:16Z
Updated Date: 2015-10-04T10:55:02Z
Registry Expiry Date: 2015-10-05T03:34:16Z
I hate to dare mention it, but I was reading:
http://diveintohtml5.info/video.html
and the statement that:
"For maximum compatibility, here’s what your video workflow will look like:
Make one version that uses WebM (VP8 + Vorbis).
Make another version that uses H.264 baseline video and AAC “low complexity” audio in an MP4 container.
Make another version that uses Theora video and Vorbis audio in an Ogg container.
Link to all three video files from a single <video> element, and fall back to a Flash-based video player. "
I wonder if this should be revised to simply recommend WebM and H.264, with a Flash fall-back (as an aside, it would probably be worth mentioning that the Flash fallback can use the H.264 video). As far as I can see, the only users that would need Ogg Theora are people on FF3.5 or Opera 10.5--and those users are very likely to have already upgraded to later versions (as they are normally more tech-savvy users).
The link to the http://code.google.com/apis/gears/gears_init.js is broken.
http://diveintohtml5.info/semantics.html#unknown-elements
Remy Sharp has “minified” this script and hosted it on Google Project Hosting.
This project has been moved and the link should now point to https://github.com/aFarkas/html5shiv
On the "Detecting HTML5 Features" page (http://diveintohtml5.info/detect.html) the following error appears in a popup box:
The Google Maps API server rejected your request. The "sensor" parameter specified in the request must be set to either "true" or "false".
Hey Guys,
One things to notice on Chapter 6: "You are here..."
So, Geolocation features for older browsers such us IE7, IE8 and old versions of Firefox should be get using other third party such this http://iplocationtools.com/api.html#b. This could be something to suggest to the reader.
Thanks,
estebanav
The second rule of the Halma game in the canvas chapter states that you can make a legal move if you "[t]ake a piece and hop over an adjacent piece, and possibly repeat. That is, if you hop over an adjacent piece, then hop over another piece adjacent to your new position, that counts as a single move. In fact, any number of hops still counts as a single move."
Indeed, on the board, I can select the second piece in the last row, then click on the fourth cell in the last row and see the piece correctly moving. By my understanding of the cited second rule, a legal move would also be one where I select the first piece in the last row, then click on that same fourth cell in the last row. That is, instead of just one hop over an adjacent piece, it should be legal to "repeat" that kind of hop: two or more hops on adjacent pieces should be permitted. However, those two-hop move is not correctly recognized by the board, so the click on the fourth cell in the last row simply deselects the previously selected first piece in the last row. Shouldn't "any number of hops" still count "as a single move"?
Then again, I may be misunderstanding the game rules, so I hope someone can clarify this.
On the History page, the following:
window.addEventListener("popstate", function(e) {
swapPhoto(location.pathname);
}
is missing a closing parens.
On http://diveintohtml5.info/video.html under What Works on the Web, IE9 is marked as supporting WebM. Safari is not. While I have no love of either, it sounds as though both do not support WebM out of the box, but can if you install the codec. They should therefore be marked in the same way.
How come when I port the code for http://diveintohtml5.info/examples/history/fer.html to a different server space it doesn't quite work anymore?
hi diveintohtml5 team,
I reading your book "dive into html5", and i'm loving it. I really would like that all authors of technician books write as you write. I started to read it on the web site, however for me reading long text in web browsers is not easy. Then I brought the kindle's version of your book.
And I could notice some mistakes in this version that maybe you should fix:
Besides, the email that is on the web site is also broken. mark(at)diveintomark(dot)org
Well, I'm still reading, then I dont know if there are more mistakes.
Regards,
Neto
Typo in the second paragraph.
Notice anything different? Mark Pigrim has stopped maintaining this project, and we want it to continue. We're not just patching broken links and updating APIs. We plan to actively maintain it; refreshing, updating, and reflecting the relevant and current state of HTML5, just as it had been during Mark's tenure. We attribute this work in the manner specified by Mark, which is why we've kept the name, purchased a similar domain, and have made the modification to the site's tagline. We do not in any way suggest that he endorses us or our use of his work. We hope you do.
Mark Pigrim -> Mark Pilgrim
Keep up the good work.
As this is related to geoposition.js, I've posted in that projects issue queue: estebanav/javascript-mobile-desktop-geolocation#2
http://diveintohtml5.info/geolocation.html
Section "geoPosition.js to the Rescue" states in a couple places that it will ask permission:
"If the getCurrentPosition() function was successful in finding your location — that is, you gave your permission and the geolocation API actually worked its magic — it will call the function passed in as the first argument."
However, in IE 6, 7 and 8 it does not ask at all, it simply does its magic.
http://dev.w3.org/geo/api/spec-source.html#security
"A conforming implementation of this specification must provide a mechanism that protects the user's privacy and this mechanism should ensure that no location information is made available through this API without the user's express permission."
Here http://diveintohtml5.info/semantics.html, while quoting the external explanation for the html5 short syntax, you quote:
The rationale for the attribute combination is that UAs
already implement it, because people tend to leave things unquoted, like:<META HTTP-EQUIV="Content-Type" CONTENT="text/html;" charset="ISO-8859-1">
and the piece of code incorrectly has quotes. They should be removed.
Recently we learned that a lot of people think this GitHub project is a memorial to Mark Pilgrim, and they treat it with a kind of reverence as though our touching it were removing his dead body from a casket.
It's sad because the man isn't even dead either. That's my opinion, at least. Mark put it on GitHub at one point so we could fork it. This was Mark Pilgrim's Disneyland, and I think it works in the same way as Walt put it:
Disneyland will never be completed. It will continue to grow as long as there is imagination left in the world.
However, as a canonical resource, we have to decide how we're going to treat this gift we have been left with. What is okay to edit in this living document? Is it a living document? Should we revert other changes? Do we update sections that are wrong or outdated? Do we stick to changing pure numbers, dates, and "easy" things? Would we ever change the layout to fit on a tablet?
These and others are the questions I'd like us to answer.
We can't leave this to a mob consensus in the future. Earlier today someone asserted something to me as though Mark were a deity: "When Mark said 'with contributions from the community' he didn't mean for you to put words into his mouth" ... though, ironically for both of us, the truth is that "with contributions from the community" are my words.
The microdata chapter [http://diveintohtml5.info/extensibility.html] currently refers to data-vocabulary.org; however, schema.org seems to be the shiny new common thing.
http://schema.org/
http://support.google.com/webmasters/bin/answer.py?hl=en&answer=164506
There are references to Gear, which is no longer available:
https://developers.google.com/gears/
Perhaps they should be removed.
Great book - thanks!
Hi, I just found out that I commented on a typo that is not present in this fork.
The reason is that the website http://diveintohtml5.info/about.html is pointing to this repository, even though that website is using publishing the pages in the fork at https://github.com/jonathantneal/diveintohtml5/.
This is nothing you can do about this (the error is in the other fork). Nevertheless, I suggest you and the other forks to work together by sending each other pull requests or even using a shared repository.
You can contact the other forks, or simply merge their fixes here without an explicit pull request.
Chrome now uses a native date picker for input type="date" (possibly more types).
Tested with <!doctype html> and Google Chrome 23 (Stable release) on Ubuntu 12.04.
http://diveintohtml5.info/forms.html#type-date
https://plus.google.com/+GoogleChromeDevelopers/posts/hTcMLVNKnec
Take care
WHOOPSIE
http://diveintohtml5.info/ -> https://github.com/organizations/diveintomark/teams/ -> Login or 404|
@tantek Tantek Çelik has offered to help own the semantics portion of DiveIntoHTML5.
Pinging @kennethreitz. You are the only admin I know who can do this. Also pinging the rest of our team; @jnoller, and @paulirish!
hgroup is no longer part of the HTML5 spec and shouldn't be recommended in the "Headers" section of Chapter 3.
W3C has some some example markup to use instead.
On page http://diveintohtml5.info/semantics.html:
Seems Mozilla moved stuff around, source now here:
http://mxr.mozilla.org/mozilla-central/source/parser/htmlparser/nsElementTable.cpp
Hello,
It's seems Nokia has changed (again) the location of its API Documentation for Geolocation on old devices.
from
to
I did the corrections and I am about to Pull Request the changes.
Thanks,
Esteban
The link http://www.vialicensing.com/Licensing/AAC_fees.cfm, found on page http://diveintohtml5.info/video.html, should be to http://www.vialicensing.com/licensing/aac-fees.aspx
Hey Guys,
I am continuing looking for broken links and I found that the Canvas tutorial at Mozilla Developer Network is mostly broken.
https://developer.mozilla.org/en-US/docs/Canvas_tutorial
These has been reported at this bugs:
https://bugzilla.mozilla.org/show_bug.cgi?id=881217
https://bugzilla.mozilla.org/show_bug.cgi?id=881687
I am going to keep an eye on these bugs in order to verify that they are going to fix it.
Although, I found this Apple Canvas Tutorial that can be a good replace of the Mozilla or may be add it as reference:
What do you think about it?
Cheers,
E.
At CHAPTER 7: THE PAST, PRESENT & FUTURE OF LOCAL STORAGE FOR WEB APPLICATIONS, the following Google Doc Document is not longer available for the public:
Dojo Storage, part of a larger tutorial about the (now-defunct) Dojo Offline library
http://docs.google.com/View?docid=dhkhksk4_8gdp9gr#dojo_storage
As Dojo Offline library is now defunct I suggest to remove the whole reference.
Cheers,
E.
Hi, guys. Some days ago I started read this book, it is awesome!
I found two broken links in Detecting HTML5 features - Video section:
part 1: container formats - http://diveintomark.org/archives/2008/12/18/give-part-1-container-formats
part 2: lossy video codecs - http://diveintomark.org/archives/2008/12/19/give-part-2-lossy-video-codecs
Maybe they should link to Video chapter, Containers and Codecs sections?
good work :)
The file extension for manifest files should be "appcache".
I tried looking for a standard, but only found the following resources supporting it:
and the following is indifferent:
I have found this site of immense use, that I want to add it to a list of resources for an educational presentation. But am I loathe to do so when there is foul language on it.
For example, "to prevent people from just making 'stuff' up" on the semantics page:
http://diveintohtml5.info/semantics.html
is unnecessary and is easily replaced with a more-appropriate "to prevent people from just making their own rel values".
This would increase the value and legitimacy of this resource.
Thank you.
http://diveintohtml5.info/semantics.html#link
says that a link with rel=stylesheet can drop the type but that type is required for rel=alternate. However, the official specs:
http://www.whatwg.org/specs/web-apps/current-work/multipage/links.html
list it as optional and that a device should not rely on the type specified in the link as being accurate.
http://www.w3schools.com/tags/tag_link.asp
lists it as optional and
validates a link with and without a type as valid.
Am thinking that section needs a rewrite or clarification on why one should include a type if it is going to be ignored by a device anyways. Is it a fallback for non-HTML5 devices?
E.g. in http://diveintohtml5.info/detect.html
these are broken:
http://www.whatwg.org/specs/web-apps/current-work/multipage/number-state.html#range-state
http://www.whatwg.org/specs/web-apps/current-work/multipage/number-state.html#number-state
http://www.whatwg.org/specs/web-apps/current-work/multipage/number-state.html#color-state
Android 2.3+'s WebM support is listed as an "Upcoming Browser", but is already shipping (though I agree about your comment that battery life is a concern because of a lack of hardware support).
This page: http://diveintohtml5.info/semantics.html#header-element
gets into explaining the need to make headers generic, but it relies on the hgroup element to explain how that would work, which is now deprecated:
http://www.w3.org/html/wg/drafts/html/master/common-idioms.html#sub-head
Now, the current recommendation is effectively to use:
<header><h1>main-title</h1><p>sub-heading</p></header>
Or some variation thereof, simple and sweet.
http://www.w3.org/html/wg/drafts/html/master/common-idioms.html#sub-head
I could make a pull request with simplification & changes if that's the appropriate approach for this repository.
For me, the video page (http://diveintohtml5.info/video.html) is the most important, but it is now so large that it is overwhelming. Most of the bulk of this page is on the various options for encoding. I would like to see this section split into a separate page.
At the moment, this is clouding the important detail on the page.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.