Skip to content

Commit

Permalink
🔖 2.2.0
Browse files Browse the repository at this point in the history
  • Loading branch information
Khaoz-Topsy committed May 30, 2024
1 parent 78f18b0 commit 5223fa7
Show file tree
Hide file tree
Showing 13 changed files with 526 additions and 272 deletions.
22 changes: 22 additions & 0 deletions .prettierignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
# Ignore dot files
.githooks
.github
.storybook
.vscode
.xata

# Ignore build files
build
dist

# Ignore generated
coverage
node_modules

# Ignore assets
docs
scripts

# file types
# **/.json
# **/.yml
14 changes: 14 additions & 0 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
{
"typescript.preferences.quoteStyle": "single",
"prettier.trailingComma": "all",
"prettier.tabWidth": 2,
"prettier.semi": true,
"prettier.singleQuote": true,
"prettier.printWidth": 100,
"cSpell.words": [
"Imgs",
"NMSCD",
"noselect",
"urlref"
]
}
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "nmscd.web",
"version": "2.1.7",
"version": "2.2.0",
"scripts": {
"build": "npm-run-all --sequential setup:* live:* sass:* template:*",
"setup": "npm i && npm-run-all --sequential setup:* live:*",
Expand Down
Binary file added public/assets/img/ironVulture.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
86 changes: 73 additions & 13 deletions public/assets/js/custom.js
Original file line number Diff line number Diff line change
@@ -1,18 +1,78 @@
const registerServiceWorker = async () => {
if ('serviceWorker' in navigator) {
try {
const registration = await navigator.serviceWorker.register('/serviceWorker.js');
if (registration.installing) {
console.log('Service worker installing');
} else if (registration.waiting) {
console.log('Service worker installed');
} else if (registration.active) {
console.log('Service worker active');
}
} catch (error) {
console.error(`Registration failed with ${error}`);
}
if ('serviceWorker' in navigator) {
try {
const registration = await navigator.serviceWorker.register('/serviceWorker.js');
if (registration.installing) {
console.log('Service worker installing');
} else if (registration.waiting) {
console.log('Service worker installed');
} else if (registration.active) {
console.log('Service worker active');
}
} catch (error) {
console.error(`Registration failed with ${error}`);
}
}
};

const setCardDisplay = (btn) => {
const selectedClass = 'selected';
document.querySelectorAll('.project-btn').forEach((node) => {
node.classList.remove(selectedClass);
});
btn.classList.add(selectedClass);

const projectSection = document.querySelector('section.projects');
projectSection.classList.forEach((cls) => {
if (cls != 'projects') {
projectSection.classList.remove(cls);
}
});
projectSection.classList.add(btn.dataset['class']);
};

const onSearchChange = (searchString) => {
console.log(searchString);
document.querySelectorAll('article.row.project-tile').forEach((node) => {
const title = node.dataset['title'] ?? '';
const description = node.dataset['description'] ?? '';

const containsTitle = title.toLowerCase().includes(searchString.toLowerCase());
const containsDescription = description.toLowerCase().includes(searchString.toLowerCase());

let orderValue = 3;
node.style.setProperty('opacity', 1);
node.style.setProperty('order', orderValue);

const headingNode = node.querySelector('.text-column h3');
const descriptionNode = node.querySelector('.text-column p');
if (containsTitle | containsDescription) {
if (containsTitle) orderValue -= 2;
if (containsDescription) orderValue -= 1;
node.style.setProperty('order', orderValue);
highlight(headingNode, title, searchString);
highlight(descriptionNode, description, searchString);
} else {
node.style.setProperty('opacity', '0.25');
headingNode.innerHTML = title;
descriptionNode.innerHTML = description;
}
});
};

const highlight = (node, text, searchString) => {
const index = text.toLowerCase().indexOf(searchString.toLowerCase());
if (index >= 0) {
const innerHTML =
text.substring(0, index) +
"<span class='highlight'>" +
text.substring(index, index + searchString.length) +
'</span>' +
text.substring(index + searchString.length);
node.innerHTML = innerHTML;
} else {
node.innerHTML = text;
}
};

registerServiceWorker();
8 changes: 4 additions & 4 deletions template/data/projects.json
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
]
},
{
"title": "NMS Game Updates",
"title": "Game Updates",
"description": "This project aims to show the latest update available for No Man's Sky per platform.",
"imageUrl": "/assets/img/update.png",
"links": [
Expand Down Expand Up @@ -57,7 +57,7 @@
]
},
{
"title": "NMS Community Search",
"title": "Community Search",
"description": "This project aims to be the \"Yellow pages\" of the NMS community. Our goal is to document the different Communities, tools, resources, builders and creators.",
"imageUrl": "/assets/img/search.png",
"links": [
Expand Down Expand Up @@ -94,7 +94,7 @@
]
},
{
"title": "NMS Creature Builder",
"title": "Creature Builder",
"description": "This is a tool to help people craft NMS creatures by allowing you to select the parts that can be used together.",
"imageUrl": "/assets/img/creatureBuilder.png",
"links": [
Expand All @@ -109,7 +109,7 @@
]
},
{
"title": "NMS - Expedition Alphabet",
"title": "Expedition Alphabet",
"description": "A secret No Man's Sky alphabet was teased with the Expedition releases. Once the Beachhead Expedition was released we were able to get most of the letters of the alphabet. This project displays all of the characters that we are pretty sure link up to the English Alphabet.",
"imageUrl": "/assets/img/metaSquare.png",
"links": [
Expand Down
21 changes: 20 additions & 1 deletion template/handlebar/components/project.hbs
Original file line number Diff line number Diff line change
@@ -1,11 +1,30 @@
<article class="row project-tile">
<article class="row project-tile show-in-list" data-title="{{title}}" data-description="{{description}}">
<div class="image-column noselect">
<img src="{{imageUrl}}" alt="{{title}}" draggable="false">
</div>
<div class="text-column">
<h3>{{title}}</h3>
<p>{{{description}}}</p>
</div>
<div class="links-column">
<div class="links noselect">
{{#each links}}
<a href="{{urlref url}}" role="button" class="outline max-1-line" title="{{title}}" target="_blank"
rel="noopener noreferrer">{{title}}</a>
{{/each}}
</div>
</div>
</article>

<article class="row project-tile show-in-grid" data-title="{{title}}" data-description="{{description}}">
<div class="col-9 text-column">
<h3>{{title}}</h3>
<p>{{{description}}}</p>
</div>
<div class="col-3 image-column noselect">
<img src="{{imageUrl}}" alt="{{title}}" draggable="false">
</div>
<div style="flex-grow: 1; order: 3"></div>
<div class="col-9 links-column">
<div class="links noselect">
{{#each links}}
Expand Down
19 changes: 15 additions & 4 deletions template/handlebar/index.html.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,8 @@
<div class="container">
<div class="row">
<div class="col-3 ta-center">
<img src="/assets/img/launch.svg" width="230" height="230"
data-comment="Explicit width and height for SEO purposes" alt="astronaut in space"
<img src="/assets/img/ironVulture.png" width="237" height="176"
data-comment="Explicit width and height for SEO purposes" alt="nms space ship"
draggable="false">
</div>
<div class="col-9">
Expand Down Expand Up @@ -47,15 +47,26 @@
</div>
</section>

<section class="projects">
<section class="projects list">
<div class="container">
<div class="row">
<div class="col-12">
<div class="heading">
<h2>Projects</h2>
</div>
<span>Supported by the NMSCD</span><br>
<div class="list">
</div>

<div class="col-12 search">
<article class="search">
<input type="search" name="search" placeholder="Search for..." oninput="onSearchChange(this.value)" />
<button class="secondary project-btn no-border-right selected" data-class="list" onclick="setCardDisplay(this)" data-tooltip="List view" alt="List view">☰</button>
<button class="secondary project-btn no-border-left" data-class="grid" onclick="setCardDisplay(this)" data-tooltip="Grid view" alt="Grid view">&#x25a6</button>
</article>
</div>

<div class="col-12">
<div class="list-container">
{{#each projects}}
{{> components/project }}
{{/each}}
Expand Down
4 changes: 3 additions & 1 deletion template/node/buildTemplate.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,9 @@ async function buildTemplates() {
const siteData = JSON.parse(siteDataContents);
const liveData = JSON.parse(liveDataContents);
const projects = JSON.parse(projectsContents);


projects.projects.sort((a,b) => (a.title.toLowerCase() > b.title.toLowerCase())
? 1 : ((b.title.toLowerCase() > a.title.toLowerCase()) ? -1 : 0));
const humansArray = [];
for (const humanKey in siteData.humans) {
if (Object.hasOwnProperty.call(siteData.humans, humanKey)) {
Expand Down
Loading

0 comments on commit 5223fa7

Please sign in to comment.