feat(gridster): add ability to remove widgets via a clickable icon

[switchtrue]

Optionally, the gridster widget can be configured to display an icon at the top right of each widget which, when clicked, removes the widgets from the board.

[joshribakoff]

Hmm I think something like this is better left up to the user, and instead focus this lib on providing a better API. As a user I'm always going to want to customize the HTML (for example to add an "id" for each element via an html5 data attribute). I like that this stuff is left up to the user.

What I don't like is that a user I have to do stuff like:

// Sorting is necessary to prevent bugs in following "offset calculation" if not doing rows in order
s = Gridster.sort_by_row_and_col_asc(s);

Instead of adding new UI elements, I'd rather see the API cleaned up, so as a user I can add new UI elements on my own. Just my 2 cents from someone who only first used gridster 1 day ago.

[Bigismall]

You should use delegated events in removable method. Thanks to it removing elements will work with dynamically added elements.

Use this

   this.$el.on("click", "li ."+this.remove_handle_class, function(event) {
       if (ui.remove_enabled) {
           $player = $(event.target).closest('.gs-w');
           ui.remove_widget($player, ui.options.remove.silent, ui.options.remove.on_complete);
       }
   });

instead of that

   this.$el.find('li .' + this.remove_handle_class).click(function(event) {
       if (ui.remove_enabled) {
           $player = $(event.target).closest('.gs-w');
           ui.remove_widget($player, ui.options.remove.silent, ui.options.remove.on_complete);
       }
   });