last chnages

1.0
Javier Álvarez Medina 14 years ago
parent e28ff51170
commit 210d8ed3ca

@ -15,6 +15,7 @@ javascripts:
- plugins/jquery.scrollTo
- plugins/jquery.livequery.min
- plugins/tag-it
- admin/loader_queue
- plugins/cDBtable
- admin/table_elements
- admin/table

@ -0,0 +1,141 @@
/*==========================================================================================================================*/
/* */
/* loaderQueue => Control loader of the table . */
/* */
/*==========================================================================================================================*/
function loaderQueue () {
this.count = 0;
this.pendingOperations = [];
this.checking = false;
//Create the loader element
$('section.subheader').append('<div class="performing_op"></div>');
this.loader = $('section.subheader div.performing_op');
}
/*========================================================================================================================*/
/* */
/*========================================================================================================================*/
loaderQueue.prototype.newRequest = function(requestId, ok_msg, error_msg) {
this.count++;
this.pendingOperations[requestId] = new Object();
this.pendingOperations[requestId].status = "pending";
this.pendingOperations[requestId].ok = ok_msg;
this.pendingOperations[requestId].error = error_msg;
if (!this.checking) {
console.log(this.loader);
if (this.loader.html()=="") {
this.loader.append('<p class="loading">Loading...</p>');
}
this.loader.children('p.loading').animate({opacity:1},200);
this.checking = true;
this.loopPendingOperations();
}
}
/*========================================================================================================================*/
/* */
/*========================================================================================================================*/
loaderQueue.prototype.responseRequest = function(requestId, status) {
this.pendingOperations[requestId].status = status;
}
/*========================================================================================================================*/
/* */
/*========================================================================================================================*/
loaderQueue.prototype.loopPendingOperations = function() {
var me = this;
for (var request in this.pendingOperations) {
if (this.pendingOperations[request].status!="pending") {
this.count--;
this.showResult(this.pendingOperations[request]);
delete this.pendingOperations[request];
setTimeout(function(){me.loopPendingOperations()},1000);
return false;
}
}
if (this.count == 0) {
this.loader.children('p').animate({opacity:0},300,function(){
$(this).remove();
if (me.count>0) {
me.loader.append('<p class="loading">Loading...</p>');
me.loader.children('p.loading').animate({opacity:1},200);
me.checking = true;
me.loopPendingOperations();
} else {
me.checking = false;
}
});
} else {
if (!me.loader.children('p').hasClass('loading')) {
me.loader.children('p:eq(0)')
.css('position','absolute')
.css('bottom','0px')
.css('left',0 + 'px')
.css('zIndex','100');
me.loader.children('p:eq(0)').animate({opacity:0},300,function(){
$(this).remove();
});
me.loader.append('<p class="loading">Loading...</p>');
me.loader.children('p:eq(1)').animate({opacity:1},200);
}
setTimeout(function(){me.loopPendingOperations()},50);
}
}
/*========================================================================================================================*/
/* */
/*========================================================================================================================*/
loaderQueue.prototype.showResult = function(data) {
var element = '';
if (this.count==0) {
element = '<p class="'+((data.status!="ok")?'error':'success')+'">'+ ((data.status=="ok")?data.ok:data.error) +'</p>';
} else {
var text = ((data.status=="ok")?data.ok:data.error) + ', ';
text += (this.count==1)?'there is '+ this.count + ' in the queue':'there are '+ this.count + ' in the queue';
element = '<p class="'+((data.status!="ok")?'error':'success')+'">'+ text +'</p>';
}
var left_position = this.loader.children('p:eq(0)').position().left;
console.log(left_position);
this.loader.children('p:eq(0)')
.css('position','absolute')
.css('bottom','0px')
.css('left',left_position + 'px')
.css('zIndex','100');
this.loader.children('p:eq(0)').animate({opacity:0},800,function(){$(this).remove();});
this.loader.append(element);
var width = this.loader.children('p:eq(1)').width();
this.loader.children('p:eq(1)').css('margin','0 0 0 '+ ((650-width)/2) +'px');
this.loader.children('p:eq(1)').animate({opacity:1},400);
}
function test1() {
requests_queue.newRequest("a", "The row 'J' column 'P' has been updated","The row 'J' column 'P' hasn't been updated");
requests_queue.newRequest("b", "The tags has been updated","The tags hasn't been updated");
requests_queue.newRequest("c", "Table name updated","Sorry, table name update error");
requests_queue.newRequest("d", "The row 'J' column 'P' has been updated","The row 'J' column 'P' hasn't been updated");
}
function test2() {
requests_queue.responseRequest('b','ok');
setTimeout(function(){requests_queue.responseRequest('a','error');},15000)
requests_queue.responseRequest('d','ok');
requests_queue.responseRequest('c','error');
}

@ -1,5 +1,8 @@
var requests_queue = new loaderQueue();
$(document).ready(function(){
$("table#cDBtable").cDBtable(
'start',{
@ -11,6 +14,19 @@
);
$('p.session a, a.logo').click(function(){window.location.href = $(this).attr('href');});
});
/*========================================================================================================================*/
/* Use unique */
/*========================================================================================================================*/
function createUniqueId() {
var uuid= '';
for (i = 0; i < 32; i++) {
uuid += Math.floor(Math.random() * 16).toString(16);
}
return uuid;
}

@ -4,14 +4,6 @@
//SUBHEADER EVENTS AND FLOATING WINDOWS
//Save operation loader
$('section.subheader').append(
'<div class="performing_op">' +
'<p class="loading">Loading...</p>'+
'</div>');
//Change title name window
$('div.inner_subheader div.left').append(
'<span class="title_window">'+

@ -422,9 +422,8 @@
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
bindCellEvents: function() {
//Cell events
//DOUBLE CLICK IN THE TABLE
//DOUBLE CLICK IN THE TABLE -> Open editor
$(document).dblclick(function(event){
var target = event.target || event.srcElement;
var targetElement = target.nodeName.toLowerCase();
@ -433,20 +432,23 @@
var target_position = $(target).parent().offset();
var data = {row: $(target).parent().attr('r'),column:$(target).parent().attr('c'),value:$(target).html()};
$('tbody tr[r="'+data.row+'"]').addClass('editing');
$('div.edit_cell').css('top',target_position.top-192+'px');
$('div.edit_cell').css('left',target_position.left-128+($(target).width()/2)+'px');
//Check if frist row or last column
if ($(target).parent().offset().top<230) {$('div.edit_cell').css('top',target_position.top-150+'px');} else {$('div.edit_cell').css('top',target_position.top-192+'px');}
if ($("div.table_position").width()<($(target).parent().offset().left+cell_size+28)) {$('div.edit_cell').css('left',target_position.left-215+($(target).width()/2)+'px');} else {$('div.edit_cell').css('left',target_position.left-128+($(target).width()/2)+'px');}
$('div.edit_cell textarea').text(data.value);
$('div.edit_cell a.save').attr('r',data.row);
$('div.edit_cell a.save').attr('c',data.column);
$('div.edit_cell').show();
}
if (event.preventDefault) {
event.preventDefault();
event.stopPropagation();
} else {
event.stopPropagation();
event.returnValue = false;
if (event.preventDefault) {
event.preventDefault();
event.stopPropagation();
} else {
event.stopPropagation();
event.returnValue = false;
}
}
});
@ -455,7 +457,7 @@
$(document).click(function(event){
var target = event.target || event.srcElement;
var targetElement = target.nodeName.toLowerCase();
//Clicking in first column element + Key
if ((targetElement == "div" && event.ctrlKey) || (targetElement == "div" && event.metaKey)) {
$('tbody tr').removeClass('editing');
@ -472,7 +474,7 @@
event.returnValue = false;
}
}
//Clicking in first column element
if (targetElement == "a" && $(target).parent().parent().hasClass('first')) {
if (!$(target).parent().parent().parent().hasClass('selecting_first')) {
@ -485,13 +487,13 @@
$(target).parent().parent().parent().addClass('editing');
}
}
if (!$(target).hasClass('selected')) {
$('tbody tr td.first div span').hide();
$('tbody tr td.first div a.options').removeClass('selected');
$(target).parent().children('span').show();
$(target).addClass('selected');
$('body').click(function(event) {
if (!$(event.target).closest('tbody tr td div span').length) {
$('table tbody tr td.first div a.options').removeClass('selected');
@ -513,12 +515,11 @@
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//EXPERIMENT SELECTING ROWS
//EXPERIMENT SELECTING ROWS
$(document).mousedown(function(event){
var target = event.target || event.srcElement;
var targetElement = target.nodeName.toLowerCase();
if (targetElement == "div" && $(target).parent().is('td') && !event.ctrlKey && !event.metaKey) {
$('table tbody tr td.first div span').hide();
$('table tbody tr td.first div a.options').removeClass('selected');
@ -539,11 +540,11 @@
event.returnValue = false;
}
}
$(document).mousemove(function(event){
var target = event.target || event.srcElement;
var targetElement = target.nodeName.toLowerCase();
if (targetElement == "div" && $(target).parent().is('td')) {
var data = {row: $(target).parent().attr('r'),column:$(target).parent().attr('c'),value:$(target).html()};
var current_row = $(target).parent().parent();
@ -581,7 +582,7 @@
return false;
}
}
} else {
}
if (event.preventDefault) {
@ -598,7 +599,7 @@
$(document).mouseup(function(event){
var target = event.target || event.srcElement;
var targetElement = target.nodeName.toLowerCase();
if (targetElement == "div" && $(target).parent().is('td')) {
var data = {row: $(target).parent().attr('r'),column:$(target).parent().attr('c'),value:$(target).html()};
if ($('tbody tr').hasClass('selecting_last')) {
@ -609,7 +610,7 @@
$('tbody tr[r="'+data.row+'"]').addClass('selecting_last').addClass('border');
$('tbody tr.selecting_first').addClass('border');
}
if ($('tbody tr[r="'+data.row+'"]').hasClass('selecting_last') && $('tbody tr[r="'+data.row+'"]').hasClass('selecting_first')) {
$('tbody tr[r="'+data.row+'"]').removeClass('selecting_first');
$('tbody tr[r="'+data.row+'"]').removeClass('selecting_last');
@ -628,20 +629,14 @@
}
$(document).unbind('mousemove');
});
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//Head options event
$('thead tr a.options').click(function(ev){
ev.stopPropagation();
ev.preventDefault();
if (!$(this).hasClass('selected')) {
$('tbody tr td.first a.options').removeClass('selected');
$('thead tr span.col_types').hide();
@ -649,7 +644,7 @@
$('thead tr span.col_ops_list').hide();
$(this).addClass('selected');
$(this).parent().children('span.col_ops_list').show();
$('body').click(function(event) {
if (!$(event.target).closest('thead tr span').length) {
$('thead tr span.col_ops_list').hide();
@ -708,14 +703,23 @@
$('div.error_cell').hide();
});
//Saving new edited value
$("div.edit_cell a.save").livequery('click',function(ev){
ev.stopPropagation();
ev.preventDefault();
var row = $(this).attr('r');
var column = $(this).attr('c');
$('tbody tr td[r="'+row+'"][c="'+column+'"] div').text($("div.edit_cell textarea").val());
if ($('tbody tr td[r="'+row+'"][c="'+column+'"] div').text()!=$("div.edit_cell textarea").val()) {
var new_value = $("div.edit_cell textarea").val();
var old_value = $('tbody tr td[r="'+row+'"][c="'+column+'"] div').text();
var params = {};
params["row_id"] = row;
params[column] = $("div.edit_cell textarea").val();
methods.updateTable("/rows/"+row,params,new_value,old_value,'update_cell');
$('tbody tr td[r="'+row+'"][c="'+column+'"] div').text($("div.edit_cell textarea").val());
}
$("div.edit_cell").hide();
$("div.edit_cell textarea").css('width','262px');
$("div.edit_cell textarea").css('height','30px');
@ -748,8 +752,7 @@
});
//GEO tag movement
//GEO tag movement
$('p.geo').livequery('mousedown',function(event){
var position = $(this).offset();
var geo_element = $(this);
@ -818,7 +821,7 @@
var test_1 = $('table thead tr th:eq(3)').position().left;
var test_2 = $('table thead tr th:eq(4)').position().left;
var length = test_2 - test_1;
try {
var column_position = Math.floor(($(window).width()-second+scrollable)/(length))+3;
var position = $('table thead tr th:eq('+column_position+')').offset().left;
@ -836,7 +839,7 @@
var test_1 = $('table thead tr th:eq(3)').position().left;
var test_2 = $('table thead tr th:eq(4)').position().left;
var length = test_2 - test_1;
var column_position = Math.floor(($(window).width()-second+scrollable)/(length))+1;
var position = $('table thead tr th:eq('+column_position+')').offset().left;
$('div.table_position').scrollTo({top:'0',left:scrollable+position-window_width+'px'},200);
@ -906,7 +909,56 @@
if ((parent_height-162)>($(table).parent().height())) {
$(table).parent().height(parent_height-162);
}
},
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// UPDATE TABLE
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
updateTable: function(url_change,params,new_value,old_value,type) {
//Queue loader
var requestId = createUniqueId();
params.requestId = requestId;
requests_queue.newRequest(requestId,type);
$.ajax({
dataType: 'json',
type: "PUT",
url: '/api/json/tables/'+table_id+url_change,
data: params,
success: function(data) {
requests_queue.responseRequest(requestId,'ok');
console.log(data);
//methods.successRequest(params,new_value,old_value,type);
},
error: function(e) {
requests_queue.responseRequest(requestId,'error');
console.log(data);
}
});
},
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// SUCCES UPDATING THE TABLE
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
successRequest: function(url_change,params,new_value,old_value,type) {
},
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// ERROR UPDATING THE TABLE
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
errorRequest: function(url_change,params,new_value,old_value,type) {
}
};

@ -60,11 +60,11 @@
</li>
</ul>
<p class="tab">JSON</p>
<pre class="syntax javascript">
<p class="tab">RUBY</p>
<pre class="syntax ruby">
var jamon = [];
var json = [{"json":"json_guay"}];
jamon = "jamon"
a = Array.new(2)
</pre>
</div>
<div class="right">

@ -77,12 +77,12 @@ section.subheader div.right span.paginate a:hover {background-position:0 -23px;}
/*performing operation*/
section.subheader div.performing_op {position:absolute; display:none; bottom:0; left:50%; margin:0 0 0 -50px;}
section.subheader div.performing_op p {font:normal 13px Arial; color:#333333; padding:8px 12px; border-bottom:1px solid #D0C090; z-index:100; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; text-align:center;}
section.subheader div.performing_op p.loading {padding:8px 12px 8px 32px; background:url('/images/admin/icons/watch.png') no-repeat 12px 9px #FFEAA4;}
section.subheader div.performing_op {position:absolute; display:block; bottom:0; left:50%; width:650px; margin:0 0 0 -325px;}
section.subheader div.performing_op p {float:left; width:auto; font:normal 13px Arial; color:#333333; padding:8px 12px; border-bottom:1px solid #D0C090; z-index:100; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; text-align:center; opacity:0;}
section.subheader div.performing_op p.loading {margin:0 0 0 280px; padding:8px 12px 8px 32px; background:url('/images/admin/icons/watch.png') no-repeat 12px 9px #FFEAA4;}
section.subheader div.performing_op p.success {padding:8px 12px; background:#99CC66; border-bottom-color:#A5BB93; color:#111111;}
section.subheader div.performing_op p.error {padding:8px 12px; background:#FF5F5F; border-bottom-color:#FFA3A9; color:#333333;}
section.subheader div.performing_op p.error {padding:8px 12px; background:#D0878E; border-bottom-color:#FFA3A9; color:#333333;}
/*Change table title*/

Loading…
Cancel
Save