<%@ Register Assembly="Obout.Ajax.UI" Namespace="Obout.Ajax.UI.HTMLEditor" TagPrefix="obout" %>
<div id='translControl' style="height:26px"></div>
<obout:Editor runat="server" Id="editor" >
<EditPanel Height="150px" OnClientActiveModeChanged="checkMode" OnClientLoaded="checkMode" />
<TopToolBar Appearance="Lite" PreservePlace="true" />
</obout:Editor>
...
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
// Load the Google Transliterate API
google.load(
"elements",
"1", {packages:
"transliteration"});
// on active mode changed and initial load
function checkMode(sender, args) {
var designMode = Obout.Ajax.UI.HTMLEditor.ActiveModeType.Design;
var editPanel = sender;
// clear the transliteration control
document.getElementById(
'translControl').innerHTML =
"";
// current mode
var activeMode = editPanel.get_activeMode();
// for 'Design' mode only
if (activeMode == designMode) {
// get the current panel
var panel = editPanel.get_activePanel();
// Tricking FF's bug
if (Sys.Browser.agent == Sys.Browser.Firefox) {
panel.captureInDesign =
function (ev) {
if (ev.type.indexOf(
"mouse") >= 0) {
var focus =
this.get_element().contentWindow.focus;
this.get_element().contentWindow.focus =
function () { };
setTimeout(
function () {
this.get_element().contentWindow.focus = focus;
}, 400);
}
return true;
};
}
var options = {
sourceLanguage:
'en',
destinationLanguage: [
'el',
'ru',
'hi'],
shortcutKey:
'ctrl+g',
transliterationEnabled:
true
};
// Create an instance on TransliterationControl with the required
// options.
var googleControl =
new google.elements.transliteration.TransliterationControl(options);
// Enable transliteration in <iframe>.
var ids = [panel.get_element().id];
googleControl.makeTransliteratable(ids);
// Show the transliteration control
googleControl.showControl(
'translControl');
}
return;
}
</script>