MediaWiki:Common.js
Aus Dokumentation
Version vom 15. Dezember 2020, 19:15 Uhr von Admintandler (Diskussion | Beiträge)
Hinweis: Leere nach dem Speichern den Browser-Cache, um die Änderungen sehen zu können.
- Firefox/Safari: Umschalttaste drücken und gleichzeitig Aktualisieren anklicken oder entweder Strg+F5 oder Strg+R (⌘+R auf dem Mac) drücken
- Google Chrome: Umschalttaste+Strg+R (⌘+Umschalttaste+R auf dem Mac) drücken
- Internet Explorer: Strg+F5 drücken oder Strg drücken und gleichzeitig Aktualisieren anklicken
- Opera: Gehe zu Menü → Einstellungen (Opera → Einstellungen auf dem Mac) und dann auf Datenschutz & Sicherheit → Browserdaten löschen → Gespeicherte Bilder und Dateien.
$(function(){
$("#simple-treeview").dxTreeView({
items: products,
width: 300,
onItemClick: function(e) {
var item = e.itemData;
if(item.price) {
$("#product-details").removeClass("hidden");
$("#product-details > img").attr("src", item.image);
$("#product-details > .price").text("$" + item.price);
$("#product-details > .name").text(item.text);
} else {
$("#product-details").addClass("hidden");
}
}
}).dxTreeView("instance");
});
var products = [{
id: "1",
text: "Stores",
expanded: true,
items: [{
id: "1_1",
text: "Super Mart of the West",
expanded: true,
items: [{
id: "1_1_1",
text: "Video Players",
items: [{
id: "1_1_1_1",
text: "HD Video Player",
price: 220,
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/1.png"
}, {
id: "1_1_1_2",
text: "SuperHD Video Player",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/2.png",
price: 270
}]
}, {
id: "1_1_2",
text: "Televisions",
expanded: true,
items: [{
id: "1_1_2_1",
text: "SuperLCD 42",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/7.png",
price: 1200
}, {
id: "1_1_2_2",
text: "SuperLED 42",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/5.png",
price: 1450
}, {
id: "1_1_2_3",
text: "SuperLED 50",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/4.png",
price: 1600
}, {
id: "1_1_2_4",
text: "SuperLCD 55",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/6.png",
price: 1350
}, {
id: "1_1_2_5",
text: "SuperLCD 70",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/9.png",
price: 4000
}]
}, {
id: "1_1_3",
text: "Monitors",
expanded: true,
items: [{
id: "1_1_3_1",
text: "19\"",
expanded: true,
items: [{
id: "1_1_3_1_1",
text: "DesktopLCD 19",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/10.png",
price: 160
}]
}, {
id: "1_1_3_2",
text: "21\"",
items: [{
id: "1_1_3_2_1",
text: "DesktopLCD 21",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/12.png",
price: 170
}, {
id: "1_1_3_2_2",
text: "DesktopLED 21",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/13.png",
price: 175
}]
}]
}, {
id: "1_1_4",
text: "Projectors",
items: [{
id: "1_1_4_1",
text: "Projector Plus",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/14.png",
price: 550
}, {
id: "1_1_4_2",
text: "Projector PlusHD",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/15.png",
price: 750
}]
}]
}, {
id: "1_2",
text: "Braeburn",
items: [{
id: "1_2_1",
text: "Video Players",
items: [{
id: "1_2_1_1",
text: "HD Video Player",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/1.png",
price: 240
}, {
id: "1_2_1_2",
text: "SuperHD Video Player",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/2.png",
price: 300
}]
}, {
id: "1_2_2",
text: "Televisions",
items: [{
id: "1_2_2_1",
text: "SuperPlasma 50",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/3.png",
price: 1800
}, {
id: "1_2_2_2",
text: "SuperPlasma 65",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/8.png",
price: 3500
}]
}, {
id: "1_2_3",
text: "Monitors",
items: [{
id: "1_2_3_1",
text: "19\"",
items: [{
id: "1_2_3_1_1",
text: "DesktopLCD 19",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/10.png",
price: 170
}]
}, {
id: "1_2_3_2",
text: "21\"",
items: [{
id: "1_2_3_2_1",
text: "DesktopLCD 21",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/12.png",
price: 180
}, {
id: "1_2_3_2_2",
text: "DesktopLED 21",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/13.png",
price: 190
}]
}]
}]
}, {
id: "1_3",
text: "E-Mart",
items: [{
id: "1_3_1",
text: "Video Players",
items: [{
id: "1_3_1_1",
text: "HD Video Player",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/1.png",
price: 220
}, {
id: "1_3_1_2",
text: "SuperHD Video Player",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/2.png",
price: 275
}]
}, {
id: "1_3_3",
text: "Monitors",
items: [{
id: "1_3_3_1",
text: "19\"",
items: [{
id: "1_3_3_1_1",
text: "DesktopLCD 19",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/10.png",
price: 165
}]
}, {
id: "1_3_3_2",
text: "21\"",
items: [{
id: "1_3_3_2_1",
text: "DesktopLCD 21",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/12.png",
price: 175
}]
}]
}]
}, {
id: "1_4",
text: "Walters",
items: [{
id: "1_4_1",
text: "Video Players",
items: [{
id: "1_4_1_1",
text: "HD Video Player",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/1.png",
price: 210
}, {
id: "1_4_1_2",
text: "SuperHD Video Player",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/2.png",
price: 250
}]
}, {
id: "1_4_2",
text: "Televisions",
items: [{
id: "1_4_2_1",
text: "SuperLCD 42",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/7.png",
price: 1100
}, {
id: "1_4_2_2",
text: "SuperLED 42",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/5.png",
price: 1400
}, {
id: "1_4_2_3",
text: "SuperLED 50",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/4.png",
price: 1500
}, {
id: "1_4_2_4",
text: "SuperLCD 55",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/6.png",
price: 1300
}, {
id: "1_4_2_5",
text: "SuperLCD 70",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/9.png",
price: 4000
}, {
id: "1_4_2_6",
text: "SuperPlasma 50",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/3.png",
price: 1700
}]
}, {
id: "1_4_3",
text: "Monitors",
items: [{
id: "1_4_3_1",
text: "19\"",
items: [{
id: "1_4_3_1_1",
text: "DesktopLCD 19",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/10.png",
price: 160
}]
}, {
id: "1_4_3_2",
text: "21\"",
items: [{
id: "1_4_3_2_1",
text: "DesktopLCD 21",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/12.png",
price: 170
}, {
id: "1_4_3_2_2",
text: "DesktopLED 21",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/13.png",
price: 180
}]
}]
}, {
id: "1_4_4",
text: "Projectors",
items: [{
id: "1_4_4_1",
text: "Projector Plus",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/14.png",
price: 550
}, {
id: "1_4_4_2",
text: "Projector PlusHD",
image: "https://js.devexpress.com/Demos/WidgetsGallery/JSDemos/images/products/15.png",
price: 750
}]
}]
}]
}];
function initTree(treeData) {
$('#tree').treeview({
data: treeData,
enableLinks: true
});
// collapses all nodes
$('#tree').treeview('collapseAll', { silent: true });
}
initTree(tree);
$.fn.extend({
treed: function (o) {
var openedClass = 'glyphicon-minus-sign';
var closedClass = 'glyphicon-plus-sign';
if (typeof o != 'undefined'){
if (typeof o.openedClass != 'undefined'){
openedClass = o.openedClass;
}
if (typeof o.closedClass != 'undefined'){
closedClass = o.closedClass;
}
};
//initialize each of the top levels
var tree = $(this);
tree.addClass("tree");
tree.find('li').has("ul").each(function () {
var branch = $(this); //li with children ul
branch.prepend("<i class='indicator glyphicon " + closedClass + "'></i>");
branch.addClass('branch');
branch.on('click', function (e) {
if (this == e.target) {
var icon = $(this).children('i:first');
icon.toggleClass(openedClass + " " + closedClass);
$(this).children().children().toggle();
}
})
branch.children().children().toggle();
});
//fire event from the dynamically added icon
tree.find('.branch .indicator').each(function(){
$(this).on('click', function () {
$(this).closest('li').click();
});
});
//fire event to open branch if the li contains an anchor instead of text
tree.find('.branch>a').each(function () {
$(this).on('click', function (e) {
$(this).closest('li').click();
e.preventDefault();
});
});
//fire event to open branch if the li contains a button instead of text
tree.find('.branch>button').each(function () {
$(this).on('click', function (e) {
$(this).closest('li').click();
e.preventDefault();
});
});
}
});
//Initialization of treeviews
$('#tree2').treed({openedClass:'glyphicon-folder-open', closedClass:'glyphicon-folder-close'});