109 lines
3.3 KiB
JavaScript
109 lines
3.3 KiB
JavaScript
|
|
$(function(){
|
|
|
|
var model = {
|
|
// renomear
|
|
dat: [
|
|
],
|
|
read_json: function() {
|
|
$.ajax({
|
|
url: "/cards.json",
|
|
dataType: 'json',
|
|
async: false,
|
|
success: function(data) {
|
|
$(data["cards"]).each(function(){
|
|
var card_info = $(this)[0];
|
|
model.set_data(card_info);
|
|
});
|
|
}
|
|
});
|
|
},
|
|
set_data: function(d) {
|
|
model.dat.push(d);
|
|
},
|
|
get_data: function() {
|
|
return model.dat;
|
|
},
|
|
filter_data: function(conteudo) {
|
|
var $d = model.dat;
|
|
var $filter = [];
|
|
var $c = conteudo.toLowerCase();
|
|
$($d).each(function(i){
|
|
if(
|
|
$d[i].name.toLowerCase().indexOf($c) >= 0 ||
|
|
$d[i].description.toLowerCase().indexOf($c) >= 0 ||
|
|
$d[i].button_text.toLowerCase().indexOf($c) >= 0
|
|
) {
|
|
$filter.push($d[i]);
|
|
}
|
|
});
|
|
return $filter;
|
|
},
|
|
init: function() {
|
|
model.read_json();
|
|
}
|
|
};
|
|
var octopus = {
|
|
init: function() {
|
|
model.init();
|
|
view.init();
|
|
octopus.create_card(model.get_data());
|
|
},
|
|
create_card: function(d) {
|
|
$.each(d, function(i){
|
|
view.create_card(d[i].name, d[i].description, d[i].button_text, d[i].link, d[i].tor);
|
|
});
|
|
},
|
|
filter_data: function(c) {
|
|
var d = model.filter_data(c);
|
|
$.each(d, function(i){
|
|
view.create_card(d[i].name, d[i].description, d[i].button_text, d[i].link, d[i].tor);
|
|
});
|
|
},
|
|
recreate_cards: function() {
|
|
octopus.create_card(model.get_data());
|
|
}
|
|
};
|
|
|
|
// Renomear
|
|
var view = {
|
|
init: function() {
|
|
this.container = $(".flex-cards");
|
|
this.search_field = $("#search_field");
|
|
view.events();
|
|
},
|
|
events: function(){
|
|
this.search_field.on('input',function(){
|
|
var $conteudo = $(this).val();
|
|
view.clean_cards();
|
|
if($conteudo.length == 0){
|
|
octopus.recreate_cards();
|
|
}else {
|
|
octopus.filter_data($conteudo);
|
|
}
|
|
});
|
|
},
|
|
create_card: function(name, desc, bt_txt, link, tor){
|
|
var $card = $("<div>").addClass("card");
|
|
var $h1 = $("<h1>").text(name);
|
|
var $desc = $("<p>").text(desc);
|
|
var $button = $("<button>").addClass("button").text(bt_txt);
|
|
var $icon = $("<button>").addClass("tor").text("Tor");
|
|
var $a = $("<a>").attr("href", link);
|
|
var $tor = $("<a>").attr("href", tor);
|
|
$a.append($button);
|
|
$tor.append($icon);
|
|
if (tor == "#") {
|
|
$card.append($h1).append($desc).append($a);
|
|
} else {
|
|
$card.append($h1).append($desc).append($a).append($tor);
|
|
}
|
|
this.container.append($card);
|
|
},
|
|
clean_cards: function() {
|
|
this.container.empty();
|
|
}
|
|
};
|
|
octopus.init();
|
|
});
|