DELETE FROM KEYWORDS WHERE ID_DOMAINE=12222669DoneDoneDone
URL:projects.kumpf.cc
Cache-Control: max-age=3600
Connection: keep-alive
Date: Wed, 30 Oct 2024 20:19:54 GMT
Content-Length: 125772
Content-Type: text/html
Expires: Wed, 30 Oct 2024 21:19:54 GMT
Last-Modified: Thu, 25 Feb 2016 17:43:01 GMT
Accept-Ranges: bytes
Age: 0
ETag: "1eb4c-52c9bb6c48f65"
Server: Apache
Status => 200
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<link href="./style/style.css" rel="stylesheet" type="text/css" />
<link rel="SHORTCUT ICON" href="./favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=0.5">
<title>adamkumpf : projects</title>
</head>
<script type="text/javascript">
//
// a javascript project grid-viewer...
// the page displays fine without javascript, but when
// scripting is available, the HTML is parsed and split
// into projects which can be sorted, arranged, etc. with
// a simple overlay description message.
//
// (c) 2009-03-14 Adam Kumpf -- akumpf@gmail.com / kumpf@media.mit.edu
// Feel free to use this code for whatever you choose! :)
//
var WIDTH = 748;
var PAD = 8;
var VIEW_GRID = 0;
var VIEW_TIMELINE = 1;
var VIEW_TAGS = 2;
var VIEW_HTMLLIST = 3;
var VIEW = VIEW_HTMLLIST; // change this if you want the startup view to be different...
var headerImgArray = new Array();
var allDivs = null;
var jsLayoutContainerDiv = null;
var jsLayoutDiv = null;
var jsOverlayDiv = null;
var allProjects = new Array();
var animationInterpolator = 1.0; // sweeps form 0.0 to 1.0 for animating transitions.
var lastClickedImage = -1;
function initialize(){
//showJavascriptLayoutDiv();
jsLayoutContainerDiv = document.getElementById("javascriptContentContainer");
jsLayoutDiv = document.getElementById("javascriptProjectLayoutDiv");
jsOverlayDiv = document.getElementById("javascriptOverlayLayoutDiv");
allDivs = document.getElementsByName("project");
headerImgArray[VIEW_GRID] = document.getElementById("headerImgGrid");
headerImgArray[VIEW_TIMELINE] = document.getElementById("headerImgTimeline");
headerImgArray[VIEW_TAGS] = document.getElementById("headerImgTags");
headerImgArray[VIEW_HTMLLIST] = document.getElementById("headerImgHTML");
//alert("initializing: #divs = " + allDivs.length);
for(var i=0; i<allDivs.length; i++){
var div = allDivs[i];
allProjects[i] = new Project(div);
}
updateHeaderImagesBasedOnView();
// we can show the project images now... (they start out invisible)
for(var i=0; i<allProjects.length; i++){
setStyle(allProjects[i].jsImgDiv, "display", "block");
}
animationInterpolator = 0.99;
// start the animation loop...(sort of a thread).
updateAllProjectPositions();
}
function showView(viewNum){
VIEW = viewNum;
loadCurrentView();
}
function loadCurrentView(){
// clear off any overlays before moving.
clearProjectOverlayDesc();
clearOutAllProjectSubtext();
removeAllTagDivs();
if(VIEW == VIEW_GRID){
showJavascriptLayoutDiv();
if(jsLayoutContainerDiv != null && jsLayoutContainerDiv.scrollLeft != null){
jsLayoutContainerDiv.scrollLeft = 0;
}
loadView_Grid();
}
if(VIEW == VIEW_TIMELINE){
showJavascriptLayoutDiv();
loadView_Timeline();
}
if(VIEW == VIEW_TAGS){
showJavascriptLayoutDiv();
if(jsLayoutContainerDiv != null && jsLayoutContainerDiv.scrollLeft != null){
jsLayoutContainerDiv.scrollLeft = 0;
}
loadView_Tags();
}
if(VIEW == VIEW_HTMLLIST){
showDefaultLayoutDiv();
}
// now update the header images to reflect the current view.
updateHeaderImagesBasedOnView();
}
function updateHeaderImagesBasedOnView(){
for(var i=0; i<headerImgArray.length; i++){
var img = headerImgArray[i];
if(img != null){
if(i == VIEW){
setStyle(img, "opacity", "0.95");
}else{
setStyle(img, "opacity", "0.55");
}
}
}
}
function loadView_Grid(){
for(var i=0; i<allProjects.length; i++){
allProjects[i].startX = allProjects[i].x;
allProjects[i].startY = allProjects[i].y;
allProjects[i].endX = (i%6)*(100+PAD) + 50+PAD/2;
allProjects[i].endY = 2*PAD+Math.floor((i/6))*(100+PAD);
}
setStyle(jsLayoutDiv, "height", (2*PAD+(Math.floor((i/6))+3)*(100+PAD))+"px");
updateSizeOfJSContainter();
animationInterpolator = 0.0;
}
function loadView_Tags(){
for(var i=0; i<allProjects.length; i++){
// send project home if not tagged...
allProjects[i].endX = 325;
allProjects[i].endY = -125;
}
var maxY = 0;
for(var tagIndex=0; tagIndex<allTags.length; tagIndex++){
var tag = allTags[tagIndex];
var projectsFound = 0;
for(var i=0; i<allProjects.length; i++){
if(allProjects[i].tagArray != null){
for(var t=0; t<allProjects[i].tagArray.length; t++){
if(allProjects[i].tagArray[t] == tag){
projectsFound++;
break;
}
}
}
}
var tagDiv = document.createElement("div");
tagDiv.setAttribute("class", "jsTagDiv");
tagDiv.innerHTML = "<b><br/><br/><center>"+tag+"<br/>["+projectsFound+"]</center></b>";
tagDiv.setAttribute("name", "tempTagLabelDiv");
var x = (Math.floor(tagIndex%4)*(100+PAD) + 150+PAD/2);
var y = (2*PAD + Math.floor(tagIndex/4)*(100+PAD));
setStyle(tagDiv, "left", x + "px");
setStyle(tagDiv, "top", y + "px");
tagDiv.setAttribute("onclick", "tagLabelClicked(\""+tag+"\","+x+","+y+");");
jsLayoutDiv.appendChild(tagDiv);
maxY = Math.max(maxY, y);
//alert("TAG: " + tag + ", found " + projectsFound);
}
// now place everything...
for(var i=0; i<allProjects.length; i++){
allProjects[i].startX = allProjects[i].x;
allProjects[i].startY = allProjects[i].y;
// slide upward...
allProjects[i].endY = -125;
maxY = Math.max(maxY, allProjects[i].endY);
}
setStyle(jsLayoutDiv, "height", (2*PAD+maxY + 3*(100+PAD))+"px");
updateSizeOfJSContainter();
animationInterpolator = 0.0;
}
function tagLabelClicked(tag, x, y){
removeAllTagDivs();
resetAllProjectZIndex();
for(var i=0; i<allProjects.length; i++){
allProjects[i].startX = allProjects[i].x;
allProjects[i].startY = allProjects[i].y;
}
var foundSoFar = 0;
for(var i=0; i<allProjects.length; i++){
if(allProjects[i].tagArray != null){
for(var t=0; t<allProjects[i].tagArray.length; t++){
if(allProjects[i].tagArray[t] == tag){
allProjects[i].x = x;
allProjects[i].y = y;
allProjects[i].startX = x;
allProjects[i].startY = y;
allProjects[i].endX = Math.max(2*PAD, Math.min(650-2*PAD, x - (2-(foundSoFar%3)-1)*(100+PAD) )); // ((foundSoFar%5)+1)*(100+PAD) + 50+PAD/2;
allProjects[i].endY = Math.max(2*PAD, y + Math.floor(foundSoFar/3 + 1)*(100+PAD) ); //2*PAD+Math.floor((foundSoFar/5))*(100+PAD)+50;
foundSoFar++;
break;
}
}
}
}
var tagDiv = document.createElement("div");
tagDiv.setAttribute("class", "jsTagDiv");
tagDiv.innerHTML = "<b><br/><br/><center>"+tag+"<br/></center></b>";
tagDiv.setAttribute("name", "tempTagLabelDiv");
setStyle(tagDiv, "left", x + "px");
setStyle(tagDiv, "top", y + "px");
tagDiv.setAttribute("onclick", "showView(VIEW_TAGS);");
jsLayoutDiv.appendChild(tagDiv);
setStyle(jsLayoutDiv, "height", (y+(foundSoFar/3+3)*(100+PAD) + 50)+"px");
updateSizeOfJSContainter();
animationInterpolator = 0.0;
}
function removeAllTagDivs(){
var tempTagDivs = document.getElementsByName("tempTagLabelDiv");
for(var i=tempTagDivs.length-1; i>=0; i--){
jsLayoutDiv.removeChild(tempTagDivs[i]);
}
}
function loadView_Timeline(){
var pos = 0;
var lastSubtextYear = 0;
// reset all the projets...
for(var c=0; c<allProjects.length; c++){
allProjects[c].usedInSorting = false;
}
for(var i=0; i<allProjects.length; i++){
var lastYear = 3000;
var lastMonth = 12;
var lastDay = 31;
var projToAdd = -1;
for(var c=0; c<allProjects.length; c++){
if(!allProjects[c].usedInSorting){
// haven't used this object yet. try it.
if(allProjects[c].year < lastYear){
// definetly lower.
lastYear = allProjects[c].year;
lastMonth = allProjects[c].month;
lastDay = allProjects[c].day;
projToAdd = c;
}else{
if(allProjects[c].year == lastYear){
// year was the same, we need to check month.
if(allProjects[c].month < lastMonth){
// definetly lower
lastMonth = allProjects[c].month;
lastDay = allProjects[c].day;
projToAdd = c;
}else{
if(allProjects[c].month == lastMonth){
// year and month was the same, we need to check the day.
if(allProjects[c].day <= lastDay){
// at least as low, add it.
lastDay = allProjects[c].day;
projToAdd = c;
}
}
}
}
}
}
}
// add the project to the timeline.
if(projToAdd >= 0){
allProjects[projToAdd].startX = allProjects[projToAdd].x;
allProjects[projToAdd].startY = allProjects[projToAdd].y;
allProjects[projToAdd].endX = 2*PAD + (pos)*(100+PAD);
allProjects[projToAdd].endY = 2*PAD;
allProjects[projToAdd].usedInSorting = true; // make sure we don't add this project again.
if(lastSubtextYear != allProjects[projToAdd].year){
allProjects[projToAdd].subtextDiv.innerHTML = "<b>"+allProjects[projToAdd].year+"</b>";
lastSubtextYear = allProjects[projToAdd].year;
}
//alert(allProjects[projToAdd].year + " :: " + allProjects[projToAdd].month + " :: " + allProjects[projToAdd].day);
pos++;
}
}
setStyle(jsLayoutDiv, "height", (4)*(100+PAD)+"px");
updateSizeOfJSContainter();
animationInterpolator = 0.0;
}
function clearOutAllProjectSubtext(){
for(var m=0; m<allProjects.length; m++){
allProjects[m].subtextDiv.innerHTML = ""; // clear out any subtext.
}
}
function updateSizeOfJSContainter(){
var h = parseInt(getStyle(jsLayoutDiv, "height"));
// resize height, making sure there is enough room for a horizontal scrollbar if needed.
setStyle(jsLayoutContainerDiv, "height", (h+80)+"px");
}
function addTagToAllTagsArray(newTag){
var foundMatch = false;
for(var i=0; i<allTags.length; i++){
if(allTags[i] == newTag){
foundMatch = true;
break;
}
}
if(!foundMatch){
allTags[allTags.length] = newTag;
}
}
// this represents a class that contains project information.
var allTags = new Array();
function Project(projDiv){
//----------------------
this.title = "";
this.startDate = "20012-01-01";
this.imgURL = "";
this.content = "";
this.moreInfoURL = "";
this.clonedDescDiv = projDiv.cloneNode(true);
this.clonedDescImg = null;
this.jsImgDiv = null;
this.year = 2012;
this.month = 01;
this.day = 01;
this.usedInSorting = false;
this.x = 0; // current position
this.y = 0;
this.endX = 1+PAD + (100+PAD)*(allProjects.length%6); // destination position
this.endY = 1+PAD+(100+PAD)*Math.floor(allProjects.length/6);
this.startX = 0; // start position
this.startY = 0;
this.tagArray = null;
//----------------------
var children = projDiv.childNodes;
for(var i=0; i<children.length; i++){
var child = children[i];
if(child.getAttribute){
var classname = child.className;
if(classname == "mainProjectImageClass"){
this.imgURL = child.getAttribute("src");
}
if(classname == "projTitleSpanClass"){
this.title = child.textContent;
}
if(classname == "projDateSpanClass"){
this.startDate = child.textContent;
var dateArray = this.startDate.split("-");
if(dateArray.length == 3){
// using the base 10 argument should deal with leading zeros in the number...
this.year = parseInt(dateArray[0], 10);
this.month = parseInt(dateArray[1], 10);
this.day = parseInt(dateArray[2], 10);
}
}
if(classname == "projContentDivClass"){
this.content = child.textContent;
}
if(classname == "projMoreInfoLinkClass"){
child.setAttribute("onclick", "return !window.open( this.href );");
this.moreInfoURL = child.getAttribute("href");
}
if(classname == "projTagsClass"){
var children2 = child.childNodes;
if(children2.length >= 2){
child2 = children2[1];
//console.log(child2);
if(child2.className == "projTagsSpanClass"){
var tags = child2.innerHTML;
if(tags != null){
var tags2 = tags.toLowerCase().replace(/\ /g,"",true); // remove all spaces
this.tagArray = tags2.split(",");
for(var t=0; t<this.tagArray.length; t++){
addTagToAllTagsArray(this.tagArray[t]);
}
}
}
}
}
}// end getAtribute check
}
// modify the clone for easy display later...
setStyle(this.clonedDescDiv, "cursor", "pointer");
setStyle(this.clonedDescDiv, "background", "#000000");
var children2 = this.clonedDescDiv.childNodes;
for(var i=children2.length-1; i>=0; i--){
var child2 = children2[i];
if(child2.style){
setStyle(child2, "background", "#000000");
}
if(child2.getAttribute){
var classname = child2.className;
if(classname == "mainProjectImageClass"){
//child2.setAttribute("src", "");
this.clonedDescImg = child2;
}
if(classname == "projMoreInfoLinkClass"){
child2.setAttribute("onclick", "return !window.open( this.href );");
}
}
}
this.jsImgDiv = document.createElement("div");
this.jsImgDiv.setAttribute("class", "jsImgDiv");
setStyle(this.jsImgDiv, "top", this.endY);
setStyle(this.jsImgDiv, "left", this.endX);
setStyle(this.jsImgDiv, "height", "100px");
setStyle(this.jsImgDiv, "width", "100px");
var newImg = document.createElement("img");
newImg.setAttribute("src", this.imgURL);
newImg.setAttribute("class", "jsImg");
newImg.setAttribute("onclick", "handleImgClick("+allProjects.length+")");
setStyle(this.jsImgDiv, "display", "none");
this.jsImgDiv.appendChild(newImg);
var titleDiv = document.createElement("div");
titleDiv.setAttribute("onclick", "handleImgClick("+allProjects.length+")");
titleDiv.innerHTML = "<div style='position: relative; top: 25px; height: 69px; width: 94px; background: #111111; overflow: hidden; padding: 3px; color: #eee; text-align:center;'>"+this.title+"</div>";
titleDiv.setAttribute("class", "titleOverlayDiv");
this.jsImgDiv.appendChild(titleDiv);
var theSubtextDiv = document.createElement("div");
setStyle(theSubtextDiv, "background", "transparent");
setStyle(theSubtextDiv, "padding", "3px");
setStyle(theSubtextDiv, "position", "relative");
setStyle(theSubtextDiv, "top", "-100px");
this.subtextDiv = theSubtextDiv;
this.jsImgDiv.appendChild(theSubtextDiv);
jsLayoutDiv.appendChild(this.jsImgDiv);
}
function updateAllProjectPositions(){
if(animationInterpolator < 1.0){
// update project locations!
updateAnimationInterpolator();
for(var i=0; i<allProjects.length; i++){
var x = (1.0-animationInterpolator)*allProjects[i].startX + animationInterpolator*allProjects[i].endX;
var y = (1.0-animationInterpolator)*allProjects[i].startY + animationInterpolator*allProjects[i].endY;
setElementPos(allProjects[i].jsImgDiv, x, y);
allProjects[i].x = x;
allProjects[i].y = y;
}
// keep animating!
setTimeout("updateAllProjectPositions();", 30);
}else{
// done animating.. give the processor a rest...
setTimeout("updateAllProjectPositions();", 30);
}
}
function updateAnimationInterpolator(){
animationInterpolator = Math.min(1.0, animationInterpolator + 0.12);
}
function clearProjectOverlayDesc(){
var descNode = document.getElementById("tempCloneDescDiv");
if(descNode != null){
jsOverlayDiv.removeChild(descNode);
}
}
function handleImgClick(imgNum){
animationInterpolator = 0.99; // stop moving things; jump to final positions if not already there...
//loadCurrentView();
var centerX = allProjects[imgNum].x+50;
var centerY = allProjects[imgNum].y+50
for(var i=0; i<allProjects.length; i++){
allProjects[i].startX = allProjects[i].x;
allProjects[i].startY = allProjects[i].y;
if(i != imgNum){
setStyle(allProjects[i].jsImgDiv, "zIndex", "1");
}else{
setStyle(allProjects[imgNum].jsImgDiv, "zIndex", "10");
}
}
if(imgNum != lastClickedImage){
// close description if there is already one open.
clearProjectOverlayDesc();
// now load the new description.
//allProjects[imgNum].endX = jsLEFT+10;
lastClickedImage = imgNum;
var cloneDiv = allProjects[imgNum].clonedDescDiv;
var cloneImg = allProjects[imgNum].clonedDescImg;
setStyle(cloneDiv, "zIndex", "100");
setStyle(cloneDiv, "opacity", ".9");
setStyle(cloneDiv, "position", "absolute");
//setStyle(cloneImg, "border", "#111111 solid 1px");
var divW = 3.5*(100+PAD)-PAD;
setStyle(cloneDiv, "width", divW+"px");
var contentXScreenPos = allProjects[imgNum].endX;
if(jsLayoutContainerDiv != null && jsLayoutContainerDiv.scrollLeft != null){
contentXScreenPos -= jsLayoutContainerDiv.scrollLeft;
}
if(contentXScreenPos > 375){
setStyle(cloneImg, "cssFloat", "right");
setStyle(cloneDiv, "top", allProjects[imgNum].endY-PAD-2+"px");
setStyle(cloneDiv, "left", (allProjects[imgNum].endX-PAD-divW+100-1)+"px");
setStyle(cloneImg, "marginLeft", (PAD-2)+"px");
setStyle(cloneImg, "marginRight", "0px");
}else{
setStyle(cloneImg, "cssFloat", "left");
setStyle(cloneDiv, "top", allProjects[imgNum].endY-PAD-2+"px");
setStyle(cloneDiv, "left", allProjects[imgNum].endX-PAD-1+"px");
setStyle(cloneImg, "marginLeft", "0px");
setStyle(cloneImg, "marginRight", (PAD+2)+"px");
}
cloneDiv.setAttribute("onclick", "handleImgClick("+imgNum+")");
cloneDiv.id = "tempCloneDescDiv";
jsOverlayDiv.appendChild(cloneDiv);
}else{
// close it.
clearProjectOverlayDesc();
resetAllProjectZIndex();
lastClickedImage = -1;
}
}
function resetAllProjectZIndex(){
for(var i=0; i<allProjects.length; i++){
setStyle(allProjects[i].jsImgDiv, "zIndex", "1");
}
}
function showDefaultLayoutDiv(){
setStyle(document.getElementById("defaultProjectLayoutDiv"), "display", "block");
setStyle(document.getElementById("javascriptContentContainer"), "display", "none");
for(var i=0; i<allProjects.length; i++){
allProjects[i].endX = 1+PAD;
allProjects[i].endY = 1+PAD+190*i;
}
animationInterpolator = 0.99;
}
function showJavascriptLayoutDiv(){
setStyle(document.getElementById("defaultProjectLayoutDiv"), "display", "none");
setStyle(document.getElementById("javascriptContentContainer"), "display", "block");
}
function setStyle(el, style, value) {
if(!el || !el.style) return;
el.style[style] = value;
}
function setElementSize(el, w, h){
if(!el || !el.style) return;
el.style["width"] = w + "px";
el.style["height"] = h + "px";
}
function setElementPos(el, x, y){
if(!el || !el.style) return;
el.style["left"] = x + "px";
el.style["top"] = y + "px";
}
function getStyle(el, style) {
if(!document.getElementById || !el) return;
var value = ((el||{}).style||{})[style];
if(!value)
if(document.defaultView)
value = document.defaultView.getComputedStyle(el, "").getPropertyValue(style);
else if(el.currentStyle)
value = el.currentStyle[style];
return value;
}
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<link href="./style/style.css" rel="stylesheet" type="text/css" />
<link rel="SHORTCUT ICON" href="./favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=0.5">
<title>adamkumpf : projects</title>
</head>
<script type="text/javascript">
//
// a javascript project grid-viewer...
// the page displays fine without javascript, but when
// scripting is available, the HTML is parsed and split
// into projects which can be sorted, arranged, etc. with
// a simple overlay description message.
//
// (c) 2009-03-14 Adam Kumpf -- akumpf@gmail.com / kumpf@media.mit.edu
// Feel free to use this code for whatever you choose! :)
//
var WIDTH = 748;
var PAD = 8;
var VIEW_GRID = 0;
var VIEW_TIMELINE = 1;
var VIEW_TAGS = 2;
var VIEW_HTMLLIST = 3;
var VIEW = VIEW_HTMLLIST; // change this if you want the startup view to be different...
var headerImgArray = new Array();
var allDivs = null;
var jsLayoutContainerDiv = null;
var jsLayoutDiv = null;
var jsOverlayDiv = null;
var allProjects = new Array();
var animationInterpolator = 1.0; // sweeps form 0.0 to 1.0 for animating transitions.
var lastClickedImage = -1;
function initialize(){
//showJavascriptLayoutDiv();
jsLayoutContainerDiv = document.getElementById("javascriptContentContainer");
jsLayoutDiv = document.getElementById("javascriptProjectLayoutDiv");
jsOverlayDiv = document.getElementById("javascriptOverlayLayoutDiv");
allDivs = document.getElementsByName("project");
headerImgArray[VIEW_GRID] = document.getElementById("headerImgGrid");
headerImgArray[VIEW_TIMELINE] = document.getElementById("headerImgTimeline");
headerImgArray[VIEW_TAGS] = document.getElementById("headerImgTags");
headerImgArray[VIEW_HTMLLIST] = document.getElementById("headerImgHTML");
//alert("initializing: #divs = " + allDivs.length);
for(var i=0; i<allDivs.length; i++){
var div = allDivs[i];
allProjects[i] = new Project(div);
}
updateHeaderImagesBasedOnView();
// we can show the project images now... (they start out invisible)
for(var i=0; i<allProjects.length; i++){
setStyle(allProjects[i].jsImgDiv, "display", "block");
}
animationInterpolator = 0.99;
// start the animation loop...(sort of a thread).
updateAllProjectPositions();
}
function showView(viewNum){
VIEW = viewNum;
loadCurrentView();
}
function loadCurrentView(){
// clear off any overlays before moving.
clearProjectOverlayDesc();
clearOutAllProjectSubtext();
removeAllTagDivs();
if(VIEW == VIEW_GRID){
showJavascriptLayoutDiv();
if(jsLayoutContainerDiv != null && jsLayoutContainerDiv.scrollLeft != null){
jsLayoutContainerDiv.scrollLeft = 0;
}
loadView_Grid();
}
if(VIEW == VIEW_TIMELINE){
showJavascriptLayoutDiv();
loadView_Timeline();
}
if(VIEW == VIEW_TAGS){
showJavascriptLayoutDiv();
if(jsLayoutContainerDiv != null && jsLayoutContainerDiv.scrollLeft != null){
jsLayoutContainerDiv.scrollLeft = 0;
}
loadView_Tags();
}
if(VIEW == VIEW_HTMLLIST){
showDefaultLayoutDiv();
}
// now update the header images to reflect the current view.
updateHeaderImagesBasedOnView();
}
function updateHeaderImagesBasedOnView(){
for(var i=0; i<headerImgArray.length; i++){
var img = headerImgArray[i];
if(img != null){
if(i == VIEW){
setStyle(img, "opacity", "0.95");
}else{
setStyle(img, "opacity", "0.55");
}
}
}
}
function loadView_Grid(){
for(var i=0; i<allProjects.length; i++){
allProjects[i].startX = allProjects[i].x;
allProjects[i].startY = allProjects[i].y;
allProjects[i].endX = (i%6)*(100+PAD) + 50+PAD/2;
allProjects[i].endY = 2*PAD+Math.floor((i/6))*(100+PAD);
}
setStyle(jsLayoutDiv, "height", (2*PAD+(Math.floor((i/6))+3)*(100+PAD))+"px");
updateSizeOfJSContainter();
animationInterpolator = 0.0;
}
function loadView_Tags(){
for(var i=0; i<allProjects.length; i++){
// send project home if not tagged...
allProjects[i].endX = 325;
allProjects[i].endY = -125;
}
var maxY = 0;
for(var tagIndex=0; tagIndex<allTags.length; tagIndex++){
var tag = allTags[tagIndex];
var projectsFound = 0;
for(var i=0; i<allProjects.length; i++){
if(allProjects[i].tagArray != null){
for(var t=0; t<allProjects[i].tagArray.length; t++){
if(allProjects[i].tagArray[t] == tag){
projectsFound++;
break;
}
}
}
}
var tagDiv = document.createElement("div");
tagDiv.setAttribute("class", "jsTagDiv");
tagDiv.innerHTML = "<b><br/><br/><center>"+tag+"<br/>["+projectsFound+"]</center></b>";
tagDiv.setAttribute("name", "tempTagLabelDiv");
var x = (Math.floor(tagIndex%4)*(100+PAD) + 150+PAD/2);
var y = (2*PAD + Math.floor(tagIndex/4)*(100+PAD));
setStyle(tagDiv, "left", x + "px");
setStyle(tagDiv, "top", y + "px");
tagDiv.setAttribute("onclick", "tagLabelClicked(\""+tag+"\","+x+","+y+");");
jsLayoutDiv.appendChild(tagDiv);
maxY = Math.max(maxY, y);
//alert("TAG: " + tag + ", found " + projectsFound);
}
// now place everything...
for(var i=0; i<allProjects.length; i++){
allProjects[i].startX = allProjects[i].x;
allProjects[i].startY = allProjects[i].y;
// slide upward...
allProjects[i].endY = -125;
maxY = Math.max(maxY, allProjects[i].endY);
}
setStyle(jsLayoutDiv, "height", (2*PAD+maxY + 3*(100+PAD))+"px");
updateSizeOfJSContainter();
animationInterpolator = 0.0;
}
function tagLabelClicked(tag, x, y){
removeAllTagDivs();
resetAllProjectZIndex();
for(var i=0; i<allProjects.length; i++){
allProjects[i].startX = allProjects[i].x;
allProjects[i].startY = allProjects[i].y;
}
var foundSoFar = 0;
for(var i=0; i<allProjects.length; i++){
if(allProjects[i].tagArray != null){
for(var t=0; t<allProjects[i].tagArray.length; t++){
if(allProjects[i].tagArray[t] == tag){
allProjects[i].x = x;
allProjects[i].y = y;
allProjects[i].startX = x;
allProjects[i].startY = y;
allProjects[i].endX = Math.max(2*PAD, Math.min(650-2*PAD, x - (2-(foundSoFar%3)-1)*(100+PAD) )); // ((foundSoFar%5)+1)*(100+PAD) + 50+PAD/2;
allProjects[i].endY = Math.max(2*PAD, y + Math.floor(foundSoFar/3 + 1)*(100+PAD) ); //2*PAD+Math.floor((foundSoFar/5))*(100+PAD)+50;
foundSoFar++;
break;
}
}
}
}
var tagDiv = document.createElement("div");
tagDiv.setAttribute("class", "jsTagDiv");
tagDiv.innerHTML = "<b><br/><br/><center>"+tag+"<br/></center></b>";
tagDiv.setAttribute("name", "tempTagLabelDiv");
setStyle(tagDiv, "left", x + "px");
setStyle(tagDiv, "top", y + "px");
tagDiv.setAttribute("onclick", "showView(VIEW_TAGS);");
jsLayoutDiv.appendChild(tagDiv);
setStyle(jsLayoutDiv, "height", (y+(foundSoFar/3+3)*(100+PAD) + 50)+"px");
updateSizeOfJSContainter();
animationInterpolator = 0.0;
}
function removeAllTagDivs(){
var tempTagDivs = document.getElementsByName("tempTagLabelDiv");
for(var i=tempTagDivs.length-1; i>=0; i--){
jsLayoutDiv.removeChild(tempTagDivs[i]);
}
}
function loadView_Timeline(){
var pos = 0;
var lastSubtextYear = 0;
// reset all the projets...
for(var c=0; c<allProjects.length; c++){
allProjects[c].usedInSorting = false;
}
for(var i=0; i<allProjects.length; i++){
var lastYear = 3000;
var lastMonth = 12;
var lastDay = 31;
var projToAdd = -1;
for(var c=0; c<allProjects.length; c++){
if(!allProjects[c].usedInSorting){
// haven't used this object yet. try it.
if(allProjects[c].year < lastYear){
// definetly lower.
lastYear = allProjects[c].year;
lastMonth = allProjects[c].month;
lastDay = allProjects[c].day;
projToAdd = c;
}else{
if(allProjects[c].year == lastYear){
// year was the same, we need to check month.
if(allProjects[c].month < lastMonth){
// definetly lower
lastMonth = allProjects[c].month;
lastDay = allProjects[c].day;
projToAdd = c;
}else{
if(allProjects[c].month == lastMonth){
// year and month was the same, we need to check the day.
if(allProjects[c].day <= lastDay){
// at least as low, add it.
lastDay = allProjects[c].day;
projToAdd = c;
}
}
}
}
}
}
}
// add the project to the timeline.
if(projToAdd >= 0){
allProjects[projToAdd].startX = allProjects[projToAdd].x;
allProjects[projToAdd].startY = allProjects[projToAdd].y;
allProjects[projToAdd].endX = 2*PAD + (pos)*(100+PAD);
allProjects[projToAdd].endY = 2*PAD;
allProjects[projToAdd].usedInSorting = true; // make sure we don't add this project again.
if(lastSubtextYear != allProjects[projToAdd].year){
allProjects[projToAdd].subtextDiv.innerHTML = "<b>"+allProjects[projToAdd].year+"</b>";
lastSubtextYear = allProjects[projToAdd].year;
}
//alert(allProjects[projToAdd].year + " :: " + allProjects[projToAdd].month + " :: " + allProjects[projToAdd].day);
pos++;
}
}
setStyle(jsLayoutDiv, "height", (4)*(100+PAD)+"px");
updateSizeOfJSContainter();
animationInterpolator = 0.0;
}
function clearOutAllProjectSubtext(){
for(var m=0; m<allProjects.length; m++){
allProjects[m].subtextDiv.innerHTML = ""; // clear out any subtext.
}
}
function updateSizeOfJSContainter(){
var h = parseInt(getStyle(jsLayoutDiv, "height"));
// resize height, making sure there is enough room for a horizontal scrollbar if needed.
setStyle(jsLayoutContainerDiv, "height", (h+80)+"px");
}
function addTagToAllTagsArray(newTag){
var foundMatch = false;
for(var i=0; i<allTags.length; i++){
if(allTags[i] == newTag){
foundMatch = true;
break;
}
}
if(!foundMatch){
allTags[allTags.length] = newTag;
}
}
// this represents a class that contains project information.
var allTags = new Array();
function Project(projDiv){
//----------------------
this.title = "";
this.startDate = "20012-01-01";
this.imgURL = "";
this.content = "";
this.moreInfoURL = "";
this.clonedDescDiv = projDiv.cloneNode(true);
this.clonedDescImg = null;
this.jsImgDiv = null;
this.year = 2012;
this.month = 01;
this.day = 01;
this.usedInSorting = false;
this.x = 0; // current position
this.y = 0;
this.endX = 1+PAD + (100+PAD)*(allProjects.length%6); // destination position
this.endY = 1+PAD+(100+PAD)*Math.floor(allProjects.length/6);
this.startX = 0; // start position
this.startY = 0;
this.tagArray = null;
//----------------------
var children = projDiv.childNodes;
for(var i=0; i<children.length; i++){
var child = children[i];
if(child.getAttribute){
var classname = child.className;
if(classname == "mainProjectImageClass"){
this.imgURL = child.getAttribute("src");
}
if(classname == "projTitleSpanClass"){
this.title = child.textContent;
}
if(classname == "projDateSpanClass"){
this.startDate = child.textContent;
var dateArray = this.startDate.split("-");
if(dateArray.length == 3){
// using the base 10 argument should deal with leading zeros in the number...
this.year = parseInt(dateArray[0], 10);
this.month = parseInt(dateArray[1], 10);
this.day = parseInt(dateArray[2], 10);
}
}
if(classname == "projContentDivClass"){
this.content = child.textContent;
}
if(classname == "projMoreInfoLinkClass"){
child.setAttribute("onclick", "return !window.open( this.href );");
this.moreInfoURL = child.getAttribute("href");
}
if(classname == "projTagsClass"){
var children2 = child.childNodes;
if(children2.length >= 2){
child2 = children2[1];
//console.log(child2);
if(child2.className == "projTagsSpanClass"){
var tags = child2.innerHTML;
if(tags != null){
var tags2 = tags.toLowerCase().replace(/\ /g,"",true); // remove all spaces
this.tagArray = tags2.split(",");
for(var t=0; t<this.tagArray.length; t++){
addTagToAllTagsArray(this.tagArray[t]);
}
}
}
}
}
}// end getAtribute check
}
// modify the clone for easy display later...
setStyle(this.clonedDescDiv, "cursor", "pointer");
setStyle(this.clonedDescDiv, "background", "#000000");
var children2 = this.clonedDescDiv.childNodes;
for(var i=children2.length-1; i>=0; i--){
var child2 = children2[i];
if(child2.style){
setStyle(child2, "background", "#000000");
}
if(child2.getAttribute){
var classname = child2.className;
if(classname == "mainProjectImageClass"){
//child2.setAttribute("src", "");
this.clonedDescImg = child2;
}
if(classname == "projMoreInfoLinkClass"){
child2.setAttribute("onclick", "return !window.open( this.href );");
}
}
}
this.jsImgDiv = document.createElement("div");
this.jsImgDiv.setAttribute("class", "jsImgDiv");
setStyle(this.jsImgDiv, "top", this.endY);
setStyle(this.jsImgDiv, "left", this.endX);
setStyle(this.jsImgDiv, "height", "100px");
setStyle(this.jsImgDiv, "width", "100px");
var newImg = document.createElement("img");
newImg.setAttribute("src", this.imgURL);
newImg.setAttribute("class", "jsImg");
newImg.setAttribute("onclick", "handleImgClick("+allProjects.length+")");
setStyle(this.jsImgDiv, "display", "none");
this.jsImgDiv.appendChild(newImg);
var titleDiv = document.createElement("div");
titleDiv.setAttribute("onclick", "handleImgClick("+allProjects.length+")");
titleDiv.innerHTML = "<div style='position: relative; top: 25px; height: 69px; width: 94px; background: #111111; overflow: hidden; padding: 3px; color: #eee; text-align:center;'>"+this.title+"</div>";
titleDiv.setAttribute("class", "titleOverlayDiv");
this.jsImgDiv.appendChild(titleDiv);
var theSubtextDiv = document.createElement("div");
setStyle(theSubtextDiv, "background", "transparent");
setStyle(theSubtextDiv, "padding", "3px");
setStyle(theSubtextDiv, "position", "relative");
setStyle(theSubtextDiv, "top", "-100px");
this.subtextDiv = theSubtextDiv;
this.jsImgDiv.appendChild(theSubtextDiv);
jsLayoutDiv.appendChild(this.jsImgDiv);
}
function updateAllProjectPositions(){
if(animationInterpolator < 1.0){
// update project locations!
updateAnimationInterpolator();
for(var i=0; i<allProjects.length; i++){
var x = (1.0-animationInterpolator)*allProjects[i].startX + animationInterpolator*allProjects[i].endX;
var y = (1.0-animationInterpolator)*allProjects[i].startY + animationInterpolator*allProjects[i].endY;
setElementPos(allProjects[i].jsImgDiv, x, y);
allProjects[i].x = x;
allProjects[i].y = y;
}
// keep animating!
setTimeout("updateAllProjectPositions();", 30);
}else{
// done animating.. give the processor a rest...
setTimeout("updateAllProjectPositions();", 30);
}
}
function updateAnimationInterpolator(){
animationInterpolator = Math.min(1.0, animationInterpolator + 0.12);
}
function clearProjectOverlayDesc(){
var descNode = document.getElementById("tempCloneDescDiv");
if(descNode != null){
jsOverlayDiv.removeChild(descNode);
}
}
function handleImgClick(imgNum){
animationInterpolator = 0.99; // stop moving things; jump to final positions if not already there...
//loadCurrentView();
var centerX = allProjects[imgNum].x+50;
var centerY = allProjects[imgNum].y+50
for(var i=0; i<allProjects.length; i++){
allProjects[i].startX = allProjects[i].x;
allProjects[i].startY = allProjects[i].y;
if(i != imgNum){
setStyle(allProjects[i].jsImgDiv, "zIndex", "1");
}else{
setStyle(allProjects[imgNum].jsImgDiv, "zIndex", "10");
}
}
if(imgNum != lastClickedImage){
// close description if there is already one open.
clearProjectOverlayDesc();
// now load the new description.
//allProjects[imgNum].endX = jsLEFT+10;
lastClickedImage = imgNum;
var cloneDiv = allProjects[imgNum].clonedDescDiv;
var cloneImg = allProjects[imgNum].clonedDescImg;
setStyle(cloneDiv, "zIndex", "100");
setStyle(cloneDiv, "opacity", ".9");
setStyle(cloneDiv, "position", "absolute");
//setStyle(cloneImg, "border", "#111111 solid 1px");
var divW = 3.5*(100+PAD)-PAD;
setStyle(cloneDiv, "width", divW+"px");
var contentXScreenPos = allProjects[imgNum].endX;
if(jsLayoutContainerDiv != null && jsLayoutContainerDiv.scrollLeft != null){
contentXScreenPos -= jsLayoutContainerDiv.scrollLeft;
}
if(contentXScreenPos > 375){
setStyle(cloneImg, "cssFloat", "right");
setStyle(cloneDiv, "top", allProjects[imgNum].endY-PAD-2+"px");
setStyle(cloneDiv, "left", (allProjects[imgNum].endX-PAD-divW+100-1)+"px");
setStyle(cloneImg, "marginLeft", (PAD-2)+"px");
setStyle(cloneImg, "marginRight", "0px");
}else{
setStyle(cloneImg, "cssFloat", "left");
setStyle(cloneDiv, "top", allProjects[imgNum].endY-PAD-2+"px");
setStyle(cloneDiv, "left", allProjects[imgNum].endX-PAD-1+"px");
setStyle(cloneImg, "marginLeft", "0px");
setStyle(cloneImg, "marginRight", (PAD+2)+"px");
}
cloneDiv.setAttribute("onclick", "handleImgClick("+imgNum+")");
cloneDiv.id = "tempCloneDescDiv";
jsOverlayDiv.appendChild(cloneDiv);
}else{
// close it.
clearProjectOverlayDesc();
resetAllProjectZIndex();
lastClickedImage = -1;
}
}
function resetAllProjectZIndex(){
for(var i=0; i<allProjects.length; i++){
setStyle(allProjects[i].jsImgDiv, "zIndex", "1");
}
}
function showDefaultLayoutDiv(){
setStyle(document.getElementById("defaultProjectLayoutDiv"), "display", "block");
setStyle(document.getElementById("javascriptContentContainer"), "display", "none");
for(var i=0; i<allProjects.length; i++){
allProjects[i].endX = 1+PAD;
allProjects[i].endY = 1+PAD+190*i;
}
animationInterpolator = 0.99;
}
function showJavascriptLayoutDiv(){
setStyle(document.getElementById("defaultProjectLayoutDiv"), "display", "none");
setStyle(document.getElementById("javascriptContentContainer"), "display", "block");
}
function setStyle(el, style, value) {
if(!el || !el.style) return;
el.style[style] = value;
}
function setElementSize(el, w, h){
if(!el || !el.style) return;
el.style["width"] = w + "px";
el.style["height"] = h + "px";
}
function setElementPos(el, x, y){
if(!el || !el.style) return;
el.style["left"] = x + "px";
el.style["top"] = y + "px";
}
function getStyle(el, style) {
if(!document.getElementById || !el) return;
var value = ((el||{}).style||{})[style];
if(!value)
if(document.defaultView)
value = document.defaultView.getComputedStyle(el, "").getPropertyValue(style);
else if(el.currentStyle)
value = el.currentStyle[style];
return value;
}
</script>
adamkumpf : projects
Recherche META Description de la page
Recherche META Keywords de la page
UPDATE DOMAINES SET server='Apache',redirection='',Status='200',err='',[TITRE]=N'adamkumpf : projects',[DESCRIPTION]=N'',[KEYWORDS]=N'' WHERE id=12222669
0 adamkumpf : projects
0. adamkumpf (9)--------->0
1. : (1)--------->0
2. projects (8)--------->0
INSERT INTO KEYWORDS (keyword,id_domaine) VALUES (N'adamkumpf',12222669),(N':',12222669),(N'projects',12222669)