top of page
Lanre Olayiwola

Lanre Olayiwola

Custom Wix Blog Landing page


Blog

import wixData from 'wix-data';
import wixLocation from 'wix-location';
$w.onReady(function () {
 // TODO: write your page related code here...

    loadPosts()
    loadCategories()

});
function timeAgo  (parameter) {
 let timeAgoInfo = '';
 let num
 let now = new Date() //current timeAgoInfo
 let diff = now - parameter // diff between current and provided timeAgoInfo
 var ms_Min = 60 * 1000;
 var ms_Hour = ms_Min * 60;
 var ms_Day = ms_Hour * 24;
 var ms_Mon = ms_Day * 30;
 var ms_Yr = ms_Mon * 365
 if (diff < ms_Min) {
        timeAgoInfo = 'Just Now'
 return timeAgoInfo
    } else if (diff < ms_Hour) {
        num = Math.floor(diff / ms_Min)
        timeAgoInfo = (num === 1) ? num + " minute ago" : num + " minutes ago";
 return timeAgoInfo
    } else if (diff < ms_Day) {
        num = Math.floor(diff / ms_Hour)
        timeAgoInfo = (num === 1) ? num + " hour ago" : num + " hours ago";
 return timeAgoInfo
    } else if (diff < ms_Mon) {
        num = Math.floor(diff / ms_Day)
        timeAgoInfo = (num === 1) ? num + " day ago" : num + " days ago";
 return timeAgoInfo
    } else if (diff < ms_Yr) {
        num = Math.floor(diff / ms_Mon)
        timeAgoInfo = (num === 1) ? num + " month ago" : num + " months ago";
 return timeAgoInfo
    } else if (diff > ms_Yr) {
        num = Math.floor(diff / ms_Yr)
        timeAgoInfo = (num === 1) ? num + " year ago" : num + " years ago";
 return timeAgoInfo
    } else {
 let month = parameter.getMonth() + 1
 let day = parameter.getDate()
 let year = parameter.getFullYear()
 let hour = (parameter.getHours() > 12) ? parameter.getHours() - 12 : (parameter.getHours() === 0) ? '12' : parameter.getHours()
 let minute = (parameter.getMinutes() > 10) ? parameter.getMinutes() : "0" + parameter.getMinutes()
 let ampm = (parameter.getHours() > 12) ? "pm" : "am"
        timeAgoInfo = month + "/" + day + "/" + year + " " + hour + ":" + minute + " " + ampm
 return timeAgoInfo
    }
}
async function loadPosts (parameter) {
    wixData.query("Blog/Posts").find().then(async (res) => {
 if (res.items.length > 0) {
            $w("#Repeater1").data = await res.items;
            $w("#noPostColumnStrip").collapse()
            $w("#postStrip").expand()
        } else {
            $w("#Repeater1").data = [];
            $w("#noPostColumnStrip").expand()
            $w("#postStrip").collapse()
        }
    })
}
async function loadCategories (parameter) {
 let arrayInfo = [];
    wixData.query("Blog/Categories").find().then(async (res) => {
 let citems = res.items
 if (citems.length > 0) {
            citems.map((param)=>{ arrayInfo.push({"label": param["label"], "value": param["label"]})})
            $w("#categories").options = arrayInfo
            $w("#text406, #categories").expand()
        } else {
            console.log("no categories")
            $w("#text406, #categories").collapse()
        }
    })
}
export function categories_click(event) {
 // Add your code for this event here: 
    wixLocation.to($w("#categories").value.toString())
}
export async function Repeater1_itemReady($item, itemData, index) {
 // Add your code for this event here: 
 let defaultImage = $w("#image").src;
    $item("#image").src = await (itemData.coverImage) ? itemData.coverImage : defaultImage;

    $item("#image").alt = await (itemData.title.length > 50) ? itemData.title.slice(0,47) + "..." : itemData.title;

    $item("#image").tooltip = await (itemData.title.length > 50) ? itemData.title.slice(0, 47) + "..." : itemData.title;

    $item("#daysAgo").text = await (itemData.lastPublishedDate) ? timeAgo(itemData.lastPublishedDate).toString() : "";

    $item("#title").text = await (itemData.title.length > 50) ? itemData.title.slice(0, 47) + "..." : itemData.title;

    $item("#excerpt").text = await (itemData.excerpt.length > 150) ? itemData.excerpt.slice(0, 147) + "..." : itemData.excerpt;

 //console.log(itemData.categories)
 if (itemData.categories.length > 0) {
 let categoryList = [];
 for (var i = 0; i < itemData.categories.length; i++) {
 let info = await loadRepeaterCategories(itemData.categories[i])
 await categoryList.push({ "label": info, "value": info })
        }

 if (categoryList.length > 0) {
            $item("#categoriesRepeater").options = await categoryList
            $item("#categoriesRepeater").show()
        } else {
            $item("#categoriesRepeater").hide()
        }

    } else {
        $item("#categoriesRepeater").options = []
        $item("#categoriesRepeater").hide()
    }

    $item("#title").onClick((event) => {
        wixLocation.to(itemData["postPageUrl"])
    })
    $item("#image").onClick((event) => {
        wixLocation.to(itemData["postPageUrl"])
    })
}
async function loadRepeaterCategories (parameter) {
 let info = "";
 await wixData.query("Blog/Categories").eq("_id", parameter).find().then((res) => {
 if (res.items.length > 0) {
            info = res.items[0].label;
        } else {
            info = null;
        }
    })

 return info
}

Have fun!

Comments


bottom of page