js/CXGN/List.js

   1
   2 /*
   3
   4 =head1 NAME
   5
   6 CXGN.List - a javascript library to implement the lists on the SGN platform
   7
   8 =head1 DESCRIPTION
   9
  10 There are two important list functions in this library, listed below. All other functions should be considered private and/or deprecated.
  11
  12
  13 * addToListMenu(listMenuDiv, dataDiv)
  14
  15 this function will generate a select of all available lists and allow the content to be added to a list (from a search, etc). The first parameter is the id of the div tag where the menu should be drawn. The second parameter is the div that contains the data to be added. This can be a textfield, a div or span tag, or a multiple select tag.
  16
  17 * pasteListMenu(divName, menuDiv)
  18
  19 this will generate an html select box of all the lists, and a "paste" button, to paste into a textarea (typically). The divName is the id of the textarea, the menuDiv is the id where the paste menu should be placed.
  20
  21 =head1 AUTHOR
  22
  23 Lukas Mueller <lam87@cornell.edu>
  24
  25 =cut
  26
  27 */
  28
  29
  30 JSAN.use('jqueryui');
  31
  32 if (!CXGN) CXGN = function () { };
  33
  34 CXGN.List = function () {
  35     this.list = [];
  36 };
  37
  38 CXGN.List.prototype = {
  39
  40     // Return the data as a straight list
  41     //
  42     getList: function(list_id) {
  43
  44         var list;
  45
  46         jQuery.ajax( {
  47             url: '/list/contents/'+list_id,
  48             async: false,
  49             success: function(response) {
  50                 if (response.error) {
  51                     alert(response.error);
  52                 }
  53                 else {
  54                     list = response.list;
  55                 }
  56             }
  57         });
  58         return list;
  59
  60     },
  61
  62
  63     // this function also returns some metadata about
  64     // list, namely its type.
  65     //
  66     getListData: function(list_id) {
  67         var list;
  68
  69         jQuery.ajax( {
  70             url: '/list/data',
  71             async: false,
  72             data: { 'list_id': list_id },
  73             success: function(response) {
  74                 if (response.error) {
  75                     alert(response.error);
  76                 }
  77                 else {
  78                     list = response;
  79                 }
  80             }
  81         });
  82
  83         return list;
  84     },
  85
  86     getListType: function(list_id) {
  87         var type;
  88
  89         jQuery.ajax( {
  90             url: '/list/type/'+list_id,
  91             async: false,
  92             success: function(response) {
  93                 if (response.error) {
  94                     alert(response.error);
  95                 }
  96                 else {
  97                     type = response;
  98                 }
  99             },
 100             error: alert('An error occurred.')
 101         });
 102         return type;
 103     },
 104
 105     setListType: function(list_id, type) {
 106
 107         jQuery.ajax( {
 108             url: '/list/type/'+list_id+'/'+type,
 109             async: false,
 110             success: function(response) {
 111                 if (response.error) {
 112                     alert(response.error);
 113                 }
 114                 else {
 115                     alert('Type of list '+list_id+' set to '+type);
 116                 }
 117             }
 118         });
 119     },
 120
 121
 122     allListTypes: function() {
 123         var types;
 124         jQuery.ajax( {
 125             url: '/list/alltypes',
 126             async: false,
 127             success: function(response) {
 128                 if (response.error) {
 129                     alert(response.error);
 130                 }
 131                 else {
 132                     types = response;
 133                 }
 134             }
 135         });
 136         return types;
 137
 138     },
 139
 140
 141     typesHtmlSelect: function(list_id, html_select_id, selected) {
 142         var types = this.allListTypes();
 143         var html = '<select id="'+html_select_id+'" onchange="javascript:changeListType(\''+html_select_id+'\', '+list_id+');" >';
 144         html += '<option name="null">(none)</option>';
 145         for (var i=0; i<types.length; i++) {
 146             var selected_html = '';
 147             if (types[i][1] == selected) {
 148                 //alert("Match: "+types[i][0]);
 149                 selected_html = ' selected="selected" ';
 150             }
 151             html += '<option name="'+types[i][1]+'"'+selected_html+'>'+types[i][1]+'</option>';
 152         }
 153         html += '</select>';
 154         //alert(html);
 155         return html;
 156     },
 157
 158     newList: function(name) {
 159         var oldListId = this.existsList(name);
 160         var newListId = 0;
 161
 162         if (name == '') {
 163             alert('Please enter a name for the new list.');
 164             return 0;
 165         }
 166
 167         if (oldListId === null) {
 168             jQuery.ajax( {
 169                 url: '/list/new',
 170                 async: false,
 171                 data: { 'name': name },
 172                 success: function(response) {
 173                     if (response.error) {
 174                         alert(response.error);
 175                     }
 176                     else {
 177                         newListId=response.list_id;
 178                     }
 179                 }
 180             });
 181             return newListId;
 182         }
 183         else {
 184             alert('A list with name "'+ name + '" already exists. Please choose another list name.');
 185             return 0;
 186         }
 187         alert("an error occurred");
 188         return 0;
 189     },
 190
 191     availableLists: function() {
 192         var lists = [];
 193         jQuery.ajax( {
 194             url: '/list/available',
 195             async: false,
 196             success: function(response) {
 197                 if (response.error) {
 198                     alert(response.error);
 199                 }
 200                 lists = response;
 201             }
 202         });
 203         return lists;
 204     },
 205
 206     //return the newly created list_item_id or 0 if nothing was added
 207     //(due to duplicates)
 208     addItem: function(list_id, item) {
 209         var exists_item_id = this.existsItem(list_id,item);
 210         if (exists_item_id ===0 ) {
 211             jQuery.ajax( {
 212                 async: false,
 213                 url: '/list/item/add',
 214                 data:  { 'list_id': list_id, 'element': item }
 215             });
 216             var new_list_item_id = this.existsItem(list_id,item);
 217             return new_list_item_id;
 218         }
 219         else { return 0; }
 220     },
 221
 222
 223     removeItem: function(list_id, item_id) {
 224         jQuery.ajax( {
 225             async: false,
 226             url: '/list/item/remove',
 227             data: { 'list_id': list_id, 'item_id': item_id }
 228         });
 229     },
 230
 231
 232     deleteList: function(list_id) {
 233         jQuery.ajax( {
 234             url: '/list/delete',
 235             async: false,
 236             data: { 'list_id': list_id }
 237         });
 238     },
 239
 240     renderLists: function(div) {
 241         var lists = this.availableLists();
 242         var html = '';
 243         html = html + '<input id="add_list_input" type="text" /><input id="add_list_button" type="button" value="new list" /><br />';
 244
 245         if (lists.length===0) {
 246             html = html + "None";
 247             jQuery('#'+div).html(html);
 248         }
 249
 250         html += '<table border="0" title="Available lists">';
 251         html += '<tr><td><i>list name</i></td><td><i>#</i></td><td><i>type</i></td><td colspan="3"><i>actions</i></td></tr>\n';
 252         for (var i = 0; i < lists.length; i++) {
 253             html = html + '<tr><td><b>'+lists[i][1]+'</b></td><td>'+lists[i][3]+'</td><td>'+lists[i][5]+'</td><td><a href="javascript:showListItems(\'list_item_dialog\','+lists[i][0]+')">view</a></td><td>|</td><td><a href="javascript:deleteList('+lists[i][0]+')">delete</a></td><td>|</td><td><a href="/list/download?list_id='+lists[i][0]+'">download</a></td></tr>\n';
 254
 255             //var items = this.getList(lists[i][0]);
 256
 257
 258
 259
 260         }
 261         html = html + '</table>';
 262         jQuery('#'+div).html(html);
 263
 264         jQuery('#add_list_button').click(
 265             function() {
 266                 var lo = new CXGN.List();
 267
 268                 var name = jQuery('#add_list_input').val();
 269
 270                 lo.newList(name);
 271                 lo.renderLists(div);
 272             });
 273
 274
 275
 276     },
 277
 278     listNameById: function(list_id) {
 279         lists = this.availableLists();
 280         for (var n=0; n<lists.length; n++) {
 281             if (lists[n][0] == list_id) { return lists[n][1]; }
 282         }
 283     },
 284
 285     renderItems: function(div, list_id) {
 286         var list_data = this.getListData(list_id);
 287         var items = list_data.elements;
 288         var list_type = list_data.type_name;
 289         var list_name = this.listNameById(list_id);
 290
 291         var html = 'List name <b>'+list_name+'</b><br />Type '+this.typesHtmlSelect(list_id, 'type_select', list_type)+'   <input type="button" value="validate" onclick="javascript:validateList('+list_id+',\'type_select\')"  /><br />';
 292
 293         html += 'New elements: <br /><textarea id="dialog_add_list_item" ></textarea><input id="dialog_add_list_item_button" type="submit" value="Add" /><br />';
 294
 295         html += '<b>List elements:</b><br />';
 296
 297         for(var n=0; n<items.length; n++) {
 298             html = html + items[n][1] + '   <input id="'+items[n][0]+'" type="button" value="remove" /><br />';
 299
 300         }
 301
 302         jQuery('#'+div).html(html);
 303
 304
 305         for (var n=0; n<items.length; n++) {
 306             var list_item_id = items[n][0];
 307
 308             jQuery('#'+items[n][0]).click(
 309                 function() {
 310                     var lo = new CXGN.List();
 311                     var i = lo.availableLists();
 312
 313                     lo.removeItem(list_id, this.id );
 314                     lo.renderItems(div, list_id);
 315                     lo.renderLists('list_dialog');
 316                 });
 317         }
 318
 319         jQuery('#dialog_add_list_item_button').click(
 320             function() {
 321                 addMultipleItemsToList('dialog_add_list_item', list_id);
 322                 var lo = new CXGN.List();
 323                 lo.renderItems(div, list_id);
 324             }
 325         );
 326     },
 327
 328     existsList: function(name) {
 329         var list_id = 0;
 330         jQuery.ajax( {
 331             url: '/list/exists',
 332             async: false,
 333             data: { 'name': name },
 334             success: function(response) {
 335                 list_id = response.list_id;
 336             }
 337         });
 338         return list_id;
 339     },
 340
 341     existsItem: function(list_id, name) {
 342         var list_item_id =0;
 343         jQuery.ajax( {
 344             url: '/list/exists_item',
 345             async: false,
 346             data: { 'list_id' : list_id, 'name':name },
 347             success: function(response) {
 348                 list_item_id = response.list_item_id;
 349             }
 350         });
 351         return list_item_id;
 352     },
 353
 354     addToList: function(list_id, text) {
 355         var list = text.split("\n");
 356         var duplicates = [];
 357         for(var n=0; n<list.length; n++) {
 358             var id = this.addItem(list_id, list[n]);
 359             if (id == 0) {
 360                 duplicates.push(list[n]);
 361             }
 362         }
 363
 364         if (duplicates.length > 0) {
 365             alert('Duplicate items ('+ duplicates.join(",") + ') were not stored');
 366         }
 367         return list.length - duplicates.length;
 368     },
 369
 370     listSelect: function(div_name) {
 371         var lists = this.availableLists();
 372         var html = '<select id="'+div_name+'_list_select">';
 373         for (var n=0; n<lists.length; n++) {
 374             html = html + '<option value='+lists[n][0]+'>'+lists[n][1]+'</option>';
 375         }
 376         html = html + '</select>';
 377         return html;
 378     },
 379
 380     validate: function(list_id, type) {
 381         var missing = new Array();
 382         var error = 0;
 383         jQuery.ajax( {
 384             url: '/list/validate/'+list_id+'/'+type,
 385             async: false,
 386             success: function(response) {
 387                 if (response.error) {
 388                     alert(response.error);
 389                 }
 390                 else {
 391                     missing = response.missing;
 392                 }
 393             },
 394             error: function(response) { alert("An error occurred while validating the list "+list_id); error=1; }
 395         });
 396
 397         if (error ===1 ) { return; }
 398
 399         //alert("MISSING: "+missing.join(","));
 400
 401         if (missing.length==0) {
 402             alert("This list passed validation.");
 403         }
 404         else {
 405             alert("List validation failed. Elements not found: "+ missing.join(","));
 406         }
 407     }
 408
 409
 410 };
 411
 412 function setUpLists() {
 413     jQuery('#list_dialog').dialog( {
 414         height: 300,
 415         width: 500,
 416         autoOpen: false,
 417         title: 'Available lists',
 418         buttons: { "Done" :  function() {
 419             jQuery('#list_dialog').dialog("close"); }
 420                  },
 421         modal: true
 422     });
 423
 424     jQuery('#list_item_dialog').dialog( {
 425         height: 300,
 426         width: 300,
 427         autoOpen: false,
 428         buttons: {
 429                 "Done": function() {
 430                     jQuery('#list_item_dialog').dialog("close"); }
 431         },
 432         modal: true,
 433       title: 'List contents'
 434     });
 435
 436     jQuery('#lists_link').click(
 437         function() { show_lists(); }
 438     );
 439 }
 440
 441
 442 function show_lists() {
 443     jQuery('#list_dialog').dialog("open");
 444
 445     var l = new CXGN.List();
 446     l.renderLists('list_dialog');
 447 }
 448
 449
 450 function pasteListMenu (div_name, menu_div, button_name) {
 451     var lo = new CXGN.List();
 452
 453     var html='';
 454
 455     if (button_name === undefined) {
 456         button_name = 'paste';
 457     }
 458     if (jQuery.cookie("sgn_session_id")) {
 459         html = lo.listSelect(div_name);
 460         html = html + '<input type="button" value="'+button_name+'" onclick="javascript:pasteList(\''+div_name+'\')" /><br />';
 461     }
 462     else {
 463         html = html + 'please log in for lists';
 464     }
 465     jQuery('#'+menu_div).html(html);
 466 }
 467
 468 function pasteList(div_name) {
 469     var lo = new CXGN.List();
 470     var list_name = jQuery('#'+div_name+'_list_select').val();
 471     var list_content = lo.getList(list_name);
 472
 473     // textify list
 474     var list_text = '';
 475     for (var n=0; n<list_content.length; n++) {
 476         list_text = list_text + list_content[n][1]+"\r\n";
 477     }
 478     jQuery('#'+div_name).text(list_text);
 479 }
 480
 481 function addToListMenu(listMenuDiv, dataDiv) {
 482     var lo = new CXGN.List();
 483
 484     var html;
 485
 486     html = '<input type="text" id="'+dataDiv+'_new_list_name" size="8" /><input id="'+dataDiv+'_add_to_new_list" type="button" value="add to new list" /><br />';
 487     html += lo.listSelect(dataDiv);
 488
 489     html += '<input id="'+dataDiv+'_button" type="button" value="add to list" />';
 490
 491     jQuery('#'+listMenuDiv).html(html);
 492
 493     var list_id = 0;
 494
 495     jQuery('#'+dataDiv+'_add_to_new_list').click(
 496         function() {
 497             var lo = new CXGN.List();
 498             var new_name = jQuery('#'+dataDiv+'_new_list_name').val();
 499
 500             var data = getData(dataDiv);
 501             list_id = lo.newList(new_name);
 502             if (list_id > 0) {
 503                 var elementsAdded = lo.addToList(list_id, data);
 504                 alert("Added "+elementsAdded+" list elements to list "+new_name);
 505             }
 506         }
 507     );
 508
 509     jQuery('#'+dataDiv+'_button').click(
 510         function() {
 511             var data = getData(dataDiv);
 512             list_id = jQuery('#'+dataDiv+'_list_select').val();
 513             var elementsAdded = lo.addToList(list_id, data);
 514             alert("Added "+elementsAdded+" list elements.");
 515         }
 516     );
 517 }
 518
 519 function getData(id) {
 520     var divType = jQuery("#"+id).get(0).tagName;
 521
 522     if (divType == 'DIV' || divType =='SPAN' ||  divType === undefined) {
 523         data = jQuery('#'+id).html();
 524     }
 525     if (divType == 'SELECT') {
 526         data = jQuery('#'+id).val().join("\n");
 527     }
 528     if (divType == 'TEXTAREA') {
 529         data = jQuery('textarea#'+id).val();
 530     }
 531     return data;
 532 }
 533
 534 function addTextToListMenu(div) {
 535     var lo = new CXGN.List();
 536     var html = lo.listSelect(div);
 537     html = html + '<input id="'+div+'_button" type="button" value="add to list" />';
 538
 539     document.write(html);
 540
 541     jQuery('#'+div+'_button').click(
 542         function() {
 543             var text = jQuery('textarea#div').val();
 544             var list_id = jQuery('#'+div+'_list_select').val();
 545             lo.addToList(list_id, text);
 546             lo.renderLists('list_dialog');
 547         }
 548     );
 549 }
 550
 551 function addSelectToListMenu(div) {
 552     var lo = new CXGN.List();
 553     var html = lo.listSelect(div);
 554     html = html + '<input id="'+div+'_button" type="button" value="add to list" />';
 555
 556     document.write(html);
 557
 558     jQuery('#'+div+'_button').click(
 559         function() {
 560             var selected_items = jQuery('#'+div).val();
 561             var list_id = jQuery('#'+div+'_list_select').val();
 562             addArrayToList(selected_items, list_id);
 563             lo.renderLists('list_dialog');
 564         }
 565     );
 566 }
 567
 568
 569 // add the text in a div to a list
 570 function addDivToList(div_name) {
 571     var list_id = jQuery('#'+div_name+'_list_select').val();
 572     var lo = new CXGN.List();
 573     var list = jQuery('#'+div_name).val();
 574     var items = list.split("\n");
 575
 576     for(var n=0; n<items.length; n++) {
 577         var added = lo.addItem(list_id, items[n]);
 578         if (added > 0) { }
 579     }
 580 }
 581
 582 function addTextToList(div, list_id) {
 583     var lo = new CXGN.List();
 584     var item = jQuery('#'+div).val();
 585     var id = lo.addItem(list_id, item);
 586     if (id == 0) {
 587         alert('Item "'+item+'" was not added because it already exists');
 588     }
 589     lo.renderLists('list_dialog');
 590 }
 591
 592 function addMultipleItemsToList(div, list_id) {
 593     var lo = new CXGN.List();
 594     var content = jQuery('#'+div).val();
 595     if (content == '') {
 596         alert("No items - Please enter items to add to the list.");
 597 return;
 598     }
 599     var items = content.split("\n");
 600
 601     var duplicates = new Array();
 602     for (var n=0; n<items.length; n++) {
 603         var id = lo.addItem(list_id, items[n]);
 604         if (id == 0) {
 605             duplicates.push(items[n]);
 606         }
 607     }
 608     if (duplicates.length >0) {
 609         alert("The following items were not added because they are already in the list: "+ duplicates.join(", "));
 610     }
 611 lo.renderLists('list_dialog');
 612 }
 613
 614 function addArrayToList(items, list_id) {
 615 var lo = new CXGN.List();
 616    var duplicates = new Array();
 617     for (var n=0; n<items.length; n++) {
 618         var id = lo.addItem(list_id, items[n]);
 619         if (id == 0) {
 620             duplicates.push(items[n]);
 621         }
 622     }
 623     if (duplicates.length >0) {
 624         alert("The following items were not added because they are already in the list: "+ duplicates.join(", "));
 625     }
 626 }
 627
 628 function deleteList(list_id) {
 629     var lo = new CXGN.List();
 630     var list_name = lo.listNameById(list_id);
 631     if (confirm('Delete list "'+list_name+'"? (ID='+list_id+'). This cannot be undone.')) {
 632         lo.deleteList(list_id);
 633         lo.renderLists('list_dialog');
 634         alert('Deleted list '+list_name);
 635     }
 636 }
 637
 638 function deleteItemLink(list_item_id) {
 639     var lo = new CXGN.List();
 640     lo.deleteItem(list_item_id);
 641     lo.renderLists('list_dialog');
 642 }
 643
 644 function showListItems(div, list_id) {
 645     var l = new CXGN.List();
 646     jQuery('#'+div).dialog("open");
 647     l.renderItems('list_item_dialog', list_id);
 648 }
 649
 650 function addNewList(div_id) {
 651     var lo = new CXGN.List();
 652     var name = jQuery('#'+div_id).val();
 653
 654     if (name == '') {
 655         alert("Please specify a name for the list.");
 656         return;
 657     }
 658
 659     var list_id = lo.existsList(name);
 660     if (list_id > 0) {
 661         alert('The list '+name+' already exists. Please choose another name.');
 662         return;
 663     }
 664     lo.newList(name);
 665     lo.renderLists('list_item_dialog');
 666 }
 667
 668 function changeListType(html_select_id, list_id) {
 669     //alert("HTML SELECT ID: "+html_select_id+" LIST_ID "+list_id);
 670     var type = jQuery('#'+html_select_id).val();
 671     var l = new CXGN.List();
 672
 673     //alert("setting list "+list_id+" to type "+type);
 674     l.setListType(list_id, type);
 675     l.renderLists('list_dialog');
 676 }
 677
 678 function validateList(list_id, html_select_id) {
 679     var lo = new CXGN.List();
 680     var type = jQuery('#'+html_select_id).val();
 681     lo.validate(list_id, type);
 682 }