Mercurial > hg > extraction-interface

comparison geotemco/js/Util/Dropdown.js @ 0:b12c99b7c3f0

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
commit for previous development
author Zoe Hong <zhong@mpiwg-berlin.mpg.de>
date Mon, 19 Jan 2015 17:13:49 +0100
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:b12c99b7c3f0
1 /*
2 * Dropdown.js
3 *
4 * Copyright (c) 2012, Stefan Jänicke. All rights reserved.
5 *
6 * This library is free software; you can redistribute it and/or
7 * modify it under the terms of the GNU Lesser General Public
8 * License as published by the Free Software Foundation; either
9 * version 3 of the License, or (at your option) any later version.
10 *
11 * This library is distributed in the hope that it will be useful,
12 * but WITHOUT ANY WARRANTY; without even the implied warranty of
13 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
14 * Lesser General Public License for more details.
15 *
16 * You should have received a copy of the GNU Lesser General Public
17 * License along with this library; if not, write to the Free Software
18 * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston,
19 * MA 02110-1301 USA
20 */
21
22 /**
23 * @class Dropdown
24 * Implementation for Dropdown box
25 * @author Stefan Jänicke (stjaenicke@informatik.uni-leipzig.de)
26 * @release 1.0
27 * @release date: 2012-07-27
28 * @version date: 2012-07-27
29 *
30 * @param {HTML object} parent parent div for the dropdown box
31 * @param {Array} elements list of dropdown entries
32 * @param {String} title dropdown button title
33 */
34 function Dropdown(parent, elements, title, maxListHeight) {
35
36 var dropdown = this;
37 this.visibility = false;
38 this.div = document.createElement("div");
39 this.div.setAttribute('class', 'dropdown');
40
41 this.selection = document.createElement("div");
42 this.selection.setAttribute('class', 'dropdownSelection');
43 parent.appendChild(this.div);
44
45 var leftBorder = document.createElement("div");
46 leftBorder.setAttribute('class', 'dropdownLeft');
47 this.div.appendChild(leftBorder);
48
49 this.div.appendChild(this.selection);
50
51 var dropdownButton = document.createElement("div");
52 this.div.appendChild(dropdownButton);
53 if (elements.length > 1) {
54 dropdownButton.setAttribute('class', 'dropdownButtonEnabled');
55 } else {
56 dropdownButton.setAttribute('class', 'dropdownButtonDisabled');
57 }
58 dropdownButton.onclick = function() {
59 if (elements.length > 1) {
60 dropdown.changeVisibility();
61 }
62 }
63 dropdownButton.title = title;
64
65 this.getValue = function() {
66 return this.selectedEntry.innerHTML;
67 };
68
69 var entryMenu = document.createElement("div");
70 entryMenu.setAttribute('class', 'dropdownMenu');
71 this.div.appendChild(entryMenu);
72 if (typeof maxListHeight !== "undefined")
73 $(entryMenu).height(maxListHeight);
74
75 var entries = document.createElement("dl");
76 var addEntry = function(e) {
77 var entry = document.createElement("dt");
78 entry.setAttribute('class', 'dropdownUnselectedEntry');
79 entry.innerHTML = e.name;
80 entry.onclick = function() {
81 e.onclick();
82 dropdown.changeVisibility();
83 dropdown.changeEntries(e);
84 }
85 entries.appendChild(entry);
86 e.entry = entry;
87 }
88 for (var i = 0; i < elements.length; i++) {
89 addEntry(elements[i]);
90 }
91 entryMenu.appendChild(entries);
92 this.selection.style.width = entryMenu.offsetWidth + "px";
93 entryMenu.style.width = (entryMenu.offsetWidth + leftBorder.offsetWidth + dropdownButton.offsetWidth - 2) + "px";
94 this.div.style.maxHeight = this.div.offsetHeight + "px";
95
96 entryMenu.style.display = 'none';
97
98 this.setEntry = function(index) {
99 if ( typeof (index) == "undefined") {
100 if ((elements) && elements.length > 0) {
101 this.changeEntries(elements[0]);
102 }
103 } else {
104 this.changeEntries(elements[index]);
105 }
106 }
107
108 this.changeEntries = function(element) {
109 if (this.selectedEntry) {
110 this.selectedEntry.setAttribute('class', 'dropdownUnselectedEntry');
111 }
112 this.selectedEntry = element.entry;
113 this.selectedEntry.setAttribute('class', 'dropdownSelectedEntry');
114 this.selection.innerHTML = "<div style='display:inline-block;vertical-align:middle;'>" + element.name + "</div>";
115 }
116
117 this.changeVisibility = function() {
118 this.visibility = !this.visibility;
119 if (this.visibility) {
120 entryMenu.style.display = "block";
121 } else {
122 entryMenu.style.display = "none";
123 }
124 }
125 }