source: main/trunk/greenstone3/web/interfaces/default/js/hierarchy.js@ 30464

Last change on this file since 30464 was 30464, checked in by Georgiy Litvinov, 8 years ago

Fixed webeditor hierarchy suggestions menu.
File size: 12.5 KB
Line 
1//hierarchy storage object
2
3//hierarchy menu Button text
4var hierarchyMenuButton = "Menu";
5//Find first ancestor element by tag name
6function findAncestorByTagName (element, tagName) {
7 while ((element.tagName != tagName) && (element = element.parentElement));
8 return element;
9}
10// Function to set Id as TEXTAREA value
11function setHierarchyId(a)
12{
13
14 var id = a.parentElement.id;
15 //console.log("Try to set ID" + id)
16// If ID defined and not null
17 if (id && (id != null))
18 {
19 //find TR Ancestor to get TEXTAREA
20 var tr = findAncestorByTagName(a,"TR");
21 //Set value to id of clicked element
22 $(tr.getElementsByTagName("TEXTAREA")).val(id);
23 // Set button name
24 removeSuggestionsMenu(tr, $(a).text());
25 //Hide menu after click
26 $(tr).find(".metaDataHierarchyMenu").find("ul li ul li").hide();
27 //If we left TEXTAREA, hide all menus
28 //if (document.activeElement.tagName != "TEXTAREA")
29 //{
30 // $(tr).find(".metaDataHierarchyMenu").hide();
31 //}
32 tr.getElementsByTagName("TEXTAREA")[0].focus();
33
34 createSuggestionsMenu(tr);
35
36 }
37}
38function openHierarchyMenuLevel(menuItem)
39{
40 //console.log(menuItem);
41
42 var tr = findAncestorByTagName(menuItem,"TR");
43 //get current MetaDataName
44 var metaName = $(tr.getElementsByClassName("metaTableCellName")[0]).text();
45 //Get current hierarchy from storages
46 var hierarchyData = hierarchyStorage[metaName];
47 menuItem = $(menuItem);
48 if (menuItem.find('ul').length == 0)
49 {
50 //Expression to extract hierarchy identifier from menu item id
51 var getIdExp = /[0-9.]+/;
52 //Extracted hierarchy identifier
53 var id;
54 //Expression to get childs
55 var childExpr;
56 if (menuItem.attr('id'))
57 {
58 id = menuItem.attr('id').match(getIdExp);
59 }
60 //console.log("ID " + id);
61 //id.match(getIdExp);
62 if (id == null)
63 {
64 childExpr = /^[0-9]+$/;
65 }
66 else
67 {
68 childExpr = new RegExp("^" + id + "." + "[0-9]+$");
69 }
70 var levelItems = {};
71 for(var key in hierarchyData)
72 {
73 if(childExpr.test(key)){
74 levelItems[key]='<li id="'+key+'" ><button onclick="setHierarchyId(this)" title='+ hierarchyData[key] +'>' + hierarchyData[key] + '</button></li>';
75 //console.log(levelItems[key]);
76
77 }
78 }
79 //If no elements in hierarchy level
80 if (jQuery.isEmptyObject(levelItems))
81 {
82 //add empty menu. Invisible. Used by checks in setHierarchyEventsWrappers focusout to prevent menu hiding while choosing suggestion menu item leaf
83 menuItem.append("<ul></ul>");
84
85 // console.log("no elements in hierarchy level");
86 }
87 else {
88 //wrap elements in hierarchy level
89 var levelMenu = '<ul>';
90 for(var key in levelItems)
91 {
92 //Fill menu with items
93 levelMenu += levelItems[key];
94 }
95 levelMenu += "</ul>";
96 menuItem.append(levelMenu);
97 menuItem.find("li").hover(
98 function(){openHierarchyMenuLevel(this);}
99 ,
100 function(){closeHierarchyMenuLevel(this);}
101 );
102
103 //menuItem.find('ul');
104 menuItem.children('ul').slideDown();
105
106
107 //console.log("debug line 5");
108 }
109
110 } else {
111 //stop animation
112 menuItem.find('ul').stop(true, true);
113 //show menu items
114 menuItem.children('ul').children('li').show();
115 //slide down menu
116 menuItem.children('ul').slideDown();
117 }
118 menuItem.addClass("active");
119}
120function closeHierarchyMenuLevel(menuItem)
121{
122 $(menuItem).removeClass("active");
123 $(menuItem).find('ul').hide();
124}
125// Download hierarchy file and process it
126function downloadAndProcessHierarchyFile(hierarchyFileName,metaName)
127{
128
129 var xmlhttp=new XMLHttpRequest();
130 xmlhttp.open("GET",hierarchyFileName,true);
131 xmlhttp.send();
132 xmlhttp.onreadystatechange=function()
133 {
134 if (xmlhttp.readyState==4 && xmlhttp.status==200)
135 {
136 var hierarchyFile = xmlhttp.responseText;
137 var StringData = [];
138 var hierarchyData = {};
139 var expr = /^([0-9]+(?:\.[0-9]+)*)\ ([0-9]+(?:\.[0-9]+)*)\ (.*)/m;
140 StringData = hierarchyFile.split('\n');
141 for (var i = 0; i < StringData.length; i++)
142 {
143 var result = StringData[i].match(expr);
144 // If result not null
145 if (result != null && result[2] != null && result[3] != null)
146 {
147 // populate hierarchy object
148 hierarchyData[result[2]] = result[3];
149 }
150
151 }
152 addHierarchyToStorage(metaName, hierarchyData);
153 setHierarchyEventsWrappers(metaName);
154 }
155 }
156
157}
158
159
160function setHierarchyHoverEvent(father,className)
161{
162
163 $(father).find(className).hover(function()
164 {
165 // console.log("HOVER ENTERED")
166 openHierarchyMenuLevel(this);
167 }, function() {
168 // console.log("HOVER EXITED")
169 closeHierarchyMenuLevel(this);
170 });
171
172}
173function createHierarchyMenuButton(row)
174{
175 //console.log(row)
176 //console.log(metaName)
177 //get current MetaDataName
178 var metaName = $(row.getElementsByClassName("metaTableCellName")[0]).text();
179
180 var hierarchyMenuName = 'Menu';
181 // Check if textarea already contain right menu key
182 var textAreaValue = $(row).find('TEXTAREA').val();
183
184 //Get current hierarchy from storages
185 var hierarchyData = hierarchyStorage[metaName];
186
187 if (hierarchyData[textAreaValue])
188 {
189 hierarchyMenuName = hierarchyData[textAreaValue];
190 }
191 //Menu element
192 var mainmenu = '<td class="metaDataHierarchyMenu" style="display: none;"><ul><li id="hierarchyLevel"><button class="hierarchyMenuButton" title="Menu">' + hierarchyMenuName + '</button></li></ul></td>'
193 //Insert hierarchy menu
194 $(row).find('.metaTableCellRemove').after(mainmenu);
195 //Set hover event on hierarchy menu
196 $(row).each(function(){setHierarchyHoverEvent($(this),".metaDataHierarchyMenu ul li")});
197 //Set menu name or SuggestionsMenu on change of textarea set menu name to appropriate menu item if exists
198 $(row).find('.metaTableCellArea').bind('input propertychange',function()
199 {
200 var input = $(this).val();
201 var row = this.parentElement.parentElement;
202 //RegExp to test a valid key in input
203 var KeyExp = /^[0-9]+(?:\.[0-9]+)*$/;
204 //RegExp to test a valid key start in input
205 var KeyStartExp = /^(?:[0-9]+(?:\.[0-9]+)*)?\.$/;
206 //if input valid and key found
207 if ( KeyExp.test(input) && hierarchyData[input])
208 {
209 removeSuggestionsMenu(row,hierarchyData[input]);
210 createSuggestionsMenu(row);
211 }
212 else if (KeyStartExp.test(input))
213 {
214 removeSuggestionsMenu(row,hierarchyMenuButton);
215 createSuggestionsMenu(row);
216 }
217 else {
218 removeSuggestionsMenu(row,hierarchyMenuButton);
219 }
220 });
221 //Show created menu
222 $(row).find('.metaDataHierarchyMenu').show();
223}
224
225function createSuggestionsMenu(row)
226{
227 //get current MetaDataName
228 var metaName = $(row.getElementsByClassName("metaTableCellName")[0]).text();
229 //Get current hierarchy from storages
230 var hierarchyData = hierarchyStorage[metaName];
231
232 var input = $(row.getElementsByClassName("metaTableCellArea")[0]).val();
233
234 //RegExp to get SuggestionsMenu
235 var SuggestionsMenuExp = new RegExp("^0*" + input.replace(/\./g, '\\.0*') + "\\.?[0-9]+$")
236 //Hierarchy suggestions menu
237 var SuggestionsMenu = "";
238 for(var key in hierarchyData)
239 {
240 var SuggestionsMenuItems = {};
241
242 if (SuggestionsMenuExp.test(key))
243 {
244 SuggestionsMenuItems[key]='<li class="hierarchySuggestionsMenu" id="'+key+'" ><button onclick="setHierarchyId(this)" >' + key.substring(String(input).length) + " " + hierarchyData[key] + '</button></li>';
245 }
246
247 for(var key in SuggestionsMenuItems)
248 {
249 //Fill menu with items
250 SuggestionsMenu += SuggestionsMenuItems[key];
251 }
252
253 }
254
255 //Append new SuggestionsMenu
256 $(row).find(".metaDataHierarchyMenu ul").append(SuggestionsMenu);
257 //Register event
258 $(row).each(function(){setHierarchyHoverEvent($(this),".hierarchySuggestionsMenu")});
259}
260function removeSuggestionsMenu(row,menuNewText)
261{
262 //Remove old SuggestionsMenu
263 $(row).find(".hierarchySuggestionsMenu").remove();
264 //Replace text on Hierarchy menu to default
265 $(row).find(".hierarchyMenuButton").text(menuNewText);
266}
267
268function setHierarchyEventsWrappers(metaName)
269{
270
271 //Loop through every metaTableCell
272 $(".metaTableCellName").each(function() {
273 //Check if it is a hierarchy row
274 //TODO implement real check
275 //if($(this).text()=="rubricator")
276 var currentMetaName = $(this).text();
277 //console.log(metaName)
278 //console.log(metaDataName)
279 if (currentMetaName in hierarchyStorage && currentMetaName == metaName)
280 {
281 //console.log('testXX')
282 var row = this.parentElement;
283 var textArea = row.getElementsByClassName("metaTableCellArea")[0];
284
285 //Mouse leave row
286 $(row).mouseleave(function() {
287 //textArea = this.getElementsByClassName("metaTableCellArea")[0];
288 if (this.getElementsByClassName("metaDataHierarchyMenu").length != 0 && document.activeElement.tagName != "TEXTAREA")
289 {
290 $(this).find('ul').stop(true, true);
291 //Remove hierarchy menu
292 $(this).find('.metaDataHierarchyMenu').hide();
293 }
294
295 });
296 // Mouse enter row
297 $(row).mouseenter(
298 function()
299 {
300 var row = this;
301 var table = row.parentElement;
302 //If focused on TEXTAREA do nothing
303 if (document.activeElement.tagName != "TEXTAREA")
304 {
305 //Hide all menus in table except this one
306 $(table).find('.metaDataHierarchyMenu').each(function() {
307 var currentRow = this.parentElement;
308 if (!$(currentRow).is($(row)) )
309 {
310 $(this).hide();
311 }
312 });
313
314 // createHierarchyMenuButton($(row));
315 if ( $(row).find('ul').length == 0 )
316 {
317 createHierarchyMenuButton(row);
318 createSuggestionsMenu(row);
319 }
320 else
321 {
322 //Unhide menu
323 $(row).find('.metaDataHierarchyMenu').show();
324 //Minimize nested menus
325 $(row).find('.metaDataHierarchyMenu ul').find('ul').hide();
326 }
327 }
328
329
330 }
331 );
332
333
334 // Textarea focus
335 $(textArea).focus(
336 function()
337 {
338 var row = this.parentElement.parentElement;
339 var table = row.parentElement;
340
341
342 //Hide all menus in table except this one
343 $(table).find('.metaDataHierarchyMenu').each(function() {
344 var currentRow = this.parentElement;
345 if (!$(currentRow).is($(row)) )
346 {
347 $(this).hide();
348 }
349 });
350 //Create button
351 if ( $(row).find('ul').length == 0 )
352 {
353 createHierarchyMenuButton(row);
354 createSuggestionsMenu(row);
355 }
356 else
357 {
358 //Unhide menu
359 $(row).find('.metaDataHierarchyMenu').show();
360 //Minimize nested menus
361 $(row).find('.metaDataHierarchyMenu ul').find('ul').slideUp();
362 }
363
364
365 }
366 );
367 $(textArea).focusout(
368 function()
369 {
370 var row = this.parentElement.parentElement;
371 //Test if there are open submenu
372 var found = $(row).find('.metaDataHierarchyMenu ul li ul').filter(":visible")[0];
373
374 //Hide hierarchy menu if there are no open submenus
375 if ( found === undefined)
376 {
377 //Hide menu
378 $(row).find('.metaDataHierarchyMenu').hide();
379 //console.log(this);
380 //console.log(row);
381 //console.log(found);
382 }
383
384
385 }
386 );
387 }
388 });
389}
390var hierarchyStorage = {};
391function addHierarchyToStorage(metaDataName,processedHierarchy)
392{
393 hierarchyStorage[metaDataName] = processedHierarchy;
394 //console.log( hierarchyStorage)
395 //console.log( metaDataName)
396
397}
398
Note: See TracBrowser for help on using the repository browser.