UI/UI.js

/**
* Менеджер интерфейса.
* Создает и обновляет позиции всех элементов интерфейса: кнопки, курсор, таймер и т.д.
* Создает менеджер слоев интерфейса {@link UI#layers} и добавляет элементы интерфейса,
* а также существующие группы в него.
* @class
*/
var UI = function(){
	this.actionButtons = null;
	this.cornerButtons = null;
	this.cursor = null;
	this.background = null;
	this.logo = null;
	this.rope = null;
	this.feed = null;
	this.eventFeed = null;
	this.announcer = null;
	this.modalManager = null;
	this.menus = null;
	/**
	* Заранее заданные цвета для использования в игровых элементах.
	* @type {Object}
	*/
	this.colors = {
		orange: 0xFF8300,
		green: 0x68C655,
		red: 0xC93F3F,
		white: 0xFeFeFe,
		lightGray: 0xC6C6C6,
		lightBlue: 0x0072C4,
		menu: {
			grey: {
				outer: '#999999',
				inner: '#FFFFFF',
				background: '#EEEEEE'
			},
			orange: {
				outer: '#CD5D12',
				inner: '#FA8132',
				background: '#E86A17'
			},
			green: {
				outer: '#5FB13A',
				inner: '#88E060',
				background: '#73CD4B'
			},
			yellow: {
				outer: '#CDA400',
				inner: '#FFD948',
				background: '#FFCC00'
			},
			blue: {
				outer: '#1989B8',
				inner: '#35BAF3',
				background: '#1EA7E1'
			},
			red: {
				outer: '#E00505',
				inner: '#FF2F2F',
				background: '#F91E1E'
			}
		}
	};
	/**
	* Менеджер "слоев" элементов интерфейса.
	* @type {UI.Layers}
	*/
	this.layers = new UI.Layers();
};
/**
* Инициализирует интерфейс, создавая все элементы интерфейса
* и добавляя их в менеджер слоев.
*/
UI.prototype.initialize = function(){
	/**
	* Курсор.
	* @type {UI.Cursor}
	*/
	this.cursor = new UI.Cursor('cursor_orange');
	/**
	* Фон.
	* @type {UI.Background}
	*/
	this.background = new UI.Background();
	/**
	* Лого игры.
	* @type {Phaser.Image}
	*/
	this.logo = new UI.Logo(function(){
		return {x: game.screenWidth/2, y: game.screenHeight/2 - 225};
	}, 0.75, 'logo');
	/**
	* Таймер хода.
	* @type {UI.Rope}
	*/
	this.rope = new UI.Rope();
	/**
	* Фид системных сообщений.
	* @type {MessageFeed}
	*/
	this.feed = new MessageFeed(game);
	/**
	* Фид важных сообщений.
	* @type {MessageFeed.AnnounceFeed}
	*/
	this.announcer = new MessageFeed.AnnounceFeed(game);
	/**
	* Фид событий.
	* @type {MessageFeed.EventFeed}
	*/
	this.eventFeed = new MessageFeed.EventFeed(game);
	this.eventFeed.zIndexBelowCards = 3;
	this.eventFeed.zIndexAboveCards = 7;
	/**
	* Менеджер модальных меню.
	* @type {UI.ModalManager}
	*/
	this.modalManager = new UI.ModalManager();
	this.popupManager = new UI.PopupManager();
	this.credits = new UI.Credits(creditsText, game.state.change.bind(game.state, 'menu'));
	this._createButtons();
	this.menus = this._createMenus();
	this.layers.addExistingLayers([
		[this.background, 0],
		// this.actionButtons, 1
		[fieldManager, 2],
		[this.rope, 3],
		// this.eventFeed, 3 (zIndexBelowCards)
		[cardManager, 4],
		[cardEmitter, 5],
		// this.menus.main, 6
		// this.menus.broswer, 6
		[this.logo, 6],
		[this.credits, 6],
		[this.feed, 7],
		[this.eventFeed, this.eventFeed.zIndexAboveCards],
		[this.announcer, 8],
		// игровые меню, -6
		[this.modalManager, -5],
		// модальные меню, -4
		// this.cornerButtons, -3
		[this.popupManager, -2],
		[this.cursor, -1]
	]);
	this.layers.hideLayer(this.actionButtons, true);
	this.layers.positionLayers();
	this.activateHotkeys();
};
/** Обновляет позиции всех элементов UI. */
UI.prototype.updatePositions = function(){
	this.layers.positionElements();
};
UI.prototype.applySkin = function(){
	ui.background.setTexture(skinManager.skin.background);
	ui.background.vignette.visible = skinManager.skin.uiVignette;
	ui.menus.more_options.applyCheckbox('vignette', skinManager.skin.uiVignette);
};
/** Возвращает phaser пиксель для превращения в текстуру. */
UI.prototype.newPixel = function(){
	var pixel = game.make.graphics(0, 0);
	pixel.beginFill(ui.colors.white);
	pixel.drawRect(0, 0, 1, 1);
	pixel.endFill();
	return pixel;
};
UI.prototype.setDebugButtonText = function(name, text, on){
	ui.menus.debug.getByName(name).label.setText(text + ': ' + (on ? 'on' : 'off'), true);
};
UI.prototype.activateHotkeys = function(){
	var esc = game.input.keyboard.addKey(Phaser.Keyboard.ESC);
	esc.onDown.add(function(){
		if(this.modalManager.openModals.length){
			this.modalManager.closeModal();
		}
		else if(game.state.currentSync == 'credits'){
			game.state.change('menu');
		}
		else {
			this.modalManager.openModal('options');
		}
	}, this);
	function sendButtonAction(){
		var button = actionHandler.actionButton;
		if(game.state.currentSync == 'play' && button && button.serverAction){
			connection.server.sendButtonAction(button.serverAction);
		}
	}
	var enter = game.input.keyboard.addKey(Phaser.Keyboard.ENTER);
	enter.onDown.add(sendButtonAction, this);
	var space = game.input.keyboard.addKey(Phaser.Keyboard.SPACEBAR);
	space.onDown.add(sendButtonAction, this);
};
UI.prototype.toggleDebugButtons = function(){
	this.debugButtons.visible = !this.debugButtons.visible;
	this.debugButtons.forEach(function(b){
		if(this.debugButtons.visible){
			b.show();
		}
		else{
			b.hide();
		}
	}, this);
	gameOptions.set('debug_buttons', this.debugButtons.visible);
	gameOptions.save();
};
UI.prototype.openRules = function(){
	if(this.menus.rules){
		this.menus.rules.proxyOpen();
	}
	else{
		var message = this.feed.newMessage('Loading rules...');
		this.menus.rules = new Rules({message: message});
		this.layers.positionLayers();
	}
};
//@include:UIMenus
//@include:UIButtons
//@include:Menu
//@include:PopupManager
//@include:Layers
//@include:Background
//@include:Button
//@include:Stepper
//@include:Text
//@include:Checkbox
//@include:InputField
//@include:Image
//@include:Rope
//@include:Logo
//@include:Cursor
//@include:ModalManager
//@include:Credits