Hopefully last changes

This commit is contained in:
laf
2015-07-23 17:09:18 +01:00
parent 8f282c5174
commit a91ab4d987
4 changed files with 83 additions and 84 deletions

View File

@@ -14,41 +14,31 @@
$no_refresh = true;
foreach (dbFetchRows('SELECT * FROM `dashboard_items` WHERE `user_id`=?',array($_SESSION['user_id'])) as $items) {
foreach (dbFetchRows('SELECT * FROM `users_widgets` LEFT JOIN `widgets` ON `widgets`.`widget_id`=`users_widgets`.`widget_id` WHERE `user_id`=?',array($_SESSION['user_id'])) as $items) {
$data[] = $items;
}
if (!is_array($data)) {
$data[] = array('dashboard_item_id'=>'0','widget_id'=>1,'title'=>'Add a widget','content'=>'placeholder','col'=>1,'row'=>1,'size_x'=>2,'size_y'=>2,'refresh'=>60);
$data[] = array('user_widget_id'=>'0','widget_id'=>1,'title'=>'Add a widget','widget'=>'placeholder','col'=>1,'row'=>1,'size_x'=>2,'size_y'=>2,'refresh'=>60);
}
$data = serialize(json_encode($data));
$dash_config = unserialize(stripslashes($data));
$new_tile = '
<select id="tile_id" name="tile_id" class="form-control">
<option value="" disabled selected></option>
';
?>
foreach (dbFetchRows("SELECT * FROM `tiles` ORDER BY `tile_title`") as $tiles) {
$new_tile .= '<option value="'. $tiles['tile_id'] .'">'. $tiles['tile_title'] .'</option>';
<a class="btn btn-primary" role="button" data-toggle="collapse" href="#add_widget" aria-expanded="false" aria-controls="add_widget"">Add Widget</a>
<div class="collapse" id="add_widget">
<div class="well">
<?php
foreach (dbFetchRows("SELECT * FROM `widgets` ORDER BY `widget_title`") as $widgets) {
echo '<a class="btn btn-success" role="button" id="place_widget" name="place_widget" data-widget_id="'.$widgets['widget_id'] .'">'. $widgets['widget_title'] .'</a> ';
}
$new_title .= '
</select>
';
?>
&nbsp;<button type='button' id='new-tile' class='btn btn-success btn-sm' name='new-dashboard-tile' data-html='true' data-container='body' data-toggle='popover' data-placement='right' data-content='<a href="#">
<?php
echo $new_tile;
?>
</a>'><span class='glyphicon glyphicon-plus' aria-hidden='true'></span> Add tile</button>
<script>
$('#new-tile').popover();
</script>
</div>
</div>
<script src='https://www.google.com/jsapi'></script>
<script src="js/jquery.gridster.min.js"></script>
@@ -65,6 +55,7 @@ $('#new-tile').popover();
</div>
<script type="text/javascript">
var gridster;
var serialization = <?php echo $dash_config; ?>;
@@ -95,9 +86,6 @@ $('#new-tile').popover();
gridster = $(".gridster ul").gridster({
widget_base_dimensions: [100, 100],
widget_margins: [5, 5],
autogrow_cols: true,
min_cols: 1,
min_rows: 2,
avoid_overlapped_widgets: true,
draggable: {
handle: 'header',
@@ -125,25 +113,38 @@ $('#new-tile').popover();
gridster.remove_all_widgets();
$.each(serialization, function() {
gridster.add_widget(
'<li id="'+this.dashboard_item_id+'">'+
'\<script\>var timeout'+this.dashboard_item_id+' = grab_data('+this.dashboard_item_id+','+this.refresh+',\''+this.content+'\');\<\/script\>'+
'<header class="tile_header">'+this.title+'<button style="color: #ffffff" type="button" class="close close-tile" data-tile-id="'+this.dashboard_item_id+'" aria-label="Close"><span aria-hidden="true">&times;</span></button></header>'+
'<div class="tile_body" id="tile_body_'+this.dashboard_item_id+'">'+this.content+'</div>'+
'<li id="'+this.user_widget_id+'">'+
'\<script\>var timeout'+this.user_widget_id+' = grab_data('+this.user_widget_id+','+this.refresh+',\''+this.widget+'\');\<\/script\>'+
'<header class="widget_header">'+this.title+'<button style="color: #ffffff" type="button" class="close close-widget" data-widget-id="'+this.user_widget_id+'" aria-label="Close"><span aria-hidden="true">&times;</span></button></header>'+
'<div class="widget_body" id="widget_body_'+this.user_widget_id+'">'+this.widget+'</div>'+
'</li>',
this.size_x, this.size_y, this.col, this.row
parseInt(this.size_x), parseInt(this.size_y), parseInt(this.col), parseInt(this.row)
);
});
$(document).on( "click", ".close-tile", function() {
var tile_id = $(this).data('tile-id');
$('a[name="place_widget"]').on('click', function(event, state) {
var widget_id = $(this).data('widget_id');
$.ajax({
type: 'POST',
url: '/ajax_form.php',
data: {type: "update-dashboard-config", sub_type: 'remove', tile_id: tile_id},
data: {type: "update-dashboard-config", sub_type: 'add', widget_id: widget_id},
dataType: "json",
success: function (data) {
if (data.status == 'ok') {
gridster.remove_widget($('#'+tile_id));
var widget_id = data.extra.widget_id;
var title = data.extra.title;
var widget = data.extra.widget;
var size_x = data.extra.size_x;
var size_y = data.extra.size_y;
gridster.add_widget(
'<li id="'+widget_id+'">'+
'\<script\>var timeout'+widget_id+' = grab_data('+widget_id+',60,\''+widget+'\');\<\/script\>'+
'<header class="widget_header">'+title+'<button type="button" class="close close-widget" data-widget-id="'+widget_id+'" aria-label="Close"><span aria-hidden="true">&times;</span></button></header>'+
'<div class="wiwdget_body" id="widget_body_'+widget_id+'">'+widget+'</div>'+
'</li>',
parseInt(size_x), parseInt(size_y)
);
$('#new-widget').popover('hide')
updatePos(gridster);
}
else {
@@ -156,40 +157,28 @@ $('#new-tile').popover();
});
});
$(document).on('change','#tile_id',function(){
var tile_id = $(this).val();
$(document).on( "click", ".close-widget", function() {
var widget_id = $(this).data('widget-id');
$.ajax({
type: 'POST',
url: '/ajax_form.php',
data: {type: "update-dashboard-config", sub_type: 'add', tile_id: tile_id},
data: {type: "update-dashboard-config", sub_type: 'remove', widget_id: widget_id},
dataType: "json",
success: function (data) {
if (data.status == 'ok') {
var item_id = data.extra.item_id;
var title = data.extra.title;
var content = data.extra.content;
var size_x = data.extra.size_x;
var size_y = data.extra.size_y;
gridster.add_widget(
'<li id="'+item_id+'">'+
'\<script\>var timeout'+item_id+' = grab_data('+item_id+',60,\''+content+'\');\<\/script\>'+
'<header class="tile_header">'+title+'<button type="button" class="close" data-tile-id="'+item_id+'" aria-label="Close"><span aria-hidden="true">&times;</span></button></header>'+
'<div class="tile_body" id="tile_body_'+item_id+'">'+content+'</div>'+
'</li>',
size_x, size_y
);
$('#new-tile').popover('hide')
updatePos(gridster);
}
else {
$("#message").html('<div class="alert alert-info">' + data.message + '</div>');
}
},
error: function () {
$("#message").html('<div class="alert alert-info">An error occurred.</div>');
}
});
});
if (data.status == 'ok') {
gridster.remove_widget($('#'+widget_id));
updatePos(gridster);
}
else {
$("#message").html('<div class="alert alert-info">' + data.message + '</div>');
}
},
error: function () {
$("#message").html('<div class="alert alert-info">An error occurred.</div>');
}
});
});
});
function grab_data(id,refresh,data_type) {
@@ -201,14 +190,14 @@ $('#new-tile').popover();
dataType: "json",
success: function (data) {
if (data.status == 'ok') {
$("#tile_body_"+id).html(data.html);
$("#widget_body_"+id).html(data.html);
}
else {
$("#tile_body_"+id).html('<div class="alert alert-info">' + data.message + '</div>');
$("#widget_body_"+id).html('<div class="alert alert-info">' + data.message + '</div>');
}
},
error: function () {
$("#tile_body_"+id).html('<div class="alert alert-info">Problem with backend</div>');
$("#widget_body_"+id).html('<div class="alert alert-info">Problem with backend</div>');
}
});
@@ -217,4 +206,6 @@ $('#new-tile').popover();
},
new_refresh);
}
$('#new-widget').popover();
</script>