Skip to content

Commit

Permalink
Merge pull request #93 from blueprint-site/develop
Browse files Browse the repository at this point in the history
Added for-creators tab on home page, changed a couple of things also
  • Loading branch information
blueprint-site authored Jun 10, 2024
2 parents 6afaba3 + 577f49c commit 328f7c6
Show file tree
Hide file tree
Showing 2 changed files with 180 additions and 160 deletions.
199 changes: 84 additions & 115 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -27,8 +27,6 @@
</nav>
<main>
<div id="dark-mode-toggle"><span>Change theme</span></div>
<br>
<br>
<div class="home-explore">
<center>
<div class="home-discover-addons">
Expand All @@ -38,116 +36,55 @@ <h2 class="home-discover-addons-text">Discover Addons</h2>
<img src="static/banner1.webp" alt="" class="home-slideshow-image" id="home-slideshow-image">
<div class="side-box" id="side-box">(w)
</div>
</center>
</center>
</div>

<br>

<div class="home-more-addons-button-container">
<a href="/addons.html" class="home-more-addons-button">
<div class="more-addons-inside-text">Show more...</div>
</a>
</div>
<br>
<br>
<div class="random-addons">
<h1 class="random-addon-header">Here is a Random Addon for you to enjoy!</h1>
<div class="random-addon" id="random-addon"></div>
</div>
<br>
<br>
<br>

<center>
<div class="discover-addons-background">
<div class="discover-addons-line">

</div>


<div class="addon-list">
<!---One-->
<div class="addon" style="background-image: url('static/banner1.webp');">
<h3>Create Railways Navigator</h3>

<div class="addon-description">
<h4>Ever wanted a navigator for your trains? Yes? This addon is for you!</h4>
</div>
</div>
<!---Two-->
<div class="addon" style="background-image: url('static/banner2.webp');">
<h3>Create: Steam 'n' Rails</h3>

<div class="addon-description">
<h4>Enchance Your Create Mod train experience with Steam 'n' Rails</h4>
</div>
</div>
<!---Three-->
<div class="addon" style="background-image: url('static/banner3.webp');">
<h3>Create: Structures</h3>

<div class="addon-description">
<h4>Early-game structures for Your world</h4>
</div>
<!---Four-->
</div>
<div class="addon" style="background-image: url('static/banner4.webp');">
<h3>Modern Train Parts</h3>

<div class="addon-description">
<h4>This is a create addon that implements modern railway systems, cargo and deco blocks for
create trains.</h4>
</div>
</div>
<!---Five-->
<div class="addon" style="background-image: url('static/banner5.webp');">
<h3>Create Crafts & Additions</h3>

<div class="addon-description">
<h4>Create Crafts & Additions extends Create and acts as a bridge between electricity and
kinetic energy</h4>
</div>
</div>
<!---Six-->
<div class="addon" style="background-image: url('static/banner6.webp');">
<h3>Create: Bells & Whistles</h3>

<div class="addon-description">
<h4>Additions and adornments for the modern Create engineer. Available for both Fabric &
Forge!</h4>
</div>
</div>
<!---Seven-->
<div class="addon" style="background-image: url('static/banner7.webp');">
<h3>Create Track Map</h3>

<div class="addon-description">
<h4>A web-based track map of your world's Create train system, complete with signals, stations,
and trains moving in real time.</h4>
</div>
</div>
<!---Eight-->
<div class="addon" style="background-image: url('static/banner8.webp');">
<h3>Create: The Factory Must Grow</h3>

<div class="addon-description">
<h4>Heavy Engineering & Oil For The Create Mod</h4>
</div>
</div>
<!---Nine-->
<div class="addon" style="background-image: url('static/banner9.webp');">
<h3>Create: Interactive</h3>

<div class="addon-description">
<h4>A rewrite of Create's contraptions using VS2 to allow for things like building on existing
contraptions, stacked contraptions, train derailment and more!</h4>
</div>
</div>
</div>

<div class="for-creators">

<div class="for-creators-textbox">
<h1 class="for-creators-header">For Creators</h1>
<h2>You can't find your addon here?</h2>
<h2>Contact us and request a re-scan of all addons for your addon to join other!</h2>
<h2>You can join our Discord or email us on: [email protected]</h2>
<a href="https://discord.gg/ZF7bwgatrT" class="for-creators-discord">Join our Discord!</a>
<a href="mailto:[email protected]" class="for-creators-email">Email us</a>
</div>

<div class="for-creators-imagebox">
<img src="/static/addon_image1.webp" alt="" class="for-creators-image">
<img src="/static/addon_image2.webp" alt="" class="for-creators-image">
<img src="/static/addon_image3.webp" alt="" class="for-creators-image">
<img src="/static/addon_image4.webp" alt="" class="for-creators-image">
<img src="/static/addon_image5.webp" alt="" class="for-creators-image">
<img src="/static/addon_image6.webp" alt="" class="for-creators-image">
</div>
</div>

<div class="home-more-addons-button-container">
<a href="/addons.html" class="home-more-addons-button">
<div class="more-addons-inside-text">Show more...</div>
</a>
</div>

<div class="discover-addons-line"></div>
<br>
</center>
</div>
<dir class="site-info">
<br>
<h2 class="h2-blueprint">What is Blueprint?</h2>
<h4 class="h3-blueprint">Blueprint is a site made to help You find Your favorite Create Mod addons</h4>
<h3 class="h3-blueprint">How does it work?</h3>
<p class="h4-blueprint">We collect data from Modrinth and Curseforge and then use it to show you the addons
<p class="h4-blueprint">We collect data from Modrinth (and Curseforge in future) and then use it to show you the addons
(more info <a class="blogpost" href="/blog/howthefuck.html">here</a>)</p>
<h3 class="h3-blueprint">Who is behind the site?</h3>
<p class="h4-blueprint">The creator: @yehorscode on Github, .egorro on Discord</p>
Expand All @@ -169,7 +106,7 @@ <h6 class="bottom-bar-bug">Made with ❤️ by @yehorscode and @thereal_flo_</h6
<script>

// JavaScript code for slideshow functionality
var images = ["static/banner1.webp", "static/banner2.webp", "static/banner3.webp", "static/banner10.webp", "static/banner11.webp"]; // Array of image paths
var images = ["static/banner1.webp", "static/banner2.webp", "static/banner3.webp", "static/banner4.webp", "static/banner11.webp"]; // Array of image paths
var currentIndex = 0; // Index of the current image
var imageElement = document.getElementById("home-slideshow-image");
var sideBox = document.getElementById("side-box");
Expand All @@ -190,41 +127,42 @@ <h6 class="bottom-bar-bug">Made with ❤️ by @yehorscode and @thereal_flo_</h6
}, 500); // Change this value to adjust the delay
}


// Function to update side box content based on the current image
function updateSideBoxContent(index) {
if (index === 0) {
sideBox.innerHTML = `
<img src="https://cdn.modrinth.com/data/Dq3STxps/011f13a3eaf73d06a26b60a3a6ba858d3735815d.png" alt="">
<h3 class="side-box-text">Create Railways navigator</h3>
<h4 class="side-box-dsc">Get train connections in your world from one station to another using the Create Railways Navigator.</h4>
<img src="https://cdn.modrinth.com/data/FTeXqI9v/fe75695f6f2e085ac9fb56204de7f88b6d716e8d.png" alt="">
<h3 class="side-box-text">Create: New Age</h3>
<h4 class="side-box-dsc">Create: New Age is an addon for the Create mod that adds integration with electricity.</h4>
`;
} else if (index === 1) {
// Add content for the second image
sideBox.innerHTML = `
<img src="https://cdn.modrinth.com/data/ZzjhlDgM/23d42e3d1c878cb77f9e74a3f78fed2d011ed937.png" alt="">
<h3 class="side-box-text">Create: Steam 'n' Rails</h3>
<h4 class="side-box-dsc">Adding depth to Create's rail network & steam system</h4>
<img src="https://cdn.modrinth.com/data/ihpnEd80/1b6e859ac168a44ad383e36252ad6c563a245056.png" alt="">
<h3 class="side-box-text">Create Cobblestone</h3>
<h4 class="side-box-dsc">Adds a block generating cobblestone using SU, stopping cobblestone generators from eating your frames.</h4>
`;
} else if (index === 2) {
// Add content for the third image
sideBox.innerHTML = `
<img src="https://cdn.modrinth.com/data/IAnP4np7/0c69bfc4fb1df010c35c02f94ebc275ba0fa9bae.png" alt="">
<h3 class="side-box-text">Create: Structures</h3>
<h4 class="side-box-dsc">Add-on for Create that implements naturally generating structures containing early-game Create contraptions and items.</h4>
<img src="https://cdn.modrinth.com/data/sMvUb4Rb/568feacea08ddad4bf91f5e5c396b76a7cba3e30.png" alt="">
<h3 class="side-box-text">Create Deco</h3>
<h4 class="side-box-dsc">Industrial decoration themed around the aesthetics of the Create mod</h4>
`;
} else if (index === 3) {
// Add content for the third image
sideBox.innerHTML = `
<img src="https://cdn.modrinth.com/data/GmjmRQ0A/9af7f38727e4c1dc30c67fefd80b15000a2b8c07.png" alt="">
<h3 class="side-box-text">Create Slice & Dice</h3>
<h4 class="side-box-dsc">Making automation for Farmers Delight more sensible</h4>
<img src="https://cdn.modrinth.com/data/gxoNIjg6/a67aa736ddbd20c45cca55d1dc5ef03c2caf841f.png" alt="">
<h3 class="side-box-text">Create Track Map</h3>
<h4 class="side-box-dsc">A web-based track map of your world's Create train system, complete with signals, stations, and trains moving in real time.</h4>
`;
} else if (index === 4) {
// Add content for the third image
sideBox.innerHTML = `
<img src="https://cdn.modrinth.com/data/GWp4jCJj/a3c3d5087ac30256a7e98309e322ab4766508ec7.png" alt="">
<h3 class="side-box-text">Create Big Cannons</h3>
<h4 class="side-box-dsc">A Minecraft mod for building large cannons with the Create mod.</h4>
<img src="https://cdn.modrinth.com/data/j6Zt3N7W/7695e7967fd8386954b8b2f13e579b99c7839650.png" alt="">
<h3 class="side-box-text">Create: Factory</h3>
<h4 class="side-box-dsc">🍬 A lot of new foods added to Create!</h4>
`;
}
}
Expand All @@ -234,6 +172,37 @@ <h4 class="side-box-dsc">A Minecraft mod for building large cannons with the Cre

// Change slide every 3 seconds
setInterval(nextSlide, 5000);

document.addEventListener("DOMContentLoaded", function () {
fetch('static/data/final_data.json') // Fetch the JSON file
.then(response => response.json())
.then(data => {
const addonIds = Object.keys(data); // Get all addon IDs
const randomId = addonIds[Math.floor(Math.random() * addonIds.length)]; // Select a random addon ID
const randomAddon = data[randomId]; // Get the addon object by its ID
displayAddon(randomAddon); // Display the random addon
})
.catch(error => console.error('Error fetching addons:', error));
});

function displayAddon(addon) {
let modloaders = "";
if (addon.addon_categories.includes("forge")) modloaders += `<a class="supports-forge" target="_blank" rel="noopener noreferrer" href="https://forums.minecraftforge.net"><img alt="Forge support" height="30" src="https://cdn.jsdelivr.net/npm/@intergrav/devins-badges@3/assets/compact-minimal/supported/forge_46h.png"></a>`;
if (addon.addon_categories.includes("neoforge")) modloaders += `<a class="supports-neoforge" target="_blank" rel="noopener noreferrer" href="https://neoforged.net"><img alt="NeoForge support" height="30" src="/static/neoforge_46h.png"></a>`;
if (addon.addon_categories.includes("fabric")) modloaders += `<a class="supports-fabric" target="_blank" rel="noopener noreferrer" href="https://fabricmc.net"><img alt="Fabric support" height="30" src="https://cdn.jsdelivr.net/npm/@intergrav/devins-badges@3/assets/compact-minimal/supported/fabric_46h.png"></a>`;
if (addon.addon_categories.includes("quilt")) modloaders += `<a class="supports-quilt" target="_blank" rel="noopener noreferrer" href="https://quiltmc.org"><img alt="Quilt support" height="30" src="https://cdn.jsdelivr.net/npm/@intergrav/devins-badges@3/assets/compact-minimal/supported/quilt_46h.png"></a>`;

const randomAddonDiv = document.getElementById('random-addon');
randomAddonDiv.innerHTML = `
<img class="random-addon-logo" src="${addon.addon_icon_url}" alt="">
<div class="modloaders"><center>${modloaders}</center></div>
<div class="random-addon-text-box">
<h3 class="random-addon-name">${addon.addon_name}</h3>
<h4 class="random-addon-description">${addon.addon_short_descriptions}</h4>
</div>
<a target="_blank" rel="noopener noreferrer" class="addon-button" href="${"https://modrinth.com/mod/" + addon.addon_slug}"><img alt="Download on Modrinth" height="35" src="https://cdn.jsdelivr.net/npm/@intergrav/devins-badges@3/assets/compact/available/modrinth_46h.png"></a>
`;
}
</script>
</body>
</html>
Loading

0 comments on commit 328f7c6

Please sign in to comment.