| <!DOCTYPE html> |
| <!-- |
| Licensed to the Apache Software Foundation (ASF) under one or more |
| contributor license agreements. See the NOTICE file distributed with |
| this work for additional information regarding copyright ownership. |
| The ASF licenses this file to You under the Apache License, Version 2.0 |
| (the "License"); you may not use this file except in compliance with |
| the License. You may obtain a copy of the License at |
| |
| http://www.apache.org/licenses/LICENSE-2.0 |
| |
| Unless required by applicable law or agreed to in writing, software |
| distributed under the License is distributed on an "AS IS" BASIS, |
| WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| See the License for the specific language governing permissions and |
| limitations under the License. |
| --> |
| <html lang="en"> |
| <head> |
| <meta charset="utf-8"> |
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> |
| <meta name="viewport" content="width=device-width, initial-scale=1"> |
| <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags --> |
| <meta name="description" content=""> |
| <meta name="author" content=""> |
| <link rel="icon" href="favicon.ico"> |
| |
| <title>Apache Joshua Machine Translation Demonstration</title> |
| |
| <!-- Bootstrap core CSS --> |
| <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet"> |
| |
| <style type="text/css"> |
| /* Move down content because we have a fixed navbar that is 50px tall */ |
| body { |
| background-image: url("apache_joshua_logo_faded.png"); |
| background-repeat: no-repeat; |
| background-position: -300px -300px; |
| } |
| |
| .oov { |
| color: red; |
| font-weight: bold; |
| text-decoration: underline; |
| } |
| |
| .navbar-brand { |
| font-weight: bold; |
| } |
| </style> |
| </head> |
| |
| <body> |
| |
| <nav class="navbar navbar-static-top"> |
| <div class="container"> |
| <div class="navbar-header"> |
| <a class="navbar-brand" href="#"> |
| Apache Joshua Machine Translation Demonstration |
| </a> |
| </div> |
| <div id="navbar" class="navbar-collapse collapse"> |
| <!-- <form class="navbar-form navbar-right"> --> |
| <!-- <div class="form-group"> --> |
| <!-- <input type="text" placeholder="Email" class="form-control"> --> |
| <!-- </div> --> |
| <!-- <div class="form-group"> --> |
| <!-- <input type="password" placeholder="Password" class="form-control"> --> |
| <!-- </div> --> |
| <!-- <button type="submit" class="btn btn-success">Sign in</button> --> |
| <!-- </form> --> |
| </div><!--/.navbar-collapse --> |
| </div> |
| </nav> |
| |
| <!-- Main jumbotron for a primary marketing message or call to action --> |
| |
| <div class="container"> |
| <div> |
| <ul class="nav nav-tabs"> |
| <li class="active"><a data-toggle="tab" href="#translate">Translate</a></li> |
| <li><a data-toggle="tab" href="#rules">Rules</a></li> |
| <li><a data-toggle="tab" href="#params">Parameters</a></li> |
| <li><a data-toggle="tab" href="#instructions">Instructions</a></li> |
| </ul> |
| </div> |
| |
| <div class="tab-content"> |
| <div id="translate" class="tab-pane fade in active"> |
| <div class="panel panel-default"> |
| <div class="panel-heading"> |
| <h3 class="panel-title">Input</h3> |
| </div> |
| |
| <div class="panel-body"> |
| <div class="row"> |
| <div class="col-lg-12"> |
| <fieldset class="form-group"> |
| <textarea class="form-control" id="sourceTxt" rows="5" placeholder="Enter sentences one per line and type Ctrl-return or ⌘-return to submit" autofocus="autofocus"></textarea> |
| </fieldset> |
| </div> |
| <!-- <div class="col-lg-1"> --> |
| <!-- <button class="btn btn-primary" type="submit" onclick="translate_default()">Translate</button> --> |
| <!-- </div> --> |
| </div> |
| <div class="row"> |
| <div class="col-lg-8"> |
| <form class="form-inline"> |
| <div class="form-group"> |
| Add New Phrase: |
| <input type="text" class="form-control" placeholder="source side" id="addPhrase_source" size=20 /> |
| <input type="text" class="form-control" placeholder="target side" id="addPhrase_target" size=20 /> |
| <button type="button" class="btn btn-primary" id="add_rule">Add</button> |
| </div> |
| </form> |
| |
| <!-- <input type="text" class="form-control" placeholder="Enter text to paraphrase" --> |
| <!-- id="sourceTxt" autofocus="autofocus" size=100 /> --> |
| </div> |
| </div> |
| </div> |
| |
| <div class="panel-heading"> |
| <h3 class="panel-title">Output</h3> |
| </div> |
| <div class="panel-body"> |
| <div class="row"> |
| <div class="col-lg-8" id="output"> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| |
| <!-- |
| <select id="ppdb_size"> |
| <option value="S">S</option> |
| <option value="M">M</option> |
| <option value="L">L</option> |
| <option value="XL" selected="selected">XL</option> |
| <option value="XXL">XXL</option> |
| <option value="XXXL">XXXL</option> |
| </select> |
| <select id="ppdb_type"> |
| <option value="all" selected="selected">All</option> |
| <option value="lex">Lexical</option> |
| <option value="phrasal">Phrasal</option> |
| <option value="syntactic">Syntactic</option> |
| </select> |
| --> |
| |
| <div id="rules" class="tab-pane fade"> |
| <div class="panel panel-default"> |
| <div class="panel-heading"> |
| <h3 class="panel-title">Rules</h3> |
| </div> |
| |
| <div class="panel-body"> |
| <div class="row"> |
| <div class="col-md-8 col-xs-12"> |
| <table class="table table-striped table-condensed" id="ruletable"> |
| <thead> |
| <tr> |
| <th width="5%"></th> |
| <th>Source</th> |
| <th>Target</th> |
| </tr> |
| </thead> |
| <tbody> |
| </tbody> |
| </table> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| |
| <div id="params" class="tab-pane fade"> |
| <div class="panel panel-default"> |
| <div class="panel-heading"> |
| <h3 class="panel-title">Parameters</h3> |
| </div> |
| <div id="params" class="panel-body"> |
| <div class="panel-body"> |
| <div class="col-md-6"> |
| <div class="input-group"> |
| <span class="input-group-addon" id="label-host">Host</span> |
| <input type="text" class="form-control" value="127.0.0.1" size="40" id="server_host" |
| aria-describedby="label-host" /> |
| <span class="input-group-addon" id="label-port">Port</span> |
| <input type="text" class="form-control" value="" size="5" id="server_port" |
| aria-describedby="label-port" /> |
| </div> |
| <br/> |
| |
| <h5>Feature weights</h5> |
| <div id="feature_weights"> |
| <div class="input-group"> |
| <span class="input-group-addon" id="label-lm_0">lm_0</span> |
| <input type="text" class="form-control weights" value="1.0" size="4" id="lm_0" |
| aria-describedby="label-lm_0" /> |
| </div> |
| <div class="input-group"> |
| <span class="input-group-addon" id="label-WordPenalty">WordPenalty</span> |
| <input type="text" class="form-control weights" value="1.0" size="4" id="WordPenalty" |
| aria-describedby="label-WordPenalty" /> |
| </div> |
| <div class="input-group"> |
| <span class="input-group-addon" id="label-PhrasePenalty">PhrasePenalty</span> |
| <input type="text" class="form-control weights" value="1.0" size="4" id="PhrasePenalty" |
| aria-describedby="label-PhrasePenalty" /> |
| </div> |
| <div class="input-group"> |
| <span class="input-group-addon" id="label-OOVPenalty">OOVPenalty</span> |
| <input type="text" class="form-control weights" value="1.0" size="4" id="OOVPenalty" |
| aria-describedby="label-OOVPenalty" /> |
| </div> |
| <!-- WordPenalty, OOVPenalty, PhrasePenalty, GoogleNgramSim, AGigaSim --> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| |
| <div id="instructions" class="tab-pane fade"> |
| <div class="panel panel-default"> |
| <div class="panel-heading"> |
| <h3 class="panel-title">Instructions</h3> |
| </div> |
| |
| <div class="panel-body"> |
| <div class="col-md-10 col-xs-12"> |
| <div class="panel panel-info"> |
| <div class="panel-heading">Adding rules</div> |
| <div class="panel-body"> |
| <p> |
| To enter a rule, type its source and target sides in the boxes above. |
| For example, you might enter: |
| </p> |
| |
| <div class="well well-sm"> |
| source="ne peux pas" target="can't" |
| </div> |
| |
| <p> |
| Then click "Add Rule" to have the rule added. |
| The rule will appear in the list above, and any data in the input box on the first tab will be retranslated. |
| </p> |
| |
| <p> |
| For more advanced usage, you can add hierarchical rules. |
| These are rules with a variable inside them. |
| The variable serves as a substitution point for the source and target sides. |
| For example: |
| </p> |
| |
| <div class="well well-sm"> |
| source="ne X pas" target="do not X" |
| </div> |
| |
| <p> |
| X here will be replaced with another phrase pair that you have entered. |
| If you have another entry for "veux" and "want", for example, the decoder can use these two rules to translate the source phrase "do not want". |
| </p> |
| |
| <p> |
| Up to two variables are permitted: X and Y. |
| </p> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| |
| </div> |
| |
| </div> |
| |
| <hr/> |
| |
| <!-- <footer> --> |
| <!-- <p>© Johns Hopkins University</p> --> |
| <!-- </footer> --> |
| |
| <!-- Bootstrap core JavaScript |
| ================================================== --> |
| <!-- Placed at the end of the document so the pages load faster --> |
| <script src="bootstrap/js/jquery-2.2.0.min.js"></script> |
| <script src="bootstrap/js/bootstrap.min.js"></script> |
| <script src="demo.js" type="text/javascript"></script> |
| </body> |
| </html> |
