cards.js
2.88 KB
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
$(document).ready(function(event) {
$("div#swipe_right").on( "click", function() {
swipeRight();
});
$("div#swipe_left").on( "click", function() {
swipeLeft();
});
addNewProposal();
function swipe() {
Draggable.create("#proposal", {
throwProps:true,
onDragEnd:function(endX) {
if(Math.round(this.endX) > 0 ) {
swipeRight();
}
else {
swipeLeft();
}
console.log(Math.round(this.endX));
}
});
}
function swipeRight() {
var $proposal = $("div.cards").find('#proposal');
var swipe = new TimelineMax({repeat:0, yoyo:false, repeatDelay:0, onComplete:remove, onCompleteParams:[$proposal]});
swipe.staggerTo($proposal, 0.8, {bezier:[{left:"+=400", top:"+=300", rotation:"60"}], ease:Power1.easeInOut});
addNewProposal();
}
function swipeLeft() {
var $proposal = $("div.cards").find('#proposal');
var swipe = new TimelineMax({repeat:0, yoyo:false, repeatDelay:0, onComplete:remove, onCompleteParams:[$proposal]});
swipe.staggerTo($proposal, 0.8, {bezier:[{left:"+=-350", top:"+=300", rotation:"-60"}], ease:Power1.easeInOut});
addNewProposal();
}
function remove(proposal) {
$(proposal).remove();
}
function addNewProposal() {
var names = ['Proposta 01', 'Proposta 02'][Math.floor(Math.random() * 2)];
var descs = ['Lorem ipsum dolor sit amet, eum no viderer molestie percipitur. Ea vis eirmod iuvaret concludaturque, sonet admodum accusamus nec ad.','Mea purto sonet te. Ut quo assum nostrum, vel justo suavitate cu, veniam malorum sit no. Eu has vocent quaeque.'][Math.floor(Math.random() * 2)]
var bgs = ['landscape.jpg','propostadeconferencia.png'][Math.floor(Math.random() * 2)];
var author = ['John Smith', 'Comissão Organizadora Brasilia'][Math.floor(Math.random() * 2)];
var comments = ['320', '15'][Math.floor(Math.random() * 2)];
var topics = ['Saúde', 'Educação'][Math.floor(Math.random() * 2)];
$("div.cards").prepend('<div class="card" id="proposal">'
+ '<div class="card-main">'
+ '<div class="card-img">'
+ '<img alt="alt text" src="images/samples/'+bgs+'">'
+ '<p class="card-img-heading">'+names+'<br /><span class="card-img-subheading">Eixo: '+topics+' | Autor: '+author+' | '+comments+' comentários</span></p></div>'
+ '<div class="card-inner"><p>'+descs+'</p></div>'
+ '<div class="card-action">'
+ '<ul class="nav nav-list pull-right">'
+ '<li><a href="proposta.html"><span class="icon icon-open-in-new text-blue"></span> <span class="text-blue">Leia Mais</span></a></li><li><a data-toggle="modal" href="#comment-action"><span class="icon icon-comment"></span> Comentar</a></li><li><a href="javascript:void(0)"><span class="icon icon-notifications"></span> Seguir</a></li>'
+ '</ul></div>'
+ '</div></div>');
swipe();
}
});