====== Layout framework with Angular ======
===== Prerequisites =====
Setup basic project structure as: https://github.com/thuydang/angular_project_template/tree/dir_structure_1.1

====== Layout Framework ======

===== Look for a way to have modular layout components =====


  * http://stackoverflow.com/questions/25667660/angular-ui-router-nested-states-with-multiple-layouts
  * http://plnkr.co/edit/I0BJ09BxR7nG9kZDeEIv?p=preview
  * http://stackoverflow.com/questions/22104893/angular-ui-router-how-to-create-a-layout-state/32196068#32196068
  * http://www.webcodegeeks.com/javascript/angular-js/angularjs-ui-router-components/

===== Html Layout Spotter =====
<code html>
body
-- outer-wrapper
---- inner-wrapper
------ <navigation>
------ header
-------- wrapper
---------- brand
---------- /brand
---------- Navigation items
---------- /Navigation items
-------- /wrapper
------ /header
------ </navigation>

------ <page canvas>
-------- <off-canvas navigation>
         Toggle to show sidebar
-------- </off-canvas navigation>

-------- <page content>
---------- <section map>
---------- </section map>

---------- <section feature>
---------- </section feature>

---------- <section latest>
---------- </section latest>
-------- </page content>
------ </page canvas>

------ <footer>
------ </footer>

---- /inner-wrapper
--
-- js
/--
</code>

The layout will have 3 views: header, content, footer.

==== layout module ====
layout.tpl.html

<code>

</code>