var placed = 0;
var correct = 0;
var wrong = 0;
var logos = [];
var isdone = false;
var ranks = [
{ name : "Grand Admiral" }, // 0 A la Mark
{ name : "Bjarne Tveskov" }, // 1 Blacktron I set designer. You can't even get this rank!
{ name : "Star Ranger" }, // 2 Pre-Classic Space
{ name : "Deadly Spaceman" }, // 3 Ye Olde Brikwars
{ name : "Ice Planet Babe" }, // 4 Ice Planet
{ name : "Space Marauder" }, // 5 LEGO Universe
{ name : "Jim Spaceborn" }, // 6 LEGO comic hero
{ name : "Squidman" }, // 7 Space villain
{ name : "Alpha Draconis" }, // 8 Leader of UFO
{ name : "Ann-Droid" }, // 9 Exploriens robot
{ name : "Monorail Conductor" }, // 10 Some crap I made up
{ name : "Mosquitoid" }, // 11 Galaxy squad alien
{ name : "Moonbase Greeter" }, // 12 Moonbase something-or-other
{ name : "Fleebnork" }, // 13 pesky critter
{ name : "Timmy" }, // 14 Not even space at all.
];
var cbutton;
Ext.application({
name: 'DND',
launch: function() {
var overrides = {
startDrag: function(e) {
//shortcut to access our element later
if (!this.el) {
this.el = Ext.get(this.getEl());
}
//add a css class to add some transparency to our div
this.el.addCls('selected');
//when we drop our item on an invalid place we need to return it to its initial position
this.initialPosition = this.el.getXY();
},
onDrag: function(e) {
this.el.moveTo(e.getPageX() - 25, e.getPageY() - 25);
},
onDragEnter: function(e, id) {
if(id != 'logospace') {
Ext.fly(id).addCls('valid-zone');
}
},
onDragOver: function(e, id) {
if(id != 'logospace') {
Ext.fly(id).addCls('valid-zone');
}
},
onDragOut: function(e, id) {
if(id != 'logospace') {
Ext.fly(id).removeCls('valid-zone');
}
},
onDragDrop: function(e, id) {
if(isdone) {
this.el.removeCls('valid-zone');
this.el.moveTo(this.initialPosition[0], this.initialPosition[1]);
return;
}
var li = getlogoi(this.el.id);
if(logos[li].pos != "logospace") {
var ttd = document.getElementById("colortd_"+logos[li].pos);
//ttd.style.backgroundColor = '#FFFFFF';
if(logos[li].hasimg) {
var img = document.getElementById("scoreimg"+li);
img.parentNode.removeChild(img);
var colorimg = document.getElementById("colorimg_"+logos[li].pos);
colorimg.style.opacity = 1;
logos[li].hasimg = false;
}
logos[li].pos = "logospace"; // we don't know that yet, but ok
if(logos[li].correct == 2) {
correct--;
} else if(logos[li].correct == 3) {
wrong--;
}
logos[li].correct = 0;
logos[li].xpos = 0;
logos[li].ypos = 0;
placed--;
cbutton.setDisabled(true);
}
if(id != 'logospace') {
// change the item position to absolute
this.el.dom.style.position = 'absolute';
//move the item to the mouse position
//this.el.moveTo(e.getPageX() - 25, e.getPageY() - 25);
//var tg = Ext.fly(id);
var tg = document.getElementById(id);
var rect = tg.getBoundingClientRect();
var bodyrect = document.body.getBoundingClientRect();
this.el.moveTo(rect.left + 5 - bodyrect.left, rect.top + 5 - bodyrect.top);
Ext.fly(id).removeCls('valid-zone');
var idreg = /_(\d+)/;
var match = idreg.exec(logos[li].id);
var tid = parseInt(match[1]);
var match = idreg.exec(id);
var cid = parseInt(match[1]);
logos[li].pos = ""+cid;
logos[li].posi = cid;
logos[li].xpos = rect.left+5-bodyrect.left;
logos[li].ypos = rect.top+5-bodyrect.top;
//this.el.lcspos = ""+cid;
placed++;
if(placed >= logos.length) {
cbutton.setDisabled(false);
}
//var checkbutton = document.getElementById('scorecheckbutton');
//var checkbutton = Ext.get('scorecheckbutton');
//if(checkbutton != undefined) {
//checkbutton.enable();
// } else {
// alert("Couldnt find checkbutton :(");
// }
//alert("Logo id: "+cid+", Pos id: "+tid);
if(100 == tid + cid) {
// Correct
//var ttd = document.getElementById("colortd_"+cid);
//ttd.style.backgroundColor = '#9090FF';
logos[li].correct = 2;
//this.el.lcscorrect = 2;
correct++;
} else {
// Wrong :(
//var ttd = document.getElementById("colortd_"+cid);
//ttd.style.backgroundColor = '#FF9090';
logos[li].correct = 3;
//this.el.lcscorrect = 3;
wrong++;
}
} else {
this.el.dom.style.position = 'static';
}
//alert("Placed: "+placed+"\nCorrect: "+correct+"\nWrong: "+wrong);
},
onInvalidDrop: function() {
this.el.removeCls('valid-zone');
this.el.moveTo(this.initialPosition[0], this.initialPosition[1]);
},
endDrag: function(e, id) {
this.el.removeCls('selected');
//Ext.fly(id).removeCls('drop-target');
//this.el.highlight();
}
};
var tables = Ext.get('logospace').select('div');
Ext.each(tables.elements, function(el) {
var dd = Ext.create('Ext.dd.DD', el, 'tablesDDGroup', {
isTarget: false
});
Ext.apply(dd, overrides);
//el.lcspos = "logospace";
logos[logos.length] = { id: el.id, pos: "logospace", correct: 0, posi: -1, hasimg: false };
});
//set targets
// var mainTarget = Ext.create('Ext.dd.DDTarget', 'mainRoom', 'tablesDDGroup', {
// ignoreSelf: false
// });
var target = Ext.create('Ext.dd.DDTarget', 'logospace', 'tablesDDGroup', { ignoreSelf: false });
var colors = Ext.get('colorspace').select('div');
Ext.each(colors.elements, function(el) {
var target = Ext.create('Ext.dd.DDTarget', el.id, 'tablesDDGroup', { ignoreSelf: false });
});
placed = 0;
correct = 0;
wrong = 0;
cbutton = Ext.create('Ext.Button', {
text : 'Calculate Score',
//renderTo: Ext.getBody(),
renderTo: Ext.get('pinfo'),
id : 'scorecheckbutton',
disabled: true,
//ui: 'round',
scale : 'large',
handler : function() {
checkscore();
}
});
colorkey = document.createElement("img");
colorkey.setAttribute("src","/~dave/images/tmp/cs_colorkey2.png");
colorkey.style.position = 'absolute';
//disc = document.createElement("div");
//disc.setAttribute('id','disclaimer');
//disc.style.fontSize = 'x-small';
//disc.style.color = '#808080';
//disc.style.textAlign = 'center';
//disc.style.width = '1024px';
//disc.innerHTML = '
The logos used on this page are trademarks of the LEGO company
and are used here without permission.';
//disc.style.position = 'absolute';
{
var pinfo = document.getElementById("pinfo");
var rect = pinfo.getBoundingClientRect();
var bodyrect = document.body.getBoundingClientRect();
//this.el.moveTo(rect.left + 5 - bodyrect.left, rect.top + 5 - bodyrect.top);
colorkey.style.left = (rect.left - bodyrect.left) + "px";
colorkey.style.top = (rect.top - bodyrect.top) + "px";
//disc.style.top = (rect.top - bodyrect.top + 115) + "px";
//disc.style.left = (rect.left - bodyrect.left + 250) + "px";
}
document.body.appendChild(colorkey);
//pinfo.appendChild(disc);
add_disclaimer();
}
});
function add_disclaimer() {
var disc = document.createElement("div");
disc.setAttribute('id','disclaimer');
disc.style.fontSize = 'x-small';
disc.style.color = '#808080';
disc.style.textAlign = 'center';
disc.style.width = '1024px';
disc.innerHTML = '
The logos used on this page are trademarks of the LEGO company
and are used here without permission.';
pinfo.appendChild(disc);
}
function checkscore() {
var tables = Ext.get('logospace').select('div');
var i;
for(i=0;i"+rank+"
You scored "+percent+"%
";
button = document.getElementById('scorecheckbutton');
button.parentNode.removeChild(button);
pinfo.appendChild(adiv);
var disc = document.getElementById('disclaimer');
disc.parentNode.removeChild(disc);
var repimg = document.createElement("img");
repimg.setAttribute('src',"http://www.suave.net/~dave/cgi/csquiz.cgi?func=report&score="+correct+","+wrong);
document.body.appendChild(repimg);
isdone = true;
add_disclaimer();
}
function getlogoi(id) {
var i;
for(i=0;i