##// END OF EJS Templates
forms: added a codemirror form widget.
forms: added a codemirror form widget.

File last commit:

r1769:fb9baff8 default
r2409:36eff123 default
Show More
sequence.pt
104 lines | 3.3 KiB | text/plain | TextLexer
<div tal:define="item_tmpl item_template|field.widget.item_template;
oid oid|field.oid;
name name|field.name;
min_len min_len|field.widget.min_len;
min_len min_len or 0;
max_len max_len|field.widget.max_len;
max_len max_len or 100000;
now_len len(subfields);
orderable orderable|field.widget.orderable;
orderable orderable and 1 or 0;
prototype field.widget.prototype(field);
title title|field.title;"
class="deform-seq"
id="${oid}">
<style>
body.dragging, body.dragging * {
cursor: move !important;
}
.dragged {
position: absolute;
opacity: 0.5;
z-index: 2000;
}
</style>
<!-- sequence -->
<input type="hidden" name="__start__"
value="${field.name}:sequence"
class="deform-proto"
tal:attributes="prototype prototype"/>
<div class="panel panel-default">
<div class="panel-body">
<div class="deform-seq-container"
id="${oid}-orderable">
<div tal:define="subfields [ x[1] for x in subfields ]"
tal:repeat="subfield subfields"
tal:replace="structure subfield.render_template(item_tmpl,parent=field)" />
<span class="deform-insert-before"
tal:attributes="
min_len min_len;
max_len max_len;
now_len now_len;
orderable orderable;">
</span>
</div>
<div style="clear: both"></div>
</div>
<div class="panel-footer">
<a href="#"
class="btn deform-seq-add"
id="${field.oid}-seqAdd"
onclick="javascript: return deform.appendSequenceItem(this);">
<small id="${field.oid}-addtext">${add_subitem_text}</small>
</a>
<script type="text/javascript">
deform.addCallback(
'${field.oid}',
function(oid) {
oid_node = $('#'+ oid);
deform.processSequenceButtons(oid_node, ${min_len},
${max_len}, ${now_len},
${orderable});
}
)
<tal:block condition="orderable">
$( "#${oid}-orderable" ).sortable({
handle: ".deform-order-button, .panel-heading",
containerSelector: "#${oid}-orderable",
itemSelector: ".deform-seq-item",
placeholder: '<span class="glyphicon glyphicon-arrow-right placeholder"></span>',
onDragStart: function ($item, container, _super) {
var offset = $item.offset(),
pointer = container.rootGroup.pointer;
adjustment = {
left: pointer.left - offset.left,
top: pointer.top - offset.top
};
_super($item, container)
},
onDrag: function ($item, position) {
$item.css({
left: position.left - adjustment.left,
top: position.top - adjustment.top
})
}
});
</tal:block>
</script>
<input type="hidden" name="__end__" value="${field.name}:sequence"/>
<!-- /sequence -->
</div>
</div>
</div>