<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html">
<head>
<meta charset="utf-8" />
<link href="../angular/css/bootstrap.min.css" rel="stylesheet" />
<link href="translation.css" rel="stylesheet" />

<script src="../angular/js/lib/angular.js"></script>
<script src="../angular/js/lib/ui-bootstrap-tpls.js"></script>
<script src="translation.js"></script>


<body ng-app="sedAngularTrans">
	<div nxt-loading-when="isBusy" id="translationSection" class="container-fluid" ng-controller="TranslationCtrl">
	  <div class="row translate-area">

		<div class="col-sm-12">
		  <div class="panel panel-default">
			<div class="panel-heading panel-heading-translation-header">{{sedName}} ({{fieldName}})</div>
		  </div>
		</div>

		<div class="col-sm-6">
		  <div class="panel panel-default">
			<div class="panel-heading panel-heading-translation" translate>Source Language:
			  <span class="print">{{countrySource}}</span>
			  <select class="translation no-print" ng-model="countrySource" ng-options="key as value for (key , value) in countries"></select>
			</div>
			<div class="panel-body">
			  <div class="translation-textarea-container">
				<textarea class="translation-textarea" ng-model="textSource" rows="4" cols="50" ng-disabled="true"></textarea>
			  </div>
			</div>
		  </div>
		</div>

		<div class="col-sm-6">
		  <div class="panel panel-default">
			<div class="panel-heading panel-heading-translation" translate>Target Language:
			  <span class="print">{{countryTarget}}</span>
			  <select class="translation no-print" ng-model="countryTarget" ng-options="key as value for (key , value) in countries"></select>
			</div>
			<div class="panel-body">
			  <div class="translation-textarea-container">
				<textarea class="translation-textarea" ng-model="textTarget" rows="4" cols="50" ng-disabled="true"></textarea>
			  </div>
			</div>
		  </div>
		</div>

		<div class="col-sm-12">
		  <div class="panel panel-default">
			<div class="panel-footer panel-footer-translation">
			  <div class="row first-row">
				<div class="col-sm-6 translation-footer-left">
				  <button type="button" class="btn btn-default" ng-disabled="!textTarget" ng-click="print()"><i class="fa fa-print"></i>{{ ' Print'}}</button>
				  <button type="button" class="btn btn-default" ng-disabled="!textTarget" ng-click="copy(textTarget)"><i class="fa fa-clipboard"></i>{{ ' Copy translation'}}</button>
				</div>
				<div class="col-sm-6 translation-footer-right">
				  <button type="button" class="btn btn-primary" ng-disabled="!countrySource || !countryTarget || countrySource == countryTarget " ng-click="translate()"><i class="fa fa-play"></i>{{ ' Translate'}}</button>
				</div>
			  </div>
			</div>
		  </div>
		</div>

	  </div>
	</div>
</body>
</html>