Skip to main content
Version: 4.3.1

Migration Guide from v3 to v4

Changed Usage

Double options are combined into one option.

import { MasonryInfiniteGrid } from "@egjs/infinitegrid";

const ig = new MasonryInfiniteGrid(".container", {
attributePrefix: "data-grid-",
column: 5,
});

ig.renderItems();

HTML structure

  • The option called isOverflowScroll is renamed container.
  • If you set the container option to true, a container is created inside the wrapper.
    • The class name of container has been changed from _eg-infinitegrid-container_ to infinitegrid-container
<body>
<div class="wrapper">
<div class="infinitegrid-container">
<div>Item 1</div>
<div>Item 2</div>
<div>Item 3</div>
</div>
</div>
</body>
const ig = new InfiniteGrid(".container", {
container: true,
});

Changes when using umd modules

  • We've removed eg namespace on umd modules.
    • eg.InfiniteGrid is now just InfiniteGrid

Changed module names

FromTo
GridLayoutMasonryInfiniteGrid
JustifiedLayoutJustifiedInfiniteGrid
FrameLayoutFrameInfiniteGrid
SquareLayoutIntegration into MasonryInfiniteGrid
PackingLayoutPackingInfiniteGrid

Changed Options

  • Default value of attributePrefix is now data-grid- (was data-)
  • The option called margin is renamed gap.
  • The option called isOverflowScroll is renamed container.

Changed Events

  • The event called append is renamed requestAppend.
  • The event called prepend is renamed requestPrepend.
  • The event called layoutComplete is renamed renderComplete.
  • The event called change is renamed changeScroll.
  • The event called imageError is renamed contentError.

Changed Methods

  • The method called layout is renamed renderItems.
  • The method getItems(true) can be used as getItems().
  • The method getItems(false) can be used as getVisibleItems().
  • The usage of the getStatus method has changed.
    • getStatus(STATUS_TYPE.NOT_REMOVE)(default) gets all infos
    • getStatus(STATUS_TYPE.REMOVE_INVISIBLE_GROUPS) gets visible infos
    • getStatus(STATUS.MINIMIZE_INVISIBLE_ITEMS) gets visible infos. However, the information is simplified for invisible items.
    • getStatus(STATUS.MINIMIZE_INVISIBLE_GROUPS) gets visible infos. However, invisible items are removed and only the outline remains.

Removed Options

  • The option called transitionDuration is removed.

Removed Methods

  • The method called startLoading is removed.
    • Use a method called wait instead.
  • The method called endLoading is removed.
    • Automatically check whether loading is ended.
  • The method called isLoading is removed.
    • Use a method called isWait instead.
  • The method called isProcessing is removed.