Edit msgstr in textarea

motiejus · May 5, 2011 · c184057 · c184057
1 parent ebf916a
commit c184057
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 22 deletions.
diff --git a/trool/app/views/pos/show.html.erb b/trool/app/views/pos/show.html.erb
@@ -26,8 +26,9 @@
       <td class="msgstr">
         <%= form_for :msg, :url => po_message_url(@po, msg),
                      :remote => true, :html => { :method => :put } do |f| %>
-             <%= f.text_field :msgstr, :id => "msgstr-text-#{msg.id}",
-                         :class => "msgstr_textfield", :value => msg.msgstr %>
+             <%= f.text_area :msgstr, :id => "msgstr-text-#{msg.id}",
+                             :class => "msgstr_text",
+                             :value => msg.msgstr, :rows => msg.msgid.count("\n") + 1 %>
         <% end %>
         </td>
         <td class="msgstuff">

diff --git a/trool/public/javascripts/po.js b/trool/public/javascripts/po.js
@@ -1,14 +1,14 @@
 $(document).ready(function() {
-    $('#messages input').change(function() { // Submit changes
+    $('input, textarea', '#messages').change(function() { // Submit changes
         $(this).closest('form').submit();
-    }).filter(':text').keypress(function(e) { // focus next/prev
+    }).filter('textarea').keypress(function(e) { // focus next/prev
         // on tab or enter, focus next entry
-        if (e.keyCode == 13 || e.keyCode == 9) {
+        if ((e.ctrlKey && e.keyCode == 13) || e.keyCode == 9) {
             if (e.shiftKey) // previous
               $(this).closest('tr').prev().
-                      find('input:text').focus();
+                      find('textarea').focus();
             else $(this).closest('tr').next(). // next
-                      find('input:text').focus();
+                      find('textarea').focus();
             return false;
         }
     }).focusin(function() {

diff --git a/trool/public/stylesheets/po.css b/trool/public/stylesheets/po.css
@@ -7,38 +7,41 @@ table#messages {
     width: 100%;
 }
   #messages td {
-      padding: 5px;
       border-top: 1px #CCC solid;
       border-bottom: 1px #CCC solid;
   }
   #messages .msgstr {
-      width: 360px;
-      max-width: 360px;
+      width: 400px;
+      max-width: 400px;
   }
   #messages .msgid {
-      width: 360px;
-      max-width: 360px;
-      /*word-wrap: break-word;*/
+      padding: 5px;
+      width: 400px;
+      max-width: 400px;
       white-space: pre-wrap;
+      vertical-align: top;
   }
   #messages .msgid span.spaced {
       background-color: #EEE;
   }
+  #messages .msgstuff {
+    padding: 5px;
+  }
   #messages .msgstuff label {
     font-size: 10px;
   }
-  #messages .msgstr input.msgstr_textfield {
-      padding: 5px;
+  #messages .msgstr .msgstr_text {
+      font-size: 13px;
+      padding: 4px;
       border: none;
       width: 100%;
   }
-    #messages .msgstr input.msgstr_textfield.current {
-      background: #FFA !important;
-    }
-    #messages .msgstr input.msgstr_textfield.focused {
-      background: #F4F4F4;
-    }
-
+  #messages .msgstr .msgstr_text.current {
+    background: #FFA !important;
+  }
+  #messages .msgstr .msgstr_text.focused {
+    background: #F4F4F4;
+  }
 
 #navigation_statuses {
   margin-bottom: 10px;