SekibOmazic / so-dashboard

MIT License
0 stars 0 forks source link

feature requests #1

Open leblancmeneses opened 10 years ago

leblancmeneses commented 10 years ago

You mentioned here that you created DnR implementation. https://github.com/SekibOmazic/so-dashboard/blob/master/src/angular-gridster.js

features that are great in jquery resize: 1) ability to set individual resize constraints at runtime based on the item being resized (max resize, min resize, aspect ratio preservation - (fyi aspect ratio does not work at the item level in ManifestWebDesign/angular-gridster) ) 2) during resize provide dataItem as property in uiWidget. var dataItem = angular.element($element).scope().item; 3) rather than $rootScope.$broadcast use item specific scope and .$broadcast

Here is my current implementation of my ng-controller using ManifestWebDesign's version:

            resizable: {
                enabled: true,
                aspectRatio:true,
                start: function (event, uiWidget, $element) {
                    var gridsterItemScope = angular.element($element).scope();
                    var dataItem = gridsterItemScope.item;
                    ($element).resizable("option", "minWidth", (dataItem.DashboardModuleWidget.SizeX * 140) - 10);
                    ($element).resizable("option", "minHeight", (dataItem.DashboardModuleWidget.SizeY * 140) - 10);

                    if (dataItem.DashboardModuleWidget.MaxSizeX != null) {
                        ($element).resizable("option", "maxWidth", (dataItem.DashboardModuleWidget.MaxSizeX * 140) -10);
                        }
                    if (dataItem.DashboardModuleWidget.MaxSizeY != null) {
                        ($element).resizable("option", "maxHeight", (dataItem.DashboardModuleWidget.MaxSizeY * 140) - 10);
                    }
                },
                stop: function (event, uiWidget, $element) {
                        updateItemsPosition();

                        //if no change to size do not broadcast
                        if (uiWidget.originalSize.width != uiWidget.size.width
                        || uiWidget.originalSize.height != uiWidget.size.height) {
                        var gridsterItemScope = angular.element($element).scope();
                        gridsterItemScope.$broadcast('resizestop', arguments);
                    }
                }
            },
            draggable: {
                enabled: true,
                handle: 'div.panel-heading',
                stop: function () {
                    updateItemsPosition();
                }
            },

The last user suggestion I need also is: https://github.com/ManifestWebDesign/angular-gridster/issues/103

SekibOmazic commented 10 years ago

@leblancmeneses I'm not sure if I really understood your points, but regarding 2) and 3) the callback method gets invoked on mouse stop with event, jqLite element and item's model (widget). Just look at dashboard/script.js lines 11 and 18. From there you can fire $broadcast if needed.

Regarding point 1) setting constraints per item (max resize and similar) is feasible but my intension was not to make another full-blown DnR (jQuery-ui already does the great job).