1 2 /** 3 * @fileOverview The file builds important widgets used in app. 4 * Following widqets are defined: 5 * <dl> 6 * <dt>notifyMessage</dt><dd>model and bulding of set of notifyMessages</dd> 7 * <dt>listWidget</dt><dd>the compact widget for creation list of elements, possible add, remove elements, addition through html - input 8 * possible to use autocomplete</dd> 9 * </dl> 10 * @author 11 * @version 12 */ 13 14 /** 15 * 16 * @constructor 17 */ 18 function NotifyMessage(dt, msg){ 19 this.dt = dt; 20 this.msg = msg; 21 }; 22 23 NotifyMessage.prototype.getText = function(){ 24 25 var month = this.dt.getMonth() + 1; 26 var day = this.dt.getDate(); 27 var year = this.dt.getFullYear(); 28 var h = this.dt.getHours(); 29 var m = this.dt.getMinutes(); 30 var s = this.dt.getSeconds(); 31 var m = year + "-" + month + "-" + day + " " + h + ":" + m + ":" + s + " :" + this.msg; 32 return m; 33 }; 34 35 36 NotifyMessage.prototype.render = function () { 37 var x = "<div id='" + this.listid + "' class='notify_wrapper ui-widget' >" + 38 //"<span class='notifymessage_id'>" + this.listid + "</span>: " + 39 "<span class='notifymessage'>" + this.getText() + "</span></div>"; 40 addToNotifylist(x); 41 42 this.container = $('#' + this.listid ); 43 $(this.container).find('.notifymessage').dblclick(function(){ 44 showNotifyMessages(); 45 }); 46 }; 47 var notify_container = $("#notifylist"); 48 49 /** 50 * Maintains the notify messages 51 * @constructor 52 */ 53 var notifyset = { notifymessages: [], 54 container: '#notifylist', 55 56 add: function (notifymessage){ 57 58 this.notifymessages[this.notifymessages.length] = notifymessage; 59 notifymessage.listid = "nm" + this.notifymessages.length; 60 notifymessage.render(); 61 }, 62 63 remove: function (mid) { 64 for (var i = 0; i < this.notifymessages.length; i++) { 65 if (this.notifymessages[i].listid == mid) { 66 this.notifymessages.splice(i, 1); 67 } 68 } 69 $('#' + mid).remove(); 70 } 71 }; 72 //////////////////////////////////////////////////////////////////////// 73 74 /** 75 * @field 76 * @memberOf ListWidget 77 */ 78 var collections_widget = null; 79 80 /** 81 * @field 82 * @memberOf ListWidget 83 */ 84 var columns_widget = null; 85 86 /** 87 * @field 88 * @memberOf ListWidget 89 */ 90 var active_widget = null; 91 92 /** 93 * A generic widget allowing manipulating lists 94 * @constructor 95 */ 96 function ListWidget(_parent_div, type) { 97 this.parent_div = $(_parent_div);//$('#columns-widget'); 98 this.listwidget_container = {}; 99 this.widgets = []; 100 this.lvid = ""; 101 this.type = type; 102 103 //this.query = undefined; 104 //this.init(); 105 106 }; 107 /* 108 ListWidget.prototype.getType = function(){ 109 if (this.type == "collections") { 110 return "cls"; 111 } 112 return "col"; 113 }; 114 */ 115 ListWidget.prototype.getTypePrefix = function(){ 116 var typeprefix = ""; 117 if (this.type == "columns") { 118 typeprefix = "col_"; 119 } 120 if (this.type == "collections") { 121 typeprefix = "cls_"; 122 } 123 typeprefix = typeprefix + this.lvid + "_"; 124 //var qid = $(this).closest('.query_wrapper').attr("id"); 125 return typeprefix;//"col_" + qid + "_"; 126 127 }; 128 129 ListWidget.prototype.add = function(list_item){ 130 this.widgets[this.widgets.length] = list_item; 131 list_item.parent_container = this.getListWidget(); 132 list_item.listid = this.getTypePrefix() + this.widgets.length; 133 list_item.render(); 134 }; 135 136 ListWidget.prototype.clear = function() { 137 $.each(this.widgets,function(i,list_item){ 138 $('#' + this.listid).remove(); 139 }); 140 this.widgets.splice(0, this.widgets.length); 141 }; 142 143 ListWidget.prototype.remove = function(id){ 144 for (var i = 0; i < this.widgets.length; i++) { 145 if (this.widgets[i].listid == id) { 146 //if (this.type == "collections"){ 147 // var n = this.widgets[i].index; 148 // //$('#collections').find("[href=" + n + "]"); 149 // $('#collections').find('.jstree-checked').each(function(){ 150 // var jstreename = $(this).find('a').attr("href").split('?')[1].split('&')[0].split('=')[1]; 151 // if (jstreename == n){ 152 // $(this).removeClass("jstree-checked").addClass("jstree-unchecked"); 153 // //$('#collections').plugins.checkbox.uncheck($(this)); 154 // } 155 // }); 156 //} 157 this.widgets.splice(i, 1); 158 159 } 160 } 161 $('#' + id).remove(); 162 }; 163 164 ListWidget.prototype.render = function () { 165 var x_save = ""; 166 var x_detail = ""; 167 var name = ""; 168 var x_input = ""; 169 170 //x_input = "<input type='text' class='input-widget autocomplete-input' />"; 171 if ($(this.parent_div).attr("id") == 'columns-widget') { 172 x_save = "<span class='cmd cmd_save' />"; 173 } 174 if ($(this.parent_div).attr("id") == 'collections-widget') { 175 x_save = "<span class='cmd cmd_detail' />"; 176 name = "Collections"; 177 } 178 var x = "<div id='"+ this.lvid + "' class='widget-wrapper ui-widget' >" + 179 "<div class='widget-header'>" + // ui-widget-header ui-state-default ui-corner-top'>" + 180 "<label>" + name + "</label>" + //"<span>" + name + "</span>" + 181 x_save + x_detail + "</div>" + 182 "<div class='widget-content'>" + x_input + 183 "<div class='index-context'><table></table></div><div class='list-widget'></div></div></div>"; 184 $(this.parent_div).append(x); 185 186 listwidget_container = $(this.parent_div).find('.list-widget');//$('#columns-list'); 187 188 $('#' + this.lvid + ' .cmd_del').live('click', function(event) { 189 //$(this.parent_div).find('.cmd_del').live('click', function(event) { 190 var colid = $(this).closest('.list-item').attr("id"); 191 var lvid = $(this).closest('.widget-wrapper').attr('id'); 192 var lv; 193 var sl; 194 //var q; 195 if (lvid.beginsWith("sl")){ 196 sl = selectionlistset.getselectionlist($(this).closest('.selectionlist-widget').attr("id")); 197 if (sl.autoSelected()){ 198 sl.select(0); 199 } 200 lv = sl.listwidget; 201 //q = $(this).closest('.detail-wrapper').find('.cmd_reload').data(); 202 } else { 203 lv = listwidgetset.getlistwidget(lvid); 204 } 205 lv.remove(colid); 206 //resubmit query 207 /* 208 if (lvid.beginsWith("sl")){ 209 q.query.updateColumns(sl); 210 q.query.resubmit(); 211 } 212 */ 213 /* 214 if ($(this).parent().parent().parent().attr('class') == 'query-columns'){ 215 var qid = $(this).closest('.query_wrapper').attr("id"); 216 var q = queryset.getQuery(qid); 217 q.columns_widget.remove(colid); 218 }else { 219 if ($(this).parent().parent().parent().attr('id') == "columns-widget"){ 220 columns_widget.remove(colid); 221 } else { 222 collections_widget.remove(colid); 223 } 224 */ 225 }); 226 227 228 var input = $(this.parent_div).find('.input-widget'); 229 230 input.focusin(function(){ 231 var colid = $(this).closest('.list-item').attr("id"); 232 var lvid = $(this).closest('.widget-wrapper').attr('id'); 233 var lv = listwidgetset.getlistwidget(lvid); 234 active_widget = lv; 235 /* if ($(this).parent().attr('class') == 'query-columns'){ 236 var qid = $(this).closest('.query_wrapper').attr("id"); 237 var q = queryset.getQuery(qid); 238 active_widget = q.columns_widget; 239 }else{ 240 active_widget = columns_widget; 241 } 242 */ 243 }); 244 input.bind('change', function(){ 245 246 }); 247 248 input.keydown(function(ev){ 249 var evStop = function(){ 250 ev.stopPropagation(); 251 ev.preventDefault(); 252 }; 253 if (ev.which === 13) { 254 var colid = $(this).closest('.list-item').attr("id"); 255 var lvid = $(this).closest('.widget-wrapper').attr('id'); 256 var lv = listwidgetset.getlistwidget(lvid); 257 lv.add(new ListItem($(this).val())); 258 /* if ($(this).parent().attr('class') == 'query-columns'){ 259 var qid = $(this).closest('.query_wrapper').attr("id"); 260 var q = queryset.getQuery(qid); 261 q.columns_widget.add(new ListItem($(this).val())); 262 }else{ 263 columns_widget.add(new ListItem($(this).val())); 264 } 265 evStop(); 266 */ 267 } 268 }); 269 270 if ($(this.parent_div).attr('id') == "collections-widget") { 271 $(input).hide(); 272 } 273 }; 274 275 ListWidget.prototype.getListWidget = function() { 276 return $(this.parent_div).find('.list-widget'); 277 }; 278 ListWidget.prototype.initAutocomplete = function(autocomplete_array) { 279 280 if (autocomplete_array.size == 0) return; 281 282 //autocomplete 283 function handleSelectionWidget(elem, widget){ 284 var input = $(widget.parent_div).find('.input-widget'); 285 var context = $(input).next('.index-context'); 286 287 // fill context 288 $(context).html(elements_hashtable[elem]); 289 $(context).show(); 290 $(input).blur(function(){ 291 $(context).hide(); 292 }); 293 $(input).focusin(function(){ 294 $(context).hide(); 295 }); 296 297 }; 298 299 //autocomplete 300 function findValueWidget(e) { 301 var sValue = e.selectValue; 302 handleSelectionWidget(sValue, active_widget); 303 } 304 305 function selectItemWidget(li) { 306 findValueWidget(li); 307 } 308 309 var ac = $(this.parent_div).find('.input-widget').autocompleteArray(autocomplete_array,{ 310 autoFill:true, 311 width:150, 312 onFindValue:findValueWidget, 313 onItemSelect:selectItemWidget 314 //extraParams: {oo, '75'} 315 }); 316 317 //ac.setExtraParams({aaa:3}); 318 319 }; 320 ListWidget.prototype.load = function(items) { 321 this.clear(); 322 323 if (items != undefined){ 324 if (this.type == "collections"){ 325 for(var i=0; i<items.length; ++i) { 326 this.add(new ListItem(items[i].name, items[i].index)); 327 } 328 } else 329 { 330 for(var i=0; i<items.length; ++i) { 331 if (items[i].length > 0){ 332 this.add(new ListItem(items[i])); 333 } 334 } 335 } 336 } 337 }; 338 339 ListWidget.prototype.getListText = function() { 340 var column_text = ""; 341 if (this.type == "collections"){ 342 $.each(this.widgets,function(i,column){ 343 column_text = column_text + "," + jQuery.trim(column.index); 344 }); 345 } else { 346 $.each(this.widgets,function(i,column){ 347 column_text = column_text + "," + jQuery.trim(column.name); 348 }); 349 } 350 351 352 if (column_text.length > 1) { 353 column_text = column_text.substring(1); 354 } 355 return column_text; 356 }; 357 358 359 360 361 function ListItem(_name, _index ) { 362 this.name = _name; 363 this.index = _index; 364 this.listid = ""; 365 this.parent_container = {}; 366 } 367 368 ListItem.prototype.render = function () { 369 370 var x_save = ""; 371 372 //if ($(this.parent_container).parent().attr("id") == 'columns-widget') { 373 // x_save = "<span class='cmd cmd_save' />"; 374 //} 375 376 var x = "<div id='" + this.listid + "'class='list-item'><span>" + this.name + "</span><span class='cmd cmd_del'> </span>" + x_save + "</div>"; 377 378 $(this.parent_container).prepend(x); 379 //$('#columns-list').prepend(x); 380 //addToColumnslist(x); 381 this.container = $('#' + this.listid ); 382 }; 383 384 /** 385 * FIXME: What is this for? 386 * @constructor 387 */ 388 389 var listwidgetset = { listwidgets: [], 390 container: '#listwidgetlist', 391 392 add: function (listwidget){ 393 394 this.listwidgets[this.listwidgets.length] = listwidget; 395 listwidget.lvid = "lv" + this.listwidgets.length; 396 listwidget.render(); 397 }, 398 399 remove: function (lvid) { 400 for (var i = 0; i < this.listwidgets.length; i++) { 401 if (this.listwidgets[i].listid == mid) { 402 this.listwidgets.splice(i, 1); 403 } 404 } 405 $('#' + lvid).remove(); 406 }, 407 getlistwidget: function(lvid) { 408 var listwidget; 409 $.each(this.listwidgets,function(){ 410 if (this.lvid == lvid) { 411 listwidget = this; 412 } 413 }); 414 return listwidget; 415 } 416 }; 417 //////////////////////////////////////////////////////////////////////// 418 419 420 ////// SELECTION LIST - COMBOBOX 421 /** 422 * Selection List implemented as Combobox 423 * @constructor 424 */ 425 426 function SelectionList(_parent_div) { 427 this.parent_div = $(_parent_div); 428 //this.container = ""; 429 430 //this.listwidget_container = {}; 431 this.items = []; 432 this.items[0] = new ListItem("<new>"); 433 this.items[1] = new ListItem("<auto>"); 434 this.autolist = []; 435 436 this.slid = ""; 437 438 this.listwidget = new ListWidget(); 439 //this.type = type; 440 441 }; 442 SelectionList.prototype.getSelect = function(){ 443 var select; 444 select = $(this.parent_div).find('select'); 445 return $(select); 446 }; 447 SelectionList.prototype.createSelect = function(){ 448 var items = this.items; 449 var slid = this.slid; 450 var $select = this.getSelect(); 451 $select.children().remove(); 452 453 $.each(this.items,function(i, item){ 454 items[i].lvid = slid + "_" + i; 455 $select.append(new Option(item.name, i)); 456 }); 457 458 $select.change(function(data){ 459 if ($(this).find("option").size() > 0) { 460 // find id of selected 461 var id = parseInt($select.find("option:selected").val()); 462 var slid = $(this).closest('.selectionlist-widget').attr("id"); 463 var sl = selectionlistset.getselectionlist(slid); 464 if (id < 2) { 465 if (id == 1){ 466 sl.listwidget.load(sl.autolist.split(',')); 467 }else{ 468 sl.listwidget.clear(); 469 } 470 $(this).closest('.selectionlist-select').find('.cmd_del').attr("disabled","disabled"); 471 $(this).closest('.selectionlist-select').find('.cmd_save').attr("disabled","disabled"); 472 } else { 473 sl.listwidget.load(jsonw["WorkspaceProfile"]["CustomTermsets"][id - 2]["Terms"]); 474 $(this).closest('.selectionlist-select').find('.cmd_del').removeAttr("disabled"); 475 $(this).closest('.selectionlist-select').find('.cmd_save').removeAttr("disabled"); 476 } 477 } 478 }); 479 }; 480 SelectionList.prototype.load = function(json){ 481 var items = this.items; 482 //var $select = this.getSelect(); 483 //$select.children().remove(); 484 485 //<auto>,<new> 486 //$select.append(new Option(this.items[0], 0)); 487 //$select.append(new Option(this.items[1], 1)); 488 if (json != "null") { 489 $.each(json, function(i,item) { 490 items[items.length] = new ListItem(item.name); 491 //$select.append(new Option(item.name, i+2)); 492 }); 493 } 494 /* 495 // find id of selected 496 if ($select.find("option").size() > 0) { 497 $select.find("option").first().attr("selected","true"); 498 var id = parseInt($select.find("option:selected").val()); 499 this.listwidget.load(json[id]["Terms"]); 500 } 501 */ 502 this.createSelect(); 503 }; 504 SelectionList.prototype.add = function(item){ 505 this.items[this.items.length] = item; 506 //list_item.parent_container = this.getListWidget(); 507 item.listid = this.slid + "_" + this.items.length; 508 this.getSelect().append(new Option(this.items[this.items.length-1].name, this.items.length-1)); 509 //list_item.render(); 510 }; 511 512 SelectionList.prototype.clear = function() { 513 if (this.items.length > 0){ 514 this.items.splice(i, this.items.length); 515 } 516 this.listwidget.clear(); 517 }; 518 519 SelectionList.prototype.remove = function(id){ 520 this.items.splice(id, 1); 521 var select = $(this.parent_div).find('.selectionlist-select').children('select'); 522 $($(select).find('option')[id]).remove(); 523 $(select).find('option').each(function(i, item){ 524 $(this).val(i); 525 }); 526 }; 527 SelectionList.prototype.autoSelected = function(){ 528 if (this.getSelected() == 1){ 529 return true; 530 } 531 return false; 532 }; 533 SelectionList.prototype.getSelected = function(){ 534 return $(this.getSelect()).find('option:selected').val(); 535 }; 536 SelectionList.prototype.select = function(id){ 537 $(this.getSelect().find('option')[id]).attr("selected","selected");//get(id).selectedIndex = id; 538 //var sl = this;//selectionlistset.getselectionlist(this.slid); 539 if (id > 1){ 540 this.listwidget.load(jsonw["WorkspaceProfile"]["CustomTermsets"][id - 2]["Terms"]); 541 } else { 542 if (id == 1){ 543 this.listwidget.load(this.autolist.split(',') ); 544 } 545 } 546 }; 547 SelectionList.prototype.render = function () { 548 var x = "<div id='"+ this.slid +"' class='widget-wrapper ui-widget selectionlist-widget' >" + 549 "<div class='widget-content'><div class='selectionlist-select'><select></select>"+ 550 "<span class='cmd cmd_save' /><span class='cmd cmd_saveas' /><span class='cmd cmd_del' /></div>"+ 551 "<div><input type='text' class='saveas-input' /></div>"+ 552 "<div class='selectionlist-listwidget'></div></div>"; 553 $(this.parent_div).append(x); 554 555 $(this.parent_div).find('.selectionlist-select').find('.cmd_save').click(function(){ 556 var select = $(this).closest('.selectionlist-select').children('select'); 557 var id = parseInt($(select).find("option:selected").val()); 558 if (id < 2) {return;} 559 var name = $(select).find("option:selected").text(); 560 561 var slid = $(this).closest('.widget-wrapper').attr("id"); 562 var selectionlist = selectionlistset.getselectionlist(slid); 563 564 saveTermset(id - 2, name, selectionlist.listwidget); 565 }); 566 $(this.parent_div).find('.selectionlist-select').find('.cmd_saveas').click(function(){ 567 var saveas = $(this).closest('.selectionlist-widget').find('.saveas-input'); 568 $(saveas).show(); 569 $(saveas).focus(); 570 571 /* 572 var name = $(this).closest('.selectionlist-select').find('.saveas-input').text(); 573 var slid = $(this).closest('widget-wrapper').attr("id"); 574 var selectionlist = selectionlistset.getselectionlist(slid); 575 576 selectionlist.add(name); 577 */ 578 }); 579 $(this.parent_div).find('.selectionlist-select').find('.cmd_del').click(function(){ 580 //find selected 581 var select = $(this).closest('.selectionlist-select').children('select'); 582 var id = parseInt($(select).find("option:selected").val()); 583 if (id < 2) {return;} 584 585 var slid = $(this).closest('.selectionlist-widget').attr("id"); 586 var selectionlist = selectionlistset.getselectionlist(slid); 587 588 removeTermset(id -2); 589 590 selectionlist.remove(id); 591 if (id > 0 ){ 592 id = id - 1; 593 } 594 selectionlist.select(id); 595 596 }); 597 598 $(this.parent_div).find('.saveas-input').focusout(function(){ 599 $(this).attr("value",""); 600 $(this).hide(); 601 }); 602 $(this.parent_div).find('.saveas-input').keydown(function(ev){ 603 var evStop = function(){ ev.stopPropagation(); ev.preventDefault(); }; 604 if (ev.which === 23) { 605 $(this).attr("value",""); 606 $(this).hide(); 607 evStop(); 608 } 609 var evSaveAs = function(name, select, slid){ 610 ev.preventDefault(); 611 612 //var slid = $(this).closest('.widget-wrapper').attr("id"); 613 var selectionlist = selectionlistset.getselectionlist(slid); 614 615 saveTermset(-1, name, selectionlist.listwidget); 616 selectionlist.add(new ListItem(name)); 617 selectionlist.select($(select).children().length-1); 618 }; 619 if ($(this).attr("value").length > 0 && ev.which === 13) evSaveAs($(this).attr("value"), 620 $(this).closest('.selectionlist-widget').find('select'), 621 $(this).closest('.widget-wrapper').attr("id")); 622 }); 623 624 $(this.parent_div).find('.saveas-input').hide(); 625 $(this.parent_div).find('.selectionlist-select').find('.cmd_del').attr("disabled","disabled"); 626 $(this.parent_div).find('.selectionlist-select').find('.cmd_save').attr("disabled","disabled"); 627 this.listwidget = new ListWidget( $(this.parent_div).find('.selectionlist-listwidget')); 628 this.listwidget.lvid = this.slid + "_lv"; 629 this.listwidget.render(); 630 631 //$(this.parent_div).find 632 }; 633 634 /* 635 SelectionList.prototype.load = function(items) { 636 this.clear(); 637 638 for(var i=0; i<items.length; ++i) { 639 this.add(new ListItem(items[i])); 640 } 641 }; 642 */ 643 644 /** 645 * FIXME: What is this for? 646 * @constructor 647 */ 648 var selectionlistset = { selectionlists: [], 649 650 add: function (selectionlist){ 651 652 this.selectionlists[this.selectionlists.length] = selectionlist; 653 selectionlist.slid = "sl" + this.selectionlists.length; 654 selectionlist.render(); 655 }, 656 657 remove: function (slid) { 658 for (var i = 0; i < this.selectionlists.length; i++) { 659 if (this.selectionlists[i].slid == slid) { 660 this.selectionlists.splice(i, 1); 661 } 662 } 663 $('#' + slid).remove(); 664 }, 665 getselectionlist: function(slid) { 666 var selectionlist; 667 $.each(this.selectionlists,function(){ 668 if (this.slid == slid) { 669 selectionlist = this; 670 } 671 }); 672 return selectionlist; 673 } 674 }; 675