/** * Zeigt immer nur die Zusatzoptionen zu der ausgewaehlten Zahlungsart an */ function checkout_PaymentSwap(payment_id) { if (browser_IsIE60()) { return; } /* Nur beim Einblenden ausfuehren */ if (document.getElementById('payment_'+ payment_id) && !document.getElementById('payment_'+ payment_id).checked) { return; } var root = document.getElementById('checkout_payment_block'); /* Blendet alle Optionen aus */ more_SwapDisplay(more_GetElementsByClass(root, /form/), 'none', 'none', 'none'); /* Und die gewaehlte wieder ein */ var checkedElements = more_GetElementsChecked(root); if (1 == checkedElements.length) { var id = checkedElements[0].id.replace(/payment_/, ''); var idPattern = eval('/payment_field_'+ id +'/'); more_SwapDisplay(more_GetElementsByClass(root, idPattern), 'table-row', 'table-row', 'table-row'); } /*alert(document.getElementById('payment_moneyorder').checked +' '+ document.getElementById('payment_cod').checked +' '+ document.getElementById('payment_paypal_ipn').checked +' '+ document.getElementById('payment_ipayment').checked); var selectedPattern = eval('/payment_field_'+ payment_id +'/'); more_SwapDisplay(more_GetElementsByClass(root, selectedPattern), 'table-row', 'table-row', 'table-row'); */ } /** * Blendet standardmaessig alle Zahlungsoptionen aus */ function checkout_PaymentInit() { if (browser_IsIE60()) { return; } if (document.getElementById('payment_ipayment') && document.getElementById('payment_ipayment').checked) { checkout_PaymentSwap('ipayment'); } else { checkout_PaymentSwap('__non_selected'); } } /** * @return TRUE gdw. der aktuell verwendete Browser ein Internet Explorer 6.0 * ist */ function browser_IsIE60() { return ('microsoft internet explorer' == navigator.appName.toLowerCase()) && (-1 != navigator.appVersion.toLowerCase().indexOf('msie 6')) } /** * Diese Funktion dient dazu die Daten welche nur fuer Firmenkunden interessant * sind ein und wieder auszublenden */ function createAccount_SwapIsCompany(type, root) { var ic_pc_current = document.getElementById('ic_pc_'+ type); var ic_pc_priv = document.getElementById('ic_pc_priv'); var ic_pc_comp = document.getElementById('ic_pc_comp'); if (null == root) { root = document.getElementById('create_account'); } /* Wenn bereits ausgewaehlt, dann dann nichts machen */ if (ic_pc_current.checked && (null == __global_createAccount_ClickedOnInput)) { return; } __global_createAccount_ClickedOnInput = null; /* Erst mal alle ungecheckt machen */ ic_pc_priv.checked = false; ic_pc_comp.checked = false; /* Ausgewaehltes wieder checken */ ic_pc_current.checked = true; /* Firmendaten einklappen */ more_SwapDisplay(more_GetElementsByClass(root, /more/), 'table-row', 'none', 'table-row'); } /** * Gibt der Funktion createAccount_SwapIsCompany bescheid, dass auf ein Input * Feld geklickt wurde. */ var __global_createAccount_ClickedOnInput = null; function createAccount_ClickedOnInput(onWhich) { __global_createAccount_ClickedOnInput = onWhich; } /** * Diese Funktion blendet ein Menue aus wenn es angezeigt wird und blendet es * ein wenn es unsichtbar ist. * * @param uuid Eindeutige ID das ein-/auszublendenden Menues */ function menu_Swap(image, uuid, default_style) { var pattern_open = /open/; var pattern_close = /close/; var menu = document.getElementById('submenu_'+ uuid); switch (menu.style.display) { /* Das Menue ist ausgeblendet und muss eingeblendet werden */ case 'none': if (image) { image.alt = 'Menü schließen'; image.src = image.src.replace(/open/, 'close'); } menu.style.display = 'block'; break; /* Das Menue wird angezeigt und muss ausgeblendet werden */ case 'inline': case 'block': if (image) { image.alt = 'Menü schließen'; image.src = image.src.replace(/close/, 'open'); } menu.style.display = 'none'; break; /* Dem Element wurde kein besonderer Style zugewiesen, wird deswegen * Standardmaessig angezeigt und muss ausgeblendet werden */ default: if (image) { image.alt = 'Menü öffnen'; if (null == pattern_open.exec(image.src)) { image.src = image.src.replace(pattern_close, 'open'); } else { image.src = image.src.replace(pattern_open, 'close'); } } menu.style.display = default_style; } }/** * Copyright (c) 2007 Volker Kokula * * This software is provided 'as-is', without any express or implied warranty. * In no event will the authors be held liable for any damages arising from the * use of this software. * * Permission is granted to anyone to use this software for any purpose, not * including commercial applications, and to alter it and redistribute it * freely, subject to the following restrictions: * * 1. The origin of this software must not be misrepresented; you must not * claim that you wrote the original software. If you use this software * an acknowledgment in the documentation is required. * * 2. Altered source versions must be plainly marked as such, and must not * be misrepresented as being the original software. * * 3. This notice may not be removed or altered from any source * distribution. */ /** * Gibt alle DOM-Elemente unterhalb eines uebergebenen Elements zurueck deren * ID ein uebergebenes Pattern matched * * @param element DOM-Element von welchem aus gesucht werden soll * @param pattern Alle Elemente deren ID auf das uebergebene Pattern matchen * werden zurueckgegeben * * @return Ein Array von DOM-Elementen deren ID auf das uebergebene Pattern * matched */ function more_GetElements(element, pattern) { var result = new Array(); /* Invalides Element uebergeben */ if (null == element) { return result; } for (var i = 0; element.childNodes[i]; ++i) { if ((element.childNodes[i].id) && (pattern.exec(element.childNodes[i].id) != null)) { result.push(element.childNodes[i]); } if (element.childNodes[i].childNodes[0]) { result = result.concat(more_GetElements(element.childNodes[i], pattern)); } } return result; } /** * Gibt alle DOM-Elemente unterhalb eines uebergebenen Elements zurueck deren * CSS-Klasse ein uebergebenes Pattern matched * * @param element DOM-Element von welchem aus gesucht werden soll * @param pattern Alle Elemente deren Klasse auf das uebergebene Pattern * matchen werden zurueckgegeben * * @return Ein Array von DOM-Elementen deren Klasse auf das uebergebene Pattern * matched */ function more_GetElementsByClass(element, pattern) { var result = new Array(); /* Invalides Element uebergeben */ if (null == element) { return result; } for (var i = 0; element.childNodes[i]; ++i) { if ((element.childNodes[i].className) && (pattern.exec(element.childNodes[i].className) != null)) { result.push(element.childNodes[i]); } if (element.childNodes[i].childNodes[0]) { result = result.concat(more_GetElementsByClass(element.childNodes[i], pattern)); } } return result; } /** * Gibt alle DOM-Elemente unterhalb eines uebergebenen Elements zurueck deren * Attribut ,,checked'' war ist, welche also ausgewaehlt sind * * @param element DOM-Element von welchem aus gesucht werden soll * * @return Ein Array von DOM-Elementen welche ausgewaehlt sind */ function more_GetElementsChecked(element) { var result = new Array(); /* Invalides Element uebergeben */ if (null == element) { return result; } for (var i = 0; element.childNodes[i]; ++i) { if (element.childNodes[i].checked) { result.push(element.childNodes[i]); } if (element.childNodes[i].childNodes[0]) { result = result.concat(more_GetElementsChecked(element.childNodes[i])); } } return result; } /** * Wechselt zwischen sichtbar und nicht sichtbar fuer alle Elemente des * uebergebenen Arrays * * @param elements Array mit zu wechselnden Elementen * @param style_visible Name des Display Styles bei welchem das Element * angezeigt wird * @param style_invisible Name des Display Styles bei welchem das Element nicht * angezeigt wird * @param style_default Wenn noch kein Style angegeben ist wird dieser benutzt */ function more_SwapDisplay(elements, style_visible, style_invisible, style_default) { /* Internet Explorer kann nur was mit inline und block anfangen */ if ('microsoft internet explorer' == navigator.appName.toLowerCase()) { if (('inline' != style_visible) && ('block' != style_visible) && ('none' != style_visible)) { style_visible = 'block'; } if (('inline' != style_default) && ('block' != style_default) && ('none' != style_default)) { style_default = 'block'; } } for (var i = 0; i < elements.length; ++i) { if (elements[i].style.display == style_visible) { elements[i].style.display = style_invisible; } else if (elements[i].style.display == style_invisible) { elements[i].style.display = style_visible; } else { elements[i].style.display = style_default; } } } /** * Diese Funktion blendet alle Erweiterten Produkut Detail Beschreibungen (wie * z.B. Artikelbeschreibung, Meinungen, Service usw.) aus und anschliessend die * gewaehlte Version wieder ein. */ function product_info_extended_Swap(selected) { var rootHead = document.getElementById('products_info_extended'); var rootContent = document.getElementById('products_info_extended_content'); var selectedRegExp = eval('/products_info_extended_'+ selected +'_(text|plane)/'); var elements = null; var i = null; /* Style aller Ueberschriften auf nicht selected setzen */ elements = more_GetElements(rootHead, /products_info_extended_([^_]+)_plane/); for (i = 0; i < elements.length; ++i) { if (null == selectedRegExp.exec(elements[i].id)) { elements[i].className = 'inclined_plane inclined_plane_unselected'; } else { elements[i].className = 'inclined_plane inclined_plane_selected'; } } elements = more_GetElements(rootHead, /products_info_extended_([^_]+)_text/); for (i = 0; i < elements.length; ++i) { if (null == selectedRegExp.exec(elements[i].id)) { elements[i].className = 'text'; } else { elements[i].className = 'text text_selected'; } } /* Alle Inhalte ausblenden... */ elements = more_GetElements(rootContent, /products_info_extended_content/); for (i = 0; i < elements.length; ++i) { elements[i].style.display = 'none'; } /* ...und gewaehlten Inhalt wieder anzeigen lassen */ document.getElementById('products_info_extended_content_'+ selected).style.display = 'block'; return false; }var selected; var submitter = null; function submitFunction() { submitter = 1; } function popupWindow(url) { window.open(url,'popupWindow','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,copyhistory=no,width=100,height=100,screenX=150,screenY=150,top=150,left=150') } function selectRowEffect(object, buttonSelect) { if (!selected) { if (document.getElementById) { selected = document.getElementById('defaultSelected'); } else { selected = document.all['defaultSelected']; } } if (selected) selected.className = 'moduleRow'; object.className = 'moduleRowSelected'; selected = object; // one button is not an array if (document.getElementById('payment'[0])) { document.getElementById('payment'[buttonSelect]).checked=true; } else { //document.getElementById('payment'[selected]).checked=true; } } function rowOverEffect(object) { if (object.className == 'moduleRow') object.className = 'moduleRowOver'; } function rowOutEffect(object) { if (object.className == 'moduleRowOver') object.className = 'moduleRow'; } function popupImageWindow(url) { window.open(url,'popupImageWindow','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=yes,copyhistory=no,width=100,height=100,screenX=150,screenY=150,top=150,left=150') } /** * Wechselt zwischen aus- und eingeklappten Status der Empfehlungen * * @param image DOM-Element des zu wechselnden Bildes * @param text_more Text welcher zum ausklappen angezeigt werden soll * @param text_less Text welcher zum einklappen angezeigt werden soll */ function suggestions_Swap(image, text_more, text_less) { /* Bild wechseln */ var more = /more/; var less = /less/; if ((more.exec(image.src) == null) && (less.exec(image.src) == null)) { alert('Pfad zu Bild enthält weder ,,more\'\' noch ,,less\'\''); return; } if (more.exec(image.src) == null) { image.src = image.src.replace(less, 'more'); image.alt = text_more; } else { image.src = image.src.replace(more, 'less'); image.alt = text_less; } /* Elemente wechseln */ var root_posts = document.getElementById('suggestions_matching_posts'); var root_products = document.getElementById('suggestions_similar_products'); if (root_products) { more_SwapDisplay(more_GetElementsByClass(root_products, /more/), 'table-row', 'none', 'table-row'); } if (root_posts) { more_SwapDisplay(more_GetElementsByClass(root_posts, /more/), 'block', 'none', 'block'); } } /** * Wechselt zwischen aus- und eingeklappten Status der Empfehlungen * * @param image DOM-Element des zu wechselnden Bildes * @param text_more Text welcher zum ausklappen angezeigt werden soll * @param text_less Text welcher zum einklappen angezeigt werden soll */ function suggestions_SwapText(text, image, text_more, text_less) { /* Bild wechseln */ var more = /more/; var less = /less/; if ((more.exec(image.src) == null) && (less.exec(image.src) == null)) { alert('Pfad zu Bild enthält weder ,,more\'\' noch ,,less\'\''); return; } if (more.exec(image.src) == null) { image.src = image.src.replace(less, 'more'); image.alt = text_more; text.innerHTML = text_more; } else { image.src = image.src.replace(more, 'less'); image.alt = text_less; text.innerHTML = text_less; } /* Elemente wechseln */ var root_posts = document.getElementById('suggestions_matching_posts'); var root_products = document.getElementById('suggestions_similar_products'); if (root_products) { more_SwapDisplay(more_GetElementsByClass(root_products, /more/), 'table-row', 'none', 'table-row'); } if (root_posts) { more_SwapDisplay(more_GetElementsByClass(root_posts, /more/), 'block', 'none', 'block'); } } /** * Wechselt zwischen eingeklappt und ausgeklappt * * @param element DOM-Element von welchem ausgehend alle Unterelemente nach * einer ,,more'' Klasse durchsucht werden um diese anschliessend ein bzw. * auszuklappen * function more_Swap(element) { alert('a'); if (null == element) { return; } var result; for (current = element.firstChild; current != null; current = current.nextSibling) { result += current.class +"\n"; } alert(result); }*/ /** * Diese Methode blendet weitere Produktempfehlungen bzw. * Forenbeitragsempfehlungen ein und auch wieder aus * * @param root_id ID des umgebenen Tags (wird fuer more Funktion gebraucht) * @param img * function suggestions_Swap(root_id, image) { /* Bild wechseln * var more = /more/; var less = /less/; if ((more.exec(image.src) == null) && (less.exec(image.src) == null)) { alert('Pfad zu Bild enthält weder ,,more\'\' noch ,,less\'\''); return; } if (more.exec(image.src) == null) { image.src = image.src.replace(less, 'more'); } else { image.src = image.src.replace(more, 'less'); } /* ,,more''-Elemente ein- bzw. ausklappen * alert('a'); var root = document.getElementById(root_id); alert('b'); more_Swap(root); alert('c'); } */var ttID = 0; /** * Alte Tooltip Funktion Wrapped auf die neue */ function doTooltip(event, tip) { ++ttID; tt_RegisterTip(''+ ttID, 'Information', tip, new Array(tt_CreateLink("http://www.leds.de"), tt_CreateLink("http://www.lumitronixforum.de"))); tt_RegisterEvent('in', ''+ ttID, event); } /** * Alte Tooltip Funktion, Wrapped auf die neue */ function hideTip() { tt_RegisterEvent('out', ''+ ttID); } function hideTechDetails() { document.getElementById('td_Button').innerHTML = ''; document.getElementById('ToolBox1').style.display = 'none'; } function showTechDetails() { document.getElementById('td_Button').innerHTML = ''; document.getElementById('ToolBox1').style.display = 'block'; }/** * Copyright (c) 2006, 2007 Volker Kokula * * This software is provided 'as-is', without any express or implied warranty. * In no event will the authors be held liable for any damages arising from the * use of this software. * * Permission is granted to anyone to use this software for any purpose, not * including commercial applications, and to alter it and redistribute it * freely, subject to the following restrictions: * * 1. The origin of this software must not be misrepresented; you must not * claim that you wrote the original software. If you use this software * an acknowledgment in the documentation is required. * * 2. Altered source versions must be plainly marked as such, and must not * be misrepresented as being the original software. * * 3. This notice may not be removed or altered from any source * distribution. */ /** * Konfigurationsvariablen des Tooltips */ var global_ToolTipsConfig = new Array(); global_ToolTipsConfig["arrow_id"] = "tt_Arrow"; global_ToolTipsConfig["box_id"] = "tt_Box"; global_ToolTipsConfig["box_header_id"] = "tt_Box_Header"; global_ToolTipsConfig["box_content_id"] = "tt_Box_Content"; global_ToolTipsConfig["box_links_id"] = "tt_Box_Links"; global_ToolTipsConfig["timer_id"] = null; global_ToolTipsConfig["timer_interval"] = 20; global_ToolTipsConfig["display_tip_ticks"] = 1; // Zeitspanne bevor ausgeblendet wird global_ToolTipsConfig["ticks_before_displayed"] = 10; // Zeit bevor eingeblendet wird global_ToolTipsConfig["activ_tip"] = null; global_ToolTipsConfig["last_event"] = null; global_ToolTipsConfig["arrow_left"] = "templates/lumitronix/img/tooltip/arrow_left.gif"; // Pfeil links des TTs global_ToolTipsConfig["arrow_right"] = "templates/lumitronix/img/tooltip/arrow_right.gif"; // Pfeil rechts des TTs global_ToolTipsConfig["arrow_inner_offset"] = 17; // Abstand der Pfeilspitze vom oberen Bildrand global_ToolTipsConfig["arrow_outer_offset"] = 40; // Abstand des oberen Bildrandes des Pfeiles vom oberen Rand des TTs /** * Die Inhalte aller Tooltips muessen in diesem Array stehen */ var global_ToolTips = new Array(); /** * Entfernt die ``px'' Angabe bei DOM Werten und gibt das Ergebnis als Zahl * zurueck */ function tt_FromPx(value) { return 1.0 * value.replace(/px/, ''); } /** * Wandelt eine Zahl wieder in eine DOM Pixel Angabe um */ function tt_ToPx(value) { return ''+ Math.ceil(value) +'px'; } /** * Gibt die Breite des Anzeigebereiches Browserunabhaengig zurueck */ function getWindowInnerWidth() { var x,y; /* all except Explorer */ if (self.innerHeight) { x = self.innerWidth; y = self.innerHeight; /* Explorer 6 Strict Mode */ } else if (document.documentElement && document.documentElement.clientHeight) { x = document.documentElement.clientWidth; y = document.documentElement.clientHeight; /* other Explorers */ } else if (document.body) { x = document.body.clientWidth; y = document.body.clientHeight; } return x; } /** * Diese Funktion registriert einen neuen Tooltip * * @param name Name des Tooltips * @param heading Ueberschrift * @param content Inhalt * @param arguments[3] Ein Array von Links */ function tt_RegisterTip(name, heading, content) { var tmpTip = new Array(); tmpTip["heading"] = heading; tmpTip["content"] = content; tmpTip["links"] = arguments.length == 4 ? arguments[3] : new Array(tt_CreateLink('http://www.leds.de'), tt_CreateLink('http://www.lumitronixforum.de', 'Forum')); tmpTip["ticks_displayed"] = 0; tmpTip["can_hide"] = false; tmpTip["ticks_not_displayed"] = 0; global_ToolTips[name] = tmpTip; return true; } /** * Diese Funktion gibt einen Link zurueck wie er fuer tt_RegisterTip benoetigt * wird * * @param url URL des Links * @param arguments[1] Angezeigter Name des Links (optional) * @param arguments[2] Target des Links (optional) * @return Eine Map welche einen Link beschreibt */ function tt_CreateLink(url) { var tmpLink = new Array(); tmpLink["url"] = url; tmpLink["name"] = url; tmpLink["target"] = null; /* Das zweite Argument steht fuer den Namen */ if (arguments.length >= 2) { tmpLink["name"] = arguments[1]; } /* Das dritte steht fuer das Target in welchem der Link geoeffnet werden * soll */ if (arguments.length == 3) { tmpLink["target"] = arguments[2]; } return tmpLink; } /** * Gibt eine Konfigurationsvariable zurueck * * @param name Name der Variablen * @return Den Inhalt der Variablen */ function tt_GetConfig(name) { return global_ToolTipsConfig[name]; } /** * Setzt den Inhalt einer Konfigurationsvarialben * * @param name Name der Variablen * @param Neuer Inhalt der Variablen */ function tt_SetConfig(name, value) { global_ToolTipsConfig[name] = value; } /** * Gibt einen Tool-Tip zurueck * * @param name Name des Tips * @return Die Tipstruktur */ function tt_GetTip(name) { return global_ToolTips[name]; } /** * Setzt einen Tool-Tip * * @param name Name des Tips * @param Neuer neue Tip-Struktur */ function tt_SetTip(name, tip) { global_ToolTips[name] = tip; } /** * Startet den Timer und erledigt was sonst noch zu erledigen ist bevor die * Tool-Tips benutzt werden koennen */ function tt_Init() { tt_SetConfig("timer_id", window.setInterval("tt_Timer()", tt_GetConfig("timer_interval"))); checkout_PaymentInit(); } /** * Wertet Benutzereingaben aus und setzt einen bestimmten ToolTip */ function tt_Timer() { /* Wenn ToolTip aktiv und er kann verborgen werden, dann Ticks hochzaehlen * bis Maximum erreicht ist. Wenn dem so ist, dann den Tip wieder * deaktivieren. */ var currentTip = tt_GetConfig("current_tip"); if (null != currentTip) { currentTip = tt_GetTip(currentTip); if (currentTip["can_hide"]) { currentTip["ticks_displayed"]++; /* Wenn maximale Anzahl erreicht, dann ausblenden */ if (currentTip["ticks_displayed"] >= tt_GetConfig("display_tip_ticks")) { tt_HideTip(); } } else { currentTip["ticks_displayed"] = 0; /* Es muss noch gewartet werden bis Tip angezeigt wird */ if (currentTip["ticks_not_displayed"] <= tt_GetConfig("ticks_before_displayed")) { currentTip["ticks_not_displayed"]++; } else { var domArrow = document.getElementById(tt_GetConfig("arrow_id")); var domTip = document.getElementById(tt_GetConfig("box_id")); domArrow.style.display = "block"; domTip.style.display = "block"; } } tt_SetTip(currentTip["name"], currentTip); } /* Wenn Benutzereingabe, dann diese Auswerten */ var lastAction = tt_GetConfig("last_action"); if (null != lastAction) { switch (lastAction["action"]) { /* User ist ueber ein Info-Icon gefahren * * a) Es wird kein Tooltip angezeigt * Den gewaehlten Tooltip (nach einer gewissen Verzoegerung) anzeigen * lassen * * b) Es wird bereits ein Tooltip angezeigt: * 1) Es wurde der selbe Tooltip, welcher bereits angezeigt * wird gewaehlt * Nichts tun * 2) Diesen ausblenden und den neuen einblenden */ case 'in': /* Es wird kein Tooltip angezeigt */ if (null == tt_GetConfig("current_tip")) { tt_DisplayTip(lastAction); break; } /* Es wurde der selbe Tooltip, welcher bereits angezeigt wird, * ausgewaehlt */ if (lastAction["tip_name"] == tt_GetConfig("current_tip")) { break; } /* Bisherigen Tooltip ausblenden und neuen einblenden */ tt_HideTip(); tt_DisplayTip(lastAction); break; /* User hat ein Info-Icon verlassen oder den Tooltip selbst * * Jetzt darf das Info-Icon nach einer in der Konfiguration * festgesetzen Zeit wieder verschwinden */ case 'out': case 'menu_out': /* Fehler -> in Aktion wurde nicht ausgeloest */ if (null == tt_GetConfig("current_tip")) { break; } currentTip = tt_GetTip(tt_GetConfig("current_tip")); currentTip["can_hide"] = true; tt_SetTip(currentTip["name"], currentTip); break; /* User faehrt mit der Maus ueber den Tooltip. Ihn jetzt * auszublenden waere ungeschickt, drum ist dies zu verhindern */ case 'menu_in': /* Fehler -> in Aktion wurde nicht ausgeloest */ if (null == tt_GetConfig("current_tip")) { break; } currentTip = tt_GetTip(tt_GetConfig("current_tip")); currentTip["can_hide"] = false; tt_SetTip(currentTip["name"], currentTip); break; } } /* Letzte Aktion wieder zuruecksetzen */ tt_SetConfig("last_action", null); // Debug //window.clearInterval(tt_GetConfig("timer_id")); } /** * Setzt den Display Status der Tool-Tip Objekte */ function tt_SetTipDisplay(display) { document.getElementById(tt_GetConfig("arrow_id")).style.display = display; document.getElementById(tt_GetConfig("box_id")).style.display = display; } /** * Diese Funktion zeigt einen Tooltip an * * @param data Array( * tip_name => Name des anzuzeigenden Tool-Tips * event => Array( * x => X-Position der Pfeilspitze * y => Y-Position der Pfeilspitze * ) * ) */ function tt_DisplayTip(data) { /* DOM Zugriff auf Elemente und Tip selbst */ var tip = tt_GetTip(data["tip_name"]); if (null == tip) return; var domArrow = document.getElementById(tt_GetConfig("arrow_id")); var domTip = document.getElementById(tt_GetConfig("box_id")); var domTipHeader = document.getElementById(tt_GetConfig("box_header_id")); var domTipContent = document.getElementById(tt_GetConfig("box_content_id")); var domTipLinks = document.getElementById(tt_GetConfig("box_links_id")); /* Tip zuruecksetzen */ tip["can_hide"] = false; tip["ticks_displayed"] = 0; tip["ticks_not_displayed"] = 0; /* Links erzeugen */ var links = ''; links += ''; /* Inhalt in die Box setzen */ domTipHeader.innerHTML = tip["heading"]; domTipContent.innerHTML = tip["content"]; domTipLinks.innerHTML = links; /* Elemente positionieren lassen */ tt_SetTipPosition(data["event"], domArrow, domTip); /* Elemente Anzeigen lassen */ //domArrow.style.display = "block"; //domTip.style.display = "block"; /* Konfiguration setzen */ tt_SetConfig("current_tip", data["tip_name"]); } /** * Setzt den Tooltip an eine uebergebene Position und beachtet dabei ob er * links oder rechts von diesem angezeigt werden muss * * @param pos Array( * x => X-Koordinate, * y => Y-Koordinate * ) * @param arrow DOM-Referenz der Pfeilbox * @param box DOM-Referenz der Tool-Tip Box */ function tt_SetTipPosition(pos, arrow, box) { /* Breite von Pfeil und Box */ var width = tt_GetTotalWidth(arrow) + tt_GetTotalWidth(box); alert(pos["x"] +" - "+ width +" - "+ getWindowInnerWidth()); if (pos["x"] + width < getWindowInnerWidth()) { /* Tooltip rechts der Position anzeigen lassen */ arrow.style.left = tt_ToPx(pos["x"]); arrow.style.top = tt_ToPx(pos["y"] - tt_GetConfig("arrow_inner_offset")); arrow.style.backgroundImage = "url('"+ tt_GetConfig("arrow_left") +"')"; box.style.left = tt_ToPx(pos["x"] + tt_GetTotalWidth(arrow) - 1); box.style.top = tt_ToPx( tt_FromPx(arrow.style.top) - tt_GetConfig("arrow_outer_offset")); } else { /* Tooltip links der Position anzeigen lassen */ arrow.style.left = tt_ToPx(pos["x"] - tt_GetTotalWidth(arrow)); arrow.style.top = tt_ToPx(pos["y"] - tt_GetConfig("arrow_inner_offset")); arrow.style.backgroundImage = "url('"+ tt_GetConfig("arrow_right") +"')"; box.style.left = tt_ToPx( pos["x"] - tt_GetTotalWidth(arrow) + 1 - tt_GetTotalWidth(box)); box.style.top = tt_ToPx( tt_FromPx(arrow.style.top) - tt_GetConfig("arrow_outer_offset")); } } /** * Versteckt den aktuell angezeigten Tooltip wieder */ function tt_HideTip() { var currentTipName = tt_GetConfig("current_tip"); if (null == currentTipName) { return; } tt_SetConfig("current_tip", null); var currentTip = tt_GetTip(currentTipName); currentTip["ticks_displayed"] = 0; currentTip["can_hide"] = false; tt_SetTipDisplay("none"); } /** * Registriert eine Benutzeraktion * * @param action ``in'' oder ``out'' fuer das Betreten oder Verlassen eines * Tool-Tip Bereiches * @param arguments[1] Name des Tool-Tips, welchen es betrifft * @param arguments[2] Event Objekt (zum Feststellen der Mausposition) */ function tt_RegisterEvent(action) { var tmpAction = new Array(); tmpAction["action"] = action; tmpAction["tip_name"] = null; tmpAction["event"] = null; /* Name des Tooltips */ if (arguments.length >= 2) tmpAction["tip_name"] = arguments[1]; /* Mausposition (leider nicht vereinheitlicht) */ if (arguments.length >= 3) { var event = arguments[2]; var mouseX = event.pageX ? event.pageX : document.documentElement.scrollLeft + event.clientX; var mouseY = event.pageY ? event.pageY : document.documentElement.scrollTop + event.clientY; tmpAction["event"] = new Array(); tmpAction["event"]["x"] = mouseX; tmpAction["event"]["y"] = mouseY; } /* Wenn es keinen Tooltip dieses Namens gibt, dann letzte Moeglichkeit auf Variablen * vertrauen */ if ('in' == action) { if (null == tt_GetTip(tmpAction["tip_name"])) { var src = 'tt_RegisterTip("'+ tmpAction["tip_name"] +'", "Information", '+ tmpAction["tip_name"] +')'; eval(src); } } tt_SetConfig("last_action", tmpAction); } /** * Copyright (c) 2006, 2007 Volker Kokula * * This software is provided 'as-is', without any express or implied warranty. * In no event will the authors be held liable for any damages arising from the * use of this software. * * Permission is granted to anyone to use this software for any purpose, not * including commercial applications, and to alter it and redistribute it * freely, subject to the following restrictions: * * 1. The origin of this software must not be misrepresented; you must not * claim that you wrote the original software. If you use this software * an acknowledgment in the documentation is required. * * 2. Altered source versions must be plainly marked as such, and must not * be misrepresented as being the original software. * * 3. This notice may not be removed or altered from any source * distribution. */ /** * Konfigurationsvariablen des Tooltips */ var global_ToolTipsConfig = new Array(); global_ToolTipsConfig["arrow_id"] = "tt_Arrow"; global_ToolTipsConfig["box_id"] = "tt_Box"; global_ToolTipsConfig["box_header_id"] = "tt_Box_Header"; global_ToolTipsConfig["box_content_id"] = "tt_Box_Content"; global_ToolTipsConfig["box_links_id"] = "tt_Box_Links"; global_ToolTipsConfig["timer_id"] = null; global_ToolTipsConfig["timer_interval"] = 20; global_ToolTipsConfig["display_tip_ticks"] = 1; // Zeitspanne bevor ausgeblendet wird global_ToolTipsConfig["ticks_before_displayed"] = 10; // Zeit bevor eingeblendet wird global_ToolTipsConfig["activ_tip"] = null; global_ToolTipsConfig["last_event"] = null; global_ToolTipsConfig["arrow_left"] = "templates/lumitronix/img/tooltip/arrow_left.gif"; // Pfeil links des TTs global_ToolTipsConfig["arrow_right"] = "templates/lumitronix/img/tooltip/arrow_right.gif"; // Pfeil rechts des TTs global_ToolTipsConfig["arrow_inner_offset"] = 17; // Abstand der Pfeilspitze vom oberen Bildrand global_ToolTipsConfig["arrow_outer_offset"] = 40; // Abstand des oberen Bildrandes des Pfeiles vom oberen Rand des TTs /** * Die Inhalte aller Tooltips muessen in diesem Array stehen */ var global_ToolTips = new Array(); /** * Entfernt die ``px'' Angabe bei DOM Werten und gibt das Ergebnis als Zahl * zurueck */ function tt_FromPx(value) { return 1.0 * value.replace(/px/, ''); } /** * Wandelt eine Zahl wieder in eine DOM Pixel Angabe um */ function tt_ToPx(value) { return ''+ Math.ceil(value) +'px'; } /** * Gibt die Breite des Anzeigebereiches Browserunabhaengig zurueck */ function getWindowInnerWidth() { var x,y; /* all except Explorer */ if (self.innerHeight) { /* Firefox gibt Breite inklusive Scrollbar zurueck deswegen * standardmaessig 20px abziehen (auch wenn andere Browser wie Opera * sich korrekt verhalten) */ x = self.innerWidth - 20; y = self.innerHeight; /* Explorer 6 Strict Mode */ } else if (document.documentElement && document.documentElement.clientHeight) { x = document.documentElement.clientWidth; y = document.documentElement.clientHeight; /* other Explorers */ } else if (document.body) { x = document.body.clientWidth; y = document.body.clientHeight; } return x; } /** * Browserabhaengige Feststellung der totalen Breite eines uebergebenen * Elements * * @return Die Breite eines Elements inklusive Padding */ function tt_GetTotalWidth(element) { var width = tt_FromPx(element.style.width); if (element.style.borderLeftWidth) { width += tt_FromPx(element.style.borderLeftWidth); } if (element.style.borderRightWidth) { width += tt_FromPx(element.style.borderRightWidth); } if (element.style.paddingLeft) { width += tt_FromPx(element.style.paddingLeft); } if (element.style.paddingRight) { width += tt_FromPx(element.style.paddingRight); } return width; } /** * Diese Funktion registriert einen neuen Tooltip * * @param name Name des Tooltips * @param heading Ueberschrift * @param content Inhalt * @param arguments[3] Ein Array von Links */ function tt_RegisterTip(name, heading, content) { var tmpTip = new Array(); tmpTip["heading"] = heading; tmpTip["content"] = content; tmpTip["links"] = arguments.length == 4 ? arguments[3] : new Array(tt_CreateLink('http://www.leds.de'), tt_CreateLink('http://www.lumitronixforum.de', 'Forum')); tmpTip["ticks_displayed"] = 0; tmpTip["can_hide"] = false; tmpTip["ticks_not_displayed"] = 0; global_ToolTips[name] = tmpTip; return true; } /** * Diese Funktion gibt einen Link zurueck wie er fuer tt_RegisterTip benoetigt * wird * * @param url URL des Links * @param arguments[1] Angezeigter Name des Links (optional) * @param arguments[2] Target des Links (optional) * @return Eine Map welche einen Link beschreibt */ function tt_CreateLink(url) { var tmpLink = new Array(); tmpLink["url"] = url; tmpLink["name"] = url; tmpLink["target"] = null; /* Das zweite Argument steht fuer den Namen */ if (arguments.length >= 2) { tmpLink["name"] = arguments[1]; } /* Das dritte steht fuer das Target in welchem der Link geoeffnet werden * soll */ if (arguments.length == 3) { tmpLink["target"] = arguments[2]; } return tmpLink; } /** * Gibt eine Konfigurationsvariable zurueck * * @param name Name der Variablen * @return Den Inhalt der Variablen */ function tt_GetConfig(name) { return global_ToolTipsConfig[name]; } /** * Setzt den Inhalt einer Konfigurationsvarialben * * @param name Name der Variablen * @param Neuer Inhalt der Variablen */ function tt_SetConfig(name, value) { global_ToolTipsConfig[name] = value; } /** * Gibt einen Tool-Tip zurueck * * @param name Name des Tips * @return Die Tipstruktur */ function tt_GetTip(name) { return global_ToolTips[name]; } /** * Setzt einen Tool-Tip * * @param name Name des Tips * @param Neuer neue Tip-Struktur */ function tt_SetTip(name, tip) { global_ToolTips[name] = tip; } /** * Startet den Timer und erledigt was sonst noch zu erledigen ist bevor die * Tool-Tips benutzt werden koennen */ function tt_Init() { tt_SetConfig("timer_id", window.setInterval("tt_Timer()", tt_GetConfig("timer_interval"))); checkout_PaymentInit(); } /** * Wertet Benutzereingaben aus und setzt einen bestimmten ToolTip */ function tt_Timer() { /* Wenn ToolTip aktiv und er kann verborgen werden, dann Ticks hochzaehlen * bis Maximum erreicht ist. Wenn dem so ist, dann den Tip wieder * deaktivieren. */ var currentTip = tt_GetConfig("current_tip"); if (null != currentTip) { currentTip = tt_GetTip(currentTip); if (currentTip["can_hide"]) { currentTip["ticks_displayed"]++; /* Wenn maximale Anzahl erreicht, dann ausblenden */ if (currentTip["ticks_displayed"] >= tt_GetConfig("display_tip_ticks")) { tt_HideTip(); } } else { currentTip["ticks_displayed"] = 0; /* Es muss noch gewartet werden bis Tip angezeigt wird */ if (currentTip["ticks_not_displayed"] <= tt_GetConfig("ticks_before_displayed")) { currentTip["ticks_not_displayed"]++; } else { var domArrow = document.getElementById(tt_GetConfig("arrow_id")); var domTip = document.getElementById(tt_GetConfig("box_id")); domArrow.style.display = "block"; domTip.style.display = "block"; } } tt_SetTip(currentTip["name"], currentTip); } /* Wenn Benutzereingabe, dann diese Auswerten */ var lastAction = tt_GetConfig("last_action"); if (null != lastAction) { switch (lastAction["action"]) { /* User ist ueber ein Info-Icon gefahren * * a) Es wird kein Tooltip angezeigt * Den gewaehlten Tooltip (nach einer gewissen Verzoegerung) anzeigen * lassen * * b) Es wird bereits ein Tooltip angezeigt: * 1) Es wurde der selbe Tooltip, welcher bereits angezeigt * wird gewaehlt * Nichts tun * 2) Diesen ausblenden und den neuen einblenden */ case 'in': /* Es wird kein Tooltip angezeigt */ if (null == tt_GetConfig("current_tip")) { tt_DisplayTip(lastAction); break; } /* Es wurde der selbe Tooltip, welcher bereits angezeigt wird, * ausgewaehlt */ if (lastAction["tip_name"] == tt_GetConfig("current_tip")) { break; } /* Bisherigen Tooltip ausblenden und neuen einblenden */ tt_HideTip(); tt_DisplayTip(lastAction); break; /* User hat ein Info-Icon verlassen oder den Tooltip selbst * * Jetzt darf das Info-Icon nach einer in der Konfiguration * festgesetzen Zeit wieder verschwinden */ case 'out': case 'menu_out': /* Fehler -> in Aktion wurde nicht ausgeloest */ if (null == tt_GetConfig("current_tip")) { break; } currentTip = tt_GetTip(tt_GetConfig("current_tip")); currentTip["can_hide"] = true; tt_SetTip(currentTip["name"], currentTip); break; /* User faehrt mit der Maus ueber den Tooltip. Ihn jetzt * auszublenden waere ungeschickt, drum ist dies zu verhindern */ case 'menu_in': /* Fehler -> in Aktion wurde nicht ausgeloest */ if (null == tt_GetConfig("current_tip")) { break; } currentTip = tt_GetTip(tt_GetConfig("current_tip")); currentTip["can_hide"] = false; tt_SetTip(currentTip["name"], currentTip); break; } } /* Letzte Aktion wieder zuruecksetzen */ tt_SetConfig("last_action", null); // Debug //window.clearInterval(tt_GetConfig("timer_id")); } /** * Setzt den Display Status der Tool-Tip Objekte */ function tt_SetTipDisplay(display) { document.getElementById(tt_GetConfig("arrow_id")).style.display = display; document.getElementById(tt_GetConfig("box_id")).style.display = display; } /** * Diese Funktion zeigt einen Tooltip an * * @param data Array( * tip_name => Name des anzuzeigenden Tool-Tips * event => Array( * x => X-Position der Pfeilspitze * y => Y-Position der Pfeilspitze * ) * ) */ function tt_DisplayTip(data) { /* DOM Zugriff auf Elemente und Tip selbst */ var tip = tt_GetTip(data["tip_name"]); if (null == tip) return; var domArrow = document.getElementById(tt_GetConfig("arrow_id")); var domTip = document.getElementById(tt_GetConfig("box_id")); var domTipHeader = document.getElementById(tt_GetConfig("box_header_id")); var domTipContent = document.getElementById(tt_GetConfig("box_content_id")); var domTipLinks = document.getElementById(tt_GetConfig("box_links_id")); /* Tip zuruecksetzen */ tip["can_hide"] = false; tip["ticks_displayed"] = 0; tip["ticks_not_displayed"] = 0; /* Links erzeugen */ var links = ''; links += ''; /* Inhalt in die Box setzen */ domTipHeader.innerHTML = tip["heading"]; domTipContent.innerHTML = tip["content"]; domTipLinks.innerHTML = links; /* Elemente positionieren lassen */ tt_SetTipPosition(data["event"], domArrow, domTip); /* Elemente Anzeigen lassen */ //domArrow.style.display = "block"; //domTip.style.display = "block"; /* Konfiguration setzen */ tt_SetConfig("current_tip", data["tip_name"]); } /** * Setzt den Tooltip an eine uebergebene Position und beachtet dabei ob er * links oder rechts von diesem angezeigt werden muss * * @param pos Array( * x => X-Koordinate, * y => Y-Koordinate * ) * @param arrow DOM-Referenz der Pfeilbox * @param box DOM-Referenz der Tool-Tip Box */ function tt_SetTipPosition(pos, arrow, box) { /* Breite von Pfeil und Box */ var width = tt_GetTotalWidth(arrow) + tt_GetTotalWidth(box); //alert(pos["x"] +" - "+ width +" - "+ getWindowInnerWidth()); if (pos["x"] + width < getWindowInnerWidth()) { /* Tooltip rechts der Position anzeigen lassen */ arrow.style.left = tt_ToPx(pos["x"]); arrow.style.top = tt_ToPx(pos["y"] - tt_GetConfig("arrow_inner_offset")); arrow.style.backgroundImage = "url('"+ tt_GetConfig("arrow_left") +"')"; box.style.left = tt_ToPx(pos["x"] + tt_GetTotalWidth(arrow) - 1); box.style.top = tt_ToPx( tt_FromPx(arrow.style.top) - tt_GetConfig("arrow_outer_offset")); } else { /* Tooltip links der Position anzeigen lassen */ arrow.style.left = tt_ToPx(pos["x"] - tt_GetTotalWidth(arrow)); arrow.style.top = tt_ToPx(pos["y"] - tt_GetConfig("arrow_inner_offset")); arrow.style.backgroundImage = "url('"+ tt_GetConfig("arrow_right") +"')"; box.style.left = tt_ToPx( pos["x"] - tt_GetTotalWidth(arrow) + 1 - tt_GetTotalWidth(box)); box.style.top = tt_ToPx( tt_FromPx(arrow.style.top) - tt_GetConfig("arrow_outer_offset")); } } /** * Versteckt den aktuell angezeigten Tooltip wieder */ function tt_HideTip() { var currentTipName = tt_GetConfig("current_tip"); if (null == currentTipName) { return; } tt_SetConfig("current_tip", null); var currentTip = tt_GetTip(currentTipName); currentTip["ticks_displayed"] = 0; currentTip["can_hide"] = false; tt_SetTipDisplay("none"); } /** * Registriert eine Benutzeraktion * * @param action ``in'' oder ``out'' fuer das Betreten oder Verlassen eines * Tool-Tip Bereiches * @param arguments[1] Name des Tool-Tips, welchen es betrifft * @param arguments[2] Event Objekt (zum Feststellen der Mausposition) */ function tt_RegisterEvent(action) { var tmpAction = new Array(); tmpAction["action"] = action; tmpAction["tip_name"] = null; tmpAction["event"] = null; /* Name des Tooltips */ if (arguments.length >= 2) tmpAction["tip_name"] = arguments[1]; /* Mausposition (leider nicht vereinheitlicht) */ if (arguments.length >= 3) { var event = arguments[2]; var mouseX = event.pageX ? event.pageX : (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft) + event.clientX; var mouseY = event.pageY ? event.pageY : (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + event.clientY; tmpAction["event"] = new Array(); tmpAction["event"]["x"] = mouseX; tmpAction["event"]["y"] = mouseY; } /* Wenn es keinen Tooltip dieses Namens gibt, dann letzte Moeglichkeit auf Variablen * vertrauen */ if ('in' == action) { if (null == tt_GetTip(tmpAction["tip_name"])) { var src = 'tt_RegisterTip("'+ tmpAction["tip_name"] +'", "Information", '+ tmpAction["tip_name"] +')'; eval(src); } } tt_SetConfig("last_action", tmpAction); } /** * Dieses Skript dient zum wechseln der Detailansicht verschiedener * Produktvarianten * * @param to Ausgewaehlte Variante, wenn ,,'' dann ist keine ausgewaehlt */ function variants_Swap(to) { var noPatter = /no/; /* Aufmerksam-mach-Bild ein- bzw. ausblenden */ document.getElementById('no_variant_chosen').style.display = null == noPatter.exec(to) ? 'none' : 'inline'; /* Alle Varianten Elemente ausblenden */ var elements = more_GetElements( document.getElementById('variant_detail'), /variant_(([0-9]+)_([0-9]+)(.*)|no_variant_chosen)/); for (var i = 0; i < elements.length; ++i) { elements[i].style.display = 'none'; } /* Wenn keine Variante ausgewaehlt, dann alles ausgeblendet lassen */ if ('' == to) { return; } /* Informationen ueber ausgewaehlte Produktvariante wieder anzeigen */ var pattern = '/variant_'+ to +'_(.*)/'; var elements = more_GetElements( document.getElementById('variant_detail'), eval(pattern)); for (var i = 0; i < elements.length; ++i) { elements[i].style.display = 'inline'; } if (document.getElementById('variant_'+ to)) { document.getElementById('variant_'+ to).style.display = 'block'; } }