Live Casino games “Single Zero” and “French Roulette”

Description: Cameras broadcasting video in HD quality in live from casino room to establish the sense of trust and loyalty with real dealer working in casino.

Technologies and tools: Action Script 3.0, FlexUnit, JSON, XML, Git, Version One, Jenkins.

Position: Senior Flash Developer and Scrum Master.

Responsibilities:
• Refactoring of Single Zero version
• Implementation of new version of French Roulette
• Bug fixing
• Code review
• Introduction and organization of scrum process in a team

Team size:
6 developers in each scrum team (4 teams in total – 2 in Kiev, 2 abroad).

Duration: 5 months.

Advertisements

ActionScript coding convention checklist

Here is a checklist which I think is useful when you need to review your ActionScript code.

Also I’m adding an example.zip with ‘CheckList Template.docx’ file, ‘CodeConventionClass.as’ file and ‘CodeConventionClass Attachment.xlsx’. (Please do not forget to change extension from .doc to .zip after downloading).

1. English grammar and spelling.
2. Copyright comment is added and used /**   */ format.  Copyright comment includes such information as: a year of company foundation – current year, company name and “All rights reserved” string.

/**

* Copyright 1991-2010 Company Name. All rights reserved

*/

3. Package names must use “reverse domain” naming convention.

4. Braces “{“ and “}” are placed on separate line.

5. Organize imports by sections. Separate sections with empty line.

6. Imports don’t contain unnecessary classes or packages.

7. Class comment is added and used /**   */ format. Class comments should include class purpose and author.

8. Each author in Class comment should be placed on a new line. If you are the person who is modifying somebody’s class then you can do this way:

@author Name Surname (modified).

9. Class name is in UpperCamel format.

10. Constants are placed using priority order – public, private.

11. Base variables section has priority order – public, private.

12. Private variables must start with an underscore “_”.

13. Boolean variables should start with “is”.

14. Public variables must not contain underscore “_”.

15. Used one empty line between separate variables sections.

16. Used two empty lines before Constructor.

17. Method comments are added and used /**   */ format. Description for parameters and returned value is added.

18. Meaningful constants are used in compound, while and dowhile, switch statements instead of using just a value.

19. Added a space after “(“ and before “)”. And a space is added only after “:” character.

20. Types declaration used for variables and parameters declaration conforms.

21. Copy-Paste style of coding avoided.

22. Code organized according to system design.

23. Event listeners names should start with event dispatcher name, then event type and then key word “Handler” (getItemActionResultHandler, btnSaveClickHandler) .

24. Comment of handlers’ methods is started from a word “Handles” and a description for transferred parameter is added.

/**

* Handles socket connection

* @param e – Event.CONNECT

*/

25. Parameters in methods must not start from underscore “_” or “$”.

26. All added event listeners should be removed when not used anymore.

27. Resources are removed if they are not used anymore to free memory. Example, when window is closed.

28. Keyword ‘this’ is used to address methods and variables. Using thiskeyword allows us to distinguish global variables from local and to see calling of methods through a lot of strings in a class.

29. Complex constructions and long methods avoided.

30. Code is consistent to system design and approaches.

31. Avoid using public variables in general, as it does not properly encapsulate the software design; instead use getter/setter conventions.

32. Public fields and methods used only when necessary.

33. Usage of design patterns only when needed.

34.trace statements are removed or commented.

Flex 4 localization example.

At this post we will find out how to create a simple languages panel in a Flash Builder which will allow to switch between English and Russian languages. After clicking flag icon language of Label and toolTips should be changed (see img. 6).

Img. 1 - LanguagesPanel component

1. Create our localization files

Img. 2 - Example of location of languages files

2. Input data into each of localization.properties file. Text encoding of the files should be Unicode, UTF-8.

Img. 3 - Example of localization.properties file for English language
Img. 4 - Example of localization.properties file for Russian language

3. Modify properties of the project. In right-mouse menu choose Properties – > Flex Compiler.

Img. 5 - Flex Compiler properties

Set additional compiler arguments to:

-locale=ru_RU,en_US -source-path=locale/{locale} -allow-source-path-overlap=true

4. Create our component – LanguagesPicker.mxml.

xml version=”1.0″ encoding=”utf-8″?>

<s:Group xmlns:fx=”http://ns.adobe.com/mxml/2009

xmlns:s=”library://ns.adobe.com/flex/spark

xmlns:mx=”library://ns.adobe.com/flex/mx“>

<s:layout>

HorizontalLayout verticalAlign=”middle” horizontalAlign=”right” gap=”5″/>

</s:layout>

<fx:Declarations>

<!– Place non-visual elements (e.g., services, value objects) here –>
<mx:Glow id=”glowEffect” blurXTo=”1.25” blurYTo=”1.25 />

</fx:Declarations>

<fx:Style>

@namespace s “library://ns.adobe.com/flex/spark”;
@namespace mx “library://ns.adobe.com/flex/mx”;

.flagStyle
{

skin: ClassReference(null);

}

</fx:Style>

<fx:Metadata>

[ResourceBundle(“localization”)]

</fx:Metadata>

<fx:Script>

<!–[CDATA[–>

import core.Constants;
import core.EmbeddedItemsStorage;
import events.ChangeEvent;
import mx.events.FlexEvent;
import mx.events.ListEvent;

protected function btn_En_clickHandler(event:MouseEvent):void
{

this.resourceManager.localeChain = [“en_US”];

}

protected function btn_Ru_clickHandler(event:MouseEvent):void
{

this.resourceManager.localeChain = [“ru_RU”];

}

]]>

</fx:Script>

<s:Label id=”label

text=”{resourceManager.getString(Constants.BUNDLE_NAME, ‘LANGS_PICKER_LABEL’)}

textAlign=”right” verticalAlign=”middle/>

LinkButton id=”btn_En

icon=”{EmbeddedItemsStorage.EN_US_FLAG}

toolTip=”{resourceManager.getString(Constants.BUNDLE_NAME, ‘ENGLISH’)}

click=”btn_En_clickHandler(event)” mouseDownEffect=”{this.glowEffect}

styleName=”flagStyle” width=”32” height=”32/>

LinkButton id=”btn_Ru

icon=”{EmbeddedItemsStorage.RU_FLAG}

toolTip=”{resourceManager.getString(Constants.BUNDLE_NAME, ‘RUSSIAN’)}

click=”btn_Ru_clickHandler(event)” mouseDownEffect=”{this.glowEffect}

styleName=”flagStyle” width=”32” height=”32/>

</s:Group>

Comment:

Please notice that in this example

1) bundleName was moved into Constants class

public class Constants
{

public static const BUNDLE_NAME: String = “localization”;

}

2) icons were embedded using EmbeddedItemsStorage class

public class EmbeddedItemsStorage
{

// Images
[Embed(source=“/assets/flags/Ru_flag_32x32.png”)]
public static const RU_FLAG: Class;

[Embed(source=“/assets/flags/US_flag_32x32.png”)]
public static const EN_US_FLAG: Class;

}

5. Run application and test results

Img. 6 - Example after switching to Russian language

Updating language for dataProvider of some component.

Let’s look at example when you need to update strings of ToggleButtonBar which is placed at your application component.

Img. 7 - ToggleButtonBar with English labels

1. Add new strings into localization.properties files

# locale/en_US/localization.properties
LANGS_PICKER_LABEL=Choose a language:
ENGLISH=English
RUSSIAN=Russian
MENU_MONETARY_TRANSACTIONS=Monetary transactions
MENU_TIME=Time

# locale/ru_RU/localization.properties
LANGS_PICKER_LABEL=Выберите язык:
ENGLISH=Английский
RUSSIAN=Русский
MENU_MONETARY_TRANSACTIONS=Денежные операции
MENU_TIME=Время

2. Modify LanguagesPicker.mxml to to send LANG_UPDATE event after localeChain changing.

protected function btn_En_clickHandler(event:MouseEvent):void
{

this.resourceManager.localeChain = [“en_US”];
this.dispatchEvent(new ChangeEvent(ChangeEvent.LANG_UPDATE));

}

protected function btn_Ru_clickHandler(event:MouseEvent):void
{

this.resourceManager.localeChain = [“ru_RU”];
this.dispatchEvent(new ChangeEvent(ChangeEvent.LANG_UPDATE));

}

Comment:

ChangeEvent extends Event class and contains a constant for LanguageUpdate string.

public class ChangeEvent extends Event
{

public static const LANG_UPDATE: String = “LanguageUpdate”;

3. Place ToggleButtonBar component in your application mxml component and set its properties.

ToggleButtonBar id=”toggleBtnBar

dataProvider=”{this.dpToggleBtnBar}

itemClick=”toggleBtnBar_itemClickHandler(event)”

maxHeight.MonetaryTransactions=”80″ maxHeight.HeaderMenu=”80″ maxHeight.TimeState=”80″/>

4. Define a getter for dataProvider of ToggleButtonBar component in ActionScript section of your application.

public function get dpToggleBtnBar():ArrayCollection
{

var arr: ArrayCollection = new ArrayCollection();

var money: Object = new Object();
money.data = “MonetaryTransactions”;
money.label = resourceManager.getString(Constants.BUNDLE_NAME, ‘MENU_MONETARY_TRANSACTIONS’);

arr.addItem(money);

var time: Object = new Object();
time.data = “TimeState”;
time.label = resourceManager.getString(Constants.BUNDLE_NAME, ‘MENU_TIME’);

arr.addItem(time);

return arr;

}

5. For you application add creationComplete event handler and add listener for LANG_UPDATE event of langsPicker component. When LANG_UPDATE event will be dispatched then you need to update dataProvider of ToggleButtonBar component.

protected function application_creationCompleteHandler(event:FlexEvent):void
{

this.langsPicker.addEventListener(ChangeEvent.LANG_UPDATE, this.updateStrings);

}

private function updateStrings(e: ChangeEvent):void
{

this.toggleBtnBar.dataProvider = this.dpToggleBtnBar;

}

6. Run your application and test results.

Img. 8 - ToggleButtonBar component with Russian labels

Flex4 ToggleButtonBar with icons. Switching between states using ToggleButtonBar.

Example for Flash Builder.

ToggleButtonBar contains Home and Downloads buttons (img. 1 and img. 2) which should present icons and allow to switch between states.

This slideshow requires JavaScript.

<s:states>

<s:State name=”HomeState/>

<s:State name=”DownloadsState/>

</s:states>

<fx:Script>
<!–[CDATA[–>

import mx.events.ItemClickEvent;

protected function toggleBtnBar_itemClickHandler(event:ItemClickEvent):void
{

this.currentState = event.item.data;

}

]]>
</fx:Script>

<fx:Declarations>

<!– Place non-visual elements (e.g., services, value objects) here –>
<fx:Array id=”menuDataProvider”>

<fx:Object data=”HomeState

label=”Home

icon=”@Embed(source=’/assets/menu_icons/home.png’)/>

<fx:Object data=”DownloadsState

label=”Downloads

icon=”@Embed(source=’/assets/menu_icons/downloads.png’)/>

</fx:Array>

</fx:Declarations>

ToggleButtonBar id=”toggleBtnBar

iconField=”icon”

dataProvider=”{menuDataProvider}

itemClick=”toggleBtnBar_itemClickHandler(event)” />

Flex4 ToggleButtonBar c иконками. Переключение состояний при помощи ToggleButtonBar.

Пример для Flash Builder.

ToggleButtonBar будет содержать 2 кнопки – Home и Downloads (рис. 1 и рис. 2), которые должны отображать соответствующую иконку и переключаться между состояниями.

Рис. 1 - Пример HomeState

Рис. 2 - Пример DownloadsState

<s:states>

<s:State name=“HomeState”/>

<s:State name=“DownloadsState”/>

</s:states>

<fx:Script>
<!–[CDATA[–>

import mx.events.ItemClickEvent;

protected function toggleBtnBar_itemClickHandler(event:ItemClickEvent):void
{

this.currentState = event.item.data;

}

]]>
</fx:Script>

<fx:Declarations>

<!– Place non-visual elements (e.g., services, value objects) here –>
<fx:Array id=”menuDataProvider”>

<fx:Object data=”HomeState

label=”Home

icon=”@Embed(source=’/assets/menu_icons/home.png’)/>

<fx:Object data=”DownloadsState

label=”Downloads

icon=”@Embed(source=’/assets/menu_icons/downloads.png’)/>

</fx:Array>

</fx:Declarations>

<mx:ToggleButtonBar id=”toggleBtnBar

iconField=”icon

dataProvider=”{menuDataProvider}

itemClick=”toggleBtnBar_itemClickHandler(event)” />

Установление соединения с базой данных SQLite. Добавление, редактирование, удаление записей из базы данных SQLite средствами ActionScript3.0 (AIR)

Представьте, что у вас есть база данных SQLite, которая имеет  2 таблицы с такой физической структурой:

Рис. 1 -Структура таблицы Operation
Рис. 2 – Структура таблицы Payment

Вот примеры реальных данных для этих двух таблиц:

Рис. 3 – Пример данных таблицы Operation
Рис. 4 – Пример данных таблицы Payment

У вас есть AIR приложение с формами для добавления, редактирования, удаления и восстановления записей в таблице.

Чтобы получить возможность выполнять любую из операций по работе с базой данных, необходимо сначала установить соединение с ней.

Как установить соединение с базой данных средствами ActionScript 3?

Необходимо использовать объект класса File для ссылки на базу данных, а также объект класса SQLStatement для представления связи с одной или более баз данных (в нашем случае с одной).

// ActionScript file of runnable application mxml file – BaseWindowedApplication
import mx.controls.Alert;
import flash.events.SQLErrorEvent;
import flash.events.SQLEvent;

// объявляем переменную для SQLConnection

public var sqlConnection: SQLConnection;

/** Устанавливаем соединение с базой данных.

* Метод можно вызвать, например, на событие creationComplete вашего приложения

*/

public function initDataBaseConnection(): void
{

this.sqlConnection = new SQLConnection();
var file: File = new File(“app-storage:/Database.sqlite”);

this.sqlConnection.addEventListener(SQLEvent.OPEN, this.openDbHandler);
this.sqlConnection.addEventListener(SQLErrorEvent.ERROR, this.openDbFailedHandler);
this.sqlConnection.openAsync(file);

}

private function openDbHandler(e: SQLEvent): void
{

trace(“openDbHandler”);

}

private function openDbFailedHandler(e: SQLErrorEvent): void
{

Alert.show(e.error.details, “Error”);

}

Как реализовать добавление записи в таблицу базы данных средствами ActionScript 3?

Рис. 5 – Форма для добавления записей в таблицу Payment

Пример добавление записи в таблицу Payment по клику на кнопку Apply на форме (рис. 5) .

// ActionScript file для формы (рис. 5)
import flash.data.SQLStatement;
import flash.events.SQLErrorEvent;
import flash.events.SQLEvent;
import mx.controls.Alert;

//Добавляем слушателя события нажатия на кнопку мыши

this.btnApply.addEventListener(MouseEvent.CLICK, this.addPayment);

/** Обработчик события MouseEvent.CLICK.

Метод добавляет новую запись в таблицу Payment,

* используя данные из компонентов на форме (рис. 5) – ComboBox, TextInput и DateField.

*/

private function addPayment(): void
{

var sqlStatement: SQLStatement = new SQLStatement();
sqlStatement.sqlConnection = BaseWindowedApplication(this.parentApplication).sqlConnection; // используем явное приведение типов
sqlStatement.addEventListener(SQLEvent.RESULT, this.addResultSqlEventHandler);
sqlStatement.addEventListener(SQLErrorEvent.ERROR, this.resultFailedHandler);

sqlStatement.text = “INSERT INTO Payment (Date, OperationId, Amount) VALUES (:Date, :OperationId, :Amount)”;
sqlStatement.parameters[“:Date”] = this.dateField.selectedDate;
sqlStatement.parameters[“:OperationId”] = this.cmbArticles.selectedItem[“Id”];
sqlStatement.parameters[“:Amount”] = this.txtAmount.text;
sqlStatement.execute();

}

/** Обработчик события SQLEvent.RESULT.

* На экран выводится сообщение об успешном добавление записи

* и очищается поле для ввода суммы на форме (рис. 5)

*/

private function addResultSqlEventHandler(r: SQLEvent): void
{

Alert.show(“Record was added successfully.”, “Info”);
this.txtAmount.text = “”;

}

/**Обработчик события SQLErrorEvent.ERROR.

* На экран выводится сообщение об ошибке.

*/

private function resultFailedHandler(e: SQLErrorEvent): void
{

Alert.show(e.error.details, “Error”);

}

Как отредактировать запись в таблице базы данных средствами ActionScript 3?

Рис. 6 – Форма редактирования записей таблицы Payment

// ActionScript file для формы (рис. 6)
import flash.data.SQLStatement;
import flash.events.SQLErrorEvent;
import flash.events.SQLEvent;
import mx.controls.Alert;

/** Редактирование одной записи таблицы Payment.

*/

private function updatePayment(date: Date, operationId: int, amount: Number, id: String): void
{

var sqlStatement: SQLStatement = new SQLStatement();
sqlStatement.sqlConnection = BaseWindowedApplication(this.parentApplication).sqlConnection;
sqlStatement.addEventListener(SQLEvent.RESULT, this.updateResultHandler);
sqlStatement.addEventListener(SQLErrorEvent.ERROR, this.errorHandler);

sqlStatement.text = “UPDATE Payment SET Date=@Date, OperationId=@OperationId, Amount=@Amount WHERE Id=@Id”;
sqlStatement.parameters[“@Date”] = date;
sqlStatement.parameters[“@OperationId”] = operationId;
sqlStatement.parameters[“@Amount”] = amount;
sqlStatement.parameters[“@Id”] = id;
sqlStatement.execute();

}

/** Обработчик события SQLEvent.RESULT.

*/

private function updateResultHandler(e: SQLEvent): void
{

// Обновляем значения CheckBox компонентов колонки Edit state

// Показываем сообщение об успешности обновления записей

}

/**Обработчик события SQLErrorEvent.ERROR.

* На экран выводится сообщение об ошибке.

*/

private function errorHandler(e: SQLErrorEvent): void
{

this.dg.enabled = true;
Alert.show(e.text, “Error”);

}

Как удалить запись в таблице базы данных средствами ActionScript 3?

Рис. 7 – Форма удаления записей таблицы Payment

// ActionScript file для формы (рис. 7)
import flash.data.SQLStatement;
import flash.events.SQLErrorEvent;
import flash.events.SQLEvent;
import mx.controls.Alert;

/** Удаление записи таблицы Payment.

*/

private function removePayment(): void
{

var sqlStatement: SQLStatement = new SQLStatement();
sqlStatement.sqlConnection = BaseWindowedApplication(this.parentApplication).sqlConnection;

sqlStatement.addEventListener(SQLEvent.RESULT, this.removeResultHandler);
sqlStatement.addEventListener(SQLErrorEvent.ERROR, this.errorHandler);

var cellId: String = this.dg.selectedItem.Id;

sqlStatement.text = “DELETE FROM Payment WHERE Id='” + cellId + “‘”;
sqlStatement.execute();

}

/** Обработчик события SQLEvent.RESULT.

* При успешном удалении записи из базы данных деактивирует DataGrid,

* удаляет запись из DataGrid,

* деактивирует кнопку Remove.

*/

private function removeResultHandler(e: SQLEvent): void
{

this.dg.enabled = true;

var cellId: String = this.dg.selectedItem.Id;

var tmpArr: Array = this.dg.dataProvider.source;
var index: int = tmpArr.indexOf(this.dg.selectedItem);

this.dg.dataProvider.source.splice(index, 1);

this.btnRemove.enabled = false;

}

/**Обработчик события SQLErrorEvent.ERROR.

* На экран выводится сообщение об ошибке.

*/

private function errorHandler(e: SQLErrorEvent): void
{

this.dg.enabled = true;
Alert.show(e.text, “Error”);

}

Как отменить только что выполненную операцию с записью средствами ActionScript 3?

Например, на форме, что на рис. 6 возможно отредактировать несколько записей в DataGrid. Что делать, если пользователю нужно отменить выполненное редактирование?

/** Обработчик события MouseEvent.CLICK для кнопки Cancel формы (рис. 6).

* Восстановление отредактированных записей в DataGrid’e из таблицы Payment.

*/

private function retrieveRecords(): void
{

for(var i: uint = 0; i < this.dg.dataProvider.source.length; i++)
{

var state: Boolean = this.dg.dataProvider.source[i][“State”];

if(state)
{

var cellId: String = this.dg.dataProvider.source[i][“Id”];
this.retreive(cellId);

}

}

}

/** Восстановление одной записи из таблицы Payment по идентификатору.

*/

private function retreive(cellId: String): void
{

var sqlStatement: SQLStatement = new SQLStatement();
sqlStatement.sqlConnection = BaseWindowedApplication(this.parentApplication).sqlConnection;

sqlStatement.addEventListener(SQLEvent.RESULT, this.retreiveResultHandler);
sqlStatement.addEventListener(SQLErrorEvent.ERROR, this.errorHandler);

sqlStatement.text = “SELECT * FROM Payment WHERE Id='” + cellId + “‘”;
sqlStatement.execute();

}

/** Обработчик события SQLEvent.RESULT.

* При успешном восстановлении записи из таблицы Payment базы данных

* обновляет запись в DataGrid’e.

* Показывает сообщение об успешном восстановлении записей.

*/

private function retreiveResultHandler(e: SQLEvent): void
{

// Получение результата из базы данных

var retrievedArray: Object = e.target.getResult().data;

var retrievedId: int = retrievedArray[0][“Id”];
var retrievedAmount: String =  retrievedArray[0][“Amount”];
var retrievedDate: Date =  retrievedArray[0][“Date”];

for(var i: uint = 0; i < this.dg.dataProvider.source.length; i++)
{

if(this.dg.dataProvider.source[i].Id == retrievedId)
{

this.dg.dataProvider.source[i][“State”] = false;
this.dg.dataProvider.source[i][“Amount”] = retrievedAmount;
this.dg.dataProvider.source[i][“Date”] = retrievedDate;

}

}

// Показываем сообщение об успешности восстановления записей в DataGrid’e

}