initial commit
This commit is contained in:
@@ -0,0 +1,449 @@
|
||||
$(function () {
|
||||
var appliedBindings = false;
|
||||
var totdagen = 365;
|
||||
var projStartM;
|
||||
var projEindM;
|
||||
function MaakGanttAchtergrond(){
|
||||
var self = ls.ModelMensen;
|
||||
|
||||
$("#bgTable2").remove();
|
||||
$("#bgTable3").remove();
|
||||
var Today = new Date();
|
||||
var graphStart;
|
||||
if (Today.getTime() < projStartM.getTime()) {
|
||||
graphStart = new Date (Today.getFullYear(), Today.getMonth(), Today.getDate());
|
||||
}
|
||||
else {
|
||||
graphStart = new Date(projStartM.getFullYear(), projStartM.getMonth(), 1);
|
||||
}
|
||||
var AddToEind = 1;
|
||||
if (self.schuifwidth >= 66){AddToEind= 12};
|
||||
dagen = GetDagen( projEindM.getMonth() + AddToEind, projEindM.getFullYear());
|
||||
var graphEind = new Date(projEindM.getFullYear() + 1, projEindM.getMonth() + AddToEind,dagen);
|
||||
GanttStartDateXX = graphStart;
|
||||
var t1='';
|
||||
var t2='';
|
||||
var t3='';
|
||||
var i=new Date(graphStart.getFullYear(), graphStart.getMonth(), graphStart.getDate());
|
||||
|
||||
var maand = 0;
|
||||
var jaar = 0;
|
||||
var lbl='';
|
||||
var colcounter =0;
|
||||
var colspan = 0;
|
||||
var colspandagen = 0;
|
||||
totdagen = 0;
|
||||
var bgColH = "#975796";
|
||||
var bgColM = "#e9dce9";
|
||||
while (i < graphEind){
|
||||
switch (self.periode())
|
||||
{ case 1:
|
||||
maand = i.getMonth();
|
||||
lbl=maandArray[maand] + " " + i.getFullYear();
|
||||
colspan = GetDagen((maand+ 1), i.getFullYear()) ;
|
||||
totdagen += colspan;
|
||||
colcounter += colspan;
|
||||
|
||||
t1 +="<td class='gColHeader3' " +
|
||||
"style='width: " + (colspan * self.dagwidth()) + "px' " +
|
||||
"coldagen = " + colspan +
|
||||
" colspan='" + colspan + "'>" + lbl +"</td> ";
|
||||
testdate=new Date(i);
|
||||
for (var j=1; j<=colspan;j++){
|
||||
testdate.setDate(j);
|
||||
if (bgColH == "#975796") {
|
||||
bgColH ="#b669b5";
|
||||
bgColM = "#f5eff5";
|
||||
}
|
||||
else {
|
||||
bgColH = "#975796";
|
||||
bgColM = "#e9dce9";
|
||||
}
|
||||
|
||||
if (testdate.getDay() == 0 || testdate.getDay() ==6) {
|
||||
t2 += "<td class='gCellM gColHeader4' style=' width:" + self.dagwidth() +"px; background-color: " + bgColH + "' dagen=1 >" + j +"</td>";
|
||||
t3 += "<td class='gCellM holy' dagen=1 style='width:" + self.dagwidth() +"px;background-color: " + bgColM + "' > </td>";
|
||||
}
|
||||
else {
|
||||
t2 += "<td class='gCellM gColHeader4' style=' width:" + self.dagwidth() +"px;background-color: " + bgColH + "' dagen =1>" + j +"</td>";
|
||||
t3 += "<td class='gCellM' dagen=1 style='width:" + self.dagwidth() +"px;background-color: " + bgColM + "' > </td>" ;
|
||||
};
|
||||
};
|
||||
i.setMonth(i.getMonth() + 1);
|
||||
break; // einde case 1
|
||||
case 2:
|
||||
var colspan2 = 0;
|
||||
var colspan = 0;
|
||||
var colspandagen = 0;
|
||||
maand = i.getMonth() + 1;
|
||||
lbl= i.getFullYear();
|
||||
|
||||
for (var j=maand; j<=12;j++){
|
||||
dagen = GetDagen(j, i.getFullYear());
|
||||
totdagen += dagen;
|
||||
colspandagen += dagen;
|
||||
colspan += 1;
|
||||
colcounter += 1;
|
||||
if (bgColH == "#975796") {
|
||||
bgColH ="#b669b5";
|
||||
bgColM = "#f5eff5";
|
||||
}
|
||||
else {
|
||||
bgColH = "#975796";
|
||||
bgColM = "#e9dce9";
|
||||
}
|
||||
t2 += "<td class='gCellM gColHeader4' style=' width:" + (dagen * self.dagwidth())+ "px; background-color: " + bgColH + "' dagen=" + dagen+ " >" + maandArray2[(j - 1)] +"</td>";
|
||||
t3 += "<td class='gCellM' dagen=" + dagen + " style='width:" + (dagen * self.dagwidth() ) +"px; background-color: " + bgColM + "' > </td>" ;
|
||||
};
|
||||
t1 +="<td class='gColHeader3' " +
|
||||
" style='width:" + (colspandagen * self.dagwidth() ) +"px' " +
|
||||
" coldagen = " + colspandagen +
|
||||
" colspan ='" + colspan + "'>" + lbl +"</td> ";
|
||||
i.setMonth (i.getMonth() + (12 - maand ) + 1);
|
||||
break; // einde case 2
|
||||
case 3:
|
||||
colspandagen = 0;
|
||||
colcounter += 1;
|
||||
dagen=GetDagen(2,i.getFullYear());
|
||||
dagen =337 + dagen;
|
||||
colspandagen += dagen;
|
||||
totdagen += dagen;
|
||||
if (bgColH == "#975796") {
|
||||
bgColH ="#b669b5";
|
||||
bgColM = "#f5eff5";
|
||||
}
|
||||
else {
|
||||
bgColH = "#975796";
|
||||
bgColM = "#e9dce9";
|
||||
}
|
||||
t1 +="<td class='gColHeader3' " +
|
||||
" style='width:" + (colspandagen * self.dagwidth() ) +"px' "+
|
||||
" coldagen =" + dagen +
|
||||
" dagen=" + dagen+ " > " + "</td> ";
|
||||
t2 += "<td class='gCellM gColHeader4' dagen=" + dagen + " style=' width:"+ (dagen * self.dagwidth)+ " px ; background-color: " + bgColH + "'>" + i.getFullYear() +"</td>";
|
||||
t3 += "<td class='gCellM' dagen=" +dagen + " style='width:" + (dagen * self.dagwidth()) +"px; background-color: " + bgColM + "'> </td>" ;
|
||||
i.setMonth (i.getMonth() + (12 - maand ) + 1);
|
||||
break;
|
||||
case 4: lbl= i.getFullYear();
|
||||
t1 +="<td class='gColHeader3'>" + lbl +"</td> ";
|
||||
i.setMonth (i.getMonth() + 12);
|
||||
break;
|
||||
default: i = graphEind;
|
||||
}
|
||||
} // einde while
|
||||
|
||||
var wTabel = self.dagwidth() * totdagen;
|
||||
var tr1 = $("<tr>");
|
||||
tr1.html(t1);
|
||||
var tr2=$("<tr>");
|
||||
tr2.html(t2);
|
||||
var gTHead1=$("<thead>").append(tr1).append(tr2);
|
||||
|
||||
var table=$("<table class='gTable' id='bgTable2' cellspacing=0 cellpadding= 0 cols='" + colcounter + "'>");
|
||||
table.css({width: wTabel + "px"});
|
||||
|
||||
table.append(gTHead1);
|
||||
$(table).insertAfter('#putheaderhere');
|
||||
|
||||
var matrix = '';
|
||||
var rows =13;
|
||||
for (i=0; i<rows;i++){
|
||||
matrix +='<tr>' + t3 + "</tr>";
|
||||
}
|
||||
table=$("<table class='gTable' id='bgTable3' cellspacing=0 cellpadding= 0 cols='" + colcounter + "'>");
|
||||
table.css({width: wTabel + "px"});
|
||||
|
||||
table.append(matrix);
|
||||
$(table).insertAfter('#puttablehere2');
|
||||
$("#puttablehere2").css({width: wTabel + "px"});
|
||||
|
||||
$(".scroller3").width((totdagen * self.dagwidth() ));
|
||||
$(".lijnstuk").each(function(index){
|
||||
$(this).width( $(this).attr('dagen') * self.dagwidth() );
|
||||
});
|
||||
CoordinatesToday(self.periode());
|
||||
};
|
||||
|
||||
function CoordinatesToday(periode){
|
||||
var self = ls.ModelMensen;
|
||||
var inDag = new Date()
|
||||
var startdag = new Date(projStartM.getFullYear(), projStartM.getMonth(),1);
|
||||
var vLeft = 0;
|
||||
dagen= Math.ceil((inDag.getTime() - startdag.getTime()) / MSdag );
|
||||
vLeft= (dagen - 0.5) * self.dagwidth() ;
|
||||
$('#todayLineM').css('left', vLeft);
|
||||
$('#todayLineM').css('height', 430);
|
||||
$("#todayLineM").attr("dagen",(dagen - 0.5) );
|
||||
if (inDag.getTime() > startdag.getTime() && inDag.getTime() < projEindM.getTime()){
|
||||
$('#scroller2').scrollLeft((vLeft - 20) );
|
||||
} ;
|
||||
};
|
||||
$("#scroller2").scroll(function() {
|
||||
$('#scroller1').scrollLeft($( "#scroller2") .scrollLeft()) ;
|
||||
$(".holder3").scrollLeft($("#scroller2").scrollLeft());
|
||||
});
|
||||
$("#scroller1").scroll(function() {
|
||||
$('#scroller2').scrollLeft($( "#scroller1") .scrollLeft()) ;
|
||||
$(".holder3").scrollLeft($("#scroller1").scrollLeft());
|
||||
});
|
||||
|
||||
fNewMens = function (m){
|
||||
var self= this;
|
||||
this.id = m.id;
|
||||
this.naam = m.fullname;
|
||||
this.takenC = ko.observableArray();
|
||||
$.each(m.takenC, function(i,t){
|
||||
self.takenC.push(t);
|
||||
})
|
||||
this.takenU = ko.observableArray();
|
||||
$.each(m.takenU, function(i,t){
|
||||
self.takenU.push(t);
|
||||
})
|
||||
|
||||
var nums = new Array();
|
||||
var dat1 = new Date(projStartM.getTime());
|
||||
dat1.setDate(1);
|
||||
var dat2 = new Date(projEindM.getTime());
|
||||
|
||||
// var i = 0;
|
||||
while (dat1.getTime() <=dat2.getTime()){
|
||||
var actcounter = 0;
|
||||
var vacties = '';
|
||||
var uacties ='';
|
||||
$.each(m.takenC, function(i,t){
|
||||
var datstart = new Date(t.start.substring(0,4), parseInt(t.start.substring(5,7) ,10)-1, t.start.substring(8,10));
|
||||
var dateind =new Date(t.eind.substring(0,4), parseInt(t.eind.substring(5,7) ,10)-1, t.eind.substring(8,10));
|
||||
if (dat1.getTime() >= datstart .getTime() &&
|
||||
dat1.getTime() <= dateind.getTime() ) {
|
||||
actcounter ++;
|
||||
vacties += t.naam + ";";
|
||||
}
|
||||
}); // each
|
||||
$.each(m.takenU, function(i,t){
|
||||
var datstart = new Date(t.start.substring(0,4), parseInt(t.start.substring(5,7),10 )-1, t.start.substring(8,10));
|
||||
var dateind =new Date(t.eind.substring(0,4), parseInt(t.eind.substring(5,7) ,10)-1, t.eind.substring(8,10));
|
||||
if (dat1.getTime() >= datstart .getTime() &&
|
||||
dat1.getTime() <= dateind.getTime() ) {
|
||||
actcounter ++;
|
||||
uacties += t.naam + ";" ;
|
||||
}
|
||||
}); // each
|
||||
|
||||
nums.push({counter : actcounter,
|
||||
vacts : vacties,
|
||||
uacts : uacties});
|
||||
dat1.setDate(dat1.getDate() + 1);
|
||||
i++;
|
||||
}
|
||||
this.html= "<div class='mensregel' id='m" + this.id + "' >"+
|
||||
"<div style='float:left; width: 243px; overflow-x:hidden;'>" + this.naam+"</div>" +
|
||||
"<div class='upholder3' style='float:left; height :15px; overflow-y:hidden; overflow-x:hidden' >" +
|
||||
"<div class ='holder3' style='width: 680px;height:32px; overflow-y:hidden'>" +
|
||||
"<div class='scroller3' style='width:1200px' > " ;
|
||||
|
||||
var dikte = 0;
|
||||
if (nums[0] !==undefined) {dikte= nums[0].counter;};
|
||||
var dagen = 0;
|
||||
var self=this;
|
||||
var colarray = ['576297', '576297','576297','576297','576297','576297','576297','576297','576297','576297'];
|
||||
$.each(nums, function(i,n){
|
||||
|
||||
if (n.counter != dikte){
|
||||
if (dikte > 10) {dikte = 10};
|
||||
self.html += "<div class='lijnstuk' " +
|
||||
"style='float:left;background-color: #" + colarray[(dikte-1)] + " ; height: " + (dikte * 2) + "px; margin-top:" + (10 - (dikte * 2)) + "px;width:" + (dagen * ls.ModelMensen.dagwidth() ) + "px;' " +
|
||||
"title='dagen: " + dagen + " verantwoordelijk:" + vacts + " uitvoerende: " + uacts +"' " +
|
||||
" dagen= " + dagen + "> </div>" ;
|
||||
dagen = 1;
|
||||
dikte = n.counter;
|
||||
vacts = n.vacts;
|
||||
uacts = n.uacts;
|
||||
}
|
||||
else {dagen = dagen + 1;
|
||||
vacts = n.vacts;
|
||||
uacts = n.uacts;}
|
||||
})
|
||||
if (dikte > 0){
|
||||
this.html += "<div class='lijnstuk' " +
|
||||
"style='float:left;background-color:#" + colarray[(dikte-1)] + "; height: " + (dikte * 2) + "px; margin-top:" + (10 - (dikte * 2)) + "px;width:" + (dagen * ls.ModelMensen.dagwidth() ) + "px;' " +
|
||||
" dagen= " + dagen + "> </div>" ;
|
||||
}
|
||||
this.html += "</div></div></div></div> <div class=clearfix></div>"
|
||||
};
|
||||
|
||||
$(document).on("click", ".mensregel", function () {
|
||||
var sID = $(this).attr('id').substring(1);
|
||||
var self= ls.ModelMensen;
|
||||
$.each(self.mensen(), function(i,p){
|
||||
if (p.id ==sID){
|
||||
self.selectedMens(p);
|
||||
return;
|
||||
}; // if
|
||||
}) ; //each
|
||||
if ( $('#lsOverlay').css('display') == 'none' ) { $("#lsOverlay").fadeIn() };
|
||||
$("#lsOverlay").css({'z-index': 500});
|
||||
setDrag("#popMensActiviteiten")
|
||||
$('#popMensActiviteiten').fadeIn();
|
||||
$('#popMensActiviteiten').css({'z-index': 550});
|
||||
});
|
||||
|
||||
|
||||
ls.initMensen = function(){
|
||||
if (ls.ModelMensen !== undefined) {
|
||||
ls.ModelMensen.InitValues();
|
||||
}
|
||||
else {
|
||||
|
||||
ls.ModelMensen = {
|
||||
schuifwidth : ko.observable(),
|
||||
periode : ko.observable(2),
|
||||
mensen : ko.observableArray([]),
|
||||
selectedMens : ko.observable(),
|
||||
deletable : ko.observable(true), // mag de gebruiker activiteiten bij gebruikers weghalen
|
||||
|
||||
InitValues : function(){
|
||||
var self = ls.ModelMensen;
|
||||
$('.mensregel').remove();
|
||||
$('#periodeslider').slider();
|
||||
$("#periodeslider").slider("option","animate","fast");
|
||||
$("#periodeslider").slider("option", "value", 40);
|
||||
self.schuifwidth(33.1);
|
||||
$.post('index.php/ijkpartituur/partituur/getActievePartituur', function(data){
|
||||
projStartM= new Date(data.partituur_start.substring(0,4), (data.partituur_start.substring(5,7)-1), data.partituur_start.substring(8,10));
|
||||
|
||||
projEindM= new Date(data.partituur_eind.substring(0,4), (data.partituur_eind.substring(5,7)-1), data.partituur_eind.substring(8,10));
|
||||
MaakGanttAchtergrond();
|
||||
|
||||
$.post("index.php/ijkpartituur/mensen/getMensen", function(data){
|
||||
self.mensen.removeAll();
|
||||
|
||||
$.each(data, function(i,p){
|
||||
self.mensen.push(new fNewMens(p))
|
||||
}) ; // for each
|
||||
|
||||
$.each(self.mensen(), function(i,m){
|
||||
regel=m.html;
|
||||
$(regel).insertAfter('#mensholder');
|
||||
$("#m"+ m.id).css({top: ((i * 33) + 10) + "px"});
|
||||
});
|
||||
}, 'json');
|
||||
},'json');
|
||||
|
||||
},
|
||||
fDeleteVer : function(pID){
|
||||
var self= ls.ModelMensen;
|
||||
var VID = this.id;
|
||||
var MID = pID;
|
||||
var deze = this;
|
||||
apprise("Weet u zeker dat u de koppeling van verantwoordelijke bij " + this.naam + " wilt verwijderen?", {verify: true, textYes: 'ja', textNo:'nee'}, function(ans){
|
||||
if (ans){
|
||||
$.post("index.php/ijkpartituur/mensen/deleteVer/" + VID + '/' + MID, function(data){
|
||||
$.each(self.mensen(), function(i,p){
|
||||
if (p.id == MID) {
|
||||
var vtop = $("#m"+MID).css("top");
|
||||
self.selectedMens().takenC.remove(deze);
|
||||
self.mensen.remove(p);
|
||||
$("#m" + MID).remove();
|
||||
self.mensen.push(new fNewMens(data));
|
||||
var Indexwaarde = self.mensen().length - 1;
|
||||
regel=self.mensen()[Indexwaarde].html;
|
||||
$(regel).insertAfter('#mensholder');
|
||||
$("#m"+ MID).css('top', vtop);
|
||||
return false;
|
||||
}
|
||||
})
|
||||
},'json');
|
||||
} // if
|
||||
} ); // apprise
|
||||
},
|
||||
fDeleteUit : function(pID){
|
||||
var self= ls.ModelMensen;
|
||||
var UID = this.id;
|
||||
var MID = pID;
|
||||
var deze = this;
|
||||
apprise("Weet u zeker dat u de koppeling van uitvoerende bij " + this.naam + " wilt verwijderen?", {verify: true, textYes: 'ja', textNo:'nee'}, function(ans){
|
||||
if (ans){
|
||||
$.post("index.php/ijkpartituur/mensen/deleteUit/" + UID + '/' + MID, function(data){
|
||||
$.each(self.mensen(), function(i,p){
|
||||
if (p.id == MID) {
|
||||
var vtop = $("#m"+MID).css("top");
|
||||
self.selectedMens().takenU.remove(deze);
|
||||
self.mensen.remove(p);
|
||||
$("#m" + MID).remove();
|
||||
self.mensen.push(new fNewMens(data));
|
||||
var Indexwaarde = self.mensen().length - 1;
|
||||
regel=self.mensen()[Indexwaarde].html;
|
||||
$(regel).insertAfter('#mensholder');
|
||||
$("#m"+ MID).css('top', vtop);
|
||||
return false;
|
||||
}
|
||||
})
|
||||
},'json');
|
||||
} // if
|
||||
} ); // apprise
|
||||
}
|
||||
};// einde model definitie
|
||||
|
||||
$("#periodeslider").slider({ stop: function(event,ui){
|
||||
var self= ls.ModelMensen;
|
||||
var dagen = 0;
|
||||
var wijd = 0;
|
||||
self.schuifwidth( ui.value );
|
||||
if (self.schuifwidth() < 5) {self.schuifwidth(5)};
|
||||
|
||||
if (self.schuifwidth() < 33 && (self.periode() != 1)) {
|
||||
self.periode(1);
|
||||
MaakGanttAchtergrond();
|
||||
return ;
|
||||
};
|
||||
if (self.schuifwidth() >= 33 && self.schuifwidth() <= 66 && self.periode() != 2) {
|
||||
self.periode(2);
|
||||
MaakGanttAchtergrond();
|
||||
return ;
|
||||
};
|
||||
if (self.schuifwidth() >66 && self.periode() != 3) {
|
||||
self.periode(3);
|
||||
MaakGanttAchtergrond();
|
||||
return ;
|
||||
};
|
||||
$(".gColHeader4").each(function (i, p){
|
||||
dagen = $(p).attr("dagen");
|
||||
wijd= (dagen * self.dagwidth() );
|
||||
$(p).width(wijd) ;
|
||||
});
|
||||
$(".gColHeader3").each(function(i,r){
|
||||
wijd=(parseInt($(r).attr("coldagen") ,10 ) * self.dagwidth() ) ;
|
||||
$(r).width(wijd);
|
||||
});
|
||||
$(".gCellM").each(function(i,q){
|
||||
dagen = $(q).attr("dagen");
|
||||
wijd= (dagen * self.dagwidth() );
|
||||
$(q).width(wijd) ;
|
||||
});
|
||||
|
||||
$("#bgTable2").width((totdagen * self.dagwidth() ));
|
||||
$("#bgTable3").width((totdagen * self.dagwidth() ));
|
||||
$(".scroller3").width((totdagen * self.dagwidth() ));
|
||||
$(".lijnstuk").each(function(index){
|
||||
$(this).width( $(this).attr('dagen') * self.dagwidth() );
|
||||
});
|
||||
$("#todayLineM").css({left: ($("#todayLineM").attr('dagen') * self.dagwidth() )});
|
||||
}
|
||||
});
|
||||
ls.ModelMensen.dagwidth =ko.computed(function(){
|
||||
var self=ls.ModelMensen;
|
||||
if (self.schuifwidth() < 33) {
|
||||
return self.schuifwidth(); };
|
||||
if (self.schuifwidth() >= 33 && self.schuifwidth() < 66) {
|
||||
return self.schuifwidth() / 30 ;};
|
||||
if (self.schuifwidth() >= 66) {
|
||||
return self.schuifwidth()/365 ;};
|
||||
});
|
||||
|
||||
ls.ModelMensen.InitValues();
|
||||
ko.applyBindings(ls.ModelMensen, document.getElementById("mensen-pagina"));
|
||||
appliedBindings = true;
|
||||
}; // else
|
||||
}; //init
|
||||
|
||||
});
|
||||
Reference in New Issue
Block a user