Parsing Texturepacker Output - HTML5 Game Development Udacity English (auto-generated) English

Parsing Texturepacker Output - HTML5 Game DevelopmentYouTube↗ IA↗(long shot)
Education 11.9K views 10 likes 4 dislikes 23 Feb 2015

Udacity 651K subscribers United States YouTube↗

Click to Play Video

our solution for parsing the Atlas definition is pretty straightforward

>> Our solution for parsing the atlas definition is pretty straightforward.

first we're given Atlas JSON data that's been loaded from an xhr request the

First, we're given atlasJSON data that's been loaded from an xhr request. The

first step that we need to do is actually go through and call json.parse

first step that we need to do is actually go through and call JSON.parse on

on that this will turn the text JSON data into an actual JavaScript object

that. This will turn the text JSON data into an actual JavaScript object with

with members and values that we can iterate over we use this to effect here

members and values that we can iterate over. We use this to affect here. The

the parse the object has a frames dictionary that will actually iterate

parsed object has a frames dictionary that we'll actually iterate over to load

over to load all of our sprites we'd like to fetch each key inside of our

all of our sprites. We'd like to fetch each key inside of our dictionary. And

dictionary and then fetch the Associated sprite object that comes with it

then, fetch the associated sprite object that comes with it. From here, we now

from here we now have the sprite name and effectively the sprite values the

have the sprite name and effectively, the sprite values. The next step we take

next step we take here is to actually define the center of the image so we

here is to actually define the center of the image. So, we actually multiply the

actually multiply the width and the height times 0.5 which would give us the

width and the height times 0.5, which would give us the half width and half

half width and half height now we store this value in a CX and CY is a negative

height. Now, we store this value in the cx and cy as a negative offset. The

offset the reason for this is it will use the CX and CY values a little later

reason for this is that we'll use the cx and cy values a little later on, during

on during rendering to transform our object into proper space we store them

rendering, to transform our object into proper space. We store them as negatives

as negatives here so that we don't have to do the mathematics later on when

here so that we don't have to do the mathematics later on when we're drawing the

we're drawing the image once we've got this data we go ahead forward and call

image. Once we've got this data, we go ahead forward and call the defSprite

the DEF sprite function passing in the image name as a key and then the frame X

function, passing in the image name as a key. And then, the frame.x, frame.y

frame Y width height and center data that you've already seen before

with height and center data that you've already seen before.

Similar videos:

Course Introduction - HTML5 Game Development
Udacity
95.5K views 413 likes 14 dislikes 23 Feb 2015100% match

Specifying the Contact Listener - HTML5 Game Development
Udacity
660 views 2 likes 0 dislikes 23 Feb 2015100% match

How to bleach the yellowish plastic from a microwave, rack or other appliance
Artistea Restaura y Crea
977 views 14 likes 0 dislikes 27 Aug 202056% match

Google+ pages
Google+
463.5K views 3K likes 1.6K dislikes 15 May 201355% match

Como pintar y restaurar🚪puerta madera exterior
That, Dad fix it
194.1K views 1.6K likes 140 dislikes 18 Aug 201755% match

Team SAHARRA_ Semi-autonomous hair removal robot assistant
KUKA - Robots & Automation
1.2K views 44 likes 1 dislikes 19 Nov 202055% match

Как вырастить кристалл из сахара! Опыты для детей!
Young Alhimik
1.9M views 37K likes 5.3K dislikes 30 May 201654% match

Как вырастить кристаллы из лимонной кислоты! Опыты и эксперименты!
Young Alhimik
756.9K views 21.1K likes 1.4K dislikes 16 Sep 201654% match

iPhone XR Does not recognize SIM
MovilOne Mobile repair
3.2K views 269 likes 5 dislikes 05 Aug 202053% match

Streetfighter: Captain America vs a CAR! (BONUS STAGE IN REAL LIFE)
Hacksmith Industries
2.8M views 38.4K likes 1.6K dislikes 09 Aug 201853% match

How to take Screenshots in Windows 10 - How to Print Screen in Windows 10
Lurgs How To Guides
2.6M views 9.1K likes 1.3K dislikes 25 Jul 201753% match

Desmontar Samsung Note 8
MovilOne Mobile repair
2.2K views 156 likes 4 dislikes 12 Oct 202053% match

MP Swim Tips by Bob Bowman Breast Kick Kick Pull
SwimSwam
784 views 14 likes 0 dislikes 11 Jan 201753% match

Sacar humo de los dedos, cómo se hace | Te Digo Cómo
Te Digo Cómo
18.3M views 165.8K likes 12K dislikes 10 May 201353% match

☑️ Fácil de Hacer CARRETE de PESCA BARATO!!!
NES QUIN
319.6K views 2.1K likes 229 dislikes 12 Jan 201653% match

Change Screen Huawei Mate 20 Pro
MovilOne Mobile repair
2.6K views 227 likes 3 dislikes 07 Aug 202053% match

Collage with tactile textures and visual textures, picture or drawing tactile and visual texture
Artistea Restaura y Crea
827 views 21 likes 3 dislikes 10 Jun 202052% match

PATATINE FRITTE sempre PERFETTE e CROCCANTI [2 TRUCCHI!] | FoodVlogger
Carlo Gaiano
18.9K views 897 likes 18 dislikes 31 Oct 202052% match

Desmontar Samsung A90 5G
MovilOne Mobile repair
3K views 181 likes 0 dislikes 01 Dec 202051% match

بسكويت التركي الناعم بالفانيلا والشوكولاته بدون قالب ولا طابع بتدوب في الفم مع رباح ( الحلقة 564 )
My special recipes for cooking with Rabah Mohammed
264.9K views 9K likes 0 dislikes 01 Jun 201851% match

How to Make Palazzo Pants | Teach Me Fashion
TeachMeFashion
221.1K views 1.1K likes 68 dislikes 20 Dec 201451% match

黄瓜我家很少凉拌吃，都是炝着吃，一次做一盆，开胃解腻又下饭！【阿胖面食】
Apang pasta
179.2K views 0 likes 0 dislikes 11 Jan 202051% match

Spicy Acid Fish (Asam Pedas) | The Most Easy and Simple Padang (Indonesia) Cuisine
Sri Harmanita
2.8K views 113 likes 0 dislikes 05 Jul 202051% match

Xiaomi Mi 9T Pro No Carga Cambiar modulo de carga
MovilOne Mobile repair
2.4K views 190 likes 7 dislikes 25 Sep 202051% match

0 views 0 likes -1 dislikes 07 Jun 202651% match

How to play Guitar. # 5 Fingering exercise 2.दूसरा अंग. تمرين بالإصبع الثاني How to play Guitar.
Grimaldo Records
815 views 22 likes 1 dislikes 23 Apr 202051% match

Desmontar LG K61
MovilOne Mobile repair
3.4K views 135 likes 0 dislikes 01 Sep 202051% match

Xperia XZ1 NOT CHARGING - Change Charging Connector
MovilOne Mobile repair
3.9K views 201 likes 4 dislikes 27 Jun 202051% match

用笋壳鱼煲的鱼汤，记住这2点，鱼汤浓如牛奶，鱼肉鲜嫩带甜味
 高大炮
756 views 15 likes 0 dislikes 22 Jul 202051% match

Peanut Butter Fudge – Low Carb Keto Dessert Recipe
Papa G's Low Carb Recipes
311.4K views 11K likes 200 dislikes 13 May 202051% match

Settings Privacy About Contact Donate