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

Last change on this file since 31023 was 31023, checked in by Georgiy Litvinov, 7 years ago

More modifications to hierarchy webeditor
File size: 12.6 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 metaValue = a.getAttribute("metavalue");
15 var metaTitle = a.getAttribute("metatitle");
16
17// If ID defined and not null
18 if (metaValue && (metaValue != null))
19 {
20 //find TR Ancestor to get TEXTAREA
21 var tr = findAncestorByTagName(a,"TR");
22 //Set value to id of clicked element
23 $(tr.getElementsByTagName("TEXTAREA")).val(metaValue);
24 // Set button name
25 removeSuggestionsMenu(tr, metaTitle);
26 //Hide menu after click
27 $(tr).find(".metaDataHierarchyMenu").find("ul li ul li").hide();
28 //If we left TEXTAREA, hide all menus
29 //if (document.activeElement.tagName != "TEXTAREA")
30 //{
31 // $(tr).find(".metaDataHierarchyMenu").hide();
32 //}
33 tr.getElementsByTagName("TEXTAREA")[0].focus();
34
35 createSuggestionsMenu(tr);
36
37 }
38}
39function openHierarchyMenuLevel(menuItem)
40{
41 //console.log(menuItem);
42
43 var tr = findAncestorByTagName(menuItem,"TR");
44 //get current MetaDataName
45 var metaName = $(tr.getElementsByClassName("metaTableCellName")[0]).text();
46 //Get current hierarchy from storages
47 var hierarchyData = hierarchyStorage[metaName];
48 menuItem = $(menuItem);
49 if (menuItem.find('ul').length == 0)
50 {
51 //Expression to extract hierarchy identifier from menu item id
52 var getIdExp = /[0-9.]+/;
53 //Extracted hierarchy identifier
54 var id;
55 //Expression to get childs
56 var childExpr;
57 if (menuItem.attr('id'))
58 {
59 id = menuItem.attr('id').match(getIdExp);
60 }
61 //console.log("ID " + id);
62 //id.match(getIdExp);
63 if (id == null)
64 {
65 childExpr = /^[0-9]+$/;
66 }
67 else
68 {
69 childExpr = new RegExp("^" + id + "." + "[0-9]+$");
70 }
71 var levelItems = {};
72 for(var key in hierarchyData)
73 {
74 if(childExpr.test(key)){
75 levelItems[key]='<li id="'+key+'" ><button onclick="setHierarchyId(this)" metavalue='+ hierarchyData[key][0] +' metatitle='+ hierarchyData[key][1] +'>' + hierarchyData[key][1] + '</button></li>';
76 //console.log(levelItems[key]);
77
78 }
79 }
80 //If no elements in hierarchy level
81 if (jQuery.isEmptyObject(levelItems))
82 {
83 //add empty menu. Invisible. Used by checks in setHierarchyEventsWrappers focusout to prevent menu hiding while choosing suggestion menu item leaf
84 menuItem.append("<ul></ul>");
85
86 // console.log("no elements in hierarchy level");
87 }
88 else {
89 //wrap elements in hierarchy level
90 var levelMenu = '<ul>';
91 for(var key in levelItems)
92 {
93 //Fill menu with items
94 levelMenu += levelItems[key];
95 }
96 levelMenu += "</ul>";
97 menuItem.append(levelMenu);
98 menuItem.find("li").hover(
99 function(){openHierarchyMenuLevel(this);}
100 ,
101 function(){closeHierarchyMenuLevel(this);}
102 );
103
104 //menuItem.find('ul');
105 menuItem.children('ul').slideDown();
106
107
108 //console.log("debug line 5");
109 }
110
111 } else {
112 //stop animation
113 menuItem.find('ul').stop(true, true);
114 //show menu items
115 menuItem.children('ul').children('li').show();
116 //slide down menu
117 menuItem.children('ul').slideDown();
118 }
119 menuItem.addClass("active");
120}
121function closeHierarchyMenuLevel(menuItem)
122{
123 $(menuItem).removeClass("active");
124 $(menuItem).find('ul').hide();
125}
126// Download hierarchy file and process it
127function downloadAndProcessHierarchyFile(hierarchyFileName,metaName)
128{
129
130 var xmlhttp=new XMLHttpRequest();
131 xmlhttp.open("GET",hierarchyFileName,true);
132 xmlhttp.send();
133 xmlhttp.onreadystatechange=function()
134 {
135 if (xmlhttp.readyState==4 && xmlhttp.status==200)
136 {
137 var hierarchyFile = xmlhttp.responseText;
138 var StringData = [];
139 var hierarchyData = {};
140 //var expr = /^([0-9]+(?:\.[0-9]+)*)\ ([0-9]+(?:\.[0-9]+)*)\ (.*)/m;
141 var expr = /^(\S*|\"[^\"]*\")\ +([0-9]+(?:\.[0-9]+)*)\ +(.*)/m;
142 StringData = hierarchyFile.split('\n');
143 for (var i = 0; i < StringData.length; i++)
144 {
145 var result = StringData[i].match(expr);
146 // If result not null
147 if (result != null && result.length == 4)
148 {
149 // populate hierarchy object
150 hierarchyData[result[2]] = [result[1], result[3]];
151 }
152
153 }
154 addHierarchyToStorage(metaName, hierarchyData);
155 setHierarchyEventsWrappers(metaName);
156 }
157 }
158
159}
160
161
162function setHierarchyHoverEvent(father,className)
163{
164
165 $(father).find(className).hover(function()
166 {
167 openHierarchyMenuLevel(this);
168 }, function() {
169 closeHierarchyMenuLevel(this);
170 });
171
172}
173function createHierarchyMenuButton(row)
174{
175 //get current MetaDataName
176 var metaName = $(row.getElementsByClassName("metaTableCellName")[0]).text();
177
178 var hierarchyMenuName = 'Menu';
179 // Check if textarea already contain right menu key
180 var textAreaValue = $(row).find('TEXTAREA').val();
181
182 //Get current hierarchy from storages
183 var hierarchyData = hierarchyStorage[metaName];
184
185 if (hierarchyData[textAreaValue] && (hierarchyData[textAreaValue] != null))
186 {
187 hierarchyMenuName = hierarchyData[textAreaValue][1];
188
189 }
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 metavalue='+ hierarchyData[key][0] +' metatitle='+ hierarchyData[key][1] +' onclick="setHierarchyId(this)" >' + key.substring(String(input).length) + " " + hierarchyData[key][1] + '</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.