https://www.kindcentrumsluisbuurt.nl/media/mod_socialwall26/js/socialwall.js?cb0769

1jQuery.ajaxSetup({cache: true});
2
3var accessToken = '';
4var socialTitle = '';
5var appId = '';
6var facebookId = '';
7var instagramId = '';
8
9var viewportWidth = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
10var itemWidth = 350;
11var itemsPerRow = Math.floor(viewportWidth / itemWidth);
12var visibleRows = 1;
13var items = [];
14
15function Item(type, message, created, image, link, likes, comments, shares, thumb_image) {
16    this.type = type.toLowerCase();
17    this.message = message;
18    created = created.replace('+0000', '');
19    this.created = new Date(created);
20    this.image = image || null;
21    this.link = link;
22    this.likes = likes;
23    this.comments = comments;
24    this.shares = shares;
25    this.thumb_image = thumb_image;
26}
27
28Item.prototype.draw = function () {
29
30    if (this.message) {
31        // console.log(this)
32        var message = this.message;
33
34        var found = message.match(/#([a-zA-Z]+)/gm);
35        if (found) {
36            for (var i = 0; i < found.length; i++) {
37                tag = found[i].replace("#", "");
38                if (this.type == 'instagram') {
39                    this.message = this.message.replace(found[i], '<a href="https://www.instagram.com/explore/tags/' + tag + '/" target="_blank">' + found[i] + '</a>');
40                } else if (this.type == 'facebook') {
41                    this.message = this.message.replace(found[i], '<a href="https://www.facebook.com/hashtag/' + tag + '/" target="_blank">' + found[i] + '</a>');
42                }
43
44            }
45        }
46        var html = '<div class="item">' +
47            '<div class="social-header"><span class="logo"><span class="type ' + this.type + ' icon-' + this.type + '"></span></span><span class="title">' + socialTitle + '</span>' +
48            '<span class="created">' + this.created.toLocaleDateString() + '</span></div>';
49        if (this.thumb_image) {
50            this.image = this.thumb_image;
51        }
52        if (this.image) {
53            html += '<a href="' + this.link + '" class="link" target="_blank"><img class="postImage" src="' + this.image + '" /></a>';
54        }
55        html += '<p class="message">' + this.message + '</p>';
56        html += '<div class="bottomBar">' +
57            '<span class="likes"><span class="icon-favourite"></span>' + this.likes + '</span>' +
58            '<span class="comments"><span class="icon-comment"></span>' + this.comments + '</span>';
59
60        if (this.link) {
61            html += '<a href="' + this.link + '" class="link" target="_blank"><span class="icon-launch"></span></a>';
62        }
63
64        html += '</div></div>';
65        jQuery('#wall').append(html);
66    }
67};
68
69var socialWallItemsDone = false;
70
71function callback() {
72    if ((facebookId == '' || socialWallItemsDone) && (instagramId == '' || socialWallItemsDone)) {
73        drawItems(false);
74    }
75}
76
77function drawItems(refresh) {
78
79    //sortering
80    items.sort(function (a, b) {
81        return b.created - a.created;
82    });
83
84    jQuery('#wall').empty();
85
86    let visible = true;
87    let showLimit = visibleRows * itemsPerRow;
88
89    for (let i = 0; i < items.length; i++) {
90        if (i < showLimit) {
91            items[i].draw(visible);
92        }
93    }
94
95    if (showLimit > items.length) {
96        jQuery('#showMoreItems').hide();
97    }
98
99    jQuery('#wall').imagesLoaded().progress(function () {
100        if (refresh) {
101            jQuery('#wall').masonry('destroy')
102        }
103        jQuery('#wall').masonry({
104            itemSelector: '.item',
105            percentPosition: false,
106            isFitWidth: true
107        });
108    });
109
110}
111
112function requestItems() {
113    let request = jQuery.ajax({
114        url: "https://cdn.askoscholen.nl/lib/socialwall/socialwall.php",
115        type: "POST",
116        data: {
117            type: "items",
118            facebook_id: facebookId,
119            instagram_id: instagramId
120        },
121        complete: (function (response) {
122            if ((typeof response.error !== 'undefined') && (response.error)) {
123                console.log('Error', response);
124            } else {
125                let data = response.responseJSON;
126                if (data.length) {
127                    for (let i = 0; i < data.length; i++) {
128                        if (data[i].shares) {
129                            var shares = data[i].shares.count || 0;
130                        } else {
131                            var shares = 0;
132                        }
133                        if (data[i].message !== null) {
134                            items.push(
135                                new Item(
136                                    data[i].type,
137                                    data[i].message,
138                                    data[i].created,
139                                    data[i].image,
140                                    data[i].link,
141                                    data[i].likes,
142                                    Math.floor(Math.random() * (6 - 0) + 0),
143                                    data[i].shares,
144                                    data[i].thumb_image
145                                )
146                            );
147                        }
148                    }
149                    socialWallItemsDone = true;
150                } else {
151                    console.log('No Facebook items found.', response);
152                }
153            }
154            callback();
155        })
156    });

157}
158
159
160jQuery(document).ready(function () {
161    appId = jQuery('#wall').attr('data-app');
162    accessToken = jQuery('#wall').attr('data-token');
163    socialTitle = jQuery('#wall').attr('data-title');
164    facebookId = jQuery('#wall').attr('data-facebook');
165    instagramId = jQuery('#wall').attr('data-instagram');
166
167    requestItems(facebookId, instagramId);
168});
169
170jQuery(document).resize(function () {
171    viewportWidth = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
172    drawItems(true);
173});
174
175jQuery(document).on('click', '#showMoreItems', function (e) {
176    e.preventDefault();
177    visibleRows++;
178    drawItems(true);
179});