Skip to content

Commit 68926bf

Browse files
JohnnyTheTankJohnnyTheTank
committed
first stable version
1 parent 8f533ea commit 68926bf

5 files changed

Lines changed: 104 additions & 1 deletion

File tree

‎.gitignore‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,3 @@
1-
/.idea
1+
/bower_components
2+
/.idea
3+
/node_modules

‎bower.json‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
{
2+
"name": "angular-bricklayer",
3+
"homepage": "https://github.com/JohnnyTheTank/angular-bricklayer",
4+
"authors": [
5+
"Jonathan Hornung <jonathan.hornung@gmail.com>"
6+
],
7+
"description": "AngularJS module for bricklayer, a lightweight & independent cascading grid layout library",
8+
"main": "",
9+
"moduleType": [],
10+
"keywords": [
11+
"angular",
12+
"angularjs",
13+
"grid",
14+
"bricklayer",
15+
"masonry"
16+
],
17+
"ignore": [
18+
"**/.*",
19+
"src",
20+
"node_modules",
21+
"bower_components",
22+
"test",
23+
"tests",
24+
"demo"
25+
],
26+
"license": "MIT",
27+
"dependencies": {
28+
"bricklayer": "^0.3.0"
29+
}
30+
}

‎demo/app.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
angular.module('app', ['jtt_bricklayer']);

‎demo/index.html‎

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1">
7+
8+
<title>angular-bricklayer</title>
9+
10+
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bricklayer/0.2.4/bricklayer.min.css">
11+
12+
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.3/angular.min.js"></script>
13+
<script src="//cdnjs.cloudflare.com/ajax/libs/bricklayer/0.2.4/bricklayer.min.js"></script>
14+
15+
<script src="app.js"></script>
16+
<script src="../src/angular-bricklayer.js"></script>
17+
18+
<style>
19+
.bricklayer-column-sizer {
20+
width: 10%;
21+
}
22+
23+
.box {
24+
margin: 10px 0;
25+
}
26+
</style>
27+
28+
</head>
29+
<body ng-app="app">
30+
31+
<!-- Bricklayer needs to have "bricklayer" class name. -->
32+
<div class="bricklayer">
33+
<div class="box" style="background-color: red; height: 100px"></div>
34+
<div class="box" style="background-color: green; height: 70px"></div>
35+
<div class="box" style="background-color: blue; height: 30px"></div>
36+
<div class="box" style="background-color: orange; height: 40px"></div>
37+
<div class="box" style="background-color: red; height: 100px"></div>
38+
<div class="box" style="background-color: green; height: 70px"></div>
39+
<div class="box" style="background-color: blue; height: 30px"></div>
40+
<div class="box" style="background-color: orange; height: 40px"></div>
41+
<div class="box" style="background-color: red; height: 100px"></div>
42+
<div class="box" style="background-color: green; height: 70px"></div>
43+
<div class="box" style="background-color: blue; height: 30px"></div>
44+
<div class="box" style="background-color: orange; height: 40px"></div>
45+
<div class="box" style="background-color: red; height: 100px"></div>
46+
<div class="box" style="background-color: green; height: 70px"></div>
47+
<div class="box" style="background-color: blue; height: 30px"></div>
48+
<div class="box" style="background-color: orange; height: 40px"></div>
49+
<div class="box" style="background-color: red; height: 100px"></div>
50+
<div class="box" style="background-color: green; height: 70px"></div>
51+
<div class="box" style="background-color: blue; height: 30px"></div>
52+
<div class="box" style="background-color: orange; height: 40px"></div>
53+
<div class="box" style="background-color: red; height: 100px"></div>
54+
<div class="box" style="background-color: green; height: 70px"></div>
55+
<div class="box" style="background-color: blue; height: 30px"></div>
56+
<div class="box" style="background-color: orange; height: 40px"></div>
57+
</div>
58+
59+
</body>
60+
</html>

‎src/angular-bricklayer.js‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
angular.module('jtt_bricklayer', [])
2+
.directive('bricklayer', function () {
3+
return {
4+
restrict: 'C',
5+
replace: 'false',
6+
link: function (scope, element, attrs) {
7+
var bricklayer = new Bricklayer(element[0])
8+
}
9+
}
10+
});

0 commit comments

Comments
 (0)