summaryrefslogtreecommitdiff
path: root/html/assets/js/post-features.js
blob: ca2928c16e114e444229c3abfd12d369c6514cd9 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
const valid_modals = [      // supported sort-code keys
    'product',
    'store'
];


const symbol_escapes = [
    { esc: '>',    chr: '>' },
    { esc: '&lt;',    chr: '<' },
    { esc: '&amp;',   chr: '&' },
    { esc: '&quot;',  chr: '\"' },
    { esc: '&apos;',  chr: '\'' },
    { esc: '&euro;',  chr: '€' },
    { esc: '&copy;',  chr: '©' },
    { esc: '&reg;',   chr: '®' }
];


/** inject_codeblocks
 * --- -- -- - - -
 * 
 * NOTE:
 * a short-code is a mustache block of 3 parametres:
 * {{ object = someID ; some label description }}
 * ex. `{{product=1507175; Coca Cola Zero}}`
 * 
 * The short-code is parsed to a code-block:
 * an `a` modal-toggler link with certain data-attributes (+label), ex:
 * `<a class='modal-toggler view-product' data-id='1507175'>Coca Cola Zero</a>`
 * 
 * @param code (string): original content html with short-codes
 * @returns (string): html content with code-blocks
 */
function inject_codeblocks(code) {
    // isolate all mustache blocks
    const regexp = /{{(.*?)}}/g;        // regex makes multiple-matching easier
    const matches = [...code.matchAll(regexp)];
        // console.log(matches);
    
    var output = code;      // use a copy of (source) code
      
    matches.forEach( match => {
      // parse (every) match
        // NOTE:
        // match array has 3 items; example:
        // match[0] : `{{store=247; Pasalimani Market}}`
        // match[1] : `store=247; Pasalimani Market`
        // match[3] : the (source) code string
      let blockparts = unescaped_str( match[1] ).split(';');
      let main_unit = blockparts[0].replaceAll(' ','').split('=');
      let target = main_unit[0].toLowerCase();
      let id = main_unit[1];
      let label = escaped_str(blockparts[1]);
      if (valid_modals.includes(target)) {
        let codeblock = `<a href="#" data-toggle="modal" data-target="#view-${target}" data-id="${id}" class="modal-toggler js-get_${target}">${label}</a>`;
        output = output.replaceAll(match[0], codeblock);
      }
    });
    
    return output;
}


// pair of function to escepe/unescape special html symbols
// --- -- -- - - -
function unescaped_str(txt) {
    symbol_escapes.forEach( pair => { txt = txt.replaceAll(pair.esc, pair.chr); })
    return txt;
}

function escaped_str(txt) {
    symbol_escapes.forEach( pair => { txt = txt.replaceAll(pair.chr, pair.esc); })
    return txt;
}


$(document).ready(function() {


    /** translate short-codes to code-blocks
     * -------------------------------------------------------------------------
     */ 
    var content = $('.content .article-body').html();       // get code with shorts
    $('.content .article-body').html( inject_codeblocks(content) ); // put code with blocks
    

    
    /** modal listeners
     * -------------------------------------------------------------------------
     */  

    // open store modal listener
    // --- -- -- - - -
    $(document).on('click', '.js-get_store', function (e) {
        e.preventDefault();
        var id = $(this).data('id');    // id for requesting content via ajax

        $('#dynamic-content').html('');
        $('#modal-loader').show();

        $.ajax({
            url: '/libs/modals/modalStore.php',
            type: 'POST',
            cache: false,
            data: 'id=' + id,
            dataType: 'html'
        })
        .done(function (data) {
            $('#dynamic-content').html('');
            $('#dynamic-content').html(data);
            $('#modal-loader').hide();
        })
        .fail(function () {
            $('#dynamic-content').html('<i class="glyphicon glyphicon-info-sign"></i> Υπήρξε κάποιο πρόβλημα, παρακαλώ προσπαθήστε ξανά.');
            $('#modal-loader').hide();
        });
    });

    // open product modal listener
    // ---
    $(document).on('click', '.js-get_product', function (e) {
        e.preventDefault();
        var id = $(this).data('id');    // id for requesting content via ajax

        $('#dynamic-product').html('');
        $('#modal-loader').show();
        
        $.ajax({
            url: '/products/ajax/get_product_full',
            cache: false,
            type: 'POST',
            data: { id: id },
            dataType: 'html'
        })
        .done(function (data) {
            $('#dynamic-product').html('');
            $('#dynamic-product').html(data);
            $('#modal-loader').hide();

        })
        .fail(function () {
            $('#dynamic-product').html('<i class="glyphicon glyphicon-info-sign"></i> Υπήρξε κάποιο πρόβλημα, παρακαλώ προσπαθήστε ξανά.');
            $('#modal-loader').hide();

        });
    });

});