<!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> 
 |