iPhone/iPod touch向けの翻訳サービスを作ってみた
しかしまぁ、PCで見ると悲惨なことに。。w
使った技術とか
- Closure Library, Compiler
- Google Ajax Language API
以下、メインのJSのソース
ちなみに、エラー処理は皆無なのだ。
goog.require('goog.events');
goog.require('goog.dom');
goog.require('goog.debug');
goog.require('goog.debug.Logger');
goog.require('goog.debug.DivConsole');
goog.require('goog.string');
var TranslationPanel = function() {
this.init();
};
TranslationPanel.prototype = {
SOURCE_LANGUAGES_ID : 'source-languages-selector',
TARGET_LANGUAGES_ID : 'target-languages-selector',
SOURCE_TEXTAREA_ID : 'source-textarea',
TARGET_TEXTAREA_ID : 'target-textarea',
TRANSLATION_BUTTON_ID : 'translation-button',
init : function() {
var divDebug = new goog.debug.DivConsole(goog.dom.$('log'));
this.logger = goog.debug.Logger.getLogger('TranslationPanel');
this.logger.addHandler(function(record) {
divDebug.addLogRecord(record);
});
this.initEventListeners();
},
initEventListeners : function() {
goog.events.listen(goog.dom.$(this.TRANSLATION_BUTTON_ID), goog.events.EventType.CLICK
, goog.bind(this.translationButtonClicked, this));
},
translationButtonClicked : function(event) {
if (goog.dom.$(this.SOURCE_TEXTAREA_ID).value == '') {
return;
}
this.translate();
},
translate : function() {
google.language.getBranding('branding');
google.language.translate(goog.dom.$(this.SOURCE_TEXTAREA_ID).value
, goog.dom.$(this.SOURCE_LANGUAGES_ID).value, goog.dom.$(this.TARGET_LANGUAGES_ID).value
, goog.bind(function(result){
if (result.translation) {
goog.dom.$(this.TARGET_TEXTAREA_ID).value = goog.string.unescapeEntities(result.translation);
}
}, this)
);
}
};
以下、余談
iPhone向けなので、Closure Libraryの依存関係は事前に解決しとかないと(HTTP的に)エライことになりますので、実際はpack.jsというすでに依存関係解消済みかつコンパイラされたものを読み込んでいます。
また、jQueryと併用して開発しようと思いましたが、途中で「アレ、jQueryいらなくね?」と思い至ったので、Closure Library オンリーで開発しました。Closure Libraryは便利なメソッド多すぎなのでかなりおすすめです。
JavaScriptもビルドしてHTMLから読み込むのが当然になるのかなぁ。。




