Untangle resources and put built examples in the build dir

2015-04-14 10:21:33 -06:00
parent 0faace215b
commit 8fd2e9f79f
38 changed files with 53 additions and 9656 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -1,6 +1,5 @@
 *.pyc
 /build/
-/examples/
 /node_modules/
 /dist/
 /coverage/
--- a/build.py
+++ b/build.py
@@ -122,7 +122,7 @@ EXAMPLES_SRC_HTML = [path
 EXAMPLES_SRC_JS = [example.replace('.html', '.js')
            for example in EXAMPLES_SRC_HTML]

-EXAMPLES_DEST_ALL = [path.replace('examples_src', 'examples')
+EXAMPLES_DEST_ALL = [path.replace('examples_src', 'build/examples')
            for path in EXAMPLES_SRC_ALL]

 GLSL_SRC = [path
@@ -255,7 +255,7 @@ def build_test_rendering_requires(t):
 virtual('examples', EXAMPLES_DEST_ALL)


-@rule(r'\Aexamples/(?P<filepath>.*)\Z')
+@rule(r'\Abuild\/examples/(?P<filepath>.*)\Z')
 def examples_dest(name, match):
    def action(t):
        t.run('node', 'tasks/build-examples.js')
@@ -299,7 +299,7 @@ def examples_star_json(name, match):
          "src": [
            "src/**/*.js",
            "build/ol.ext/*.js",
-            "examples/%(id)s.js" % match.groupdict()],
+            "build/examples/%(id)s.js" % match.groupdict()],
          "compile": {
            "js": [
              "externs/olx.js",
@@ -623,7 +623,7 @@ def build_check_whitespace_timestamp(t):
 virtual('apidoc', 'build/jsdoc-%(BRANCH)s-timestamp' % vars(variables))


-@target('build/jsdoc-%(BRANCH)s-timestamp' % vars(variables), 'host-resources',
+@target('build/jsdoc-%(BRANCH)s-timestamp' % vars(variables),
        SRC, SHADER_SRC, ifind('config/jsdoc/api/template'),
        NPM_INSTALL)
 def jsdoc_BRANCH_timestamp(t):
@@ -665,14 +665,7 @@ def split_example_file(example, dst_dir):
    target_require.close()


-@target('host-resources', phony=True)
-def host_resources(t):
-    resources_dir = 'build/hosted/%(BRANCH)s/resources'
-    t.rm_rf(resources_dir)
-    t.cp_r('resources', resources_dir)
-
-
-@target('host-examples', 'build', 'host-resources', 'examples', phony=True)
+@target('host-examples', 'build', 'examples', phony=True)
 def host_examples(t):
    examples_dir = 'build/hosted/%(BRANCH)s/examples'
    build_dir = 'build/hosted/%(BRANCH)s/build'
@@ -680,7 +673,7 @@ def host_examples(t):
    closure_lib_path = output('node', '-e',
        'process.stdout.write(require("closure-util").getLibraryPath())')
    t.rm_rf(examples_dir)
-    t.cp_r('examples', examples_dir)
+    t.cp_r('build/examples', examples_dir)
    for example in EXAMPLES_SRC_JS:
        split_example_file(example, examples_dir % vars(variables))
    t.cp('bin/loader_hosted_examples.js', examples_dir + '/loader.js')
--- a/config/examples-all.json
+++ b/config/examples-all.json
@@ -3,7 +3,7 @@
  "src": [
    "src/**/*.js",
    "build/ol.ext/*.js",
-    "build/examples/all.js"
+    "build/compiled-examples/all.js"
  ],
  "compile": {
    "js": [
--- a/config/examples/example.html
+++ b/config/examples/example.html
@@ -4,14 +4,13 @@
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="chrome=1">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" type="text/css">
    <link rel="stylesheet" href="../css/ol.css" type="text/css">
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
-    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <link rel="stylesheet" href="./resources/layout.css" type="text/css">
    {{{ extraHead }}}
    {{{ css.tag }}}
-    <link rel="stylesheet" href="../resources/prism/prism.css" type="text/css">
-    <script src="../resources/zeroclipboard/ZeroClipboard.min.js"></script>
+    <link rel="stylesheet" href="./resources/prism/prism.css" type="text/css">
+    <script src="./resources/zeroclipboard/ZeroClipboard.min.js"></script>
    <title>{{ title }}</title>
  </head>
  <body>
@@ -19,7 +18,7 @@
    <div class="navbar navbar-inverse navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container">
-          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+          <a class="brand" href="./"><img src="./resources/logo-70x70.png"> OpenLayers 3 Examples</a>
        </div>
      </div>
    </div>
@@ -77,10 +76,10 @@
      </div>
    </div>

-    <script src="../resources/jquery.min.js"></script>
-    <script src="../resources/bootstrap/js/bootstrap.min.js"></script>
-    <script src="../resources/example-behaviour.js"></script>
-    <script src="../resources/prism/prism.min.js"></script>
+    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
+    <script src="http://maxcdn.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
+    <script src="./resources/example-behaviour.js"></script>
+    <script src="./resources/prism/prism.min.js"></script>
    {{{ js.tag }}}

  </body>
--- a/config/jsdoc/api/template/static/logo-70x70.png
+++ b/config/jsdoc/api/template/static/logo-70x70.png
--- a/config/jsdoc/api/template/tmpl/layout.tmpl
+++ b/config/jsdoc/api/template/tmpl/layout.tmpl
@@ -18,7 +18,7 @@
 <div class="navbar navbar-inverse navbar-fixed-top">
  <div class="navbar-inner">
    <div class="container">
-      <a class="brand" href="/"><img src="../resources/logo-70x70.png"> OpenLayers 3</a>
+      <a class="brand" href="/"><img src="logo-70x70.png"> OpenLayers 3</a>
      <label id="stability">
        <input type="checkbox" id="stability-toggle"> Stable Only
      </label>
--- a/examples_src/geolocation-orientation.html
+++ b/examples_src/geolocation-orientation.html
@@ -7,10 +7,9 @@ template: "example-verbatim.html"
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="chrome=1">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" type="text/css">
    <link rel="stylesheet" href="../css/ol.css" type="text/css">
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
-    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <link rel="stylesheet" href="./resources/layout.css" type="text/css">
    <title>Mobile Geolocation Tracking with Orientation</title>
    <style type="text/css">
      html, body, .map {
@@ -43,8 +42,8 @@ template: "example-verbatim.html"
        <button id="simulate">Simulate</button>
    </div>

-    <script src="../resources/jquery.min.js" type="text/javascript"></script>
-    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+    <script src="http://code.jquery.com/jquery-1.9.1.min.js" type="text/javascript"></script>
+    <script src="./resources/example-behaviour.js" type="text/javascript"></script>
    <script src="loader.js?id=geolocation-orientation" type="text/javascript"></script>

    <div style="display: none;">
--- a/examples_src/index.html
+++ b/examples_src/index.html
@@ -4,10 +4,9 @@
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="chrome=1">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" type="text/css">
    <link rel="stylesheet" href="../css/ol.css" type="text/css">
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
-    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
-    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <link rel="stylesheet" href="./resources/layout.css" type="text/css">
    <style>
      .example {
        height: 140px;
@@ -178,7 +177,7 @@
    <div class="navbar navbar-inverse navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container">
-          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+          <a class="brand" href="./"><img src="./resources/logo-70x70.png"> OpenLayers 3 Examples</a>
          <form class="navbar-search pull-left">
            <input name="q" type="text" id="keywords" class="search-query" placeholder="Search">
            <span id="count"></span>
--- a/examples_src/mobile-full-screen.html
+++ b/examples_src/mobile-full-screen.html
@@ -19,8 +19,8 @@ template: "example-verbatim.html"
  </head>
  <body>
    <div id="map" class="map"></div>
-    <script src="../resources/jquery.min.js" type="text/javascript"></script>
-    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+    <script src="https://code.jquery.com/jquery-1.9.1.min.js" type="text/javascript"></script>
+    <script src="./resources/example-behaviour.js" type="text/javascript"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/fastclick/1.0.6/fastclick.min.js" type="text/javascript"></script>
    <script src="loader.js?id=mobile-full-screen" type="text/javascript"></script>

--- a/examples_src/resources/example-behaviour.js
+++ b/examples_src/resources/example-behaviour.js
--- a/examples_src/resources/layout.css
+++ b/examples_src/resources/layout.css
@@ -6,7 +6,7 @@ body {
 .map {
  height: 400px;
  width: 100%;
-  background: url(textured_paper.jpeg) repeat;
+  background: url(map-background.jpg) repeat;
 }
 .ol-attribution {
  max-width: calc(100% - 3em);
@@ -29,3 +29,7 @@ body, h1, h2, h3, h4, p, li, td, th {
  color: white;
  padding: 5px;
 }
+.brand img {
+  width: 35px;
+  height: 35px;
+}
--- a/examples_src/resources/logo-70x70.png
+++ b/examples_src/resources/logo-70x70.png
--- a/examples_src/resources/map-background.jpg
+++ b/examples_src/resources/map-background.jpg
--- a/examples_src/resources/prism/prism.css
+++ b/examples_src/resources/prism/prism.css
--- a/examples_src/resources/prism/prism.min.js
+++ b/examples_src/resources/prism/prism.min.js
--- a/examples_src/resources/zeroclipboard/.jshintrc
+++ b/examples_src/resources/zeroclipboard/.jshintrc
--- a/examples_src/resources/zeroclipboard/ZeroClipboard.Core.js
+++ b/examples_src/resources/zeroclipboard/ZeroClipboard.Core.js
--- a/examples_src/resources/zeroclipboard/ZeroClipboard.Core.min.js
+++ b/examples_src/resources/zeroclipboard/ZeroClipboard.Core.min.js
--- a/examples_src/resources/zeroclipboard/ZeroClipboard.Core.min.map
+++ b/examples_src/resources/zeroclipboard/ZeroClipboard.Core.min.map
--- a/examples_src/resources/zeroclipboard/ZeroClipboard.js
+++ b/examples_src/resources/zeroclipboard/ZeroClipboard.js
--- a/examples_src/resources/zeroclipboard/ZeroClipboard.min.js
+++ b/examples_src/resources/zeroclipboard/ZeroClipboard.min.js
--- a/examples_src/resources/zeroclipboard/ZeroClipboard.min.map
+++ b/examples_src/resources/zeroclipboard/ZeroClipboard.min.map
--- a/examples_src/resources/zeroclipboard/ZeroClipboard.swf
+++ b/examples_src/resources/zeroclipboard/ZeroClipboard.swf
--- a/resources/bootstrap/css/bootstrap-responsive.css
+++ b/resources/bootstrap/css/bootstrap-responsive.css
--- a/resources/bootstrap/css/bootstrap-responsive.min.css
+++ b/resources/bootstrap/css/bootstrap-responsive.min.css
--- a/resources/bootstrap/css/bootstrap.css
+++ b/resources/bootstrap/css/bootstrap.css
--- a/resources/bootstrap/css/bootstrap.min.css
+++ b/resources/bootstrap/css/bootstrap.min.css
--- a/resources/bootstrap/img/glyphicons-halflings-white.png
+++ b/resources/bootstrap/img/glyphicons-halflings-white.png
--- a/resources/bootstrap/img/glyphicons-halflings.png
+++ b/resources/bootstrap/img/glyphicons-halflings.png
--- a/resources/bootstrap/js/bootstrap.js
+++ b/resources/bootstrap/js/bootstrap.js
--- a/resources/bootstrap/js/bootstrap.min.js
+++ b/resources/bootstrap/js/bootstrap.min.js
--- a/resources/display-frame-rate.js
+++ b/resources/display-frame-rate.js
@@ -1,39 +0,0 @@
-/**
- * Display frame rate in a span element added to the navigation bar.
- */
-(function() {
-
-  var container = document.querySelector('.navbar .navbar-inner .container');
-  if (!container) {
-    return;
-  }
-
-  if (!window.requestAnimationFrame) {
-    return;
-  }
-
-  var fpsElement = document.createElement('span');
-  fpsElement.style.color = 'white';
-
-  container.appendChild(fpsElement);
-
-  var frameCount = 0;
-  var begin = +new Date();
-
-  window.setInterval(function() {
-    var end = +new Date();
-    var milliseconds = end - begin;
-    var seconds = milliseconds / 1000.0;
-    var frameRate = frameCount / seconds;
-    fpsElement.innerHTML = frameRate.toPrecision(4) + ' fps';
-    frameCount = 0;
-    begin = end;
-  }, 500);
-
-  var go = function() {
-    frameCount++;
-    window.requestAnimationFrame(go);
-  };
-  go();
-
-})();
--- a/resources/jquery.min.js
+++ b/resources/jquery.min.js
--- a/resources/logo-32x32-optimized.png
+++ b/resources/logo-32x32-optimized.png
--- a/resources/logo-32x32.png
+++ b/resources/logo-32x32.png
--- a/resources/logo.png
+++ b/resources/logo.png
--- a/tasks/build-examples.js
+++ b/tasks/build-examples.js
@@ -12,7 +12,7 @@ var isCssRegEx = /\.css$/;
 var isJsRegEx = /\.js$/;

 var srcDir = path.join(__dirname, '..', 'examples_src');
-var destDir = path.join(__dirname, '..', 'examples');
+var destDir = path.join(__dirname, '..', 'build', 'examples');
 var templatesDir = path.join(__dirname, '..', 'config', 'examples');

 /**
--- a/tasks/serve.js
+++ b/tasks/serve.js
@@ -10,6 +10,7 @@ var url = require('url');
 var Gaze = require('gaze').Gaze;
 var closure = require('closure-util');
 var debounce = require('debounce');
+var fse = require('fs-extra');
 var nomnom = require('nomnom');

 var buildExamples = require('./build-examples');
@@ -31,7 +32,7 @@ var createServer = exports.createServer = function(callback) {
      'build/test_requires.js',
      'build/test_rendering_requires.js'
    ],
-    main: 'examples/*.js'
+    main: 'build/examples/*.js'
  });
  manager.on('error', function(err) {
    if (server) {
@@ -43,7 +44,7 @@ var createServer = exports.createServer = function(callback) {
  manager.on('ready', function() {
    server = new closure.Server({
      manager: manager,
-      loader: /^\/\w+\/loader.js/,
+      loader: /^.*\/loader\.js/,
      getMain: function(req) {
        var main;
        var query = url.parse(req.url, true).query;
@@ -85,11 +86,24 @@ function buildExamplesOrFatal(opt_callback) {
      log.verbose('serve', err.stack);
      process.exit(1);
    }
+    // This is awkward, but then so is CSS itself
+    var src = path.join(__dirname, '..', 'css', 'ol.css');
+    var dest = path.join(__dirname, '..', 'build', 'css', 'ol.css');
+    fse.copy(src, dest, function(err2) {
+      if (err2) {
+        log.error('serve', 'Failed to copy CSS.');
+        log.error('serve', err.message);
+        log.error('serve',
+            'Use "verbose" logging to see the full stack trace.');
+        log.verbose('serve', err.stack);
+        process.exit(1);
+      }
      log.verbose('serve', 'Done building examples.');
      if (opt_callback) {
        opt_callback();
      }
    });
+  });
 }

 /**