Skip to content
Snippets Groups Projects
Commit 5885dfa3 authored by Elmar Ludwig's avatar Elmar Ludwig
Browse files

proof of concept for template elements, re #255

parent 3a9b4941
No related branches found
No related tags found
1 merge request!8Draft: proof of concept for template elements, re #255
...@@ -254,37 +254,29 @@ $(function() { ...@@ -254,37 +254,29 @@ $(function() {
}); });
$('.dynamic_list').each(function() { $('.dynamic_list').each(function() {
$(this).children('.dynamic_row').each(function(i) { $(this).children('.dynamic_row, template').each(function(i) {
$(this).data('index', i); $(this).data('index', i);
}); });
}); });
$(document).on('click', '.add_dynamic_row', function(event) { $(document).on('click', '.add_dynamic_row', function(event) {
var container = $(this).closest('.dynamic_list'); var container = $(this).closest('.dynamic_list');
var template = container.children('.template').last(); var template = container.children('template').last();
var clone = template.clone(true).removeClass('template'); var clone = $(template.prop('content').cloneNode(true));
var index = template.data('index'); var index = template.data('index') ?? 0;
var loop = template.data('loop') ?? 'i';
var vars = Object.assign({[loop]: index}, template.data('vars'));
template.data('index', index + 1); template.data('index', index + 1);
clone.insertBefore(template); clone.find('template').data('vars', vars);
clone.find('input[data-name], select[data-name], textarea[data-name]').each(function(i) { clone.find('input[name], select[name], textarea[name]').each(function(i) {
if ($(this).data('name').indexOf(':') === 0) { $(this).attr('name', $(this).attr('name').replace(/\w+/g, match => vars[match] ?? match));
$(this).data('name', $(this).data('name').substr(1) + '[' + index + ']');
} else {
$(this).attr('name', $(this).data('name') + '[' + index + ']');
$(this).removeAttr('data-name');
}
}); });
clone.find('input[data-value], select[data-value], textarea[data-value]').each(function(i) { clone.find('input[value], select[value], textarea[value]').each(function(i) {
if ($(this).data('value').indexOf(':') === 0) { $(this).attr('value', $(this).attr('value').replace(/\w+/g, match => vars[match] ?? match));
$(this).data('value', $(this).data('value').substr(1));
} else {
$(this).attr('value', index);
$(this).removeAttr('data-value');
}
}); });
clone.find('.wysiwyg-hidden:not(.template *)').toggleClass('wysiwyg wysiwyg-hidden'); clone.insertBefore(template);
clone.find('.add_dynamic_row:visible').click(); template.prev().find('.add_dynamic_row').click();
event.preventDefault(); event.preventDefault();
}); });
......
...@@ -34,50 +34,56 @@ ...@@ -34,50 +34,56 @@
</div> </div>
<? endforeach ?> <? endforeach ?>
<div class="dynamic_row mc_row template"> <template data-loop="i">
<label class="dynamic_counter size_toggle size_small undecorated"> <div class="dynamic_row mc_row">
<?= $this->render_partial('exercises/flexible_input', ['data_name' => "answer[$j]", 'size' => 'small']) ?> <label class="dynamic_counter size_toggle size_small undecorated">
</label> <?= $this->render_partial('exercises/flexible_input', ['name' => "answer[$j][i]", 'size' => 'small']) ?>
</label>
<label class="undecorated" style="padding: 1ex;"> <label class="undecorated" style="padding: 1ex;">
<input type="radio" name="correct[<?= $j ?>]" data-value> <input type="radio" name="correct[<?= $j ?>]" value="i">
<?= _vips('richtig') ?> <?= _vips('richtig') ?>
</label> </label>
<a href="#" class="delete_dynamic_row"> <a href="#" class="delete_dynamic_row">
<?= Icon::create('trash', 'clickable', ['title' => _vips('Antwort löschen')]) ?> <?= Icon::create('trash', 'clickable', ['title' => _vips('Antwort löschen')]) ?>
</a> </a>
</div> </div>
</template>
<?= Studip\Button::create(_vips('Antwort hinzufügen'), 'add_answer', ['class' => 'add_dynamic_row']) ?> <?= Studip\Button::create(_vips('Antwort hinzufügen'), 'add_answer', ['class' => 'add_dynamic_row']) ?>
<?= Studip\Button::create(_vips('Antwortblock löschen'), 'del_group', ['class' => 'delete_dynamic_row']) ?> <?= Studip\Button::create(_vips('Antwortblock löschen'), 'del_group', ['class' => 'delete_dynamic_row']) ?>
</div> </div>
<? endforeach ?> <? endforeach ?>
<div class="dynamic_list dynamic_row template" style="border-bottom: 1px dotted grey;"> <template data-loop="j">
<label class="hide_first"> <div class="dynamic_list dynamic_row" style="border-bottom: 1px dotted grey;">
<?= _vips('Zwischentext') ?> <label class="hide_first">
<textarea data-name="description" class="character_input size-l wysiwyg-hidden"></textarea> <?= _vips('Zwischentext') ?>
</label> <textarea name="description[j]" class="character_input size-l wysiwyg"></textarea>
<div class="dynamic_row mc_row template">
<label class="dynamic_counter size_toggle size_small undecorated">
<?= $this->render_partial('exercises/flexible_input', ['data_name' => ':answer', 'size' => 'small']) ?>
</label> </label>
<label class="undecorated" style="padding: 1ex;"> <template data-loop="i">
<input type="radio" data-name="correct" data-value=":value"> <div class="dynamic_row mc_row">
<?= _vips('richtig') ?> <label class="dynamic_counter size_toggle size_small undecorated">
</label> <?= $this->render_partial('exercises/flexible_input', ['name' => 'answer[j][i]', 'size' => 'small']) ?>
</label>
<a href="#" class="delete_dynamic_row"> <label class="undecorated" style="padding: 1ex;">
<?= Icon::create('trash', 'clickable', ['title' => _vips('Antwort löschen')]) ?> <input type="radio" name="correct[j]" value="i">
</a> <?= _vips('richtig') ?>
</div> </label>
<a href="#" class="delete_dynamic_row">
<?= Icon::create('trash', 'clickable', ['title' => _vips('Antwort löschen')]) ?>
</a>
</div>
</template>
<?= Studip\Button::create(_vips('Antwort hinzufügen'), 'add_answer', ['class' => 'add_dynamic_row']) ?> <?= Studip\Button::create(_vips('Antwort hinzufügen'), 'add_answer', ['class' => 'add_dynamic_row']) ?>
<?= Studip\Button::create(_vips('Antwortblock löschen'), 'del_group', ['class' => 'delete_dynamic_row']) ?> <?= Studip\Button::create(_vips('Antwortblock löschen'), 'del_group', ['class' => 'delete_dynamic_row']) ?>
</div> </div>
</template>
<?= Studip\Button::create(_vips('Antwortblock hinzufügen'), 'add_group', ['class' => 'add_dynamic_row']) ?> <?= Studip\Button::create(_vips('Antwortblock hinzufügen'), 'add_group', ['class' => 'add_dynamic_row']) ?>
</div> </div>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment