g/familyARK
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Family in profile

Browse Source
This commit is contained in:
Gustavo Adolfo Mesa Roldán
2020-03-30 01:31:49 +02:00
parent 5c6b9dab3c
commit c30a8d85f7
4 changed files with 74 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
familyark/app/public/css/main.css
+9 -1
View File
@@ -100,7 +100,15 @@ td.options-table-species{
text-align: center;
}
table.info{
margin: auto;
}
#a-father button, .Male{
background-color: blue;
color: white;
}
#a-mother button, .Female{
background-color: pink;
}
familyark/app/public/js/buttons.js
+18 -1
View File
@@ -4,6 +4,14 @@ $('document').ready(function(){
// Botones
$("#home").click(function(){
$( "#body" ).load( "/templates/home.html" );
$.get("/info", function( data ) {
var text = "<table class=\"info\">"
$.each(data, function(i, obj) {
text += "<tr><td>"+i+"</td><td> "+obj+"</td></tr>";
});
text += "</table>"
$( "#info" ).html( text );
});
});
$("#animals").click(function(){
@@ -16,11 +24,20 @@ $('document').ready(function(){
$( "#body" ).html("<h1>Yours Dinos</h1><button id='animal-add' class='btn btn-success btn-sm float-right'>+ New Dino</button><br><br><table id='animals-table'></table>");
$( "#animal-add").click(function(){
$( "#body" ).load( "/templates/animal-form.html" );
$( "#body" ).load( "/templates/animal-form.html", function (){
set_animal_include("");
});
})
dataSet = data.data.map(function(item) {
return [item._id, item.name, item.initial_level + " - " + item.level, species[item.specie]];
});
// dataSet = data.data.reduce(function(acc, item, i) {
// if(i == 1) acc = []
// acc.push([item._id, item.name, item.initial_level + " - " + item.level, species[item.specie]]);
// return acc
// });
$('#animals-table').DataTable({
data: dataSet,
responsive: true,
familyark/app/public/js/functions.js
+27 -25
View File
@@ -13,7 +13,7 @@ function onSubmitAnimal(form){
type: "PUT",
url: "/animal/"+data._id,
data: JSON.stringify(data),
success: function() { $("#animals").click() },
success: function() { showAnimal(data._id) },
contentType : "application/json"
});
}else{
@@ -39,47 +39,40 @@ function editAnimal(id){
if(key == "father" || key == "mother" || key == "specie" || key == "sex"){
let a = key;
setTimeout(function(){
$('#a-'+a+' option[value='+data.data[0][a]+']').attr('selected','selected');
$('#a-'+a+' option[value='+animal[a]+']').attr('selected','selected');
}, 200)
}else{
$('input[name='+key+']').val( data.data[0][key] ? data.data[0][key].$numberDecimal ? data.data[0][key].$numberDecimal : data.data[0][key] : "");
$('input[name='+key+']').val( animal[key] ?animal[key].$numberDecimal ? animal[key].$numberDecimal : animal[key] : "");
}
}
}
$.get( "/species", function( data ) {
data.data.map(function(item){
$("#a-specie").append("<option value='"+item._id+"'>"+item.name+"</option>");
})
});
set_animal_include(animal._id);
paint_male_female(animal.specie, animal._id);
$("#a-specie").change(function(e){
paint_male_female($( this ).val(), animal._id);
})
});
});
}
function showAnimal(id){
$( "#body" ).load( "/templates/animal-show.html", function(){
var text = "<table><tr>";
var text = "<table>";
$.get( "/animal/"+ id, function( data ) {
var animal = data.data,
j = 1;
$.each(animal, function(i, val) {
text += "<td>"+i+"</td><td>"+(val ? val.$numberDecimal ? val.$numberDecimal : val : "")+"</td>";
if(j % 3 == 0) text += "</tr><tr>"
if(i != "_id" && i != "__v" && i.indexOf("initial") < 0)
text += "<tr><td>"+i+"</td><td>"+(val ? val.$numberDecimal ? val.$numberDecimal : val : "")+"</td></tr>";
// if(j % 3 == 0) text += "</tr><tr>"
j++;
});
text += "</tr></table>";
$("#a-name").html( );
text += "</table>";
$("#button").html('<button class="btn btn-info btn-sm float-right" onclick="editAnimal(\''+ animal._id +'\')">Edit</button>')
$(".a-name").html( animal.name );
$("#data").append( text );
// console.log(11)
get_parrents(animal);
// console.log(22)
get_childrens(animal);
// console.log(33)
});
});
@@ -114,17 +107,26 @@ function paint_male_female(specie, id){
function get_parrents(animal){
$.get( "/animal/parrents/" + animal._id, function( data ) {
data.data.map(function(item){
console.log(item);
$(item.sex == "Male" ? "#a-father" : "#a-mother").html("<button onclick=\"showAnimal('"+ item._id +"')\">" + item.name+" - "+ item.level + "</button>");
});
});
}
function get_childrens(animal){
$.get( "/animal/childrens/" + animal._id, function( data ) {
data.data.map(function(item){
console.log(item)
$("#a-childrens").append("<div class=\"col-6\"><button class=\"" + item.sex + "\" onclick=\"showAnimal('"+ item._id +"')\">" + item.name + " - " + item.level + "</button></div>");
})
});
}
function set_animal_include(id){
$.get( "/species", function( data ) {
data.data.map(function(item){
$("#a-specie").append("<option value='"+item._id+"'>"+item.name+"</option>");
});
});
$("#a-specie").change(function(e){
paint_male_female($( this ).val(), id);
});
}
familyark/app/public/templates/animal-show.html
+20 -2
View File
@@ -1,6 +1,24 @@
<h1 class="a-name">Un dino</h1>
<div class="row">
<div id="data" class="col-12"></div>
<div id="tree" class="col-6"></div>
<div id="button" class="col-12"></div>
<div id="data" class="col-6"></div>
<div id="tree" class="col-6">
<div class="col-12">
<div class="row">
<div class="col-6">
<b>Father</b>
<div id="a-father">---</div>
</div>
<div class="col-6">
<b>Mother</b>
<div id="a-mother">---</div>
</div>
</div>
</div>
<div class="col-6">
<div><b>Childrens</b></div>
<div id="a-childrens" class="row"></div>
</div>
</div>
<div id="chart" class="col-12"><h5>Aqui vendran graficas de cada atributo con el inicial y el actual, para que se pueda ver el crecimiento.</h5></div>
</div>