dashboard: add a 6 columns option

5 doesn't work because bootstrap works on layouts based
on 12, so we can only have 1, 2, 3, 4, 6, 12...
This commit is contained in:
Franco Fichtner 2018-07-14 08:41:23 +00:00
parent 24f1d05c77
commit 893e9cf0f4
2 changed files with 25 additions and 22 deletions

View File

@ -189,10 +189,11 @@ if($need_alert_display == true) {
<a href="#" id="updatepref" style="display:none" onclick="return updatePref();" class="btn btn-primary"><?=gettext("Save Settings");?></a>
<button id="add_widget_btn" type="button" class="btn btn-default" data-toggle="modal" data-target="#modal_widgets"><i class="fa fa-plus-circle fa-fw"></i> <?= gettext('Add widget') ?></button>
<select class="selectpicker" data-width="120px" id="column_count">
<option value="1" <?=$pconfig['column_count'] == "1" ? 'selected="selected"' : "";?>><?=gettext("1 column");?></option>
<option value="2" <?=$pconfig['column_count'] == "2" ? 'selected="selected"' : "";?>><?=gettext("2 columns");?></option>
<option value="3" <?=$pconfig['column_count'] == "3" ? 'selected="selected"' : "";?>><?=gettext("3 columns");?></option>
<option value="4" <?=$pconfig['column_count'] == "4" ? 'selected="selected"' : "";?>><?=gettext("4 columns");?></option>
<option value="1" <?=$pconfig['column_count'] == "1" ? 'selected="selected"' : "";?>><?= gettext('1 column');?></option>
<option value="2" <?=$pconfig['column_count'] == "2" ? 'selected="selected"' : "";?>><?= sprintf(gettext('%s columns'), '2') ?></option>
<option value="3" <?=$pconfig['column_count'] == "3" ? 'selected="selected"' : "";?>><?= sprintf(gettext('%s columns'), '3') ?></option>
<option value="4" <?=$pconfig['column_count'] == "4" ? 'selected="selected"' : "";?>><?= sprintf(gettext('%s columns'), '4') ?></option>
<option value="6" <?=$pconfig['column_count'] == "6" ? 'selected="selected"' : "";?>><?= sprintf(gettext('%s columns'), '6') ?></option>
</select>
<?php endif; ?>
</form>

View File

@ -290,16 +290,16 @@ include("fbegin.inc");?>
if ($("#column_count_input").val() != $("#column_count").val()) {
showSave();
}
$("#column_count_input").val($("#column_count").val());
$(".dashboard_grid_column").each(function(){
var widget_col = $(this);
$.each(widget_col.attr("class").split(' '), function(index, classname) {
if (classname.indexOf('col-md') > -1) {
widget_col.removeClass(classname);
}
});
widget_col.addClass('col-md-'+(12 / $("#column_count_input").val()));
});
$("#column_count_input").val($("#column_count").val());
$(".dashboard_grid_column").each(function(){
var widget_col = $(this);
$.each(widget_col.attr("class").split(' '), function(index, classname) {
if (classname.indexOf('col-md') > -1) {
widget_col.removeClass(classname);
}
});
widget_col.addClass('col-md-'+(12 / $("#column_count_input").val()));
});
});
$("#column_count").change();
// trigger initial ajax data poller
@ -335,7 +335,7 @@ include("fbegin.inc");?>
</div>
</div>
<div id="dashboard_container" class="row" style="display:none">
<div class="col-xs-12 col-md-4 dashboard_grid_column hidden" id="dashboard_colx">
<div class="col-xs-12 col-md-2 dashboard_grid_column hidden" id="dashboard_colx">
<?php
foreach ($widgetCollection as $widgetItem):
@ -413,13 +413,15 @@ include("fbegin.inc");?>
<?php
endforeach;?>
</div>
<div class="col-md-4 dashboard_grid_column" id="dashboard_col1"></div>
<div class="col-md-4 dashboard_grid_column" id="dashboard_col2"></div>
<div class="col-md-4 dashboard_grid_column" id="dashboard_col3"></div>
<div class="col-md-4 dashboard_grid_column" id="dashboard_col4"></div>
<div class="col-md-2 dashboard_grid_column" id="dashboard_col1"></div>
<div class="col-md-2 dashboard_grid_column" id="dashboard_col2"></div>
<div class="col-md-2 dashboard_grid_column" id="dashboard_col3"></div>
<div class="col-md-2 dashboard_grid_column" id="dashboard_col4"></div>
<div class="col-md-2 dashboard_grid_column" id="dashboard_col5"></div>
<div class="col-md-2 dashboard_grid_column" id="dashboard_col6"></div>
</div>
</div>
</section>
<?php
endif;
include("foot.inc");?>
<?php endif;
include("foot.inc");