| <!DOCTYPE html> | 
| <html> | 
| <head> | 
|     <title></title> | 
|     <script type="text/javascript" src="../internal.js"></script> | 
|     <style type="text/css"> | 
|         .section { | 
|             text-align: center; | 
|             margin-top: 10px; | 
|         } | 
|         .section input { | 
|             margin-left: 5px; | 
|             width: 70px; | 
|         } | 
|     </style> | 
| </head> | 
| <body> | 
| <div class="section"> | 
|     <span><var id="lang_tdBkColor"></var></span> | 
|     <input type="text" id="J_tone"/> | 
| </div> | 
| <script type="text/javascript"> | 
|     var tone = $G("J_tone"), | 
|             colorPiker = new UE.ui.ColorPicker({ | 
|                 editor:editor | 
|             }), | 
|             colorPop = new UE.ui.Popup({ | 
|                 editor:editor, | 
|                 content:colorPiker | 
|             }); | 
|     domUtils.on(tone, "click", function () { | 
|         colorPop.showAnchor(tone); | 
|     }); | 
|     domUtils.on(document, 'mousedown', function () { | 
|         colorPop.hide(); | 
|     }); | 
|     colorPiker.addListener("pickcolor", function () { | 
|         tone.value = arguments[1]; | 
|         colorPop.hide(); | 
|     }); | 
|     colorPiker.addListener("picknocolor", function () { | 
|         tone.value=""; | 
|         colorPop.hide(); | 
|     }); | 
|     dialog.onok=function(){ | 
|         editor.execCommand("edittd",tone.value); | 
|     }; | 
|   | 
|     var start = editor.selection.getStart(), | 
|         cell = start && domUtils.findParentByTagName(start, ["td", "th"], true); | 
|     if(cell){ | 
|         var color = domUtils.getComputedStyle(cell,'background-color'); | 
|         if(/^#/.test(color)){ | 
|             tone.value = color | 
|         } | 
|   | 
|     } | 
|   | 
| </script> | 
| </body> | 
| </html> |