diff --git a/.tmpl/index.tmpl b/.tmpl/index.tmpl
index d1f7a2a..1f53016 100644
--- a/.tmpl/index.tmpl
+++ b/.tmpl/index.tmpl
@@ -6,118 +6,122 @@
<title>Angular UI ~ <%= meta.view.humaName %> Doc</title>
<!-- Le css -->
- <link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
- <link rel="stylesheet" href="assets/css/style.css">
- <link rel="stylesheet" href="assets/css/cssLoading.css">
- <link rel="stylesheet" href="assets/css/prettify.css">
+ <link rel="stylesheet" type="text/css" href="assets/css/bootstrap.min.css"/>
+ <link rel="stylesheet" type="text/css" href="assets/css/style.css"/>
+ <link rel="stylesheet" type="text/css" href="assets/css/prettify.css"/>
+
+<%
+ var cssFiles = grunt.config('meta.view.css') || [];;
+
+ for(var i = 0, len = cssFiles.length; i < len; i++) {
+ print(' <link rel="stylesheet" type="text/css" href="' + cssFiles[i] + '"/>\n');
+ }
+%>
</head>
<body>
-<!-- Le navbar
-================================================== -->
-<div class="navbar navbar-fixed-top">
- <div class="navbar-inner">
- <div class="container">
- <div class="dropdown pull-left">
- <a class="brand dropdown-toggle" role="button" data-toggle="dropdown" href="#">
- <%= meta.view.humaName %>
- <b class="caret"></b>
- </a>
- <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
- <li><a href="https://github.com/angular-ui/"><strong>Related Projects:</strong></a></li>
- <li class="divider"></li>
- <li><a href="http://angular-ui.github.io/">AngularUI</a></li>
- <li><a href="http://angular-ui.github.io/bootstrap/">UI Bootstrap</a></li>
- <li><a href="http://angular-ui.github.io/ng-grid/">Grid</a></li>
- <li><a href="https://github.com/angular-ui/AngularJs.tmbundle">AngularJS.tmbundle</a></li>
- <li><a href="http://angular-ui.github.io/ui-router/sample/">Router <span class="label label-success">New!</span></a></li>
- </ul>
- </div>
- <div class="nav-collapse pull-right">
- <ul class="nav">
- <li class="dropdown" ng-show="!isLoading" style="display: none">
- <a href="#" class="dropdown-toggle" data-toggle="dropdown">Modules <b class="caret"></b></a>
- <ul class="dropdown-menu">
- <li ng-repeat="s in sections"><a href="#{{s.id}}"> {{s.name}} </a></li>
- </ul>
- </li>
-
- </ul>
- </div>
- </div>
- </div>
-</div>
-<div style="margin: 32px;"></div>
-
-<!-- Le header
-================================================== -->
-<header class="hero-unit" id="overview">
- <div class="container">
-
- <h1><%= meta.view.humaName %></h1>
-
- <p><%= pkg.description %></p>
-
- <p class="btn-group">
- <a class="btn" href="https://github.com/angular-ui/<%= meta.view.repoName %>"><i class="icon-github"></i> Code on Github</a>
- <a class="btn btn-primary" href="https://github.com/angular-ui/<%= meta.view.repoName %>/tree/gh-pages/build">
- <i class="icon-download-alt icon-white"></i> Download <small>(<%= pkg.version %>)</small>
- </a>
- </p>
- </div>
- <div class="bs-docs-social">
- <div class="container">
- <ul class="bs-docs-social-buttons">
- <li>
- <iframe src="http://ghbtns.com/github-btn.html?user=angular-ui&repo=<%= meta.view.repoName %>&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="110" height="20"></iframe>
- </li>
- <li>
- <iframe src="http://ghbtns.com/github-btn.html?user=angular-ui&repo=<%= meta.view.repoName %>&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="95" height="20"></iframe>
- </li>
- <li>
- <!-- Place this tag where you want the +1 button to render. -->
- <div class="g-plusone" data-size="medium"></div>
-
- <!-- Place this tag after the last +1 button tag. -->
- <script type="text/javascript">
- (function () {
- var po = document.createElement('script');
- po.type = 'text/javascript';
- po.async = true;
- po.src = 'https://apis.google.com/js/plusone.js';
- var s = document.getElementsByTagName('script')[0];
- s.parentNode.insertBefore(po, s);
- })();
- </script>
- </li>
- </ul>
- </div>
- </div>
-</header>
-
-<!-- Le main
-================================================== -->
-<div class="container main ng-cloak" ng-controller="MainCtrl" ng-cloak>
- <div ng-include src="'demos.html'" onload="makeNav()"></div>
-</div>
-
-<!-- Le loading
-================================================== -->
-
-<div class="loadingAnimation" ng-show="isLoading">
- <div class="bowl_ringG">
- <div class="ball_holderG">
- <div class="ballG">
+ <!-- Le navbar
+ ================================================== -->
+ <div class="navbar navbar-fixed-top">
+ <div class="navbar-inner">
+ <div class="container">
+ <div class="dropdown pull-left">
+ <a class="brand dropdown-toggle" role="button" data-toggle="dropdown" href="#">
+ <%= meta.view.humaName %>
+ <b class="caret"></b>
+ </a>
+ <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
+ <li><a href="https://github.com/angular-ui/"><strong>Related Projects:</strong></a></li>
+ <li class="divider"></li>
+ <li><a href="http://angular-ui.github.io/">AngularUI</a></li>
+ <li><a href="http://angular-ui.github.io/bootstrap/">UI Bootstrap</a></li>
+ <li><a href="http://angular-ui.github.io/ng-grid/">Grid</a></li>
+ <li><a href="https://github.com/angular-ui/AngularJs.tmbundle">AngularJS.tmbundle</a></li>
+ <li><a href="http://angular-ui.github.io/ui-router/sample/">Router <span class="label label-success">New!</span></a></li>
+ </ul>
+ </div>
+ </div>
</div>
- </div>
</div>
-</div>
+ <div style="margin: 32px;"></div>
+
+ <!-- Le header
+ ================================================== -->
+ <header class="hero-unit" id="overview">
+ <div class="container">
+
+ <h1><%= meta.view.humaName %></h1>
+
+ <p><%= pkg.description %></p>
+
+ <p class="btn-group">
+ <a class="btn" href="https://github.com/angular-ui/<%= meta.view.repoName %>"><i class="icon-github"></i> Code on Github</a>
+ <a class="btn btn-primary" href="https://github.com/angular-ui/<%= meta.view.repoName %>/tree/gh-pages/build">
+ <i class="icon-download-alt icon-white"></i> Download <small>(<%= pkg.version %>)</small>
+ </a>
+ </p>
+ </div>
+ <div class="bs-docs-social">
+ <div class="container">
+ <ul class="bs-docs-social-buttons">
+ <li>
+ <iframe src="http://ghbtns.com/github-btn.html?user=angular-ui&repo=<%= meta.view.repoName %>&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="110" height="20"></iframe>
+ </li>
+ <li>
+ <iframe src="http://ghbtns.com/github-btn.html?user=angular-ui&repo=<%= meta.view.repoName %>&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="95" height="20"></iframe>
+ </li>
+ <li>
+ <!-- Place this tag where you want the +1 button to render. -->
+ <div class="g-plusone" data-size="medium"></div>
+
+ <!-- Place this tag after the last +1 button tag. -->
+ <script type="text/javascript">
+ (function () {
+ var po = document.createElement('script');
+ po.type = 'text/javascript';
+ po.async = true;
+ po.src = 'https://apis.google.com/js/plusone.js';
+ var s = document.getElementsByTagName('script')[0];
+ s.parentNode.insertBefore(po, s);
+ })();
+ </script>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </header>
+
+ <!-- Le main
+ ================================================== -->
+ <div class="container">
+
+ <%= meta.view.demoHTML %>
+
+ </div>
+
+ <!-- Le javascript
+ ================================================== -->
+
+ <script src="assets/vendor/jquery.min.js"></script>
+ <script src="assets/vendor/bootstrap.min.js"></script>
+
+ <script src="assets/vendor/prettify.js"></script>
+
+ <script src="assets/vendor/angular.min.js"></script>
+ <script src="core/prettifyDirective.js"></script>
+
+<%
+ var jsFiles = grunt.config('meta.view.js') || [];
-<!-- Le javascript
-================================================== -->
-<script data-main="core/main.js" src="assets/vendor/require.min.js"></script>
+ for(var i = 0, len = jsFiles.length; i < len; i++) {
+ print(' <script src="' + jsFiles[i] + '"></script>\n');
+ }
+%>
+ <script>
+ <%= meta.view.demoJS %>
+ </script>
</body>
diff --git a/.travis/after_success.sh b/.travis/after_success.sh
index 104cbc5..13cd056 100755
--- a/.travis/after_success.sh
+++ b/.travis/after_success.sh
@@ -7,7 +7,7 @@ echo -e "\n>>> Current Repo:$REPO --- Travis Branch:$TRAVIS_BRANCH\n"
echo -e ">>> Grunt the doc.\n"
grunt build-doc
-cp -R components/angular-ui-docs $HOME/out
+cp -R bower_components/angular-ui-docs $HOME/out
echo -e ">>> Clone the gh-pages branch.\n"
diff --git a/.travis/before_script.sh b/.travis/before_script.sh
index 69f2026..824982c 100755
--- a/.travis/before_script.sh
+++ b/.travis/before_script.sh
@@ -18,7 +18,7 @@ base64 --decode --ignore-garbage ~/.ssh/travis_rsa_64 > ~/.ssh/id_rsa
chmod 600 ~/.ssh/id_rsa
echo -e ">>> Copy config"
-mv -fv components/angular-ui-docs/.travis/ssh-config ~/.ssh/config
+mv -fv bower_components/angular-ui-docs/.travis/ssh-config ~/.ssh/config
echo -e ">>> Hi github.com !"
ssh -T git@github.com
diff --git a/README.md b/README.md
index 40427b8..6505f28 100644
--- a/README.md
+++ b/README.md
@@ -5,10 +5,16 @@ This generator use Grunt, AngularJS, RequireJS and jQuery.
## How to add it !
-Add it as a submodule of your module.
+Add it as a bower component.
```sh
-git submodule add git://github.com/angular-ui/angular-ui-docs.git out
+bower install git://github.com/angular-ui/angular-ui-docs.git
+```
+or add to your `bower.json`
+```Javascript
+ "devDependencies": {
+ "angular-ui-docs": "angular-ui/angular-ui-docs"
+ }
```
**It's working with ssh deploy key !**
@@ -25,7 +31,7 @@ env:
Then add the scripts and limit the build-able branches.
-```
+```yaml
before_script: out/.travis/before_script.sh
after_success: out/.travis/after_success.sh
branches:
@@ -45,10 +51,18 @@ First you need to generate the `index.html` using [grunt-contrib-copy](https://g
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
meta: {
- view : {
- humaName : "UI <repo>",
- repoName : "<the github repo name>"
- }
+ view : {
+ humaName : "UI <repo>",
+ repoName : "<the github repo name>",
+ demoHTML : grunt.file.read("demo/demo.html"),
+ demoJS : grunt.file.read("demo/demo.js"),
+ css : [
+ '<any required css files>'
+ ],
+ js : [
+ '<any required script files>'
+ ]
+ }
},
copy: {
template : {
@@ -67,22 +81,23 @@ This will generate `index.html` using :
- the `meta.view.humaName` as title of the demo site,
- the `meta.view.repoName` in the github links,
-Then, like `index.html` automatically include a `demo.html` file, you will have to copy yours.
-```Javascript
- grunt.initConfig({
- copy: {
- main: {
- files: [
- {src: ['demo/demo.html'], dest: 'out/demos.html', filter: 'isFile'}
- ]
- }
- }
-});
-```
+## See it working locally !
+Actually the demo must be built !
+We are using _bower_ and _grunt_ for this.
-In this file you can use RequireJS, AngularJS and jQuery.
-I added a `requireCSS` as a HACK 'cause it's home made...
+First in you UI project run
+```sh
+npm install && bower install
+grunt build-doc
+```
-In bonus, the id of each section tag in the page are drawn into a _Module_ menu at the top right of the page.
+Then run a localhost on `bower_components/angular-ui-docs`
+```sh
+cd bower_components/angular-ui-docs
+python -m SimpleHTTPServer
+or
+php -S localhost:8000
+```
+and you'll have the generated website on http://localhost:8000/
diff --git a/assets/css/cssLoading.css b/assets/css/cssLoading.css
deleted file mode 100644
index 404be33..0000000
--- a/assets/css/cssLoading.css
+++ /dev/null
@@ -1,115 +0,0 @@
-.loadingAnimation {
- margin: auto;
- position: relative;
- width: 128px;
- height: 128px;
-}
-
-.bowl_ringG {
- position: absolute;
- width: 128px;
- height: 128px;
- border: 2px solid #B3B3B3;
- -moz-border-radius: 128px;
- -webkit-border-radius: 128px;
- -ms-border-radius: 128px;
- -o-border-radius: 128px;
- border-radius: 128px;
-}
-
-.ball_holderG {
- position: absolute;
- width: 34px;
- height: 128px;
- left: 47px;
- top: 0px;
- -moz-animation-name: ball_moveG;
- -moz-animation-duration: 0.5s;
- -moz-animation-iteration-count: infinite;
- -moz-animation-timing-function: linear;
- -webkit-animation-name: ball_moveG;
- -webkit-animation-duration: 0.5s;
- -webkit-animation-iteration-count: infinite;
- -webkit-animation-timing-function: linear;
- -ms-animation-name: ball_moveG;
- -ms-animation-duration: 0.5s;
- -ms-animation-iteration-count: infinite;
- -ms-animation-timing-function: linear;
- -o-animation-name: ball_moveG;
- -o-animation-duration: 0.5s;
- -o-animation-iteration-count: infinite;
- -o-animation-timing-function: linear;
- animation-name: ball_moveG;
- animation-duration: 0.5s;
- animation-iteration-count: infinite;
- animation-timing-function: linear;
-}
-
-.ballG {
- position: absolute;
- left: 0px;
- top: 0px;
- width: 100px;
- height: 100px;
- background: #FFFFFF;
- -moz-border-radius: 43px;
- -webkit-border-radius: 43px;
- -ms-border-radius: 43px;
- -o-border-radius: 43px;
- border-radius: 100%;
-}
-
-@-moz-keyframes ball_moveG {
- 0% {
- -moz-transform: rotate(0deg)
- }
-
- 100% {
- -moz-transform: rotate(360deg)
- }
-
-}
-
-@-webkit-keyframes ball_moveG {
- 0% {
- -webkit-transform: rotate(0deg)
- }
-
- 100% {
- -webkit-transform: rotate(360deg)
- }
-
-}
-
-@-ms-keyframes ball_moveG {
- 0% {
- -ms-transform: rotate(0deg)
- }
-
- 100% {
- -ms-transform: rotate(360deg)
- }
-
-}
-
-@-o-keyframes ball_moveG {
- 0% {
- -o-transform: rotate(0deg)
- }
-
- 100% {
- -o-transform: rotate(360deg)
- }
-
-}
-
-@keyframes ball_moveG {
- 0% {
- transform: rotate(0deg)
- }
-
- 100% {
- transform: rotate(360deg)
- }
-
-}
\ No newline at end of file
diff --git a/core/main.js b/core/main.js
deleted file mode 100644
index e616856..0000000
--- a/core/main.js
+++ /dev/null
@@ -1,71 +0,0 @@
-(function () {
- var _ = "assets/vendor/";
-
- /* =Require css
- -----------------------------------------------------------------------------*/
- window.requireCss = (function () {
- var registry = {}, loadCss;
-
- loadCss = function (url) {
- var link = document.createElement("link");
- link.type = "text/css";
- link.rel = "stylesheet";
- link.href = url;
- document.getElementsByTagName("head")[0].appendChild(link);
- };
-
- return function (url) {
- if (registry[url]) return;
- registry[url] = true;
- loadCss(url);
- };
- })();
-
- /* =Launcher
- -----------------------------------------------------------------------------*/
- requirejs(
- {
- baseUrl: './',
- paths: {
- 'jquery': _ + 'jquery.min',
- 'twitter-bootstrap': _ + 'bootstrap.min',
- 'prettyPrint': _ + 'prettify',
- 'angular': _ + 'angular.min'
- },
- shim: {
- 'core/prettifyDirective': { deps: ['prettyPrint', 'angular'] },
- 'twitter-bootstrap': { deps: ['jquery'] }
- },
- waitSeconds: 15
- },
- ['twitter-bootstrap', 'core/prettifyDirective'],
- function () {
-
- angular.module('x', ['prettifyDirective'])
- .controller('MainCtrl', [
- '$scope', function ($scope) {
-
- $scope.$root.isLoading = true;
-
- $scope.makeNav = function () {
-
- $scope.$root.sections = $.map($("section"), function (n) {
- return {
- id: n.id,
- name: n.id[0].toUpperCase() + n.id.slice(1)
- };
- });
-
- $scope.$root.isLoading = false;
-
- };
-
- }
- ]);
-
- angular.bootstrap(document, ['x']);
- });
-
-})();
-
-