nettika/phpmyadmin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

In Synchronize panel, make image changes independant from the original theme

Browse Source
This commit is contained in:
Marc Delisle
2011-03-11 13:16:36 -05:00
parent 4fdae9a0e0
commit 8d2531d658
4 changed files with 91 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
js/functions.js
View File

@@ -401,22 +401,26 @@ var row_class = 'even';
function showDetails(i, update_size, insert_size, remove_size, insert_index, remove_index, img_obj, table_name) function showDetails(i, update_size, insert_size, remove_size, insert_index, remove_index, img_obj, table_name)
{ {
// The path of the image is split to facilitate comparison // a jQuery object
var relative_path = (img_obj.src).split("themes/"); var $img = $(img_obj);
$img.toggleClass('selected');
// The image source is changed when the showDetails function is called. // The image source is changed when the showDetails function is called.
if (relative_path[1] == 'original/img/new_data_hovered.jpg') { if ($img.hasClass('selected')) {
img_obj.src = "./themes/original/img/new_data_selected_hovered.jpg"; if ($img.hasClass('struct_img')) {
img_obj.alt = PMA_messages['strClickToUnselect']; //only for IE browser $img.attr('src', pmaThemeImage + 'new_struct_selected.jpg');
} else if (relative_path[1] == 'original/img/new_struct_hovered.jpg') { }
img_obj.src = "./themes/original/img/new_struct_selected_hovered.jpg"; if ($img.hasClass('data_img')) {
img_obj.alt = PMA_messages['strClickToUnselect']; $img.attr('src', pmaThemeImage + 'new_data_selected.jpg');
} else if (relative_path[1] == 'original/img/new_struct_selected_hovered.jpg') { }
img_obj.src = "./themes/original/img/new_struct_hovered.jpg"; } else {
img_obj.alt = PMA_messages['strClickToSelect']; if ($img.hasClass('struct_img')) {
} else if (relative_path[1] == 'original/img/new_data_selected_hovered.jpg') { $img.attr('src', pmaThemeImage + 'new_struct.jpg');
img_obj.src = "./themes/original/img/new_data_hovered.jpg"; }
img_obj.alt = PMA_messages['strClickToSelect']; if ($img.hasClass('data_img')) {
$img.attr('src', pmaThemeImage + 'new_data.jpg');
}
} }
var div = document.getElementById("list"); var div = document.getElementById("list");
@@ -430,8 +434,7 @@ function showDetails(i, update_size, insert_size, remove_size, insert_index, rem
row_class = 'even'; row_class = 'even';
} }
// 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. // 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.
if ((relative_path[1] != 'original/img/new_struct_selected_hovered.jpg') && (relative_path[1] != 'original/img/new_data_selected_hovered.jpg')) { if ($img.hasClass('selected')) {
var newRow = document.createElement("tr"); var newRow = document.createElement("tr");
newRow.setAttribute("class", row_class); newRow.setAttribute("class", row_class);
newRow.className = row_class; newRow.className = row_class;
@@ -469,7 +472,7 @@ function showDetails(i, update_size, insert_size, remove_size, insert_index, rem
insert_rows.align = "center"; insert_rows.align = "center";
var tick_image = document.createElement("img"); var tick_image = document.createElement("img");
tick_image.src = "./themes/original/img/s_success.png"; tick_image.src = pmaThemeImage + "s_success.png";
if (update_size == '' && insert_size == '' && remove_size == '') { if (update_size == '' && insert_size == '' && remove_size == '') {
/** /**
@@ -562,7 +565,7 @@ function showDetails(i, update_size, insert_size, remove_size, insert_index, rem
} }
table_body.appendChild(newRow); table_body.appendChild(newRow);
} else if ((relative_path[1] != 'original/img/new_struct_hovered.jpg') && (relative_path[1] != 'original/img/new_data_hovered.jpg')) { } else {
//The case when the row showing the details need to be removed from the table i.e. the difference button is deselected now. //The case when the row showing the details need to be removed from the table i.e. the difference button is deselected now.
var table_rows = table_body.getElementsByTagName("tr"); var table_rows = table_body.getElementsByTagName("tr");
var j; var j;
@@ -589,35 +592,6 @@ function showDetails(i, update_size, insert_size, remove_size, insert_index, rem
} }
} }
/**
* Changes the image on hover effects
*
* @param img_obj the image object whose source needs to be changed
*
*/
function change_Image(img_obj)
{
var relative_path = (img_obj.src).split("themes/");
if (relative_path[1] == 'original/img/new_data.jpg') {
img_obj.src = "./themes/original/img/new_data_hovered.jpg";
} else if (relative_path[1] == 'original/img/new_struct.jpg') {
img_obj.src = "./themes/original/img/new_struct_hovered.jpg";
} else if (relative_path[1] == 'original/img/new_struct_hovered.jpg') {
img_obj.src = "./themes/original/img/new_struct.jpg";
} else if (relative_path[1] == 'original/img/new_data_hovered.jpg') {
img_obj.src = "./themes/original/img/new_data.jpg";
} else if (relative_path[1] == 'original/img/new_data_selected.jpg') {
img_obj.src = "./themes/original/img/new_data_selected_hovered.jpg";
} else if(relative_path[1] == 'original/img/new_struct_selected.jpg') {
img_obj.src = "./themes/original/img/new_struct_selected_hovered.jpg";
} else if (relative_path[1] == 'original/img/new_struct_selected_hovered.jpg') {
img_obj.src = "./themes/original/img/new_struct_selected.jpg";
} else if (relative_path[1] == 'original/img/new_data_selected_hovered.jpg') {
img_obj.src = "./themes/original/img/new_data_selected.jpg";
}
}
/** /**
* Generates the URL containing the list of selected table ids for synchronization and * Generates the URL containing the list of selected table ids for synchronization and
* a variable checked for confirmation of deleting previous rows from target tables * a variable checked for confirmation of deleting previous rows from target tables

3
js/messages.php
View File

@@ -126,6 +126,9 @@ foreach ($js_messages as $name => $js_message) {
/* Calendar */ /* Calendar */
echo "var themeCalendarImage = '" . $GLOBALS['pmaThemeImage'] . 'b_calendar.png' . "';\n"; echo "var themeCalendarImage = '" . $GLOBALS['pmaThemeImage'] . 'b_calendar.png' . "';\n";
/* Image path */
echo "var pmaThemeImage = '" . $GLOBALS['pmaThemeImage'] . "';\n";
/* Version */ /* Version */
echo "var pmaversion = '" . PMA_VERSION . "';\n"; echo "var pmaversion = '" . PMA_VERSION . "';\n";

51
js/server_synchronize.js
View File

@@ -23,5 +23,54 @@ $(document).ready(function() {
$(this).closest('tbody').find('.server-pass').val(''); $(this).closest('tbody').find('.server-pass').val('');
$(this).closest('tbody').find('.server-db').val(parts[4]) $(this).closest('tbody').find('.server-db').val(parts[4])
} }
}); });
$('.struct_img').hover(
// pmaThemeImage comes from js/messages.php
function() {
// mouse enters the element
var $img = $(this);
$img.addClass('hover');
if ($img.hasClass('selected')) {
$img.attr('src', pmaThemeImage + 'new_struct_selected_hovered.jpg');
} else {
$img.attr('src', pmaThemeImage + 'new_struct_hovered.jpg');
}
},
function() {
// mouse leaves the element
var $img = $(this);
$img.removeClass('hover');
if ($img.hasClass('selected')) {
$img.attr('src', pmaThemeImage + 'new_struct_selected.jpg');
} else {
$img.attr('src', pmaThemeImage + 'new_struct.jpg');
}
}
);
$('.data_img').hover(
// pmaThemeImage comes from js/messages.php
function() {
// mouse enters the element
var $img = $(this);
$img.addClass('hover');
if ($img.hasClass('selected')) {
$img.attr('src', pmaThemeImage + 'new_data_selected_hovered.jpg');
} else {
$img.attr('src', pmaThemeImage + 'new_data_hovered.jpg');
}
},
function() {
// mouse leaves the element
var $img = $(this);
$img.removeClass('hover');
if ($img.hasClass('selected')) {
$img.attr('src', pmaThemeImage + 'new_data_selected.jpg');
} else {
$img.attr('src', pmaThemeImage + 'new_data.jpg');
}
}
);
}); });

33
server_synchronize.php
View File

@@ -277,6 +277,7 @@ if ((isset($_REQUEST['submit_connect']))) {
*/ */
PMA_syncDisplayHeaderSource($src_db); PMA_syncDisplayHeaderSource($src_db);
$odd_row = false; $odd_row = false;
/** /**
* Display the matching tables' names and difference, first * Display the matching tables' names and difference, first
*/ */
@@ -339,8 +340,8 @@ if ((isset($_REQUEST['submit_connect']))) {
*/ */
if (($num_alter_cols > 0) || ($num_insert_cols > 0) || ($num_remove_cols > 0) || ($num_add_index > 0) || ($num_remove_index > 0)) { if (($num_alter_cols > 0) || ($num_insert_cols > 0) || ($num_remove_cols > 0) || ($num_add_index > 0) || ($num_remove_index > 0)) {
echo '<img class="icon" src="' . $pmaThemeImage . 'new_struct.jpg" width="29" height="29" echo '<img class="icon struct_img" src="' . $pmaThemeImage . 'new_struct.jpg" width="29" height="29"
alt="' . __('Click to select') . '" onmouseover="change_Image(this);" onmouseout="change_Image(this);" alt="' . __('Click to select') . '"
onclick="showDetails(' . "'MS" . $i . "','" . $num_alter_cols . "','" .$num_insert_cols . onclick="showDetails(' . "'MS" . $i . "','" . $num_alter_cols . "','" .$num_insert_cols .
"','" . $num_remove_cols . "','" . $num_add_index . "','" . $num_remove_index . "'" "','" . $num_remove_cols . "','" . $num_add_index . "','" . $num_remove_index . "'"
. ', this ,' . "'" . htmlspecialchars($matching_tables[$i]) . "'" . ')"/>'; . ', this ,' . "'" . htmlspecialchars($matching_tables[$i]) . "'" . ')"/>';
@@ -351,8 +352,8 @@ if ((isset($_REQUEST['submit_connect']))) {
if (isset($update_array[$i]) || isset($insert_array[$i])) { if (isset($update_array[$i]) || isset($insert_array[$i])) {
if (isset($update_array[$i][0][$matching_tables_keys[$i][0]]) || isset($insert_array[$i][0][$matching_tables_keys[$i][0]])) { if (isset($update_array[$i][0][$matching_tables_keys[$i][0]]) || isset($insert_array[$i][0][$matching_tables_keys[$i][0]])) {
echo '<img class="icon" src="' . $pmaThemeImage . 'new_data.jpg" width="29" height="29" echo '<img class="icon data_img" src="' . $pmaThemeImage . 'new_data.jpg" width="29" height="29"
alt="' . __('Click to select') . '" onmouseover="change_Image(this);" onmouseout="change_Image(this);" alt="' . __('Click to select') . '"
onclick="showDetails('. "'MD" . $i . "','" . $num_of_updates . "','" . $num_of_insertions . onclick="showDetails('. "'MD" . $i . "','" . $num_of_updates . "','" . $num_of_insertions .
"','" . null . "','" . null . "','" . null . "'" . ', this ,' . "'" . htmlspecialchars($matching_tables[$i]) . "'" . ')" />'; "','" . null . "','" . null . "','" . null . "'" . ', this ,' . "'" . htmlspecialchars($matching_tables[$i]) . "'" . ')" />';
} }
@@ -367,15 +368,15 @@ if ((isset($_REQUEST['submit_connect']))) {
$odd_row = PMA_syncDisplayBeginTableRow($odd_row); $odd_row = PMA_syncDisplayBeginTableRow($odd_row);
echo '<td> + ' . htmlspecialchars($source_tables_uncommon[$j]) . '</td> '; echo '<td> + ' . htmlspecialchars($source_tables_uncommon[$j]) . '</td> ';
echo '<td align="center"><img class="icon" src="' . $pmaThemeImage . 'new_struct.jpg" width="29" height="29" echo '<td align="center"><img class="icon struct_img" src="' . $pmaThemeImage . 'new_struct.jpg" width="29" height="29"
alt="' . __('Click to select') . '" onmouseover="change_Image(this);" onmouseout="change_Image(this);" alt="' . __('Click to select') . '"
onclick="showDetails(' . "'US" . $j . "','" . null . "','" . null . "','" . null . "','" . null . "','" . null . "'" . ', this ,' onclick="showDetails(' . "'US" . $j . "','" . null . "','" . null . "','" . null . "','" . null . "','" . null . "'" . ', this ,'
. "'" . htmlspecialchars($source_tables_uncommon[$j]) . "'" . ')"/>'; . "'" . htmlspecialchars($source_tables_uncommon[$j]) . "'" . ')"/>';
if ($row_count[$j] > 0) if ($row_count[$j] > 0)
{ {
echo '<img class="icon" src="' . $pmaThemeImage . 'new_data.jpg" width="29" height="29" echo '<img class="icon data_img" src="' . $pmaThemeImage . 'new_data.jpg" width="29" height="29"
alt="' . __('Click to select') . '" onmouseover="change_Image(this);" onmouseout="change_Image(this);" alt="' . __('Click to select') . '"
onclick="showDetails(' . "'UD" . $j . "','" . null . "','" . $row_count[$j] . "','" . null . onclick="showDetails(' . "'UD" . $j . "','" . null . "','" . $row_count[$j] . "','" . null .
"','" . null . "','" . null . "'" . ', this ,' . "'" . htmlspecialchars($source_tables_uncommon[$j]) . "'" . ')" />'; "','" . null . "','" . null . "'" . ', this ,' . "'" . htmlspecialchars($source_tables_uncommon[$j]) . "'" . ')" />';
} }
@@ -733,8 +734,8 @@ if (isset($_REQUEST['Table_ids'])) {
} }
if (($num_alter_cols > 0) || ($num_insert_cols > 0) || ($num_remove_cols > 0) || ($num_add_index > 0) || ($num_remove_index > 0)) { if (($num_alter_cols > 0) || ($num_insert_cols > 0) || ($num_remove_cols > 0) || ($num_add_index > 0) || ($num_remove_index > 0)) {
echo '<img class="icon" src="' . $pmaThemeImage . 'new_struct.jpg" width="29" height="29" echo '<img class="icon struct_img" src="' . $pmaThemeImage . 'new_struct.jpg" width="29" height="29"
alt="' . __('Click to select') . '" onmouseover="change_Image(this);" onmouseout="change_Image(this);" alt="' . __('Click to select') . '"
onclick="showDetails(' . "'MS" . $i . "','" . $num_alter_cols . "','" . $num_insert_cols . "','" . $num_remove_cols . "','" . $num_add_index . "','" . $num_remove_index . "'" .', onclick="showDetails(' . "'MS" . $i . "','" . $num_alter_cols . "','" . $num_insert_cols . "','" . $num_remove_cols . "','" . $num_add_index . "','" . $num_remove_index . "'" .',
this ,' . "'" . htmlspecialchars($matching_tables[$i]) . "'" . ')"/>'; this ,' . "'" . htmlspecialchars($matching_tables[$i]) . "'" . ')"/>';
} }
@@ -761,8 +762,8 @@ if (isset($_REQUEST['Table_ids'])) {
if ((isset($matching_tables_keys[$i][0]) && isset($update_array[$i][0][$matching_tables_keys[$i][0]])) if ((isset($matching_tables_keys[$i][0]) && isset($update_array[$i][0][$matching_tables_keys[$i][0]]))
|| (isset($matching_tables_keys[$i][0]) && isset($insert_array[$i][0][$matching_tables_keys[$i][0]]))) { || (isset($matching_tables_keys[$i][0]) && isset($insert_array[$i][0][$matching_tables_keys[$i][0]]))) {
echo '<img class="icon" src="' . $pmaThemeImage . 'new_data.jpg" width="29" height="29" echo '<img class="icon data_img" src="' . $pmaThemeImage . 'new_data.jpg" width="29" height="29"
alt="' . __('Click to select') . '" onmouseover="change_Image(this);" onmouseout="change_Image(this);" alt="' . __('Click to select') . '"
onclick="showDetails(' . "'MD" . $i . "','" . $num_of_updates . "','" . $num_of_insertions . onclick="showDetails(' . "'MD" . $i . "','" . $num_of_updates . "','" . $num_of_insertions .
"','" . null . "','" . null . "','" . null . "'" .', this ,' . "'" . htmlspecialchars($matching_tables[$i]) . "'" . ')" />'; "','" . null . "','" . null . "','" . null . "'" .', this ,' . "'" . htmlspecialchars($matching_tables[$i]) . "'" . ')" />';
} }
@@ -789,8 +790,8 @@ if (isset($_REQUEST['Table_ids'])) {
*/ */
if (!(in_array($j, $uncommon_table_structure_diff))) { if (!(in_array($j, $uncommon_table_structure_diff))) {
if (isset($uncommon_tables[$j])) { if (isset($uncommon_tables[$j])) {
echo '<img class="icon" src="' . $pmaThemeImage . 'new_struct.jpg" width="29" height="29" echo '<img class="icon struct_img" src="' . $pmaThemeImage . 'new_struct.jpg" width="29" height="29"
alt="' . __('Click to select') . '" onmouseover="change_Image(this);" onmouseout="change_Image(this);" alt="' . __('Click to select') . '"
onclick="showDetails(' . "'US" . $j . "','" . null . "','" . null . "','" . null . "','" . null . "','" . null . "'" . ', this ,' . "'" . htmlspecialchars($source_tables_uncommon[$j]) . "'" . ')"/>' .' '; onclick="showDetails(' . "'US" . $j . "','" . null . "','" . null . "','" . null . "','" . null . "','" . null . "'" . ', this ,' . "'" . htmlspecialchars($source_tables_uncommon[$j]) . "'" . ')"/>' .' ';
} }
} else { } else {
@@ -801,8 +802,8 @@ if (isset($_REQUEST['Table_ids'])) {
*/ */
if (!(in_array($j, $uncommon_table_data_diff))) { if (!(in_array($j, $uncommon_table_data_diff))) {
if (isset($row_count[$j]) && ($row_count > 0)) { if (isset($row_count[$j]) && ($row_count > 0)) {
echo '<img class="icon" src="' . $pmaThemeImage . 'new_data.jpg" width="29" height="29" echo '<img class="icon data_img" src="' . $pmaThemeImage . 'new_data.jpg" width="29" height="29"
alt="' . __('Click to select') . '" onmouseover="change_Image(this);" onmouseout="change_Image(this);" alt="' . __('Click to select') . '"
onclick="showDetails(' . "'UD" . $j . "','" . null ."','" . $row_count[$j] ."','" onclick="showDetails(' . "'UD" . $j . "','" . null ."','" . $row_count[$j] ."','"
. null . "','" . null . "','" . null . "'" . ', this ,' . "'". htmlspecialchars($source_tables_uncommon[$j]) . "'" . ')" />'; . null . "','" . null . "','" . null . "'" . ', this ,' . "'". htmlspecialchars($source_tables_uncommon[$j]) . "'" . ')" />';
} }