create_date_poll_step_2.tpl 10.5 KB
Newer Older
1
2
3
{extends file='page.tpl'}

{block name="header"}
4
5
6
7
8
9
    <script type="text/javascript">
        window.date_formats = {
            DATE: '{__('Date', 'DATE')}',
            DATEPICKER: '{__('Date', 'datepicker')}'
        };
    </script>
10
11
12
13
14
15
16
17
18
19
    <script type="text/javascript" src="{'js/app/framadatepicker.js'|resource}"></script>
    <script type="text/javascript" src="{'js/app/date_poll.js'|resource}"></script>
{/block}

{block name=main}
    <form name="formulaire" action="" method="POST" class="form-horizontal" role="form">
        <div class="row" id="selected-days">
            <div class="col-md-10 col-md-offset-1">
                <h3>{__('Step 2 date', 'Choose the dates of your poll')}</h3>

20
21
22
23
24
25
                {if $error != null}
                <div class="alert alert-danger">
                    <p>{$error}</p>
                </div>
                {/if}

26
27
28
29
30
31
32
33
34
35
36
37
38
                <div class="alert alert-info">
                    <p>{__('Step 2 date', 'To schedule an event you need to propose at least two choices (two hours for one day or two days).')}</p>

                    <p>{__('Step 2 date', 'You can add or remove additionnal days and hours with the buttons')}
                        <span class="glyphicon glyphicon-minus text-info"></span>
                        <span class="sr-only">{__('Generic', 'Remove')}</span>
                        <span class="glyphicon glyphicon-plus text-success"></span>
                        <span class="sr-only">{__('Generic', 'Add')}</span>
                    </p>

                    <p>{__('Step 2 date', 'For each selected day, you can choose, or not, meeting hours (e.g.: "8h", "8:30", "8h-10h", "evening", etc.)')}</p>
                </div>

Antonin's avatar
Antonin committed
39
40
41
42
43
44
45
46
47
48
49
                <div id="days_container">
                    {foreach $choices as $i=>$choice}
                        {if $choice->getName()}
                            {$day_value = $choice->getName()|date_format:$date_format['txt_date']}
                        {else}
                            {$day_value = ''}
                        {/if}
                        <fieldset>
                            <div class="form-group">
                                <legend>
                                    <label class="sr-only" for="day{$i}">{__('Generic', 'Day')} {$i+1}</label>
50

Antonin's avatar
Antonin committed
51
52
53
54
55
                                    <div class="col-xs-10 col-sm-11">
                                        <div class="input-group date">
                                            <span class="input-group-addon"><i class="glyphicon glyphicon-calendar text-info"></i></span>
                                            <input type="text" class="form-control" id="day{$i}" title="{__('Generic', 'Day')} {$i+1}"
                                                   data-date-format="{__('Date', 'dd/mm/yyyy')}" aria-describedby="dateformat{$i}" name="days[]" value="{$day_value}"
56
                                                   size="10" maxlength="10" placeholder="{__('Date', 'dd/mm/yyyy')}" autocomplete="off"/>
Antonin's avatar
Antonin committed
57
58
                                        </div>
                                    </div>
59
                                    <div class="col-xs-2 col-sm-1">
Antonin's avatar
Antonin committed
60
61
62
63
64
                                        <button type="button" title="{__('Step 2 date', 'Remove this day')}" class="remove-day btn btn-sm btn-link">
                                            <span class="glyphicon glyphicon-remove text-danger"></span>
                                            <span class="sr-only">{__('Step 2 date', 'Remove this day')}</span>
                                        </button>
                                    </div>
65

Antonin's avatar
Antonin committed
66
67
                                    <span id="dateformat{$i}" class="sr-only">({__('Date', 'dd/mm/yyyy')})</span>
                                </legend>
68

Antonin's avatar
Antonin committed
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
                                {foreach $choice->getSlots() as $j=>$slot}
                                    <div class="col-sm-2">
                                        <label for="d{$i}-h{$j}" class="sr-only control-label">{__('Generic', 'Time')} {$j+1}</label>
                                        <input type="text" class="form-control hours" title="{$day_value} - {__('Generic', 'Time')} {$j+1}"
                                               placeholder="{__('Generic', 'Time')} {$j+1}" id="d{$i}-h{$j}" name="horaires{$i}[]" value="{$slot}"/>
                                    </div>
                                {/foreach}

                                <div class="col-sm-2">
                                    <div class="btn-group btn-group-xs" style="margin-top: 5px;">
                                        <button type="button" title="{__('Step 2 date', 'Remove an hour')}" class="remove-an-hour btn btn-default">
                                            <span class="glyphicon glyphicon-minus text-info"></span>
                                            <span class="sr-only">{__('Step 2 date', 'Remove an hour')}</span>
                                        </button>
                                        <button type="button" title="{__('Step 2 date', 'Add an hour')}" class="add-an-hour btn btn-default">
                                            <span class="glyphicon glyphicon-plus text-success"></span>
                                            <span class="sr-only">{__('Step 2 date', 'Add an hour')}</span>
                                        </button>
                                    </div>
88
89
                                </div>
                            </div>
Antonin's avatar
Antonin committed
90
91
92
                        </fieldset>
                    {/foreach}
                </div>
93
94
95
96
97
98
99
100
101
102
103
104


                <div class="col-md-4">
                    <button type="button" id="copyhours" class="btn btn-default disabled" title="{__('Step 2 date', 'Copy hours of the first day')}"><span
                                class="glyphicon glyphicon-sort-by-attributes-alt text-info"></span><span
                                class="sr-only">{__('Step 2 date', 'Copy hours of the first day')}</span></button>
                    <div class="btn-group btn-group">
                        <button type="button" id="remove-a-day" class="btn btn-default disabled" title="{__('Step 2 date', 'Remove a day')}"><span
                                    class="glyphicon glyphicon-minus text-info"></span><span class="sr-only">{__('Step 2 date', 'Remove a day')}</span></button>
                        <button type="button" id="add-a-day" class="btn btn-default" title="{__('Step 2 date', 'Add a day')}"><span
                                    class="glyphicon glyphicon-plus text-success"></span><span class="sr-only">{__('Step 2 date', 'Add a day')}</span></button>
                    </div>
105
106
107
                    <a href="" data-toggle="modal" data-target="#add_days" class="btn btn-default" title="{__('Date', 'Add range dates')}">
                        <span class="glyphicon glyphicon-plus text-success"></span>
                        <span class="glyphicon glyphicon-plus text-success"></span>
108
                        <span class="sr-only">{__('Date', 'Add range dates')}</span>
109
                    </a>
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
                </div>
                <div class="col-md-8 text-right">
                    <div class="btn-group">
                        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                            <span class="glyphicon glyphicon-remove text-danger"></span>
                            {__('Generic', 'Remove')} <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu" role="menu">
                            <li><a id="resetdays" href="javascript:void(0)">{__('Step 2 date', 'Remove all days')}</a></li>
                            <li><a id="resethours" href="javascript:void(0)">{__('Step 2 date', 'Remove all hours')}</a></li>
                        </ul>
                    </div>
                    <a class="btn btn-default" href="{$SERVER_URL}create_poll.php?type=date"
                       title="{__('Step 2', 'Back to step 1')}">{__('Generic', 'Back')}</a>
                    <button name="choixheures" value="{__('Generic', 'Next')}" type="submit" class="btn btn-success disabled"
                            title="{__('Step 2', 'Go to step 3')}">{__('Generic', 'Next')}</button>
                </div>
            </div>
        </div>
    </form>
130
131
132
133
134
135
136
137
138
139
140

    <div id="add_days" class="modal fade">
        <div class="modal-dialog modal-md">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h4 class="modal-title">{__('Date', 'Add range dates')}</h4>
                </div>
                <div class="modal-body row">
141
142
143
144
145
                    <div class="col-xs-12">
                        <div class="alert alert-info">
                            {__('Date', 'Max dates count')}
                        </div>
                    </div>
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
                    <div class="col-xs-12">
                        <label for="range_start">{__('Date', 'Start date')}</label>
                        <div class="input-group date">
                            <span class="input-group-addon"><i class="glyphicon glyphicon-calendar text-info"></i></span>
                            <input type="text" class="form-control" id="range_start"
                                   data-date-format="{__('Date', 'dd/mm/yyyy')}" size="10" maxlength="10"
                                   placeholder="{__('Date', 'dd/mm/yyyy')}"/>
                        </div>
                    </div>
                    <div class="col-xs-12">
                        <label for="range_end">{__('Date', 'End date')}</label>
                        <div class="input-group date">
                            <span class="input-group-addon"><i class="glyphicon glyphicon-calendar text-info"></i></span>
                            <input type="text" class="form-control" id="range_end"
                                   data-date-format="{__('Date', 'dd/mm/yyyy')}" size="10" maxlength="10"
                                   placeholder="{__('Date', 'dd/mm/yyyy')}"/>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button data-dismiss="modal" class="btn btn-default">{__('Generic', 'Cancel')}</button>
                    <button id="interval_add" class="btn btn-success">{__('Generic', 'Add')}</button>
                </div>
            </div>
        </div>
    </div>
172
{/block}