В лучшем случае готовый вариант будет таков:
http://s46.radikal.ru/i113/1003/0a/d5e1f9d33fd6.jpg Картинки - http://www.skinfium.ru/addon/20/
Грузим их в папку xstatuses в корне, с именами 1, 2, 3 и т.д.
Страница добавления/редактирования материала:
Code
onload="toValue('statusImg', '/xstatuses/1.png');"
Ставим кнопку для выбора картинки:
Code
<img style="display:inline;" id="stImg" onclick="toShow ('entImgSt');toShowLine ('stImg2'); toHide ('stImg')" src="/xstatuses/1.png">
<img style="display:none;" id="stImg2" onclick="toHide ('entImgSt');toHide ('stImg2'); toShowLine ('stImg')" src="/xstatuses/1.png">
И ставьте куда захотите следующее (это сами картинки, из которых необходимо выбирать):
Code
<div style="display:none;" id="entImgSt">
<img class="stImgt" onclick="toValue('statusImg', '/xstatuses/1.png');toSrc ('stImg', '/xstatuses/1.png');toSrc ('stImg2', '/xstatuses/1.png');toHide ('entImgSt');toShowLine ('stImg');toHide ('stImg2');" src="/xstatuses/1.png">
<img class="stImgt" onclick="toValue('statusImg', '/xstatuses/2.png');toSrc ('stImg', '/xstatuses/2.png');toSrc ('stImg2', '/xstatuses/2.png');toHide ('entImgSt');toShowLine ('stImg');toHide ('stImg2');" src="/xstatuses/2.png">
<img class="stImgt" onclick="toValue('statusImg', '/xstatuses/3.png');toSrc ('stImg', '/xstatuses/3.png');toSrc ('stImg2', '/xstatuses/3.png');toHide ('entImgSt');toShowLine ('stImg');toHide ('stImg2');" src="/xstatuses/3.png">
<img class="stImgt" onclick="toValue('statusImg', '/xstatuses/4.png');toSrc ('stImg', '/xstatuses/4.png');toSrc ('stImg2', '/xstatuses/4.png');toHide ('entImgSt');toShowLine ('stImg');toHide ('stImg2');" src="/xstatuses/4.png">
<img class="stImgt" onclick="toValue('statusImg', '/xstatuses/5.png');toSrc ('stImg', '/xstatuses/5.png');toSrc ('stImg2', '/xstatuses/5.png');toHide ('entImgSt');toShowLine ('stImg');toHide ('stImg2');" src="/xstatuses/5.png">
<img class="stImgt" onclick="toValue('statusImg', '/xstatuses/6.png');toSrc ('stImg', '/xstatuses/6.png');toSrc ('stImg2', '/xstatuses/6.png');toHide ('entImgSt');toShowLine ('stImg');toHide ('stImg2');" src="/xstatuses/6.png">
<img class="stImgt" onclick="toValue('statusImg', '/xstatuses/7.png');toSrc ('stImg', '/xstatuses/7.png');toSrc ('stImg2', '/xstatuses/7.png');toHide ('entImgSt');toShowLine ('stImg');toHide ('stImg2');" src="/xstatuses/7.png">
<img class="stImgt" onclick="toValue('statusImg', '/xstatuses/8.png');toSrc ('stImg', '/xstatuses/8.png');toSrc ('stImg2', '/xstatuses/8.png');toHide ('entImgSt');toShowLine ('stImg');toHide ('stImg2');" src="/xstatuses/8.png">
<img class="stImgt" onclick="toValue('statusImg', '/xstatuses/9.png');toSrc ('stImg', '/xstatuses/9.png');toSrc ('stImg2', '/xstatuses/9.png');toHide ('entImgSt');toShowLine ('stImg');toHide ('stImg2');" src="/xstatuses/9.png">
<img class="stImgt" onclick="toValue('statusImg', '/xstatuses/10.png');toSrc ('stImg', '/xstatuses/10.png');toSrc ('stImg2', '/xstatuses/10.png');toHide ('entImgSt');toShowLine ('stImg');toHide ('stImg2');" src="/xstatuses/10.png">
</div>
Все ссылки меняем естественно на свои. Далее, вставляем в следующее:
Code
<style type="text/css">#stImg {margin-top:4px;margin-left:10px;padding:4px;border:1px solid #c0cad5;cursor:pointer}
#stImg2 {margin-top:4px;margin-left:10px;padding:4px;border:1px solid #c0cad5;cursor:pointer;display:none;}
#entImgSt {position:absolute;margin-top:10px;border: 1px solid #c0cad5;padding:4px;background-color:#fff;margin-left:3px;width:188px;height:21px;line-height:26px;}
.stImgt {cursor:pointer;padding-left:1px;}
</style>
<script type="text/javascript">
function toValue (toId, toVal) {document.getElementById(toId).value=toVal;}
function toSrc (toIdSrc, toSrcSrc) {document.getElementById(toIdSrc).src=toSrcSrc;}
function toHide (toHideId) {document.getElementById(toHideId).style.display='none'}
function toShow (toShowId) {document.getElementById(toShowId).style.display='block'}
function toShowLine (toShowLineId) {document.getElementById(toShowLineId).style.display='inline'}
</script>
Это сами CSS и скрипт. Неисправление стилей ведет к большому ужасу. Активируем любое доп. поле.
Ставим в любое место:
Code
<input style="display:none;" id="statusImg">
Теперь находим примерно следующее:
Code
<script type="text/javascript">
$(document).ready(function(){
$("#addst").click(function(){
$("#loadstat").show();
var ssid = $("input[name='ssid']").val();
var statmess = $("#status").val();
И сразу после var statmess = $("#status").val(); ставим:
Code
var statimg = $("#statusImg").val();
Там же после message: statmess, ставим:
other4 - цифру 4 заменяем на номер вашего доп. поля. Вид материалов:
Ставим сразу после <div class="my_status">:
Code
<?if($OTHER4$)?><img style="padding-top: 6px; line-height: 15px;padding-bottom:1px" src="$OTHER4$"><?else?><img style="padding-top: 6px; line-height: 15px;padding-bottom:1px" src="$OTHER4$"><?else?><img style="padding-top: 6px; line-height: 15px;padding-bottom:1px" src="/xstatuses/1.png"><?endif?>
Стиль картинки настроен под меня, поэтому и его правьте под себя. $OTHER4$ - естественно меняем на переменную вашего доп. поля. Если у вас по каким-то причинам нет <div class="my_status">, то тогда ставим код выше перед каждым $MESSAGE$, однако, это усложнит работу.
