Jump to content

Widget:UPMakingADifference: Difference between revisions

From Iskomunidad
No edit summary
No edit summary
Line 1: Line 1:
 
```html
<includeonly>
<includeonly>


Line 42: Line 42:


     /*
     /*
     * FIND THIS WIDGET INSTANCE
     * Find this widget instance
     */
     */


     var widgets =
     var widgets = document.querySelectorAll('.update-news');
        document.querySelectorAll('.update-news');
     var widget = widgets[widgets.length - 1];
 
     var widget =
        widgets[widgets.length - 1];


     if (!widget) {
     if (!widget) {
         return;
         return;
     }
     }


     /*
     /*
     * FIND ELEMENTS INSIDE THIS WIDGET
     * Find elements inside this widget
     */
     */


     var loading =
     var loading = widget.querySelector('.update-online-loading');
        widget.querySelector('.update-online-loading');
     var content = widget.querySelector('.update-online-content');
 
     var image = widget.querySelector('.update-online-image');
     var content =
     var title = widget.querySelector('.update-online-title');
        widget.querySelector('.update-online-content');
     var excerpt = widget.querySelector('.update-online-excerpt');
 
     var link = widget.querySelector('.update-online-link');
     var image =
     var dateElement = widget.querySelector('.update-online-date');
        widget.querySelector('.update-online-image');
 
     var title =
        widget.querySelector('.update-online-title');
 
     var excerpt =
        widget.querySelector('.update-online-excerpt');
 
     var link =
        widget.querySelector('.update-online-link');
 
     var dateElement =
        widget.querySelector('.update-online-date');
 


     /*
     /*
     * UP MAKING A DIFFERENCE API
     * Making a Difference API
     * Category ID: 5063
     * Category ID: 5063
     */
     */
Line 90: Line 72:
         'https://up.edu.ph/wp-json/wp/v2/posts' +
         'https://up.edu.ph/wp-json/wp/v2/posts' +
         '?categories=5063&per_page=1&_embed';
         '?categories=5063&per_page=1&_embed';


     /*
     /*
     * RETRIEVE THE LATEST ARTICLE
     * Retrieve the latest article
     */
     */


Line 113: Line 94:


             if (!posts || posts.length === 0) {
             if (!posts || posts.length === 0) {
                 throw new Error('No articles found');
                 throw new Error(
                    'No Making a Difference articles found'
                );
             }
             }


             var post = posts[0];
             var post = posts[0];


             /*
             /*
Line 123: Line 105:
             */
             */


             title.innerHTML =
             title.innerHTML = post.title.rendered;
                post.title.rendered;
 


             /*
             /*
Line 131: Line 111:
             */
             */


             excerpt.innerHTML =
             excerpt.innerHTML = post.excerpt.rendered;
                post.excerpt.rendered;
 


             /*
             /*
Line 139: Line 117:
             */
             */


             link.href =
             link.href = post.link;
                post.link;
 


             /*
             /*
Line 147: Line 123:
             */
             */


             var articleDate =
             var articleDate = new Date(post.date);
                new Date(post.date);


             dateElement.textContent =
             dateElement.textContent =
                 articleDate.toLocaleDateString(
                 articleDate.toLocaleDateString('en-US', {
                    'en-US',
                     year: 'numeric',
                     {
                    month: 'long',
                        year: 'numeric',
                    day: 'numeric'
                        month: 'long',
                });
                        day: 'numeric'
                    }
                );
 


             /*
             /*
             * GET FEATURED THUMBNAIL
             * FEATURED IMAGE
            *
            * Prefer the medium-sized image.
            * Fall back to the thumbnail size,
            * then the original featured image.
             */
             */


             var imageUrl = '';
             var imageUrl = '';
            var media = null;


             if (
             if (
Line 176: Line 144:
                 post._embedded['wp:featuredmedia'].length > 0
                 post._embedded['wp:featuredmedia'].length > 0
             ) {
             ) {
                media = post._embedded['wp:featuredmedia'][0];
            }


                var media =
            if (media) {
                    post._embedded['wp:featuredmedia'][0];


                 var sizes =
                 var sizes =
Line 186: Line 155:
                         : {};
                         : {};


              if (
                /*
    sizes.large &&
                * Prefer the largest available image.
    sizes.large.source_url
                */
) {
    imageUrl = sizes.large.source_url;
} else if (
    sizes.medium_large &&
    sizes.medium_large.source_url
) {
    imageUrl = sizes.medium_large.source_url;
} else if (
    sizes.medium &&
    sizes.medium.source_url
) {
    imageUrl = sizes.medium.source_url;
} else if (media.source_url) {
    imageUrl = media.source_url;
}
 
            }
 
 
            /*
            * DISPLAY FEATURED THUMBNAIL
            */
 
            if (imageUrl) {
 
                image.src =
                    imageUrl;
 
                image.alt =
                    post.title.rendered
                        .replace(/<[^>]*>/g, '');
 
                image.style.display =
                    'block';
 
            }
 
 
            /*
            * SHOW ARTICLE CONTENT
            */
 
            loading.style.display =
                'none';
 
            content.style.display =
                'flex';
 
        })
 
 
        /*
        * ERROR HANDLING
        */
 
        .catch(function (error) {
 
            console.error(
                'Making a Difference Widget:',
                error
            );
 
            loading.textContent =
                'Unable to load the latest Making a Difference article.';
 
        });
 
})();
</script>
 
</includeonly>
 
<noinclude>
 
== UP Making a Difference Widget ==


Displays the latest article from the UP website's
                if (sizes.full && sizes.full.source_url) {
Making a Difference category, including its featured
                    imageUrl = sizes.full.source_url;
thumbnail, publication date, excerpt, and article link.


=== Usage ===
                } else if (
                    sizes.large &&
                    sizes.large.source_url
                ) {
                    imageUrl = sizes.large.source_url;


<pre>
                } else if (
{{#widget:UPMakingADifference}}
                    sizes.medium_large &&
</pre>
                    sizes.medium_large.source_url
                ) {
                    imageUrl = sizes.medium_large.source_url;


</noinclude>
                } else if (
                    media.source_url
                ) {
                    imageUrl = media

Revision as of 00:05, 23 October 2026

```html