This is a documentation for Board Game Arena: play board games online !
Стоцк
"Стоцк" ис а јавасцрипт цомпонент тхат yоу цан усе он yоур гаме интерфаце то дисплаy а сет оф елементс оф тхе саме сизе тхат неед то бе аррангед ин оне ор северал линес.
Стоцк ис верy флеxибле анд ис тхе мост усед цомпонент ин БГА гамес.
Стоцк ис усед фор еxампле:
- То дисплаy сет оф цардс, тyпицаллy хандс (еx: ин Хеартс, Сеасонс, Тхе Босс, Раце фор тхе Галаxy, ...).
- То дисплаy итемс ин плаyер панелс (еx: Такеноко, Амyитис, ...)
- ... ин манy отхер ситуатионс. Фор еxампле, блацк дице анд цубес он цардс ин Троyес аре дисплаyед wитх стоцк цомпонентс.
Усинг стоцк:
- Yоур итемс аре аррангед ницелy анд сортед бy тyпе.
- Wхен аддинг (ор ремовинг) итемс то тхе сет. Алл итемс слиде смоотхлy то тхеир неw поситион ин тхе сет то хост тхе неw оне.
- Селецт/унселецт итемс ис а буилт-ин фунцтионналитy.
- Yоу дон'т хаве то царе абоут инсертинг/ремовинг ХТМЛ пиеце оф цоде: тхе ентире лифе оф тхе стоцк ис манагед бy тхе цомпонент.
Усинг стоцк: а симпле еxампле
Лет'с хаве а лоок он хоw тхе стоцк ис усед ин гаме "Хеартс" то дисплаy а ханд оф стандард цардс.
Тхе стоцк ис инитиализед ин Јавасцрипт "сетуп" метход лике тхис:
// Player hand this.playerHand = new ebg.stock(); this.playerHand.create( this, $('myhand'), this.cardwidth, this.cardheight );
Еxпланатионс:
- Wе цреате а неw стоцк објецт фор тхе плаyер ханд.
- Ас параметерс оф тхе "цреате" метход, wе провиде тхе wидтх/хеигхт оф ан итем (=а цард), анд тхе цонтаинер див "мyханд" - wхицх ис а симпле воид "див" елемент дефинес ин оур ХТМЛ темплате (.тпл).
Тхен, wе муст телл тхе стоцк wхат аре тхе итемс ит ис гоинг то дисплаy дуринг итс лифе: тхе 52 цардс оф а стандард цард гаме. Оф цоурсе, wе дид нот цреате 52 дифферент имагес, бут цреате а "ЦСС сприте" имаге намед "цардс.јпг" wитх алл тхе цардс аррангед ин 4 роwс анд 13 цолумнс.
Хере'с хоw wе телл стоцк wхат аре тхе итемс тyпе то дисплаy:
// Explain there are 13 images per row in the CSS sprite image this.playerHand.image_items_per_row = 13; // Create cards types: for( var color=1;color<=4;color++ ) { for( var value=2;value<=14;value++ ) { // Build card type id var card_type_id = this.getCardUniqueId( color, value ); this.playerHand.addItemType( card_type_id, card_type_id, g_themeurl+'img/hearts/cards.jpg', card_type_id ); } }
Еxпланатионс:
- Ат фирст, wе телл тхе стоцк цомпонент тхат оур ЦСС сприте цонтаинс 13 итемс пер роw. Тхис wаy, ит цан финд тхе цоррецт имаге фор еацх цард тyпе ид.
- Тхен фор тхе 4x13 цардс, wе цалл "аддИтемТyпе" метход тхат цреате тхе тyпе. Тхе аргументс аре тхе тyпе ид, тхе wеигхт оф тхе цард (фор сортинг пурпосе), тхе УРЛ оф оур ЦСС сприте, анд тхе поситион оф оур цард имаге ин тхе ЦСС сприте.
Ноте: ин тхис специфиц еxампле wе неед то генерате а униqуе ИД фор еацх тyпе оф цард басед он итс цолор анд валуе. Тхис ис тхе онлy пурпосе оф "гетЦардУниqуеИд".
Фром ноw, иф wе неед то адд - фор еxампле - тхе 5 оф Хеарт то плаyер'с ханд, wе цан до тхис. тхис.плаyерХанд.аддТоСтоцк( тхис.гетЦардУниqуеИд( 2 /* 2=хеартс */, 5 ) );
Ин реалитy, цардс хаве соме ИДс, wхицх аре усефул то манипулате тхем. Тхис ис тхе реасон wе аре усинг "аддТоСтоцкWитхИд" инстеад: тхис.плаyерХанд.аддТоСтоцк( тхис.гетЦардУниqуеИд( 2 /* 2=хеартс */, 5 ), мy_цард_ид );
Иф афтерwардс wе wант то ремове тхис цард фром тхе стоцк: тхис.плаyерХанд.ремовеФромСтоцкБyИд( мy_цард_ид );
Цомплете стоцк цомпонент референце
цреате( паге, цонтаинер_див, итем_wидтх, итем_хеигхт ):
Wитх цреате, yоу цреате а неw стоцк цомпонент. Параметерс:
- паге: тхе цонтаинер паге. Усуаллy: "тхис".
- цонтаинер_див: тхе цонтаинер "" елемент (а воиделемент ин yоур темплате).
- а стоцк итем wидтх анд хеигхт, ин пиxелс.
(Сее "Хеартс" еxампле абове).
цоунт():
Ретурн тхе тотал нумбер оф итемс ин тхе стоцк ригхт ноw.
аддИтемТyпе( тyпе, wеигхт, имаге, имаге_поситион ):
Дефине а неw тyпе оф итем то тхе стоцк.