js/server_synchronize.js

   1 /* vim: set expandtab sw=4 ts=4 sts=4: */
   2 /**
   3  * for server_synchronize.php
   4  *
   5  */
   6
   7 // Global variable row_class is set to even
   8 var row_class = 'even';
   9
  10 /**
  11 * Generates a row dynamically in the differences table displaying
  12 * the complete statistics of difference in  table like number of
  13 * rows to be updated, number of rows to be inserted, number of
  14 * columns to be added, number of columns to be removed, etc.
  15 *
  16 * @param  index         index of matching table
  17 * @param  update_size   number of rows/column to be updated
  18 * @param  insert_size   number of rows/coulmns to be inserted
  19 * @param  remove_size   number of columns to be removed
  20 * @param  insert_index  number of indexes to be inserted
  21 * @param  remove_index  number of indexes to be removed
  22 * @param  img_obj       image object
  23 * @param  table_name    name of the table
  24 */
  25
  26 function showDetails(i, update_size, insert_size, remove_size, insert_index, remove_index, img_obj, table_name)
  27 {
  28     // a jQuery object
  29     var $img = $(img_obj);
  30
  31     $img.toggleClass('selected');
  32
  33     // The image source is changed when the showDetails function is called.
  34     if ($img.hasClass('selected')) {
  35         if ($img.hasClass('struct_img')) {
  36             $img.attr('src', pmaThemeImage + 'new_struct_selected.jpg');
  37         }
  38         if ($img.hasClass('data_img')) {
  39             $img.attr('src', pmaThemeImage + 'new_data_selected.jpg');
  40         }
  41     } else {
  42         if ($img.hasClass('struct_img')) {
  43             $img.attr('src', pmaThemeImage + 'new_struct.jpg');
  44         }
  45         if ($img.hasClass('data_img')) {
  46             $img.attr('src', pmaThemeImage + 'new_data.jpg');
  47         }
  48     }
  49
  50     var div = document.getElementById("list");
  51     var table = div.getElementsByTagName("table")[0];
  52     var table_body = table.getElementsByTagName("tbody")[0];
  53
  54     //Global variable row_class is being used
  55     if (row_class == 'even') {
  56         row_class = 'odd';
  57     } else {
  58         row_class = 'even';
  59     }
  60     // If the red or green button against a table name is pressed then append a new row to show the details of differences of this table.
  61     if ($img.hasClass('selected')) {
  62         var newRow = document.createElement("tr");
  63         newRow.setAttribute("class", row_class);
  64         newRow.className = row_class;
  65         // Id assigned to this row element is same as the index of this table name in the  matching_tables/source_tables_uncommon array
  66         newRow.setAttribute("id" , i);
  67
  68         var table_name_cell = document.createElement("td");
  69         table_name_cell.align = "center";
  70         table_name_cell.innerHTML = table_name ;
  71
  72         newRow.appendChild(table_name_cell);
  73
  74         var create_table = document.createElement("td");
  75         create_table.align = "center";
  76
  77         var add_cols = document.createElement("td");
  78         add_cols.align = "center";
  79
  80         var remove_cols = document.createElement("td");
  81         remove_cols.align = "center";
  82
  83         var alter_cols = document.createElement("td");
  84         alter_cols.align = "center";
  85
  86         var add_index = document.createElement("td");
  87         add_index.align = "center";
  88
  89         var delete_index = document.createElement("td");
  90         delete_index.align = "center";
  91
  92         var update_rows = document.createElement("td");
  93         update_rows.align = "center";
  94
  95         var insert_rows = document.createElement("td");
  96         insert_rows.align = "center";
  97
  98         var tick_image = document.createElement("img");
  99         tick_image.src = pmaThemeImage + "s_success.png";
 100
 101         if (update_size == '' && insert_size == '' && remove_size == '') {
 102           /**
 103           This is the case when the table needs to be created in target database.
 104           */
 105             create_table.appendChild(tick_image);
 106             add_cols.innerHTML = "--";
 107             remove_cols.innerHTML = "--";
 108             alter_cols.innerHTML = "--";
 109             delete_index.innerHTML = "--";
 110             add_index.innerHTML = "--";
 111             update_rows.innerHTML = "--";
 112             insert_rows.innerHTML = "--";
 113
 114             newRow.appendChild(create_table);
 115             newRow.appendChild(add_cols);
 116             newRow.appendChild(remove_cols);
 117             newRow.appendChild(alter_cols);
 118             newRow.appendChild(delete_index);
 119             newRow.appendChild(add_index);
 120             newRow.appendChild(update_rows);
 121             newRow.appendChild(insert_rows);
 122
 123         } else if (update_size == '' && remove_size == '') {
 124            /**
 125            This is the case when data difference is displayed in the
 126            table which is present in source but absent from target database
 127           */
 128             create_table.innerHTML = "--";
 129             add_cols.innerHTML = "--";
 130             remove_cols.innerHTML = "--";
 131             alter_cols.innerHTML = "--";
 132             add_index.innerHTML = "--";
 133             delete_index.innerHTML = "--";
 134             update_rows.innerHTML = "--";
 135             insert_rows.innerHTML = insert_size;
 136
 137             newRow.appendChild(create_table);
 138             newRow.appendChild(add_cols);
 139             newRow.appendChild(remove_cols);
 140             newRow.appendChild(alter_cols);
 141             newRow.appendChild(delete_index);
 142             newRow.appendChild(add_index);
 143             newRow.appendChild(update_rows);
 144             newRow.appendChild(insert_rows);
 145
 146         } else if (remove_size == '') {
 147             /**
 148              This is the case when data difference between matching_tables is displayed.
 149             */
 150             create_table.innerHTML = "--";
 151             add_cols.innerHTML = "--";
 152             remove_cols.innerHTML = "--";
 153             alter_cols.innerHTML = "--";
 154             add_index.innerHTML = "--";
 155             delete_index.innerHTML = "--";
 156             update_rows.innerHTML = update_size;
 157             insert_rows.innerHTML = insert_size;
 158
 159             newRow.appendChild(create_table);
 160             newRow.appendChild(add_cols);
 161             newRow.appendChild(remove_cols);
 162             newRow.appendChild(alter_cols);
 163             newRow.appendChild(delete_index);
 164             newRow.appendChild(add_index);
 165             newRow.appendChild(update_rows);
 166             newRow.appendChild(insert_rows);
 167
 168         } else {
 169             /**
 170             This is the case when structure difference between matching_tables id displayed
 171             */
 172             create_table.innerHTML = "--";
 173             add_cols.innerHTML = insert_size;
 174             remove_cols.innerHTML = remove_size;
 175             alter_cols.innerHTML = update_size;
 176             delete_index.innerHTML = remove_index;
 177             add_index.innerHTML = insert_index;
 178             update_rows.innerHTML = "--";
 179             insert_rows.innerHTML = "--";
 180
 181             newRow.appendChild(create_table);
 182             newRow.appendChild(add_cols);
 183             newRow.appendChild(remove_cols);
 184             newRow.appendChild(alter_cols);
 185             newRow.appendChild(delete_index);
 186             newRow.appendChild(add_index);
 187             newRow.appendChild(update_rows);
 188             newRow.appendChild(insert_rows);
 189         }
 190         table_body.appendChild(newRow);
 191
 192     } else {
 193       //The case when the row showing the details need to be removed from the table i.e. the difference button is deselected now.
 194         var table_rows = table_body.getElementsByTagName("tr");
 195         var j;
 196         var index = 0;
 197         for (j=0; j < table_rows.length; j++)
 198         {
 199             if (table_rows[j].id == i) {
 200                 index = j;
 201                 table_rows[j].parentNode.removeChild(table_rows[j]);
 202             }
 203         }
 204         //The table row css is being adjusted. Class "odd" for odd rows and "even" for even rows should be maintained.
 205         for(index = 0; index < table_rows.length; index++)
 206         {
 207             row_class_element = table_rows[index].getAttribute('class');
 208             if (row_class_element == "even") {
 209                 table_rows[index].setAttribute("class","odd");  // for Mozilla firefox
 210                 table_rows[index].className = "odd";            // for IE browser
 211             } else {
 212                 table_rows[index].setAttribute("class","even"); // for Mozilla firefox
 213                 table_rows[index].className = "even";           // for IE browser
 214             }
 215         }
 216     }
 217 }
 218
 219 /**
 220  * Generates the URL containing the list of selected table ids for synchronization and
 221  * a variable checked for confirmation of deleting previous rows from target tables
 222  *
 223  * @param   token   the token generated for each PMA form
 224  *
 225  */
 226 function ApplySelectedChanges(token)
 227 {
 228     var div =  document.getElementById("list");
 229     var table = div.getElementsByTagName('table')[0];
 230     var table_body = table.getElementsByTagName('tbody')[0];
 231     // Get all the rows from the details table
 232     var table_rows = table_body.getElementsByTagName('tr');
 233     var x = table_rows.length;
 234     var i;
 235     /**
 236      Append the token at the beginning of the query string followed by
 237     Table_ids that shows that "Apply Selected Changes" button is pressed
 238     */
 239     var append_string = "?token="+token+"&Table_ids="+1;
 240     for(i=0; i<x; i++){
 241            append_string += "&";
 242            append_string += i+"="+table_rows[i].id;
 243     }
 244
 245     // Getting the value of checkbox delete_rows
 246     var checkbox = document.getElementById("delete_rows");
 247     if (checkbox.checked){
 248         append_string += "&checked=true";
 249     } else {
 250          append_string += "&checked=false";
 251     }
 252     //Appending the token and list of table ids in the URL
 253     location.href += token;
 254     location.href += append_string;
 255 }
 256
 257
 258 /**
 259  * Validates a partial form (source part or target part)
 260  *
 261  * @param   which   'src' or 'trg'
 262  * @return  boolean  whether the partial form is valid
 263  *
 264  */
 265 function validateSourceOrTarget(which)
 266 {
 267     var partial_form_is_ok = true;
 268
 269     if ($("#" + which + "_type").val() != 'cur') {
 270         // did not choose "current connection"
 271         if ($("input[name='" + which + "_username']").val() == ''
 272             || $("input[name='" + which + "_pass']").val() == ''
 273             || $("input[name='" + which + "_db']").val() == ''
 274             // must have at least a host or a socket
 275             || ($("input[name='" + which + "_host']").val() == ''
 276                 && $("input[name='" + which + "_socket']").val() == '')
 277             // port can be empty
 278                 ) {
 279             partial_form_is_ok = false;
 280         }
 281     }
 282     return partial_form_is_ok;
 283 }
 284 /**
 285 * Displays an error message if any text field
 286 * is left empty other than the port field, unless
 287 * we are dealing with the "current connection" choice
 288 *
 289 * @return  boolean  whether the form is valid
 290 */
 291 function validateConnectionParams()
 292 {
 293     var form_is_ok = true;
 294
 295     if (! validateSourceOrTarget('src') || ! validateSourceOrTarget('trg')) {
 296         form_is_ok = false;
 297     }
 298     if (! form_is_ok) {
 299         alert(PMA_messages['strFormEmpty']);
 300     }
 301     return form_is_ok;
 302 }
 303
 304 /**
 305  * Handles the dynamic display of form fields related to a server selector
 306  */
 307
 308 function hideOrDisplayServerFields($server_selector, selected_option)
 309 {
 310     $tbody = $server_selector.closest('tbody');
 311     if (selected_option == 'cur') {
 312         $tbody.children('.current-server').css('display', '');
 313         $tbody.children('.remote-server').css('display', 'none');
 314     } else if (selected_option == 'rmt') {
 315         $tbody.children('.current-server').css('display', 'none');
 316         $tbody.children('.remote-server').css('display', '');
 317     } else {
 318         $tbody.children('.current-server').css('display', 'none');
 319         $tbody.children('.remote-server').css('display', '');
 320         var parts = selected_option.split('||||');
 321         $tbody.find('.server-host').val(parts[0]);
 322         $tbody.find('.server-port').val(parts[1]);
 323         $tbody.find('.server-socket').val(parts[2]);
 324         $tbody.find('.server-user').val(parts[3]);
 325         $tbody.find('.server-pass').val('');
 326         $tbody.find('.server-db').val(parts[4])
 327     }
 328 }
 329
 330 $(document).ready(function() {
 331     $('.server_selector').change(function(evt) {
 332         var selected_option = $(evt.target).val();
 333         hideOrDisplayServerFields($(evt.target), selected_option);
 334     });
 335
 336     // initial display of the selectors
 337     $('.server_selector').each(function() {
 338         var selected_option = $(this).val();
 339         hideOrDisplayServerFields($(this), selected_option);
 340     });
 341
 342     $('.struct_img').hover(
 343         // pmaThemeImage comes from js/messages.php
 344         function() {
 345             // mouse enters the element
 346             var $img = $(this);
 347             $img.addClass('hover');
 348             if ($img.hasClass('selected')) {
 349                 $img.attr('src', pmaThemeImage + 'new_struct_selected_hovered.jpg');
 350             } else {
 351                 $img.attr('src', pmaThemeImage + 'new_struct_hovered.jpg');
 352             }
 353         },
 354         function() {
 355             // mouse leaves the element
 356             var $img = $(this);
 357             $img.removeClass('hover');
 358             if ($img.hasClass('selected')) {
 359                 $img.attr('src', pmaThemeImage + 'new_struct_selected.jpg');
 360             } else {
 361                 $img.attr('src', pmaThemeImage + 'new_struct.jpg');
 362             }
 363         }
 364     );
 365
 366     $('.data_img').hover(
 367         function() {
 368             // mouse enters the element
 369             var $img = $(this);
 370             $img.addClass('hover');
 371             if ($img.hasClass('selected')) {
 372                 $img.attr('src', pmaThemeImage + 'new_data_selected_hovered.jpg');
 373             } else {
 374                 $img.attr('src', pmaThemeImage + 'new_data_hovered.jpg');
 375             }
 376         },
 377         function() {
 378             // mouse leaves the element
 379             var $img = $(this);
 380             $img.removeClass('hover');
 381             if ($img.hasClass('selected')) {
 382                 $img.attr('src', pmaThemeImage + 'new_data_selected.jpg');
 383             } else {
 384                 $img.attr('src', pmaThemeImage + 'new_data.jpg');
 385             }
 386         }
 387     );
 388
 389     $('#buttonGo').click(function(event) {
 390         if (! validateConnectionParams()) {
 391             event.preventDefault();
 392         }
 393     });
 394 });