Pull to refresh

air.Typograf

Reading time4 min
Views1.2K
Делать простые приложения с Adobe AIR мы уже научились, делать красивые окошки тоже, а теперь поставим себе реальную задачу и попробуем ее осуществить.
Сегодня будем писать очень простенькую обертку под Типографический веб-сервис.




Как всегда, особо разглагольствовать на эту тему я не буду, а просто приведу код с большим количеством комментариев.
Из кода мы узнаем о том, как посылать запросы через air.URLRequest, работать с буфером обмена и открывать ссылки во внешнем браузере.

Будем считать, что эта статья является продолжением предыдущей Делаем красиво в AdobeAIR с ExtJS, все остается так же, только меняется содержимое application.js:

var app = {
	
	_mainWindow: null,
	_textarea: null,
	_statusbar: null,

	/*
	 * инициализация
	 */
	init: function() {
		window.nativeWindow.maximize();
		
		app.doCreateMainWindow();
		app.setupListeners();
		
		window.nativeWindow.visible = true;
	},
	
	/*
	 * обработчики событий
	 */
	setupListeners: function() {
		// события нативного окна
		window.nativeWindow.addEventListener('displayStateChanging', app.doDisplayStateChanging); 
		
		// события главного окна
		this._mainWindow.on('minimize', app.doMinimize);
		this._mainWindow.on('close', app.doClose);
		
		// события в textarea
		this._textarea.on('specialkey', app.doSpecialKey);
	},
	
	/*
	 * создание главного окна
	 */
	doCreateMainWindow: function() {
		this._statusbar = new Ext.StatusBar({
			// текст по-умолчанию
        	text: 'http://www.typograf.ru',
        	items: [ 
				// разделитель
				'-',
				{ // кнопка "открыть в браузере" на статусбаре
					text: 'открыть в браузере',
					handler: function() {
						// функция отработает по щелчку на кнопке
						// смысл ее в том, чтобы открыть ссылку в браузере по-умолчанию
						var request = new air.URLRequest( 'http://www.typograf.ru' );
						air.navigateToURL(request);
					}
				}
			]
		} );
		
		this._textarea = new Ext.form.TextArea( {
			// текст по-умолчанию
			emptyText: 'Введите текст, который нужно оттипографировать и нажмите Ctrl + Enter',
			region: 'center'
		} );
				
		this._mainWindow = new Ext.Window({
			width:  800,
			height: 600,
			minWidth: 300,
			minHeight: 200,
			layout: 'border',
			x: 100,
			y: 100,		  
			minimizable: true,
			maximizable: true,
			title: "Типограф",
			iconCls: 'icon',
			
			// тулбар
			tbar: [
				{
					text: "вставить из буфера",
					handler: function() {
						// а у нас в буфере обмена действительно текст?
						if ( air.Clipboard.generalClipboard.hasFormat(air.ClipboardFormats.TEXT_FORMAT) ) {
							// вставляем текст
							app._textarea.setValue(
								// из буфера =)
								air.Clipboard.generalClipboard.getData(air.ClipboardFormats.TEXT_FORMAT)
							);
						}
					}
				},
				{
					text: "копировать в буфер",
					handler: function() {
						// получаем введенный текст
						var text = app._textarea.getValue();
						
						// если пусто, то ничего не делаем
						if (text == '')
							return;
						
						// очищаем буфер обмена
						air.Clipboard.generalClipboard.clear();
						// и копируем туда данные в текстовом (TEXT_FORMAT) формате
						air.Clipboard.generalClipboard.setData(air.ClipboardFormats.TEXT_FORMAT, text);
					}
				},
				{
					text: "очистить",
					handler: function() {
						// очищаем поле для ввода
						app._textarea.reset();
					}
				}
			],
			// статусбар
			bbar: this._statusbar,
			
			// поле для ввода текста
			items: this._textarea
		});
		
		this._mainWindow.show();
	},
	
	/*
	 * обработка события на изменение состояния окна
	 * @param {Event} событие displayStateChanging
	 */
	doDisplayStateChanging: function( e ) {
		if ( e.afterDisplayState == 'normal' ) {
			e.preventDefault();
			window.nativeWindow.visible = false;
			window.nativeWindow.maximize();
			window.nativeWindow.visible = true;
		}
		else
		if ( e.afterDisplayState == 'minimized' ) {
			e.preventDefault();
			window.nativeWindow.visible = false;
			window.nativeWindow.minimize();
			window.nativeWindow.visible = true;
		}
	},
	
	/*
	 * обработка события нажатия служебных клавиш в _textarea
	 * @param {Ext.form.TextField} элемент
	 * @param {Event} событие keypress
	 */
	doSpecialKey: function( field, e ) {
		var keyCode = e.getKey();
		
		if ( keyCode == 13 ) {
			// не надо в этом случае каретку двигать
			e.preventDefault();
			
			// обрабатываем текст, если он есть
			if ( app._textarea.getValue() != '' )
				app.doProcess();
		}
	},

	/*
	 * обработка события закрытия главного окна
	 * @param {Ext.window} окно
	 */
	doClose: function( win ) {
		air.NativeApplication.nativeApplication.exit();
	},
	
	/*
	 * обработка события на сворачивание главного окна
	 * @param {Ext.window} окно
	 */
	doMinimize: function( win ) {
		window.nativeWindow.visible = false;
		window.nativeWindow.minimize();
		window.nativeWindow.visible = true;
	},
	
	// обработка текста типографом
	doProcess: function() {
		this._textarea.disable();
		this._statusbar.setStatus( 'Обработка...' );
		
		// загрузчик
		var loader = new air.URLLoader();
		// будем воспринимать полученную информацию в текстовом виде
		loader.dataFormat = air.URLLoaderDataFormat.TEXT;
		// указываем обработчик на получение данных
		loader.addEventListener(air.Event.COMPLETE, app.doGetProcessed); 
		
		// запрос
		var request = new air.URLRequest('http://www.typograf.ru/webservice/');
		// указываем способ передачи данных в сервис - post
		request.method = air.URLRequestMethod.POST;
		// и указываем, собственно, то, что мы передаем в сервис

		request.data = 'chr=utf-8&text=' + this._textarea.getValue();
		
		// поехали ;)
		loader.load(request);
	},
	
	/*
	 * получение данных с сервера
	 * @param {Event} событие air.Event.COMPLETE
	 */
	doGetProcessed: function( e ) {
		// получаем loader
		var loader = e.target;
		
		app._textarea.setValue( loader.data );
		
		app._textarea.enable();
		app._statusbar.setStatus('http://www.typograf.ru');
	}

}


Пишу второпях, возможно что-то забыл. Не стесняйтесь и спрашивайте, если что.

Для тех, кому не хочется возиться, а посмотреть охота, можете скачать установочный пакет (около 400 кб)

Всем спасибо за внимание.

P.S. обновил статью и air-пакет. Спасибо автору за починку utf-8 режима.

Кросспост из личного блога.
Tags:
Hubs:
Total votes 41: ↑39 and ↓2+37
Comments27

Articles