ducksboard / gridster.js

gridster.js is a jQuery plugin that makes building intuitive draggable layouts from elements spanning multiple columns
http://gridster.net/
MIT License
6.04k stars 1.2k forks source link

Adding widgets from serialized doesn't correspond completely #424

Closed rept closed 10 years ago

rept commented 10 years ago

I have the following code:

  window.default_dashboard = [{"x":3,"y":1,"width":2,"height":39,"id":"hours_worked_per_week"},{"x":1,"y":40,"width":2,"height":39,"id":"top_project_list"},{"x":3,"y":40,"width":2,"height":22,"id":"uninvoiced"},{"x":1,"y":1,"width":2,"height":39,"id":"hours_worked_per_month"}]

  window.layout = undefined
  grid_size = ($('#layouts_grid').width() - 50) / (4)
  grid_margin = 4
  block_params =
    max_width: 6
    max_height: 6

  $ ->
    window.layout = $(".layouts_grid ul").gridster(
      widget_margins: [
        grid_margin
        grid_margin
      ]
      widget_base_dimensions: [
        grid_size
        2
      ]
      serialize_params: ($w, wgd) ->
        x: wgd.col
        y: wgd.row
        width: wgd.size_x
        height: wgd.size_y
        id: $($w).attr("data-id")
        name: $($w).find(".block_name").html()

      min_rows: block_params.max_height
    ).data("gridster")

    return

  $.each window.default_dashboard, ->
    layout.add_widget "<li class=\"layout_block gs-w\" data-id=\"" + @id + "\"/>", @width, @height, @x, @y
    return

However when rendered, 2 are overlapping. When I ask gridster to serialize again I'm getting this:

{"x":3,"y":1,"width":2,"height":39,"id":"hours_worked_per_week"},{"x":1,"y":40,"width":2,"height":39,"id":"top_project_list"},{"x":3,"y":7,"width":2,"height":22,"id":"uninvoiced"},{"x":1,"y":1,"width":2,"height":39,"id":"hours_worked_per_month"}]

For some reason the uninvoiced is getting y: 7 instead of y: 40 as was specified. If I change the y manually in the browser it of course displays correctly. Where is this being change under way?

rept commented 10 years ago

Duh! min_rows was set to 6

Increasing this solved this problem.