webapp/polls/templates/tags/structure.html


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95

{% load i18n poll_tags util_tags %}

<a id="help" href="#"><i class="icon-question-sign"></i>&nbsp;Ayuda</a>

<div class="alert alert-info help hide">
    <ul>
        <li>
            Para generar dependencias, arrastre el ID de la opci&oacute;n hacia el campo "Depende de la opci&oacute;n", o bien, escriba el ID indicado. <i class="icon-warning-sign"></i>&nbsp;En esta version no existen criterios sobre las dependecias, tenga cuidado de realizarlas correctamente y no generar inconsistencias (ej: no haga dependiente una pregunta de una opci&oacute;n perteneciente a la misma pregunta.)
        </li>
        <li>
            La opciones con imagenes deber&aacute;n ser de dimensiones menores a 250px de ancho y 250px de alto. Formatos validos: GIF, JPG, PNG.
        </li>
    </ul>
</div>

<div id="WGroupContainer"></div>

<!-- Containers -->
<button id="WGroup_add" class="btn btn-primary">
    <i class="icon-plus-sign icon-white"></i>&nbsp;{% trans 'Agregar grupo' %}
</button>


<!-- Mustache templates -->
{% include "mustache/group.html" %}

{% include "mustache/field.html" %}

{% include "mustache/option.html" %}

{% include "mustache/option_default.html" %}

{% include "mustache/option_image_upload.html" %}

{% include "mustache/option_image_thumbnail.html" %}

<!-- Global variables for dynamic_structure.js -->
<script type="text/javascript">

    var groups = {{ groups|json }},
        WIDGET_TYPES = {{ WIDGET_TYPES|json }},
        WITH_OPTIONS = {{ WITH_OPTIONS|json }},
        WITH_IMAGES = {{ WITH_IMAGES|json }},
        OFFSET_OPTION_ID = {{ OFFSET_OPTION_ID|json }},
        IMAGE_OPTIONS_TMP_MEDIA_URL = {{ IMAGE_OPTIONS_TMP_MEDIA_URL|json }},
        IMAGE_MEDIA_URL = {{ IMAGE_MEDIA_URL|json }},
        POLL_ID = {{ POLL_ID|json }};
</script>


<!-- Dynamic structure methods -->
<script src="{{ STATIC_URL }}js/factoryField.js"></script>
<script src="{{ STATIC_URL }}js/dynamic_structure.js"></script>


<!-- Dynamic structure initialization -->
<script type="text/javascript">
    (function($){

        $(document).ready(function() {

            // Preparing TEMPLATES
            $('script[type="text/x-mustache-template"]').each(function(i, obj){
                TEMPLATES[$(obj).attr('name')] = $(obj).text();
            });

            // Get group container widget
            container = $('#WGroupContainer');

            // Render of groups
            $.each(groups, factoryGroup);

            // Bind group add event
            $("#WGroup_add").on('click', function(event){
                event.preventDefault();

                // TODO: Que la estructura de grupo vacio la de un metodo.
                var next_group_order = $('.group').length;
                factoryGroup(next_group_order, {"name": '', "fields": []})
            });

        });

    })(jQuery);
</script>

<script type="text/javascript">

    jQuery(function ($) {
        $("#help").on('click', function(){
            $(".help").toggle();
        });
    });

</script>