Skip to content

Commit be8d411

Browse files
dhiltdhilt
authored
Merge pull request #165 from angular-ui/interpolation
Interpolation
2 parents f62856d + 9a5e573 commit be8d411

16 files changed

+181
-91
lines changed

‎.travis.yml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,9 @@ language: node_js
33
node_js:
44
- '6'
55

6+
addons:
7+
firefox: latest
8+
69
before_install:
710
- export DISPLAY=:99.0
811
- sh -e /etc/init.d/xvfb start

‎demo/differentItemHeights/differentItemHeights.html

Lines changed: 18 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,30 @@
11
<!doctype html>
22
<html>
33
<head>
4-
<meta charset="utf-8">
5-
<title>Different Item Heights</title>
6-
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js"></script>
7-
<script src="../../src/ui-scroll.js"></script>
8-
<script src="differentItemHeights.js"></script>
9-
<link rel="stylesheet" href="../css/style.css" type="text/css"/>
4+
<meta charset="utf-8">
5+
<title>Different Item Heights</title>
6+
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.1/angular.js"></script>
7+
<script src="../../dist/ui-scroll.js"></script>
8+
<script src="differentItemHeights.js"></script>
9+
<link rel="stylesheet" href="../css/style.css" type="text/css" />
1010
</head>
1111
<body ng-app="application">
1212

13-
<div class="cont cont-global">
13+
<div class="cont cont-global" ng-controller="MainCtrl">
1414

15-
<a class="back" href="../index.html">browse other examples</a>
15+
<a class="back" href="../index.html">browse other examples</a>
1616

17-
<h1 class="page-header page-header-exapmle">Different Item Heights</h1>
17+
<h1 class="page-header page-header-exapmle">Different Item Heights (Interpolation)</h1>
1818

19-
<div class="viewport-wrap">
20-
<div class="viewport " ui-scroll-viewport style="width: 350px; height2: 300px;">
21-
<div id="dhilt" style="height:0px; overflow: hidden">trololo</div>
22-
<div class="item" ui-scroll="item in datasource" style="height: {{item.height}}px">{{item.text}}</div>
23-
</div>
24-
</div>
19+
<div class="viewport-wrap">
20+
<div class="viewport " ui-scroll-viewport>
21+
<div ui-scroll="item in datasource" buffer-size="10" adapter="adapter">
22+
<div class="item" ng-style="{'height': item.height + 'px'}">
23+
{{"content # " + item.index + ' ' + item.height}}
24+
</div>
25+
</div>
26+
</div>
27+
</div>
2528

26-
</div>
2729
</body>
2830
</html>

‎demo/differentItemHeights/differentItemHeights.js

Lines changed: 35 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,44 @@
1-
angular.module('application', ['ui.scroll']).factory('datasource', [
2-
'$log', '$timeout', function(console, $timeout) {
3-
var get, max, min;
4-
min = -50;
5-
max = 100;
1+
angular.module('application', ['ui.scroll'])
62

7-
get = function(index, count, success) {
8-
$timeout(function() {
3+
.run(function($rootScope) {
4+
$rootScope.doReload = function () {
5+
$rootScope.$broadcast('DO_RELOAD');
6+
};
7+
})
8+
9+
.controller('MainCtrl', function($scope) {
10+
$scope.hello = 'Hello Main Controller!';
11+
var counter = 0;
12+
13+
var reloadListener = $scope.$on('DO_RELOAD', function() {
14+
if ($scope.adapter) {
15+
counter = 0;
16+
$scope.adapter.reload();
17+
}
18+
});
19+
20+
$scope.$on("$destroy", function() {
21+
reloadListener();
22+
});
23+
24+
var min = -1000, max = 1000, delay = 0;
25+
26+
$scope.datasource = {
27+
get: function(index, count, success) {
28+
setTimeout(function() {
929
var result = [];
1030
var start = Math.max(min, index);
1131
var end = Math.min(index + count - 1, max);
1232
if (start <= end) {
1333
for (var i = start; i <= end; i++) {
14-
var j = i > 0 ? i : (-1) * i;
15-
result.push({
16-
text: "item #" + i,
17-
height: 20 + (j%2) * 10
18-
});
34+
height = 50 + (counter++ * 2);
35+
result.push({ index: i, height: height });
1936
}
2037
}
21-
success(result);
22-
}, 50);
23-
};
38+
console.log('Got ' + result.length + ' items [' + start + '..' + end + ']');
39+
success(result);
40+
}, delay);
41+
}
42+
};
2443

25-
return {
26-
get: get
27-
};
28-
}
29-
]);
44+
});

‎dist/ui-scroll-grid.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/ui-scroll-grid.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/ui-scroll-grid.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/ui-scroll-grid.min.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/ui-scroll.js

Lines changed: 44 additions & 39 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/ui-scroll.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/ui-scroll.min.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)