galette/templates/default/pages/mailing_form.html.twig

   1 {% extends 'page.html.twig' %}
   2
   3 {% block content %}
   4 {% if preferences.pref_mail_method == constant('Galette\\Core\\Mailing::METHOD_DISABLED') and constant('GALETTE_MODE') != 'DEMO' %}
   5         <div id="errorbox" class="ui red message">
   6             <h1>{{ _T("- ERROR -") }}</h1>
   7             <p>{{ _T("Email sent is disabled in the preferences. Ask galette admin") }}</p>
   8         </div>
   9 {% elseif mailing_saved is not defined %}
  10         <form action="{{ url_for('doMailing') }}" id="listform" method="post" enctype="multipart/form-data" class="ui form">
  11             <div class="ui basic fitted segment">
  12                 <div class="ui styled fluid accordion row">
  13                     <div class="active title">
  14                         <i class="jsonly displaynone icon dropdown"></i>
  15                         {{ _T("Mailing information") }}
  16                     </div>
  17                     <div class="active content field">
  18                         <div class="three fields">
  19                             <div class="field">
  20                                 <label for="sender">{{ _T("Sender") }}</label>
  21                                 <select name="sender" id="sender" class="ui dropdown nochosen">
  22                                     <option value="{{ constant('Galette\\Core\\GaletteMail::SENDER_PREFS') }}">{{ _T("from preferences") }}</option>
  23                                 {% if not login.isSuperAdmin() %}
  24                                     <option value="{{ constant('Galette\\Core\\GaletteMail::SENDER_CURRENT') }}">{{ _T("current logged in user") }}</option>
  25                                 {% endif %}
  26                                     <option value="{{ constant('Galette\\Core\\GaletteMail::SENDER_OTHER') }}">{{ _T("other") }}</option>
  27                                 </select>
  28                             </div>
  29                             <div class="field required">
  30                                 <label for="sender_name">{{ _T("Name") }}</label>
  31                                 <input type="text" name="sender_name" id="sender_name" value="{{ preferences.pref_email_nom }}" disabled="disabled"/>
  32                             </div>
  33                             <div class="field required">
  34                                 <label for="sender_address">{{ _T("Address") }}</label>
  35                                 <input type="text" name="sender_address" id="sender_address" value="{{ preferences.pref_email }}" disabled="disabled"/>
  36                             </div>
  37                         </div>
  38                         <div class="ui section divider"></div>
  39                         <div class="two fields">
  40                             <div class="field">
  41                                 <label>{{ _T("Recipients") }}</label>
  42                                 {% include "elements/mailing_recipients.html.twig" %}
  43                                 {% if mailing.current_step == constant('Galette\\Core\\Mailing::STEP_SENT') %}
  44                                     {% set path = url_for('members') %}
  45                                     {% set text = _T("Go back to members list") %}
  46                                 {% else %}
  47                                     {% set path = '#' %}
  48                                     {% set text = _T("Manage selected members") %}
  49                                 {% endif %}
  50                                 <a
  51                                     id="btnusers"
  52                                     href="{{ path }}"
  53                                     class="jsonly disabled ui labeled icon button"
  54                                 >
  55                                     <i class="blue users icon"></i>
  56                                     {{ text }}
  57                                 </a>
  58                                 <noscript>
  59                                     <div class="ui compact message">{{ _T("This feature requires javascript.") }}</div>
  60                                 </noscript>
  61                             </div>
  62     {% if mailing.current_step == constant('Galette\\Core\\Mailing::STEP_START') %}
  63                             <div class="field">
  64                             {% if attachments|length > 0 %}
  65                                 <div class="ui tiny header">
  66                                     <i class="paperclip icon"></i>
  67                                     <div class="content">{{ _T("Existing attachments:") }}</div>
  68                                 </div>
  69                                 <div id="existing_attachments" class="ui middle aligned divided selection list">
  70                                 {% for attachment in attachments %}
  71                                     <div class="item">
  72                                         <div class="content">
  73                                             <a
  74                                                 href="?remove_attachment={{ attachment.getFileName() }}"
  75                                                 class="rm_attachement delete"
  76                                             >
  77                                                 <i class="ui trash alt red icon tooltip"></i>
  78                                                 <span class="ui special popup">{{ _T("Remove attachment") }}</span>
  79                                             </a>
  80                                             {{ attachment.getFileName() }}
  81                                         </div>
  82                                     </div>
  83                                 {% endfor %}
  84                                 </div>
  85                             {% else %}
  86                                 <div class="ui tiny header">
  87                                     <i class="paperclip icon"></i>
  88                                     <div class="content">{{ _T("Attachments") }}</div>
  89                                 </div>
  90                             {% endif %}
  91                                 <div class="ui file action input">
  92                                     <div class="ui corner labeled input">
  93                                         <input type="file" name="attachment[]" id="attachment" multiple="multiple"/>
  94                                         <div class="ui corner label">
  95                                             <i class="circular inverted primary icon info tooltip" data-html="{{ _T("Select files to add as attachments.<br/>Multiple file selection using 'ctrl' or 'shift' keys are only available on compatible browsers.") }}"></i>
  96                                         </div>
  97                                     </div>
  98                                     <label for="attachment" class="ui button">
  99                                         <i class="blue upload icon"></i>
 100                                         {{ _T("Add attachment") }}
 101                                     </label>
 102                                 </div>
 103                             </div>
 104     {% endif %}
 105                         </div>
 106                     </div>
 107                 </div>
 108             </div>
 109         {% if mailing.current_step == constant('Galette\\Core\\Mailing::STEP_START') %}
 110
 111             <div class="ui basic fitted segment">
 112                 <div class="ui styled fluid accordion row">
 113                     <div class="active title">
 114                         <i class="jsonly displaynone icon dropdown"></i>
 115                         {{ _T("Write your mailing") }}
 116                     </div>
 117                     <div class="active content field">
 118                         <div class="field required">
 119                             <label for="mailing_objet">{{ _T("Object:") }}</label>
 120                             <input type="text" name="mailing_objet" id="mailing_objet" value="{{ mailing.subject }}" size="80" required/>
 121                         </div>
 122                         <div class="field required">
 123                             <label for="mailing_corps">{{ _T("Message:") }}</label>
 124                             <textarea name="mailing_corps" id="mailing_corps" cols="80" rows="15" required>{% if mailing.message %}{{ mailing.message|escape }}{% endif %}</textarea>
 125                             <input type="hidden" name="html_editor_active" id="html_editor_active" value="{% if html_editor_active %}1{% else %}0{% endif %}"/>
 126                         </div>
 127                         <div class="ui basic horizontal equal width segments">
 128                             <div class="ui basic fitted segment">
 129                                 <div class="ui toggle checkbox">
 130                                     <input type="checkbox" name="mailing_html" id="mailing_html" value="1" {% if mailing.html == 1 or preferences.pref_editor_enabled == 1 %}checked="checked"{% endif %}/>
 131                                     <label for="mailing_html">{{ _T("Interpret HTML") }}</label>
 132                                 </div>
 133                             </div>
 134                             <div id="summernote_toggler" class="jsonly hidden ui basic fitted right aligned segment">
 135                                 <a class="ui blue tertiary button" href="javascript:activateMailingEditor('mailing_corps');" id="activate_editor">{{ _T("Activate HTML editor") }}</a>
 136                             </div>
 137                         </div>
 138                         <div class="inline field">
 139                         </div>
 140                     </div>
 141                 </div>
 142             </div>
 143
 144             <div class="ui basic center aligned segment">
 145                 <div class="ui wrapping spaced buttons">
 146                     <button type="submit" name="mailing_go" id="btnpreview" class="ui labeled icon button">
 147                         <i class="eye blue icon" aria-hidden="true"></i>
 148                         {{ _T("Preview") }}
 149                     </button>
 150                     <button type="submit" name="mailing_save" class="ui labeled icon button action">
 151                         <i class="save green icon" aria-hidden="true"></i>
 152                         {{ _T("Save") }}
 153                     </button>
 154                     <button type="submit" name="mailing_confirm" class="ui labeled icon button {% if constant('GALETTE_MODE') == 'DEMO' %} disabled" disabled="disabled{% endif %}">
 155                         <i class="rocket red icon" aria-hidden="true"></i>
 156                         {{ _T("Send") }}
 157                     </button>
 158                     <button type="submit" name="mailing_cancel" formnovalidate class="ui labeled icon button">
 159                         <i class="times icon" aria-hidden="true"></i>
 160                         {{ _T("Cancel mailing") }}
 161                     </button>
 162                 </div>
 163             </div>
 164         {% endif %}
 165         {% if mailing.current_step == constant('Galette\\Core\\Mailing::STEP_PREVIEW') %}
 166             <div class="ui basic fitted segment">
 167                 <div class="ui styled fluid accordion row">
 168                     <div class="active title">
 169                         <i class="jsonly hidden icon dropdown"></i>
 170                         {{ _T("Preview your mailing") }}
 171                     </div>
 172                     <div class="active content field">
 173                         <table class="ui very basic striped unstackable table">
 174                             <tbody>
 175                                 <tr>
 176                                     <th class="two wide">{{ _T("Subject:") }}</th>
 177                                     <td>{{ mailing.subject }}</td>
 178                                 </tr>
 179                                 <tr>
 180                                     <th class="two wide">{{ _T("Message:") }}</th>
 181                                     <td>
 182             {% if mailing.html %}
 183                                         {{ mailing.message }}
 184             {% else %}
 185                                         <pre>{{ mailing.wrapped_message }}</pre>
 186             {% endif %}
 187                                     </td>
 188                                 </tr>
 189                             </tbody>
 190                         </table>
 191
 192                     </div>
 193                 </div>
 194             </div>
 195
 196             <div class="ui basic center aligned segment">
 197                 <div class="ui wrapped wrapping spaced buttons">
 198                     <button type="submit" name="mailing_reset" class="ui labeled icon button">
 199                         <i class="backward icon"></i>
 200                         {{ _T("Modifiy mailing") }}
 201                     </button>
 202                     <button type="submit" name="mailing_confirm"{% if constant('GALETTE_MODE') == 'DEMO' %} class="ui labeled icon button disabled" disabled="disabled"{% else %} class="ui labeled icon button"{% endif %}>
 203                         <i class="rocket icon" aria-hidden="true"></i>
 204                         {{ _T("Send") }}
 205                     </button>
 206                     <button type="submit" name="mailing_cancel" formnovalidate class="ui labeled icon button">
 207                         <i class="trash red icon" aria-hidden="true"></i>
 208                         {{ _T("Cancel mailing") }}
 209                     </button>
 210
 211                     <input type="hidden" name="mailing_objet" value="{{ mailing.subject }}"/>
 212                     <input type="hidden" name="mailing_corps" value="{% if mailing.message %}{{ mailing.message|escape }}{% endif %}"/>
 213                 </div>
 214             </div>
 215         {% endif %}
 216             {% include "components/forms/csrf.html.twig" %}
 217         </form>
 218 {% endif %}
 219 {% endblock %}
 220
 221 {% block javascripts %}
 222 {% if (preferences.pref_mail_method != constant('Galette\\Core\\Mailing::METHOD_DISABLED') or constant('GALETTE_MODE') != 'DEMO') and mailing_saved is not defined %}
 223     {% if mailing.current_step != constant('Galette\\Core\\Mailing::STEP_SENT') %}
 224 <script type="text/javascript">
 225     $(function() {
 226         {# Preview popup #}
 227         $('#btnpreview').click(function(){
 228             var _sender = $('#sender').val();
 229             var _sender_name = $('#sender_name').val();
 230             var _sender_address = $('#sender_address').val();
 231             var _subject = $('#mailing_objet').val();
 232             var _body = $('#mailing_corps').val();
 233             var _html = $('#mailing_html').is(':checked');
 234             var _attachments = [];
 235             $('#existing_attachments .item').each(function(){
 236                 _attachments[_attachments.length] = $(this).text();
 237             });
 238             $.ajax({
 239                 url: '{{ url_for('mailingPreview') }}',
 240                 type: "POST",
 241                 data: {
 242                     sender: _sender,
 243                     sender_name: _sender_name,
 244                     sender_address: _sender_address,
 245                     subject: _subject,
 246                     body: _body,
 247                     html: _html,
 248                     attachments: _attachments
 249                 },
 250                 {% include "elements/js/loader.js.twig" with {
 251                     selector: '#btnpreview',
 252                     loader: 'button'
 253                 } %},
 254                 success: function(res){
 255                     _preview_dialog(res);
 256                 },
 257                 error: function() {
 258                     {% include "elements/js/modal.js.twig" with {
 259                         modal_title_twig: _T("An error occurred displaying preview :(")|e("js"),
 260                         modal_without_content: true,
 261                         modal_class: "mini",
 262                         modal_deny_only: true,
 263                         modal_cancel_text: _T("Close")|e("js"),
 264                         modal_classname: "redalert",
 265                     } %}
 266                 }
 267             });
 268             return false;
 269         });
 270
 271         var _preview_dialog = function(res){
 272             {% include "elements/js/modal.js.twig" with {
 273                 modal_title_twig: _T("Mailing preview")|e("js"),
 274                 modal_content: "res",
 275                 modal_content_class: "scrolling",
 276                 modal_deny_only: true,
 277                 modal_cancel_text: _T("Close")|e("js")
 278             } %}
 279         }
 280
 281         {# Members popup #}
 282         $('#btnusers').click(function(){
 283             $.ajax({
 284                 url: '{{ url_for('ajaxMembers') }}',
 285                 type: "POST",
 286                 data: {
 287                     multiple: true
 288                 },
 289                 {% include "elements/js/loader.js.twig" with {
 290                     selector: '#btnusers',
 291                     loader: 'button'
 292                 } %},
 293                 success: function(res){
 294                     _members_dialog(res);
 295                 },
 296                 error: function() {
 297                     {% include "elements/js/modal.js.twig" with {
 298                         modal_title_twig: _T("An error occurred displaying members interface :(")|e("js"),
 299                         modal_without_content: true,
 300                         modal_class: "mini",
 301                         modal_deny_only: true,
 302                         modal_cancel_text: _T("Close")|e("js"),
 303                         modal_classname: "redalert",
 304                     } %}
 305                 }
 306             });
 307             return false;
 308         });
 309
 310         var _members_dialog = function(res){
 311             {% include "elements/js/modal.js.twig" with {
 312                 modal_title_twig: _T("Members selection")|e("js"),
 313                 modal_content: "res",
 314                 modal_class: "members-selection fullscreen",
 315                 modal_content_class: "scrolling",
 316                 modal_deny_only: true,
 317                 modal_cancel_text: _T("Close")|e("js")
 318             } %}
 319             _members_ajax_mapper(res);
 320         }
 321
 322         var _members_ajax_mapper = function(res){
 323             $('#btnvalid').click(function(){
 324                 //first, let's store new recipients in mailing object
 325                 var _recipients = new Array();
 326                 $('li[id^="member_"]').each(function(){
 327                     _recipients[_recipients.length] = this.id.substring(7, this.id.length);
 328                 });
 329                 $.ajax({
 330                     url: '{{ url_for('mailingRecipients') }}',
 331                     type: "POST",
 332                     data: {
 333                         recipients: _recipients
 334                     },
 335                     {% include "elements/js/loader.js.twig" with {
 336                         selector: '#btnvalid',
 337                         loader: 'button'
 338                     } %},
 339                     success: function(res){
 340                         $('#unreachables_count').remove();
 341                         $('#recipients_count').replaceWith(res);
 342                         $('.members-selection').modal('hide');
 343                     },
 344                     error: function() {
 345                         {% include "elements/js/modal.js.twig" with {
 346                             modal_title_twig: _T("An error occurred displaying members interface :(")|e("js"),
 347                             modal_without_content: true,
 348                             modal_class: "mini",
 349                             modal_deny_only: true,
 350                             modal_cancel_text: _T("Close")|e("js"),
 351                             modal_classname: "redalert",
 352                         } %}
 353                     }
 354                 });
 355             });
 356             //Remap links
 357             var _none = $('#none_selected').clone();
 358             $('li[id^="member_"]').click(function(){
 359                 $(this).remove();
 360                 if ( $('#selected_members ul li').length == 0 ) {
 361                     $('#selected_members ul').append(_none);
 362                 }
 363             });
 364             $('.members-selection a.choice').click(function(e){
 365                 e.preventDefault();
 366                 var _mid = this.href.match(/.*\/(\d+)$/)[1];
 367                 var _mname = $(this).text();
 368                 $('#none_selected').remove()
 369                 if ( $('#member_' + _mid).length == 0 ) {
 370                     var _li = '<li id="member_' + _mid + '" class="item"><i class="user minus icon"></i><span class="ui content">' + _mname + '</span></li>';
 371                     $('#selected_members ul').append(_li);
 372                     $('#member_' + _mid).click(function(){
 373                         $(this).remove();
 374                         if ( $('#selected_members ul li').length == 0 ) {
 375                             $('#selected_members ul').append(_none);
 376                         }
 377                     });
 378                 }
 379                 return false;
 380             });
 381
 382             $('.members-selection .pagination a').click(function(){
 383                 var _members = new Array();
 384                 var _unreach = new Array();
 385                 $('li[id^="member_"]').each(function(){
 386                     var _mid = this.id.substring(7, this.id.length);
 387                     if ($(this).hasClass('unreachables')) {
 388                         _unreach[_unreach.length] = _mid;
 389                     } else {
 390                         _members[_members.length] = _mid;
 391                     }
 392                 });
 393
 394                 $.ajax({
 395                     url: this.href,
 396                     type: "POST",
 397                     data: {
 398                         multiple: true,
 399                         members: _members,
 400                         unreachables: _unreach
 401                     },
 402                     {% include "elements/js/loader.js.twig" with {
 403                         loader: '#listing'
 404                     } %},
 405                     success: function(res){
 406                         $('#listing').remove();
 407                         var _listing = $($.parseHTML(res)).find('#listing');
 408                         $('.members-selection .eleven.wide.column').append(_listing);
 409                         _members_ajax_mapper(res);
 410                     },
 411                     error: function() {
 412                         {% include "elements/js/modal.js.twig" with {
 413                             modal_title_twig: _T("An error occurred displaying members interface :(")|e("js"),
 414                             modal_without_content: true,
 415                             modal_class: "mini",
 416                             modal_deny_only: true,
 417                             modal_cancel_text: _T("Close")|e("js"),
 418                             modal_classname: "redalert",
 419                         } %}
 420                     }
 421                 });
 422                 return false;
 423             });
 424         }
 425
 426         {% set modal_onapprove = "window.location.href = '" ~ url_for('mailing') ~ "' + _link.attr('href');" %}
 427         $('.rm_attachement').click(function(event){
 428             event.preventDefault();
 429             var _link = $(this);
 430             {% set modal_content = _T("Are you sure you want to remove this attachment?") ~ '<br/>' ~ _T("This will immediately remove attachment from disk and cannot be undone.") %}
 431             {% include "elements/js/modal.js.twig" with {
 432                 modal_title_twig: _T("Remove attachment")|e("js"),
 433                 modal_content_twig: modal_content|e("js"),
 434                 modal_class: "tiny",
 435                 modal_onapprove: modal_onapprove,
 436                 modal_approve_text: _T("Remove")|e('js'),
 437                 modal_approve_icon: "trash",
 438                 modal_approve_color: "red",
 439                 modal_cancel_text: _T("Cancel")|e("js"),
 440                 modal_classname: "redalert",
 441             } %}
 442         });
 443
 444         $('#sender').on('change', function() {
 445             var _this = $(this);
 446             var _sender_name = $('#sender_name');
 447             var _sender_address = $('#sender_address');
 448             var _editable = false;
 449             var _val = _this.val();
 450             switch (_val) {
 451                 case '{{ constant('Galette\\Core\\GaletteMail::SENDER_PREFS') }}':
 452                     _sender_name.val('{{ preferences.pref_email_nom|e('js') }}');
 453                     _sender_address.val('{{ preferences.pref_email|e('js') }}');
 454                     break;
 455
 456         {% if not login.isSuperAdmin() %}
 457                 case '{{ constant('Galette\\Core\\GaletteMail::SENDER_CURRENT') }}':
 458                     _sender_name.val('{{ sender_current['name']|e('js') }}');
 459                     _sender_address.val('{{ sender_current['email']|e('js') }}');
 460                     break;
 461         {% endif %}
 462                 case '{{ constant('Galette\\Core\\GaletteMail::SENDER_OTHER') }}':
 463                     _sender_name.val('');
 464                     _sender_address.val('');
 465                     _editable = true;
 466                     break;
 467             }
 468
 469             if (_editable) {
 470                 _sender_name.removeAttr('disabled');
 471                 _sender_address.removeAttr('disabled');
 472                 $('#sender + span').removeClass('disabled');
 473             } else {
 474                 _sender_name.attr('disabled', 'disabled');
 475                 _sender_address.attr('disabled', 'disabled');
 476                 $('#sender + span').addClass('disabled');
 477             }
 478         });
 479     });
 480 </script>
 481     {% endif %}
 482 {% endif %}
 483 {% endblock %}