Показать сообщение отдельно
  #1 (permalink)  
Старый 01.07.2012, 12:35
Новичок на форуме
Отправить личное сообщение для Joyfit Посмотреть профиль Найти все сообщения от Joyfit
 
Регистрация: 01.07.2012
Сообщений: 2

Нужны советы по коду
Недавно написал свой скрипт для замены слов в тексте, результат работы здесь: www.wecode.ru/mine/wordedit
Делает он следующее: в диве у нас лежит какой либо текст (может быть с различными тегами), при наведении на слова/фрагменты - они выделяюся и при дальнейшем клике появляется инпут, в котором можем поменять слово на необходимое. При этом все ссылки должны выводиться ссылками без возможности их изменения, а остальные теги должны игнорироваться.

Хотелось бы услышать советы по коду, чтобы начать поменьше быдлокодить, как обычно получается))

Если что-то в коде не понятно, пишите, распишу назначения всех фрагментов/переменных

<div id="result"><a href="#">Начало</a>. Две ссылки подряд: <a href="#">вот</a> <a href="#">ссылка</a>. Ссылки разделенные короткими словами/символами: <a href="#">ссылка</a> вот <a href="#">ссылка</a>, <a href="#">ссылка</a>. Длинными словами: <a href="#">ссылка</a> длинная <a href="#">ссылка</a>. Скобочки: (<a href="#">ссылка</a>), <a href="#">ссылка</a> (<a href="#">ссылка</a>). <a href="#">Конец</a></div>


CWordEdit = {
    init: function() {
        var content = $("#result").html(),
            letter = "",
            newWord = 0,
            word = "",
            wordsArray = [],
            links = [],
            wordLen = 0,
            tagFlag = false,
            aFlag = false;
        for (var i = 0; i < content.length + 1; i++) {
            letter = this.getLetter(i, 1, content);
            if (letter == "<") {
                tagFlag = true;
                if (this.getLetter(i+1, 1, content) == "a") {
                    aFlag = true;
                    wordsArray[newWord] = word.trim();
                    if ((newWord > 0 && links[i-1] == "") || word.length > 0) {
                        newWord++;
                    }
                    word = "";
                    links[newWord] = "";
                }
            }
            if (!tagFlag && !aFlag) {
                if ((letter != " " || (wordLen <= 3 && this.getLetter(i+1, 2, content) != "<a")) &&  (i<content.length)) {
                    word += letter;
                    wordLen++;
                    if (!this.notEnding(letter) && this.notEnding(this.getLetter(i+1, 1, content))) {
                        links[newWord] = "";
                        wordsArray[newWord++] = word;
                        word = "";
                    }
                } else {
                    links[newWord] = "";
                    wordsArray[newWord++] = word.trim();
                    word = "";
                }
            } else if (aFlag) {
                links[newWord] += letter;
            }
            if (letter == " ") {
                wordLen = 0;
            }
            if (letter == ">") {
                if (this.getLetter(i-2, 2, content) == "/a") {
                    aFlag = false;
                    wordsArray[newWord++] = "";
                }
                tagFlag = false;
            }
        }
        content = "";
        for (i = 0; i < wordsArray.length; i++) {
            if (wordsArray[i] != "") {
                content += "<span class='ew'>" + wordsArray[i] + "</span>";
                if ("({[".indexOf(wordsArray[i])) {
                    content += " ";
                }
            } else {
                if (wordsArray[i-1] == "") {
                    content += " ";
                }
                content += links[i];
                if ((i+1) < wordsArray.length) {
                    if (this.notEnding(wordsArray[i+1].charAt(0))) {
                        content += " ";
                    }
                }
            }
        }
        $("#result").html(content);
        this.renderClicks();
        this.finishEdit();
    },
    getLetter: function(i, q, editContent) {
        return editContent.substring(i, i+q);
    },
    renderClicks: function() {
        $("#result .ew").live("click", function(){
            var chosenWord = $(this).html(),
                width = $(this).width();
            $(this).replaceWith("<input type='text' value='" + chosenWord + "' style='width:"+ width + "px' />");
            $("#result input").focus();
        });
    },
    notEnding: function(letter) {
        return !(".,!?;:)]}".indexOf(letter) + 1);
    },
    finishEdit: function() {
        $("#result input").live("blur", function(){
            if (!($(this).val().indexOf("<script>") + 1)) {
                $(this).replaceWith("<span class='ew'>" + $(this).val() + "</span>");
            } else {
                $(this).remove();
            }
        });
    }
};

$(document).ready(function(){
    CWordEdit.init();
});
Ответить с цитированием