API.Grid

그리드나 그에 관련된 설정에 관련된 기능들의 API입니다.

API 섹션에서 ple 이름으로 인스턴스 변수를 만들어 접근할 수 있다는걸 참고하세요.

getKeys

Get keys from grid.

• @param {String} mode : mode
• @param {Array} keys : block key
• @return {Object}

Usage

let keys = ple.api.grid.getKeys('all');
let keys = ple.api.grid.getKeys('selected');
let keys = ple.api.grid.getKeys('value', [0,2,4,6,8]);

getBlocks

Get blocks from grid.

• @param {String} mode : mode
• @param {Array} keys : block key
• @return {Object}

Usage

let blocks = ple.api.grid.getBlocks('all');
let blocks = ple.api.grid.getBlocks('selected');
let blocks = ple.api.grid.getBlocks('value', [0,2,4,6,8]);

shuffle

그리드의 블럭들을 무작위로 섞어줍니다.

• @param {Object} options
  • @param {Number} x
  • @param {Number} y
  • @param {Number} w
  • @param {Number} h

Usage

ple.api.grid.shuffle({ w: 3, h: 3 });

assignImages

이미지들을 그리드 블럭에 넣어줍니다.
그리드에서 선택한 블럭이 있다면 거기에 이미지가 들어가며 없으면 빈 블럭으로 이미지가 들어가고 빈 블럭이 없으면 블럭을 만들고 이미지를 넣습니다.

• param {Array} images

Usage

ple.api.grid.assignImages([
	'http://abc.com/image1.jpg',
	'http://abc.com/image2.jpg',
	'http://abc.com/image3.jpg'
]);

assignImage

특정 블럭에 이미지를 넣어줍니다.

• @param {Number} key
• @param {String} image

Usage

ple.api.grid.assignImage(0, 'http://abc.com/image3.jpg');

removeImages

블럭에 있는 이미지를 삭제합니다.

• @param {Array} keys

Usage

ple.api.grid.removeImages([0,1,2]);

add

Add blocks in grid.

• param {Array} blocks
  • param {Object} block : blocks in the blocks array
  • param {Object} block.layout : block layout { x, y, w, h }
  • param {String} block.color
  • param {Object} block.image : { position, size, src }

Usage

ple.api.grid.add([{
	layout: { w: 1, h: 1 },
	color: 'rgba(126,211,33,1)',
	image: {
		position: '50% 50%',
		size: 'cover',
		src: 'http://abc.com/image3.jpg'
	}
}]);

update

현재 블럭들에서 변경된 값들로 업데이트 합니다.

• param {Object} blocks

let blocks = ple.api.grid.getBlocks('selected');
Object.keys(blocks).forEach((k) => {
	blocks[k].color = 'rgba(126,211,33,1)';
});
ple.api.grid.update(blocks);

remove

Remove blocks.

• param {Array} keys

Usage

ple.api.grid.remove([0,1]);

select

Select blocks.

• param {Array} keys

Usage

ple.api.grid.select([0,2,3]);

unselect

Unselect blocks.

• param {Array} keys

Usage

ple.api.grid.unselect([2,3]);

toggleSelectAll

Select or unselect all blocks.

• param {Boolean} isSelect

Usage

ple.api.grid.toggleSelectAll();
ple.api.grid.toggleSelectAll(true);

duplicate

Duplicate block.

• param {Array} keys

Usage

ple.api.grid.duplicate([0,1,2]);

getPreference

Get grid preference values.

• return {Object}

Usage

let preference = ple.api.grid.getPreference();

setPreference

Attach grid preference values.

• param {Object} value
  • {Number} value.width : block size(width). default 100
  • {Number} value.height : block size(height). default 100
  • {Number} column: block column. default 5
  • {Number} outerMargin: default 10
  • {Number} innerMargin: default 10
  • {Boolean} freeMode: free position mode. default false
  • {String} bgColor: background group color. default rgba(255,255,255,1)

Usage

ple.api.grid.setPreference({
	width: 80,
	column: 6,
	innerMargin: 5,
});