All Projects → webcaetano → craft

webcaetano / craft

Licence: MIT license
Phaser Library with utility chainable functions

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to craft

phaser-particle-editor-plugin
This plugin creates particles based on JSON data generated by Phaser Particle Editor
Stars: ✭ 28 (+3.7%)
Mutual labels:  phaser, phaserjs, phaser-plugin
Phaser
Phaser is a fun, free and fast 2D game framework for making HTML5 games for desktop and mobile web browsers, supporting Canvas and WebGL rendering.
Stars: ✭ 30,918 (+114411.11%)
Mutual labels:  phaser, phaserjs
Webpack Starter Basic
A simple webpack starter project for your basic modern web development needs.
Stars: ✭ 552 (+1944.44%)
Mutual labels:  phaser, phaserjs
Phaser Examples
🎮 Game collections made by Phaser
Stars: ✭ 140 (+418.52%)
Mutual labels:  phaser, phaserjs
phaser-plugin-advanced-timing
Shows FPS, frame intervals, and performance info. Phaser 2/CE
Stars: ✭ 25 (-7.41%)
Mutual labels:  phaser, phaser-plugin
Opensc2k
OpenSC2K - An Open Source remake of Sim City 2000 by Maxis
Stars: ✭ 4,753 (+17503.7%)
Mutual labels:  phaser, phaserjs
Phaser Kinetic Scrolling Plugin
Kinetic Scrolling plugin for Canvas using Phaser Framework
Stars: ✭ 117 (+333.33%)
Mutual labels:  phaser, phaserjs
phaser-3-palette-swapping-example
Example of using palette swapping on a spritesheet in Phaser 3.
Stars: ✭ 32 (+18.52%)
Mutual labels:  phaser, phaserjs
Slither.io Clone
Learn how to make Slither.io with JavaScript and Phaser! This game clones all the core features of Slither.io, including mouse-following controls, snake collisions, food, snake growth, eyes, and more. Progress through each part of the source code with our Slither.io tutorial series.
Stars: ✭ 168 (+522.22%)
Mutual labels:  phaser, phaserjs
Phaser State Transition
State transition plugin for Phaser.js
Stars: ✭ 169 (+525.93%)
Mutual labels:  phaser, phaserjs
Phaser Ui Tools
Functions for creating a UI in Phaser. Rows, columns, viewports, scrollbars, stuff like that.
Stars: ✭ 187 (+592.59%)
Mutual labels:  phaser, phaserjs
Phaser3 Docs
Phaser 3 Documentation and TypeScript Defs
Stars: ✭ 339 (+1155.56%)
Mutual labels:  phaser, phaserjs
Generator Phaser
A yeoman generator for phaser games
Stars: ✭ 255 (+844.44%)
Mutual labels:  phaser, phaserjs
generator-phaser-browserify
A generator for Phaser using Gulp and Browserify
Stars: ✭ 36 (+33.33%)
Mutual labels:  phaser, phaserjs
dungeonz
Everything for the game Rogueworld.
Stars: ✭ 88 (+225.93%)
Mutual labels:  phaser, phaserjs
Phaser Node Kit
Rapid Game Development with PhaserJS and Node for Modern Browsers
Stars: ✭ 39 (+44.44%)
Mutual labels:  phaser, phaserjs
blocker
🎮 (WIP - phase 3) Multiplayer online game using Phaser + WebSocket (Socket.IO)
Stars: ✭ 48 (+77.78%)
Mutual labels:  phaser, phaserjs
phaser-responsive
Adds a set of responsive objects to Phaser that can be pinned to
Stars: ✭ 25 (-7.41%)
Mutual labels:  phaser, phaser-plugin
Ion Phaser
A web component to use Phaser Framework with Angular, React, Vue, etc 🎮
Stars: ✭ 152 (+462.96%)
Mutual labels:  phaser, phaserjs
phaser-plugin-scene-graph
Prints the display tree. Phaser 2/CE
Stars: ✭ 32 (+18.52%)
Mutual labels:  phaser, phaser-plugin

File Size npm Bower version

phaser craft logo

Craft

Phaser Library with utility chainable functions
Exported as a UMD module. (accept global, es6, webpack, browserify)

Installation

npm install phaser-craft
bower install phaser-craft --save

Examples

Example1

var craft = require('phaser-craft')(game); // you also can call craft via global var

var group = craft.$g(); //create group

var sprite = craft.$sprite('phaserDude') //create sprite with key
.$set({ // change attributes
	x:100,
	y:100
})
.$mid() // change anchor to center
.$tint('#FF0000') // change color
.$into(group); // insert into group

//You can keep using Phaser
sprite.x = 150;

//You can use the prototypes without a chain
sprite.$set({
	y:150
});

Example2

// var craft = craft(game); // global
// import $craft from 'phaser-craft'; var craft = $craft(game); // ES6
var craft = require('phaser-craft')(game); // requireJS

var group = craft.$g(); //create group

var rect = craft.$rect({ //create rectangle
	width:200,
	height:150,
	fill:'#9517C5', //setup retancle fill color
})
.$align('center','center') // align it to center 
.$into(group) // insert into group 


var ball = craft.$circle({ //create circle
	fill:'#ffffff',
	size:100 // radius
}).$set({ // change attributes
	x:150,
	y:150,
})
.$into(group) // insert into group 

var d = craft.$d().$copyPos(ball); // create a dot and copy position of ball

Documentation

http://webcaetano.github.io/craft

Development

Clone the repo https://github.com/webcaetano/craft-examples
On craft-examples npm install and gulp
On craft npm install and npm run start

To create a production version npm run build

Important: Ensure that both repos live at the same depth in your directory structure. For example: /usr/home/web/craft-examples and /usr/home/web/craft. This is so the dev build scripts in the Craft repo can safely copy files to ../craft-examples, and they end up in the correct place.

See Also

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].