Answer required

Check if answer is required.

Use textfield

Additional instruction

Textfield default value (optional)

</div>

<div class="row" id="text_cols_field" tal:attributes="style php:text_input?'display:block':'display:none'">
                <label i18n:translate="">Textfield cols</label><br />
                <input type="text" name="text_cols" value="" tal:attributes="value text_cols" />
            </div>

<div class="row" id="text_rows_field" tal:attributes="style php:text_input?'display:block':'display:none'">
                <label i18n:translate="">Textfield rows</label><br />
                <input type="text" name="text_rows" value="" tal:attributes="value text_rows" />
            </div>

<div class="row" id="text_charcount_field" tal:attributes="style php:text_input?'display:block':'display:none'">
                <label i18n:translate="">Textfield allowed chars</label><br />
                <div class="helptext" i18n:translate="string:_helptext_allowed_chars">
                    Insert number of allowed chars. Default is 0, charcount is turned of then
                </div>
                <input type="text" name="text_charcount" value="" tal:attributes="value text_charcount" />
                <span i18n:translate="">show count</span>:
                <input type="checkbox" id="text_charcounter" name="text_charcounter" value="1" tal:attributes="checked php:text_charcounter?'checked':''" />
            </div>

<div class="row" id="element_size">
                <label i18n:translate="">Element size</label>
                <input type="radio" name="element_size" value="1" tal:attributes="checked php:element_size EQ 1?'checked':''" />
                <tal:block i18n:translate="">Tiny</tal:block>
                <input type="radio" name="element_size" value="2" tal:attributes="checked php:element_size EQ 2?'checked':''" />
                <tal:block i18n:translate="">Small</tal:block>
                <input type="radio" name="element_size" value="3" tal:attributes="checked php:element_size EQ 3?'checked':''" />
                <tal:block i18n:translate="">Medium</tal:block>
                <input type="radio" name="element_size" value="4" tal:attributes="checked php:element_size EQ 4?'checked':''" />
                <tal:block i18n:translate="">Large</tal:block>
                <input type="radio" name="element_size" value="5" tal:attributes="checked php:element_size EQ 5?'checked':''" />
                <tal:block i18n:translate="">Huge</tal:block>
            </div>

<tal:block repeat="image_nr php:range(0,5,1)">
                <tal:block define="drag_image php:drag_images[image_nr] | null">
                    <div class="row">
                        <label><span i18n:translate="">Drag drop image</span> <span tal:content="php:image_nr+1" /></label><br />
                        <div tal:condition="drag_image">
                            <img src="" alt=""  tal:attributes="src php:here.viewImage(drag_image, 1)" />
                        </div>
                        <input type="file" tal:attributes="name string:drag_image_input_${image_nr}" value=""  tal:condition="not:drag_image"/>
                    </div>

<div class="row" tal:condition="drag_image">
                        <label i18n:translate="">Delete current image</label>
                        <input type="checkbox" tal:attributes="name string:delete_drag_image_${image_nr}" value="1" />
                        <tal:block i18n:translate="">or upload new</tal:block>
                        <input type="file" tal:attributes="name string:drag_image_input_${image_nr}" value="" />
                    </div>
                </tal:block>
            </tal:block>

</div>
                
    </tal:block>
            
    <tal:block condition="php:action=='compose'" metal:use-macro="base_compose.html/base_compose">                  
                
        <tal:block metal:fill-slot="custom_header">
            <script type="text/javascript" src="" tal:attributes="src string:${PLUGIN_ROOT}views/js/wz_jsgraphics.js"></script>
            <script type="text/javascript" src="" tal:attributes="src string:${PLUGIN_ROOT}views/js/wz_dragdrop.js"></script>
            <script type="text/javascript" src="" tal:attributes="src string:${PLUGIN_ROOT}views/js/javascript_drag_img.js"></script>
        </tal:block>
        
        <div metal:fill-slot="custom_body">

<div class="instructions" i18n:translate="">
                Instructions for image drag task
            </div>

<div id="IMG_DRAG_TASK">
                <div class="item_row" i18n:translate="">
                    DRAG AREA
                </div>
                <div class="item_row">
                    <div tal:repeat="item_id php:range(0,5,1)" class="drag_item" tal:attributes="string:drag_item_${item_id}">
                        <tal:block define="drag_image php:drag_images[item_id] | null">
                            <div>
                                <input type="checkbox" tal:attributes="name string:drag_image_active_${item_id}; checked php:drag_elements[item_id].drag_active?'checked':''" value="1" />
                                <label><span tal:content="php:item_id+1"/>. <span i18n:translate="">Active</span></label>
                            </div>
                            <div>
                                <input type="checkbox" tal:attributes="name string:drag_image_show_title_${item_id}; checked php:drag_elements[item_id].drag_show_title?'checked':''" value="1" />
                                <label i18n:translate="">Show Title</label>
                            </div>
                            <div class="drag_item_title" tal:attributes="id string:drag_item_title_${item_id}">
                                <input type="text" tal:attributes="name string:drag_title_input_${item_id}; value php:drag_elements[item_id].drag_title" />
                                <input type="hidden" tal:attributes="name string:drag_image_id_${item_id}; value drag_image" />
                            </div>
                            <div class="drag_item_image_border">
                                <img src="" alt="" width="100%" tal:attributes="src php:here.viewImage(drag_image, 0, 1)" />
                            </div>
                        </tal:block>
                    </div>
                </div>
                <div class="item_row" i18n:translate="">
                    DROP AREA
                </div>
                <div class="item_row">
                    <div tal:repeat="item_id php:range(0,5,1)" class="drop_item" tal:attributes="string:drop_item_${item_id}">
                        <tal:block define="drop_image php:drag_images[item_id] | null">
                            <div>
                                <input type="checkbox" tal:attributes="name string:drop_image_active_${item_id}; checked php:drag_elements[item_id].drop_active?'checked':''" value="1" />
                                <label><span tal:content="php:item_id+1"/>. <span i18n:translate="">Active</span></label>
                            </div>
                            <div>
                                <input type="checkbox" tal:attributes="name string:drop_image_show_title_${item_id}; checked php:drag_elements[item_id].drop_show_title?'checked':''" value="1" />
                                <label i18n:translate="">Show Title</label>
                            </div>
                            <div class="drop_item_title" tal:attributes="name string:drop_item_title_${item_id}">
                                <input type="text" tal:attributes="name string:drop_title_input_${item_id}; value php:drag_elements[item_id].drop_title" />
                            </div>
                            <div class="drop_item_img">
                                <img src="" alt="" width="100%" tal:attributes="src php:here.viewImage(drop_image, 0, 1)" />
                            </div>

<div class="drop_item_image">
                                <label i18n:translate="">Correct image</label>
                                <input type="text" size="5" tal:attributes="name string:drop_image_correct_${item_id}; value php:drag_elements[item_id].drop_correct" />
                            </div>

</tal:block>
                    </div>
                </div>
            </div>

</div>
        
        <div metal:fill-slot="custom_buttons">
            <input id="tmt_save" type="submit" name="Save" value="Save" i18n:attributes="value" />
            <input class="reset" id="tmt_reset" type="button" name="Reset" value="Reset" i18n:attributes="value" onClick="resetTmtElements();" />
        </div>
    
    </tal:block>  
        
</tal:block>

<tal:block metal:define-macro="view" i18n:domain="psyhvel" metal:use-macro="base_${who}.html/base_${who}">
    <tal:block metal:fill-slot="test_header" tal:condition="php:who=='test'">
        <tal:block metal:use-macro="test_header.html/test_header" />
    </tal:block>

<tal:block metal:fill-slot="custom_header">
        <script type="text/javascript" src="" tal:attributes="src string:${PLUGIN_ROOT}views/js/javascript_img_drag_img.js"></script>
    </tal:block>

</tal:block>
                </div>
            </div>
        </div>
        <div tal:condition="text_input" class="to_center">
            <div tal:content="text_title" class="text_input_area_title" />
            <textarea name="text_answer" tal:content="text_value" tal:attributes="cols text_cols; rows text_rows; name string:textfield_0"/>
            <input type="hidden" name="" value="" tal:attributes="value text_charcount; id string:textfield_charcount_0; name string:textfield_charcount_0" />
            <div tal:condition="text_charcounter" class="textarea_counter" >
                (<span i18n:translate="">characters left</span>:
                <span tal:attributes="id string:textfield_charcounter_0" tal:content="text_charcount"/>)
            </div>
        </div>
        <input type="hidden" id="answer_start" name="answer_start" value="" />
        <input type="hidden" id="answer_stop" name="answer_stop" value="" />
    </div>
</tal:block>