Showing preview only (1,132K chars total). Download the full file or copy to clipboard to get everything.
Repository: h5bp/movethewebforward
Branch: master
Commit: d951c860393c
Files: 44
Total size: 1.1 MB
Directory structure:
gitextract_1azawqnk/
├── .gitattributes
├── .gitignore
├── .htaccess
├── 404.html
├── README.md
├── ar/
│ ├── ar.css
│ └── index.html
├── avatars.php
├── build/
│ ├── build.xml
│ ├── config/
│ │ ├── default.properties
│ │ ├── manifest.appcache
│ │ └── project.properties
│ ├── createproject.sh
│ ├── project.xml
│ ├── runbuildscript.bat
│ └── tools/
│ ├── ant-contrib-1.0b3.jar
│ ├── closure-compiler-v1346.jar
│ ├── csslint-rhino.js
│ ├── fulljshint.js
│ ├── fulljslint.js
│ ├── htmlcompressor-1.4.3.jar
│ ├── optipng-0.6.4-exe/
│ │ └── LICENSE.txt
│ ├── rhino.jar
│ └── yuicompressor-2.4.5.jar
├── cn/
│ └── index.html
├── combine.php
├── crossdomain.xml
├── css/
│ ├── fonts.css
│ ├── img/
│ │ └── .gitignore
│ └── style.css
├── humans.txt
├── index.html
├── js/
│ ├── controller.js
│ ├── init.js
│ ├── libs/
│ │ ├── fittext.js
│ │ ├── respond.js
│ │ └── storage.js
│ ├── mylibs/
│ │ ├── .gitignore
│ │ └── touch.js
│ └── plugins.js
├── pt-br/
│ └── index.html
├── pull.sh
├── push.sh
└── robots.txt
================================================
FILE CONTENTS
================================================
================================================
FILE: .gitattributes
================================================
* text=auto
================================================
FILE: .gitignore
================================================
# Numerous always-ignore extensions
*.diff
*.err
*.orig
*.log
*.rej
*.swo
*.swp
*.vi
*~
*.sass-cache
# OS or Editor folders
.DS_Store
Thumbs.db
.cache
.project
.settings
.tmproj
*.esproj
nbproject
*.sublime-project
*.sublime-workspace
# Dreamweaver added files
_notes
dwsync.xml
# Komodo
*.komodoproject
.komodotools
# Folders to ignore
.hg
.svn
.CVS
intermediate
publish
.idea
# build script local files
build/buildinfo.properties
build/config/buildinfo.properties
================================================
FILE: .htaccess
================================================
# dear h5bp htaccess file,
# i love you.
# ----------------------------------------------------------------------
# Better website experience for IE users
# ----------------------------------------------------------------------
# Force the latest IE version, in various cases when it may fall back to IE7 mode
# github.com/rails/rails/commit/123eb25#commitcomment-118920
# Use ChromeFrame if it's installed for a better experience for the poor IE folk
<IfModule mod_headers.c>
Header set X-UA-Compatible "IE=Edge,chrome=1"
# mod_headers can't match by content-type, but we don't want to send this header on *everything*...
<FilesMatch "\.(js|css|gif|png|jpe?g|pdf|xml|oga|ogg|m4a|ogv|mp4|m4v|webm|svg|svgz|eot|ttf|otf|woff|ico|webp|appcache|manifest|htc|crx|oex|xpi|safariextz|vcf)$" >
Header unset X-UA-Compatible
</FilesMatch>
</IfModule>
# ----------------------------------------------------------------------
# Cross-domain AJAX requests
# ----------------------------------------------------------------------
# Serve cross-domain Ajax requests, disabled by default.
# enable-cors.org
# code.google.com/p/html5security/wiki/CrossOriginRequestSecurity
# <IfModule mod_headers.c>
# Header set Access-Control-Allow-Origin "*"
# </IfModule>
# ----------------------------------------------------------------------
# CORS-enabled images (@crossorigin)
# ----------------------------------------------------------------------
# Send CORS headers if browsers request them; enabled by default for images.
# developer.mozilla.org/en/CORS_Enabled_Image
# blog.chromium.org/2011/07/using-cross-domain-images-in-webgl-and.html
# hacks.mozilla.org/2011/11/using-cors-to-load-webgl-textures-from-cross-domain-images/
# wiki.mozilla.org/Security/Reviews/crossoriginAttribute
<IfModule mod_setenvif.c>
<IfModule mod_headers.c>
# mod_headers, y u no match by Content-Type?!
<FilesMatch "\.(gif|png|jpe?g|svg|svgz|ico|webp)$">
SetEnvIf Origin ":" IS_CORS
Header set Access-Control-Allow-Origin "*" env=IS_CORS
</FilesMatch>
</IfModule>
</IfModule>
# ----------------------------------------------------------------------
# Webfont access
# ----------------------------------------------------------------------
# Allow access from all domains for webfonts.
# Alternatively you could only whitelist your
# subdomains like "subdomain.example.com".
<IfModule mod_headers.c>
<FilesMatch "\.(ttf|ttc|otf|eot|woff|font.css)$">
Header set Access-Control-Allow-Origin "*"
</FilesMatch>
</IfModule>
# ----------------------------------------------------------------------
# Proper MIME type for all files
# ----------------------------------------------------------------------
# JavaScript
# Normalize to standard type (it's sniffed in IE anyways)
# tools.ietf.org/html/rfc4329#section-7.2
AddType application/javascript js
# Audio
AddType audio/ogg oga ogg
AddType audio/mp4 m4a
# Video
AddType video/ogg ogv
AddType video/mp4 mp4 m4v
AddType video/webm webm
# SVG
# Required for svg webfonts on iPad
# twitter.com/FontSquirrel/status/14855840545
AddType image/svg+xml svg svgz
AddEncoding gzip svgz
# Webfonts
AddType application/vnd.ms-fontobject eot
AddType application/x-font-ttf ttf ttc
AddType font/opentype otf
AddType application/x-font-woff woff
# Assorted types
AddType image/x-icon ico
AddType image/webp webp
AddType text/cache-manifest appcache manifest
AddType text/x-component htc
AddType application/x-chrome-extension crx
AddType application/x-opera-extension oex
AddType application/x-xpinstall xpi
AddType application/octet-stream safariextz
AddType application/x-web-app-manifest+json webapp
AddType text/x-vcard vcf
# ----------------------------------------------------------------------
# Allow concatenation from within specific js and css files
# ----------------------------------------------------------------------
# e.g. Inside of script.combined.js you could have
# <!--#include file="libs/jquery-1.5.0.min.js" -->
# <!--#include file="plugins/jquery.idletimer.js" -->
# and they would be included into this single file.
# This is not in use in the boilerplate as it stands. You may
# choose to name your files in this way for this advantage or
# concatenate and minify them manually.
# Disabled by default.
#<FilesMatch "\.combined\.js$">
# Options +Includes
# AddOutputFilterByType INCLUDES application/javascript application/json
# SetOutputFilter INCLUDES
#</FilesMatch>
#<FilesMatch "\.combined\.css$">
# Options +Includes
# AddOutputFilterByType INCLUDES text/css
# SetOutputFilter INCLUDES
#</FilesMatch>
# ----------------------------------------------------------------------
# Gzip compression
# ----------------------------------------------------------------------
<IfModule mod_deflate.c>
# Force deflate for mangled headers developer.yahoo.com/blogs/ydn/posts/2010/12/pushing-beyond-gzipping/
<IfModule mod_setenvif.c>
<IfModule mod_headers.c>
SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)\s*,?\s*)+|[X~-]{4,13}$ HAVE_Accept-Encoding
RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding
</IfModule>
</IfModule>
# HTML, TXT, CSS, JavaScript, JSON, XML, HTC:
<IfModule filter_module>
FilterDeclare COMPRESS
FilterProvider COMPRESS DEFLATE resp=Content-Type $text/html
FilterProvider COMPRESS DEFLATE resp=Content-Type $text/css
FilterProvider COMPRESS DEFLATE resp=Content-Type $text/plain
FilterProvider COMPRESS DEFLATE resp=Content-Type $text/xml
FilterProvider COMPRESS DEFLATE resp=Content-Type $text/x-component
FilterProvider COMPRESS DEFLATE resp=Content-Type $application/javascript
FilterProvider COMPRESS DEFLATE resp=Content-Type $application/json
FilterProvider COMPRESS DEFLATE resp=Content-Type $application/xml
FilterProvider COMPRESS DEFLATE resp=Content-Type $application/xhtml+xml
FilterProvider COMPRESS DEFLATE resp=Content-Type $application/rss+xml
FilterProvider COMPRESS DEFLATE resp=Content-Type $application/atom+xml
FilterProvider COMPRESS DEFLATE resp=Content-Type $application/vnd.ms-fontobject
FilterProvider COMPRESS DEFLATE resp=Content-Type $image/svg+xml
FilterProvider COMPRESS DEFLATE resp=Content-Type $image/x-icon
FilterProvider COMPRESS DEFLATE resp=Content-Type $application/x-font-ttf
FilterProvider COMPRESS DEFLATE resp=Content-Type $font/opentype
FilterChain COMPRESS
FilterProtocol COMPRESS DEFLATE change=yes;byteranges=no
</IfModule>
<IfModule !mod_filter.c>
# Legacy versions of Apache
AddOutputFilterByType DEFLATE text/html text/plain text/css application/json
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE text/xml application/xml text/x-component
AddOutputFilterByType DEFLATE application/xhtml+xml application/rss+xml application/atom+xml
AddOutputFilterByType DEFLATE image/x-icon image/svg+xml application/vnd.ms-fontobject application/x-font-ttf font/opentype
</IfModule>
</IfModule>
# ----------------------------------------------------------------------
# Expires headers (for better cache control)
# ----------------------------------------------------------------------
# These are pretty far-future expires headers.
# They assume you control versioning with cachebusting query params like
# <script src="application.js?20100608">
# Additionally, consider that outdated proxies may miscache
# www.stevesouders.com/blog/2008/08/23/revving-filenames-dont-use-querystring/
# If you don't use filenames to version, lower the CSS and JS to something like
# "access plus 1 week" or so.
<IfModule mod_expires.c>
ExpiresActive on
# Perhaps better to whitelist expires rules? Perhaps.
ExpiresDefault "access plus 1 month"
# cache.appcache needs re-requests in FF 3.6 (thanks Remy ~Introducing HTML5)
ExpiresByType text/cache-manifest "access plus 0 seconds"
# Your document html
ExpiresByType text/html "access plus 0 seconds"
# Data
ExpiresByType text/xml "access plus 0 seconds"
ExpiresByType application/xml "access plus 0 seconds"
ExpiresByType application/json "access plus 0 seconds"
# Feed
ExpiresByType application/rss+xml "access plus 1 hour"
ExpiresByType application/atom+xml "access plus 1 hour"
# Favicon (cannot be renamed)
ExpiresByType image/x-icon "access plus 1 week"
# Media: images, video, audio
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/jpg "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType video/ogg "access plus 1 month"
ExpiresByType audio/ogg "access plus 1 month"
ExpiresByType video/mp4 "access plus 1 month"
ExpiresByType video/webm "access plus 1 month"
# HTC files (css3pie)
ExpiresByType text/x-component "access plus 1 month"
# Webfonts
ExpiresByType application/x-font-ttf "access plus 1 month"
ExpiresByType font/opentype "access plus 1 month"
ExpiresByType application/x-font-woff "access plus 1 month"
ExpiresByType image/svg+xml "access plus 1 month"
ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
# CSS and JavaScript
ExpiresByType text/css "access plus 1 year"
ExpiresByType application/javascript "access plus 1 year"
<IfModule mod_headers.c>
Header append Cache-Control "public"
</IfModule>
</IfModule>
# ----------------------------------------------------------------------
# ETag removal
# ----------------------------------------------------------------------
# FileETag None is not enough for every server.
<IfModule mod_headers.c>
Header unset ETag
</IfModule>
# Since we're sending far-future expires, we don't need ETags for
# static content.
# developer.yahoo.com/performance/rules.html#etags
FileETag None
# ----------------------------------------------------------------------
# Stop screen flicker in IE on CSS rollovers
# ----------------------------------------------------------------------
# The following directives stop screen flicker in IE on CSS rollovers - in
# combination with the "ExpiresByType" rules for images (see above). If
# needed, un-comment the following rules.
# BrowserMatch "MSIE" brokenvary=1
# BrowserMatch "Mozilla/4.[0-9]{2}" brokenvary=1
# BrowserMatch "Opera" !brokenvary
# SetEnvIf brokenvary 1 force-no-vary
# ----------------------------------------------------------------------
# Cookie setting from iframes
# ----------------------------------------------------------------------
# Allow cookies to be set from iframes (for IE only)
# If needed, uncomment and specify a path or regex in the Location directive
# <IfModule mod_headers.c>
# <Location />
# Header set P3P "policyref=\"/w3c/p3p.xml\", CP=\"IDC DSP COR ADM DEVi TAIi PSA PSD IVAi IVDi CONi HIS OUR IND CNT\""
# </Location>
# </IfModule>
# ----------------------------------------------------------------------
# Start rewrite engine
# ----------------------------------------------------------------------
# Turning on the rewrite engine is necessary for the following rules and features.
# FollowSymLinks must be enabled for this to work.
<IfModule mod_rewrite.c>
Options +FollowSymlinks
RewriteEngine On
</IfModule>
# ----------------------------------------------------------------------
# Suppress or force the "www." at the beginning of URLs
# ----------------------------------------------------------------------
# The same content should never be available under two different URLs - especially not with and
# without "www." at the beginning, since this can cause SEO problems (duplicate content).
# That's why you should choose one of the alternatives and redirect the other one.
# By default option 1 (no "www.") is activated. Remember: Shorter URLs are sexier.
# no-www.org/faq.php?q=class_b
# If you rather want to use option 2, just comment out all option 1 lines
# and uncomment option 2.
# IMPORTANT: NEVER USE BOTH RULES AT THE SAME TIME!
# ----------------------------------------------------------------------
# Option 1:
# Rewrite "www.example.com -> example.com"
<IfModule mod_rewrite.c>
RewriteCond %{HTTPS} !=on
RewriteCond %{HTTP_HOST} ^www\.(.+)$ [NC]
RewriteRule ^ http://%1%{REQUEST_URI} [R=301,L]
</IfModule>
# ----------------------------------------------------------------------
# Option 2:
# To rewrite "example.com -> www.example.com" uncomment the following lines.
# Be aware that the following rule might not be a good idea if you
# use "real" subdomains for certain parts of your website.
# <IfModule mod_rewrite.c>
# RewriteCond %{HTTPS} !=on
# RewriteCond %{HTTP_HOST} !^www\..+$ [NC]
# RewriteRule ^ http://www.%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
# </IfModule>
# ----------------------------------------------------------------------
# Built-in filename-based cache busting
# ----------------------------------------------------------------------
# If you're not using the build script to manage your filename version revving,
# you might want to consider enabling this, which will route requests for
# /css/style.20110203.css to /css/style.css
# To understand why this is important and a better idea than all.css?v1231,
# read: github.com/h5bp/html5-boilerplate/wiki/Version-Control-with-Cachebusting
# Uncomment to enable.
# <IfModule mod_rewrite.c>
# RewriteCond %{REQUEST_FILENAME} !-f
# RewriteCond %{REQUEST_FILENAME} !-d
# RewriteRule ^(.+)\.(\d+)\.(js|css|png|jpg|gif)$ $1.$3 [L]
# </IfModule>
# ----------------------------------------------------------------------
# Prevent SSL cert warnings
# ----------------------------------------------------------------------
# Rewrite secure requests properly to prevent SSL cert warnings, e.g. prevent
# https://www.example.com when your cert only allows https://secure.example.com
# Uncomment the following lines to use this feature.
# <IfModule mod_rewrite.c>
# RewriteCond %{SERVER_PORT} !^443
# RewriteRule ^ https://example-domain-please-change-me.com%{REQUEST_URI} [R=301,L]
# </IfModule>
# ----------------------------------------------------------------------
# Prevent 404 errors for non-existing redirected folders
# ----------------------------------------------------------------------
# without -MultiViews, Apache will give a 404 for a rewrite if a folder of the same name does not exist
# e.g. /blog/hello : webmasterworld.com/apache/3808792.htm
Options -MultiViews
# ----------------------------------------------------------------------
# Custom 404 page
# ----------------------------------------------------------------------
# You can add custom pages to handle 500 or 403 pretty easily, if you like.
ErrorDocument 404 /404.html
# ----------------------------------------------------------------------
# UTF-8 encoding
# ----------------------------------------------------------------------
# Use UTF-8 encoding for anything served text/plain or text/html
AddDefaultCharset utf-8
# Force UTF-8 for a number of file formats
AddCharset utf-8 .css .js .xml .json .rss .atom
# ----------------------------------------------------------------------
# A little more security
# ----------------------------------------------------------------------
# Do we want to advertise the exact version number of Apache we're running?
# Probably not.
## This can only be enabled if used in httpd.conf - It will not work in .htaccess
# ServerTokens Prod
# "-Indexes" will have Apache block users from browsing folders without a default document
# Usually you should leave this activated, because you shouldn't allow everybody to surf through
# every folder on your server (which includes rather private places like CMS system folders).
<IfModule mod_autoindex.c>
Options -Indexes
</IfModule>
# Block access to "hidden" directories whose names begin with a period. This
# includes directories used by version control systems such as Subversion or Git.
<IfModule mod_rewrite.c>
RewriteRule "(^|/)\." - [F]
</IfModule>
# Block access to backup and source files
# This files may be left by some text/html editors and
# pose a great security danger, when someone can access them
<FilesMatch "\.(bak|config|sql|fla|psd|ini|log|sh|inc|~|swp)$">
Order allow,deny
Deny from all
Satisfy All
</FilesMatch>
# If your server is not already configured as such, the following directive
# should be uncommented in order to set PHP's register_globals option to OFF.
# This closes a major security hole that is abused by most XSS (cross-site
# scripting) attacks. For more information: http://php.net/register_globals
#
# IF REGISTER_GLOBALS DIRECTIVE CAUSES 500 INTERNAL SERVER ERRORS :
#
# Your server does not allow PHP directives to be set via .htaccess. In that
# case you must make this change in your php.ini file instead. If you are
# using a commercial web host, contact the administrators for assistance in
# doing this. Not all servers allow local php.ini files, and they should
# include all PHP configurations (not just this one), or you will effectively
# reset everything to PHP defaults. Consult www.php.net for more detailed
# information about setting PHP directives.
# php_flag register_globals Off
# Rename session cookie to something else, than PHPSESSID
# php_value session.name sid
# Do not show you are using PHP
# Note: Move this line to php.ini since it won't work in .htaccess
# php_flag expose_php Off
# Level of log detail - log all errors
# php_value error_reporting -1
# Write errors to log file
# php_flag log_errors On
# Do not display errors in browser (production - Off, development - On)
# php_flag display_errors Off
# Do not display startup errors (production - Off, development - On)
# php_flag display_startup_errors Off
# Format errors in plain text
# Note: Leave this setting 'On' for xdebug's var_dump() output
# php_flag html_errors Off
# Show multiple occurrence of error
# php_flag ignore_repeated_errors Off
# Show same errors from different sources
# php_flag ignore_repeated_source Off
# Size limit for error messages
# php_value log_errors_max_len 1024
# Don't precede error with string (doesn't accept empty string, use whitespace if you need)
# php_value error_prepend_string " "
# Don't prepend to error (doesn't accept empty string, use whitespace if you need)
# php_value error_append_string " "
# Increase cookie security
<IfModule php5_module>
php_value session.cookie_httponly true
</IfModule>
================================================
FILE: 404.html
================================================
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Page Not Found</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {
line-height: 1.2;
margin: 0;
}
html {
color: #888;
display: table;
font-family: sans-serif;
height: 100%;
text-align: center;
width: 100%;
}
body {
display: table-cell;
vertical-align: middle;
margin: 2em auto;
}
h1 {
color: #555;
font-size: 2em;
font-weight: 400;
}
p {
margin: 0 auto;
width: 280px;
}
@media only screen and (max-width: 280px) {
body, p {
width: 95%;
}
h1 {
font-size: 1.5em;
margin: 0 0 0.3em;
}
}
</style>
</head>
<body>
<h1>Page Not Found</h1>
<p>Sorry, but the page you were trying to view does not exist.</p>
</body>
</html>
<!-- IE needs 512+ bytes: http://blogs.msdn.com/b/ieinternals/archive/2010/08/19/http-error-pages-in-internet-explorer.aspx -->
================================================
FILE: README.md
================================================
This site is mostly kaput. It hasn't been touched in a while.
------------------------------------------------
# movethewebforward.org
You ♡ Web Standards. You maybe even feel compelled to “give back” to the community. Curious about where to start? We’re here to help.
## Contributing
Do you have some ideas for ways that all developers—from the seasoned professionals to those donning their first blue beanie—can get involved, learn more, and help move web standards forward? [Chime in here](https://etherpad.mozilla.org/igotmybeanie) or look at the github issues!. We'll be adding new ideas, resources and tasks regularly so feel free to check back often.
## IRC channel
We're in #movethewebforward on freenode IRC. For those without an IRC client see <http://webchat.freenode.net/?channels=movethewebforward>
## Staging server
View the current site at <http://h5bp.github.com/movethewebforward/>
## Dev Notes
Add `?mobile` to the end of `index.html` to see assets as they will appear on mobile devices (determined by screen size, really), and “?basic” to see assets as they will appear in browsers that don’t support media queries. I haven’t done much in the way of styling either way. There’s quite a bit of behind-the-scenes logic goin’ on that we most definitely will not need for a one-pager, so a lot of that will be removed very soon.
================================================
FILE: ar/ar.css
================================================
body {
text-align: right;
direction: rtl;
}
.hed-lead {
background: url(rtl-webasaurs.gif) center 0 no-repeat;
}
.hed {
float: right;
}
/* inverse the direction of some block */
.inverse_dir{
direction:ltr;
}
.inverse_align{
text-align:left;
}
.task li:before,
.resources > li:before {
float: right;
padding: .1em 0 0 .6em;
}
nav li {
padding: 0 10px 0 0;
width: 285px;
}
nav a:hover, nav a:focus, nav a.active {
outline:none;
}
.col-a {
float: right;
}
.col-b {
float: left;
}
@media screen and (min-width: 800px) {
.col-split p {
padding: 0 2px 1em 0;
}
}
================================================
FILE: ar/index.html
================================================
<!DOCTYPE html public "i ♥ the web">
<!--[if lt IE 9]> <html class="no-js oldie no-fontface" lang="ar" dir="rtl"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js no-fontface" lang="ar" dir="rtl"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<title>إدفع الويب إلى الأمام | دليلك للمشاركة فى معايير المتصفحات وتطوير الويب.</title>
<meta name="description" content="What you can do as a front-end developer">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
<!-- For iPhone 4 with high-resolution Retina display: -->
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="apple-touch-icon-114x114-precomposed.png">
<!-- For first-generation iPad: -->
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="apple-touch-icon-72x72-precomposed.png">
<!-- For non-Retina iPhone, iPod Touch, and Android 2.1+ devices: -->
<link rel="apple-touch-icon-precomposed" href="apple-touch-icon-precomposed.png">
<link rel="stylesheet" href="/css/style.css">
<link rel="stylesheet" href="ar.css">
<!-- Should be combined: -->
<script src="/js/libs/modernizr.min.js"></script>
<script src="/js/controller.js"></script>
</head>
<body>
<b class="gimmick"><i></i><i></i><i></i></b>
<header class="col-ab">
<div class="lead">
<h1 class="hed-lead">إدفع الويب إلى الأمام<span></span></h1>
<h2 class="subhed-lead">يمكنك أن تجعل الويب رائع كما تحب أن يكون</h2>
<p class="subhed">تحب <a href="http://bit.ly/xuni7z">معايير الويب</a> – وتريد أن تشارك فى مجتمع الويب. وتريد أن تعرف من أين تبدأ؟ <b>نحن هنا لمساعدتك</b></p>
</div>
<div class="col-split">
<p>سواء كنت مطور مواقع موهوب تبنى مواقع منذ بداية ظهور الويب, أو أنك هاوى تستمتع بتطوير بعض المواقع, فإنك تستجد هنا طرق تمكنك من المشاركة فى مجتمع الويب. فى الأسفل, وضعنا طرق كثيرة تمكنك من المشاركة. </p>
<p>هدفنا أن نجعل من السهل لأى شخص أن يبدأ فى المشاركة فى مجتمع الويب, إما بالمعرفة أكثر حول طريقة عمل الويب, أو أن يتعلم من الأخرين أو يعلمهم. الويب تطور بفضل أشخاصاً مثلك, ونحن نريد أن نجعل من السهل لك أيضا أن تشارك.</p>
</div>
</header>
<div id="nav_container">
<nav id="toc">
<ul>
<li><a href=#levelup>إرتقي بمستواك</a></li>
<li><a href=#digdeep>تعمق أكثر</a></li>
<li><a href=#virtuoso>مبدع</a></li>
</ul>
</nav>
</div>
<article class="section">
<div class="standout" id=levelup>
<h1 class="hed">إرتقي بمستواك</h1>
<h2 class="subhed">عندما تعمل شئ تكون جيداً فيه. إذاً تعال نغوص فى مجتمع الويب</h2>
</div>
<section id="learn" class="col-ab">
<div class="col-a">
<h1 class="hed">تعلّم</h1>
<p>أحد الأشياء الرائعة عن الويب هي انه يتغير بإستمرار. ولربما كان هذا التغيير شاسع ومن الصعب إدراكه, فنحن هنا لنساعدك على اللحاق بهذه التغيرات وعلى فهمها - هنا ستجد مصادر كثيرة تساعدك على معرفة كيف تعمل برامج تصفح الأنترنت, وتساعدك على أن تكون على علم دائم بالتطورات والتغيرات التى تحدث فى هذة المتصفحات.</p>
<h2 id="how_do_i_keep_up_with_what8217s_landing_in_browsers" class="subhed">كيف أكون على علم دائم بالجديد فى هذة المتصفحات؟</h2>
<ul>
<li><a href="http://updates.html5rocks.com/2011/10/Keeping-up-with-HTML5-and-browser-support">Keeping up with HTML5 and browser support</a><span> - قائمة بمواقع ومصادر ترصد كل تغيير يحدث</span></li>
<li><a href="http://peter.sh/">Peter Beverloo’s Blog</a><span> - تحديثات أسبوعية بكل جديد فى WebKit و Chrome</span></li>
<li><a href="http://blog.whatwg.org/">The WHATWG Blog</a><span> - تلخيصات أسبوعية بكل مستجدات معايير الويب</span></li>
<li><a href="http://www.w3.org/QA/archive/open_web/">W3C’s open web</a><span> - تحديثات أسبوعية بكل جديد فى the Open Web Platform</span></li>
<li><a href="http://my.opera.com/ODIN/blog/">Opera Developer News</a><span> - رصد تطورات Opera's web platform</span>
<li><a href="http://updates.html5rocks.com">HTML5 Rocks updates</a><span> - الأخبار الهامة والعاجلة عن HTML5 و Chrome</span>
<li><a href="http://hacks.mozilla.org/">Mozilla Hacks</a><span> - تقدم تطبيقات رائعة ونظرة على إمكانيات ال HTML5</span>
<li><a href="http://blogs.msdn.com/b/ie/">IE Blog</a><span> - تحديثات المتصفح IE</span>
</ul>
<div class="inverse_dir">
<h3 id="follow_them_on_twitter" class="subhed">تابعهم على تويتر</h3>
<p>
من الجيد متابعة الحسابات الأتية </br>
(Opera developer relations) <a href="http://twitter.com/oDevRel">@oDevRel</a> </br>
(Chrome developer relations) <a href="http://twitter.com/ChromiumDev">@ChromiumDev</a> </br>
(Mozilla's web developer outpost) <a href="http://twitter.com/mozhacks">@mozhacks</a> </br>
(Internet Explorer Team) <a href="http://twitter.com/ie">@IE</a>
</p>
</div>
<h2 id="how_do_i_understand_how_browsers_work" class="subhed">كيف أعرف طريقة عمل المتصفح؟</h2>
<ul>
<li><a href="http://www.html5rocks.com/en/tutorials/internals/howbrowserswork/">How Browsers Work: Behind the Scenes of Modern Web Browsers</a> - مقال فى العمق عن كيفية عمل المتصفحات</li>
<li><a href="http://ontwik.com/javascript/txjs-2011-a9-alex-russell-life-of-a-button-element/?utm_source=feedburner&utm_medium=twitter&utm_campaign=Feed%3A+Ontwik+%28Ontwik%29">Life of a <button> element -by Alex Russell</a> - فيديو رائع عن كيف تتعامل المتصفحات الحديثة مع ال CSS, وماذا يحدث خلف الستار لتطبيق ال CSS</li>
</ul>
<h2 id="other_learning_resources" class="subhed">مصادر تعليمية أخرى</h2>
<ul>
<li><a href="http://css-tricks.com">CSS-tricks</a><span> - مدونة تقدم لمصممين المواقع مقالات رائعة ودروس ومواد للتحميل</span></li>
<li><a href="http://html5doctor.com">HTML5doctor</a><span> - مصدر رائع لمن يريد تعلم ال HTML5, وطريقة عملها, وطريقة تطبيقها اليوم.</span></li>
<li><a href="http://diveintohtml5.info/">Dive into HTML5</a><span> - تقدم نظرة عميقة على بعض إمكانيات ال HTML5</span></li>
<li><a href="http://addyosmani.com/blog/">Addy Osmani’s blog</a><span> - عدد هائل من المقلات للذين يريدون تعلم jQuery, JavaScript, HTML5, CSS3.</span></li>
<li><a href="http://paulirish.com">Paul Irish’s blog</a><span> - مدونة مهمة تساعدك على تطوير مواقع رائعة – وتأتيك بكل جديد عن تقنيات تطوير المواقع. </span></li>
<li><a href="http://dev.opera.com">Dev.Opera</a><span> - مقالات تعليم إمكانيات ال HTML5</span></li>
<li><a href="http://paulirish.com/2011/web-browser-frontend-and-standards-feeds-to-follow/">مصادر مهمة متنوعة عن متصفحات الويب ومعايير الويب</a> </li>
<li><a href="http://yuilibrary.com/theater/">YUI Theater</a><span> - فيديوهات عن تقنيات الويب ألقيت فى شركة ياهو على مدار السنين</span></li>
<li><a href="http://www.adobe.com/devnet/html5.html">Adobe Developer Connection</a><span> - مقالات وفيديوهات لتعلم HTML5 و CSS3 و mobile development.</span></li>
</ul>
<h2 id="reference_docs_wikis" class="subhed">مراجع وموسوعات</h2>
<ul>
<li><a href="https://developer.mozilla.org/en-US/">Mozilla’s MDN )Mozilla Developer Network)</a> - مستندات و مراجع رائعة ولا غنى عنها عن HTML, CSS, JavaScript, DOM, وأشياء أخرى. وهو أيضا مكان جيد للمشاركة - و يمكنك معرفة <a href="https://developer.mozilla.org/Project:en/How_to_Help">كيف تساهم</a> وتعلم <a href="https://developer.mozilla.org/Project:en/Getting_started">كيف تبدأ</a>.</li>
<li><a href="https://developer.mozilla.org/Writing_Forward_Compatible_Websites">Forward-compatible websites</a> - قائمة بأفضل الممارسات فى تطوير المواقع والتى ستعمل دائما حتى مع تغييرات متصفحات الويب.</li>
<li><a href="http://html5please.com/">HTML5 Please - Use new and shiny responsibly</a> - موسوعة لتقنيات ال HTML5 , ويمكنك البحث عن تقنية معينة ومعرفة هل تستخدمها ام لا ومتى تستخدمها.</li>
</ul>
</div>
<div class="col-b">
<section class="getinvolved">
<h2 class="subhed">إكتساب الخبرة؟</h2>
<div class="task" data-hashtag="#learn">
<p>كل ما فى الأمر هو قراءة بعض المقالات والتغريدات لتكتسب الخبرة, ثق بنا حيثما بدأت ستجد أن الأمر يصبح أسهل.</p>
<a href="#" class="pledge">نعم, أريد البدء</a>
<div class="pledges"><p>هؤلاء بعض من قرروا البدء أيضا:</p></div>
</div>
</section>
</div>
</section>
<section id="meetups" class="col-ab">
<div class="col-a">
<h1 class="hed">قابل مطورون أخرون</h1>
<p>حضور المقابلات والمؤتمرات المحلية فرصة جيدة لمقابلة المطوريين الأخرين ولمشاركة الأفكار والخبرات معهم,
مواقع مثل
<a href="http://wusu.me/">WhatIsUpStartups</a>
ستساعدك فى معرفة الأحداث والمؤتمرات القريبة منك.</p>
</div>
</section>
<section id="askhelp" class="col-ab">
<div class="col-a">
<h1 class="hed">أطلب المساعدة</h1>
<h2 id="answer_questions_and_participate_in_conversations_on_irc" class="subhed">إسأل وجاوب على الأسئلة وشارك فى المحادثات على ال
<a href="http://bit.ly/zsq18Z">IRC</a></h2>
<p><a href="http://richard.esplins.org/siwi/2011/07/08/getting-started-freenode-irc/">كيف تبدأ مع ال irc و موقع freenode</a></p>
<ul>
<li><b>قنوات او غرف IRC هامة على موقع <a href="http://webchat.freenode.net">irc.freenode.net</a>:</b> </br>
<p class="inverse_dir">#html5 / #css / #javascript / #whatwg / #jquery / #yui / #dojo / #web/ #bbg </p></li>
<li id="mozilla_irc">وقناة js# على <a href="http://irc.mozilla.org">irc.mozilla.org</a></li>
</ul>
<h2 id="how_to_ask_for_help" class="subhed">كيف تطلب المساعدة</h2>
<ol class="tasks">
<li>من الأفضل , بل يجب أن <a href="https://css-tricks.com/seriously-just-make-a-jsfiddle/">تقوم بعمل jsfiddle </a>أولاً.</li>
<li><a href="https://css-tricks.com/reduced-test-cases/">قلل مساحة البحث عن المشكلة</a>.</li>
<li>تذكر: كن دقيقاً</li>
<li>إسأل على IRC أو <a href="http://stackoverflow.com"> StackOverflow </a> و <a href="http://chat.stackoverflow.com/rooms/17/javascript">ساحة المحادثات الخاصة به</a> أو أصدقائك.
</ol>
</div>
<div class="col-b">
<section class="getinvolved">
<h2 class="subhed">يد المساعدة</h2>
<div class="task" data-hashtag="#ask4help">
<p>كلنا وصلنا إلى ما وصلنا إلية بالإعتماد على بعضنا. لا تكن خجولا, وأسال عما تريد. ولكن تذكر ان تقوم بعمل jsfiddle.</p>
<a href="#" class="pledge">نعم, سأفعل</a>
<div class="pledges"><p>هنا بعض المطوريين الذين قرروا فعل ذلك أيضا:</p></div>
</div>
</section>
</div>
</section>
</article>
<article class="section">
<div class="standout" id=digdeep>
<h1 class="hed">تعمق أكثر</h1>
<h2 class="subhed">تعرف طريقك بوضوح. إذا هذا هو الوقت لتبدأ بالعمل</h2>
</div>
<section id="helpothers" class="col-ab">
<div class="col-a">
<h1 class="hed">ساعد الأخرين</h1>
<p>نحن جميعا نستفيد من بعضنا ونحتاج المساعدة من وقت إلى أخر, ومساعدة الأخرين تعمل على تثبيت المعلومات لديك,
وتزيد من إدراكك وفهمك للتقنيات المختلفة.
فى الأسفل ستجد مشاريع مفتوحة تحتاج إلى مساعدتك. تذكر ليس هناك مساهمة صغيرة, بل كل مساهمة لها قيمة.</p>
<h2 id="open_source_projects_worth_your_time" class="subhed">مشاريع مفتوحة المصدر تحتاج إلى وقتك</h2>
<ul>
<li><a href="http://github.com/h5bp/html5-boilerplate">HTML5 Boilerplate</a> <span>- مشروع يساعدك على تطوير موقعك باستخدام افضل الممارسات.</span>
<li><a href="https://github.com/jquery/learn.jquery.com">jQuery Learning Site</a> <span>- موقع تعليمى لمكتبة جافاسكريبت المشهورة jQuery.</span>
<li><a href="https://github.com/jquery/jquery-mobile">jQuery Mobile</a> <span>- افضل الممارسات عن البرمجة للهواتف النقالة</span>
<li><a href="https://github.com/Modernizr/Modernizr">Modernizr</a> <span>- مشروع يساعدك على الكشف عن التقنيات التى يدعمها المتصفح قبل تطبيقها.</span>
<li><a href="https://github.com/twbs/bootstrap">Bootstrap</a> <span>- سجادة عمل لكل من HTML و CSS و JS تساعدك على بناء تطبيقات الويب بسرعة – مقدمة من تويتر.</span>
<li><a href="http://necolas.github.com/normalize.css/">Normalize.css</a> <span>- مشروع لجعل كل المتصفحات تعرض مواقع الانترنت بنفس الطريقة.</span>
<li><a href="http://dojotoolkit.org/get-involved">Dojo</a> <span>- سجادة عمل شاملة لتطوير تطبيقات الويب والهواتف النقالة.</span>
<li><a href="https://github.com/h5bp/lazyweb-requests/issues?state=open">Lazyweb requests</a> <span>- ادوات وحلول من الرائع ان يمتلكها مطورى الويب.</span>
</ul>
<p>قم بإتباع خطوات<a href="#how_to_ask_for_help"> ’طلب المساعدة‘ </a> فى الأعلى وألق نظرة على <a href="http://addyosmani.com/blog/getting-involved-with-open-source/">بودكاست Addy Osmani عن كيفية المشاركة</a> ! </p>
</div>
<div class="col-b">
<section class="getinvolved">
<h2 class="subhed">شارك بخبرتك</h2>
<div class="task" data-hashtag="#helpothers">
<p>قراءة الكود العالى المستوى تؤدى إلى كتابة كود عالى المستوى, تصفح كود المشاريع الموضوعة هنا, وساعد على تطويرهم وجعلهم أفضل.</p>
<a href="#" class="pledge">نعم, سأفعل ذلك</a>
<div class="pledges"><p>هنا بعض المطوريين الذين قرروا فعل ذلك أيضا:</p></div>
</div>
</section>
</div>
</section>
<section id="specs" class="col-ab">
<div class="col-a">
<h1 class="hed">أرسل تعليقاتك على المواصفات</h1>
<p>المواصفات specifications (وهى عبارة عن وصف دقيق لما ينبغى ان تكون علية التقنية او لغة البرمجة وكيف يتم استخدامها) تحدد وتنظم طريقة الأستخدام,
ويتم وضعها من قبل فريق عمل Working Groups -WG من خلال محادثات مكثفة عن طريق البريد الإلكترونى.
ولكن يبقى الإحتمال ان تقوم شركات متصفحات الويب بإنتاج متصفحات لا تتبع هذة المواصفات,
وعندها يجب ان نقف نحن المطوريين ضد هذة البرامج ونقوم بإرسال feedback بكل خطأ نجدة فى هذة البرامج.</p>
<ul>
<li>تعرف على <a href="http://diveintohtml5.info/past.html">تاريخ الإنترنت</a>.</li>
<li> إلقى نظرة على<a href="http://fantasai.inkedblade.net/weblog/2011/inside-csswg/"> كيفية عمل مجموعات ال CSS</a>.</li>
<li>إشترك فى هذة القوائم البريدية لتتابع المشاركات والمناقشات التى تقود الويب:
<ul class="resources">
<li><a href="http://lists.w3.org/Archives/Public/public-webapps/">public-webapps</a> - مناقشات تقنية عن تطوير تطبيقات الويب</li>
<li><a href="http://lists.w3.org/Archives/Public/www-style/">www-style</a> - مناقشات تقنية عن ال CSS </li>
<li><a href="http://lists.whatwg.org/pipermail/whatwg-whatwg.org/">whatwg</a> - القائمة البريدية ل Web Hypertext Application Technology Working Group </li>
<li><a href="http://lists.w3.org/Archives/Public/public-html/">public-html</a> - مناقشات تقنية حول HTML</li>
<li><a href="http://lists.w3.org/Archives/Public/www-dom/">www-dom</a> - مناقشات تقنية عن ال DOM </li>
<li><a href="http://lists.w3.org/Archives/Public/public-fx/">public-fx</a> - مناقشات حول القضايا التى توثر على ال CSS و SVG</li>
</ul>
</li>
<li>إقرأ <a href="http://developers.whatwg.org/">HTML5 Spec for developers</a> تم حذف ما لا يهم المطورين وتم تصميمها بطريقة جميلة</li>
<li>أسهل طريقة لترسل تعليق او تبلغ عن خطا فى <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/">HTML specification</a> هى أن تقوم بتحديد الجزء الذى تريد ان تبلغ عنة ثم تكتب تعليقك فى الشريط اسفل الصفحة.</li>
<li>
تعرف على أخر القضايا حول ال HTML و CSS عن طريق متابعة الحسابات الاتية
<ul class="resources inverse_dir">
<li><a href="http://twitter.com/whatwg">@whatwg</a></li>
<li><a href="http://twitter.com/csscommits">@csscommits</a></li>
</ul>
</li>
</ul>
</div>
<div class="col-b">
<section class="getinvolved">
<h2 class="subhed">هل ستساهم؟</h2>
<div class="task" data-hashtag="#feedback">
<p>نحن الذين نستخدم المواصفات,
فلماذا لا نساعد على عمل المواصفات التى نحب؟
دعنا نجعلها أفضل مما هى علية الأن.</p>
<a href="#" class="pledge">نعم, سأفعل ذلك.</a>
<div class="pledges"><p>هنا بعض المطوريين الذين قرروا فعل ذلك أيضا:</p></div>
</div>
</section>
</div>
</section>
<section id="explore" class="col-ab">
<div class="col-a">
<h1 class="hed">إكتشف الإمكانيات الجديدة</h1>
<p>إذا كنت قد تعلمت الأساسيات,
فهذا هو الوقت لتتعمق أكثر.
هنا سوف نتعرف على Advanced CSS و الامكانيات الجديدة فى HTML ومستقبل هذة التقنيات.
العديد من الأمكانيات متوفر دعمها الأن فى متصفحات الويب
وإكتشاف هذة الإمكانيات والمميزات يساعدنا على دفع الويب إلى الأمام.</p>
<h2 id="examples_of_how_to_explore_features_well" class="subhed">أمثلة على أفضل الطرق للتعرف على الإمكانيات الجديدة</h2>
<ul class="inverse_dir inverse_align">
<li><a href="http://perfectionkills.com/global-eval-what-are-the-options/">Global <code>eval</code>: what are the options?</a> <span> - kangax</span>
<li><a href="http://nicolasgallagher.com/multiple-backgrounds-and-borders-with-css2/">Multiple Backgrounds and Borders with CSS 2.1</a> <span> - Nicolas Gallagher</span>
<li><a href="http://nicolasgallagher.com/css-background-image-hacks/">CSS background-image hacks</a> <span> - Nicolas Gallagher</span>
<li><a href="http://www.webdirections.org/blog/let-the-web-move-you-css3-animations-and-transitions/">Let the Web move you — CSS3 Animations and Transitions</a> <span> - John Allsopp</span>
<li><a href="http://addyosmani.com/largescalejavascript/">Patterns For Large-Scale JavaScript Application Architecture</a> <span> - Addy Osmani</span>
<li><a href="http://designfestival.com/the-cicada-principle-and-why-it-matters-to-web-designers/">The Cicada Principle and why it matters to web designers</a> <span> - Alex Walker</span>
<li><a href="http://css-tricks.com/snippets/css/webkit-keyframe-animation-syntax/">Keyframe animation syntax</a> <span> - Chris Coyier</span>
<li><a href="http://www.blog.highub.com/css/whats-new-in-css-selectors-level-4/">What's new in CSS Selectors (Level 4)</a> <span> - Shi Chuan</span>
<li><a href="http://mathiasbynens.be/notes/touch-icons">Everything you always wanted to know about touch icons</a> <span> - Mathias Bynens</span>
<li><a href="http://coding.smashingmagazine.com/2009/09/15/the-z-index-css-property-a-comprehensive-look/">The z-index CSS Property: A Comprehensive Look</a> <span> - Louis Lazaris</span>
</ul>
<h2 id="cool_ideas_to_explore_more" class="subhed">مميزات رائعة لتكتشفها ( وربما تكتب عنها )</h2>
<p>المتصفحات تضيف مميزات CSS دائما.
ونحن نكره الأوامر الخاصة بكل متصفح vendor prefixes لذلك نرسل تعليقاتنا عليها دائما وأنها لا تناسب عملنا.
لذلك تشجع ان تجرب كل ميزه جديدة وترسل تعليقك عليها.
وهذة نظرة على <a href="http://peter.sh/experiments/vendor-prefixed-css-property-overview/">vendor-prefixed CSS property</a>,
كتبها Peter Beverloo, وفيها العديد من اوامر ال CSS التى تحت التجربة - وكثير منها ليست معروفة وليست مفهومة عند الكثير.
يمكنك الكتابة عنها لتعلمها وتبسطها للمطوريين الاخرين - وهناك خواص أخرى مثل:
<ul class="inverse_dir inverse_align">
<li><a href="https://developer.mozilla.org/En/CSS/%3Achecked">The :checked selector</a> / <a href="http://dev.w3.org/csswg/css3-images/#object-fit">object-fit</a> / <a href="https://developer.mozilla.org/en/CSS/background-clip">background-clip</a> / <a href="https://dvcs.w3.org/hg/FXTF/raw-file/tip/filters/index.html">fx blur css filter</a> / <a href="http://dropshado.ws/post/1015351370/webkit-line-clamp">-webkit-line-clamp</a> / <a href="https://developer.mozilla.org/en/CSS/text-overflow">text-overflow</a> / <a href="https://developer.mozilla.org/En/CSS/Box-sizing">box-sizing</a> / <a href="https://developer.mozilla.org/en/CSS3_Columns">CSS columns</a></li>
<li><code>history.pushState()</code>, HTML5 input <code>checkValidity()</code>, <code>getClientRects</code> / <code>getBoundingClientRect</code>, WebKit's <a href="http://developer.apple.com/library/safari/#documentation/DataManagement/Reference/DOMWindowAdditionsReference/DOMWindowAdditions/DOMWindowAdditions.html">ConvertPointFromPageToNode</a>
<li><a href="http://www.w3.org/TR/css3-gcpm/">CSS Generated Content for Paged Media Module (GCPM)</a>
<li>Differences between <code>word-wrap</code>, <code>word-break</code>, and <code>white-space</code>
<li>Harmony features like <a href="http://wiki.ecmascript.org/doku.php?id=harmony:let">let</a> / <a href="http://wiki.ecmascript.org/doku.php?id=harmony:block_scoped_bindings">block-scoped bindings</a> / block functions / <a href="http://wiki.ecmascript.org/doku.php?id=harmony:destructuring">destructuring</a> / <a href="http://wiki.ecmascript.org/doku.php?id=harmony:rest_parameters">rest parameters</a> / <a href="http://wiki.ecmascript.org/doku.php?id=harmony:parameter_default_values">default param values</a>.
<li><a href="http://dvcs.w3.org/hg/webcomponents/raw-file/tip/explainer/index.html">Web Components Explained (very early draft)</a>
<li><strong>Any features from these presentations:</strong>
<ul>
<li><a href="http://vimeo.com/32135328">The Future of CSS</a> <span>- Tab Atkins on what to expect from CSS in the future.</span>
<li><a href="http://infrequently.org/11/fronteers/fronteers.html">Data, Semantics, and the Process of Progress </a> <span>- browser evolution, Component Model, MDV</span>
<li><a href="http://infrequently.org/11/ldnjs/ldnjs.html">[JS|DOM].next()</a> <span>- Alex Russell on the next version of ECMAScript.</span>
<li><a href="http://lea.verou.me/css3-secrets/">CSS3 Secrets</a> <span>- an interactive presentation on advanced CSS3 functionality.</span>
<li><a href="http://nimbu.in/w3conf/">The Future of Layouts in CSS</a> <span>- and how emerging specs will add proper layout control to CSS</span>
<li><a href="http://mezzoblue.com/presentations/2011/fowd/FOWD.pdf">The Future of CSS</a> <span>- an overview of a number of surfacing CSS features.</span>
</ul>
</ul>
</div>
<div class="col-b">
<section class="getinvolved">
<h2 class="subhed">إكتشف المجهول</h2>
<div class="task" data-hashtag="#explore">
<p>الطريقة الوحيدة لدفع الويب إلى الأمام هى تعلم التقنيات المتقدمة ومن ثم إستخدامها.
وستستمتع بتعلم هذة التقنيات كثيراً.</p>
<a href="#" class="pledge">نعم سأفعل ذلك</a>
<div class="pledges"><p>هنا بعض المطوريين الذين قرروا فعل ذلك أيضا:</p></div>
</div>
</section>
</div>
</section>
<section id="write" class="col-ab">
<div class="col-a">
<h1 class="hed">أكتب</h1>
<p>أنشر ما تعلمتة ولا تخف من إرتكاب الأخطاء.
أنشر على مدونتك و أحرص على ان تكون مقالاتك محدثة دائما.
وقم بعمل مناقشات مع قراء مدونتك وعلمهم وتعلم منهم.</p>
<p>تعليم الناس هو طريقة جيدة للتعلم ولتثبيت المعلومات.
لذلك فأنت تستفيد انت ايضا عندما تعلم الناس</p>
<h2 id="what_should_you_start_to_learn_about" class="subhed">ما الذى يجب ان تكتب عنة؟</h2>
<p>أشياء يمكن ان تعلمها للناس: هنا ستجد أفكار جيدة</p>
<ul>
<li>لماذا وُجدت هذة التاج <code><br></code> و <code><hr></code>؟</li>
<li>كيف تقوم بعمل slideshow بأقل قدر ممكن من الكود ؟</li>
<li>ما هو ال DOM ؟ ولماذا وُجد ؟</li>
<li>أنظر كيف يقوم المتصفح بتطبيق أى واحدة من ال CSS property , وقارن هذا مع ال CSS specifications </li>
<li>كيف تقوم المواقع المشهورة بعمل صفحتها الرئيسية .</li>
<li>كيف يمكنك إصلاح أحد أخطاء المواقع الكبيرة (مثل: وقت كبير فى التحميل - خطا فى الجافاسكربت - او أخرى )</li>
<li>خذ Demo مشهورة و أشرحها بطريقة مختلفة او اشرحها هى نفسها</li>
<li>قم بعمل تلخيص للأفكار التى تدور فى الويب مؤخراً.</li>
<li>أكتب عن خبرتك فى المشاريع المفتوحة المصدر.</li>
<li>كيف يمكن لل
<a href="http://www.catswhocode.com/blog/8-css-preprocessors-to-speed-up-development-time"> CSS preprocessor </a>
أن تؤدى إلى اخطاء فى الكود, إذا لم يتم التعامل معها بطريقة صحيحة
</li>
<li>إذا كانت لغتك الأم غير الإنجليزية:
<ul class="resources">
<li>ترجم بعض المقالات المهمة والمشهورة عن تطوير وبرمجة الويب.</li>
<li>وضح الأشياء الغامضة او الغير معروفة فى ال specifications</li>
</ul>
</li>
</ul>
</div>
<div class="col-b">
<section class="getinvolved">
<h2 class="subhed">أكتب</h2>
<div class="task" data-hashtag="#write">
<p>ولا تلتفت إلى عدد القراء او عدد المتابعين لك على تويتر - قدم ما تعلمتة وسيكون هناك من يستفيد</p>
<a href="#" class="pledge">نعم, سأفعل ذلك</a>
<div class="pledges"><p>هنا بعض المطوريين الذين قرروا فعل ذلك أيضا:</p></div>
</div>
</section>
</div>
</section>
<section id="filebugs" class="col-ab">
<div class="col-a">
<h1 class="hed">بلغ عن الأخطاء</h1>
<p>يجب على شركات المتصفحات أن تعالج أخطاء المتصفحات بجدية اكثر, وعلينا ان نساعدهم فى ذلك.</p>
<ul>
<li><a href="http://coding.smashingmagazine.com/2011/09/07/help-the-community-report-browser-bugs/">ساعد مجتمع الويب: بلغ عن أخطاء المتصفحات</a> - كتبه Lea Verou</li>
<li><a href="http://ejohn.org/blog/a-web-developers-responsibility/">مسئولية مطوري الويب</a> - كتبه John Resig</li>
<li><a href="http://a11ybugs.org/">Help prioritize browser accessibility bugs</a> - كتبه Vlad Alexander</li>
<li>
<p>المواقع الخاصة بأخطاء المتصفحات - ساهم فى حل خطا موجود بالفعل أو بلغ عن خطأ جديد:</p>
<ul class="resources">
<li><a href="https://bugzilla.mozilla.org/">Mozilla's bugzilla</a></li>
<li><a href="https://bugs.webkit.org/">WebKit bugs</a></li>
<li><a href="http://crbug.com/">Chrome bugs</a></li>
<li><a href="http://www.opera.com/support/bugs/">Opera bugs</a></li>
<li><a href="https://connect.microsoft.com/site/sitehome.aspx?SiteID=136">Help IE</a></li>
</ul>
</li>
</ul>
</div>
<div class="col-b">
<section class="getinvolved">
<h2 class="subhed"> إقضى على مشاكل المتصفحات</h2>
<div class="task" data-hashtag="#filebugs">
<p>هذة هى أسرع طريقة لتحسيين اداء المتصفحات -
عن طريق التبليغ عن المشاكل وحلها.
هذة العملية لا تستغرق بضع دقائق, ويمكن لأى شخص القيام بها.</p>
<a href="#" class="pledge">نعم, سأشارك فى ذلك</a>
<div class="pledges"><p>هنا بعض المطوريين الذين قرروا فعل ذلك أيضا:</p></div>
</div>
</section>
</div>
</section>
</article>
<article class="section">
<div class="standout" id=virtuoso>
<h1 class="hed">مبدع!</h1>
<h2 class="subhed">لديك خبرة طويلة, وأنت الأن محترف فى تقنيات الويب - إذا دعنا نقترح عليك بعض الأشياء</h2>
</div>
<section id="hack" class="col-ab">
<div class="col-a">
<h1 class="hed">
<a href="http://ar.wikipedia.org/wiki/%D9%87%D8%A7%D9%83%D8%B1#.D8.A7.D9.84.D8.AE.D9.84.D8.A7.D9.81_.D8.AD.D9.88.D9.84_.D8.AA.D8.B9.D8.B1.D9.8A.D9.81_.D8.A7.D9.84.D9.87.D8.A7.D9.83.D8.B1">هاك</a></h1>
<p>إدفع الويب إلى أقصى حدودة.
هاك على CSS او advanced HTML او JavaScript
او the browser's rendering engine.
ادخل على مواقع مثل github
, اختر مشروع وتفحص الكود جيدا وتعلم منة ثم ضع لمستك انت.
هيا نجعل الويب مكان رائع - هناك طرق كثيره لفعل ذلك:</p>
<h2 id="contribute_to_browsers" class="subhed">ساهم فى تطوير المتصفحات</h2>
<ul>
<li>ساعد فى تطوير أدوات المطوريين مثل
<a href="http://trac.webkit.org/wiki/WebInspector">WebKit Inspector</a>
و <a href="https://github.com/operasoftware/dragonfly/">Dragonfly</a>.
لقد تم برمجتهم بإستخدام HTML و CSS و JS
لذلك فأنت لا تحتاج انت تكون مبرمج ++C لتشارك فى تطويرهم.</li>
<li><a href="https://developer.mozilla.org/en/Gecko_BugAThon">قلل من ال test cases لموزيلا.</a></li>
<li>هاك على Gecko
<ul>
<li>إقرأ دليل المطوريين <a href="https://developer.mozilla.org/En/Developer_Guide">لتبدأ فى تطوير Gecko.</a>.
<li><a href="https://bugzilla.mozilla.org/buglist.cgi?quicksearch=%22[mentor%3D%22&list_id=1800469">قائمة ببعض اهم الأخطاء فى firefox و Gecko .</a>
<li>إشترك فى المحادثات على غرفتى introduction# و developers# على <a href="#mozilla_irc">Mozilla's IRC server</a>
</ul>
<li>هاك على Webkit
<ul>
<li><a href="http://dev.chromium.org/developers/contributing-to-webkit">دليل من جوجل للمساهمة فى تطوير Webkit.</a>
</ul>
</ul>
<h2 id="contribute_to_testsuites" class="subhed">ساهم فى
<a href="http://en.wikipedia.org/wiki/Test_suite">سلاسل الإختبارات</a></h2>
<p><a href="http://en.wikipedia.org/wiki/Test_case">الإختبارات</a> هى شئ أساسى عند وضع معايير الويب وتطوير المتصفحات.
ومن خلالها نتأكد من تعامل المتصفحات مع التقنيات بنفس الطريقة ام كل متصفح مختلف عن الأخر.
حالياً, سلاسل إختبارات W3C ليس لديها إختبارات بالقدر التى تحتاجة.
هذة الإختبارات تكتب بلغات تطوير الويب الأساسية HTML و CSS و JS.</p>
<ul class="inverse_dir inverse_align">
<li>Get overviews of the
<a href="http://www.w3.org/2008/webapps/wiki/Testing">w3c webapps test suite</a>, the
<a href="http://www.w3.org/html/wg/wiki/Testing">w3c HTML5 test suite</a>,
and the <a href="http://wiki.csswg.org/test">CSSWG test suite</a>.
</li>
<li>Look into <a href="http://www.w3.org/html/wg/wiki/Testing#New_tests">upstreaming some existing tests</a> into the W3C Test suite.</li>
<li>Upstream <a href="http://trac.webkit.org/browser/trunk/LayoutTests">WebKit’s LayoutTests</a>. <span>Also see the LayoutTests <a href="http://www.webkit.org/blog/1452/layout-tests-theory/">theory</a> & <a href="http://www.webkit.org/blog/1456/layout-tests-practice/">practice</a>.</span></li>
<li>Upstream <a href="https://developer.mozilla.org/en/Mochitest">Mozilla’s Mochitests</a>.</li>
<li>Join the conversation on <a href="http://lists.w3.org/Archives/Public/public-webapps-testsuite/">public-webapps-testsuite</a>, <a href="http://lists.w3.org/Archives/Public/public-html-testsuite/">public-html-testsuite</a>, and <a href="http://lists.w3.org/Archives/Public/public-css-testsuite/">public-css-testsuite</a>.</li>
<li>Contribute to HTML5 Audio on <a href="http://areweplayingyet.org">the AreWePlayingYet? test suite</a>.</li>
</ul>
<h2 id="contribute_to_specs" class="subhed">ساهم فى المواصفات specifications</h2>
<ul>
<li>راجع على الأخطاء الموجودة على <a href="http://www.w3.org/Bugs/Public/">W3C bugzilla</a> <span>- وتعلم <a href="http://wiki.whatwg.org/wiki/Bugzilla_conventions">Bugzilla conventions</a>.</span>
<li>شارك فى محادثات <a href="http://www.whatwg.org/mailing-list">WHATWG</a> / <a href="http://lists.w3.org/Archives/Public/public-webapps/">public-webapps</a> / <a href="http://lists.w3.org/Archives/Public/www-style/">www-style</a> / <a href="http://lists.w3.org/Archives/Public/public-fx/">public-fx</a>.</li>
<li><a href="http://dev.chromium.org/developers/how-tos/make-a-web-standards-proposal">قم بكتابة إقتراحات لمعايير الويب.</a>. <span>(هنا ستجد كيفية فعل ذلك.)</span>
<li><a href="http://wiki.whatwg.org/wiki/How_to_write_a_spec">أكتب بعض المواصفات. </a> </li>
</ul>
<h2 id="contribute_to_validators" class="subhed">ساهم فى
<a href="http://en.wikipedia.org/wiki/Validator">أدوات التحقق من صحة الكود</a></h2>
<ul class="inverse_dir inverse_align">
<li>
<a href="http://validator.nu/">HTML Validator</a> <span>needs some developer lovin', deets at <a href="https://github.com/h5bp/lazyweb-requests/issues/18">lazyweb-reqs/18</a></span>
<li>
<a href="http://lists.w3.org/Archives/Public/www-validator-css/">CSS Validator</a> <span>can always use some help. hop on that mailing list!</span>
<li>
<a href="https://bitbucket.org/annevk/webvtt">WebVTT</a> <span>a video subtitling format, is an active area of standards interest</span>
</ul>
</div>
<div class="col-b">
<section class="getinvolved">
<h2 class="subhed">أترك بصمتك</h2>
<div class="task" data-hashtag="#hack">
<p>طور بعض الأدوات.
تفحص وأختبر المشاريع.
شارك فى تطوير المتصفحات أو أدوات التحقق من صحة الكود أو المواصفات أو <a href="#open_source_projects_worth_your_time">المشاريع المفتوحة المصدر</a>.</p>
<a href="#" class="pledge">سأشارك بالتأكيد</a>
<div class="pledges"><p>هنا بعض المطوريين الذين قرروا فعل ذلك أيضا:</p>
</div>
</section>
</div>
</section>
</article>
<footer class="doc">
<p class="subhed summary">
يمكنك أن تجعل الويب رائع كما تحب .</br>
شركات المتصفحات والعاملين على معايير الويب وأخرون يحتاجون إلى مشاراكاتك ومساهماتك.
<br>معاً نستطيع أن ندفع الويب إلى الأمام.
</p>
<img src="/img/pugerton.png" alt="Pugerton">
<p class="subhed">قام بكتباتة - بكل حب</p>
<ul class="builders">
<li><a href="https://twitter.com/wilto"><img src="https://pbs.twimg.com/profile_images/477441227986444289/KHCUqTis_normal.png" alt="Mat Marquis"> <b>Mat</b> Marquis</a>
<li><a href="https://twitter.com/aaronforsander"><img src="https://pbs.twimg.com/profile_images/461528075788763138/c7ONSIRm_normal.jpeg" alt="Aaron Forsander"> <b>Aaron</b> Forsander</a>
<li><a href="https://twitter.com/connor"><img src="https://pbs.twimg.com/profile_images/526185574039031808/IpDbRAX5_normal.jpeg" alt="Connor Montgomery"> <b>Connor Montgomery</b></a>
<li><a href="https://twitter.com/paul_irish"><img src="https://pbs.twimg.com/profile_images/420826194083213312/CP1RmLa3_normal.jpeg" alt="Paul Irish"> <b>Paul</b> Irish</a>
<li><a href="https://twitter.com/divya"><img src="https://pbs.twimg.com/profile_images/550530231853776897/kni4F8oM_normal.png" alt="Diviya Manian"> <b>Divya</b> Manian</a>
<li><a href="https://twitter.com/necolas"><img src="https://pbs.twimg.com/profile_images/529444560179449857/eKdCJhvp_normal.jpeg" alt="Nicolas Gallagher"> <b>Nicolas</b> Gallagher</a>
<li><a href="https://twitter.com/addyosmani"><img src="https://pbs.twimg.com/profile_images/422476220442234880/jlx9HMtr_normal.jpeg" alt="Addy Osmani"> <b>Addy</b> Osmani</a>
</ul>
<p class="others">& <a href="https://github.com/h5bp/movethewebforward/contributors"><span>وكل هؤلاء المطوريين الرائعين.</span>.</a></p>
<p>قام بالترجمة - <a href="https://plus.google.com/u/0/110896024219505135276/about">مروان عبد المنعم</a> •</p>
<p>قامت بعمل صور الديناصورات - <a href="http://dribbble.com/deathbearbrown">Sue Lockwood</a> •</p>
<p><a href="https://github.com/h5bp/movethewebforward">قدم مساهمتك فى هذا المشروع</a></p>
</footer>
<script>
window._gaq=[['_setAccount','UA-17904194-2'],['_trackPageview']];
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
s.parentNode.insertBefore(g,s)}(document,'script'));
</script>
</body>
</html>
================================================
FILE: avatars.php
================================================
<?php
// Enable errors for easy debugging.
error_reporting(E_ALL);
ini_set('display_errors', '1');
// Configurable stuff.
define('URL', 'http://search.twitter.com/search.json');
define('SEARCH_PREFIX', '(ivegotmybluebeanieonnowwhat.com OR movethewebforward.com OR movethewebforward.org) AND ');
define('RPP', 100);
// Hashtags to search twitter for.
$queries = array(
"#learn",
"#ask4help",
"#helpothers",
"#feedback",
"#explore",
"#write",
"#filebugs",
"#hack"
);
// Don't let random scallywags run this script.
if ((isset($_SERVER['REMOTE_ADDR']) && $_SERVER['REMOTE_ADDR'] !== '127.0.0.1') || PHP_SAPI !== 'cli')
die('☹');
// Search twitter, return full json_decode()'d response.
function search($query, $page = 1) {
$url = URL . '?' . http_build_query(array(
'q' => SEARCH_PREFIX . $query,
'rpp' => RPP,
'page' => $page
));
$ch = curl_init($url);
curl_setopt($ch, CURLOPT_NOBODY, 0);
curl_setopt($ch, CURLOPT_HEADER, 0);
curl_setopt($ch, CURLOPT_USERAGENT, 'movethewebforward.org');
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, 1);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
$response = curl_exec($ch);
$status = curl_getinfo($ch, CURLINFO_HTTP_CODE);
curl_close($ch);
if ($status == 200) {
return json_decode($response);
}
else {
die("Twitter error: " . $status);
}
}
// Get all results for a query.
function getAll($query) {
$page = 0;
$avatars = array();
do {
$results = search($query, ++$page);
foreach ($results->results as $result) {
$avatars[$result->from_user] = $result->profile_image_url;
}
}
while (count($results->results) == RPP);
return $avatars;
}
// Merge new avatars into our file of existing avatars.
$avatars = json_decode(file_get_contents('avatars.json'));
foreach ($queries as $query) {
$avatars->$query = array_merge((array)$avatars->$query, getAll($query));
}
file_put_contents('avatars.json', json_encode($avatars));
================================================
FILE: build/build.xml
================================================
<?xml version="1.0"?>
<!DOCTYPE project>
<project name="Boilerplate Build" default="build" basedir="../"> <!-- one back since we're in build/ -->
<!-- Load in Ant-Contrib to give us access to some very useful tasks! -->
<!-- the .jar file is located in the tools directory -->
<taskdef resource="net/sf/antcontrib/antlib.xml">
<classpath>
<pathelement location="${basedir}/build/tools/ant-contrib-1.0b3.jar"/>
</classpath>
</taskdef>
<!-- load shell environment -->
<property environment="ENV" />
<!-- load property files -->
<property file="build/config/project.properties"/>
<property file="build/config/default.properties"/>
<!-- merge the stylesheet properties -->
<var name="stylesheet-files" value="${file.default.stylesheets}, ${file.stylesheets}"/>
<!-- merge the pages properties -->
<var name="page-files" value="${file.pages}, ${file.pages.default.include}"/>
<!-- Test for Ant Version Delete this task and all instances of overwrite='no' if you can't upgrade to 1.8.2-->
<fail message="All features of the build script require Ant version 1.8.2. Please upgrade to 1.8.2 or remove all instances of 'overwrite=no' (and this fail task) from the build script to continue">
<condition>
<not>
<contains string="${ant.version}" substring="1.8.2"/>
</not>
</condition>
</fail>
<!--
*************************************************
* BASE TARGETS *
*************************************************
-->
<target name="basics">
<if>
<equals arg1="${env}" arg2="dev"/>
<then>
<!-- Build a dev environment -->
<echo message="Building a Development Environment..."/>
<antcall target="-basics.dev"/>
</then>
<elseif>
<equals arg1="${env}" arg2="test"/>
<then>
<!-- Build a test environment -->
<echo message="Building a Test Environment..."/>
<antcall target="-basics.test"/>
</then>
</elseif>
<else>
<!-- Build a production environment -->
<echo message="Building a Production Environment..."/>
<antcall target="-basics.production"/>
</else>
</if>
</target>
<target name="text">
<if>
<equals arg1="${env}" arg2="dev"/>
<then>
<!-- Build a dev environment -->
<echo message="Building a Development Environment..."/>
<antcall target="-text.dev"/>
</then>
<elseif>
<equals arg1="${env}" arg2="test"/>
<then>
<!-- Build a test environment -->
<echo message="Building a Test Environment..."/>
<antcall target="-text.test"/>
</then>
</elseif>
<else>
<!-- Build a production environment -->
<echo message="Building a Production Environment..."/>
<antcall target="-text.production"/>
</else>
</if>
<antcall target="-imgcopy"/>
</target>
<target name="buildkit">
<if>
<equals arg1="${env}" arg2="dev"/>
<then>
<!-- Build a dev environment -->
<echo message="Building a Development Environment..."/>
<antcall target="-buildkit.dev"/>
</then>
<elseif>
<equals arg1="${env}" arg2="test"/>
<then>
<!-- Build a test environment -->
<echo message="Building a Test Environment..."/>
<antcall target="-buildkit.test"/>
</then>
</elseif>
<else>
<!-- Build a production environment -->
<echo message="Building a Production Environment..."/>
<antcall target="-buildkit.production"/>
</else>
</if>
</target>
<target name="build">
<if>
<equals arg1="${env}" arg2="dev"/>
<then>
<!-- Build a dev environment -->
<echo message="Building a Development Environment..."/>
<antcall target="-build.dev" />
</then>
<elseif>
<equals arg1="${env}" arg2="test"/>
<then>
<!-- Build a test environment -->
<echo message="Building a Test Environment..."/>
<antcall target="-build.test" />
</then>
</elseif>
<else>
<!-- Build a production environment -->
<echo message="Building a Production Environment..."/>
<antcall target="-build.production" />
</else>
</if>
</target>
<target name="minify">
<if>
<equals arg1="${env}" arg2="dev"/>
<then>
<!-- Build a dev environment -->
<echo message="Building a Development Environment..."/>
<antcall target="-minify.dev"/>
</then>
<elseif>
<equals arg1="${env}" arg2="test"/>
<then>
<!-- Build a test environment -->
<echo message="Building a Test Environment..."/>
<antcall target="-minify.test"/>
</then>
</elseif>
<else>
<!-- Build a production environment -->
<echo message="Building a Production Environment..."/>
<antcall target="-minify.production"/>
</else>
</if>
</target>
<target name="clean" depends="-clean"/>
<!-- JSLint target, run separately -->
<target name="jslint">
<apply dir="${dir.source}/${dir.js}" executable="java" parallel="false" failonerror="true">
<fileset dir="./${dir.source}/">
<include name="**/${dir.js}/*.js"/>
<exclude name="**/*.min.js"/>
<exclude name="**/${dir.js.libs}/"/>
<exclude name="**/${dir.publish}/"/>
</fileset>
<arg value="-jar" />
<arg path="./${dir.build.tools}/${tool.rhino}" />
<arg path="./${dir.build.tools}/${tool.jslint}" />
<srcfile/>
<arg value="${tool.jslint.opts}" />
</apply>
<echo>JSLint Successful</echo>
</target>
<!-- JSHint target, run separately -->
<target name="jshint">
<apply dir="${dir.source}/${dir.js}" executable="java" parallel="false" failonerror="true">
<fileset dir="./${dir.source}/">
<include name="**/${dir.js}/*.js"/>
<exclude name="**/*.min.js"/>
<exclude name="**/${dir.js.libs}/"/>
<exclude name="**/${dir.publish}/"/>
</fileset>
<arg value="-jar" />
<arg path="./${dir.build.tools}/${tool.rhino}" />
<arg path="./${dir.build.tools}/${tool.jshint}" />
<srcfile/>
<arg value="${tool.jshint.opts}" />
</apply>
<echo>JSHint Successful</echo>
</target>
<!-- CSSLint target, run separately -->
<target name="csslint">
<apply dir="${dir.source}/${dir.css}" executable="java" parallel="false" failonerror="true">
<fileset dir="./${dir.source}/">
<include name="**/${dir.css}/*.css"/>
<exclude name="**/*.min.css"/>
<exclude name="**/${dir.publish}/"/>
</fileset>
<arg value="-jar" />
<arg path="./${dir.build.tools}/${tool.rhino}" />
<arg path="./${dir.build.tools}/${tool.csslint}" />
<srcfile/>
<arg value="${tool.csslint.opts}" />
</apply>
<echo>CSSLint Successful</echo>
</target>
<!--
*************************************************
* BUILD TARGETS *
*************************************************
-->
<!-- Target: basics -->
<target name="-basics.dev"
depends="-intro,
-copy"/>
<target name="-basics.test"
depends="-intro,
-usemin,
-js.all.minify,
-js.main.concat,
-js.mylibs.concat,
-js.scripts.concat,
-css,
-manifest,
-copy"/>
<target name="-basics.production"
depends="-intro,
-usemin,
-js.all.minify,
-js.main.concat,
-js.mylibs.concat,
-js.scripts.concat,
-css,
-manifest,
-copy"/>
<!-- Target: text -->
<target name="-text.dev"
depends="-intro,
-copy"/>
<target name="-text.test"
depends="-intro,
-usemin,
-js.all.minify,
-js.main.concat,
-js.mylibs.concat,
-js.scripts.concat,
-css,
-manifest,
-htmlclean,
-copy"/>
<target name="-text.production"
depends="-intro,
-usemin,
-js.all.minify,
-js.main.concat,
-js.mylibs.concat,
-js.scripts.concat,
-css,
-manifest,
-htmlclean,
-copy"/>
<!-- Target: buildkit -->
<target name="-buildkit.dev"
depends="-intro,
-imagespng,
-imagesjpg,
-copy"/>
<target name="-buildkit.test"
depends="-intro,
-usemin,
-js.all.minify,
-js.main.concat,
-js.mylibs.concat,
-js.scripts.concat,
-css,
-manifest,
-htmlbuildkit,
-imagespng,
-imagesjpg,
-copy"/>
<target name="-buildkit.production"
depends="-intro,
-usemin,
-js.all.minify,
-js.main.concat,
-js.mylibs.concat,
-js.scripts.concat,
-css,
-manifest,
-htmlbuildkit,
-imagespng,
-imagesjpg,
-copy"/>
<!-- Target: build -->
<target name="-build.dev"
depends="-intro,
-imagespng,
-imagesjpg,
-copy"/>
<target name="-build.test"
depends="-intro,
-usemin,
-js.all.minify,
-js.main.concat,
-js.mylibs.concat,
-js.scripts.concat,
-css,
-manifest,
-htmlclean,
-imagespng,
-imagesjpg,
-copy"/>
<target name="-build.production"
depends="-intro,
-usemin,
-js.all.minify,
-js.main.concat,
-js.mylibs.concat,
-js.scripts.concat,
-css,
-manifest,
-htmlclean,
-imagespng,
-imagesjpg,
-copy"/>
<!-- Target: minify -->
<target name="-minify.dev"
depends="-intro,
-imagespng,
-imagesjpg,
-copy"/>
<target name="-minify.test"
depends="-intro,
-usemin,
-js.all.minify,
-js.main.concat,
-js.mylibs.concat,
-js.scripts.concat,
-css,
-manifest,
-htmlcompress,
-imagespng,
-imagesjpg,
-copy"/>
<target name="-minify.production"
depends="-intro,
-usemin,
-js.all.minify,
-js.main.concat,
-js.mylibs.concat,
-js.scripts.concat,
-css,
-manifest,
-htmlcompress,
-imagespng,
-imagesjpg,
-copy"/>
<!--
*************************************************
* FUNCTION TARGETS *
*************************************************
-->
<target name="-clean" description="(PRIVATE) Wipe the previous build (Deletes the dir.publish directory">
<!-- This is a private target -->
<echo message="Cleaning up previous build directory..."/>
<delete dir="./${dir.intermediate}/"/>
<delete dir="./${dir.publish}/"/>
</target>
<target name="-intro" description="(PRIVATE) Kindly inform the developer about the impending magic">
<!-- This is a private target -->
<echo message="====================================================================="/>
<echo message="Welcome to the HTML5 Boilerplate Build Script!"/>
<echo message=" "/>
<echo message="We're going to get your site all ship-shape and ready for prime time."/>
<echo message=" "/>
<echo message="This should take somewhere between 15 seconds and a few minutes,"/>
<echo message="mostly depending on how many images we're going to compress."/>
<echo message=" "/>
<echo message="Feel free to come back or stay here and follow along."/>
<echo message="====================================================================="/>
<echo message=" "/>
<echo message=" "/>
</target>
<target name="-mkdirs" depends="-clean">
<if>
<or>
<equals arg1="${dir.publish}" arg2="."/>
<equals arg1="${dir.publish}" arg2=".."/>
<equals arg1="${dir.publish}" arg2="/"/>
<equals arg1="${dir.publish}" arg2="./"/>
<equals arg1="${dir.publish}" arg2="../"/>
</or>
<then>
<fail message="Your dir.publish folder is set to ${dir.publish} which could delete your entire site or worse. Change it in project.properties"/>
</then>
<else>
<echo message="Creating directory structure... ${dir.publish}"/>
<mkdir dir="${dir.intermediate}"/>
<copy todir="${dir.intermediate}" includeEmptyDirs="true">
<fileset dir="${dir.source}/" excludes="${file.default.exclude}, ${file.exclude}">
<type type="dir"/>
</fileset>
</copy>
<mkdir dir="${dir.publish}"/>
<copy todir="${dir.publish}" includeEmptyDirs="true">
<fileset dir="${dir.source}/" excludes="${file.default.exclude}, ${file.exclude}">
<type type="dir"/>
</fileset>
</copy>
</else>
</if>
</target>
<target name="-copy" depends="-mkdirs">
<!-- This is a private target -->
<echo message="Copying over new files..."/>
<copy todir="./${dir.publish}">
<fileset dir="${dir.source}/" excludes="${file.default.exclude}, ${file.exclude}">
<!-- exclude files that are superseded by optimized versions with different names -->
<!-- this is not strictly necessary, but it avoids putting unreferenced files into your server -->
<exclude name="${dir.js}/**/*.js"/>
<exclude name="${dir.css}/**/*.css"/>
<exclude name="${file.manifest}"/>
</fileset>
</copy>
<echo message="A copy of all non-dev files are now in: ./${dir.publish}."/>
</target>
<!-- JAVASCRIPT -->
<target name="-js.main.concat" depends="-js.all.minify" description="(PRIVATE) Concatenates the JS files in dir.js">
<echo message="Concatenating Main JS scripts..."/>
<!-- overwrite=no here means not to overwrite if the target is newer than the sources -->
<concat destfile="./${dir.intermediate}/${dir.js}/scripts-concat.js" overwrite="no">
<fileset dir="./${dir.intermediate}/">
<include name="${dir.js.main}/plugins.js"/>
<include name="${dir.js.main}/${file.root.script}"/>
</fileset>
</concat>
</target>
<target name="-js.mylibs.concat" depends="-js.all.minify" description="(PRIVATE) Concatenates the JS files in dir.js.mylibs">
<mkdir dir="./${dir.intermediate}/${dir.js.mylibs}"/>
<echo message="Concatenating JS libraries"/>
<!-- overwrite=no here means not to overwrite if the target is newer than the sources -->
<concat destfile="./${dir.intermediate}/${dir.js}/mylibs-concat.js" overwrite="no">
<fileset dir="./${dir.intermediate}/${dir.js.mylibs}/"
includes="**/*.js"
excludes="${file.js.bypass}"/>
</concat>
</target>
<target name="-js.scripts.concat" depends="-js.main.concat,-js.mylibs.concat" if="build.concat.scripts">
<echo message="Concatenating library file with main script file"/>
<!-- overwrite=no here means not to overwrite if the target is newer than the sources -->
<concat destfile="./${dir.intermediate}/${dir.js}/scripts-concat.min.js" overwrite="no">
<fileset dir="./${dir.intermediate}/${dir.js}/">
<include name="mylibs-concat.js"/>
<include name="scripts-concat.js"/>
</fileset>
</concat>
<checksum file="${dir.intermediate}/${dir.js}/scripts-concat.min.js" algorithm="sha" property="scripts.fullsha" />
<propertyregex property="scripts.sha" input="${scripts.fullsha}" regexp=".{${hash.length}}" select="\0" />
<property name="scripts.js" value="${dir.js}/${scripts.sha}.js" />
<copy file="${dir.intermediate}/${dir.js}/scripts-concat.min.js" tofile="${dir.publish}/${dir.js}/${scripts.sha}.js" />
</target>
<target name="-js.all.minify" depends="-mkdirs" description="(PRIVATE) Minifies the scripts.js files created by js.scripts.concat">
<echo message="Minifying scripts"/>
<copy todir="${dir.intermediate}/">
<fileset dir="${dir.source}/" includes="${dir.js}/**/*.min.js" />
</copy>
<apply executable="java" parallel="false">
<fileset dir="${dir.source}/" >
<include name="${dir.js}/**/*.js"/>
<exclude name="${dir.js}/**/*.min.js"/>
</fileset>
<arg line="-jar"/>
<arg path="./${dir.build.tools}/closure-compiler-v1346.jar"/>
<arg line="--js"/>
<srcfile/>
<arg line="--compilation_level" />
<arg value="${scripts.compilation.level}" />
<arg line="--warning_level" />
<arg value="${scripts.compilation.warninglevel}" />
<arg line="--js_output_file" />
<mapper type="glob" from="*.js" to="${basedir}/${dir.intermediate}/*.js"/>
<targetfile/>
</apply>
<!-- at this point all js files are minified with their original names -->
<copy todir="${dir.publish}/">
<fileset dir="${dir.intermediate}/">
<include name="${dir.js}/**/*.js"/>
<exclude name="${dir.js.mylibs}/**/*.js"/>
<exclude name="${dir.js}/scripts-concat.js"/>
<exclude name="${dir.js}/mylibs-concat.js"/>
<exclude name="${dir.js}/scripts-concat.min.js"/>
<exclude name="${dir.js}/plugins.js"/>
<exclude name="${dir.js}/${file.root.script}"/>
</fileset>
</copy>
<copy todir="${dir.publish}/${dir.js.mylibs}/">
<fileset dir="${dir.source}/${dir.js.mylibs}/"
includes="${file.js.bypass}"/>
</copy>
</target>
<!-- HTML -->
<target name="-usemin" depends="-js.scripts.concat,-css" description="(PRIVATE) Replaces references to non-minified scripts">
<echo message="Switching to minified js files..."/>
<!-- Changes to style.css or scripts.js mean that the html must be updated, and it will be.
Unfortunately, the html we want to update may not have the tags we want to replace(because it was updated before).
This outofdate check ensures that the html files have the markers for us to replace. -->
<outofdate property="needhtmlrefresh">
<sourcefiles>
<fileset dir="${dir.publish}" includes="${style.css}, ${scripts.js}"/>
</sourcefiles>
<targetfiles>
<fileset dir="${dir.intermediate}" includes="${page-files}"/>
</targetfiles>
</outofdate>
<!-- force the files to be overwritten with older copies from source if needhtmlrefresh is set -->
<copy todir="${dir.intermediate}" overwrite="${needhtmlrefresh}">
<fileset dir="${dir.source}" includes="${page-files}"/>
</copy>
<!-- switch from a regular jquery to minified -->
<replaceregexp match="jquery-(\d|\d(\.\d)+)\.js" replace="jquery-\1.min.js" flags="g">
<fileset dir="./${dir.intermediate}" includes="${page-files}"/>
</replaceregexp>
<!-- switch any google CDN reference to minified -->
<replaceregexp match="(\d|\d(\.\d)+)\/jquery\.js" replace="\1/jquery.min.js" flags="g">
<fileset dir="./${dir.intermediate}" includes="${page-files}"/>
</replaceregexp>
<echo>Kill off those versioning flags: ?v=2</echo>
<replaceregexp match='\?v=\d+">' replace='">' flags="g">
<fileset dir="./${dir.intermediate}" includes="${page-files}"/>
</replaceregexp>
<echo>Remove favicon.ico reference if it is pointing to the root</echo>
<replaceregexp match="<link rel=["']shortcut icon["'] href=["']/favicon\.ico["']>" replace="">
<fileset dir="${dir.intermediate}" includes="${page-files}"/>
</replaceregexp>
<!-- we maintain the apple-touch-icon reference for Android 2.2 www.ravelrumba.com/blog/android-apple-touch-icon
<replace token="<link rel="apple-touch-icon" href="/apple-touch-icon.png">" value="">
<fileset dir="${dir.intermediate}" includes="${page-files}"/>
</replace>
-->
<echo message="Update the HTML to reference our concatenated script file: ${scripts.js}"/>
<!-- style.css replacement handled as a replacetoken above -->
<replaceregexp match="<!-- scripts concatenated [\d\w\s\W]*<script.*src=['"]?(.*)/${file.root.script}(?:\?.*)?['"]?\s*>\s*</script>[\d\w\s\W]*<!-- end ((scripts)|(concatenated and minified scripts))\s*-->"
replace="<script defer src='\1/${scripts.sha}.js\'></script>" flags="m">
<fileset dir="${dir.intermediate}" includes="${page-files}"/>
</replaceregexp>
<!--[! use comments like this one to avoid having them get minified -->
<echo message="Updating the HTML with the new css filename: ${style.css}"/>
<replaceregexp match="<link rel=['"]?stylesheet['"]?\s+href=['"]?(.*)/${file.root.stylesheet}(?:\?.*)?['"]?\s*>"
replace="<link rel='stylesheet' href='\1/${css.sha}.css'>" flags="m">
<fileset dir="${dir.intermediate}" includes="${page-files}"/>
</replaceregexp>
</target>
<target name="-manifest" depends="-usemin">
<if>
<isset property="file.manifest" />
<then>
<echo message="copying a fresh ${dir.build}/config/${file.manifest} to /${dir.intermediate}"/>
<delete file="${dir.intermediate}/${file.manifest}"/>
<copy file="${dir.build}/config/${file.manifest}" tofile="${dir.intermediate}/${file.manifest}" />
<echo message="manifest creation" />
<!-- update version -->
<echo message="Updating the site.manifest version date to today, current time"/>
<tstamp>
<format property="TODAY" pattern="yyyy-MM-dd HH:mm:ss"/>
</tstamp>
<replaceregexp match="# version .+" replace="# version ${TODAY}" file="${dir.intermediate}/${file.manifest}"/>
<!-- add html files -->
<echo message="Updating the site.manifest with html files: ${page-files}"/>
<for list="${page-files}" param="file" delimiter="," trim="true">
<sequential>
<replaceregexp match="# html files" replace="# html files${line.separator}@{file}" file="${dir.intermediate}/${file.manifest}" />
</sequential>
</for>
<!-- add stylesheet files -->
<echo message="Updating the site.manifest with the new css filename: ${style.css}"/>
<replace token="# css files" value="# css files${line.separator}${style.css}" file="${dir.intermediate}/${file.manifest}" />
<!-- add javascript files -->
<echo message="Updating the site.manifest with the new js filename: ${scripts.js}"/>
<for param="file">
<path>
<fileset dir="./${dir.intermediate}/${dir.js.mylibs}/"
includes="${file.js.bypass}" />
</path>
<sequential>
<basename property="filename.@{file}" file="@{file}" />
<replaceregexp match="# js files" replace="# js files${line.separator}${dir.js.mylibs}/${filename.@{file}}" file="${dir.intermediate}/${file.manifest}" />
</sequential>
</for>
<for param="file">
<path>
<fileset dir="./${dir.intermediate}/${dir.js.libs}/"
includes="*.min.js"/>
</path>
<sequential>
<basename property="filename.@{file}" file="@{file}" />
<replaceregexp match="# js files" replace="# js files${line.separator}${dir.js.libs}/${filename.@{file}}" file="${dir.intermediate}/${file.manifest}" />
</sequential>
</for>
<replace token="# js files" value="# js files${line.separator}${scripts.js}" file="${dir.intermediate}/${file.manifest}" />
<!-- add image files -->
<echo message="Updating the site.manifest with the images"/>
<for param="file">
<path>
<fileset dir="./${dir.source}/${dir.images}/" includes="**/*"/>
</path>
<sequential>
<basename property="filename.@{file}" file="@{file}" />
<replaceregexp match="# image files" replace="# image files${line.separator}${dir.images}/${filename.@{file}}" file="${dir.intermediate}/${file.manifest}" />
</sequential>
</for>
<echo message="copying ${file.manifest} to /${dir.publish}"/>
<copy file="${dir.intermediate}/${file.manifest}" tofile="${dir.publish}/${file.manifest}" />
<echo>Add manifest attribute to HTML: </echo>
<replaceregexp match="<html (.*?)>\s*?<!--<!\[endif" replace='<html \1 manifest="${file.manifest}"> <!--<![endif' flags="g">
<fileset dir="./${dir.intermediate}" includes="${page-files}"/>
</replaceregexp>
</then>
<else>
<echo message="no manifest.appcache generated!" />
</else>
</if>
</target>
<target name="-htmlclean" depends="-usemin">
<echo message="Run htmlcompressor on the HTML"/>
<echo message=" - maintaining whitespace"/>
<echo message=" - removing html comments"/>
<echo message=" - compressing inline style/script tag contents"/>
<apply executable="java" parallel="false" dest="./${dir.publish}/" >
<fileset dir="./${dir.intermediate}/" includes="${page-files}"/>
<arg value="-jar"/>
<arg path="./${dir.build.tools}/${tool.htmlcompressor}"/>
<arg line="--preserve-multi-spaces"/>
<arg line="--remove-quotes"/>
<arg line="--compress-js"/>
<arg line="--compress-css"/>
<arg line="--preserve-php"/>
<arg line="--preserve-ssi"/>
<srcfile/>
<arg value="-o"/>
<mapper type="glob" from="*" to="../${dir.publish}/*"/>
<targetfile/>
</apply>
</target>
<target name="-htmlbuildkit" depends="-usemin">
<echo message="Run htmlcompressor on the HTML"/>
<echo message=" - maintaining whitespace"/>
<echo message=" - retain html comments"/>
<echo message=" - compressing inline style/script tag contents"/>
<apply executable="java" parallel="false" dest="./${dir.publish}/" >
<fileset dir="./${dir.intermediate}/" includes="${page-files}"/>
<arg value="-jar"/>
<arg path="./${dir.build.tools}/${tool.htmlcompressor}"/>
<arg value="--preserve-comments"/>
<arg line="--preserve-multi-spaces"/>
<arg line="--compress-js"/>
<arg line="--compress-css"/>
<arg line="--preserve-php"/>
<arg line="--preserve-ssi"/>
<srcfile/>
<arg value="-o"/>
<mapper type="glob" from="*" to="../${dir.publish}/*"/>
<targetfile/>
</apply>
</target>
<target name="-htmlcompress" depends="-usemin">
<echo message="Run htmlcompressor on the HTML"/>
<echo message=" - removing unnecessary whitespace"/>
<echo message=" - removing html comments"/>
<echo message=" - compressing inline style/script tag contents"/>
<apply executable="java" parallel="false" dest="./${dir.publish}/" >
<fileset dir="./${dir.intermediate}/" includes="${page-files}"/>
<arg value="-jar"/>
<arg path="./${dir.build.tools}/${tool.htmlcompressor}"/>
<arg line="--remove-quotes"/>
<arg line="--compress-js"/>
<arg line="--compress-css"/>
<arg line="--preserve-php"/>
<arg line="--preserve-ssi"/>
<srcfile/>
<arg value="-o"/>
<mapper type="glob" from="*" to="../${dir.publish}/*"/>
<targetfile/>
</apply>
</target>
<!-- CSS -->
<target name="-css-remove-concatenated-stylesheets">
<echo>Removing ${css_file} from html</echo>
<replaceregexp match="<link.+href=".*${css_file}".*>" replace=" ">
<fileset dir="${dir.intermediate}" includes="${page-files}"/>
</replaceregexp>
</target>
<target name="css-split" description="turns style.css into multiple files @imported together">
<copy file="${dir.source}/${dir.css}/${file.root.stylesheet}" tofile="${dir.source}/${dir.css}/${file.root.stylesheet}.temp"/>
<replaceregexp file="${dir.source}/${dir.css}/${file.root.stylesheet}.temp"
match=".*"
replace="/* remove me */" flags="s" />
<loadfile property="root" srcfile="${dir.source}/${dir.css}/${file.root.stylesheet}"/>
<var name="curr.buffer" value=""/>
<for delimiter="${line.separator}" param="currline" list="${root}">
<sequential>
<!-- does this line contain an h5bp-import? -->
<propertyregex property="export.name" input="@{currline}" regexp="^.*==\|== +(.*) +==+$" select="\1" casesensitive="true" override="true" />
<if>
<isset property="export.name"/>
<then>
<propertyregex property="export.name" input="${export.name}" regexp=" " replace="." global="true" override="true" />
<var name="export.name" value="${export.name}.css"/>
<if>
<isset property="curr.file"/>
<then>
<!-- create curr.file -->
<copy file="${dir.source}/${dir.css}/${file.root.stylesheet}" tofile="${dir.source}/${dir.css}/${curr.file}" overwrite="true"/>
<!-- write the curr.buffer into the curr.file -->
<replaceregexp file="${dir.source}/${dir.css}/${curr.file}"
match=".*"
replace="${curr.buffer}" flags="s" />
<var name="curr.buffer" value=""/>
<var name="curr.file" unset="true"/>
</then>
</if>
<var name="curr.file" value="${export.name}"/>
<var name="export.name" unset="true"/>
<!-- insert import line into new root -->
<replace file="${dir.source}/${dir.css}/${file.root.stylesheet}.temp" token="/* remove me */" value="@import url(${curr.file});${line.separator}/* remove me */"/>
</then>
</if>
<var name="curr.buffer" value="${curr.buffer}@{currline}${line.separator}" />
</sequential>
</for>
<!-- one more time to write out the last file -->
<if>
<isset property="curr.file"/>
<then>
<!-- create curr.file -->
<copy file="${dir.source}/${dir.css}/${file.root.stylesheet}" tofile="${dir.source}/${dir.css}/${curr.file}" overwrite="true"/>
<!-- write the curr.buffer into the curr.file -->
<replaceregexp file="${dir.source}/${dir.css}/${curr.file}"
match=".*"
replace="${curr.buffer}" flags="s" />
<var name="curr.buffer" value=""/>
<var name="curr.file" unset="true"/>
</then>
</if>
<replace file="${dir.source}/${dir.css}/${file.root.stylesheet}.temp" token="/* remove me */" value="${curr.buffer}"/>
<copy file="${dir.source}/${dir.css}/${file.root.stylesheet}" tofile="${dir.source}/${dir.css}/${file.root.stylesheet}.orig" overwrite="false"/>
<move file="${dir.source}/${dir.css}/${file.root.stylesheet}.temp" tofile="${dir.source}/${dir.css}/${file.root.stylesheet}" overwrite="false"/>
</target>
<target name="-css" depends="-mkdirs" description="Concatenates and Minifies any stylesheets @imported via the file.stylesheets">
<echo message="Concatenating any @imports..."/>
<!-- copy source file to intermediate directory -->
<copy file="${dir.source}/${dir.css}/${file.root.stylesheet}" tofile="${dir.intermediate}/${dir.css}/${file.root.stylesheet}"/>
<!-- replace imports with h5bp-import tags (part 1) this one wraps @media types -->
<replaceregexp file="${dir.intermediate}/${dir.css}/${file.root.stylesheet}"
match="^@import\s+(?:url\s*\(\s*['"]?|['"])((?!http:|https:|ftp:|\/\/)[^"^'^\s]+)(?:['"]?\s*\)|['"])\s*([\w\s\(\)\d\:,\-]*);.*$"
replace="@media \2{ /* h5bp-import: \1 */ }" byline="true" />
<!-- replace imports with h5bp-import tags (part 2) -->
<replaceregexp file="${dir.intermediate}/${dir.css}/${file.root.stylesheet}"
match="^@media \{ (/\* .* \*/) \}" replace="\1" byline="true" />
<!-- copy skeleton to concat file -->
<copy file="${dir.intermediate}/${dir.css}/${file.root.stylesheet}"
tofile="${dir.intermediate}/${dir.css}/style-concat.css" overwrite="true"/>
<!-- load the file into a property -->
<loadfile property="imports" srcfile="${dir.intermediate}/${dir.css}/${file.root.stylesheet}"/>
<var name="concat-files" value="${file.root.stylesheet}"/>
<!-- go over the file line by line -->
<for delimiter="${line.separator}" param="import" list="${imports}">
<sequential>
<!-- does this line contain an h5bp-import? -->
<propertyregex property="file.name" input="@{import}" regexp="/\* h5bp-import: (.*) \*/" select="\1" casesensitive="true" override="true" />
<if>
<isset property="file.name"/>
<then>
<var name="concat-files" value="${file.name},${concat-files}"/>
<!-- load the file into a variable -->
<loadfile property="file.contents" srcFile="${dir.source}/${dir.css}/${file.name}"/>
<!-- pop that file into the concatenated output file -->
<replace file="${dir.intermediate}/${dir.css}/style-concat.css" token="/* h5bp-import: ${file.name} */" value="${file.contents}"/>
<var name="file.contents" unset="true"/>
</then>
</if>
</sequential>
</for>
<echo message="Minifying css..."/>
<apply executable="java" parallel="false">
<fileset dir="${dir.intermediate}/${dir.css}/" includes="style-concat.css"/>
<arg line="-jar"/>
<arg path="${dir.build.tools}/${tool.yuicompressor}"/>
<srcfile/>
<arg line="-o"/>
<mapper type="merge" to="${basedir}/${dir.intermediate}/${dir.css}/style-concat.min.css"/>
<targetfile/>
</apply>
<checksum file="${dir.intermediate}/${dir.css}/style-concat.min.css" algorithm="sha" property="css.fullsha" />
<propertyregex property="css.sha" input="${css.fullsha}" regexp=".{${hash.length}}" select="\0" />
<property name="style.css" value="${dir.css}/${css.sha}.css" />
<copy file="${dir.intermediate}/${dir.css}/style-concat.min.css" tofile="${dir.publish}/${dir.css}/${css.sha}.css" />
<echo message="Minifying any unconcatenated css files..."/>
<apply executable="java" parallel="false">
<fileset dir="${dir.source}/${dir.css}/" excludes="${concat-files}" includes="**/*.css"/>
<arg line="-jar"/>
<arg path="${dir.build.tools}/${tool.yuicompressor}"/>
<srcfile/>
<arg line="-o"/>
<mapper type="glob" from="*.css" to="${basedir}/${dir.publish}/${dir.css}/*.css"/>
<targetfile/>
</apply>
<foreach list="${file.stylesheets}" param="css_file" target="-css-remove-concatenated-stylesheets" />
</target>
<!-- IMAGES -->
<target name="-imagespng" depends="-mkdirs" description="(PRIVATE) Optimizes .png images using optipng">
<echo message="Optimizing images..."/>
<echo message="This part might take a while. But everything else is already done."/>
<echo message=" "/>
<echo message="First, we run optipng on the .png files..."/>
<!-- osfamily=unix is actually true on OS X as well -->
<!-- On *nix's and OS X, check for optipng and give a helpful message if it's not installed -->
<if>
<and>
<os family="unix" />
<available file="optipng" filepath="${ENV.PATH}" />
</and>
<then>
<!-- work around https://sourceforge.net/tracker/?func=detail&aid=2671422&group_id=151404&atid=780916 -->
<delete>
<fileset dir="./${dir.publish}/${dir.images}/">
<include name="**/*.png"/>
</fileset>
</delete>
<apply executable="optipng" dest="./${dir.publish}/${dir.images}/" osfamily="unix">
<fileset dir="./${dir.source}/${dir.images}/" includes="**/*.png" excludes="${images.bypass}, ${images.default.bypass}"/>
<arg value="-quiet"/>
<arg value="-o7"/>
<arg value="-out"/>
<targetfile/>
<srcfile/>
<mapper type="identity"/>
</apply>
</then>
<elseif>
<os family="unix" />
<then>
<echo message="*** optipng NOT INSTALLED. SKIPPING OPTIMIZATION OF PNGs." />
<echo message="*** Install optipng to enable png optimization." />
<echo message="*** For instructions see 'Dependencies' at: http://html5boilerplate.com/docs/#Build-script#dependencies" />
</then>
</elseif>
<elseif>
<os family="windows" />
<!-- work around https://sourceforge.net/tracker/?func=detail&aid=2671422&group_id=151404&atid=780916 -->
<then>
<delete>
<fileset dir="./${dir.publish}/${dir.images}/">
<include name="**/*.png"/>
</fileset>
</delete>
<apply executable="${basedir}/${dir.build.tools}/optipng-0.6.4-exe/optipng.exe" dest="./${dir.publish}/${dir.images}/" osfamily="windows">
<fileset dir="./${dir.source}/${dir.images}/" includes="**/*.png" excludes="${images.bypass}, ${images.default.bypass}"/>
<arg value="-quiet"/>
<arg value="-o7"/>
<arg value="-out"/>
<targetfile/>
<srcfile/>
<mapper type="identity"/>
</apply>
</then>
</elseif>
</if>
</target>
<target name="-imagesjpg" depends="-mkdirs" description="(PRIVATE) Optimizes .jpg images using jpegtan">
<echo message="Now, we clean up those jpgs..."/>
<if>
<equals arg1="${images.strip.metadata}" arg2="true"/>
<then>
<var name="strip-meta-tags" value="none"/>
</then>
<else>
<var name="strip-meta-tags" value="all"/>
</else>
</if>
<!-- On *nix's and OS X, check for jpegtran and give a helpful message if it's not installed -->
<if>
<and>
<os family="unix" />
<available file="jpegtran" filepath="${ENV.PATH}" />
</and>
<then>
<apply executable="jpegtran" dest="./${dir.publish}/${dir.images}" osfamily="unix">
<fileset dir="${dir.source}/${dir.images}" includes="**/*.jpg" excludes="${images.bypass}, ${images.default.bypass}"/>
<arg value="-copy"/>
<arg value="${strip-meta-tags}"/>
<arg value="-optimize"/>
<arg value="-outfile"/>
<targetfile/>
<srcfile/>
<mapper type="identity"/>
<!-- you may want to flag optimized images. If so, do it here. Otherwise change this to type="identity" -->
<!--<mapper type="glob" from="*.jpg" to="*.jpg"/>-->
</apply>
</then>
<elseif>
<os family="unix" />
<then>
<echo message="*** jpegtran NOT INSTALLED. SKIPPING OPTIMIZATION OF JPEGs." />
<echo message="*** Install jpegtran to enable jpeg optimization." />
<echo message="*** For instructions see 'Dependencies' at: http://html5boilerplate.com/docs/#Build-script#dependencies" />
</then>
</elseif>
</if>
<apply executable="${basedir}/${dir.build.tools}/jpegtran.exe" dest="./${dir.publish}/${dir.images}" osfamily="windows">
<fileset dir="${dir.source}/${dir.images}" includes="**/*.jpg" excludes="${images.bypass}, ${images.default.bypass}"/>
<arg value="-copy"/>
<arg value="${strip-meta-tags}"/>
<arg value="-optimize"/>
<arg value="-outfile"/>
<targetfile/>
<srcfile/>
<mapper type="identity"/>
<!-- you may want to flag optimized images. If so, do it here. Otherwise change this to type="identity" -->
<!--<mapper type="glob" from="*.jpg" to="*.jpg"/>-->
</apply>
</target>
<target name="-imgcopy" depends="-mkdirs">
<echo message="Copying over the unmodified images."/>
<copy todir="./${dir.publish}/${dir.images}">
<fileset dir="${dir.source}/${dir.images}" includes="**/*.jpg, **/*.png"/>
</copy>
</target>
<!-- Import project.xml (put any custom build targets in this file so that they aren't overwritten when build.xml is updated) -->
<!-- See: https://github.com/h5bp/html5-boilerplate/issues/704 -->
<import file="./project.xml" />
</project>
================================================
FILE: build/config/default.properties
================================================
#
# Default Build Settings
# you can override these settings on a project basis in a project.properties file
# so probably best not to touch these as they could be overwritten in later versions!
#
#
# Directory Paths
#
dir.source = .
dir.intermediate = intermediate
dir.publish = publish
dir.build = build
dir.build.tools = ${dir.build}/tools
dir.test = test
dir.demo = demo
dir.js = js
dir.js.main = ${dir.js}
# scripts in the lib directory will only be minified, not concatenated together
dir.js.libs = ${dir.js}/libs
dir.js.mylibs = ${dir.js}/mylibs
dir.css = css
dir.images = img
#
# HTML, PHP, etc files to clean and update script/css references
#
file.pages.default.include = index.html, 404.html
# You will need to include the property file.pages.include in your project.properties file
# and add any extra pages you want to be updated by the scripts in a comma separated list
# the server configuration you're going with. If you don't use apache,
# get a different one here: github.com/h5bp/server-configs
file.serverconfig = .htaccess
#
# Files not to be copied over by the script to the publish directory
#
file.default.exclude = .gitignore, .project, .settings, README.markdown, README.md, **/.git/**, **/.svn/**, ${dir.test}/**, ${dir.demo}/**, ${dir.intermediate}/**, ${dir.publish}/**, ${dir.build}/**, **/nbproject/**, *.komodoproject, **/.komodotools/**, **/dwsync.xml, **_notes, **/.hg/**, **/.idea/**
# Declare the file.exclude property in your project.properties file if you want to exclude files / folders you have added
# Note: you cannot declare an empty file.exclude property
#
# Bypass Optimization for these files
#
# file.default.js.bypass
# If set, these files will not be optimized (minifications, concatinations, image optimizations will not be applied)
# Note: you cannot declare an empty file.default.bypass property
#
# Root Script file
# this is the file that will be swapped for the concatenated and minified javascript.
#
file.root.script = script.js
#
# Root Stylesheet
# this is the file that contains the @import directives
#
file.root.stylesheet = style.css
#
# Default Stylesheet
#
file.default.stylesheets =
#
# Script Optimisation
#
# If set, concat libraries with main scripts file, producing single script file
build.concat.scripts = true
# default options for closure compiler.
scripts.compilation.level =SIMPLE_OPTIMIZATIONS
scripts.compilation.warninglevel = QUIET
#
# Image Optimisation
#
images.strip.metadata = true
# Seting this to true will strip the metadata from all jpeg files.
# YOU SHOULD ONLY DO THIS IF YOU OWN THE COPYRIGHT TO ALL THE IMAGES IN THE BUILD
#
# Bypass Optimization for these image files or folders
#
# images.default.bypass
# If set, these images will not be optimized
# Note: you cannot declare an empty images.default.bypass property
# Build Info
build.version.info = buildinfo.properties
build.scripts.dir = ${dir.build}/build-scripts
# Tools
tool.yuicompressor = yuicompressor-2.4.5.jar
tool.htmlcompressor = htmlcompressor-1.4.3.jar
tool.csscompressor = css-compressor/cli.php
tool.rhino = rhino.jar
tool.jslint = fulljslint.js
tool.jshint = fulljshint.js
tool.csslint = csslint-rhino.js
# Default Lint Utils Options
tool.jshint.opts = maxerr=25,eqeqeq=true
tool.jslint.opts = maxerr=25,evil=true,browser=true,eqeqeq=true,immed=true,newcap=true,nomen=true,es5=true,rhino=true,undef=true,white=false,devel=true
tool.csslint.opts =
# Default hash length
hash.length = 7
================================================
FILE: build/config/manifest.appcache
================================================
CACHE MANIFEST
# version xxxxxxxxx
CACHE:
# html files
# css files
# js files
# image files
FALLBACK:
NETWORK:
*
================================================
FILE: build/config/project.properties
================================================
# project.properties file defines overrides for default.properties
# Explanation: This file should be created by each user as and when he or she needs to override particular values.
# Consequently, it should not be placed under version control.
# Stylesheets
#
# Note: Stylesheets will be concatenated in the order they are listed in the file.stylesheets property (i.e. the last
# file listed will be at the end of the concatenated file), so it probably makes sense to have the main style.css file
# as the first entry
# Example:
# file.stylesheets = style.css, lightbox.css, plugin.css
#
file.stylesheets =
# Web Pages
#
# These are the pages (files) that will be served to users (.html, .php, .asp, etc). Files in this property will
# be minified / optimised and have any stylesheet or javascript references updated to the minified examples
#
# The paths need to be relative
#
# Files can be added in a comma separated form
file.pages =
# site manifest for offline
# this is the name of the manifest file you declared in the <html> tag
# Uncomment this line to enable appcache generation:
# file.manifest = manifest.appcache
# Excluded files and dirs
#
# Add any files or directories you add to the project and do not want to be copied to the publish directory as a
# comma separated list
# These files are ignored in addition to the default ones specified in default.properties.
file.exclude =
# Bypassed JavaScript files and dirs
#
# Add any files or folders within the mylibs directory that you want to be copied to the publish directory as a
# comma separated list
# These files will not be concatenated or minimized and will simply be copied over as is.
# Note: you cannot declare an empty file.bypass property, it would exclude the entire mylibs folder
# Example:
# file.js.bypass = widgets.js, gadgets.js, gidgets.js
# file.js.bypass =
# Clousre Compiler Options
#
# options are WHITESPACE_ONLY, SIMPLE_OPTIMIZATIONS, ADVANCED_OPTIMIZATIONS
# scripts.compilation.level = SIMPLE_OPTIMIZATIONS
# options are QUIET DEFAULT AND VERBOSE
# scripts.compilation.warninglevel = QUIET
#
# Specify an environment to build
#
# By Default, it builds a production environment
# Set to dev if building a development environment
# Set to test if building a test environment
env =
#
# Bypass Optimization for these image files or folders
#
# images.bypass
# If set, these images will not be optimized
# Note: you cannot declare an empty images.bypass property, it would exclude the entire img folder from being optimized
# Directory Structure
#
# Override any directory paths specific to this project
#
# dir.publish
# dir.js
# dir.js.libs
# dir.js.mylibs
# dir.css
# dir.images
# Override default JSHint Options (see http://jshint.com/ for description of options)
#tool.jshint.opts =
# Override default JSLint Options (see http://www.jslint.com/lint.html for description of options)
#tool.jslint.opts =
# Override default CSSLint Options (see http://csslint.net/about.html#settings for description of options)
#tool.csslint.opts =
# set the hash length used for versioning css and js files.
# valid values are between 1 and 40.
# shorter values use less bytes at the expense of increasing the probability of a hash collision.
#hash.length = 7
================================================
FILE: build/createproject.sh
================================================
#!/usr/bin/env bash
#Generate a new project from your HTML5 Boilerplate repo clone
#by: Rick Waldron & Michael Cetrulo
##first run
# $ cd html5-boilerplate/build
# $ chmod +x createproject.sh && ./createproject.sh [new_project]
##usage
# $ cd html5-boilerplate/build
# $ ./createproject.sh [new_project]
#
# If [new_project] is not specified the user we will prompted to enter it.
#
# The format of [new_project] should ideally be lowercase letters with no
# spaces as it represents the directory name that your new project will live
# in.
#
# If the new project is specified as just a name ( "foo" ) then the path
# will be a sibling to html5-boilerplate's directory.
#
# If the new project is specified with an absolute path ( "/home/user/foo" )
# that path will be used.
#
# find project root (also ensure script is ran from within repo)
src=$(git rev-parse --show-toplevel) || {
echo "try running the script from within html5-boilerplate directories." >&2
exit 1
}
[[ -d $src ]] || {
echo "fatal: could not determine html5-boilerplate's root directory." >&2
echo "try updating git." >&2
exit 1
}
if [ $# -eq 1 ]
then
# get a name for new project from command line arguments
name="$1"
fi
# get a name for new project from input
while [[ -z $name ]]
do
echo "To create a new html5-boilerplate project, enter a new directory name:"
read name || exit
done
if [[ "$name" = /* ]]
then
dst=$name
else
dst=$src/../$name
fi
if [[ -d $dst ]]
then
echo "$dst exists"
else
#create new project
mkdir -p -- "$dst" || exit 1
#success message
echo "Created Directory: $dst"
cd -- "$src"
cp -vr -- css js img build test *.html *.xml *.txt *.png *.ico .htaccess "$dst"
#success message
echo "Created Project: $dst"
fi
================================================
FILE: build/project.xml
================================================
<?xml version="1.0"?>
<!DOCTYPE project>
<project name="Project Build" default="build" basedir="../">
<!-- Use this file to define any custom build targets (for example, automatically deploying via FTP). -->
</project>
================================================
FILE: build/runbuildscript.bat
================================================
REM # This is for windows users only.
REM # If you're on a mac or linux, just run `ant build` from this folder in Terminal
set MYDIR=%~dp0
set ANT_OPTS=-D"file.encoding=UTF-8"
ant build
================================================
FILE: build/tools/csslint-rhino.js
================================================
/*!
CSSLint
Copyright (c) 2011 Nicole Sullivan and Nicholas C. Zakas. All rights reserved.
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
*/
/* Build time: 5-July-2011 03:16:53 */
var CSSLint = (function(){
/*!
Parser-Lib
Copyright (c) 2009-2011 Nicholas C. Zakas. All rights reserved.
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
*/
/* Build time: 5-July-2011 03:12:40 */
var parserlib = {};
(function(){
/**
* A generic base to inherit from for any object
* that needs event handling.
* @class EventTarget
* @constructor
*/
function EventTarget(){
/**
* The array of listeners for various events.
* @type Object
* @property _listeners
* @private
*/
this._listeners = {};
}
EventTarget.prototype = {
//restore constructor
constructor: EventTarget,
/**
* Adds a listener for a given event type.
* @param {String} type The type of event to add a listener for.
* @param {Function} listener The function to call when the event occurs.
* @return {void}
* @method addListener
*/
addListener: function(type, listener){
if (!this._listeners[type]){
this._listeners[type] = [];
}
this._listeners[type].push(listener);
},
/**
* Fires an event based on the passed-in object.
* @param {Object|String} event An object with at least a 'type' attribute
* or a string indicating the event name.
* @return {void}
* @method fire
*/
fire: function(event){
if (typeof event == "string"){
event = { type: event };
}
if (!event.target){
event.target = this;
}
if (!event.type){
throw new Error("Event object missing 'type' property.");
}
if (this._listeners[event.type]){
//create a copy of the array and use that so listeners can't chane
var listeners = this._listeners[event.type].concat();
for (var i=0, len=listeners.length; i < len; i++){
listeners[i].call(this, event);
}
}
},
/**
* Removes a listener for a given event type.
* @param {String} type The type of event to remove a listener from.
* @param {Function} listener The function to remove from the event.
* @return {void}
* @method removeListener
*/
removeListener: function(type, listener){
if (this._listeners[type]){
var listeners = this._listeners[type];
for (var i=0, len=listeners.length; i < len; i++){
if (listeners[i] === listener){
listeners.splice(i, 1);
break;
}
}
}
}
};
/**
* Convenient way to read through strings.
* @namespace parserlib.util
* @class StringReader
* @constructor
* @param {String} text The text to read.
*/
function StringReader(text){
/**
* The input text with line endings normalized.
* @property _input
* @type String
* @private
*/
this._input = text.replace(/\n\r?/g, "\n");
/**
* The row for the character to be read next.
* @property _line
* @type int
* @private
*/
this._line = 1;
/**
* The column for the character to be read next.
* @property _col
* @type int
* @private
*/
this._col = 1;
/**
* The index of the character in the input to be read next.
* @property _cursor
* @type int
* @private
*/
this._cursor = 0;
}
StringReader.prototype = {
//restore constructor
constructor: StringReader,
//-------------------------------------------------------------------------
// Position info
//-------------------------------------------------------------------------
/**
* Returns the column of the character to be read next.
* @return {int} The column of the character to be read next.
* @method getCol
*/
getCol: function(){
return this._col;
},
/**
* Returns the row of the character to be read next.
* @return {int} The row of the character to be read next.
* @method getLine
*/
getLine: function(){
return this._line ;
},
/**
* Determines if you're at the end of the input.
* @return {Boolean} True if there's no more input, false otherwise.
* @method eof
*/
eof: function(){
return (this._cursor == this._input.length)
},
//-------------------------------------------------------------------------
// Basic reading
//-------------------------------------------------------------------------
/**
* Reads the next character without advancing the cursor.
* @param {int} count How many characters to look ahead (default is 1).
* @return {String} The next character or null if there is no next character.
* @method peek
*/
peek: function(count){
var c = null;
count = (typeof count == "undefined" ? 1 : count);
//if we're not at the end of the input...
if (this._cursor < this._input.length){
//get character and increment cursor and column
c = this._input.charAt(this._cursor + count - 1);
}
return c;
},
/**
* Reads the next character from the input and adjusts the row and column
* accordingly.
* @return {String} The next character or null if there is no next character.
* @method read
*/
read: function(){
var c = null;
//if we're not at the end of the input...
if (this._cursor < this._input.length){
//if the last character was a newline, increment row count
//and reset column count
if (this._input.charAt(this._cursor) == "\n"){
this._line++;
this._col=1;
} else {
this._col++;
}
//get character and increment cursor and column
c = this._input.charAt(this._cursor++);
}
return c;
},
//-------------------------------------------------------------------------
// Misc
//-------------------------------------------------------------------------
/**
* Saves the current location so it can be returned to later.
* @method mark
* @return {void}
*/
mark: function(){
this._bookmark = {
cursor: this._cursor,
line: this._line,
col: this._col
};
},
reset: function(){
if (this._bookmark){
this._cursor = this._bookmark.cursor;
this._line = this._bookmark.line;
this._col = this._bookmark.col;
delete this._bookmark;
}
},
//-------------------------------------------------------------------------
// Advanced reading
//-------------------------------------------------------------------------
/**
* Reads up to and including the given string. Throws an error if that
* string is not found.
* @param {String} pattern The string to read.
* @return {String} The string when it is found.
* @throws Error when the string pattern is not found.
* @method readTo
*/
readTo: function(pattern){
var buffer = "",
c;
/*
* First, buffer must be the same length as the pattern.
* Then, buffer must end with the pattern or else reach the
* end of the input.
*/
while (buffer.length < pattern.length || buffer.lastIndexOf(pattern) != buffer.length - pattern.length){
c = this.read();
if (c){
buffer += c;
} else {
throw new Error("Expected \"" + pattern + "\" at line " + this._line + ", col " + this._col + ".");
}
}
return buffer;
},
/**
* Reads characters while each character causes the given
* filter function to return true. The function is passed
* in each character and either returns true to continue
* reading or false to stop.
* @param {Function} filter The function to read on each character.
* @return {String} The string made up of all characters that passed the
* filter check.
* @method readWhile
*/
readWhile: function(filter){
var buffer = "",
c = this.read();
while(c !== null && filter(c)){
buffer += c;
c = this.read();
}
return buffer;
},
/**
* Reads characters that match either text or a regular expression and
* returns those characters. If a match is found, the row and column
* are adjusted; if no match is found, the reader's state is unchanged.
* reading or false to stop.
* @param {String|RegExp} matchter If a string, then the literal string
* value is searched for. If a regular expression, then any string
* matching the pattern is search for.
* @return {String} The string made up of all characters that matched or
* null if there was no match.
* @method readMatch
*/
readMatch: function(matcher){
var source = this._input.substring(this._cursor),
value = null;
//if it's a string, just do a straight match
if (typeof matcher == "string"){
if (source.indexOf(matcher) === 0){
value = this.readCount(matcher.length);
}
} else if (matcher instanceof RegExp){
if (matcher.test(source)){
value = this.readCount(RegExp.lastMatch.length);
}
}
return value;
},
/**
* Reads a given number of characters. If the end of the input is reached,
* it reads only the remaining characters and does not throw an error.
* @param {int} count The number of characters to read.
* @return {String} The string made up the read characters.
* @method readCount
*/
readCount: function(count){
var buffer = "";
while(count--){
buffer += this.read();
}
return buffer;
}
};
/**
* Type to use when a syntax error occurs.
* @class SyntaxError
* @namespace parserlib.util
* @constructor
* @param {String} message The error message.
* @param {int} line The line at which the error occurred.
* @param {int} col The column at which the error occurred.
*/
function SyntaxError(message, line, col){
/**
* The column at which the error occurred.
* @type int
* @property col
*/
this.col = col;
/**
* The line at which the error occurred.
* @type int
* @property line
*/
this.line = line;
/**
* The text representation of the unit.
* @type String
* @property text
*/
this.message = message;
}
//inherit from Error
SyntaxError.prototype = new Error();
/**
* Base type to represent a single syntactic unit.
* @class SyntaxUnit
* @namespace parserlib.util
* @constructor
* @param {String} text The text of the unit.
* @param {int} line The line of text on which the unit resides.
* @param {int} col The column of text on which the unit resides.
*/
function SyntaxUnit(text, line, col){
/**
* The column of text on which the unit resides.
* @type int
* @property col
*/
this.col = col;
/**
* The line of text on which the unit resides.
* @type int
* @property line
*/
this.line = line;
/**
* The text representation of the unit.
* @type String
* @property text
*/
this.text = text;
}
/**
* Create a new syntax unit based solely on the given token.
* Convenience method for creating a new syntax unit when
* it represents a single token instead of multiple.
* @param {Object} token The token object to represent.
* @return {parserlib.util.SyntaxUnit} The object representing the token.
* @static
* @method fromToken
*/
SyntaxUnit.fromToken = function(token){
return new SyntaxUnit(token.value, token.startLine, token.startCol);
};
SyntaxUnit.prototype = {
//restore constructor
constructor: SyntaxUnit,
/**
* Returns the text representation of the unit.
* @return {String} The text representation of the unit.
* @method valueOf
*/
valueOf: function(){
return this.toString();
},
/**
* Returns the text representation of the unit.
* @return {String} The text representation of the unit.
* @method toString
*/
toString: function(){
return this.text;
}
};
/**
* Generic TokenStream providing base functionality.
* @class TokenStreamBase
* @namespace parserlib.util
* @constructor
* @param {String|StringReader} input The text to tokenize or a reader from
* which to read the input.
*/
function TokenStreamBase(input, tokenData){
/**
* The string reader for easy access to the text.
* @type StringReader
* @property _reader
* @private
*/
//this._reader = (typeof input == "string") ? new StringReader(input) : input;
this._reader = input ? new StringReader(input.toString()) : null;
/**
* Token object for the last consumed token.
* @type Token
* @property _token
* @private
*/
this._token = null;
/**
* The array of token information.
* @type Array
* @property _tokenData
* @private
*/
this._tokenData = tokenData;
/**
* Lookahead token buffer.
* @type Array
* @property _lt
* @private
*/
this._lt = [];
/**
* Lookahead token buffer index.
* @type int
* @property _ltIndex
* @private
*/
this._ltIndex = 0;
this._ltIndexCache = [];
}
/**
* Accepts an array of token information and outputs
* an array of token data containing key-value mappings
* and matching functions that the TokenStream needs.
* @param {Array} tokens An array of token descriptors.
* @return {Array} An array of processed token data.
* @method createTokenData
* @static
*/
TokenStreamBase.createTokenData = function(tokens){
var nameMap = [],
typeMap = {},
tokenData = tokens.concat([]),
i = 0,
len = tokenData.length+1;
tokenData.UNKNOWN = -1;
tokenData.unshift({name:"EOF"});
for (; i < len; i++){
nameMap.push(tokenData[i].name);
tokenData[tokenData[i].name] = i;
if (tokenData[i].text){
typeMap[tokenData[i].text] = i;
}
}
tokenData.name = function(tt){
return nameMap[tt];
};
tokenData.type = function(c){
return typeMap[c];
};
return tokenData;
};
TokenStreamBase.prototype = {
//restore constructor
constructor: TokenStreamBase,
//-------------------------------------------------------------------------
// Matching methods
//-------------------------------------------------------------------------
/**
* Determines if the next token matches the given token type.
* If so, that token is consumed; if not, the token is placed
* back onto the token stream. You can pass in any number of
* token types and this will return true if any of the token
* types is found.
* @param {int|int[]} tokenTypes Either a single token type or an array of
* token types that the next token might be. If an array is passed,
* it's assumed that the token can be any of these.
* @param {variant} channel (Optional) The channel to read from. If not
* provided, reads from the default (unnamed) channel.
* @return {Boolean} True if the token type matches, false if not.
* @method match
*/
match: function(tokenTypes, channel){
//always convert to an array, makes things easier
if (!(tokenTypes instanceof Array)){
tokenTypes = [tokenTypes];
}
var tt = this.get(channel),
i = 0,
len = tokenTypes.length;
while(i < len){
if (tt == tokenTypes[i++]){
return true;
}
}
//no match found, put the token back
this.unget();
return false;
},
/**
* Determines if the next token matches the given token type.
* If so, that token is consumed; if not, an error is thrown.
* @param {int|int[]} tokenTypes Either a single token type or an array of
* token types that the next token should be. If an array is passed,
* it's assumed that the token must be one of these.
* @param {variant} channel (Optional) The channel to read from. If not
* provided, reads from the default (unnamed) channel.
* @return {void}
* @method mustMatch
*/
mustMatch: function(tokenTypes, channel){
//always convert to an array, makes things easier
if (!(tokenTypes instanceof Array)){
tokenTypes = [tokenTypes];
}
if (!this.match.apply(this, arguments)){
token = this.LT(1);
throw new SyntaxError("Expected " + this._tokenData[tokenTypes[0]].name +
" at line " + token.startLine + ", character " + token.startCol + ".", token.startLine, token.startCol);
}
},
//-------------------------------------------------------------------------
// Consuming methods
//-------------------------------------------------------------------------
/**
* Keeps reading from the token stream until either one of the specified
* token types is found or until the end of the input is reached.
* @param {int|int[]} tokenTypes Either a single token type or an array of
* token types that the next token should be. If an array is passed,
* it's assumed that the token must be one of these.
* @param {variant} channel (Optional) The channel to read from. If not
* provided, reads from the default (unnamed) channel.
* @return {void}
* @method advance
*/
advance: function(tokenTypes, channel){
while(this.LA(0) != 0 && !this.match(tokenTypes, channel)){
this.get();
}
return this.LA(0);
},
/**
* Consumes the next token from the token stream.
* @return {int} The token type of the token that was just consumed.
* @method get
*/
get: function(channel){
var tokenInfo = this._tokenData,
reader = this._reader,
value,
i =0,
len = tokenInfo.length,
found = false,
token,
info;
//check the lookahead buffer first
if (this._lt.length && this._ltIndex >= 0 && this._ltIndex < this._lt.length){
i++;
this._token = this._lt[this._ltIndex++];
info = tokenInfo[this._token.type];
//obey channels logic
while((info.channel !== undefined && channel !== info.channel) &&
this._ltIndex < this._lt.length){
this._token = this._lt[this._ltIndex++];
info = tokenInfo[this._token.type];
i++;
}
//here be dragons
if ((info.channel === undefined || channel === info.channel) &&
this._ltIndex <= this._lt.length){
this._ltIndexCache.push(i);
return this._token.type;
}
}
//call token retriever method
token = this._getToken();
//if it should be hidden, don't save a token
if (token.type > -1 && !tokenInfo[token.type].hide){
//apply token channel
token.channel = tokenInfo[token.type].channel;
//save for later
this._token = token;
this._lt.push(token);
//save space that will be moved (must be done before array is truncated)
this._ltIndexCache.push(this._lt.length - this._ltIndex + i);
//keep the buffer under 5 items
if (this._lt.length > 5){
this._lt.shift();
}
//also keep the shift buffer under 5 items
if (this._ltIndexCache.length > 5){
this._ltIndexCache.shift();
}
//update lookahead index
this._ltIndex = this._lt.length;
}
/*
* Skip to the next token if:
* 1. The token type is marked as hidden.
* 2. The token type has a channel specified and it isn't the current channel.
*/
info = tokenInfo[token.type];
if (info &&
(info.hide ||
(info.channel !== undefined && channel !== info.channel))){
return this.get(channel);
} else {
//return just the type
return token.type;
}
},
/**
* Looks ahead a certain number of tokens and returns the token type at
* that position. This will throw an error if you lookahead past the
* end of input, past the size of the lookahead buffer, or back past
* the first token in the lookahead buffer.
* @param {int} The index of the token type to retrieve. 0 for the
* current token, 1 for the next, -1 for the previous, etc.
* @return {int} The token type of the token in the given position.
* @method LA
*/
LA: function(index){
var total = index,
tt;
if (index > 0){
//TODO: Store 5 somewhere
if (index > 5){
throw new Error("Too much lookahead.");
}
//get all those tokens
while(total){
tt = this.get();
total--;
}
//unget all those tokens
while(total < index){
this.unget();
total++;
}
} else if (index < 0){
if(this._lt[this._ltIndex+index]){
tt = this._lt[this._ltIndex+index].type;
} else {
throw new Error("Too much lookbehind.");
}
} else {
tt = this._token.type;
}
return tt;
},
/**
* Looks ahead a certain number of tokens and returns the token at
* that position. This will throw an error if you lookahead past the
* end of input, past the size of the lookahead buffer, or back past
* the first token in the lookahead buffer.
* @param {int} The index of the token type to retrieve. 0 for the
* current token, 1 for the next, -1 for the previous, etc.
* @return {Object} The token of the token in the given position.
* @method LA
*/
LT: function(index){
//lookahead first to prime the token buffer
this.LA(index);
//now find the token, subtract one because _ltIndex is already at the next index
return this._lt[this._ltIndex+index-1];
},
/**
* Returns the token type for the next token in the stream without
* consuming it.
* @return {int} The token type of the next token in the stream.
* @method peek
*/
peek: function(){
return this.LA(1);
},
/**
* Returns the actual token object for the last consumed token.
* @return {Token} The token object for the last consumed token.
* @method token
*/
token: function(){
return this._token;
},
/**
* Returns the name of the token for the given token type.
* @param {int} tokenType The type of token to get the name of.
* @return {String} The name of the token or "UNKNOWN_TOKEN" for any
* invalid token type.
* @method tokenName
*/
tokenName: function(tokenType){
if (tokenType < 0 || tokenType > this._tokenData.length){
return "UNKNOWN_TOKEN";
} else {
return this._tokenData[tokenType].name;
}
},
/**
* Returns the token type value for the given token name.
* @param {String} tokenName The name of the token whose value should be returned.
* @return {int} The token type value for the given token name or -1
* for an unknown token.
* @method tokenName
*/
tokenType: function(tokenName){
return this._tokenData[tokenName] || -1;
},
/**
* Returns the last consumed token to the token stream.
* @method unget
*/
unget: function(){
//if (this._ltIndex > -1){
if (this._ltIndexCache.length){
this._ltIndex -= this._ltIndexCache.pop();//--;
this._token = this._lt[this._ltIndex - 1];
} else {
throw new Error("Too much lookahead.");
}
}
};
parserlib.util = {
StringReader: StringReader,
SyntaxError : SyntaxError,
SyntaxUnit : SyntaxUnit,
EventTarget : EventTarget,
TokenStreamBase : TokenStreamBase
};
})();
/*
Parser-Lib
Copyright (c) 2009-2011 Nicholas C. Zakas. All rights reserved.
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
*/
/* Build time: 5-July-2011 03:12:40 */
(function(){
var EventTarget = parserlib.util.EventTarget,
TokenStreamBase = parserlib.util.TokenStreamBase,
StringReader = parserlib.util.StringReader,
SyntaxError = parserlib.util.SyntaxError,
SyntaxUnit = parserlib.util.SyntaxUnit;
var Colors = {
aliceblue :"#f0f8ff",
antiquewhite :"#faebd7",
aqua :"#00ffff",
aquamarine :"#7fffd4",
azure :"#f0ffff",
beige :"#f5f5dc",
bisque :"#ffe4c4",
black :"#000000",
blanchedalmond :"#ffebcd",
blue :"#0000ff",
blueviolet :"#8a2be2",
brown :"#a52a2a",
burlywood :"#deb887",
cadetblue :"#5f9ea0",
chartreuse :"#7fff00",
chocolate :"#d2691e",
coral :"#ff7f50",
cornflowerblue :"#6495ed",
cornsilk :"#fff8dc",
crimson :"#dc143c",
cyan :"#00ffff",
darkblue :"#00008b",
darkcyan :"#008b8b",
darkgoldenrod :"#b8860b",
darkgray :"#a9a9a9",
darkgreen :"#006400",
darkkhaki :"#bdb76b",
darkmagenta :"#8b008b",
darkolivegreen :"#556b2f",
darkorange :"#ff8c00",
darkorchid :"#9932cc",
darkred :"#8b0000",
darksalmon :"#e9967a",
darkseagreen :"#8fbc8f",
darkslateblue :"#483d8b",
darkslategray :"#2f4f4f",
darkturquoise :"#00ced1",
darkviolet :"#9400d3",
deeppink :"#ff1493",
deepskyblue :"#00bfff",
dimgray :"#696969",
dodgerblue :"#1e90ff",
firebrick :"#b22222",
floralwhite :"#fffaf0",
forestgreen :"#228b22",
fuchsia :"#ff00ff",
gainsboro :"#dcdcdc",
ghostwhite :"#f8f8ff",
gold :"#ffd700",
goldenrod :"#daa520",
gray :"#808080",
green :"#008000",
greenyellow :"#adff2f",
honeydew :"#f0fff0",
hotpink :"#ff69b4",
indianred :"#cd5c5c",
indigo :"#4b0082",
ivory :"#fffff0",
khaki :"#f0e68c",
lavender :"#e6e6fa",
lavenderblush :"#fff0f5",
lawngreen :"#7cfc00",
lemonchiffon :"#fffacd",
lightblue :"#add8e6",
lightcoral :"#f08080",
lightcyan :"#e0ffff",
lightgoldenrodyellow :"#fafad2",
lightgrey :"#d3d3d3",
lightgreen :"#90ee90",
lightpink :"#ffb6c1",
lightsalmon :"#ffa07a",
lightseagreen :"#20b2aa",
lightskyblue :"#87cefa",
lightslategray :"#778899",
lightsteelblue :"#b0c4de",
lightyellow :"#ffffe0",
lime :"#00ff00",
limegreen :"#32cd32",
linen :"#faf0e6",
magenta :"#ff00ff",
maroon :"#800000",
mediumaquamarine:"#66cdaa",
mediumblue :"#0000cd",
mediumorchid :"#ba55d3",
mediumpurple :"#9370d8",
mediumseagreen :"#3cb371",
mediumslateblue :"#7b68ee",
mediumspringgreen :"#00fa9a",
mediumturquoise :"#48d1cc",
mediumvioletred :"#c71585",
midnightblue :"#191970",
mintcream :"#f5fffa",
mistyrose :"#ffe4e1",
moccasin :"#ffe4b5",
navajowhite :"#ffdead",
navy :"#000080",
oldlace :"#fdf5e6",
olive :"#808000",
olivedrab :"#6b8e23",
orange :"#ffa500",
orangered :"#ff4500",
orchid :"#da70d6",
palegoldenrod :"#eee8aa",
palegreen :"#98fb98",
paleturquoise :"#afeeee",
palevioletred :"#d87093",
papayawhip :"#ffefd5",
peachpuff :"#ffdab9",
peru :"#cd853f",
pink :"#ffc0cb",
plum :"#dda0dd",
powderblue :"#b0e0e6",
purple :"#800080",
red :"#ff0000",
rosybrown :"#bc8f8f",
royalblue :"#4169e1",
saddlebrown :"#8b4513",
salmon :"#fa8072",
sandybrown :"#f4a460",
seagreen :"#2e8b57",
seashell :"#fff5ee",
sienna :"#a0522d",
silver :"#c0c0c0",
skyblue :"#87ceeb",
slateblue :"#6a5acd",
slategray :"#708090",
snow :"#fffafa",
springgreen :"#00ff7f",
steelblue :"#4682b4",
tan :"#d2b48c",
teal :"#008080",
thistle :"#d8bfd8",
tomato :"#ff6347",
turquoise :"#40e0d0",
violet :"#ee82ee",
wheat :"#f5deb3",
white :"#ffffff",
whitesmoke :"#f5f5f5",
yellow :"#ffff00",
yellowgreen :"#9acd32"
};
/**
* Represents a selector combinator (whitespace, +, >).
* @namespace parserlib.css
* @class Combinator
* @extends parserlib.util.SyntaxUnit
* @constructor
* @param {String} text The text representation of the unit.
* @param {int} line The line of text on which the unit resides.
* @param {int} col The column of text on which the unit resides.
*/
function Combinator(text, line, col){
SyntaxUnit.call(this, text, line, col);
/**
* The type of modifier.
* @type String
* @property type
*/
this.type = "unknown";
//pretty simple
if (/^\s+$/.test(text)){
this.type = "descendant";
} else if (text == ">"){
this.type = "child";
} else if (text == "+"){
this.type = "adjacent-sibling";
} else if (text == "~"){
this.type = "sibling";
}
}
Combinator.prototype = new SyntaxUnit();
Combinator.prototype.constructor = Combinator;
var Level1Properties = {
"background": 1,
"background-attachment": 1,
"background-color": 1,
"background-image": 1,
"background-position": 1,
"background-repeat": 1,
"border": 1,
"border-bottom": 1,
"border-bottom-width": 1,
"border-color": 1,
"border-left": 1,
"border-left-width": 1,
"border-right": 1,
"border-right-width": 1,
"border-style": 1,
"border-top": 1,
"border-top-width": 1,
"border-width": 1,
"clear": 1,
"color": 1,
"display": 1,
"float": 1,
"font": 1,
"font-family": 1,
"font-size": 1,
"font-style": 1,
"font-variant": 1,
"font-weight": 1,
"height": 1,
"letter-spacing": 1,
"line-height": 1,
"list-style": 1,
"list-style-image": 1,
"list-style-position": 1,
"list-style-type": 1,
"margin": 1,
"margin-bottom": 1,
"margin-left": 1,
"margin-right": 1,
"margin-top": 1,
"padding": 1,
"padding-bottom": 1,
"padding-left": 1,
"padding-right": 1,
"padding-top": 1,
"text-align": 1,
"text-decoration": 1,
"text-indent": 1,
"text-transform": 1,
"vertical-align": 1,
"white-space": 1,
"width": 1,
"word-spacing": 1
};
var Level2Properties = {
//Aural
"azimuth": 1,
"cue-after": 1,
"cue-before": 1,
"cue": 1,
"elevation": 1,
"pause-after": 1,
"pause-before": 1,
"pause": 1,
"pitch-range": 1,
"pitch": 1,
"play-during": 1,
"richness": 1,
"speak-header": 1,
"speak-numeral": 1,
"speak-punctuation": 1,
"speak": 1,
"speech-rate": 1,
"stress": 1,
"voice-family": 1,
"volume": 1,
//Paged
"orphans": 1,
"page-break-after": 1,
"page-break-before": 1,
"page-break-inside": 1,
"widows": 1,
//Interactive
"cursor": 1,
"outline-color": 1,
"outline-style": 1,
"outline-width": 1,
"outline": 1,
//Visual
"background-attachment": 1,
"background-color": 1,
"background-image": 1,
"background-position": 1,
"background-repeat": 1,
"background": 1,
"border-collapse": 1,
"border-color": 1,
"border-spacing": 1,
"border-style": 1,
"border-top": 1,
"border-top-color": 1,
"border-top-style": 1,
"border-top-width": 1,
"border-width": 1,
"border": 1,
"bottom": 1,
"caption-side": 1,
"clear": 1,
"clip": 1,
"color": 1,
"content": 1,
"counter-increment": 1,
"counter-reset": 1,
"direction": 1,
"display": 1,
"empty-cells": 1,
"float": 1,
"font-family": 1,
"font-size": 1,
"font-style": 1,
"font-variant": 1,
"font-weight": 1,
"font": 1,
"height": 1,
"left": 1,
"letter-spacing": 1,
"line-height": 1,
"list-style-image": 1,
"list-style-position": 1,
"list-style-type": 1,
"list-style": 1,
"margin-right": 1,
"margin-top": 1,
"margin": 1,
"max-height": 1,
"max-width": 1,
"min-height": 1,
"min-width": 1,
"overflow": 1,
"padding-top": 1,
"padding": 1,
"position": 1,
"quotes": 1,
"right": 1,
"table-layout": 1,
"text-align": 1,
"text-decoration": 1,
"text-indent": 1,
"text-transform": 1,
"top": 1,
"unicode-bidi": 1,
"vertical-align": 1,
"visibility": 1,
"white-space": 1,
"width": 1,
"word-spacing": 1,
"z-index": 1
};
/**
* Represents a media feature, such as max-width:500.
* @namespace parserlib.css
* @class MediaFeature
* @extends parserlib.util.SyntaxUnit
* @constructor
* @param {SyntaxUnit} name The name of the feature.
* @param {SyntaxUnit} value The value of the feature or null if none.
*/
function MediaFeature(name, value){
SyntaxUnit.call(this, "(" + name + (value !== null ? ":" + value : "") + ")", name.startLine, name.startCol);
/**
* The name of the media feature
* @type String
* @property name
*/
this.name = name;
/**
* The value for the feature or null if there is none.
* @type SyntaxUnit
* @property value
*/
this.value = value;
}
MediaFeature.prototype = new SyntaxUnit();
MediaFeature.prototype.constructor = MediaFeature;
/**
* Represents an individual media query.
* @namespace parserlib.css
* @class MediaQuery
* @extends parserlib.util.SyntaxUnit
* @constructor
* @param {String} modifier The modifier "not" or "only" (or null).
* @param {String} mediaType The type of media (i.e., "print").
* @param {Array} parts Array of selectors parts making up this selector.
* @param {int} line The line of text on which the unit resides.
* @param {int} col The column of text on which the unit resides.
*/
function MediaQuery(modifier, mediaType, features, line, col){
SyntaxUnit.call(this, (modifier ? modifier + " ": "") + (mediaType ? mediaType + " " : "") + features.join(" and "), line, col);
/**
* The media modifier ("not" or "only")
* @type String
* @property modifier
*/
this.modifier = modifier;
/**
* The mediaType (i.e., "print")
* @type String
* @property mediaType
*/
this.mediaType = mediaType;
/**
* The parts that make up the selector.
* @type Array
* @property features
*/
this.features = features;
}
MediaQuery.prototype = new SyntaxUnit();
MediaQuery.prototype.constructor = MediaQuery;
/**
* A CSS3 parser.
* @namespace parserlib.css
* @class Parser
* @constructor
* @param {Object} options (Optional) Various options for the parser:
* starHack (true|false) to allow IE6 star hack as valid,
* underscoreHack (true|false) to interpret leading underscores
* as IE6-7 targeting for known properties, ieFilters (true|false)
* to indicate that IE < 8 filters should be accepted and not throw
* syntax errors.
*/
function Parser(options){
//inherit event functionality
EventTarget.call(this);
this.options = options || {};
this._tokenStream = null;
}
Parser.prototype = function(){
var proto = new EventTarget(), //new prototype
prop,
additions = {
//restore constructor
constructor: Parser,
//-----------------------------------------------------------------
// Grammar
//-----------------------------------------------------------------
_stylesheet: function(){
/*
* stylesheet
* : [ CHARSET_SYM S* STRING S* ';' ]?
* [S|CDO|CDC]* [ import [S|CDO|CDC]* ]*
* [ namespace [S|CDO|CDC]* ]*
* [ [ ruleset | media | page | font_face ] [S|CDO|CDC]* ]*
* ;
*/
var tokenStream = this._tokenStream,
charset = null,
token,
tt;
this.fire("startstylesheet");
//try to read character set
this._charset();
this._skipCruft();
//try to read imports - may be more than one
while (tokenStream.peek() == Tokens.IMPORT_SYM){
this._import();
this._skipCruft();
}
//try to read namespaces - may be more than one
while (tokenStream.peek() == Tokens.NAMESPACE_SYM){
this._namespace();
this._skipCruft();
}
//get the next token
tt = tokenStream.peek();
//try to read the rest
while(tt > Tokens.EOF){
try {
switch(tt){
case Tokens.MEDIA_SYM:
this._media();
this._skipCruft();
break;
case Tokens.PAGE_SYM:
this._page();
this._skipCruft();
break;
case Tokens.FONT_FACE_SYM:
this._font_face();
this._skipCruft();
break;
case Tokens.S:
this._readWhitespace();
break;
default:
if(!this._ruleset()){
//error handling for known issues
switch(tt){
case Tokens.CHARSET_SYM:
token = tokenStream.LT(1);
this._charset(false);
throw new SyntaxError("@charset not allowed here.", token.startLine, token.startCol);
case Tokens.IMPORT_SYM:
token = tokenStream.LT(1);
this._import(false);
throw new SyntaxError("@import not allowed here.", token.startLine, token.startCol);
case Tokens.NAMESPACE_SYM:
token = tokenStream.LT(1);
this._namespace(false);
throw new SyntaxError("@namespace not allowed here.", token.startLine, token.startCol);
default:
tokenStream.get(); //get the last token
this._unexpectedToken(tokenStream.token());
}
}
}
} catch(ex) {
if (ex instanceof SyntaxError && !this.options.strict){
this.fire({
type: "error",
error: ex,
message: ex.message,
line: ex.line,
col: ex.col
});
} else {
throw ex;
}
}
tt = tokenStream.peek();
}
if (tt != Tokens.EOF){
this._unexpectedToken(tokenStream.token());
}
this.fire("endstylesheet");
},
_charset: function(emit){
var tokenStream = this._tokenStream,
charset,
token,
line,
col;
if (tokenStream.match(Tokens.CHARSET_SYM)){
line = tokenStream.token().startLine;
col = tokenStream.token().startCol;
this._readWhitespace();
tokenStream.mustMatch(Tokens.STRING);
token = tokenStream.token();
charset = token.value;
this._readWhitespace();
tokenStream.mustMatch(Tokens.SEMICOLON);
if (emit !== false){
this.fire({
type: "charset",
charset:charset,
line: line,
col: col
});
}
}
},
_import: function(emit){
/*
* import
* : IMPORT_SYM S*
* [STRING|URI] S* media_query_list? ';' S*
*/
var tokenStream = this._tokenStream,
tt,
uri,
importToken,
mediaList = [];
//read import symbol
tokenStream.mustMatch(Tokens.IMPORT_SYM);
importToken = tokenStream.token();
this._readWhitespace();
tokenStream.mustMatch([Tokens.STRING, Tokens.URI]);
//grab the URI value
uri = tokenStream.token().value.replace(/(?:url\()?["']([^"']+)["']\)?/, "$1");
this._readWhitespace();
mediaList = this._media_query_list();
//must end with a semicolon
tokenStream.mustMatch(Tokens.SEMICOLON);
this._readWhitespace();
if (emit !== false){
this.fire({
type: "import",
uri: uri,
media: mediaList,
line: importToken.startLine,
col: importToken.startCol
});
}
},
_namespace: function(emit){
/*
* namespace
* : NAMESPACE_SYM S* [namespace_prefix S*]? [STRING|URI] S* ';' S*
*/
var tokenStream = this._tokenStream,
line,
col,
prefix,
uri;
//read import symbol
tokenStream.mustMatch(Tokens.NAMESPACE_SYM);
line = tokenStream.token().startLine;
col = tokenStream.token().startCol;
this._readWhitespace();
//it's a namespace prefix - no _namespace_prefix() method because it's just an IDENT
if (tokenStream.match(Tokens.IDENT)){
prefix = tokenStream.token().value;
this._readWhitespace();
}
tokenStream.mustMatch([Tokens.STRING, Tokens.URI]);
/*if (!tokenStream.match(Tokens.STRING)){
tokenStream.mustMatch(Tokens.URI);
}*/
//grab the URI value
uri = tokenStream.token().value.replace(/(?:url\()?["']([^"']+)["']\)?/, "$1");
this._readWhitespace();
//must end with a semicolon
tokenStream.mustMatch(Tokens.SEMICOLON);
this._readWhitespace();
if (emit !== false){
this.fire({
type: "namespace",
prefix: prefix,
uri: uri,
line: line,
col: col
});
}
},
_media: function(){
/*
* media
* : MEDIA_SYM S* media_query_list S* '{' S* ruleset* '}' S*
* ;
*/
var tokenStream = this._tokenStream,
line,
col,
mediaList;// = [];
//look for @media
tokenStream.mustMatch(Tokens.MEDIA_SYM);
line = tokenStream.token().startLine;
col = tokenStream.token().startCol;
this._readWhitespace();
mediaList = this._media_query_list();
tokenStream.mustMatch(Tokens.LBRACE);
this._readWhitespace();
this.fire({
type: "startmedia",
media: mediaList,
line: line,
col: col
});
while(true) {
if (tokenStream.peek() == Tokens.PAGE_SYM){
this._page();
} else if (!this._ruleset()){
break;
}
}
tokenStream.mustMatch(Tokens.RBRACE);
this._readWhitespace();
this.fire({
type: "endmedia",
media: mediaList,
line: line,
col: col
});
},
//CSS3 Media Queries
_media_query_list: function(){
/*
* media_query_list
* : S* [media_query [ ',' S* media_query ]* ]?
* ;
*/
var tokenStream = this._tokenStream,
mediaList = [];
this._readWhitespace();
if (tokenStream.peek() == Tokens.IDENT || tokenStream.peek() == Tokens.LPAREN){
mediaList.push(this._media_query());
}
while(tokenStream.match(Tokens.COMMA)){
this._readWhitespace();
mediaList.push(this._media_query());
}
return mediaList;
},
/*
* Note: "expression" in the grammar maps to the _media_expression
* method.
*/
_media_query: function(){
/*
* media_query
* : [ONLY | NOT]? S* media_type S* [ AND S* expression ]*
* | expression [ AND S* expression ]*
* ;
*/
var tokenStream = this._tokenStream,
type = null,
ident = null,
token = null,
expressions = [];
if (tokenStream.match(Tokens.IDENT)){
ident = tokenStream.token().value.toLowerCase();
//since there's no custom tokens for these, need to manually check
if (ident != "only" && ident != "not"){
tokenStream.unget();
ident = null;
} else {
token = tokenStream.token();
}
}
this._readWhitespace();
if (tokenStream.peek() == Tokens.IDENT){
type = this._media_type();
if (token === null){
token = tokenStream.token();
}
} else if (tokenStream.peek() == Tokens.LPAREN){
if (token === null){
token = tokenStream.LT(1);
}
expressions.push(this._media_expression());
}
if (type === null && expressions.length === 0){
return null;
} else {
this._readWhitespace();
while (tokenStream.match(Tokens.IDENT)){
if (tokenStream.token().value.toLowerCase() != "and"){
this._unexpectedToken(tokenStream.token());
}
this._readWhitespace();
expressions.push(this._media_expression());
}
}
return new MediaQuery(ident, type, expressions, token.startLine, token.startCol);
},
//CSS3 Media Queries
_media_type: function(){
/*
* media_type
* : IDENT
* ;
*/
return this._media_feature();
},
/**
* Note: in CSS3 Media Queries, this is called "expression".
* Renamed here to avoid conflict with CSS3 Selectors
* definition of "expression". Also note that "expr" in the
* grammar now maps to "expression" from CSS3 selectors.
* @method _media_expression
* @private
*/
_media_expression: function(){
/*
* expression
* : '(' S* media_feature S* [ ':' S* expr ]? ')' S*
* ;
*/
var tokenStream = this._tokenStream,
feature = null,
token,
expression = null;
tokenStream.mustMatch(Tokens.LPAREN);
feature = this._media_feature();
this._readWhitespace();
if (tokenStream.match(Tokens.COLON)){
this._readWhitespace();
token = tokenStream.LT(1);
expression = this._expression();
}
tokenStream.mustMatch(Tokens.RPAREN);
this._readWhitespace();
return new MediaFeature(feature, (expression ? new SyntaxUnit(expression, token.startLine, token.startCol) : null));
},
//CSS3 Media Queries
_media_feature: function(){
/*
* media_feature
* : IDENT
* ;
*/
var tokenStream = this._tokenStream;
tokenStream.mustMatch(Tokens.IDENT);
return SyntaxUnit.fromToken(tokenStream.token());
},
//CSS3 Paged Media
_page: function(){
/*
* page:
* PAGE_SYM S* IDENT? pseudo_page? S*
* '{' S* [ declaration | margin ]? [ ';' S* [ declaration | margin ]? ]* '}' S*
* ;
*/
var tokenStream = this._tokenStream,
line,
col,
identifier = null,
pseudoPage = null;
//look for @page
tokenStream.mustMatch(Tokens.PAGE_SYM);
line = tokenStream.token().startLine;
col = tokenStream.token().startCol;
this._readWhitespace();
if (tokenStream.match(Tokens.IDENT)){
identifier = tokenStream.token().value;
//The value 'auto' may not be used as a page name and MUST be treated as a syntax error.
if (identifier.toLowerCase() === "auto"){
this._unexpectedToken(tokenStream.token());
}
}
//see if there's a colon upcoming
if (tokenStream.peek() == Tokens.COLON){
pseudoPage = this._pseudo_page();
}
this._readWhitespace();
this.fire({
type: "startpage",
id: identifier,
pseudo: pseudoPage,
line: line,
col: col
});
this._readDeclarations(true, true);
this.fire({
type: "endpage",
id: identifier,
pseudo: pseudoPage,
line: line,
col: col
});
},
//CSS3 Paged Media
_margin: function(){
/*
* margin :
* margin_sym S* '{' declaration [ ';' S* declaration? ]* '}' S*
* ;
*/
var tokenStream = this._tokenStream,
line,
col,
marginSym = this._margin_sym();
if (marginSym){
line = tokenStream.token().startLine;
col = tokenStream.token().startCol;
this.fire({
type: "startpagemargin",
margin: marginSym,
line: line,
col: col
});
this._readDeclarations(true);
this.fire({
type: "endpagemargin",
margin: marginSym,
line: line,
col: col
});
return true;
} else {
return false;
}
},
//CSS3 Paged Media
_margin_sym: function(){
/*
* margin_sym :
* TOPLEFTCORNER_SYM |
* TOPLEFT_SYM |
* TOPCENTER_SYM |
* TOPRIGHT_SYM |
* TOPRIGHTCORNER_SYM |
* BOTTOMLEFTCORNER_SYM |
* BOTTOMLEFT_SYM |
* BOTTOMCENTER_SYM |
* BOTTOMRIGHT_SYM |
* BOTTOMRIGHTCORNER_SYM |
* LEFTTOP_SYM |
* LEFTMIDDLE_SYM |
* LEFTBOTTOM_SYM |
* RIGHTTOP_SYM |
* RIGHTMIDDLE_SYM |
* RIGHTBOTTOM_SYM
* ;
*/
var tokenStream = this._tokenStream;
if(tokenStream.match([Tokens.TOPLEFTCORNER_SYM, Tokens.TOPLEFT_SYM,
Tokens.TOPCENTER_SYM, Tokens.TOPRIGHT_SYM, Tokens.TOPRIGHTCORNER_SYM,
Tokens.BOTTOMLEFTCORNER_SYM, Tokens.BOTTOMLEFT_SYM,
Tokens.BOTTOMCENTER_SYM, Tokens.BOTTOMRIGHT_SYM,
Tokens.BOTTOMRIGHTCORNER_SYM, Tokens.LEFTTOP_SYM,
Tokens.LEFTMIDDLE_SYM, Tokens.LEFTBOTTOM_SYM, Tokens.RIGHTTOP_SYM,
Tokens.RIGHTMIDDLE_SYM, Tokens.RIGHTBOTTOM_SYM]))
{
return SyntaxUnit.fromToken(tokenStream.token());
} else {
return null;
}
},
_pseudo_page: function(){
/*
* pseudo_page
* : ':' IDENT
* ;
*/
var tokenStream = this._tokenStream;
tokenStream.mustMatch(Tokens.COLON);
tokenStream.mustMatch(Tokens.IDENT);
//TODO: CSS3 Paged Media says only "left", "center", and "right" are allowed
return tokenStream.token().value;
},
_font_face: function(){
/*
* font_face
* : FONT_FACE_SYM S*
* '{' S* declaration [ ';' S* declaration ]* '}' S*
* ;
*/
var tokenStream = this._tokenStream,
line,
col;
//look for @page
tokenStream.mustMatch(Tokens.FONT_FACE_SYM);
line = tokenStream.token().startLine;
col = tokenStream.token().startCol;
this._readWhitespace();
this.fire({
type: "startfontface",
line: line,
col: col
});
this._readDeclarations(true);
this.fire({
type: "endfontface",
line: line,
col: col
});
},
_operator: function(){
/*
* operator
* : '/' S* | ',' S* | /( empty )/
* ;
*/
var tokenStream = this._tokenStream,
token = null;
if (tokenStream.match([Tokens.SLASH, Tokens.COMMA])){
token = tokenStream.token();
this._readWhitespace();
}
return token ? PropertyValuePart.fromToken(token) : null;
},
_combinator: function(){
/*
* combinator
* : PLUS S* | GREATER S* | TILDE S* | S+
* ;
*/
var tokenStream = this._tokenStream,
value = null,
token;
if(tokenStream.match([Tokens.PLUS, Tokens.GREATER, Tokens.TILDE])){
token = tokenStream.token();
value = new Combinator(token.value, token.startLine, token.startCol);
this._readWhitespace();
}
return value;
},
_unary_operator: function(){
/*
* unary_operator
* : '-' | '+'
* ;
*/
var tokenStream = this._tokenStream;
if (tokenStream.match([Tokens.MINUS, Tokens.PLUS])){
return tokenStream.token().value;
} else {
return null;
}
},
_property: function(){
/*
* property
* : IDENT S*
* ;
*/
var tokenStream = this._tokenStream,
value = null,
hack = null,
tokenValue,
token,
line,
col;
//check for star hack - throws error if not allowed
if (tokenStream.peek() == Tokens.STAR && this.options.starHack){
tokenStream.get();
token = tokenStream.token();
hack = token.value;
line = token.startLine;
col = token.startCol;
}
if(tokenStream.match(Tokens.IDENT)){
token = tokenStream.token();
tokenValue = token.value;
//check for underscore hack - no error if not allowed because it's valid CSS syntax
if (tokenValue.charAt(0) == "_" && this.options.underscoreHack){
hack = "_";
tokenValue = tokenValue.substring(1);
}
value = new PropertyName(tokenValue, hack, (line||token.startLine), (col||token.startCol));
this._readWhitespace();
}
return value;
},
//Augmented with CSS3 Selectors
_ruleset: function(){
/*
* ruleset
* : selectors_group
* '{' S* declaration? [ ';' S* declaration? ]* '}' S*
* ;
*/
var tokenStream = this._tokenStream,
tt,
selectors;
/*
* Error Recovery: If even a single selector fails to parse,
* then the entire ruleset should be thrown away.
*/
try {
selectors = this._selectors_group();
} catch (ex){
if (ex instanceof SyntaxError && !this.options.strict){
//fire error event
this.fire({
type: "error",
error: ex,
message: ex.message,
line: ex.line,
col: ex.col
});
//skip over everything until closing brace
tt = tokenStream.advance([Tokens.RBRACE]);
if (tt == Tokens.RBRACE){
//if there's a right brace, the rule is finished so don't do anything
} else {
//otherwise, rethrow the error because it wasn't handled properly
throw ex;
}
} else {
//not a syntax error, rethrow it
throw ex;
}
//trigger parser to continue
return true;
}
//if it got here, all selectors parsed
if (selectors){
this.fire({
type: "startrule",
selectors: selectors,
line: selectors[0].line,
col: selectors[0].col
});
this._readDeclarations(true);
this.fire({
type: "endrule",
selectors: selectors,
line: selectors[0].line,
col: selectors[0].col
});
}
return selectors;
},
//CSS3 Selectors
_selectors_group: function(){
/*
* selectors_group
* : selector [ COMMA S* selector ]*
* ;
*/
var tokenStream = this._tokenStream,
selectors = [],
selector;
selector = this._selector();
if (selector !== null){
selectors.push(selector);
while(tokenStream.match(Tokens.COMMA)){
this._readWhitespace();
selector = this._selector();
if (selector !== null){
selectors.push(selector);
} else {
this._unexpectedToken(tokenStream.LT(1));
}
}
}
return selectors.length ? selectors : null;
},
//CSS3 Selectors
_selector: function(){
/*
* selector
* : simple_selector_sequence [ combinator simple_selector_sequence ]*
* ;
*/
var tokenStream = this._tokenStream,
selector = [],
nextSelector = null,
combinator = null,
ws = null;
//if there's no simple selector, then there's no selector
nextSelector = this._simple_selector_sequence();
if (nextSelector === null){
return null;
}
selector.push(nextSelector);
do {
//look for a combinator
combinator = this._combinator();
if (combinator !== null){
selector.push(combinator);
nextSelector = this._simple_selector_sequence();
//there must be a next selector
if (nextSelector === null){
this._unexpectedToken(this.LT(1));
} else {
//nextSelector is an instance of SelectorPart
selector.push(nextSelector);
}
} else {
//if there's not whitespace, we're done
if (this._readWhitespace()){
//add whitespace separator
ws = new Combinator(tokenStream.token().value, tokenStream.token().startLine, tokenStream.token().startCol);
//combinator is not required
combinator = this._combinator();
//selector is required if there's a combinator
nextSelector = this._simple_selector_sequence();
if (nextSelector === null){
if (combinator !== null){
this._unexpectedToken(tokenStream.LT(1));
}
} else {
if (combinator !== null){
selector.push(combinator);
} else {
selector.push(ws);
}
selector.push(nextSelector);
}
} else {
break;
}
}
} while(true);
return new Selector(selector, selector[0].line, selector[0].col);
},
//CSS3 Selectors
_simple_selector_sequence: function(){
/*
* simple_selector_sequence
* : [ type_selector | universal ]
* [ HASH | class | attrib | pseudo | negation ]*
* | [ HASH | class | attrib | pseudo | negation ]+
* ;
*/
var tokenStream = this._tokenStream,
//parts of a simple selector
elementName = null,
modifiers = [],
//complete selector text
selectorText= "",
//the different parts after the element name to search for
components = [
//HASH
function(){
return tokenStream.match(Tokens.HASH) ?
new SelectorSubPart(tokenStream.token().value, "id", tokenStream.token().startLine, tokenStream.token().startCol) :
null;
},
this._class,
this._attrib,
this._pseudo,
this._negation
],
i = 0,
len = components.length,
component = null,
found = false,
line,
col;
//get starting line and column for the selector
line = tokenStream.LT(1).startLine;
col = tokenStream.LT(1).startCol;
elementName = this._type_selector();
if (!elementName){
elementName = this._universal();
}
if (elementName !== null){
selectorText += elementName;
}
while(true){
//whitespace means we're done
if (tokenStream.peek() === Tokens.S){
break;
}
//check for each component
while(i < len && component === null){
component = components[i++].call(this);
}
if (component === null){
//we don't have a selector
if (selectorText === ""){
return null;
} else {
break;
}
} else {
i = 0;
modifiers.push(component);
selectorText += component.toString();
component = null;
}
}
return selectorText !== "" ?
new SelectorPart(elementName, modifiers, selectorText, line, col) :
null;
},
//CSS3 Selectors
_type_selector: function(){
/*
* type_selector
* : [ namespace_prefix ]? element_name
* ;
*/
var tokenStream = this._tokenStream,
ns = this._namespace_prefix(),
elementName = this._element_name();
if (!elementName){
/*
gitextract_1azawqnk/ ├── .gitattributes ├── .gitignore ├── .htaccess ├── 404.html ├── README.md ├── ar/ │ ├── ar.css │ └── index.html ├── avatars.php ├── build/ │ ├── build.xml │ ├── config/ │ │ ├── default.properties │ │ ├── manifest.appcache │ │ └── project.properties │ ├── createproject.sh │ ├── project.xml │ ├── runbuildscript.bat │ └── tools/ │ ├── ant-contrib-1.0b3.jar │ ├── closure-compiler-v1346.jar │ ├── csslint-rhino.js │ ├── fulljshint.js │ ├── fulljslint.js │ ├── htmlcompressor-1.4.3.jar │ ├── optipng-0.6.4-exe/ │ │ └── LICENSE.txt │ ├── rhino.jar │ └── yuicompressor-2.4.5.jar ├── cn/ │ └── index.html ├── combine.php ├── crossdomain.xml ├── css/ │ ├── fonts.css │ ├── img/ │ │ └── .gitignore │ └── style.css ├── humans.txt ├── index.html ├── js/ │ ├── controller.js │ ├── init.js │ ├── libs/ │ │ ├── fittext.js │ │ ├── respond.js │ │ └── storage.js │ ├── mylibs/ │ │ ├── .gitignore │ │ └── touch.js │ └── plugins.js ├── pt-br/ │ └── index.html ├── pull.sh ├── push.sh └── robots.txt
SYMBOL INDEX (236 symbols across 8 files)
FILE: avatars.php
function search (line 29) | function search($query, $page = 1) {
function getAll (line 56) | function getAll($query) {
FILE: build/tools/csslint-rhino.js
function EventTarget (line 59) | function EventTarget(){
function StringReader (line 147) | function StringReader(text){
function SyntaxError (line 416) | function SyntaxError(message, line, col){
function SyntaxUnit (line 452) | function SyntaxUnit(text, line, col){
function TokenStreamBase (line 523) | function TokenStreamBase(input, tokenData){
function Combinator (line 1105) | function Combinator(text, line, col){
function MediaFeature (line 1317) | function MediaFeature(name, value){
function MediaQuery (line 1351) | function MediaQuery(modifier, mediaType, features, line, col){
function Parser (line 1393) | function Parser(options){
function PropertyName (line 3327) | function PropertyName(text, hack, line, col){
function PropertyValue (line 3355) | function PropertyValue(parts, line, col){
function PropertyValuePart (line 3382) | function PropertyValuePart(text, line, col){
function Selector (line 3526) | function Selector(parts, line, col){
function SelectorPart (line 3558) | function SelectorPart(elementName, modifiers, text, line, col){
function SelectorSubPart (line 3595) | function SelectorSubPart(text, type, line, col){
function isHexDigit (line 3629) | function isHexDigit(c){
function isDigit (line 3633) | function isDigit(c){
function isWhitespace (line 3637) | function isWhitespace(c){
function isNewLine (line 3641) | function isNewLine(c){
function isNameStart (line 3645) | function isNameStart(c){
function isNameChar (line 3649) | function isNameChar(c){
function isIdentStart (line 3653) | function isIdentStart(c){
function mix (line 3657) | function mix(receiver, supplier){
function TokenStream (line 3678) | function TokenStream(input){
function f (line 6409) | function f(){}
function xmlEscape (line 6933) | function xmlEscape(text){
function serializeToXML (line 6970) | function serializeToXML(results){
function serializeToJUnitXML (line 7009) | function serializeToJUnitXML(results){
function serializeToTAP (line 7088) | function serializeToTAP(results){
function simulateKeyEvent (line 7314) | function simulateKeyEvent(target /*:HTMLElement*/, type /*:String*/,
function simulateMouseEvent (line 7517) | function simulateMouseEvent(target /*:HTMLElement*/, type /*:String*/,
function simulateUIEvent (line 7717) | function simulateUIEvent(target /*:HTMLElement*/, type /*:String*/,
function inGroups (line 8382) | function inGroups(testGroups, filter){
function TestNode (line 8405) | function TestNode(testObject){
function TestRunner (line 8488) | function TestRunner(){
function Reporter (line 9525) | function Reporter(lines){
function mix (line 9664) | function mix(reciever, supplier){
function indexOf (line 9682) | function indexOf(values, value){
function reportProperty (line 10074) | function reportProperty(name, display, msg){
function startRule (line 10102) | function startRule(event){
function startRule (line 10734) | function startRule(){
function endRule (line 10740) | function endRule(event){
function gatherRules (line 10994) | function gatherRules(options){
function outputHelp (line 11030) | function outputHelp(){
function processFiles (line 11042) | function processFiles(files, options){
function getFiles (line 11074) | function getFiles(dir) {
FILE: build/tools/fulljshint.js
function F (line 997) | function F() {} // Used by Object.create
function is_own (line 999) | function is_own(object, name) {
function combine (line 1093) | function combine(t, o) {
function assume (line 1102) | function assume() {
function quit (line 1128) | function quit(m, l, ch) {
function warning (line 1138) | function warning(m, t, a, b, c, d) {
function warningAt (line 1169) | function warningAt(m, l, ch, a, b, c, d) {
function error (line 1176) | function error(m, t, a, b, c, d) {
function errorAt (line 1181) | function errorAt(m, l, ch, a, b, c, d) {
function nextLine (line 1197) | function nextLine() {
function it (line 1222) | function it(type, value) {
function match (line 1313) | function match(x) {
function string (line 1326) | function string(x) {
function addlabel (line 1935) | function addlabel(t, type) {
function doOption (line 1965) | function doOption() {
function peek (line 2070) | function peek(p) {
function advance (line 2087) | function advance(id, t) {
function expression (line 2157) | function expression(rbp, initial) {
function adjacent (line 2204) | function adjacent(left, right) {
function nobreak (line 2214) | function nobreak(left, right) {
function nospace (line 2222) | function nospace(left, right) {
function nonadjacent (line 2232) | function nonadjacent(left, right) {
function nobreaknonadjacent (line 2243) | function nobreaknonadjacent(left, right) {
function indentation (line 2258) | function indentation(bias) {
function nolinebreak (line 2270) | function nolinebreak(t) {
function comma (line 2278) | function comma() {
function symbol (line 2294) | function symbol(s, p) {
function delim (line 2307) | function delim(s) {
function stmt (line 2312) | function stmt(s, f) {
function blockstmt (line 2320) | function blockstmt(s, f) {
function reserveName (line 2327) | function reserveName(x) {
function prefix (line 2336) | function prefix(s, f) {
function type (line 2356) | function type(s, f) {
function reserve (line 2364) | function reserve(s, f) {
function reservevar (line 2371) | function reservevar(s, v) {
function infix (line 2381) | function infix(s, f, p, w) {
function relation (line 2401) | function relation(s, f) {
function isPoorRelation (line 2426) | function isPoorRelation(node) {
function assignop (line 2437) | function assignop(s, f) {
function bitwise (line 2482) | function bitwise(s, f, p) {
function bitwiseassignop (line 2497) | function bitwiseassignop(s) {
function suffix (line 2523) | function suffix(s, f) {
function optionalidentifier (line 2539) | function optionalidentifier() {
function identifier (line 2553) | function identifier() {
function reachable (line 2567) | function reachable(s) {
function statement (line 2591) | function statement(noindent) {
function use_strict (line 2653) | function use_strict() {
function statements (line 2670) | function statements(begin) {
function block (line 2751) | function block(ordinary, stmt) {
function countMember (line 2804) | function countMember(m) {
function note_implied (line 2816) | function note_implied(token) {
function cssName (line 2832) | function cssName() {
function cssNumber (line 2840) | function cssNumber() {
function cssString (line 2853) | function cssString() {
function cssColor (line 2861) | function cssColor() {
function cssLength (line 2920) | function cssLength() {
function cssLineHeight (line 2942) | function cssLineHeight() {
function cssWidth (line 2960) | function cssWidth() {
function cssMargin (line 2975) | function cssMargin() {
function cssAttr (line 2986) | function cssAttr() {
function cssCommaList (line 3002) | function cssCommaList() {
function cssCounter (line 3016) | function cssCounter() {
function cssShape (line 3063) | function cssShape() {
function cssUrl (line 3082) | function cssUrl() {
function styleAttribute (line 3335) | function styleAttribute() {
function styleValue (line 3377) | function styleValue(v) {
function styleChild (line 3443) | function styleChild() {
function substyle (line 3470) | function substyle() {
function styleSelector (line 3510) | function styleSelector() {
function stylePattern (line 3629) | function stylePattern() {
function stylelist (line 3646) | function stylelist() {
function styles (line 3661) | function styles() {
function doBegin (line 3708) | function doBegin(n) {
function doAttribute (line 3734) | function doAttribute(n, a, v) {
function doTag (line 3796) | function doTag(n, a) {
function closetag (line 3919) | function closetag(n) {
function html (line 3923) | function html() {
function property_name (line 4742) | function property_name() {
function functionparams (line 4763) | function functionparams() {
function doFunction (line 4787) | function doFunction(i, statement) {
function jsonValue (line 5376) | function jsonValue() {
function detail (line 5722) | function detail(h, array) {
FILE: build/tools/fulljslint.js
function return_this (line 1224) | function return_this() {
function F (line 1228) | function F() {} // Used by Object.create
function combine (line 1329) | function combine(a, b) {
function assume (line 1338) | function assume() {
function quit (line 1364) | function quit(message, line, character) {
function warn (line 1376) | function warn(message, offender, a, b, c, d) {
function warn_at (line 1404) | function warn_at(message, line, character, a, b, c, d) {
function fail (line 1411) | function fail(message, offender, a, b, c, d) {
function fail_at (line 1416) | function fail_at(message, line, character, a, b, c, d) {
function expected_at (line 1423) | function expected_at(at) {
function aint (line 1430) | function aint(it, name, expected) {
function collect_comment (line 1447) | function collect_comment(comment, quote, line, at) {
function next_line (line 1470) | function next_line() {
function it (line 1495) | function it(type, value, quote) {
function match (line 1589) | function match(x) {
function string (line 1602) | function string(x) {
function add_label (line 2226) | function add_label(symbol, type) {
function peek (line 2259) | function peek(distance) {
function discard (line 2278) | function discard(it) {
function advance (line 2299) | function advance(id, match) {
function directive (line 2399) | function directive() {
function edge (line 2550) | function edge(mode) {
function step_in (line 2555) | function step_in(mode) {
function step_out (line 2587) | function step_out(id, symbol) {
function one_space (line 2602) | function one_space(left, right) {
function one_space_only (line 2612) | function one_space_only(left, right) {
function no_space (line 2621) | function no_space(left, right) {
function no_space_only (line 2630) | function no_space_only(left, right) {
function spaces (line 2639) | function spaces(left, right) {
function comma (line 2649) | function comma() {
function semicolon (line 2663) | function semicolon() {
function use_strict (line 2678) | function use_strict() {
function are_similar (line 2696) | function are_similar(a, b) {
function expression (line 2759) | function expression(rbp, initial) {
function symbol (line 2808) | function symbol(s, p) {
function delim (line 2821) | function delim(s) {
function postscript (line 2826) | function postscript(x) {
function ultimate (line 2831) | function ultimate(s) {
function stmt (line 2842) | function stmt(s, f) {
function labeled_stmt (line 2849) | function labeled_stmt(s, f) {
function disrupt_stmt (line 2854) | function disrupt_stmt(s, f) {
function reserve_name (line 2860) | function reserve_name(x) {
function prefix (line 2869) | function prefix(s, f) {
function type (line 2894) | function type(s, arity, nud) {
function reserve (line 2904) | function reserve(s, f) {
function reservevar (line 2914) | function reservevar(s, v) {
function infix (line 2924) | function infix(s, p, f, w) {
function expected_relation (line 2944) | function expected_relation(node, message) {
function expected_condition (line 2951) | function expected_condition(node, message) {
function check_relation (line 2977) | function check_relation(node) {
function relation (line 3003) | function relation(s, eqeq) {
function assignop (line 3023) | function assignop(s, bit) {
function bitwise (line 3075) | function bitwise(s, p) {
function suffix (line 3087) | function suffix(s, f) {
function optional_identifier (line 3105) | function optional_identifier() {
function identifier (line 3118) | function identifier() {
function statement (line 3131) | function statement(no_indent) {
function statements (line 3210) | function statements() {
function block (line 3240) | function block(ordinary) {
function tally_property (line 3283) | function tally_property(name) {
function note_implied (line 3295) | function note_implied(token) {
function paren_check (line 3522) | function paren_check(that) {
function property_name (line 4051) | function property_name() {
function function_params (line 4074) | function function_params() {
function do_function (line 4103) | function do_function(func, name) {
function json_value (line 4795) | function json_value() {
function css_name (line 4882) | function css_name() {
function css_number (line 4890) | function css_number() {
function css_string (line 4902) | function css_string() {
function css_color (line 4909) | function css_color() {
function css_length (line 4965) | function css_length() {
function css_line_height (line 4985) | function css_line_height() {
function css_width (line 5003) | function css_width() {
function css_margin (line 5018) | function css_margin() {
function css_attr (line 5029) | function css_attr() {
function css_comma_list (line 5044) | function css_comma_list() {
function css_counter (line 5057) | function css_counter() {
function css_shape (line 5100) | function css_shape() {
function css_url (line 5118) | function css_url() {
function style_attribute (line 5370) | function style_attribute() {
function style_value (line 5408) | function style_value(v) {
function style_child (line 5474) | function style_child() {
function substyle (line 5498) | function substyle() {
function style_selector (line 5537) | function style_selector() {
function style_pattern (line 5648) | function style_pattern() {
function style_list (line 5664) | function style_list() {
function styles (line 5679) | function styles() {
function do_begin (line 5724) | function do_begin(n) {
function do_attribute (line 5748) | function do_attribute(n, a, v) {
function do_tag (line 5808) | function do_tag(name, attribute) {
function closetag (line 5966) | function closetag(name) {
function html (line 5970) | function html() {
function detail (line 6470) | function detail(h, array) {
FILE: js/init.js
function handleIntent (line 35) | function handleIntent(e) {
FILE: js/libs/respond.js
function s (line 2) | function s(){j(true)}
FILE: js/libs/storage.js
function createCookie (line 7) | function createCookie(name, value, days) {
function readCookie (line 20) | function readCookie(name) {
function setData (line 38) | function setData(data) {
function clearData (line 47) | function clearData() {
function getData (line 55) | function getData() {
FILE: js/plugins.js
function init (line 173) | function init( box ) {
function appendBackground (line 219) | function appendBackground( theSrc ) {
function defineSizes (line 254) | function defineSizes() {
function ani (line 307) | function ani() {
function calculateMove (line 345) | function calculateMove( vertical ) {
function checkMove (line 438) | function checkMove( move, vertical, opts, parallaxRoom, tooSmallMode ) {
Condensed preview — 44 files, each showing path, character count, and a content snippet. Download the .json file or copy for the full structured content (1,169K chars).
[
{
"path": ".gitattributes",
"chars": 11,
"preview": "* text=auto"
},
{
"path": ".gitignore",
"chars": 471,
"preview": "# Numerous always-ignore extensions\n*.diff\n*.err\n*.orig\n*.log\n*.rej\n*.swo\n*.swp\n*.vi\n*~\n*.sass-cache\n\n# OS or Editor fol"
},
{
"path": ".htaccess",
"chars": 19206,
"preview": "\n# dear h5bp htaccess file,\n# i love you.\n\n\n\n# ----------------------------------------------------------------------\n"
},
{
"path": "404.html",
"chars": 1272,
"preview": "<!doctype html>\n<html lang=\"en\">\n<head>\n <meta charset=\"utf-8\">\n <title>Page Not Found</title>\n <meta name=\"vie"
},
{
"path": "README.md",
"chars": 1358,
"preview": "\nThis site is mostly kaput. It hasn't been touched in a while. \n\n------------------------------------------------\n\n\n# mo"
},
{
"path": "ar/ar.css",
"chars": 719,
"preview": "body {\n text-align: right;\n direction: rtl;\n}\n.hed-lead {\n background: url(rtl-webasaurs.gif) center 0 "
},
{
"path": "ar/index.html",
"chars": 38907,
"preview": "<!DOCTYPE html public \"i ♥ the web\">\n<!--[if lt IE 9]> <html class=\"no-js oldie no-fontface\" lang=\"ar\" dir=\"rtl\"> <"
},
{
"path": "avatars.php",
"chars": 1959,
"preview": "<?php\n\n// Enable errors for easy debugging.\nerror_reporting(E_ALL);\nini_set('display_errors', '1');\n\n// Configurable stu"
},
{
"path": "build/build.xml",
"chars": 45914,
"preview": "<?xml version=\"1.0\"?>\n<!DOCTYPE project>\n<project name=\"Boilerplate Build\" default=\"build\" basedir=\"../\"> <!-- one back "
},
{
"path": "build/config/default.properties",
"chars": 3781,
"preview": "#\n# Default Build Settings\n# you can override these settings on a project basis in a project.properties file\n# so probab"
},
{
"path": "build/config/manifest.appcache",
"chars": 124,
"preview": "CACHE MANIFEST\n\n# version xxxxxxxxx\n\nCACHE:\n# html files\n\n\n# css files\n\n\n\n# js files\n\n\n\n# image files\n\nFALLBACK:\n\nNETWOR"
},
{
"path": "build/config/project.properties",
"chars": 3285,
"preview": "# project.properties file defines overrides for default.properties\n\n# Explanation: This file should be created by each u"
},
{
"path": "build/createproject.sh",
"chars": 1790,
"preview": "#!/usr/bin/env bash\n\n#Generate a new project from your HTML5 Boilerplate repo clone\n#by: Rick Waldron & Michael Cetrulo\n"
},
{
"path": "build/project.xml",
"chars": 225,
"preview": "<?xml version=\"1.0\"?>\n<!DOCTYPE project>\n<project name=\"Project Build\" default=\"build\" basedir=\"../\">\n\t\n <!-- Use thi"
},
{
"path": "build/runbuildscript.bat",
"chars": 186,
"preview": "REM # This is for windows users only.\nREM # If you're on a mac or linux, just run `ant build` from this folder in Termin"
},
{
"path": "build/tools/csslint-rhino.js",
"chars": 371724,
"preview": "/*! \nCSSLint\nCopyright (c) 2011 Nicole Sullivan and Nicholas C. Zakas. All rights reserved.\n\nPermission is hereby grante"
},
{
"path": "build/tools/fulljshint.js",
"chars": 208516,
"preview": "/*\n * JSHint, by JSHint Community.\n *\n * Licensed under the same slightly modified MIT license that JSLint is.\n * It sto"
},
{
"path": "build/tools/fulljslint.js",
"chars": 240588,
"preview": "/*global quit:false, readFile: false */\n\n// Rhino Edition\n\n\n// jslint.js\n// 2011-03-29\n\n// Copyright (c) 2002 Douglas Cr"
},
{
"path": "build/tools/optipng-0.6.4-exe/LICENSE.txt",
"chars": 865,
"preview": "\nCopyright (C) 2001-2010 Cosmin Truta.\n\nThis software is provided 'as-is', without any express or implied\nwarranty. In "
},
{
"path": "cn/index.html",
"chars": 29902,
"preview": "<!DOCTYPE html public \"i ♥ the web\">\n<!--[if lt IE 9]> <html class=\"no-js oldie no-fontface\" lang=\"zh-cn\"> <![endif"
},
{
"path": "combine.php",
"chars": 4810,
"preview": "<?php\n\n\t/************************************************************************\n\t * CSS and Javascript Combinator 0.5\n"
},
{
"path": "crossdomain.xml",
"chars": 782,
"preview": "<?xml version=\"1.0\"?>\n<!DOCTYPE cross-domain-policy SYSTEM \"http://www.adobe.com/xml/dtds/cross-domain-policy.dtd\">\n<cro"
},
{
"path": "css/fonts.css",
"chars": 751,
"preview": "@font-face { font-family: 'Adelle'; src: url('fonts/adelle_reg-webfont.eot'); src: url('fonts/adelle_reg-webfont.eot?#ie"
},
{
"path": "css/img/.gitignore",
"chars": 13,
"preview": "!.gitignore\n\n"
},
{
"path": "css/style.css",
"chars": 18051,
"preview": "/*\n * the HTML5✰Boilerplate css, natch.\n */\n\narticle,aside,details,figcaption,figure,footer,header,hgroup,nav,section{di"
},
{
"path": "humans.txt",
"chars": 1941,
"preview": "/* the humans responsible & colophon */\n/* humanstxt.org */\n\n\n/* TEAM */\n Aaron Forsander\n Twitter: @aaronforsander\n "
},
{
"path": "index.html",
"chars": 38663,
"preview": "<!doctype html>\n<!--[if lt IE 9]> <html class=\"no-js oldie no-fontface\" lang=\"en\"> <![endif]-->\n<!--[if gt IE 8]><!"
},
{
"path": "js/controller.js",
"chars": 3371,
"preview": "(function(win, undefined){\n\t\n\tvar doc \t\t = win.document,\n\t\tdocElem \t = doc.documentElement,\n\t\thead\t\t = doc.getElementsBy"
},
{
"path": "js/init.js",
"chars": 6922,
"preview": "(function( $ ){\n\n //$.getJSON('/avatars.json')\n // .success(function(avatars) {\n // $.each(avatars, function(hash"
},
{
"path": "js/libs/fittext.js",
"chars": 1239,
"preview": "(function(global, doc, $) {\n\t/*!\t\n\t* FitText.js 1.0\n\t*\n\t* Copyright 2011, Dave Rupert http://daverupert.com\n\t* Released "
},
{
"path": "js/libs/respond.js",
"chars": 3215,
"preview": "/*! Respond.js v1.0.1pre: min/max-width media query polyfill. (c) Scott Jehl. MIT/GPLv2 Lic. j.mp/respondjs */\n(functio"
},
{
"path": "js/libs/storage.js",
"chars": 2272,
"preview": "/*\n See: https://gist.github.com/350433\n*/\nif (typeof window.localStorage == 'undefined' || typeof window.sessionStorage"
},
{
"path": "js/mylibs/.gitignore",
"chars": 13,
"preview": "!.gitignore\n\n"
},
{
"path": "js/mylibs/touch.js",
"chars": 0,
"preview": ""
},
{
"path": "js/plugins.js",
"chars": 16937,
"preview": "(function(global) {\n \n var $ = global.jQuery;\n\n $.fn.hashTask = function(o) {\n\n var defaults = {\n hashtag: un"
},
{
"path": "pt-br/index.html",
"chars": 39593,
"preview": "<!DOCTYPE html public \"i ♥ the web\">\n<!--[if lt IE 9]> <html class=\"no-js oldie no-fontface\" lang=\"en\"> <![endif]--"
},
{
"path": "pull.sh",
"chars": 87,
"preview": "#!/usr/bin/env bash\n\ngit reset --hard HEAD\n\ngit pull origin master\n\nphp avatars.php\n\n\n\n"
},
{
"path": "push.sh",
"chars": 88,
"preview": "#!/usr/bin/env bash\n\ngit push origin master\n\ngit push -f origin origin/master:gh-pages\n\n"
},
{
"path": "robots.txt",
"chars": 116,
"preview": "# www.robotstxt.org/\n# www.google.com/support/webmasters/bin/answer.py?hl=en&answer=156449\n\nUser-agent: *\nDisallow:\n"
}
]
// ... and 5 more files (download for full content)
About this extraction
This page contains the full source code of the h5bp/movethewebforward GitHub repository, extracted and formatted as plain text for AI agents and large language models (LLMs). The extraction includes 44 files (1.1 MB), approximately 242.6k tokens, and a symbol index with 236 extracted functions, classes, methods, constants, and types. Use this with OpenClaw, Claude, ChatGPT, Cursor, Windsurf, or any other AI tool that accepts text input. You can copy the full output to your clipboard or download it as a .txt file.
Extracted by GitExtract — free GitHub repo to text converter for AI. Built by Nikandr Surkov.