From 135a2e4c46285c8f9f2dbf55d833322a0f925737 Mon Sep 17 00:00:00 2001
From: Max Pozdeev <maxpozdeev@gmail.com>
Date: Wed, 8 Sep 2010 23:08:56 +0400
Subject: [PATCH] * design fix for quick task add (Esc key erases the input)

---
 src/mytinytodo.js            | 11 +++++++++++
 src/themes/default/index.php | 19 ++++++++++---------
 src/themes/default/style.css | 23 +++++++++++++----------
 3 files changed, 34 insertions(+), 19 deletions(-)

diff --git a/src/mytinytodo.js b/src/mytinytodo.js
index 3cc9724..343fd42 100644
--- a/src/mytinytodo.js
+++ b/src/mytinytodo.js
@@ -114,11 +114,22 @@ var mytinytodo = window.mytinytodo = _mtt = {
 			submitNewTask(this);
 			return false;
 		});
+		
+		$('#newtask_submit').click(function(){
+			$('#newtask_form').submit();
+		});
 
 		$('#newtask_adv').click(function(){
 			showEditForm(1);
 			return false;
 		});
+		
+		$('#task').keydown(function(event){
+			if(event.keyCode == 27) {
+				$(this).val('');
+			}
+		});
+
 
 		$('#search_form').submit(function(){
 			searchTasks(1);
diff --git a/src/themes/default/index.php b/src/themes/default/index.php
index 8dbd3e8..18cd5c1 100644
--- a/src/themes/default/index.php
+++ b/src/themes/default/index.php
@@ -103,15 +103,16 @@ $().ready(function(){
 </div>
 
 <div id="htab_newtask">
- <form id="newtask_form" method="post">
-  <table cellspacing="0" cellpadding="0"><tr>
-   <td class="flex-cell"><input type="text" name="task" value="" maxlength="250" id="task" /></td>
-   <td class="flex-cell-companion">
-    <input type="submit" value="<?php _e('btn_add');?>" />
-    <a href="#" id="newtask_adv" class="mtt-img-button" title="<?php _e('advanced_add');?>"><span></span></a>
-   </td>
-  </tr></table>
- </form>
+ <table class="mtt-taskbox"><tr><td class="mtt-tb-cell">
+  <div class="mtt-tb-c">
+   <form id="newtask_form" method="post">
+    <input type="text" name="task" value="" maxlength="250" id="task" autocomplete="off" />
+    <div id="newtask_submit" class="mtt-taskbox-icon mtt-icon-submittask" title="<?php _e('btn_add');?>"></div>
+   </form>
+  </div>
+ </td>
+ <td><a href="#" id="newtask_adv" class="mtt-img-button" title="<?php _e('advanced_add');?>"><span></span></a></td>
+ </tr></table>
 </div>
  
 <div id="searchbar" style="display:none"><?php _e('searching');?> <span id="searchbarkeyword"></span></div>
diff --git a/src/themes/default/style.css b/src/themes/default/style.css
index 4d48389..eda8019 100644
--- a/src/themes/default/style.css
+++ b/src/themes/default/style.css
@@ -94,24 +94,26 @@ a { color:#0000ff; cursor:pointer; text-decoration:underline; }
 
 .mtt-htabs  { clear:both; padding:8px; border-bottom:2px solid #DEDEDE; background:#ededed; }
 
-.mtt-img-button { width:16px; height:16px; padding:2px; border:1px solid transparent; }
+.mtt-img-button { width:16px; height:16px; padding:2px; border:1px solid transparent; display:inline-block; }
 .mtt-img-button:hover { border:1px solid #ccc; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; }
 .mtt-img-button span { display:inline-block; width:16px; height:16px; }
 
-#newtask_adv span { position:relative; top:3px; background:url(images/buttons.png) 0 -48px no-repeat; }
-#newtask_adv:hover span { background-position:-16px -48px; }
-
 .arrdown { display:inline-block; height:7px; width:9px; background:url(images/arrdown.gif); }
 .arrdown2 { display:inline-block; height:7px; width:7px; background:url(images/arrdown2.gif); }
 
-.flex-cell { padding-right:6px; }
-.flex-cell input { width:100%; padding:2px; border:1px inset #f0f0f0; } 
-.flex-cell-companion { white-space:nowrap; }
 
-#newtask_form .flex-cell { width:350px }
-#newtask_form .flex-cell-companion { padding-left:2px; }
+/* Quick Task Add */
+
+.mtt-taskbox td.mtt-tb-cell { padding:0px; width:350px; }
+.mtt-tb-c { position:relative; padding-left:22px; /*input padding+border*/ }
+#task { color:#444444; background:#fff; height:1.35em; padding:2px; padding-right:18px; border:1px inset #F0F0F0; width:100%; margin-left:-22px; }
+
+.mtt-taskbox-icon { width:16px; height:16px; position:absolute; top:50%; margin-top:-8px; }
+.mtt-taskbox-icon.mtt-icon-submittask { background:url(images/mzl.png) 0px -32px no-repeat; right:4px; }
+
+#newtask_adv span { background:url(images/buttons.png) 0 -48px no-repeat; }
+#newtask_adv:hover span { background-position:-16px -48px; }
 
-#task { color:#444444; width:100%; }
 
 /* Live Search */
 #search {
@@ -130,6 +132,7 @@ a { color:#0000ff; cursor:pointer; text-decoration:underline; }
 #searchbar { font-size:1em; font-weight:normal; display:none;  margin-top:5px; }
 #searchbarkeyword { font-weight:bold; }
 
+
 /* */
 .mtt-notes-showhide { font-size:0.8em; font-weight:normal; margin-left:2px; margin-right:2px; }
 .mtt-notes-showhide a { text-decoration:none; border-bottom:1px dotted; }