{% extends "@corePath/admin/partial/layout_logged_in.html.twig" %}

{% block title %}{{ ta('manage_newsletters', 'Manage Newsletters') }}{% endblock %}
{% block selected_page %}newsletters{% endblock %}
{% block selected_sub_page %}newsletters_manage_newsletter{% endblock %}

{% block body %}
<!-- Load jQuery build -->
<script type="text/javascript" src="{{ PLUGIN_WEB_ROOT }}/newsletters/assets/js/tinymce/jscripts/tiny_mce/jquery.tinymce.js"></script>
<script type="text/javascript">
    oTable = null;
    gRemoveNewsletterId = null;
    gEditNewsletterId = null;
    $(document).ready(function(){
        // datatable
        oTable = $('#fileTable').dataTable($.extend(dataTableOpts, {
            "sAjaxSource": 'ajax/manage_newsletter',
            "bJQueryUI": true,
            "aaSorting": [[ 1, "desc" ]],
            "aoColumns" : [   
                { bSortable: false, sWidth: '3%', sName: 'file_icon', sClass: "center adminResponsiveHide" },
                { sName: 'date', sWidth: '15%', sClass: "adminResponsiveHide"},
                { sName: 'title', sWidth: '15%' },
                { sName: 'subject', sClass: "adminResponsiveHide" },
                { sName: 'form_type', sWidth: '11%', sClass: "center adminResponsiveHide" },
                { sName: 'status', sWidth: '19%', sClass: "center adminResponsiveHide" },
                { bSortable: false, sWidth: '15%', sClass: "center" }
            ],
            "fnServerData": function ( sSource, aoData, fnCallback ) {
                aoData.push( { "name": "filterText", "value": $('#filterText').val() } );
                $.ajax({
                    "dataType": 'json',
                    "type": "GET",
                    "url": "ajax/manage_newsletter",
                    "data": aoData,
                    "success": fnCallback
                });
            }
        }));
        
        // update custom filter
        $('.dataTables_filter').html($('#customFilter').html());
        
        {% if triggerCreate == 1 %}
        addNewsletterForm();
        {% endif %}
        {% if triggerCreate == 2 %}
        addServiceEmailForm();
        {% endif %}
    });
    
    function setLoader()
    {
        $('#addNewsletterFormInner').html({{ ta('loading_please_wait', 'Loading, please wait...')|json_encode()|raw }});
    }
    
    function addNewsletterForm()
    {
        gEditNewsletterId = null;
        addEditSub();
    }
    
    function addEditSub()
    {
        $(".sendingText").remove();
        popupBtns = '<button type="button" class="btn btn-primary" onClick="processCreateNewsletter(0); return false;">{{ ta('save_draft', 'Save Draft') }}</button>';
        popupBtns += '<button type="button" class="btn btn-primary" onClick="confirmTest(); return false;">{{ ta('test', 'Test') }}</button>';
        popupBtns += '<button type="button" class="btn btn-primary" onClick="confirmSend(); return false;">{{ ta('send_newsletter', 'Send Newsletter') }}</button>';
        showBasicModal('<div id="addNewsletterForm" title="Newsletter"><span id="addNewsletterFormInner">{{ ta('loading_please_wait', 'Loading, please wait...') }}</span></div>', {{ ta('newsletter', 'Newsletter')|json_encode()|raw }}, popupBtns);
        loadAddNewsletterForm(1);
    }
    
    function addServiceEmailForm()
    {
        gEditNewsletterId = null;
        addEditSubService();
    }
    
    function addEditSubService()
    {
        $(".sendingText").remove();
        popupBtns = '<button type="button" class="btn btn-primary" onClick="processCreateNewsletter(0); return false;">{{ ta('save_draft', 'Save Draft') }}</button>';
        popupBtns += '<button type="button" class="btn btn-primary" onClick="confirmTest(); return false;">{{ ta('test', 'Test') }}</button>';
        popupBtns += '<button type="button" class="btn btn-primary" onClick="confirmSend(); return false;">{{ ta('send_service_email', 'Send Service Email') }}</button>';
        showBasicModal('<div id="addNewsletterForm" title="Service Email"><span id="addNewsletterFormInner">{{ ta('loading_please_wait', 'Loading, please wait...') }}</span></div>', {{ ta('service_email', 'Service Email')|json_encode()|raw }}, popupBtns);
        loadAddNewsletterForm(2);
    }
    
    function confirmTest()
    {
        {% if newslettersSettings['test_email_address']|length == 0 %}
            alert({{ ta('could_not_find_your_test_email_address_please_set_the_it_via_the_newsletter_settings_page_in_plugin_management', 'Could not find your test email address. Please set the it via the newsletter settings page in plugin management.')|json_encode()|raw }});
        {% else %}
            msg = {{ ta('send_this_newsletter_as_a_test_to_newsletterssettings_test_email_address_this_will_not_send_the_newsletter_to_the_selected', 'Send this newsletter as a test to [[[TEST_EMAIL_ADDRESS]]]? This will not send the newsletter to the selected recipients in the \'send to\' drop-down.')|json_encode()|raw }};
            msg = msg.replace('[[[TEST_EMAIL_ADDRESS]]]', newslettersSettings['test_email_address']);
            if(confirm(msg))
            {
                processCreateNewsletter(2);
            }
        {% endif %}
    }
    
    function confirmSend()
    {
        if(confirm({{ ta('are_you_sure_you_want_to_send_this_newsletter_to_the_selected_recipients', 'Are you sure you want to send this newsletter to the selected recipients?')|json_encode()|raw }}))
        {
            processCreateNewsletter(1);
        }
        
        return false;
    }
    
    function loadAddNewsletterForm(formType)
    {
        $('#addNewsletterFormInner').html('');
        $('#editFileServerForm').html('');
        $.ajax({
            type: "POST",
            url: "ajax/manage_newsletter_add_form",
            data: { gEditNewsletterId: gEditNewsletterId, formType: formType },
            dataType: 'json',
            success: function(json) {
                if(json.error == true)
                {
                    $('#addNewsletterFormInner').html(json.msg);
                }
                else
                {
                    $('#addNewsletterFormInner').html(json.html);
                    loadEditor();
                }
            },
            error: function (XMLHttpRequest) {
                $('#addNewsletterFormInner').html(XMLHttpRequest.responseText);
            }
        });
    }
    
    function processCreateNewsletter(send)
    {
        if(typeof(send) === "undefined") {
            send = 0;
        }
        
        // get data
        title = $('#title').val();
        userGroup = $('#userGroup').val();
        subject = $('#subject').val();
        formType = $('#formType').val();
        htmlContent = tinyMCE.activeEditor.getContent();
        if(title.length == 0)
        {
            showError({{ ta('please_enter_the_newsletter_title', 'Please enter the newsletter title.')|json_encode()|raw }}, 'popupMessageContainer');
            return false;
        }
        else if(subject.length == 0)
        {
            showError({{ ta('please_enter_the_newsletter_subject', 'Please enter the newsletter subject.')|json_encode()|raw }}, 'popupMessageContainer');
            return false;
        }
        else if(htmlContent.length == 0)
        {
            showError({{ ta('please_enter_the_newsletter_content', 'Please enter the newsletter content.')|json_encode()|raw }}, 'popupMessageContainer');
            return false;
        }
        
        $(".ui-dialog-buttonset").prepend("<span class='sendingText' style='color: red; font-weight: bold;'>{{ ta('sending_please_wait', 'Sending, please wait...') }}&nbsp;&nbsp;</span>");
        $(".ui-dialog-buttonpane button:contains('Send Now')").button("disable");
        $(".ui-dialog-buttonpane button").button("disable");
        $.ajax({
            type: "POST",
            url: "ajax/manage_newsletter_add_process",
            data: { title: title, userGroup: userGroup, subject: subject, htmlContent: htmlContent, send: send, gEditNewsletterId: gEditNewsletterId, formType: formType },
            dataType: 'json',
            success: function(json) {
                if(json.error == true)
                {
                    $(".sendingText").remove();
                    $(".ui-dialog-buttonpane button").button("enable");
                    showError(json.msg, 'popupMessageContainer');
                }
                else
                {
                    $(".sendingText").remove();
                    $(".ui-dialog-buttonpane button").button("enable");
                    showSuccess(json.msg);
                    reloadTable();
                    hideModal();
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                $(".sendingText").remove();
                $(".ui-dialog-buttonpane button").button("enable");
                showError(XMLHttpRequest.responseText, 'popupMessageContainer');
            }
        });

    }
    
    function editNewsletterForm(newsletterId)
    {
        gEditNewsletterId = newsletterId;
        addEditSub();
    }
    
    function editServiceForm(newsletterId)
    {
        gEditNewsletterId = newsletterId;
        addEditSubService();
    }
    
    function reloadTable()
    {
        oTable.fnDraw();
    }

    function loadEditor()
    {
        $('#htmlContent').tinymce({
            script_url : '{{ PLUGIN_WEB_ROOT }}/newsletters/assets/js/tinymce/jscripts/tiny_mce/tiny_mce.js',
            theme : "advanced",
            plugins : "pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template",
            theme_advanced_buttons1 : "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,formatselect,fontselect,fontsizeselect",
            theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,code,|,forecolor,backcolor",
            theme_advanced_toolbar_location : "top",
            theme_advanced_toolbar_align : "left",
            theme_advanced_statusbar_location : "none",
            theme_advanced_resizing : true,
            width: '100%',
            height: 260,
            content_css : "{{ PLUGIN_WEB_ROOT }}/newsletters/assets/css/styles.css",
            convert_urls : false
        });
    }
    
    function confirmRemoveNewsletter(newsletterId)
    {
        gRemoveNewsletterId = newsletterId;
        showBasicModal('<p>{{ ta('are_you_sure_you_want_to_remove_this_draft_item', 'Are you sure you want to remove this draft item?') }}</p>', {{ ta('confirm_removal', 'Confirm Removal')|json_encode()|raw }}, '<button type="button" class="btn btn-primary" onClick="removeNewsletter(); return false;">{{ ta('confirm_removal', 'Confirm Removal') }}</button>');
    }
    
    function removeNewsletter()
    {
        $.ajax({
            type: "POST",
            url: "ajax/manage_newsletter_remove",
            data: { gRemoveNewsletterId: gRemoveNewsletterId },
            dataType: 'json',
            success: function(json) {
                if(json.error == true)
                {
                    showError(json.msg);
                }
                else
                {
                    showSuccess(json.msg);
                    reloadTable();
                    hideModal();
                }
                
            },
            error: function (XMLHttpReques) {
                showError(XMLHttpRequest.responseText);
            }
        });
    }
    
    function insertReplacement(text)
    {
        tinyMCE.activeEditor.execCommand('mceInsertContent', false, text);
    }
    
    function viewNewsletter(newsletterId)
    {
        showBasicModal('<iframe src="manage_newsletter_view?id='+newsletterId + '" style="background: url(\'{{ PLUGIN_WEB_ROOT }}/newsletters/assets/images/spinner.gif\') no-repeat center center;" height="600px" width="100%" frameborder="0" scrolling="auto">{{ ta('loading_please_wait', 'Loading, please wait...') }}</iframe>', {{ ta('view_item', 'View Item')|json_encode()|raw }});
    }
</script>

<!-- page content -->
<div class="right_col" role="main">
    <div>
        
<div class="row clearfix">
    <div class="x_panel">
        <div class="x_title"><h2>{{ ta('newsletter_service_emails', 'Newsletter & Service Emails') }}</h2><div class="clearfix"></div></div>
        <div class="x_content responsiveTable">
            {{ msg_page_notifications|raw }}
            <table id='fileTable' class="table table-striped table-only-border dtLoading bulk_action">
                <thead>
                    <tr>
                        <th></th>
                        <th class="align-left">{{ ta("newsletter_created", "Created") }}</th>
                        <th class="align-left">{{ ta("newsletter_title", "Title") }}</th>
                        <th class="align-left">{{ ta("newsletter_subject", "Subject") }}</th>
                        <th class="align-left">{{ ta("newsletter_form_type", "Type") }}</th>
                        <th class="align-left">{{ ta("newsletter_status", "Status") }}</th>
                        <th class="align-left">{{ ta("action", "Action") }}</th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
            <div class="clear"></div>
        </div>
    </div>
    
    <div class="x_panel">
        <div class="btn-group">
            <a href="#" type="button blue" class="btn btn-primary" onClick="addNewsletterForm(); return false;">{{ ta('create_newsletter', 'Create Newsletter') }}</a>
        </div>
        <div class="btn-group">
            <a href="#" type="button blue" class="btn btn-primary" onClick="addServiceEmailForm(); return false;">{{ ta('create_service_email', 'Create Service Email') }}</a>
        </div>
        <div class="btn-group pull-right">
            <a href="{{ WEB_ROOT }}/newsletter_unsubscribe" type="button blue" class="btn btn-default" target="_blank">{{ ta('unsubscribe_form', 'Unsubscribe Form') }}</a>
            <a href="{{ WEB_ROOT }}/newsletter_subscribe" type="button blue" class="btn btn-default" target="_blank">{{ ta('subscribe_form', 'Subscribe Form') }}</a>
        </div>
    </div>
</div>
        
    </div>
</div>

<div class="customFilter" id="customFilter" style="display: none;">
    <label>
        {{ ta('filter_results', 'Filter Results') }}:
        <input name="filterText" id="filterText" type="text" onKeyUp="reloadTable(); return false;" style="width: 160px;" class="form-control"/>
    </label>
</div>
{% endblock %}