{% extends "@front/base/front.twig" %}

{% block headlineText %}
    Feed {% if feed.uid|default %} - {{ feed.key }} {% else %} Create {% endif %}
{% endblock %}

{% block content %}
    <div class="container">
        <div class="row">
            <div class="col-12 col-md-10 offset-md-1">
                <form id="formEdit" method="post" action="{{ path('front:feed:save', {uid: feed.uid|default}) }}">
                    <div class="form-group">
                        <label for="uid">Id</label>
                        <input id="uid" name="uid" class="form-control" type="text" value="{{ feed.uid|default }}" placeholder="Feed ID" disabled readonly>
                    </div>
                    <div class="form-group">
                        <label for="key">Feed Key</label>
                        <input id="key" name="key" class="form-control" type="text" value="{{ feed.key|default }}" placeholder="Key to access the feed url">
                    </div>
                    <div class="form-group form-check">
                        <input type="checkbox" class="form-check-input" id="enabled" name="enabled" {{ feed.enabled|default ? 'checked="checked"' }}>
                        <label class="form-check-label" for="enabled">Enabled</label>
                    </div>
                    <div class="form-group">
                        <label for="title">Title</label>
                        <input id="title" name="title" class="form-control" type="text" value="{{ feed.title|default }}" placeholder="Title of the feed">
                    </div>
                    <div class="form-group">
                        <label for="format">Format</label>
                        <select id="format" name="format" class="form-control">
                            <option value="">- Please select a format -</option>

                            {% for label,format in {
                                "Content API":                constant('CND\\Nautilus\\Entities\\Feed::FORMAT_CONTENTAPI'),
                                "RSS Teaser Feed":            constant('CND\\Nautilus\\Entities\\Feed::FORMAT_RSS_TEASER'),
                                "Facebook InstantArticles":   constant('CND\\Nautilus\\Entities\\Feed::FORMAT_FACEBOOK_IA'),
                                "MSN":                        constant('CND\\Nautilus\\Entities\\Feed::FORMAT_MSN'),
                                "MSN Gallery":                constant('CND\\Nautilus\\Entities\\Feed::FORMAT_MSN_GALLERY'),
                                "Focus Online":               constant('CND\\Nautilus\\Entities\\Feed::FORMAT_FOCUS_ONLINE'),
                                "Newsletter Default":         constant('CND\\Nautilus\\Entities\\Feed::FORMAT_NL_DEFAULT'),
                                "Google News":                constant('CND\\Nautilus\\Entities\\Feed::FORMAT_GOOGLE_NEWS'),
                                "Clean Text":                 constant('CND\\Nautilus\\Entities\\Feed::FORMAT_CLEAN_TEXT'),
                            } %}

                            <option value="{{ format }}" {{ format == feed.format|default ? "selected=1"}}>{{ label }}</option>

                            {% endfor %}
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="description">Description</label>
                        <textarea id="description" name="description" class="form-control">{{ feed.description|default }}</textarea>
                    </div>

                    {% if metaSchema %}
                        <div class="form-group">
                            <!-- label for="meta">Feed Configuration</label -->
                            <div class="meta json-editor"></div>
                            <textarea id="meta" name="meta" class="form-control" style="display:none"></textarea>
                        </div>
                    {% endif %}

                    <div class="form-group">
                        <label for="filter">Filter</label>
                        <div class="card bg-light px-3">
                            <div id="cn-json-query"></div>

                            {% set defaultJson = '{"filters":{"$and":[{"$or":[]}]},"order":{"control.publishDate":false},"limit":15,"offset":0}' %}

                            {% if feed %}
                                {% set filterJson = feed.filter|default(defaultJson)|json_encode %}
                            {% elseif request.get("filter") %}
                                {% set filterJson = request.get("filter") %}
                            {% else %}
                                {% set filterJson = defaultJson %}
                            {% endif %}

                            <textarea class="form-control" id="filter" rows="20" name="filter">{{ filterJson }}</textarea>
                        </div>
                    </div>

                    <div class="form-group">
                        <label for="creator">Created by</label>
                        <input id="creator" name="creator" class="form-control" readonly="readonly" type="text" value="{{ feed.creator|default }}">
                    </div>
                    <div class="form-group">
                        <label for="created">Creation date</label>
                        <input id="created" name="created" class="form-control" readonly="readonly" type="text" value="{{ feed.created|default ? feed.created|date("Y-m-d H:i:s") }}">
                    </div>
                    <div class="form-group">
                        <label for="lastaccess">Last Access</label>
                        <input id="lastaccess" name="lastaccess" class="form-control" readonly="readonly" type="text" value="{{ feed.lastaccess|default ? feed.lastaccess|date("Y-m-d H:i:s") }}">
                    </div>

                    {% if access|bitAnd( constant('CND\\Nautilus\\Entities\\Access::WRITE') ) %}
                    <button class="btn btn-primary save"><i class="fas fa-save"></i> Save</button>
                    {% endif %}

                    {% if access|bitAnd( constant('CND\\Nautilus\\Entities\\Access::DELETE') ) %}
                    <button class="btn btn-danger delete" {{ feed.key|default ?: "disabled=1" }}><i class="fas fa-trash-alt"></i> Delete</button>
                    {% endif %}

                    {% if access|bitAnd( constant('CND\\Nautilus\\Entities\\Access::WRITE') ) %}
                        <a class="btn btn-secondary {{ feed.uid|default ?: 'disabled'}}" href="{{ path('front:feed:clone', {uid: feed.uid|default("none")}) }}"><i class="fa fa-clone" aria-hidden="true"></i> Clone</a>
                    {% endif %}

                    <div class="btn-group">
                        <a class="btn btn-secondary " type="button"  target="_blank" href="{{ path('api:feed', {key: feed.key|default('none')}) }}">
                            <i class="fas fa-rss"></i> Feed
                        </a>

                        <button type="button" class="btn btn-sm btn-secondary dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <span class="sr-only">Toggle Dropdown</span>
                        </button>

                        <div class="dropdown-menu" aria-labelledby="dropdownMenuButton" style="z-index: 99999;">
                            {% for brand in brands %}
                                <a class="dropdown-item dropdown-toggle-split preview-{{ feed.key|default("disabled") }} " target="_blank" href="{{ brand.domain }}{{ path('api:feed', {key: feed.key|default('none')}) }}">{{ brand.name }}</a>
                            {% endfor %}
                        </div>
                    </div>

                </form>

                {% include "@front/common/form-validate.twig" with {
                    id: "formEdit",
                    rules: {
                        key: {
                            required: true,
                            regex: "^[a-zA-Z0-9\\-\\_]+$",
                        },
                        title: "required",
                        description: "required"
                    },
                    messages: {
                        key: "The key may only contain a-Z 0-9 - _",
                    }
                } %}

            </div>
        </div>
    </div>
    <script>

        var kraken_url = "{{ app.config.get("kraken.url") }}";

        $(document).ready(function(){
            formatJson('filter','filter');
        });

        {% if metaSchema %}
            $(document).ready(function(){

                JSONEditor.defaults.options.theme = 'bootstrap4';

                var input = $('#meta');
                var element = $('.meta.json-editor')[0];
                if(element){
                    var metaEditor = new JSONEditor( element , {
                        disable_edit_json: true,
                        disable_properties: true,
                        required_by_default: true,
                        schema: {{ metaSchema|default({})|json_encode|raw }}
                    });
                    // Set initial value
                    metaEditor.on('ready',function(){
                        metaEditor.setValue({{ feed.meta|default|json_encode|raw }});
                    });
                    // Save changed value
                    metaEditor.on('change',function() {
                        var validation_errors = metaEditor.validate();
                        if(validation_errors.length) {
                            console.log(validation_errors);
                        } else {
                            input.val( JSON.stringify(metaEditor.getValue()) );
                        }
                    });
                }
            });
        {% endif %}

        $(document).ready(function(){

            $('button.save').on('click',function(e){
                e.preventDefault();
                $('#formEdit').submit();
            });

            {% if feed.uid|default %}
            $('button.delete').on('click',function(e){
                e.preventDefault();
                if (confirm('Are you sure you what to delete this feed? This cannot be undone!')){
                    $('#formEdit').attr("action","{{ path('front:feed:delete',{'uid': feed.uid}) }}");
                    $('#formEdit').submit();
                }
            });
            {% endif %}

        });

        $(document).ready(function() {
            $('#filter').cnJsonQuery({
                definitions: {
                    "type": {
                        "type": "array",
                        "label": "Type",
                        "autocomplete": true,
                        "taggable": true,
                        "values": [
                            {  "value":"gallery", "text": "Gallery"  },
                            {  "value":"article", "text": "Article"  },
                            {  "value":"horoscope", "text": "Horoscope"  },
                            {  "value":"competition", "text": "Gewinnspiel"  },
                        ]
                    },
                    "control.uid": {
                        "type": "text",
                        "label": "Control Id"
                    },
                    "control.publishDate": {
                        "type": "datetime",
                        "label": "Control Publish Date"
                    },

                    "control.unpublishDate": {
                        "type": "datetime",
                        "label": "Control Unpublish Date"
                    },

                    "control.updateDate": {
                        "type": "datetime",
                        "label": "Control Update Date"
                    },

                    "control.editor": {
                        "type": "text",
                        "label": "Control Editor"
                    },

                    "control.flags": {
                        "type": "array",
                        "label": "Control Flags",
                        "autocomplete": true,
                        "taggable": true,
                        "values": [
                            {  "value":"no-syndication", "text": "No Syndication"  },
                            {  "value":"no-syndication-msn", "text": "No Syndication MSN"  },
                            {  "value":"no-syndication-fo", "text": "No Synd. Focus Online"  },
                        ]
                    },

                    "control.language": {
                        "type": "text",
                        "label": "Control Language"
                    },

                    "source.uid": {
                        "type": "text",
                        "label": "Source Id"
                    },

                    "source.name": {

                        "autocomplete": true,
                        "endpoint": kraken_url+"api/source/list?offset=0&search=\{\{query\}\}",
                        "type": "text",
                        "label": "Source Name",
                        "taggable": true,
                        "values": [
                            {  "value":"AD", "text": "AD"  },
                            {  "value":"glamour", "text": "Glamour"  },
                            {  "value":"GlamSlam", "text": "GlamSlam"  },
                            {  "value":"vogue", "text": "Vogue"  },
                            {  "value":"gq", "text": "GQ"  },
                            {  "value":"wired", "text": "GQ Auto & Technik"  },
                            {  "value":"gqcompetition", "text": "GQ Gewinnspiele"  },
                            {  "value":"voguecompetition", "text": "Vogue Gewinnspiele"  },
                            {  "value":"horoscopevoguede", "text": "Vogue Horoskope"  },
                            {  "value":"glamourcompetition", "text": "Glamour Gewinnspiele"  },
                            {  "value":"horoscopeglamour", "text": "Glamour Horoskope"  }

                        ]
                    },

                    "meta.title": {
                        "type": "text",
                        "label": "Meta Title"
                    },

                    "meta.description": {
                        "type": "text",
                        "label": "Meta Description"
                    },

                    "meta.keywords": {
                        "type": "text",
                        "label": "Meta Keywords"
                    },

                    "meta.tags": {
                        "type": "array",
                        "label": "Meta Tags",
                        "autocomplete": true,
                        "endpoint": kraken_url+"api/content/tags?offset=0&search=\{\{query\}\}"
                    },

                    "meta.category": {
                        "type": "array",
                        "label": "Meta Category",
                        "autocomplete": true,
                        "endpoint": kraken_url+"api/content/categories?offset=0&search=\{\{query\}\}"
                    },

                    "meta.subcategory": {
                        "type": "array",
                        "label": "Meta Subcategory",
                        "autocomplete": true,
                        "endpoint": kraken_url+"api/content/subcategories?offset=0&search=\{\{query\}\}"
                    },

                    "teaser.title": {
                        "type": "text",
                        "label": "Teaser Title"
                    },

                    "teaser.kicker": {
                        "type": "text",
                        "label": "Teaser Kicker"
                    },

                    "teaser.abstract": {
                        "type": "text",
                        "label": "Teaser Abstract"
                    },

                    "teaser.url": {
                        "type": "text",
                        "label": "Teaser URL"
                    },

                    "content.title": {
                        "type": "text",
                        "label": "Content Title"
                    },

                    "content.kicker": {
                        "type": "text",
                        "label": "Content Kicker"
                    },

                    "content.abstract": {
                        "type": "text",
                        "label": "Content Abstract"
                    },

                    "content.author": {
                        "type": "text",
                        "label": "Content Author"
                    },

                    "horoscope.period": {
                        "type": "array",
                        "autocomplete": true,
                        "values": [
                            {  "value":"daily", "text": "daily"  },
                            {  "value":"weekly", "text": "weekly"  },
                            {  "value":"monthly", "text": "monthly"  },
                            {  "value":"yearly", "text": "yearly"  },
                        ],
                        "label": "Horoscope Periode"
                    },

                    "horoscope.zodiac": {
                        "type": "array",
                        "autocomplete": true,
                        "values": [
                            {  "value":"aries",       "text": "Widder"  },
                            {  "value":"taurus",      "text": "Stier"  },
                            {  "value":"gemini",      "text": "Zwillinge"  },
                            {  "value":"cancer",      "text": "Krebs"  },
                            {  "value":"leo",         "text": "Löwe"  },
                            {  "value":"virgo",       "text": "Jungfrau"  },
                            {  "value":"libra",       "text": "Waage"  },
                            {  "value":"scorpio",     "text": "Skorpion"  },
                            {  "value":"sagittarius", "text": "Schütze"  },
                            {  "value":"capricorn",   "text": "Steinbock"  },
                            {  "value":"aquarius",    "text": "Wasserman"  },
                            {  "value":"pisces",      "text": "Fische"  },
                        ],
                        "label": "Horoscope Sternzeichen"
                    },

                    "horoscope.startDate": {
                        "type": "datetime",
                        "label": "Horoscope Startdatum"
                    },

                    "horoscope.endDate": {
                        "type": "datetime",
                        "label": "Horoscope Enddatum"
                    },

                    // Anaytics

                    // Unique Users
                    "analytics.aggregated.sum_6h.uniqueusers": {
                        "type": "number",
                        "label": "Unique Users 6 Stunden"
                    },

                    "analytics.aggregated.sum_24h.uniqueusers": {
                        "type": "number",
                        "label": "Unique Users 24 Stunden"
                    },

                    "analytics.aggregated.sum_7d.uniqueusers": {
                        "type": "number",
                        "label": "Unique Users 7 Tage"
                    },

                    // Page views
                    "analytics.aggregated.sum_6h.pageviews": {
                        "type": "number",
                        "label": "Pageviews 6 Stunden"
                    },

                    "analytics.aggregated.sum_24h.pageviews": {
                        "type": "number",
                        "label": "Pageviews 24 Stunden"
                    },

                    "analytics.aggregated.sum_7d.pageviews": {
                        "type": "number",
                        "label": "Pageviews 7 Tage"
                    },

                    // Sessions
                    "analytics.aggregated.sum_6h.sessions": {
                        "type": "number",
                        "label": "Sessions 6 Stunden"
                    },

                    "analytics.aggregated.sum_24h.sessions": {
                        "type": "number",
                        "label": "Sessions 24 Stunden"
                    },

                    "analytics.aggregated.sum_7d.sessions": {
                        "type": "number",
                        "label": "Sessions 7 Tage"
                    }

                }
            });
        })

    </script>

{% endblock %}

{% block footer %}
    {{ parent() }}
    <script src="/cnServiceNautilus/public/assets/javascript/jsoneditor.min.js"></script>
{% endblock %}