Переносы строк в div contenteditable при выделении текста
 

Доброго всем времени суток!

Пишу простенький визуальный редактор для сайта.
Сразу оговорюсь, что готовые решения применять не хочу в принципе.
Мысль следующая, у редактора есть буквально несколько кнопок: форматирование текста (жирный, курсив и т.д.), вставка ссылки и вставка картинки и оформление текста как кода.
Вот с последний возникла проблема
Пишу код, далее нажимаю кнопку, которая оборачивает этот код в див с классом, который в css настроен на красиво отображение кода.
Выглядит так:

doc[0].focus();

		var selRange = window.getSelection().getRangeAt(0);
		console.log(selRange.innerHTML);
		if (selRange.toString().length>0) {
			var obj = document.createElement("div");

			$(obj).addClass('codeBlock');
			var text = selRange.toString();
			$(obj).html(text);

			selRange.deleteContents();
			selRange.insertNode(obj);
			doc.trigger('input');
		}

И всё бы хорошо, но в рендже нет переносов строк в принцпипе.
Я знаю, что браузер при нажатии на энтер создаёт новый блок и пишет в него, эмитируя перенос строки, меня это не смущает, меня смущает то, что при подобном форматировании я получаю простыню из одной длинной строки.
Можно ли как-то этот вопрос решить? может быть как-то аналогично форматированию текста просто оборачивать не в b а в div (делаю это через execComand)?
Заранее благодарю за любые советы!

NapalmRain, оборачивай в <pre>

Не все - FF вставляет BR, Хром DIV, а в нем BR.

NapalmRain, с твоими знаниями, судя по коду даже элементарных вещей не знаешь, лучше использовать готовое решение...

Rise, я был бы признателен, если б вы объяснили, что в моём кода такого ужасного, что складывается такое впечатление?
Одна из причин написания своего, а не использования готового - это обучение. Используя готовое особо не наразвиваешься...

laimas, да, не спорю, но я думаю на суть вопроса это не должно повлиять... Разве нет?

Rise, Благодарю, получилось. Попробовал сделать это через execCommand('formatBlock', false, 'pre'); Оборачивает всё прекрасно, но, к сожалению, не умеет отменять это действие, аналогично форматированию. Если я правильно понимаю, нативного решения нет?

Это смотрят что вам нужно. Редактор для чего - получить html, так? В html перенос что - <br>, так? Чего еще нужно?

Смущает "длинная строка" полученного кода? А вам что от этого плохо? :) Идеальный html, это html без мусора в виде лишних пробелов, переноса строк, табуляций, где они не нужны. Не вам его разбирать, а браузеру. А нужно глянуть на структуру, так отладчик браузера все покажет.

NapalmRain, у меня нет желания объяснять каждую строку твоего кода увы... почитай Учебник для развития...

Rise, мда, прям профессионализм во всей красе. Всегда любил отечественные форумы за это. Ну да фиг с ним, хоть за совет с пре спасибо...

laimas, идея получить на выходе визуально что-то похожее на правду.
То есть я скопипащу в свой "редактор" кусок своего кода, обрамлю его тегом, говорящим, что это код, ну а потом допишу вне этого обрамления некое описание. Всё это отправлю в базу и потом это отобразиться пользователю. Если я потеряю переносы строк и отступы, я получу архинечитабельную хрень... Вот где-то тут кроется проблема.

Напиши RFC на W3C, может прислушаются к твоему разве нет и прикажут браузерописателям рендерить /r/n на веб-страницах.

Именно, но твой ламерим заведомо сильнее, поскольку подразумевает произвольные желания, типа хочу чтобы солнце было треугольным - и само по себе такое желание поднимает самооценку на недосягаемую для профессионала высоту, а профессионализм всегда в рамках сугубой реальности (но не в случае с Титаником, конеш).