dynamic collumns

When the number of columns is dynamically changed, the columns are not dynamically rearranged. Is there an option to order the gridster reorganize?

The code:

  // Define o tamanho da coluna na grid de widgets
    var colWidth = 400;

    // Define a quantidade de colunas na grid pelo tamanho da janela do browser
    var window = angular.element($window);
    var columns = Math.floor(window.width() / colWidth);

    // Calcula a quantidade de colunas na grid dinamicamente
    window.bind('resize', function () {
        columns = Math.floor(window.width() / colWidth);
        $scope.gridOptions.columns = columns;
        $scope.$apply();
    });

    // Configurações da grid de widgets
    $scope.gridOptions = {
        columns: columns,
        colWidth: colWidth,
        rowHeight: 360,
        margins: [50,20],
        resizable: {
            enabled: false
        },
        draggable: {
            enabled: true,
            handle: 'header'
        }
    };

[arkabide]

Maybe it’s to late for you guys but it may be helpful for others. I came across the same need so I went ahead and implemented it in this branch of my fork: https://github.com/arkabide/angular-gridster/tree/dynamic-colums

Feature can be turned on/off with a new gridster property ‘dynamicColumns’ (boolean). I also needed a minimum width to trigger a column rearrangement so I added another property called ‘minWidthToAddANewColumn’ (not the best name, feel free to change it).

Live demo: https://cdn.rawgit.com/arkabide/angular-gridster/dynamic-colums/index.html

Click on “Enable Dynamic Columns” and resize the window to see the columns dynamically rearrange.

[groobybugs]

@arkabide man, never it’s too late, THANKS! 😃 👍