Build changes, sprite.svg => plyr.svg

changelog.md

@@ -1,5 +1,9 @@
 # Changelog
 
+## v1.6.9
+- Added 'latest' CDN option
+- Renamed `sprite.svg` to `plyr.svg` to be inline with the other package files
+
 ## v1.6.8
 - Fix for bug introduced in v1.6.7
 

docs/index.html

@@ -79,7 +79,7 @@
         <script>
         (function() {
             [
-                '../dist/sprite.svg',
+                '../dist/plyr.svg',
                 'dist/docs.svg'
             ]
             .forEach(function(u) {

gulpfile.js

@@ -1,7 +1,7 @@
 // ==========================================================================
 // Gulp build script
 // ==========================================================================
-/*global require, __dirname*/
+/*global require, __dirname,Buffer*/
 /*jshint -W079 */
 
 var fs          = require("fs"),
@@ -19,10 +19,10 @@ var fs          = require("fs"),
     svgmin      = require("gulp-svgmin"),
     rename      = require("gulp-rename"),
     s3          = require("gulp-s3"),
-    gzip        = require("gulp-gzip"),
     replace     = require("gulp-replace"),
     open        = require("gulp-open"),
-    size        = require("gulp-size");
+    size        = require("gulp-size"),
+    through     = require("through2");
 
 var root = __dirname,
 paths = {
@@ -74,6 +74,29 @@ function loadJSON(path) {
     }
 }
 
+// Create a file from a string
+// http://stackoverflow.com/questions/23230569/how-do-you-create-a-file-from-a-string-in-gulp
+function createFile(filename, string) {
+    var src = require('stream').Readable({ 
+        objectMode: true 
+    });
+    src._read = function () {
+        this.push(new gutil.File({ 
+            cwd: "", 
+            base: "", 
+            path: filename, 
+            contents: new Buffer(string),
+            // stats also required for some functions
+            // https://nodejs.org/api/fs.html#fs_class_fs_stats
+            stat: {
+                size: string.length
+            } 
+        }));
+        this.push(null);
+    }
+    return src
+}
+
 var build = {
     js: function (files, bundle) {
         for (var key in files) {
@@ -143,7 +166,7 @@ var build = {
                     }]
                 }))
                 .pipe(svgstore())
-                .pipe(rename({ basename: (bundle == "plyr" ? "sprite" : bundle) }))
+                .pipe(rename({ basename: bundle }))
                 .pipe(gulp.dest(paths[bundle].output));
         });
     }
@@ -200,15 +223,21 @@ options = {
         headers: {
             "Cache-Control": "max-age=" + maxAge,
             "Vary": "Accept-Encoding"
-        },
+        }
-        gzippedOnly: true
     },
     docs: {
         headers: {
-            "Cache-Control": "public, must-revalidate, proxy-revalidate, max-age=0",
+            "Cache-Control": "no-cache, no-store, must-revalidate, max-age=0",
             "Vary": "Accept-Encoding"
+        }
     },
-        gzippedOnly: true
+    symlinks: function(version, filename) {
+        return {
+            headers: {
+                "X-Amz-Website-Redirect-Location": "/" + version + "/" + filename,
+                "Cache-Control": "no-cache, no-store, must-revalidate, max-age=0"
+            }
+        }
     }
 };
 
@@ -217,15 +246,16 @@ if("cdn" in aws) {
     var regex       = "(?:0|[1-9][0-9]*)\\.(?:0|[1-9][0-9]*)\.(?:0|[1-9][0-9]*)(?:-[\\da-z\\-]+(?:\.[\\da-z\\-]+)*)?(?:\\+[\\da-z\\-]+(?:\.[\\da-z\\-]+)*)?",
     cdnpath         = new RegExp(aws.cdn.bucket + "\/" + regex, "gi"),
     semver          = new RegExp("v" + regex, "gi"),
-    localpath       = new RegExp("(\.\.\/)?dist", "gi");
+    localpath       = new RegExp("(\.\.\/)?dist", "gi"),
+    latest          = "https://" + aws.cdn.bucket + "/latest";
 }
 
 // Publish version to CDN bucket
 gulp.task("cdn", function () {
-    console.log("Uploading " + version + " to " + aws.cdn.bucket);
+    console.log("Uploading " + version + " to " + aws.cdn.bucket + "...");
 
     // Upload to CDN
-    gulp.src(paths.upload)
+    return gulp.src(paths.upload)
         .pipe(size({
             showFiles: true,
             gzip: true
@@ -233,13 +263,12 @@ gulp.task("cdn", function () {
         .pipe(rename(function (path) {
             path.dirname = path.dirname.replace(".", version);
         }))
-        .pipe(gzip())
         .pipe(s3(aws.cdn, options.cdn));
 });
 
 // Publish to Docs bucket
 gulp.task("docs", function () {
-    console.log("Uploading " + version + " docs to " + aws.docs.bucket);
+    console.log("Uploading " + version + " docs to " + aws.docs.bucket + "...");
 
     // Replace versioned files in readme.md
     gulp.src([root + "/readme.md"])
@@ -254,17 +283,38 @@ gulp.task("docs", function () {
     // Replace local file paths with remote paths in docs
     // e.g. "../dist/plyr.js" to "https://cdn.plyr.io/x.x.x/plyr.js"
     gulp.src([paths.docs.root + "*.html"])
-        .pipe(replace(localpath, "https://" + aws.cdn.bucket + "/" + version))
+        .pipe(replace(localpath, latest))
-        .pipe(gzip())
         .pipe(s3(aws.docs, options.docs));
 
     // Upload error.html to cdn (as well as docs site)
-    gulp.src([paths.docs.root + "error.html"])
+    return gulp.src([paths.docs.root + "error.html"])
-        .pipe(replace(localpath, "https://" + aws.cdn.bucket + "/" + version))
+        .pipe(replace(localpath, latest))
-        .pipe(gzip())
         .pipe(s3(aws.cdn, options.docs));
 });
 
+// Open the docs site to check it's sweet
+gulp.task("symlinks", function () {
+    console.log("Updating symlinks...");
+
+    return gulp.src(paths.upload)
+        .pipe(through.obj(function (chunk, enc, callback) {
+            if (chunk.stat.isFile()) {
+                // Get the filename
+                var filename = chunk.path.split("/").reverse()[0];
+
+                // Create the 0 byte redirect files to upload
+                createFile(filename, "")
+                    .pipe(rename(function (path) {
+                        path.dirname = path.dirname.replace(".", "latest");
+                    }))
+                    // Upload to S3 with correct headers
+                    .pipe(s3(aws.cdn, options.symlinks(version, filename)));
+            }
+
+            callback(null, chunk);
+        }));
+});
+
 // Open the docs site to check it's sweet
 gulp.task("open", function () {
     console.log("Opening " + aws.docs.bucket + "...");
@@ -272,7 +322,7 @@ gulp.task("open", function () {
     // A file must be specified or gulp will skip the task
     // Doesn't matter which file since we set the URL above
     // Weird, I know...
-    gulp.src([paths.docs.root + "index.html"])
+    return gulp.src([paths.docs.root + "index.html"])
         .pipe(open("", {
             url: "http://" + aws.docs.bucket
         }));
@@ -280,5 +330,5 @@ gulp.task("open", function () {
 
 // Do everything
 gulp.task("publish", function () {
-    run(tasks.js, tasks.less, tasks.sprite, "cdn", "docs");
+    run(tasks.js, tasks.less, tasks.sprite, "cdn", "docs", "symlinks");
 });

package.json

@@ -1,6 +1,6 @@
 {
   "name": "plyr",
-  "version": "1.6.8",
+  "version": "1.6.9",
   "description": "A simple, accessible and customizable HTML5, YouTube and Vimeo media player",
   "homepage": "http://plyr.io",
   "main": "src/js/plyr.js",
@@ -8,10 +8,9 @@
   "devDependencies": {
     "gulp": "^3.9.1",
     "gulp-autoprefixer": "^3.1.0",
-    "gulp-concat": "^2.3.3",
-    "gulp-gzip": "^1.0.0",
-    "gulp-less": "^3.0.5",
     "gulp-clean-css": "^2.0.6",
+    "gulp-concat": "^2.3.3",
+    "gulp-less": "^3.0.5",
     "gulp-open": "^2.0.0",
     "gulp-rename": "^1.2.0",
     "gulp-replace": "^0.5.3",
@@ -22,7 +21,8 @@
     "gulp-svgstore": "^5.0.5",
     "gulp-uglify": "^1.5.3",
     "gulp-util": "^3.0.7",
-    "run-sequence": "^1.1.5"
+    "run-sequence": "^1.1.5",
+    "through2": "^2.0.1"
   },
   "keywords": [
     "HTML5 Video",

readme.md

@@ -40,7 +40,7 @@ If you have any cool ideas or features, please let me know by [creating an issue
 ## Implementation
 Check `docs/index.html` and `docs/dist/docs.js` for an example setup.
 
-**Heads up:** the example `index.html` file needs to be served from a webserver (such as Apache, Nginx, IIS or similar) unless you change the file sources to include http or https. e.g. change `//cdn.plyr.io/1.6.8/plyr.js` to `https://cdn.plyr.io/1.6.8/plyr.js`
+**Heads up:** the example `index.html` file needs to be served from a webserver (such as Apache, Nginx, IIS or similar) unless you change the file sources to include http or https. e.g. change `//cdn.plyr.io/1.6.9/plyr.js` to `https://cdn.plyr.io/1.6.9/plyr.js`
 
 ### Node Package Manager (NPM)
 
@@ -71,11 +71,11 @@ More info is on [npm](https://www.npmjs.com/package/ember-cli-plyr) and [GitHub]
 If you want to use our CDN, you can use the following:
 
 ```html
-<link rel="stylesheet" href="https://cdn.plyr.io/1.6.8/plyr.css">
+<link rel="stylesheet" href="https://cdn.plyr.io/1.6.9/plyr.css">
-<script src="https://cdn.plyr.io/1.6.8/plyr.js"></script>
+<script src="https://cdn.plyr.io/1.6.9/plyr.js"></script>
 ```
 
-You can also access the `sprite.svg` file at `https://cdn.plyr.io/1.6.8/sprite.svg`.
+The SVG sprite/defs file can be found here: `https://cdn.plyr.io/1.6.9/plyr.svg`.
 
 ### CSS & Styling
 If you want to use the default css, add the `plyr.css` file from `/dist` into your head, or even better use `plyr.less` or `plyr.scss` file included in `/src` in your build to save a request.
@@ -94,7 +94,7 @@ The SVG sprite for the controls icons can be loaded two ways:
 #### Using the `iconUrl` option
 This method requires the SVG sprite to be hosted on the *same domain* as your page hosting the player. Currently no browser supports cross origin SVG sprites due to XSS issues. Fingers crossed this will come soon though. An example value for this option would be:
 ```
-/path/to/sprite.svg
+/path/to/plyr.svg
 ```
 
 #### Using AJAX
@@ -113,7 +113,7 @@ Using AJAX means you can load the sprite from a different origin. Avoiding the i
 		c.innerHTML = a.responseText;
 		b.insertBefore(c, b.childNodes[0]);
 	};
-})(document, 'https://cdn.plyr.io/1.6.8/sprite.svg');
+})(document, 'https://cdn.plyr.io/1.6.9/plyr.svg');
 </script>
 ```
 
@@ -188,7 +188,7 @@ Be sure to [validate your caption files](https://quuz.org/webvtt/)
 Here's an example of a default setup:
 
 ```html
-<script src="https://cdn.plyr.io/1.6.8/plyr.js"></script>
+<script src="https://cdn.plyr.io/1.6.9/plyr.js"></script>
 <script>plyr.setup();</script>
 ```
 

src/js/plyr.js

@@ -1,6 +1,6 @@
 // ==========================================================================
 // Plyr
-// plyr.js v1.6.8
+// plyr.js v1.6.9
 // https://github.com/selz/plyr
 // License: The MIT License (MIT)
 // ==========================================================================