// campusmap.js
// Darby Hewitt
// Nov. 16, 2007
//this variable holds the last pin element to have had focus
lastFocusPin = '';
//added 5/9/08
//will open a window with a mini map based on bldg passed in
function openMiniMapWin(bldg){
var bldgImg = '';
var bldgUrl = '';
switch(bldg){
case "Adams Hall":
bldgUrl = "http://www.acu.edu/campusoffices/residencelife/womenshalls/adams.html";
bldgImg = "http://www.acu.edu/aboutacu/acutour/images/adamshallmap.jpg";
break;
case "Smith Hall":
bldgUrl = "http://www.acu.edu/campusoffices/residencelife/menshalls/smith.html";
bldgImg = "http://www.acu.edu/aboutacu/acutour/images/smithhallmap.jpg";
break;
case "Sherrod Residential Park":
bldgUrl = "http://www.acu.edu/campusoffices/residencelife/sherrod.html";
bldgImg = "http://www.acu.edu/aboutacu/acutour/images/sherrodresmap.jpg";
break;
//case...
}
bigwin = window;
newwin=window.open('','name','height=600,width=550');
var html = newwin.document;
html.write(''+bldg+'');
html.write('');
html.write('
');
html.write('
');
html.write('');
html.close();
};
function cursorPointer() {
document.body.style.cursor = 'pointer';
};
function cursorMove() {
document.body.style.cursor = 'move';
};
function cursorUpDown() {
document.body.style.cursor = 'n-resize';
};
function cursorReset() {
document.body.style.cursor = 'default';
};
function resetPinOpacity() {
//if it's the first time to do this, or if there's no lastFocusPin pin
//don't worry about setting z-index down to 1 or the opacity to 0
//otherwise, do.
if(lastFocusPin !=''){
var lastActiveBldgTxtId = lastFocusPin.getProperty('id')+"Txt";
inactiveTop = (lastFocusPin.getStyle('top').split('px')[0]*1) + 20;
inactiveLeft = (lastFocusPin.getStyle('left').split('px')[0] *1) + 18;
inactiveTop = inactiveTop + 'px';
inactiveLeft = inactiveLeft + 'px';
//alert("inactiveLeft: " + inactiveLeft +"\ninactiveTop: " + inactiveTop);
lastFocusPin.setStyles({
'background':'url("pin.png") bottom left no-repeat',
'width':'12px',
'height':'20px',
'top':inactiveTop,
'left':inactiveLeft
});
$(lastActiveBldgTxtId).setStyles({
'opacity':0,
'display':'none'
});
lastFocusPin = '';
}
};
function slideToPin(pinElement, magMap, littleMapMag){
var pinTextID = pinElement.getProperty('id') + 'Txt';
var closeBtnID = pinElement.getProperty('id') + 'Close';
//var pinFX = new Fx.Styles(pinTextID, {wait:false});
var pinPos = pinElement.getPosition();
var mapPos = $('bigmap').getPosition();
var framePos = $('mapframe').getPosition();
var containerPos = $('bigmapcontainer').getPosition();
var elTop = pinPos.y - mapPos.y;
var elLeft = pinPos.x - mapPos.x;
var mapTop;
var mapLeft;
if(elTop <= 300){
mapTop = 330;
}
else{
if(elTop >= 530){
mapTop = 0;
}
else{
mapTop = 300 + framePos.y - elTop - containerPos.y;
}
}
if(elLeft <= 200){
mapLeft = 1094;
}
else{
if(elLeft >= 1094){
mapLeft = 0;
}
else{
mapLeft = 200 + framePos.x - elLeft - containerPos.x;
}
}
//makes the previous pin invisible, if there was a previous pin
resetPinOpacity();
//and make the current element the lastFocusPin
lastFocusPin = pinElement;
var pinTxtLeft = $(pinTextID).getStyle('left');
if(pinTxtLeft == '0px' || pinTxtLeft == 'auto' || pinTxtLeft == ''){
pinTxtLeft = pinElement.getStyle('left');
pinTxtLeft = pinTxtLeft.split('px');
pinTxtLeft = (pinTxtLeft[0] * 1) - 15;
pinTxtLeft = pinTxtLeft+"px";
}
var pinTop = pinElement.getStyle('top');
var pinTxtBottom = $('bigmap').getStyle('height');
pinTxtBottom = pinTxtBottom.split('px');
pinTop = pinTop.split('px');
pinTxtBottom = (pinTxtBottom[0] * 1) - (pinTop[0] * 1) - 5;
pinTxtBottom = pinTxtBottom+"px";
activeTop = (pinElement.getStyle('top').split('px')[0]*1) - 20;
activeLeft = (pinElement.getStyle('left').split('px')[0] *1) - 18;
activeTop = activeTop + 'px';
activeLeft = activeLeft + 'px';
pinElement.setStyles({
'background':'url("activepin.png") bottom left no-repeat',
'width':'50px',
'height':'40px',
'left':activeLeft,
'top':activeTop
});
$(pinTextID).setStyles({
'bottom' : pinTxtBottom,
'left' : pinTxtLeft,
'z-index' : '2',
'display' : 'block',
'opacity': 1
});
/*pinFX.start({
'opacity': 1
});*/
if($(closeBtnID) != null){
$(closeBtnID).addEvent('click', function(){
resetPinOpacity();
cursorMove();
});
$(closeBtnID).addEvent('mouseenter', function(){
cursorPointer();
});
$(closeBtnID).addEvent('mouseleave', function(){
cursorReset();
});
}
magMap.start({
'left': mapLeft,
'top': mapTop
});
littleMapMag.start({
'top': (framePos.y-mapTop-containerPos.y)/9.2 ,
'left': (framePos.x-mapLeft-containerPos.x)/9.2
});
};
//**************************************************************************
// the DOM Ready event
//
window.addEvent('domready', function(){
var legendIDs = new Array();
var pinIDs = new Array();
var mag = new Drag.Move('magnifier', {'container':$('dragcontainer'), 'duration':400});
var littlemapmag = new Fx.Styles('magnifier');
var mapmove = new Drag.Move('bigmap', {'container':$('bigmapcontainer'), 'duration':400});
var magmap = new Fx.Styles('bigmap');
//--------------------------------------------------------------------------
// dragging the magnifier -- onComplete
//
// this function animates the movement of the map (and all the pins)
//
mag.addEvent('onComplete', function(){
var magnifierpos = $('magnifier').getPosition();
var dragcontainerpos = $('dragcontainer').getPosition();
magmap.start({
'top': -(magnifierpos.y-dragcontainerpos.y)*9.6 + 330,
'left': -(magnifierpos.x-dragcontainerpos.x)*9.6 + 1094
});
});
//
// end onComplete for magnifier dragging
//**************************************************************************
//--------------------------------------------------------------------------
// dragging the big map -- onDrag
//
// this function moves the littlemap magnifier
//
mapmove.addEvent('onDrag', function(){
var transmappos = $('bigmap').getPosition();
var bigmapcontainerpos = $('bigmapcontainer').getPosition();
littlemapmag.set({
'top': (bigmapcontainerpos.y-transmappos.y + 330)/9.6 ,
'left': (bigmapcontainerpos.x-transmappos.x + 1094)/9.6
});
});
//
// end onDrag for map drag
//**************************************************************************
$('mapframe').addEvent('mouseenter', function(){
cursorMove();
});
$('mapframe').addEvent('mouseleave', function(){
cursorReset();
});
$('magnifier').addEvent('mouseenter', function(){
cursorMove();
});
$('magnifier').addEvent('mouseleave', function(){
cursorReset();
});
//---------------------------------------
// add the onclick,mouseenter,mouseleave event listeners to pins and legend items
//
$$('.buildinglabel').each(function(element){
element.addEvent('mouseenter', function(){
cursorPointer();
});
element.addEvent('mouseleave', function(){
cursorMove();
});
element.addEvent('click', function(){
slideToPin(element, magmap, littlemapmag);
});
var legendLinkId = element.getProperty('id') + 'Link';
var legendLink = $(legendLinkId);
legendLink.addEvent('click', function(){
slideToPin(element, magmap, littlemapmag);
});
legendLink.addEvent('mouseenter', function(){
cursorPointer();
});
legendLink.addEvent('mouseleave', function(){
cursorReset();
});
});
});