698310 - Spell Check Dialog to small for long words. Make it resizable.

Status: VERIFIED FIXED

(SeaMonkey :: General, enhancement)

Description

[:Hb]

Attachment: Screenshot

The spell check dialog used in Mailnews and in Composer is too small and can't handle the word Kindertagesstättenbedarfsplanung.

Comment 1

[Philip Chee]

Attachment: Patch v1.0 Suite and Editor-ui changes.

This patch makes the EdSpellCheck dialog resizable. Also flexes the listbox.

Comment 2

[[e-mail]]

Comment on attachment 8492660 [details] [diff] [review]
Patch v1.0 Suite and Editor-ui changes.

I'm not convinced that you should persist the width.

The list should flex to fill the available height.

The misspelled word should flex to fill the available width!

Comment 3

[Philip Chee]

Attachment: Patch v2.0 fix review issues.

> I'm not convinced that you should persist the width.
Removed.

> The list should flex to fill the available height.
Fixed. Managed to do this after poking at the dialog with DOMi.

> The misspelled word should flex to fill the available width!
Fixed. Now using the "crop" attribute on the label instead of TruncateStringAtWordEnd(). Bonus we get a proper ellipsis.

> -  gDialog.MisspelledWord.setAttribute("value", TruncateStringAtWordEnd(gMisspelledWord, 30, true));
> +  gDialog.MisspelledWord.setAttribute("value", gMisspelledWord);

> -          <spacer flex="1"/>
> +          <separator/>
I tried class="thin" but decided it looked better without the thin.

Comment 4

[[e-mail]]

Comment on attachment 8497101 [details] [diff] [review]
Patch v2.0 fix review issues.

>         <vbox>
>-          <grid flex="1">
>+          <grid>
>             <columns><column class="spell-check" flex="1"/><column class="spell-check" flex="1"/></columns>
>             <rows>
>               <row>
>                 <button id="Replace" label="&replaceButton.label;"
>                         oncommand="Replace(gDialog.ReplaceWordInput.value);"
>                         accesskey="&replaceButton.accessKey;"/>
>                 <button id="Ignore"  oncommand="Ignore();" label="&ignoreButton.label;"
>                         accesskey="&ignoreButton.accessKey;"/>
>@@ -74,17 +74,17 @@
>               <row>
>                 <button id="ReplaceAll" oncommand="ReplaceAll();" label="&replaceAllButton.label;"
>                         accesskey="&replaceAllButton.accessKey;"/>
>                 <button id="IgnoreAll"  oncommand="IgnoreAll();" label="&ignoreAllButton.label;"
>                         accesskey="&ignoreAllButton.accessKey;"/>
>               </row>
>             </rows> 
>           </grid>
>-          <spacer flex="1"/>
>+          <separator/>
>           <label value="&userDictionary.label;"/>
>           <hbox flex="1" align="start">
>             <button class="spell-check" id="AddToDictionary" oncommand="AddToDictionary()" label="&addToUserDictionaryButton.label;"
>                     accesskey="&addToUserDictionaryButton.accessKey;"/>
>             <button class="spell-check" id="EditDictionary"  oncommand="EditDictionary()" label="&editUserDictionaryButton.label;"
>                     accesskey="&editUserDictionaryButton.accessKey;"/>
>           </hbox>
>         </vbox>
Nit: I don't mind you removing the flex from the grid and the spacer (separator) but then you might as well remove it from the hbox too.

(On a side note, the use of a grid only for some of the buttons looks a little inconsistent.)

Comment 5

[Philip Chee]

Pushed to comm-central

Comment 6

[Philip Chee]

Pushed to comm-central:
http://hg.mozilla.org/comm-central/rev/ebf02afd4903

Comment 7

[:Hb]

Wonderful.