-
Notifications
You must be signed in to change notification settings - Fork 0
/
demo-list.html
82 lines (75 loc) · 2.16 KB
/
demo-list.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<link rel="import" href="../tangere/tangere.html">
<link rel="import" href="at-core-list.html">
<dom-module id="demo-list">
<template>
<style>
:host {
display: block;
}
at-core-list {
width: 100%;
}
</style>
<at-core-list id="list" layout="card" items="{{data}}" item-component="demo-item"></at-core-list>
</template>
</dom-module>
<script>
(function () {
var strings = [
"PARKOUR!",
"Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit. Lorem est qui dolorem ipsum quia. ",
"Lorem Ipsum is simply dummy text of the printing and typesetting industry."
];
var namegen = {
generateString: function (inLength) {
var s = '';
for (var i = 0; i < inLength; i++) {
s += String.fromCharCode(Math.floor(Math.random() * 26) + 97);
}
return s;
},
generateName: function (inMin, inMax) {
return this.generateString(Math.floor(Math.random() * (inMax - inMin + 1) + inMin));
}
};
Polymer({
is: 'demo-list',
count: 100,
ready: function () {
this.data = this.generateData();
},
properties: {
data: { type: Object }
},
generateData: function () {
var names = [],
data = [];
for (var i = 0; i < this.count; i++) {
names.push(namegen.generateName(4, 8));
}
names.sort();
for (var i = 0; i < this.count; i++) {
var name = names[i];
var divider = name.charAt(0);
if (divider === (names[i - 1] || '').charAt(0)) {
divider = null;
}
var age = new Date();
age.setMinutes(age.getMinutes() - i + 10);
// <img class="ui avatar image" src="images/{{ index | modulo:4 }}.png">
data.push({
index: i,
description: name,
divider: divider,
title: strings[i % 3],
date: age.toISOString()
});
}
return data;
},
tapAction: function (e) {
console.log('tap', e);
}
});
})();
</script>