mirror of
https://github.com/GrammaticalFramework/gf-core.git
synced 2026-04-27 21:42:50 -06:00
12f5dc9ece
This is an experimental solution using JavaScript code from https://github.com/christos-c/tree-viewer, d3js.org and jquery.com.
116 lines
4.0 KiB
HTML
116 lines
4.0 KiB
HTML
<!DOCTYPE html>
|
|
<html> <head>
|
|
<title>Demo: GF Wide Coverage Translation</title>
|
|
<link rel="stylesheet" type="text/css" href="gfse/editor.css" title="Cloud">
|
|
<meta name = "viewport" content = "width = device-width">
|
|
<meta charset="UTF-8">
|
|
<link rel=top href="../" title="GF">
|
|
<style>
|
|
div.center { text-align: center; }
|
|
table { border-collapse: collapse; table-layout: fixed; width: 100%; }
|
|
td { padding: 0 5px; vertical-align: top; }
|
|
td.output { background: #fcfcfc; border: 1px solid grey; }
|
|
td.input, td.output { font-family: sans-serif; font-size: 90%; }
|
|
div#output { white-space: pre-line; }
|
|
div.input { margin-right: 5px; }
|
|
textarea { font: inherit; }
|
|
body:target h1, body:target div.modtime { display: none; }
|
|
small { color: #666; }
|
|
#pick>* { padding: 0 0.5ex; }
|
|
#speak { display: none; }
|
|
.colors .default_quality { background-color: #ffb; }
|
|
.colors .high_quality { background-color: #bfb; }
|
|
.colors .low_quality { background-color: #fa7; }
|
|
.colors .bad_quality { background-color: #f89; }
|
|
.placeholder { color: #999; }
|
|
.error { color: #c00; }
|
|
div.e2 table { background: white; }
|
|
span.inflect { color: blue; }
|
|
|
|
.node { cursor: pointer; }
|
|
/*.overlay { background-color: #eed; }*/
|
|
.node rect { fill: #fff; stroke: black; stroke-width: 1.5px; }
|
|
.node text { font-size: 10px; font-family: serif; }
|
|
.link { fill: none; stroke: #ccc; stroke-width: 1.5px; }
|
|
</style>
|
|
</head>
|
|
|
|
<body id=embed>
|
|
<div>
|
|
<h1><a href="http://www.grammaticalframework.org/"><img class=nofloat src="P/gf-cloud.png" alt="GF"></a> Wide Coverage Translation Demo</h1>
|
|
</div>
|
|
|
|
<form onsubmit="return wc.translate()" style="width: 100%">
|
|
<table>
|
|
<tr><td>
|
|
<select name=from>
|
|
<option value=Bul>Bulgarian</option>
|
|
<option value=Chi>Chinese</option>
|
|
<option value=Dut>Dutch</option>
|
|
<option value=Eng selected>English</option>
|
|
<option value=Fin>Finnish</option>
|
|
<option value=Fre>French</option>
|
|
<option value=Ger>German</option>
|
|
<option value=Hin>Hindi</option>
|
|
<option value=Ita>Italian</option>
|
|
<option value=Spa>Spanish</option>
|
|
<option value=Swe>Swedish</option>
|
|
</select>
|
|
<input type=button value="Clear" onclick="wc.clear()">
|
|
<td style="text-align: right">
|
|
<input type=button name=swap onclick="wc.swap()" value="⇆">
|
|
<td>
|
|
<select name=to onchange="wc.translate()">
|
|
<option value=Bul>Bulgarian</option>
|
|
<option value=Chi>Chinese</option>
|
|
<option value=Dut>Dutch</option>
|
|
<option value=Eng>English</option>
|
|
<option value=Fin>Finnish</option>
|
|
<option value=Fre>French</option>
|
|
<option value=Ger>German</option>
|
|
<option value=Hin>Hindi</option>
|
|
<option value=Ita>Italian</option>
|
|
<option value=Spa>Spanish</option>
|
|
<option value=Swe selected>Swedish</option>
|
|
</select>
|
|
<input name=colors type=checkbox checked onchange="wc.colors()"> Colors
|
|
<td><button name=translate type=submit><strong>Translate</strong></button>
|
|
<tr><td class=input colspan=2>
|
|
<div class=input>
|
|
<textarea name=input rows=5 style="width: 100%" onkeyup="wc.delayed_translate()"></textarea>
|
|
</div>
|
|
<td class=output colspan=2>
|
|
|
|
<div id=output></div>
|
|
<tr><td colspan=2>
|
|
<small id=grammarinfo>Enter text to translate above.</small>
|
|
<td colspan=2>
|
|
<!--<small id=speak><input name=speak type=checkbox> Enable speech synthesis</small>-->
|
|
|
|
</table>
|
|
</form>
|
|
|
|
<div class=center>
|
|
<input type=button onclick="wc.try_google()" value="Try Google Translate">
|
|
<div id=pick></div>
|
|
<small id=extra></small>
|
|
</div>
|
|
<hr>
|
|
<div class=modtime><small>
|
|
<!-- hhmts start -->Last modified: Tue Mar 24 16:59:23 CET 2015 <!-- hhmts end -->
|
|
</small></div>
|
|
<a href="http://www.grammaticalframework.org/demos/translation.html">About</a>
|
|
<script src="js/support.js"></script>
|
|
<script src="js/gftranslate.js"></script>
|
|
<script src="js/localstorage.js"></script>
|
|
<script src="js/langcode.js"></script>
|
|
<script src="js/pgf_online.js"></script>
|
|
<script src="js/wc.js"></script>
|
|
|
|
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
|
|
<script src="http://d3js.org/d3.v3.min.js"></script>
|
|
<script src="js/d3Tree.js"></script>
|
|
|
|
</body>
|
|
</html>
|