remove textareas

This commit is contained in:
tophf 2017-11-22 16:28:50 +03:00
parent e1fae23927
commit a7b8286e4f
3 changed files with 15 additions and 19 deletions

View File

@ -85,8 +85,7 @@
</template> </template>
<template data-id="section"> <template data-id="section">
<div> <div>
<label i18n-text="sectionCode"></label> <label i18n-text="sectionCode" class="code-label"></label>
<textarea class="code"></textarea>
<br> <br>
<div class="applies-to"> <div class="applies-to">
<label i18n-text="appliesLabel"> <label i18n-text="appliesLabel">

View File

@ -375,9 +375,13 @@ function acmeEventListener(event) {
CodeMirror.setOption(option, value); CodeMirror.setOption(option, value);
} }
// replace given textarea with the CodeMirror editor function setupCodeMirror(sectionDiv, code, index) {
function setupCodeMirror(textarea, index) { const cm = CodeMirror(wrapper => {
const cm = CodeMirror.fromTextArea(textarea, {lint: null}); $('.code-label', sectionDiv).insertAdjacentElement('afterend', wrapper);
}, {
value: code,
lint: null,
});
const wrapper = cm.display.wrapper; const wrapper = cm.display.wrapper;
cm.on('changes', indicateCodeChangeDebounced); cm.on('changes', indicateCodeChangeDebounced);
@ -640,12 +644,12 @@ function addSection(event, section) {
$('.add-section', div).addEventListener('click', addSection, false); $('.add-section', div).addEventListener('click', addSection, false);
$('.beautify-section', div).addEventListener('click', beautify); $('.beautify-section', div).addEventListener('click', beautify);
const codeElement = $('.code', div); const code = (section || {}).code || '';
const appliesTo = $('.applies-to-list', div); const appliesTo = $('.applies-to-list', div);
let appliesToAdded = false; let appliesToAdded = false;
if (section) { if (section) {
codeElement.value = section.code;
for (const i in propertyToCss) { for (const i in propertyToCss) {
if (section[i]) { if (section[i]) {
section[i].forEach(url => { section[i].forEach(url => {
@ -698,13 +702,13 @@ function addSection(event, section) {
const clickedSection = getSectionForChild(event.target); const clickedSection = getSectionForChild(event.target);
sections.insertBefore(div, clickedSection.nextElementSibling); sections.insertBefore(div, clickedSection.nextElementSibling);
const newIndex = getSections().indexOf(clickedSection) + 1; const newIndex = getSections().indexOf(clickedSection) + 1;
cm = setupCodeMirror(codeElement, newIndex); cm = setupCodeMirror(div, code, newIndex);
makeSectionVisible(cm); makeSectionVisible(cm);
cm.focus();
renderLintReport(); renderLintReport();
cm.focus();
} else { } else {
sections.appendChild(div); sections.appendChild(div);
cm = setupCodeMirror(codeElement); cm = setupCodeMirror(div, code);
} }
div.CodeMirror = cm; div.CodeMirror = cm;
setCleanSection(div); setCleanSection(div);
@ -1596,11 +1600,6 @@ function save() {
function saveSectionStyle() { function saveSectionStyle() {
updateLintReportIfEnabled(null, 0); updateLintReportIfEnabled(null, 0);
// save the contents of the CodeMirror editors back into the textareas
for (let i = 0; i < editors.length; i++) {
editors[i].save();
}
const error = validate(); const error = validate();
if (error) { if (error) {
alert(error); alert(error);

View File

@ -14,9 +14,7 @@ function createSourceEditor(style) {
$('#mozilla-format-heading').parentNode.remove(); $('#mozilla-format-heading').parentNode.remove();
$('#sections').appendChild( $('#sections').appendChild(
$element({className: 'single-editor', appendChild: [ $element({className: 'single-editor'})
$element({tag: 'textarea'})
]})
); );
$('#header').appendChild($element({ $('#header').appendChild($element({
@ -42,7 +40,7 @@ function createSourceEditor(style) {
style = deepCopy(style); style = deepCopy(style);
} }
const cm = CodeMirror.fromTextArea($('#sections textarea')); const cm = CodeMirror($('.single-editor'));
editors.push(cm); editors.push(cm);
updateMeta().then(() => { updateMeta().then(() => {
initLint(); initLint();