Jump to content

Update "Getting Started" guide


Atrodilla
 Share

Recommended Posts

I'm following the Phaser guide over at http://phaser.io/getting-started-js.php

 

Unfortunately, I'm a bit stuck on Step 3. The docs folder doesn't contain a "Hello World" folder.

 

I tried copying the examples folder into my hellophaser folder within my WAMP Server's www directory, thinking that it might be the new place where all the examples live. Sadly, nothing seems to show up when I access localhost/hellophaser/index.html

 

Any help would be greatly appreciated. I really want to try this framework out, it looks like it could be perfect for my needs!

Link to comment
Share on other sites

  • 3 weeks later...

I noticed I couldn't find it either. I looked into the phaser-master/examples/_site folder, noticed its view_full.html file was linking to all of the .js files from the phaser-master/src folder, so i:

  1. grabbed the phaser-master/src folder and placed it into the MAMP htdocs that I had already setup.
  2. copied the phaser-logo-small.png image (renamed it to just logo.png) and placed that into an assets folder within my htdocs
  3. created an index.html file that looks like this: 
<!doctype html><html>    <head>        <meta charset="UTF-8" />        <title>phaser</title>                <!--            If you're wondering why we embed each script separately, and not just the single-file phaser lib            it's because it makes debugging *significantly* easier for us. Feel free to replace all the below            with just a call to ../dist/phaser.js instead if you prefer.        -->        <script src="src/Intro.js"></script>        <script src="src/pixi/Pixi.js"></script>        <script src="src/Phaser.js"></script>        <script src="src/utils/Utils.js"></script>        <script src="src/pixi/core/Matrix.js"></script>        <script src="src/pixi/core/Point.js"></script>        <script src="src/pixi/core/Rectangle.js"></script>        <script src="src/pixi/display/DisplayObject.js"></script>        <script src="src/pixi/display/DisplayObjectContainer.js"></script>        <script src="src/pixi/display/Sprite.js"></script>        <script src="src/pixi/display/Stage.js"></script>        <script src="src/pixi/extras/CustomRenderable.js"></script>        <script src="src/pixi/extras/Strip.js"></script>        <script src="src/pixi/extras/Rope.js"></script>        <script src="src/pixi/extras/TilingSprite.js"></script>        <script src="src/pixi/filters/FilterBlock.js"></script>        <script src="src/pixi/filters/MaskFilter.js"></script>        <script src="src/pixi/primitives/Graphics.js"></script>        <script src="src/pixi/renderers/canvas/CanvasGraphics.js"></script>        <script src="src/pixi/renderers/canvas/CanvasRenderer.js"></script>        <script src="src/pixi/renderers/webgl/WebGLBatch.js"></script>        <script src="src/pixi/renderers/webgl/WebGLGraphics.js"></script>        <script src="src/pixi/renderers/webgl/WebGLRenderer.js"></script>        <script src="src/pixi/renderers/webgl/WebGLRenderGroup.js"></script>        <script src="src/pixi/renderers/webgl/WebGLShaders.js"></script>        <script src="src/pixi/text/BitmapText.js"></script>        <script src="src/pixi/text/Text.js"></script>        <script src="src/pixi/textures/BaseTexture.js"></script>        <script src="src/pixi/textures/Texture.js"></script>        <script src="src/pixi/textures/RenderTexture.js"></script>        <script src="src/pixi/utils/EventTarget.js"></script>        <script src="src/pixi/utils/Polyk.js"></script>        <script src="src/core/Camera.js"></script>        <script src="src/core/State.js"></script>        <script src="src/core/StateManager.js"></script>        <script src="src/core/LinkedList.js"></script>        <script src="src/core/Signal.js"></script>        <script src="src/core/SignalBinding.js"></script>        <script src="src/core/Plugin.js"></script>        <script src="src/core/PluginManager.js"></script>        <script src="src/core/Stage.js"></script>        <script src="src/core/Group.js"></script>        <script src="src/core/World.js"></script>        <script src="src/core/Game.js"></script>        <script src="src/input/Input.js"></script>        <script src="src/input/Key.js"></script>        <script src="src/input/Keyboard.js"></script>        <script src="src/input/Mouse.js"></script>        <script src="src/input/MSPointer.js"></script>        <script src="src/input/Pointer.js"></script>        <script src="src/input/Touch.js"></script>        <script src="src/input/InputHandler.js"></script>        <script src="src/gameobjects/Events.js"></script>        <script src="src/gameobjects/GameObjectFactory.js"></script>        <script src="src/gameobjects/Sprite.js"></script>        <script src="src/gameobjects/TileSprite.js"></script>        <script src="src/gameobjects/Text.js"></script>        <script src="src/gameobjects/BitmapText.js"></script>        <script src="src/gameobjects/Button.js"></script>        <script src="src/gameobjects/Graphics.js"></script>        <script src="src/gameobjects/RenderTexture.js"></script>        <script src="src/system/Canvas.js"></script>        <script src="src/system/StageScaleMode.js"></script>        <script src="src/system/Device.js"></script>        <script src="src/system/RequestAnimationFrame.js"></script>        <script src="src/math/RandomDataGenerator.js"></script>        <script src="src/math/Math.js"></script>        <script src="src/math/QuadTree.js"></script>        <script src="src/geom/Circle.js"></script>        <script src="src/geom/Point.js"></script>        <script src="src/geom/Rectangle.js"></script>        <script src="src/net/Net.js"></script>        <script src="src/tween/TweenManager.js"></script>        <script src="src/tween/Tween.js"></script>        <script src="src/tween/Easing.js"></script>        <script src="src/time/Time.js"></script>        <script src="src/animation/AnimationManager.js"></script>        <script src="src/animation/Animation.js"></script>        <script src="src/animation/Frame.js"></script>        <script src="src/animation/FrameData.js"></script>        <script src="src/animation/AnimationParser.js"></script>        <script src="src/loader/Cache.js"></script>        <script src="src/loader/Loader.js"></script>        <script src="src/loader/LoaderParser.js"></script>        <script src="src/sound/Sound.js"></script>        <script src="src/sound/SoundManager.js"></script>        <script src="src/utils/Debug.js"></script>        <script src="src/utils/Color.js"></script>        <script src="src/physics/arcade/ArcadePhysics.js"></script>        <script src="src/physics/arcade/Body.js"></script>        <script src="src/particles/Particles.js"></script>        <script src="src/particles/arcade/ArcadeParticles.js"></script>        <script src="src/particles/arcade/Emitter.js"></script>        <script src="src/tilemap/Tile.js"></script>        <script src="src/tilemap/Tilemap.js"></script>        <script src="src/tilemap/TilemapLayer.js"></script>        <script src="src/tilemap/TilemapParser.js"></script>        <script src="src/tilemap/Tileset.js"></script>        <script src="src/PixiPatch.js"></script>                <script type="text/javascript">    var game = new Phaser.Game(800, 600, Phaser.AUTO, '', { preload: preload, create: create, update: update });    function preload() {        game.load.image('logo', 'assets/logo.png');            }        var logo;        function create() {        logo = game.add.sprite(0,0, 'logo');    }    function update () {    }</script>           </head>    </html>

Worked like a charm. 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...