Initial commit

akatov · Nov 11, 2013 · 4623f9c · 4623f9c
commit 4623f9c
Show file tree

Hide file tree

Showing 6 changed files with 106 additions and 0 deletions.
diff --git a/.bowerrc b/.bowerrc
@@ -0,0 +1,3 @@
+{
+    "directory": "bower_components"
+}
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,2 @@
+node_modules
+bower_components
diff --git a/bower.json b/bower.json
@@ -0,0 +1,22 @@
+{
+  "name": "ng-layout",
+  "main": "ng-layout.js",
+  "version": "0.0.0",
+  "authors": [
+    "Dmitri Akatov <akatov@gmail.com>"
+  ],
+  "description": "simple reusable layouts",
+  "keywords": [
+    "layout"
+  ],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test"
+  ],
+  "devDependencies": {
+    "angular": "~1.2.0"
+  }
+}
diff --git a/ng-layout.js b/ng-layout.js
@@ -0,0 +1,43 @@
+'use strict';
+
+angular.module('ngLayout', [])
+  .directive('ngLayout', [
+    '$compile', '$timeout', '$templateCache', '$http',
+    function ($compile, $timeout, $templateCache, $http) {
+      var CONTENT_FOR = 'CONTENT_FOR'
+      var YIELD = 'YIELD'
+      return {
+        restrict: 'E',
+        scope: { src: '=' },
+        transclude: true,
+        compile: function(elmt, attr, transclude) {
+          var element = elmt
+          return function(scope, element, attrs) {
+            $http.get(attr.src, {cache: $templateCache}).success(function(html) {
+              var dom = $compile(html)(scope.$parent)
+              element.append(dom)
+              transclude(scope.$parent, function(clone, innerScope) {
+                var cs = {}
+                angular.forEach(clone, function(c) {
+                  var e = angular.element(c)
+                  var a = e.attr(CONTENT_FOR)
+                  if (!!a) {
+                    cs[a] = $compile(e)(innerScope)
+                  }
+                })
+                angular.forEach(element.find(YIELD), function(e) {
+                  var el = angular.element(e)
+                  var a = el.attr(CONTENT_FOR)
+                  var c = cs[a]
+                  if (!!c) {
+                    el.parent().append(c)
+                    el.remove()
+                  }
+                })
+              })
+            })
+          }
+        }
+      }
+    }
+  ])
diff --git a/test/fixtures/index.html b/test/fixtures/index.html
@@ -0,0 +1,26 @@
+<html>
+  <head>
+    <script type="text/javascript" src="../../bower_components/angular/angular.js"></script>
+    <script type="text/javascript" src="../../ng-layout.js"></script>
+    <script type="text/javascript">
+      angular.module('app', ['ngLayout'])
+        .controller('Ctrl', ['$scope', function($scope){
+          $scope.left = "Ying"
+          $scope.right = "Yang"
+        }])
+    </script>
+  </head>
+  <body ng-app='app'>
+    <div ng-controller="Ctrl">
+      {{ left }}
+      <ng-layout src="layout.html">
+        <div content_for="left">
+          {{ left }}
+        </div>
+        <div content_for="right">
+          {{ right }}
+        </div>
+      </ng-layout>
+    </div>
+  </body>
+</html>
diff --git a/test/fixtures/layout.html b/test/fixtures/layout.html
@@ -0,0 +1,10 @@
+<table>
+  <tr>
+    <td>
+      <yield content_for="left">
+    </td>
+    <td>
+      <yield content_for="right">
+    </td>
+  </tr>
+</table>