The Framework Code

twigs/framework/admin/pages.twig

File List

{% set ajax = TRUE %}
{% set fwutils = TRUE %}
{% set parsley = TRUE %}
{% set editable = TRUE %}

{% extends '@content/page.twig' %}

{% import '@content/iconmacro.twig' as i %}
{% import '@util/formmacro.twig' as f %}
{% import '@util/modalmacro.twig' as m %}

{% set types = ['Object', 'Template', 'In-site 302', 'In-site 301',
    'External 302',  'External 301', 'In-site 303', 'External 303',
    'In-site 307', 'External 307',
    'In-site 308', 'External 308'] %}

{% block setup %}
    function mkinline(type, name, msg, id, value)
    {
        return '{{f.inline(f.wrap('type'), f.wrap('name'), f.wrap('msg'), f.wrap('id'), f.wrap('value'))}}';
    }

    function paramset(params)
    {
        params.id = params.pk;
        params.bean = '{{constant('Config\\Framework::PAGE')}}';
        params.op = 'bean';
        return params;
    }
    const kname = [
        {% for v in types %}
            {value: {{loop.index}}, text: '{{v}}'}{{loop.last ? '' : ','}}
        {% endfor %}
    ];

    const clicks = [
        ['delb', framework.dodelbean, ''],
        ['actb', framework.dotoggle, 'active'],
        ['logn', framework.dotoggle, 'needlogin'],
        ['mobo', framework.dotoggle, 'mobileonly'],
        ['editb', framework.goedit]
    ]
{% endblock setup %}

{% block onload %}
    $('.ppedit').editable({
        ajaxOptions: { type: '{{constant('Config\\Config::PUTORPATCH')}}' },
        params: paramset,
        source: kname,
        onblur: 'cancel',
        url: framework.editcall
    });
    $('#npform').on('submit', false).parsley();
    $('#npkind').on('change', function(e) {
        var pn = $('#npname').val().toLowerCase();
        if (pn != '')
        {
            switch ($(this).val())
            {
            case '1':
                $('#npsrc').val('\\Pages\\'+pn.substr(0,1).toUpperCase()+pn.substr(1));
                break;
            case '2':
                $('#npsrc').val('@content/'+pn+'.twig');
                break;
            }
        }
    })
    $('#addb').on('click', function(e){
        e.preventDefault();
        $(this).attr('disabled', true); // disable submit button
        const pn = $('#npname').val().toLowerCase();
        if (!pn.match(/^[a-z][a-z0-9.]*$/))
        {
            bootbox.alert('"'+pn+'" is not a valid page name. Letters and numbers only');
            return;
        }
        let sp = null;
        let error = false;
        $('.pname').each(function(e){
            const t = $(this).text();
            if (t == pn)
            {
                error = true;
                return false;
            }
            if (t > pn)
            {
                sp = $(this);
                return false;
            }
        })
        if (error)
        {
            bootbox.alert('That page already exists');
            $(this).attr('disabled', false);
            return;
        }
        const src = $('#npsrc').val()
        if (src == '')
        {
            bootbox.alert('Please specify a source');
            $(this).attr('disabled', false);
            return;
        }
        const kind = $('#npkind').val();
        if (kind == '')
        {
            bootbox.alert('Please pick a page type');
            $(this).attr('disabled', false);
            return;
        }
        const active = $('#npactive').is(':checked') ? 1 : 0;
        const login = $('#nplogin').is(':checked') ? 1 : 0;
        const mobile = $('#npmobile').is(':checked') ? 1 : 0;
        $('#npage').modal('hide');
        var fn = function(data){
                const htm = '<tr data-id="'+data+'"><td>'+mkinline('text', 'name', 'Enter name', data, pn)+'</td>'+
                '<td>'+mkinline('select', 'kind', 'Enter kind', data, kname[kind-1].text)+'</td>'+
                '<td>'+mkinline('text', 'source', 'Enter source', data, $('#npsrc').val())+'</td>'+
                '<td>'+framework.mktoggle('logn', login)+'</td>'+
                '<td>'+framework.mktoggle('mobo', mobile)+'</td>'+
                '<td>'+framework.mktoggle('actb', active)+'</td>'+
                '<td>{{i.edit('editb')}}</td>'+
                '<td>{{i.delete('delb')}}</td></tr>';
                let nx
                if (sp == null)
                {
                     nx = $(htm).appendTo($('#ptab tbody'));
                }
                else
                {
                    nx = $(htm).insertBefore(sp.parent());
                }
                nx.data('id', data);
                //$('.ppedit', nx).editable({params: paramset, source: kname});
            };
        let dt = {
                name : pn,
                kind : kind,
                source : src,
                active : active,
                login : login,
                mobile: mobile
            };
        const sel = ['context', 'role'];
        const inp = ['start', 'end', 'otherinfo'];
        const f = $('#npform');
        var inx = 0;
        for (let nv of inp)
        {
            inx = 0;
            $('input[name^="'+nv+'"]', f).each(function(){
                dt[nv+'['+inx+']'] = $(this).val();
            });
        }
        for (let sv of sel)
        {
            inx = 0;
            $('select[name^="'+sv+'"]', f).each(function(){
                dt[sv+'['+inx+']'] = $(this).val();
            });
        }
        framework.beanCreate('{{constant('Config\\Framework::PAGE')}}', dt, fn, '#addb');
    });
    $('#ptab').on('click', {bean: '{{constant('Config\\Framework::PAGE')}}', clicks: clicks}, framework.tableClick);
    $('#npage').on('show.bs.modal', function(e){
        $('#npform option').attr('selected', false)
    });
    $('#more').on('click', framework.addMore);
{% endblock onload %}

{% if not page is defined %}
    {% set page = 1 %}
    {% set pagesize = 10 %}
{% endif %}

{% set pages = siteinfo.pagecount('page',  pagesize) %}

{% block header %}
    <section class="col-md-12 mt-5">
        <h1>Pages</h1>
    </section>
{% endblock header %}

{% block main %}
    <section class="row">
        <article class="offset-md-1 col">
            {% include '@util/paginate.twig' with { page : page, pagesize: pagesize, pages: pages} %}
            <table class="table table-responsive table-striped table-hover" id="ptab">
                <thead class="thead-inverse">
                    <tr>
                        <th>Name</th>
                        <th>Kind</th>
                        <th>Source</th>
                        <th>Login Req.</th>
                        <th>Mobile Only</th>
                        <th>Active</th>
                        <th colspan="2">&nbsp;</th>
                    </tr>
                </thead>
                <tbody>
                    {% for p in siteinfo.pages(page, pagesize) %}
                        <tr data-id="{{p.getID}}">
                            <td class="pname">{{f.inline('text', 'name', 'Enter name', p.getID, p.name)}}</td>
                            <td>{{f.inline('select', 'kind', 'Enter kind', p.getID, types[p.kind-1])}}</td>
                            <td>{{f.inline('text', 'source', 'Enter source', p.getID, p.source)}}</td>
                            <td>{{f.tick(p.needlogin, 'logn')}}</td>
                            <td>{{f.tick(p.mobileonly, 'mobo')}}</td>
                            <td>{{f.tick(p.active, 'actb')}}</td>
                            <td>{{i.edit('editb')}}</a></td>
                            <td>{{i.delete('delb')}}</td>
                        </tr>
                    {% else %}
                        <tr><td colspan="4">No pages defined</td></tr>
                    {% endfor %}
                </tbody>
            </table>
            {% include '@util/paginate.twig' with { page : page, pagesize: pagesize, pages: pages} %}
            <p>{{m.invoke('npage', 'Add Page')}}</p>
        </article>
    </section>
    {{m.open({id: 'npage', title: 'New Page'})}}
    <div class="modal-body">
        <form action="#" method="POST" id="npform">
            {{f.text({label: 'Name', id: 'npname', ph: 'Page name - alphanumeric characters only', required: TRUE,
                parsley: { trigger: 'blur', type: 'alphanum', 'remote-reverse': 'false', remote: base ~ '/ajax/unique/' ~ constant('Config\\Framework::PAGE') ~ '/name/{value}',
                'remote-message': 'That page already exists'} })}}
            {{f.select({label: 'Kind', id: 'npkind', required: TRUE, options:[
                    {value: '', text: '&mdash; Pick a Type &mdash;'},
                    {value: 1,  text: 'Object'},
                    {value: 2,  text: 'Template'},
                    {value: 4,  text: 'In-site 301'},
                    {value: 6,  text: 'External 301'},
                    {value: 3,  text: 'In-site 302'},
                    {value: 5,  text: 'External 302'},
                    {value: 7,  text: 'In-site 303'},
                    {value: 8,  text: 'External 303'},
                    {value: 9,  text: 'In-site 307'},
                    {value: 10,  text: 'External 307'},
                    {value: 11,  text: 'Internal 308'},
                    {value: 12,  text: 'External 308'},
            ]})}}
            {{f.text({label: 'Source', id: 'npsrc', ph: 'page.twig, class name, /local/redirection or URL', required: TRUE})}}
            {{f.checkbox({labels: ['Active'], values:[1], ids: ['npactive']})}}
            {{f.checkbox({labels: ['Mobile Only'], values:[1], ids: ['npmobile']})}}
            {{f.checkbox({labels: ['Login Required'], values:[1], ids: ['nplogin']})}}
            <fieldset>
                <legend>Roles</legend>
                <table class="table table-striped">
                    <thead>
                        <tr>
                            <th>Context</th>
                            <th>Role</th>
                            <th>Start</th>
                            <th>End</th>
                            <th>Other Info</th>
                            <th>&nbsp;</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr id="example">
                            <td>
                               <select name="context[]">
                                    <option value="">&mdash; Context &mdash;</option>
                                    {% for sr in siteinfo.contexts %}
                                        <option value="{{sr.getID}}">{{sr.name}}</option>
                                    {% endfor %}
                                </select>
                            </td>
                             <td>
                                <select name="role[]">
                                    <option value="">&mdash; Role &mdash;</option>
                                    {% for sr in siteinfo.roles %}
                                        <option value="{{sr.getID}}">{{sr.name}}</option>
                                    {% endfor %}
                                </select>
                            </td>
                            <td><input type="text" name="start[]" value="" placeholder="Start Date or Now" class="form-control"/></td>
                            <td><input type="text" name="end[]" value="" placeholder="End Date or Never" class="form-control"/></td>
                            <td><input type="text" name="otherinfo[]" value="" placeholder="Other Info" class="form-control"/></td>
                        </tr>
                        <tr id="mrow">
                            <td colspan="4">&nbsp;</td>
                            <td><button id="more" class="btn btn-xs btn-info pull-right">Add More</button></td>
                        </tr>
                    </tbody>
                </table>
            </fieldset>
        </form>
    </div>
    {{m.close({action: 'Add', id: 'addb'})}}
{% endblock main %}

{% block pagefooter %}
{# I don't want a footer #}
{% endblock pagefooter %}