- simple notification of untranslated strings (red icon)

- height of the panel can be set - fixed saving of data in IE (tested in IE8 only)
jsmitka · May 20, 2010 · a3dba3a · a3dba3a
1 parent d1eb9b6
commit a3dba3a
Show file tree

Hide file tree

Showing 3 changed files with 72 additions and 37 deletions.
diff --git a/TranslationPanel.panel.phtml b/TranslationPanel.panel.phtml
@@ -37,21 +37,24 @@
 /* @var $translator IEditableTranslator */
 ?>
 
-<style>
+<style type="text/css">
 #TranslationPanel {
 	min-width: 600px;
 }
 
 #TranslationPanel .nette-inner {
 	max-width: 800px !important;
+	height: <?php echo $this->height . 'px'; ?>;
+	padding: 1px;
 }
 
 #TranslationPanel-strings {
 	width: 30%;
-	height: 300px;
+	height: 100%;
 	overflow: auto;
 	float: left;
 	border: 1px solid #AAA;
+	margin: -1px 0 -1px -1px;
 }
 
 #TranslationPanel div.TranslationPanel-string {
@@ -85,14 +88,15 @@
 }
 
 #TranslationPanel-editor {
-	width: 65%;
-	float: left;
-	margin-left: 1ex;
+	width: 68%;
+	height: 100%;
+	margin: -1px -1px -1px 0;
+	float: right;
+	position: relative;
 }
 
 #TranslationPanel div.TranslationPanel-stringVariant {
 	width: 50%;
-	height: 45%;
 	float: left;
 }
 
@@ -115,7 +119,10 @@
 }
 
 #TranslationPanel-tools {
-	clear: both;
+	position: absolute;
+	bottom: 0px;
+	right: 0px;
+	width: 98%;
 	background-color: #EDEAE0;
 	padding: 1ex;
 	text-align: right;
@@ -215,22 +222,32 @@ var translationPanel = {
 		list.innerHTML = '';
 		this.listElements = [];
 
+		var strings = [{}, {}];
 		for (var i in this.strings) {
-			var div = document.createElement('div');
-			div.className = 'TranslationPanel-string';
-			if (!this.strings[i])
-				div.className += ' untranslated';
-
-			var a = document.createElement('a');
-			a.appendChild(document.createTextNode(i));
-			a.onclick = function () {
-				translationPanel.edit(this);
-			};
+			if (this.strings[i])
+				strings[1][i] = this.strings[i];
+			else
+				strings[0][i] = this.strings[i];
+		}
+
+		for (var j in strings) {
+			for (var i in strings[j]) {
+				var div = document.createElement('div');
+				div.className = 'TranslationPanel-string';
+				if (!this.strings[i])
+					div.className += ' untranslated';
 
-			div.appendChild(a);
-			list.appendChild(div);
+				var a = document.createElement('a');
+				a.appendChild(document.createTextNode(i));
+				a.onclick = function () {
+					translationPanel.edit(this);
+				};
 
-			this.listElements[i] = div;
+				div.appendChild(a);
+				list.appendChild(div);
+
+				this.listElements[i] = div;
+			}
 		}
 	},
 
@@ -288,7 +305,7 @@ var translationPanel = {
 
 		var xmlHttp = window.ActiveXObject ? new ActiveXObject('Microsoft.XMLHTTP') : new XMLHttpRequest();
 		xmlHttp.onreadystatechange = function() {
-			if (this.readyState == 4) {
+			if (xmlHttp.readyState == 4) {
 				if (xmlHttp.status == 200) {
 					translationPanel.updatedStrings = [];
 					translationPanel.currentString = false;
@@ -324,20 +341,20 @@ var translationPanel = {
 		</div>
 
 		<div id="TranslationPanel-editor">
-		<?php
-		for ($i = 0; $i < $translator->getVariantsCount(); ++$i) {
-		?>
-			<div class="TranslationPanel-stringVariant">
-				<label for="TranslationPanel-stringVariant_<?php echo $i; ?>"><?php echo $i > 0 ? $i . '<sup>' . $this->ordinalSuffix($i) . '</sup> plural': 'Singular'; ?>:</label>
-				<textarea id="TranslationPanel-stringVariant_<?php echo $i; ?>" rows="4" cols="40"></textarea>
+			<?php
+			for ($i = 0; $i < $translator->getVariantsCount(); ++$i) {
+			?>
+				<div class="TranslationPanel-stringVariant">
+					<label for="TranslationPanel-stringVariant_<?php echo $i; ?>"><?php echo $i > 0 ? $i . '<sup>' . $this->ordinalSuffix($i) . '</sup> plural': 'Singular'; ?>:</label>
+					<textarea id="TranslationPanel-stringVariant_<?php echo $i; ?>" rows="4" cols="40"></textarea>
+				</div>
+			<?php
+			}
+			?>
+			<div id="TranslationPanel-tools">
+				<span id="TranslationPanel-status">Initializing&hellip;</span>
+				<input type="button" value="Save" class="save" id="TranslationPanel-save" />
 			</div>
-		<?php
-		}
-		?>
-		<div id="TranslationPanel-tools">
-			<span id="TranslationPanel-status">Initializing&hellip;</span>
-			<input type="button" value="Save" class="save" id="TranslationPanel-save" />
-		</div>
 		</div>
 	</div>
 </div>

diff --git a/TranslationPanel.php b/TranslationPanel.php
@@ -38,11 +38,19 @@ class TranslationPanel implements IDebugPanel
 	/** @var IEditableTranslator */
 	protected $translator;
 
+	/** @var int Height of the editor */
+	protected $height = 300;
+
 
 
-	public function __construct(IEditableTranslator $translator)
+	public function __construct(IEditableTranslator $translator, $height = NULL)
 	{
 		$this->translator = $translator;
+		if ($height !== NULL) {
+			if (!is_numeric($height))
+				throw new InvalidArgumentException('Panel height has to be a numeric value.');
+			$this->height = $height;
+		}
 
 		Environment::getApplication()->onStartup[] = callback($this, 'processRequest');
 	}
@@ -65,9 +73,19 @@ public function getId()
 	 */
 	public function getTab()
 	{
-		$tab = Html::el();
-		$tab->create('img')->src($this->getIconSrc('flag_blue.png'));
+		$tab = Html::el('span');
+		$image = $tab->create('img');
 		$tab->add('Translations');
+
+		$untranslatedCount = 0;
+		foreach ($this->translator->getStrings() as $value)
+			if (!$value)
+				++$untranslatedCount;
+		if ($untranslatedCount > 0)
+			$image->src($this->getIconSrc('flag_red.png'));
+		else
+			$image->src($this->getIconSrc('flag_blue.png'));
+
 		return (string) $tab;
 	}
 

diff --git a/icons/flag_red.png b/icons/flag_red.png