add resize_widget_dimensions() to change widget dimensions after gridster initialization

hrosenbauer commented 10 years ago

(this is a updated version of my first pull-request - now in a separate branch) (this pull request is based on the discussion of https://github.com/ducksboard/gridster.js/pull/77 and the code of https://gist.github.com/OwlyCode/6421823 with small changes, so most of the credits go to https://github.com/OwlyCode)

This will add resize_widget_dimensions() to gridster.js which allows to resize the widget dimensions after initialization:

// initialize gridster with 200x200px widgets using a 5px margin
var gridster = $('.gridster ul').gridster({
    widget_base_dimensions: [200, 200],
    widget_margins: [5, 5]
}).data('gridster');

// resize the widgets to 300x300px and 10px margin
gridster.resize_widget_dimensions({
    widget_base_dimensions: [300, 300],
    widget_margins: [10, 10]
});

It's very useful to resize the dashboard when the browser window is resized.

skozz commented 10 years ago

+1

dlabaj commented 10 years ago

Exactly what we needed.

dlabaj commented 10 years ago

Found one potential issue. After the grid has been render to the DOM and is showing on the web page, I am listening for when the browser window is resized. If I set the max_cols value (in my case 2), and don't set autogrow_cols to true when all the widgets are moved to the first column, you can't move them back to the second column. Other than that everything else has been working great.