chore(build): add custom build stuff (WIP)

This is just for demonstrating PR angular-ui#2892.
chrisirhc · Oct 27, 2014 · 60d813d · 60d813d
1 parent f07fecb
commit 60d813d
Show file tree

Hide file tree

Showing 5 changed files with 116 additions and 9 deletions.
diff --git a/assets/app.js b/assets/app.js
@@ -1,3 +1,4 @@
+/* global __banner: false, __mappings: false, __files: false, FastClick, smoothScroll */
 angular.module('ui.bootstrap.demo', ['ui.bootstrap', 'plunker', 'ngTouch'], function($httpProvider){
   FastClick.attach(document.body);
   delete $httpProvider.defaults.headers.common['X-Requested-With'];
@@ -19,9 +20,7 @@ function MainCtrl($scope, $http, $document, $modal, orderByFilter) {
       controller: 'SelectModulesCtrl',
       resolve: {
         modules: function() {
-          return $http.get(builderUrl + "/api/bootstrap").then(function(response) {
-            return response.data.modules;
-          });
+          return Object.keys(__mappings);
         }
       }
     });
@@ -55,12 +54,108 @@ var SelectModulesCtrl = function($scope, $modalInstance, modules) {
     $modalInstance.dismiss();
   };
 
-  $scope.download = function (selectedModules) {
-    var downloadUrl = builderUrl + "/api/bootstrap/download?";
-    angular.forEach(selectedModules, function(module) {
-      downloadUrl += "modules=" + module + "&";
+  $scope.build = function (selectedModules, version) {
+    /* global JSZip, saveAs */
+
+    var srcModuleNames = selectedModules
+    .map(function (module) {
+      return __mappings[module];
+    })
+    .reduce(function (toBuild, module) {
+      addIfNotExists(toBuild, module.name);
+
+      module.dependencies.forEach(function (depName) {
+        addIfNotExists(toBuild, depName);
+      });
+      return toBuild;
+    }, []);
+
+    var srcModules = srcModuleNames
+    .map(function (moduleName) {
+      return __mappings[moduleName];
+    });
+
+    var srcModuleFullNames = srcModules
+    .map(function (module) {
+      return module.moduleName;
     });
-    return downloadUrl;
+
+    var srcJsContent = srcModules
+    .reduce(function (buildFiles, module) {
+      return buildFiles.concat(module.srcFiles);
+    }, [])
+    .map(getFileContent)
+    .join('\n')
+    ;
+
+    var jsFile = createNoTplFile(srcModuleFullNames, srcJsContent);
+
+    var tplModuleNames = srcModules
+    .reduce(function (tplModuleNames, module) {
+      return tplModuleNames.concat(module.tplModules);
+    }, []);
+
+    var tplJsContent = srcModules
+    .reduce(function (buildFiles, module) {
+      return buildFiles.concat(module.tpljsFiles);
+    }, [])
+    .map(getFileContent)
+    .join('\n')
+    ;
+
+    var jsTplFile = createWithTplFile(srcModuleFullNames, srcJsContent, tplModuleNames, tplJsContent);
+
+    var zip = new JSZip();
+    zip.file('ui-bootstrap-custom-' + version + '.js', __banner + jsFile);
+    zip.file('ui-bootstrap-custom-' + version + '.min.js', __banner + uglify(jsFile));
+    zip.file('ui-bootstrap-custom-tpls-' + version + '.js', __banner + jsTplFile);
+    zip.file('ui-bootstrap-custom-tpls-' + version + '.min.js', __banner + uglify(jsTplFile));
+
+    saveAs(zip.generate({type: 'blob'}), 'ui-bootstrap-custom-build.zip');
+
+    function createNoTplFile(srcModuleNames, srcJsContent) {
+      return 'angular.module("ui.bootstrap", [' + srcModuleNames.join(',') + ']);\n' +
+        srcJsContent;
+    }
+
+    function createWithTplFile(srcModuleNames, srcJsContent, tplModuleNames, tplJsContent) {
+      var depModuleNames = srcModuleNames.slice();
+      depModuleNames.unshift('"ui.bootstrap.tpls"');
+
+      return 'angular.module("ui.bootstrap", [' + depModuleNames.join(',') + ']);\n' +
+        'angular.module("ui.bootstrap.tpls", [' + tplModuleNames.join(',') + ']);\n' +
+        srcJsContent + '\n' + tplJsContent;
+
+    }
+
+    function addIfNotExists(array, element) {
+      if (array.indexOf(element) == -1) {
+        array.push(element);
+      }
+    }
+
+    function getFileContent(fileName) {
+      return __files[fileName];
+    }
+
+    function uglify(js) {
+      /* global UglifyJS */
+
+      var ast = UglifyJS.parse(js);
+      ast.figure_out_scope();
+
+      var compressor = UglifyJS.Compressor();
+      var compressedAst = ast.transform(compressor);
+
+      compressedAst.figure_out_scope();
+      compressedAst.compute_char_frequency();
+      compressedAst.mangle_names();
+
+      var stream = UglifyJS.OutputStream();
+      compressedAst.print(stream);
+
+      return stream.toString();
+    }
   };
 };
 

diff --git a/assets/module-mapping.js b/assets/module-mapping.js
diff --git a/assets/raw-files.js b/assets/raw-files.js
diff --git a/assets/uglifyjs.js b/assets/uglifyjs.js
diff --git a/index.html b/index.html
@@ -9,11 +9,15 @@
     <meta name="google-site-verification" content="7lc5HyceLDqpV_6oNHteYFfxDJH7-S3DwnJKtNUKcRg" />
 
     <script src="//cdnjs.cloudflare.com/ajax/libs/fastclick/0.6.7/fastclick.min.js"></script>
+    <script src="//cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.0.0/FileSaver.min.js"></script>
+    <script src="//cdnjs.cloudflare.com/ajax/libs/jszip/2.4.0/jszip.min.js"></script>
     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.min.js"></script>
     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular-touch.min.js"></script>
     <script src="ui-bootstrap-tpls-0.11.2.min.js"></script>
     <script src="assets/plunker.js"></script>
     <script src="assets/app.js"></script>
+    <script src="assets/raw-files.js"></script>
+    <script src="assets/module-mapping.js"></script>
 
     <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet"/>
     <link rel="stylesheet" href="assets/rainbow.css"/>
@@ -2992,7 +2996,7 @@ <h4 style="text-align: center;">{{buildErrorText}}</h4>
     </div>
     <div class="modal-footer">
         <a class="btn btn-default" ng-click="cancel()">Close</a>
-        <a class="btn btn-primary" ng-disabled="!selectedModules.length" ng-href="{{selectedModules.length ? download(selectedModules) : ''}}">
+        <a class="btn btn-primary" ng-disabled="!selectedModules.length" ng-click="selectedModules.length && build(selectedModules, '0.11.2')">
             <i class="glyphicon glyphicon-download-alt"></i> Download {{selectedModules.length}} Modules
         </a>
     </div>
@@ -3012,5 +3016,6 @@ <h4 style="text-align: center;">{{buildErrorText}}</h4>
 
 </script>
 <script src="assets/smoothscroll-angular-custom.js"></script>
+<script src="assets/uglifyjs.js"></script>
 </body>
 </html>