Difference between revisions of "Widget:Homepage"
From LINKS Community Center
Line 147: | Line 147: | ||
const searchString = document.getElementById('hp-search-input').value; | const searchString = document.getElementById('hp-search-input').value; | ||
window.location.assign('/index.php?search=' + encodeURIComponent(searchString) + '&title=Special%3ASearch&profile=default&fulltext=1'); | window.location.assign('/index.php?search=' + encodeURIComponent(searchString) + '&title=Special%3ASearch&profile=default&fulltext=1'); | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
</script> | </script> | ||
Line 391: | Line 347: | ||
</div> | </div> | ||
</div> | </div> | ||
− | </div></div></includeonly> | + | </div></div> |
+ | |||
+ | <script> | ||
+ | const maxAmount = 6; // maximum number of snippets | ||
+ | const snippets = [ | ||
+ | { | ||
+ | "title": "Are you overwhelmed by too many social media technologies?", | ||
+ | "body": "Visit our Technologies Library to find the technology you need.", | ||
+ | "action": "/index.php/List_of_Disaster_Community_Technologies", | ||
+ | "product": "TL", | ||
+ | }, | ||
+ | { | ||
+ | "title": "Do you want to be prepared when disaster strikes?", | ||
+ | "body": "Learn from over 30 use cases about social media and crowdsourcing.", | ||
+ | "action": "/index.php/List_of_Use_Cases", | ||
+ | "product": "UCL", | ||
+ | }, | ||
+ | ]; | ||
+ | const container = document.getElementById('snippets'); | ||
+ | |||
+ | // Fisher-Yates shuffling algorithm | ||
+ | const shuffleArray = (array) => { | ||
+ | for (let i = array.length - 1; i > 0; i--) { | ||
+ | const j = Math.floor(Math.random() * (i + 1)); | ||
+ | [array[i], array[j]] = [array[j], array[i]]; | ||
+ | } | ||
+ | return array; | ||
+ | }; | ||
+ | |||
+ | const indices = Array.from({ length: snippets.length }, (_, index) => index); | ||
+ | |||
+ | // Array of randomly selected snippets (by index) | ||
+ | // TODO: Make sure there is at least one snippet per product. | ||
+ | let selection = shuffleArray(indices); | ||
+ | if (selection.length > maxAmount) selection = selection.slice(0, maxAmount); | ||
+ | |||
+ | for (const index of selection) { | ||
+ | const snippet = snippets[index]; | ||
+ | let el = '<a class="snippet ' + snippet.product + '" href="' + snippet.action + '">'; | ||
+ | el += '<div class="snippet-header">' + snippet.title + '</div>'; | ||
+ | el += '<div class="snippet-body"'> + snippet.body + '</div>'; | ||
+ | el += '</a>'; | ||
+ | container.innerHTML += el; | ||
+ | } | ||
+ | </script> | ||
+ | </includeonly> |
Revision as of 15:51, 15 October 2023
Second version of the LINKS Community Center homepage.
Do not modify!