Auto update
BIN
beta/android-chrome-192x192.png
Normal file
|
After Width: | Height: | Size: 34 KiB |
BIN
beta/android-chrome-512x512.png
Normal file
|
After Width: | Height: | Size: 149 KiB |
BIN
beta/apple-touch-icon.png
Normal file
|
After Width: | Height: | Size: 30 KiB |
435
beta/compare.html
Normal file
|
|
@ -0,0 +1,435 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="A backup program for disk arrays. It stores parity information of your data and it recovers from up to six disk failures">
|
||||
<meta name="keywords" content="snapraid snapshot raid backup disk array redundancy parity">
|
||||
<title>Compare SnapRAID</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
||||
<script src="script.js"></script>
|
||||
|
||||
<!-- Google Analytics 4 -->
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-W1Z5FKHYQ4"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
|
||||
gtag('config', 'G-W1Z5FKHYQ4');
|
||||
</script>
|
||||
|
||||
<!-- Google Universal Analytics -->
|
||||
<script type="text/javascript">
|
||||
|
||||
var _gaq = _gaq || [];
|
||||
_gaq.push(['_setAccount', 'UA-21967501-1']);
|
||||
_gaq.push(['_trackPageview']);
|
||||
|
||||
(function() {
|
||||
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
||||
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
||||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
||||
})();
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="container nav-container">
|
||||
<a href="index.html" class="logo">
|
||||
<img src="favicon-32x32.png"/>
|
||||
SnapRAID
|
||||
</a>
|
||||
<nav>
|
||||
<input type="checkbox" id="menu-toggle">
|
||||
<label for="menu-toggle" class="menu-icon"><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"><path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"/></svg></label>
|
||||
<ul>
|
||||
<li><a href="index" >Home</a></li>
|
||||
<li><a href="ui" >UI & Daemon</a></li>
|
||||
<li><a href="howitworks" >How it Works</a></li>
|
||||
<li><a href="manual" >Manual</a></li>
|
||||
<li><a href="compare" class="active">Compare</a></li>
|
||||
<li><a href="design" >Design</a></li>
|
||||
<li><a href="faq" >FAQ</a></li>
|
||||
<li><a href="support" >Support</a></li>
|
||||
<li><a href="download" class="nav-cta">Download</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
||||
<div class="container" style="padding: 4rem 20px;">
|
||||
<h1 style="text-align: center; margin-bottom: 2rem;">Comparison</h1>
|
||||
|
||||
<div style="max-width: 800px; margin: 0 auto 4rem auto; color: var(--text-secondary); line-height: 1.7;">
|
||||
<p style="font-size: 1.1rem; margin-bottom: 1.5rem;">
|
||||
<strong style="color: var(--text-primary);">SnapRAID</strong> is one of many <strong style="color: var(--text-primary);">RAID-like</strong> solutions available for disk arrays.
|
||||
</p>
|
||||
|
||||
<p style="margin-bottom: 1rem;">Some well-known alternatives include:</p>
|
||||
|
||||
<ul style="margin-bottom: 2rem; list-style: none; padding-left: 0;">
|
||||
<li style="margin-bottom: 1.25rem; padding-left: 1rem; border-left: 2px solid var(--border-color);">
|
||||
<a href="http://www.lime-technology.com/" target="_blank" rel="noopener">unRAID</a>
|
||||
- A commercial solution (only the RAID core is GPL2). It uses a modified Linux XFS filesystem with real-time redundancy. Integrity checksums are not natively supported.
|
||||
</li>
|
||||
<!--
|
||||
<li style="margin-bottom: 1.25rem; padding-left: 1rem; border-left: 2px solid var(--border-color);">
|
||||
<s>FlexRAID</s>
|
||||
- <strong style="color: var(--danger); font-size: 0.75rem; border: 1px solid var(--danger); padding: 1px 4px; border-radius: 4px; vertical-align: middle;">DISCONTINUED</strong>. A commercial, proprietary C++/Java application for Windows, with limited Linux support. It offered both snapshot and real-time redundancy, including integrity checksums.
|
||||
</li>
|
||||
-->
|
||||
<li style="margin-bottom: 1.25rem; padding-left: 1rem; border-left: 2px solid var(--border-color);">
|
||||
<a href="http://en.wikipedia.org/wiki/ZFS" target="_blank" rel="noopener">ZFS</a>
|
||||
- An open-source (GPL-incompatible) filesystem with real-time redundancy and integrity checksums.
|
||||
</li>
|
||||
<li style="margin-bottom: 1.25rem; padding-left: 1rem; border-left: 2px solid var(--border-color);">
|
||||
<a href="http://en.wikipedia.org/wiki/btrfs" target="_blank" rel="noopener">Btrfs</a>
|
||||
- An open-source (GPL2) Linux filesystem with real-time redundancy. Since Linux 3.9, it supports <a href="http://lwn.net/Articles/536038/" target="_blank" rel="noopener">RAID5/6 redundancy</a> and integrity checksums.
|
||||
Issues have been identified, and the official <a href="https://btrfs.readthedocs.io/en/latest/btrfs-man5.html#raid56-status-and-recommended-practices" target="_blank" rel="noopener">wiki</a> as of 2026 warns:
|
||||
<em style="display: block; margin-top: 0.5rem; color: var(--text-secondary); background: rgba(255,255,255,0.03); padding: 0.5rem; border-radius: 4px;">"There are some implementation and design deficiencies that make it unreliable for some corner cases and the feature should not be used in production, only for evaluation or testing."</em>
|
||||
</li>
|
||||
<li style="margin-bottom: 1.25rem; padding-left: 1rem; border-left: 2px solid var(--border-color);">
|
||||
<a href="https://learn.microsoft.com/en-us/windows-server/storage/storage-spaces/overview" target="_blank" rel="noopener">Storage Spaces</a>
|
||||
- Microsoft’s solution, integrated into Windows 8 and later. Proprietary, with real-time redundancy but no checksum support. It also has several <a href="http://helgeklein.com/blog/2012/03/windows-8-storage-spaces-bugs-and-design-flaws/" target="_blank" rel="noopener">limitations</a>.
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
<div style="margin-top: 4rem;">
|
||||
<h2>Key Takeaways</h2>
|
||||
<div class="grid grid-2-cols">
|
||||
<div class="card">
|
||||
<h3>Real-time vs Snapshot</h3>
|
||||
<p>
|
||||
|
||||
The primary factor for categorizing storage solutions is when redundancy information is updated. This timing determines whether the system acts as a live mirror or a point-in-time recovery tool.
|
||||
In <strong style="color: var(--text-primary);">real-time</strong> solutions, parity is updated immediately during every write operation without user action. While this ensures the array is constantly protected against hardware failure, it does not allow for the restoration of an earlier state, meaning accidental deletions are propagated instantly.
|
||||
In <strong style="color: var(--text-primary);">snapshot</strong> solutions, parity is updated only upon an explicit request, similar to a backup. This creates a fixed point in time that allows to recover files that were accidentally deleted or modified since the last sync.
|
||||
</p>
|
||||
</div>
|
||||
<div class="card">
|
||||
<h3>Integrity & Bitrot</h3>
|
||||
<p>
|
||||
Silent data corruption, or bitrot, is a <a href="https://www.zdnet.com/article/data-corruption-is-worse-than-you-know/" target="_blank" rel="noopener">major threat</a> where storage devices return corrupted data without reporting hardware errors. Unlike traditional disk failures, this bit-level degradation remains invisible until the data is accessed or an array reconstruction is attempted.
|
||||
A primary factor in categorizing storage solutions is their support for <strong style="color: var(--text-primary);">integrity checksums</strong> to detect and repair this corruption. Advanced systems use hashing to verify data blocks, allowing them to identify silent changes even if timestamps remain unaltered and use parity data to reconstruct the original, uncorrupted information.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="compare-container" style="margin-top: 4rem;">
|
||||
<h2>Features comparison</h2>
|
||||
<table class="data-table compare-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width: 30%;">Feature</th>
|
||||
<th class="snapraid-header snapraid-col">SnapRAID</th>
|
||||
<th>Unraid</th>
|
||||
<th>ZFS</th>
|
||||
<th>Btrfs</th>
|
||||
<th>Storage Spaces</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<!-- Redundancy Model -->
|
||||
<tr>
|
||||
<td class="feature-cell">
|
||||
Redundancy Model
|
||||
<div class="cell-subtext">Real-time computes parity in real-time like RAID; snapshot computes parity on request, like backups.</div>
|
||||
</td>
|
||||
<td class="snapraid-col">Snapshot</td>
|
||||
<td>Real-time</td>
|
||||
<td>Real-time<br>Snapshot</td>
|
||||
<td>Real-time<br>Snapshot</td>
|
||||
<td>Real-time</td>
|
||||
</tr>
|
||||
|
||||
<!-- Integrity -->
|
||||
<tr>
|
||||
<td class="feature-cell">
|
||||
Integrity
|
||||
<div class="cell-subtext">Whether data is validated with a checksum, and the default checksum type.</div>
|
||||
</td>
|
||||
<td class="snapraid-col check">Yes<br>SpookyHash<br>128-bit</td>
|
||||
<td class="cross">
|
||||
No
|
||||
<div class="info-wrapper">
|
||||
<button class="info-btn" aria-label="More info">
|
||||
<svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"/></svg>
|
||||
</button>
|
||||
<div class="info-content" hidden>
|
||||
unRAID can use integrity checksums via plugins like <a href="https://forums.lime-technology.com/topic/43290-dynamix-file-integrity-plugin/">Dynamix File Integrity</a> or <a href="https://forums.lime-technology.com/topic/35615-bunker-yet-another-utility-for-file-integrity-checks/">bunker</a>. However, these are independent of parity processing and not used to aid recovery. For example, when recovering a single failed disk with dual parity, checksums can identify additional silent errors to facilitate recovery. To achieve functionality similar to SnapRAID, you would need to use the Btrfs filesystem for all your data disks.
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="check">Yes<br>Fletcher4<br>256-bit</td>
|
||||
<td class="check">Yes<br>CRC32C<br>32-bit</td>
|
||||
<td class="cross">
|
||||
No
|
||||
<div class="info-wrapper">
|
||||
<button class="info-btn" aria-label="More info">
|
||||
<svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"/></svg>
|
||||
</button>
|
||||
<div class="info-content" hidden>
|
||||
Storage Spaces can be used with ReFS, which supports integrity checksums, but not in Parity mode: <a href="http://www.windowscentral.com/how-use-resilient-file-system-refs-windows-10"><i>"Although you may select Simple (no resiliency) or Parity, both options will fail the process."</i></a>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Fix Silent Errors -->
|
||||
<tr>
|
||||
<td class="feature-cell">
|
||||
Fix Silent Errors
|
||||
<div class="cell-subtext">Whether silent errors are detected and fixed before propagating to parity.</div>
|
||||
</td>
|
||||
<td class="snapraid-col check">Yes</td>
|
||||
<td class="cross">
|
||||
No
|
||||
<div class="info-wrapper">
|
||||
<button class="info-btn" aria-label="More info">
|
||||
<svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"/></svg>
|
||||
</button>
|
||||
<div class="info-content" hidden>
|
||||
unRAID lacks native checksums and ignores silent errors. Even worse, if a parity mismatch is detected due to a silent error in the data, the parity is automatically recomputed, making it impossible to recover the silent error, even manually. Integrity checksum plugins do not help in this case, as they are not integrated into the parity-checking process.
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="check">
|
||||
Yes
|
||||
<div class="info-wrapper">
|
||||
<button class="info-btn" aria-label="More info">
|
||||
<svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"/></svg>
|
||||
</button>
|
||||
<div class="info-content" hidden>
|
||||
ZFS and Btrfs provide bit-rot protection comparable to SnapRAID. One drawback of ZFS is that its default Fletcher checksum prioritizes speed over reliability. SnapRAID uses 128-bit SpookyHash.
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="check">
|
||||
Yes
|
||||
<div class="info-wrapper">
|
||||
<button class="info-btn" aria-label="More info">
|
||||
<svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"/></svg>
|
||||
</button>
|
||||
<div class="info-content" hidden>
|
||||
ZFS and Btrfs provide bit-rot protection comparable to SnapRAID. Btrfs uses CRC32C by default. SnapRAID uses 128-bit SpookyHash.
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="cross">No</td>
|
||||
</tr>
|
||||
|
||||
<!-- Number of Failures -->
|
||||
<tr>
|
||||
<td class="feature-cell">Number of Failures
|
||||
<div class="cell-subtext">How many disk failures are supported? 1 for RAID5, 2 for RAID6.</div>
|
||||
</td>
|
||||
<td class="snapraid-col check">1-6</td>
|
||||
<td class="check">1-2</td>
|
||||
<td class="check">
|
||||
1-3
|
||||
<div class="info-wrapper">
|
||||
<button class="info-btn" aria-label="More info">
|
||||
<svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"/></svg>
|
||||
</button>
|
||||
<div class="info-content" hidden>
|
||||
ZFS employs a suboptimal RAID-Z3 algorithm requiring ~2x computation vs SnapRAID z-parity.
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="check">1-2</td>
|
||||
<td class="check">1-2</td>
|
||||
</tr>
|
||||
|
||||
<!-- More disk failures -->
|
||||
<tr>
|
||||
<td class="feature-cell">
|
||||
More disk failures
|
||||
<div class="cell-subtext">If more disks fail than the supported redundancy model, can data on non-failed disks be recovered?</div>
|
||||
</td>
|
||||
<td class="snapraid-col check">Yes</td>
|
||||
<td class="check">Yes</td>
|
||||
<td class="cross">No</td>
|
||||
<td class="cross">No</td>
|
||||
<td class="cross">No</td>
|
||||
</tr>
|
||||
|
||||
<!-- Power/Noise -->
|
||||
<tr>
|
||||
<td class="feature-cell">
|
||||
Power/Noise
|
||||
<div class="cell-subtext">How many disks spin when reading a single file?</div>
|
||||
</td>
|
||||
<td class="snapraid-col check">One</td>
|
||||
<td class="check">One</td>
|
||||
<td class="cross">All</td>
|
||||
<td class="cross">All</td>
|
||||
<td class="cross">All</td>
|
||||
</tr>
|
||||
|
||||
<!-- Filled disks -->
|
||||
<tr>
|
||||
<td class="feature-cell">Filled Disks
|
||||
<div class="cell-subtext">Can you start with disks that already contain data?</div>
|
||||
</td>
|
||||
<td class="snapraid-col check">Yes</td>
|
||||
<td class="check">Yes</td>
|
||||
<td class="cross">No</td>
|
||||
<td class="cross">No</td>
|
||||
<td class="cross">No</td>
|
||||
</tr>
|
||||
|
||||
<!-- Add filled disks -->
|
||||
<tr>
|
||||
<td class="feature-cell">Add Filled Disks
|
||||
<div class="cell-subtext">Can data disks that already contain data be added later?</div>
|
||||
</td>
|
||||
<td class="snapraid-col check">Yes</td>
|
||||
<td class="cross">
|
||||
No
|
||||
<div class="info-wrapper">
|
||||
<button class="info-btn" aria-label="More info">
|
||||
<svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"/></svg>
|
||||
</button>
|
||||
<div class="info-content" hidden>
|
||||
unRAID 7.2 claims it can add data disks to an existing array, but it effectively rebuilds parity from scratch. During this process, disks already in the array <a href="https://youtu.be/frtauLMO3-c?t=803">are not protected</a>. This puts stress on all drives with no safety net.
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="cross">No</td>
|
||||
<td class="cross">No</td>
|
||||
<td class="cross">No</td>
|
||||
</tr>
|
||||
|
||||
<!-- OS -->
|
||||
<tr>
|
||||
<td class="feature-cell">Operating System
|
||||
<div class="cell-subtext">Which operating systems are supported?</div>
|
||||
</td>
|
||||
<td class="snapraid-col">Linux, Win, macOS, BSD</td>
|
||||
<td>Linux</td>
|
||||
<td>
|
||||
Linux, BSD, macOS
|
||||
<div class="info-wrapper">
|
||||
<button class="info-btn" aria-label="More info">
|
||||
<svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"/></svg>
|
||||
</button>
|
||||
<div class="info-content" hidden>
|
||||
ZFS is available on Linux at the kernel level via <a href="http://zfsonlinux.org/">ZFS on Linux</a>.
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>Linux</td>
|
||||
<td>Windows</td>
|
||||
</tr>
|
||||
|
||||
<!-- Age -->
|
||||
<tr>
|
||||
<td class="feature-cell">Stable Since
|
||||
<div class="cell-subtext">Year of the first official release supporting at least RAID5 redundancy.</div>
|
||||
</td>
|
||||
<td class="snapraid-col">2011</td>
|
||||
<td>2005</td>
|
||||
<td>2005</td>
|
||||
<td class="partial">
|
||||
Unstable
|
||||
<div class="info-wrapper">
|
||||
<button class="info-btn" aria-label="More info">
|
||||
<svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"/></svg>
|
||||
</button>
|
||||
<div class="info-content" hidden>
|
||||
Btrfs has supported RAID5 since 2013, but serious issues in RAID5/6 support were <a href="https://www.phoronix.com/scan.php?page=news_item&px=Btrfs-RAID-56-Is-Bad">identified</a>. As of 2026, these remain unresolved. The official <a href="https://btrfs.readthedocs.io/en/latest/btrfs-man5.html#raid56-status-and-recommended-practices" target="_blank" rel="noopener">wiki</a> states it should not be used in production.
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>2012</td>
|
||||
</tr>
|
||||
|
||||
<!-- Price -->
|
||||
<tr>
|
||||
<td class="feature-cell">License / Price
|
||||
<div class="cell-subtext">Software license and cost.</div>
|
||||
</td>
|
||||
<td class="snapraid-col check">GPL3 / Free</td>
|
||||
<td class="partial">Proprietary / Subscription</td>
|
||||
<td class="check">CDDL / Free</td>
|
||||
<td class="check">GPL2 / Free</td>
|
||||
<td class="partial">Proprietary / Windows</td>
|
||||
</tr>
|
||||
|
||||
<!-- Interface -->
|
||||
<tr>
|
||||
<td class="feature-cell">Interface
|
||||
<div class="cell-subtext">Which interface is provided? GUI or command line?</div>
|
||||
</td>
|
||||
<td class="snapraid-col">CLI / GUI / API</td>
|
||||
<td>GUI / CLI / API</td>
|
||||
<td>
|
||||
CLI / GUI
|
||||
<div class="info-wrapper">
|
||||
<button class="info-btn" aria-label="More info">
|
||||
<svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"/></svg>
|
||||
</button>
|
||||
<div class="info-content" hidden>
|
||||
ZFS supports external GUIs, such as Napp-it, and plugins for TrueNAS/FreeNAS and XigmaNAS.
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
CLI / GUI
|
||||
<div class="info-wrapper">
|
||||
<button class="info-btn" aria-label="More info">
|
||||
<svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z"/></svg>
|
||||
</button>
|
||||
<div class="info-content" hidden>
|
||||
Btrfs supports external GUIs, such as Rockstor.
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>GUI</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Global Popover Element -->
|
||||
<div id="global-popover" class="global-popover">
|
||||
<div class="popover-arrow"></div>
|
||||
<div id="global-popover-content"></div>
|
||||
</div>
|
||||
<div id="popover-overlay" class="popover-overlay"></div>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer>
|
||||
<div class="container footer-content">
|
||||
<div class="footer-col">
|
||||
<h3>SnapRAID</h3>
|
||||
<p>Copyright © 2026 Andrea Mazzoleni</p>
|
||||
<p class="license">Distributed under GPL v3 License</p>
|
||||
</div>
|
||||
<div class="footer-col">
|
||||
<h4>Community</h4>
|
||||
<ul>
|
||||
<li><a href="https://www.reddit.com/r/Snapraid/">Reddit r/snapraid</a></li>
|
||||
<li><a href="https://sourceforge.net/p/snapraid/discussion/1677233/">SourceForge Forum</a></li>
|
||||
<li><a href="https://github.com/amadvance/snapraid/">GitHub</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
BIN
beta/dashboard.png
Normal file
|
After Width: | Height: | Size: 130 KiB |
163
beta/design.html
Normal file
|
|
@ -0,0 +1,163 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="A backup program for disk arrays. It stores parity information of your data and it recovers from up to six disk failures">
|
||||
<meta name="keywords" content="snapraid snapshot raid backup disk array redundancy parity">
|
||||
<title>SnapRAID Design</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
||||
<script src="script.js"></script>
|
||||
|
||||
<!-- Google Analytics 4 -->
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-W1Z5FKHYQ4"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
|
||||
gtag('config', 'G-W1Z5FKHYQ4');
|
||||
</script>
|
||||
|
||||
<!-- Google Universal Analytics -->
|
||||
<script type="text/javascript">
|
||||
|
||||
var _gaq = _gaq || [];
|
||||
_gaq.push(['_setAccount', 'UA-21967501-1']);
|
||||
_gaq.push(['_trackPageview']);
|
||||
|
||||
(function() {
|
||||
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
||||
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
||||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
||||
})();
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="container nav-container">
|
||||
<a href="index.html" class="logo">
|
||||
<img src="favicon-32x32.png"/>
|
||||
SnapRAID
|
||||
</a>
|
||||
<nav>
|
||||
<input type="checkbox" id="menu-toggle">
|
||||
<label for="menu-toggle" class="menu-icon"><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"><path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"/></svg></label>
|
||||
<ul>
|
||||
<li><a href="index" >Home</a></li>
|
||||
<li><a href="ui" >UI & Daemon</a></li>
|
||||
<li><a href="howitworks" >How it Works</a></li>
|
||||
<li><a href="manual" >Manual</a></li>
|
||||
<li><a href="compare" >Compare</a></li>
|
||||
<li><a href="design" class="active">Design</a></li>
|
||||
<li><a href="faq" >FAQ</a></li>
|
||||
<li><a href="support" >Support</a></li>
|
||||
<li><a href="download" class="nav-cta">Download</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
||||
<div class="container" style="padding: 4rem 20px;">
|
||||
<div style="text-align: center; margin-bottom: 4rem;">
|
||||
<h1 style="margin-bottom: 1rem;">Design Philosophy</h1>
|
||||
<blockquote style="font-size: 1.5rem; color: var(--text-accent); font-style: italic; margin: 0; padding: 0; border: none; font-family: serif;">
|
||||
Simplicity is prerequisite for reliability
|
||||
</blockquote>
|
||||
<cite style="display: block; margin-top: 1rem; font-size: 1rem; color: var(--text-secondary); font-style: normal;">
|
||||
<a href="http://en.wikipedia.org/wiki/Edsger_W._Dijkstra" style="color: var(--text-secondary); text-decoration: underline;">Edsger W. Dijkstra</a>
|
||||
</cite>
|
||||
</div>
|
||||
|
||||
<!-- Unix Philosophy & Reliability -->
|
||||
<div style="max-width: 800px; margin: 0 auto 4rem auto;">
|
||||
<p style="font-size: 1.1rem; color: var(--text-secondary); margin-bottom: 1.5rem;">
|
||||
<strong style="color: var(--text-primary);">SnapRAID</strong> was created following the <a href="http://en.wikipedia.org/wiki/Unix_philosophy">Unix philosophy</a>:
|
||||
<em>Write programs that do one thing and do it well</em>.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-3-cols" style="margin-bottom: 4rem;">
|
||||
<!-- Testing/Verification Card -->
|
||||
<div class="card">
|
||||
<h3>Reliability</h3>
|
||||
<p>
|
||||
The first design principle was <strong style="color: var(--text-primary);">reliability</strong>.
|
||||
The result is a simple architecture and an easy to understand implementation.
|
||||
</p>
|
||||
<p>
|
||||
Extensive and automated tests with the runtime checker <a href="http://valgrind.org/">Valgrind</a>
|
||||
and with the <a href="https://github.com/google/sanitizers">Google Sanitizers</a>
|
||||
are done to ensure the correctness of the final application.
|
||||
The test has a <a href="cov/">code coverage of over 90%</a>, measured with <a href="http://ltp.sourceforge.net/coverage/lcov.php">lcov</a>.
|
||||
</p>
|
||||
<p>
|
||||
SnapRAID is also verified with the
|
||||
<a href="https://scan.coverity.com/projects/snapraid">Coverity Scan</a>
|
||||
and <a href="http://clang-analyzer.llvm.org/">clang</a> static analyzers,
|
||||
and with the <a href="http://lcamtuf.coredump.cx/afl/">American Fuzzy Lop</a> fuzzy tester.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Robustness Card -->
|
||||
<div class="card">
|
||||
<h3>Robustness</h3>
|
||||
<p>
|
||||
The second design principle was <strong style="color: var(--text-primary);">robustness</strong>.
|
||||
It supports any kind of problem. Even on kernel panics, power-downs
|
||||
or any other hard failure at runtime, your redundancy data is in safe hands.
|
||||
</p>
|
||||
<p>
|
||||
It uses all the possible storage techniques to ensure to always keep consistent
|
||||
redundancy even after critical interruptions.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Efficiency Card -->
|
||||
<div class="card">
|
||||
<h3>Efficiency</h3>
|
||||
<p>
|
||||
The third design principle was <strong style="color: var(--text-primary);">efficiency</strong>.
|
||||
It's a native C application highly optimized to ensure maximum throughput of your disk array.
|
||||
</p>
|
||||
<p>
|
||||
Integrity checks use the highly efficient <a href="http://code.google.com/p/smhasher/">murmur3</a>
|
||||
and <a href="http://burtleburtle.net/bob/hash/spooky.html">SpookyHash</a> hashes at 128 bits.
|
||||
</p>
|
||||
<p>
|
||||
Redundancy computations use a custom <a href="https://github.com/amadvance/snapraid/tree/master/raid">RAID library</a>
|
||||
(based on Linux Kernel RAID) supporting up to six parity levels.
|
||||
Internal structures use <a href="http://www.tommyds.it/">TommyDS</a>.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer>
|
||||
<div class="container footer-content">
|
||||
<div class="footer-col">
|
||||
<h3>SnapRAID</h3>
|
||||
<p>Copyright © 2026 Andrea Mazzoleni</p>
|
||||
<p class="license">Distributed under GPL v3 License</p>
|
||||
</div>
|
||||
<div class="footer-col">
|
||||
<h4>Community</h4>
|
||||
<ul>
|
||||
<li><a href="https://www.reddit.com/r/Snapraid/">Reddit r/snapraid</a></li>
|
||||
<li><a href="https://sourceforge.net/p/snapraid/discussion/1677233/">SourceForge Forum</a></li>
|
||||
<li><a href="https://github.com/amadvance/snapraid/">GitHub</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
BIN
beta/differences.png
Normal file
|
After Width: | Height: | Size: 86 KiB |
BIN
beta/disks.png
Normal file
|
After Width: | Height: | Size: 119 KiB |
192
beta/download.html
Normal file
|
|
@ -0,0 +1,192 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="A backup program for disk arrays. It stores parity information of your data and it recovers from up to six disk failures">
|
||||
<meta name="keywords" content="snapraid snapshot raid backup disk array redundancy parity">
|
||||
<title>Download SnapRAID</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
||||
<script src="script.js"></script>
|
||||
|
||||
<!-- Google Analytics 4 -->
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-W1Z5FKHYQ4"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
|
||||
gtag('config', 'G-W1Z5FKHYQ4');
|
||||
</script>
|
||||
|
||||
<!-- Google Universal Analytics -->
|
||||
<script type="text/javascript">
|
||||
|
||||
var _gaq = _gaq || [];
|
||||
_gaq.push(['_setAccount', 'UA-21967501-1']);
|
||||
_gaq.push(['_trackPageview']);
|
||||
|
||||
(function() {
|
||||
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
||||
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
||||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
||||
})();
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="container nav-container">
|
||||
<a href="index.html" class="logo">
|
||||
<img src="favicon-32x32.png"/>
|
||||
SnapRAID
|
||||
</a>
|
||||
<nav>
|
||||
<input type="checkbox" id="menu-toggle">
|
||||
<label for="menu-toggle" class="menu-icon"><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"><path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"/></svg></label>
|
||||
<ul>
|
||||
<li><a href="index" >Home</a></li>
|
||||
<li><a href="ui" >UI & Daemon</a></li>
|
||||
<li><a href="howitworks" >How it Works</a></li>
|
||||
<li><a href="manual" >Manual</a></li>
|
||||
<li><a href="compare" >Compare</a></li>
|
||||
<li><a href="design" >Design</a></li>
|
||||
<li><a href="faq" >FAQ</a></li>
|
||||
<li><a href="support" >Support</a></li>
|
||||
<li><a href="download" class="nav-cta">Download</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
||||
<div class="container" style="padding: 4rem 20px;">
|
||||
<h1 style="text-align: center;">Download SnapRAID</h1>
|
||||
|
||||
<div style="text-align: center; max-width: 700px; margin: 0 auto 3rem auto;">
|
||||
<p style="margin-bottom: 1rem; font-size: 1.2rem;">
|
||||
The latest stable release is <strong>v12.4</strong> (Released January 2026).
|
||||
</p>
|
||||
<p style="margin-bottom: 1rem; color: var(--text-secondary);">
|
||||
See the <a href="https://github.com/amadvance/snapraid/blob/master/HISTORY">ChangeLog</a> for the detailed list of changes,
|
||||
and <a href="https://github.com/amadvance/snapraid/blob/master/CHECKSUMS">CheckSums</a> for the SHA256 checksums.
|
||||
</p>
|
||||
<p style="color: var(--text-secondary);">
|
||||
<strong style="color: var(--text-primary);">SnapRAID</strong> is a <a href="http://en.wikipedia.org/wiki/Free_Software">Free Software</a>
|
||||
application released with the <a href="http://www.gnu.org/licenses/quick-guide-gplv3.html">GPLv3 license</a>.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-2-cols">
|
||||
<!-- Core Binaries -->
|
||||
<div>
|
||||
<h2>SnapRAID CLI</h2>
|
||||
<p>The classic command line tool.</p>
|
||||
<table class="data-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Platform</th>
|
||||
<th>Version</th>
|
||||
<th>Download</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Windows (64-bit)</td>
|
||||
<td>12.4</td>
|
||||
<td><a href="#">snapraid-12.4-windows-x64.zip</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Linux (x86_64)</td>
|
||||
<td>12.4</td>
|
||||
<td><a href="#">snapraid-12.4-linux.tar.gz</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Source Code</td>
|
||||
<td>12.4</td>
|
||||
<td><a href="#">snapraid-12.4.tar.gz</a></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p style="font-size: 0.85rem; color: var(--text-secondary);">
|
||||
Old versions are available on <a href="https://github.com/amadvance/snapraid/releases">GitHub</a>.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Daemon -->
|
||||
<div>
|
||||
<h2>SnapRAID Daemon</h2>
|
||||
<p>Includes background service and Web UI.</p>
|
||||
<table class="data-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Platform</th>
|
||||
<th>Version</th>
|
||||
<th>Download</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Linux (Deb/Ubuntu)</td>
|
||||
<td>2.0</td>
|
||||
<td><a href="#">snapraid-daemon-2.0.deb</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Docker Compose</td>
|
||||
<td>2.0</td>
|
||||
<td><a href="#">docker-compose.yml</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Source Code</td>
|
||||
<td>2.0</td>
|
||||
<td><a href="#">daemon-src-2.0.tar.gz</a></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<p style="font-size: 1.0rem; color: var(--text-secondary);">
|
||||
Requires SnapRAID CLI v14+ installed.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Donation Card -->
|
||||
<div class="card donation-card" style="margin-top: 4rem; text-align: center;">
|
||||
<h3 style="margin-bottom: 1rem;">Support the Project</h3>
|
||||
<p style="color: var(--text-primary); font-size: 1.1rem; margin-bottom: 0.5rem;">
|
||||
If you want to show your appreciation,
|
||||
you can <a href="http://sourceforge.net/p/snapraid/donate/"><strong>donate</strong></a>,
|
||||
or you can <a href="https://github.com/amadvance/snapraid/"><strong>star it on GitHub</strong></a>.
|
||||
</p>
|
||||
<p style="color: var(--text-secondary);">
|
||||
Donations are used to support SnapRAID development, covering costs such as new hardware, internet services, and AI subscriptions
|
||||
</p>
|
||||
<a href="http://sourceforge.net/p/snapraid/donate/" class="btn btn-primary" style="background: var(--warning); color: black; box-shadow: none; margin-top: 1.5rem;">Donate via PayPal</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer>
|
||||
<div class="container footer-content">
|
||||
<div class="footer-col">
|
||||
<h3>SnapRAID</h3>
|
||||
<p>Copyright © 2026 Andrea Mazzoleni</p>
|
||||
<p class="license">Distributed under GPL v3 License</p>
|
||||
</div>
|
||||
<div class="footer-col">
|
||||
<h4>Community</h4>
|
||||
<ul>
|
||||
<li><a href="https://www.reddit.com/r/Snapraid/">Reddit r/snapraid</a></li>
|
||||
<li><a href="https://sourceforge.net/p/snapraid/discussion/1677233/">SourceForge Forum</a></li>
|
||||
<li><a href="https://github.com/amadvance/snapraid/">GitHub</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
1961
beta/faq.html
Normal file
BIN
beta/favicon-16x16.png
Normal file
|
After Width: | Height: | Size: 926 B |
BIN
beta/favicon-32x32.png
Normal file
|
After Width: | Height: | Size: 2.4 KiB |
BIN
beta/favicon.ico
Normal file
|
After Width: | Height: | Size: 15 KiB |
295
beta/howitworks.html
Normal file
|
|
@ -0,0 +1,295 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="A backup program for disk arrays. It stores parity information of your data and it recovers from up to six disk failures">
|
||||
<meta name="keywords" content="snapraid snapshot raid backup disk array redundancy parity">
|
||||
<title>How SnapRAID Works</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
||||
<script src="script.js"></script>
|
||||
|
||||
<!-- Google Analytics 4 -->
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-W1Z5FKHYQ4"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
|
||||
gtag('config', 'G-W1Z5FKHYQ4');
|
||||
</script>
|
||||
|
||||
<!-- Google Universal Analytics -->
|
||||
<script type="text/javascript">
|
||||
|
||||
var _gaq = _gaq || [];
|
||||
_gaq.push(['_setAccount', 'UA-21967501-1']);
|
||||
_gaq.push(['_trackPageview']);
|
||||
|
||||
(function() {
|
||||
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
||||
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
||||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
||||
})();
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="container nav-container">
|
||||
<a href="index.html" class="logo">
|
||||
<img src="favicon-32x32.png"/>
|
||||
SnapRAID
|
||||
</a>
|
||||
<nav>
|
||||
<input type="checkbox" id="menu-toggle">
|
||||
<label for="menu-toggle" class="menu-icon"><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"><path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"/></svg></label>
|
||||
<ul>
|
||||
<li><a href="index" >Home</a></li>
|
||||
<li><a href="ui" >UI & Daemon</a></li>
|
||||
<li><a href="howitworks" class="active">How it Works</a></li>
|
||||
<li><a href="manual" >Manual</a></li>
|
||||
<li><a href="compare" >Compare</a></li>
|
||||
<li><a href="design" >Design</a></li>
|
||||
<li><a href="faq" >FAQ</a></li>
|
||||
<li><a href="support" >Support</a></li>
|
||||
<li><a href="download" class="nav-cta">Download</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
||||
<div class="container" style="padding: 4rem 20px;">
|
||||
<h1 style="text-align: center; margin-bottom: 4rem;">How SnapRAID Works</h1>
|
||||
|
||||
<!-- Understanding Parity Section -->
|
||||
<div style="margin-bottom: 5rem;">
|
||||
<h2 class="section-title">Understanding Data Parity</h2>
|
||||
<div style="max-width: 800px; margin: 0 auto 3rem auto; text-align: center;">
|
||||
<p style="font-size: 1.1rem; color: var(--text-primary);">
|
||||
Parity is a mathematical "summary" of data that allows for the reconstruction of lost information without requiring a full 1:1 copy of every file.
|
||||
</p>
|
||||
<p style="font-size: 1rem; color: var(--text-secondary);">
|
||||
Traditional mirroring (copying) requires 100% extra space. Parity allows for protection using significantly less overhead by storing a mathematical relationship between files instead.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-2-cols" style="align-items: stretch;">
|
||||
<!-- Basic Logic -->
|
||||
<div class="card">
|
||||
<h3 style="color: var(--text-accent);">The Basic Logic</h3>
|
||||
<p class="card-subtitle">"Filling in the Blanks"</p>
|
||||
<p>Imagine three boxes: two for data (numbers) and one for Parity (the sum of the first two).</p>
|
||||
|
||||
<div style="background: rgba(0,0,0,0.3); padding: 1rem; border-radius: var(--radius); margin: 1.5rem 0; font-family: var(--font-mono); text-align: center;">
|
||||
<div style="display: flex; justify-content: center; gap: 1rem; align-items: center;">
|
||||
<div style="text-align: center;">
|
||||
<div style="color: var(--text-secondary); font-size: 0.8rem;">Disk 1</div>
|
||||
<div style="font-size: 1.5rem; font-weight: bold;">10</div>
|
||||
</div>
|
||||
<div style="color: var(--text-secondary);">+</div>
|
||||
<div style="text-align: center;">
|
||||
<div style="color: var(--text-secondary); font-size: 0.8rem;">Disk 2</div>
|
||||
<div style="font-size: 1.5rem; font-weight: bold;">15</div>
|
||||
</div>
|
||||
<div style="color: var(--text-secondary);">=</div>
|
||||
<div style="text-align: center;">
|
||||
<div style="color: var(--text-accent); font-size: 0.8rem;">Parity</div>
|
||||
<div style="font-size: 1.5rem; font-weight: bold; color: var(--text-accent);">25</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>
|
||||
If <strong>Disk 1</strong> is destroyed, the system solves the remaining equation:
|
||||
<code style="background: rgba(255,255,255,0.1); padding: 2px 5px; border-radius: 4px;">[?] + 15 = 25</code>.
|
||||
The system identifies the missing value (10) and restores it to a new disk.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Single Parity -->
|
||||
<div class="card">
|
||||
<h3 style="color: var(--text-accent);">Single Parity</h3>
|
||||
<p class="card-subtitle">RAID 5 Logic</p>
|
||||
<p>
|
||||
The most common form of protection, allowing an array to survive the loss of any <strong>single</strong> disk.
|
||||
</p>
|
||||
<p>
|
||||
<strong>Mechanism:</strong> It uses the <strong>XOR</strong> (Exclusive OR) operation. XOR compares bits across multiple disks to create a "map" that can reverse-engineer any single missing piece of the puzzle.
|
||||
</p>
|
||||
<div style="border-left: 3px solid var(--warning); padding-left: 1rem; margin-top: 1.5rem;">
|
||||
<p style="margin-bottom: 0; font-size: 0.9rem;">
|
||||
<strong>Limitation:</strong> Single parity can only solve for one unknown variable. If two disks fail simultaneously, the mathematical equation becomes unsolvable (e.g., <code style="font-size: 0.85rem;">X + Y = 25</code> has too many possibilities).
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-2-cols" style="margin-top: 2rem;">
|
||||
<!-- Multiple Parity -->
|
||||
<div class="card">
|
||||
<h3>Multiple Parity Levels</h3>
|
||||
<p>Used to survive multiple simultaneous disk failures by employing more complex mathematical formulas.</p>
|
||||
|
||||
<ul style="list-style: none; padding: 0; margin-top: 1.5rem;">
|
||||
<li style="margin-bottom: 1.5rem;">
|
||||
<strong style="color: var(--text-primary); display: block; margin-bottom: 0.25rem;">Dual Parity (RAID 6)</strong>
|
||||
<p style="font-size: 0.95rem; margin-bottom: 0.5rem;">Survives <strong>2</strong> simultaneous failures.</p>
|
||||
<p style="font-size: 0.85rem; color: var(--text-secondary);">Requires two separate equations: an addition-based sum (XOR) and a polynomial-based formula (Reed-Solomon) where disks are treated as coordinates on a geometric curve.</p>
|
||||
</li>
|
||||
<li>
|
||||
<strong style="color: var(--text-primary); display: block; margin-bottom: 0.25rem;">Triple to Hexa Parity</strong>
|
||||
<p style="font-size: 0.95rem; margin-bottom: 0.5rem;">Survives <strong>3 to 6</strong> failures.</p>
|
||||
<p style="font-size: 0.85rem; color: var(--text-secondary);">Essential for large arrays (20+ disks) where the statistical risk of multiple failures during a rebuild is higher.</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Constraints & Summary -->
|
||||
<div style="display: flex; flex-direction: column; gap: 2rem;">
|
||||
<div class="card" style="border-color: var(--warning); background: rgba(245, 158, 11, 0.05);">
|
||||
<h3 style="color: var(--warning);">The "Largest Disk" Rule</h3>
|
||||
<p>
|
||||
The Parity Disk must be <strong>at least as large</strong> as the largest Data Disk in the array.
|
||||
</p>
|
||||
<p style="margin-bottom: 0;">
|
||||
<strong>Reason:</strong> Parity is calculated on a "sector-by-sector" basis. To protect the 1,000th gigabyte of a data drive, the parity drive must have a 1,000th gigabyte available to store that specific calculation. Without that space, the data is left unprotected.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- The Role of Integrity Checksums Section -->
|
||||
<div style="margin-top: 5rem; margin-bottom: 5rem;">
|
||||
<h2 class="section-title">The Role of Integrity Checksums in Data Repair</h2>
|
||||
|
||||
<!-- Introduction: The Silent Error Problem -->
|
||||
<div style="max-width: 800px; margin: 0 auto 3rem auto; text-align: center;">
|
||||
<h3 style="color: var(--text-accent); margin-bottom: 1rem;">The "Silent Error" Problem</h3>
|
||||
<p style="font-size: 1.1rem; color: var(--text-primary);">
|
||||
Physical disk failure is obvious: the drive disappears. However, "Silent Corruption" (bit-rot) is invisible.
|
||||
A single bit flips from a 0 to a 1, but the disk still appears "healthy" to the computer.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-2-cols" style="align-items: stretch;">
|
||||
|
||||
<!-- Why Parity Alone Fails -->
|
||||
<div class="card">
|
||||
<h3 style="color: var(--danger);">Why Parity Alone is Not Enough</h3>
|
||||
<p class="card-subtitle">"Parity can fix a hole, but it cannot find a lie."</p>
|
||||
|
||||
<p>Recall our simple math: <code>Disk A (5) + Disk B (3) = Parity (8)</code>.</p>
|
||||
|
||||
<div style="background: rgba(239, 68, 68, 0.1); padding: 1.5rem; border-radius: var(--radius); margin: 1.5rem 0; border: 1px solid var(--danger);">
|
||||
<p style="margin-bottom: 0.5rem; font-weight: bold; color: var(--danger);">Scenario: Bit-Rot on Disk A</p>
|
||||
<div style="font-family: var(--font-mono); font-size: 0.95rem;">
|
||||
<div>Original: 5 + 3 = 8 <span style="color: var(--success);">✓</span></div>
|
||||
<div style="margin-top: 0.5rem;">Rotten: <span style="text-decoration: underline; font-weight: bold;">9</span> + 3 = 12 <span style="color: var(--danger);">✗</span></div>
|
||||
<div style="margin-top: 0.5rem; color: var(--text-secondary); border-top: 1px dashed var(--danger); padding-top: 0.5rem;">
|
||||
Mismatch! 12 ≠ 8 (Parity)
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>The system sees a mismatch, but faces a dilemma:</p>
|
||||
<ul style="list-style: none; padding-left: 0; margin-bottom: 1.5rem;">
|
||||
<li style="margin-bottom: 0.5rem; display: flex; gap: 0.5rem;">
|
||||
<span style="color: var(--warning);">?</span> Is Disk A wrong (the 9)?
|
||||
</li>
|
||||
<li style="margin-bottom: 0.5rem; display: flex; gap: 0.5rem;">
|
||||
<span style="color: var(--warning);">?</span> Is Disk B wrong (the 3)?
|
||||
</li>
|
||||
<li style="margin-bottom: 0.5rem; display: flex; gap: 0.5rem;">
|
||||
<span style="color: var(--warning);">?</span> Or is the Parity disk itself wrong (the 8)?
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<p style="font-size: 0.95rem; font-style: italic; color: var(--text-secondary);">
|
||||
Without knowing the culprit, parity is useless. If you try to "fix" the array blindly, you might overwrite good data with bad data.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- The Solution: Integrity Checksums -->
|
||||
<div class="card" style="border-color: var(--success);">
|
||||
<h3 style="color: var(--success);">The Solution: Integrity Checksums</h3>
|
||||
<p class="card-subtitle">"Digital Fingerprints"</p>
|
||||
|
||||
<p>A checksum is a mathematical fingerprint for a specific file or block of data.</p>
|
||||
|
||||
<div style="margin: 1.5rem 0;">
|
||||
<h4 style="font-size: 1rem; color: var(--text-primary); margin-bottom: 1rem;">The Repair Workflow</h4>
|
||||
|
||||
<div style="display: flex; flex-direction: column; gap: 1rem;">
|
||||
<!-- Step 1 -->
|
||||
<div style="display: flex; align-items: center; gap: 1rem; padding: 0.75rem; background: rgba(255,255,255,0.03); border-radius: var(--radius);">
|
||||
<div style="min-width: 24px; height: 24px; background: var(--danger); color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.8rem; font-weight: bold;">1</div>
|
||||
<div>
|
||||
<div style="font-weight: bold; color: var(--text-primary);">Check Fingerprint A</div>
|
||||
<div style="font-size: 0.9rem; color: var(--danger);">"Does not match." (Culprit Found!)</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Step 2 -->
|
||||
<div style="display: flex; align-items: center; gap: 1rem; padding: 0.75rem; background: rgba(255,255,255,0.03); border-radius: var(--radius);">
|
||||
<div style="min-width: 24px; height: 24px; background: var(--success); color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.8rem; font-weight: bold;">2</div>
|
||||
<div>
|
||||
<div style="font-weight: bold; color: var(--text-primary);">Check Fingerprint B</div>
|
||||
<div style="font-size: 0.9rem; color: var(--success);">"Matches." (Data is safe.)</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Step 3 -->
|
||||
<div style="display: flex; align-items: center; gap: 1rem; padding: 0.75rem; background: rgba(255,255,255,0.03); border-radius: var(--radius);">
|
||||
<div style="min-width: 24px; height: 24px; background: var(--success); color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.8rem; font-weight: bold;">3</div>
|
||||
<div>
|
||||
<div style="font-weight: bold; color: var(--text-primary);">Check Parity</div>
|
||||
<div style="font-size: 0.9rem; color: var(--success);">"Matches." (Parity is safe.)</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p style="margin-top: 1.5rem;">
|
||||
<strong>Result:</strong> We know with 100% certainty that <strong>Disk A</strong> is the liar. We can now safely use the math (<code>Parity 8 - Disk B 3</code>) to recalculate the original <strong>5</strong> and repair the corruption.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Final Thought Banner -->
|
||||
<div style="margin-top: 3rem; background: linear-gradient(90deg, rgba(59, 130, 246, 0.1) 0%, rgba(16, 185, 129, 0.1) 100%); padding: 2rem; border-radius: var(--radius); text-align: center; border: 1px solid rgba(255,255,255,0.1);">
|
||||
<p style="font-size: 1.25rem; color: var(--text-primary); margin: 0; font-weight: 500;">
|
||||
"Integrity checksums provide the <strong>Identity</strong> of the error, while Parity provides the <strong>Medicine</strong>. You need both to perform a successful surgery on your data."
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer>
|
||||
<div class="container footer-content">
|
||||
<div class="footer-col">
|
||||
<h3>SnapRAID</h3>
|
||||
<p>Copyright © 2026 Andrea Mazzoleni</p>
|
||||
<p class="license">Distributed under GPL v3 License</p>
|
||||
</div>
|
||||
<div class="footer-col">
|
||||
<h4>Community</h4>
|
||||
<ul>
|
||||
<li><a href="https://www.reddit.com/r/Snapraid/">Reddit r/snapraid</a></li>
|
||||
<li><a href="https://sourceforge.net/p/snapraid/discussion/1677233/">SourceForge Forum</a></li>
|
||||
<li><a href="https://github.com/amadvance/snapraid/">GitHub</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
333
beta/index.html
Normal file
|
|
@ -0,0 +1,333 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="A backup program for disk arrays. It stores parity information of your data and it recovers from up to six disk failures">
|
||||
<meta name="keywords" content="snapraid snapshot raid backup disk array redundancy parity">
|
||||
<title>SnapRAID</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
||||
<script src="script.js"></script>
|
||||
|
||||
<!-- Google Analytics 4 -->
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-W1Z5FKHYQ4"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
|
||||
gtag('config', 'G-W1Z5FKHYQ4');
|
||||
</script>
|
||||
|
||||
<!-- Google Universal Analytics -->
|
||||
<script type="text/javascript">
|
||||
|
||||
var _gaq = _gaq || [];
|
||||
_gaq.push(['_setAccount', 'UA-21967501-1']);
|
||||
_gaq.push(['_trackPageview']);
|
||||
|
||||
(function() {
|
||||
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
||||
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
||||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
||||
})();
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="container nav-container">
|
||||
<a href="index.html" class="logo">
|
||||
<img src="favicon-32x32.png"/>
|
||||
SnapRAID
|
||||
</a>
|
||||
<nav>
|
||||
<input type="checkbox" id="menu-toggle">
|
||||
<label for="menu-toggle" class="menu-icon"><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"><path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"/></svg></label>
|
||||
<ul>
|
||||
<li><a href="index" class="active">Home</a></li>
|
||||
<li><a href="ui" >UI & Daemon</a></li>
|
||||
<li><a href="howitworks" >How it Works</a></li>
|
||||
<li><a href="manual" >Manual</a></li>
|
||||
<li><a href="compare" >Compare</a></li>
|
||||
<li><a href="design" >Design</a></li>
|
||||
<li><a href="faq" >FAQ</a></li>
|
||||
<li><a href="support" >Support</a></li>
|
||||
<li><a href="download" class="nav-cta">Download</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="hero-section">
|
||||
<div class="container hero-content">
|
||||
<h1>Intelligent Redundancy<br>for Your Disk Array</h1>
|
||||
<p class="hero-subtext">
|
||||
SnapRAID combines the safety of RAID with the with the convenience of backups.
|
||||
Now with real-time health monitoring and automation via the new <strong>SnapRAID Daemon</strong>.
|
||||
</p>
|
||||
<div class="hero-actions">
|
||||
<a href="download.html" class="btn btn-primary">
|
||||
<svg viewBox="0 0 24 24" width="20" height="20" fill="currentColor"><path d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"/></svg>
|
||||
Download
|
||||
</a>
|
||||
<a href="ui.html" class="btn btn-secondary">Explore the UI</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- What is SnapRAID? Section -->
|
||||
<section class="daemon-section">
|
||||
<div class="container">
|
||||
<div class="grid grid-2-cols daemon-layout">
|
||||
<div class="daemon-text">
|
||||
<h2>What is SnapRAID?</h2>
|
||||
<p style="font-size: 1.1rem; color: var(--text-secondary);">
|
||||
SnapRAID is a powerful backup and redundancy program designed for disk arrays. It stores parity information (a special type of mathematical backup) that allows you to fully recover all your data even if you experience up to six simultaneous disk failures.
|
||||
</p>
|
||||
<p style="font-size: 1.1rem; color: var(--text-secondary);">
|
||||
It is primarily intended for home media centers and large storage arrays containing files that don't change frequently (like movies, music, and photo archives). It offers the high-end protection of a professional server but with the simplicity and flexibility of a home computer.
|
||||
</p>
|
||||
</div>
|
||||
<!-- Terminal Mockup -->
|
||||
<div class="terminal-mockup">
|
||||
<div class="terminal-header">
|
||||
<div class="dot red"></div>
|
||||
<div class="dot yellow"></div>
|
||||
<div class="dot green"></div>
|
||||
</div>
|
||||
<div class="terminal-body" style="font-size: 0.95rem; line-height: 1.6;">
|
||||
<div class="term-line">Loading state from /db/snapraid.content...</div>
|
||||
<div class="term-line info">Scanning...</div>
|
||||
<div class="term-line">Initializing...</div>
|
||||
<div class="term-line">Resizing...</div>
|
||||
<div class="term-line success">Syncing...</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<!-- Why Choose SnapRAID (New Section) -->
|
||||
<section style="padding: 5rem 0; border-bottom: 1px solid var(--border-color); background: var(--bg-body);">
|
||||
<div class="container">
|
||||
<h2 class="section-title">Why Choose SnapRAID?</h2>
|
||||
<p style="text-align: center; max-width: 800px; margin: 0 auto 4rem auto; font-size: 1.1rem; color: var(--text-secondary);">
|
||||
SnapRAID provides a unique approach to data protection that prioritizes safety, flexibility, and energy efficiency.
|
||||
It is designed to sit on top of your files as a safety net, ensuring your data is protected without requiring complex
|
||||
changes to your hardware or operating system.
|
||||
</p>
|
||||
|
||||
<div class="grid grid-2-cols" style="align-items: start;">
|
||||
<!-- Column 1: Safety Net Philosophy -->
|
||||
<div>
|
||||
<h3 style="color: var(--text-accent); margin-bottom: 1.5rem;">The "Safety Net" Philosophy</h3>
|
||||
<p>SnapRAID acts as a transparent layer of security that protects your data without ever
|
||||
taking it hostage. It treats your array as a collection of individual assets, providing a
|
||||
safety net that is both powerful and precise.</p>
|
||||
|
||||
<ul class="feature-list" style="margin-top: 2rem;">
|
||||
<li style="display: flex; gap: 1rem; align-items: start; margin-bottom: 1.5rem;">
|
||||
<div style="min-width: 24px; height: 24px; background: rgba(59, 130, 246, 0.1); border-radius: 50%; display: flex; align-items: center; justify-content: center;">
|
||||
<svg style="width: 14px; height: 14px; fill: var(--primary);" viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>
|
||||
</div>
|
||||
<div>
|
||||
<strong style="color: var(--text-primary);">Disaster-Proof Recovery</strong>
|
||||
<p style="margin: 0.25rem 0 0 0; font-size: 0.95rem;">The primary goal is total data reconstruction. Should a hard drive fail, SnapRAID uses its parity data to rebuild the entire contents of the lost disk onto a new one. Because it can handle up to six simultaneous failures, it provides a level of resilience that scales with your needs, ensuring that a hardware crash doesn't mean a data catastrophe.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li style="display: flex; gap: 1rem; align-items: start; margin-bottom: 1.5rem;">
|
||||
<div style="min-width: 24px; height: 24px; background: rgba(59, 130, 246, 0.1); border-radius: 50%; display: flex; align-items: center; justify-content: center;">
|
||||
<svg style="width: 14px; height: 14px; fill: var(--primary);" viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>
|
||||
</div>
|
||||
<div>
|
||||
<strong style="color: var(--text-primary);">Defense Against the Invisible</strong>
|
||||
<p style="margin: 0.25rem 0 0 0; font-size: 0.95rem;">Physical disk failure isn't the only threat; "bit-rot" or silent errors can corrupt files without warning. SnapRAID proactively defends your archive by hashing every file. It doesn't just wait for a disk to die; it constantly verifies that your data is exactly as you left it, identifying and repairing invisible corruption before it can spread.</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Column 2: Maximum Freedom -->
|
||||
<div>
|
||||
<h3 style="color: var(--text-accent); margin-bottom: 1.5rem;">Maximum Freedom, Minimum Risk</h3>
|
||||
<p>SnapRAID is designed for the "real world" of home hardware. Most users don't buy ten identical 20TB drives at once.</p>
|
||||
|
||||
<ul class="feature-list" style="margin-top: 2rem;">
|
||||
<li style="display: flex; gap: 1rem; align-items: start; margin-bottom: 1.5rem;">
|
||||
<div style="min-width: 24px; height: 24px; background: rgba(59, 130, 246, 0.1); border-radius: 50%; display: flex; align-items: center; justify-content: center;">
|
||||
<svg style="width: 14px; height: 14px; fill: var(--primary);" viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>
|
||||
</div>
|
||||
<div>
|
||||
<strong style="color: var(--text-primary);">Grow as you go</strong>
|
||||
<p style="margin: 0.25rem 0 0 0; font-size: 0.95rem;">You can mix a 4TB drive with a 12TB drive and add a new one whenever you find a sale.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li style="display: flex; gap: 1rem; align-items: start; margin-bottom: 1.5rem;">
|
||||
<div style="min-width: 24px; height: 24px; background: rgba(59, 130, 246, 0.1); border-radius: 50%; display: flex; align-items: center; justify-content: center;">
|
||||
<svg style="width: 14px; height: 14px; fill: var(--primary);" viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>
|
||||
</div>
|
||||
<div>
|
||||
<strong style="color: var(--text-primary);">No Reformatting</strong>
|
||||
<p style="margin: 0.25rem 0 0 0; font-size: 0.95rem;">You can start protecting disks that are already full of your movies and photos without moving them.</p>
|
||||
</div>
|
||||
</li>
|
||||
<li style="display: flex; gap: 1rem; align-items: start;">
|
||||
<div style="min-width: 24px; height: 24px; background: rgba(59, 130, 246, 0.1); border-radius: 50%; display: flex; align-items: center; justify-content: center;">
|
||||
<svg style="width: 14px; height: 14px; fill: var(--primary);" viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>
|
||||
</div>
|
||||
<div>
|
||||
<strong style="color: var(--text-primary);">Zero Lock-in</strong>
|
||||
<p style="margin: 0.25rem 0 0 0; font-size: 0.95rem;">Your data is never trapped. If you decide to stop using SnapRAID, your disks remain standard drives that can be read by any computer.</p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
|
||||
<!-- Daemon Spotlight Section -->
|
||||
<section class="daemon-section">
|
||||
<div class="container">
|
||||
<div class="grid grid-2-cols daemon-layout">
|
||||
<div class="daemon-text">
|
||||
<h3 class="accent-text">INTRODUCING THE DAEMON</h3>
|
||||
<h2>Real-Time Monitoring & Web API</h2>
|
||||
<p>
|
||||
The new SnapRAID Daemon bridges the gap between raw parity and proactive protection.
|
||||
Move from a manual terminal workflow to an "always-on" background intelligence.
|
||||
</p>
|
||||
<ul class="feature-list">
|
||||
<li>
|
||||
<svg class="icon-check" viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>
|
||||
Background scrubbing and health checks
|
||||
</li>
|
||||
<li>
|
||||
<svg class="icon-check" viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>
|
||||
Modern Web UI for dashboard and tasks
|
||||
</li>
|
||||
<li>
|
||||
<svg class="icon-check" viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>
|
||||
REST API for 3rd party integration
|
||||
</li>
|
||||
</ul>
|
||||
<a href="ui.html" class="link-arrow">See Daemon Features →</a>
|
||||
</div>
|
||||
<!-- Visual Representation of Daemon Dashboard -->
|
||||
<div style="border-radius: var(--radius); overflow: hidden; border: 1px solid var(--border-color); box-shadow: 0 0 30px rgba(59, 130, 246, 0.1);">
|
||||
<img src="dashboard.png" alt="SnapRAID Daemon Dashboard" style="width: 100%; height: auto; display: block;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Feature Spotlight Section -->
|
||||
<section class="features-section">
|
||||
<div class="container">
|
||||
<h2 class="section-title">Feature Spotlight</h2>
|
||||
|
||||
<!-- Resilient Recovery -->
|
||||
<div style="margin-bottom: 3rem;">
|
||||
<h3 style="margin-bottom: 1.5rem; color: var(--text-accent); border-left: 3px solid var(--primary); padding-left: 1rem;">Resilient Recovery</h3>
|
||||
<div class="grid grid-2-cols">
|
||||
<!-- Card 0: Surgical Recovery -->
|
||||
<div class="card">
|
||||
<h3>Full Recovery</h3>
|
||||
<p class="card-subtitle">Total data reconstruction</p>
|
||||
<p>If your hard disks die, SnapRAID can fully recover all the data from the failed drives, up to the number of parity disks you have assigned (protecting you from up to 6 simultaneous failures).</p>
|
||||
</div>
|
||||
<!-- Card 3: Silent Corruption Protection -->
|
||||
<div class="card">
|
||||
<h3>Silent Corruption Protection</h3>
|
||||
<p class="card-subtitle">Total data integrity</p>
|
||||
<p>All your data is hashed to ensure integrity and prevent "bit-rot." If a file suffers from silent corruption, SnapRAID detects it and repairs it using your parity information.</p>
|
||||
</div>
|
||||
<!-- Card 1: Surgical Recovery -->
|
||||
<div class="card">
|
||||
<h3>Surgical Recovery</h3>
|
||||
<p class="card-subtitle">Undelete and restore</p>
|
||||
<p>If you accidentally delete files on a disk, recovery is possible. SnapRAID can reconstruct missing data and even undelete specific folders without affecting the rest of the array.</p>
|
||||
</div>
|
||||
<!-- Card 2: Fault Isolation -->
|
||||
<div class="card">
|
||||
<h3>Fault Isolation</h3>
|
||||
<p class="card-subtitle">Confined data loss</p>
|
||||
<p>When the number of failed disks exceeds the parity count, data loss is confined only to the affected disks. Data on all other healthy disks remains fully accessible and untouched.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Hardware Freedom -->
|
||||
<div style="margin-bottom: 3rem;">
|
||||
<h3 style="margin-bottom: 1.5rem; color: var(--text-accent); border-left: 3px solid var(--primary); padding-left: 1rem;">Hardware Freedom</h3>
|
||||
<div class="grid grid-2-cols">
|
||||
<!-- Card 1: Maximum Flexibility -->
|
||||
<div class="card">
|
||||
<h3>Maximum Flexibility</h3>
|
||||
<p class="card-subtitle">Mix, match, and grow</p>
|
||||
<p>Disks can have different sizes and different brands. You can add new disks to the array at any time as your storage needs grow, without the need for complex migrations.</p>
|
||||
</div>
|
||||
<!-- Card 2: Eco-Friendly Efficiency -->
|
||||
<div class="card">
|
||||
<h3>Eco-Friendly Efficiency</h3>
|
||||
<p class="card-subtitle">Power-saving by design</p>
|
||||
<p>To access a file, only a single disk needs to spin. This reduces noise, saves power, and extends the lifespan of your hardware compared to traditional RAID systems that spin every disk for every read.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Data Sovereignty -->
|
||||
<div>
|
||||
<h3 style="margin-bottom: 1.5rem; color: var(--text-accent); border-left: 3px solid var(--primary); padding-left: 1rem;">Data Sovereignty</h3>
|
||||
<div class="grid grid-2-cols">
|
||||
<!-- Card 1: Non-Locking Integration -->
|
||||
<div class="card">
|
||||
<h3>Non-Locking Integration</h3>
|
||||
<p class="card-subtitle">Access your data, your way</p>
|
||||
<p>You can utilize disks already filled with files without the need to reformat them. Access your files as usual, even without the program running. SnapRAID doesn't lock in your data; you can stop using it anytime without moving a single byte.</p>
|
||||
</div>
|
||||
<!-- Card 2: Open Source & Free -->
|
||||
<div class="card" style="border-color: var(--text-accent);">
|
||||
<h3>Open Source & Free</h3>
|
||||
<p class="card-subtitle">Transparent, Community-Driven, and Cost-Free</p>
|
||||
<p>SnapRAID is released under the GPLv3 license, ensuring the code remains open for inspection and improvement. There are no licensing fees, no subscriptions, and no hidden "Pro" tiers. You have full ownership of your data protection engine.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer>
|
||||
<div class="container footer-content">
|
||||
<div class="footer-col">
|
||||
<h3>SnapRAID</h3>
|
||||
<p>Copyright © 2026 Andrea Mazzoleni</p>
|
||||
<p class="license">Distributed under GPL v3 License</p>
|
||||
</div>
|
||||
<div class="footer-col">
|
||||
<h4>Community</h4>
|
||||
<ul>
|
||||
<li><a href="https://www.reddit.com/r/Snapraid/">Reddit r/snapraid</a></li>
|
||||
<li><a href="https://sourceforge.net/p/snapraid/discussion/1677233/">SourceForge Forum</a></li>
|
||||
<li><a href="https://github.com/amadvance/snapraid/">GitHub</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
2107
beta/manual-de.html
Normal file
2053
beta/manual-es.html
Normal file
2106
beta/manual-fr.html
Normal file
2084
beta/manual-it.html
Normal file
1915
beta/manual-ja.html
Normal file
1973
beta/manual-ko.html
Normal file
1966
beta/manual-pl.html
Normal file
2016
beta/manual-pt.html
Normal file
1979
beta/manual-ro.html
Normal file
1971
beta/manual-ru.html
Normal file
1985
beta/manual-sv.html
Normal file
2196
beta/manual-uk.html
Normal file
1813
beta/manual-zh.html
Normal file
2022
beta/manual.html
Normal file
BIN
beta/recovery.png
Normal file
|
After Width: | Height: | Size: 102 KiB |
268
beta/script.js
Normal file
|
|
@ -0,0 +1,268 @@
|
|||
document.addEventListener('DOMContentLoaded', () => {
|
||||
// Generate TOC for FAQ page
|
||||
const faqTocList = document.getElementById('faq-toc-list');
|
||||
const faqContent = document.getElementById('faq-content');
|
||||
|
||||
if (faqTocList && faqContent) {
|
||||
const sections = faqContent.querySelectorAll('.faq-section');
|
||||
sections.forEach(section => {
|
||||
const h2 = section.querySelector('h2');
|
||||
if (h2) {
|
||||
// Create H2 Link
|
||||
const li = document.createElement('li');
|
||||
const a = document.createElement('a');
|
||||
a.href = '#' + h2.id;
|
||||
a.textContent = h2.textContent;
|
||||
li.appendChild(a);
|
||||
faqTocList.appendChild(li);
|
||||
|
||||
// Create H3 Links (Questions)
|
||||
const questions = section.querySelectorAll('.faq-question');
|
||||
if (questions.length > 0) {
|
||||
const subUl = document.createElement('ul');
|
||||
questions.forEach(q => {
|
||||
const subLi = document.createElement('li');
|
||||
const subA = document.createElement('a');
|
||||
subA.href = '#' + q.id;
|
||||
subA.textContent = q.textContent;
|
||||
subLi.appendChild(subA);
|
||||
subUl.appendChild(subLi);
|
||||
});
|
||||
li.appendChild(subUl);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Generate TOC for Manual page
|
||||
const manualTocList = document.getElementById('manual-toc-list');
|
||||
const manualContainer = document.getElementById('manual-container');
|
||||
|
||||
if (manualTocList && manualContainer) {
|
||||
// Query specific manual title classes
|
||||
const headers = manualContainer.querySelectorAll('.manual-title-level-1, .manual-title-level-2, .manual-title-level-3');
|
||||
|
||||
let currentLevel1 = null;
|
||||
let currentLevel2Ul = null;
|
||||
|
||||
headers.forEach(header => {
|
||||
// Determine level based on class name
|
||||
let level = 1;
|
||||
if (header.classList.contains('manual-title-level-2')) level = 2;
|
||||
if (header.classList.contains('manual-title-level-3')) level = 3;
|
||||
|
||||
if (level === 1) {
|
||||
const li = document.createElement('li');
|
||||
const a = document.createElement('a');
|
||||
a.href = '#' + header.id;
|
||||
a.textContent = header.textContent;
|
||||
li.appendChild(a);
|
||||
manualTocList.appendChild(li);
|
||||
|
||||
currentLevel1 = li;
|
||||
currentLevel2Ul = null;
|
||||
}
|
||||
else if (level === 2 && currentLevel1) {
|
||||
if (!currentLevel2Ul) {
|
||||
currentLevel2Ul = document.createElement('ul');
|
||||
currentLevel1.appendChild(currentLevel2Ul);
|
||||
}
|
||||
const li = document.createElement('li');
|
||||
const a = document.createElement('a');
|
||||
a.href = '#' + header.id;
|
||||
a.textContent = header.textContent;
|
||||
li.appendChild(a);
|
||||
currentLevel2Ul.appendChild(li);
|
||||
}
|
||||
// Add level 3 handling if needed later
|
||||
});
|
||||
}
|
||||
|
||||
// Mobile menu closes when a link is clicked
|
||||
const links = document.querySelectorAll('nav a');
|
||||
const checkbox = document.getElementById('menu-toggle');
|
||||
|
||||
links.forEach(link => {
|
||||
link.addEventListener('click', () => {
|
||||
if (checkbox) checkbox.checked = false;
|
||||
});
|
||||
});
|
||||
|
||||
// Simple smooth scroll for anchor links
|
||||
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
||||
anchor.addEventListener('click', function (e) {
|
||||
e.preventDefault();
|
||||
const target = document.querySelector(this.getAttribute('href'));
|
||||
if (target) {
|
||||
target.scrollIntoView({
|
||||
behavior: 'smooth'
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// FAQ Search functionality for .faq-item structure
|
||||
const faqSearch = document.getElementById('faq-search');
|
||||
if (faqSearch) {
|
||||
faqSearch.addEventListener('input', (e) => {
|
||||
const term = e.target.value.toLowerCase();
|
||||
const container = document.getElementById('faq-content');
|
||||
const tocList = document.getElementById('faq-toc-list');
|
||||
|
||||
if (!container) return;
|
||||
|
||||
const items = container.querySelectorAll('.faq-item');
|
||||
|
||||
items.forEach(item => {
|
||||
const questionHeader = item.querySelector('.faq-question');
|
||||
const question = questionHeader.textContent.toLowerCase();
|
||||
const answer = item.querySelector('.faq-answer').textContent.toLowerCase();
|
||||
|
||||
const isMatch = question.includes(term) || answer.includes(term);
|
||||
|
||||
// Toggle display of the entire item in main content
|
||||
item.style.display = isMatch ? '' : 'none';
|
||||
|
||||
// Toggle display of TOC item corresponding to this question
|
||||
if (tocList && questionHeader.id) {
|
||||
const tocLink = tocList.querySelector(`a[href="#${CSS.escape(questionHeader.id)}"]`);
|
||||
if (tocLink) {
|
||||
const tocItem = tocLink.parentElement;
|
||||
tocItem.style.display = isMatch ? '' : 'none';
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Auto-hide sections if all their items are hidden
|
||||
const sections = container.querySelectorAll('.faq-section');
|
||||
sections.forEach(section => {
|
||||
const visibleItems = section.querySelectorAll('.faq-item:not([style*="display: none"])');
|
||||
const isSectionVisible = visibleItems.length > 0;
|
||||
|
||||
section.style.display = isSectionVisible ? '' : 'none';
|
||||
|
||||
// Toggle display of TOC section
|
||||
const sectionHeader = section.querySelector('h2');
|
||||
if (tocList && sectionHeader && sectionHeader.id) {
|
||||
const tocLink = tocList.querySelector(`a[href="#${CSS.escape(sectionHeader.id)}"]`);
|
||||
if (tocLink) {
|
||||
// The section link is directly inside the top-level li of the TOC
|
||||
const tocSectionItem = tocLink.parentElement;
|
||||
tocSectionItem.style.display = isSectionVisible ? '' : 'none';
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Language Selector functionality
|
||||
const languageSelector = document.getElementById('language-selector');
|
||||
if (languageSelector) {
|
||||
// Automatically select the option matching the current file name
|
||||
const currentFile = window.location.pathname.split('/').pop() || 'manual.html';
|
||||
const options = Array.from(languageSelector.options);
|
||||
const matchingOption = options.find(opt => opt.value === currentFile);
|
||||
if (matchingOption) {
|
||||
languageSelector.value = currentFile;
|
||||
}
|
||||
|
||||
// Redirect on change
|
||||
languageSelector.addEventListener('change', (e) => {
|
||||
const selectedPage = e.target.value;
|
||||
if (selectedPage) {
|
||||
window.location.href = selectedPage;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// UI Gallery Preview on Hover
|
||||
const shots = document.querySelectorAll('.ui-shot');
|
||||
const overlay = document.getElementById('ui-preview-overlay');
|
||||
const previewImg = document.getElementById('ui-preview-img');
|
||||
|
||||
if (overlay && previewImg) {
|
||||
shots.forEach(shot => {
|
||||
shot.addEventListener('mouseenter', () => {
|
||||
const largeSrc = shot.getAttribute('data-large');
|
||||
if (largeSrc) {
|
||||
previewImg.src = largeSrc;
|
||||
overlay.classList.add('active');
|
||||
}
|
||||
});
|
||||
|
||||
shot.addEventListener('mouseleave', () => {
|
||||
overlay.classList.remove('active');
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Global Popover Logic for Compare Table
|
||||
const infoBtns = document.querySelectorAll('.info-btn');
|
||||
const globalPopover = document.getElementById('global-popover');
|
||||
const globalPopoverContent = document.getElementById('global-popover-content');
|
||||
const popoverOverlay = document.getElementById('popover-overlay');
|
||||
|
||||
if (infoBtns.length > 0 && globalPopover && popoverOverlay) {
|
||||
|
||||
function closePopover() {
|
||||
globalPopover.classList.remove('active');
|
||||
popoverOverlay.classList.remove('active');
|
||||
globalPopover.style.opacity = ''; // reset just in case
|
||||
}
|
||||
|
||||
popoverOverlay.addEventListener('click', closePopover);
|
||||
|
||||
infoBtns.forEach(btn => {
|
||||
btn.addEventListener('click', (e) => {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
|
||||
// Get content from the hidden sibling div
|
||||
const contentDiv = btn.parentElement.querySelector('.info-content');
|
||||
if (!contentDiv) return;
|
||||
|
||||
globalPopoverContent.innerHTML = contentDiv.innerHTML;
|
||||
|
||||
// Measure the popover by making it transparent but blocked
|
||||
globalPopover.style.opacity = '0';
|
||||
globalPopover.classList.add('active');
|
||||
|
||||
const popWidth = globalPopover.offsetWidth;
|
||||
const popHeight = globalPopover.offsetHeight;
|
||||
|
||||
globalPopover.classList.remove('active');
|
||||
globalPopover.style.opacity = '';
|
||||
|
||||
// Position the popover
|
||||
const rect = btn.getBoundingClientRect();
|
||||
const scrollX = window.pageXOffset || document.documentElement.scrollLeft;
|
||||
const scrollY = window.pageYOffset || document.documentElement.scrollTop;
|
||||
|
||||
// Calculate position (centered above the button by default)
|
||||
let top = rect.top + scrollY - popHeight - 15;
|
||||
let left = rect.left + scrollX - (popWidth / 2) + (rect.width / 2);
|
||||
|
||||
// Simple collision detection
|
||||
if (rect.top - popHeight - 20 < 0) {
|
||||
// flip to bottom
|
||||
top = rect.bottom + scrollY + 15;
|
||||
}
|
||||
|
||||
// ensure left is on screen
|
||||
if (left < 10) left = 10;
|
||||
if (left + popWidth > window.innerWidth) {
|
||||
left = window.innerWidth - popWidth - 10;
|
||||
}
|
||||
|
||||
globalPopover.style.top = `${top}px`;
|
||||
globalPopover.style.left = `${left}px`;
|
||||
|
||||
globalPopover.classList.add('active');
|
||||
popoverOverlay.classList.add('active');
|
||||
});
|
||||
});
|
||||
|
||||
// Close on resize to prevent weird positioning
|
||||
window.addEventListener('resize', closePopover);
|
||||
}
|
||||
});
|
||||
830
beta/style.css
Normal file
|
|
@ -0,0 +1,830 @@
|
|||
:root {
|
||||
/* Color Palette - Systems Dark */
|
||||
--c-slate-950: #020617;
|
||||
--c-slate-900: #0f172a;
|
||||
|
||||
--bg-body: var(--c-slate-950); /* Deep Slate */
|
||||
--bg-surface: var(--c-slate-900); /* Lighter Slate */
|
||||
--bg-surface-hover: #1e293b; /* Slate 800 */
|
||||
--border-color: #1e293b; /* Slate 800 */
|
||||
|
||||
--text-primary: #f8fafc;
|
||||
--text-secondary: #94a3b8;
|
||||
--text-accent: #38bdf8; /* Cyan/Blue mix */
|
||||
|
||||
--primary: #3b82f6; /* Electric Blue */
|
||||
--primary-hover: #2563eb;
|
||||
--primary-glow: rgba(59, 130, 246, 0.5);
|
||||
|
||||
--success: #10b981;
|
||||
--warning: #f59e0b;
|
||||
--danger: #ef4444;
|
||||
|
||||
/* Spacing & Layout */
|
||||
--container-width: 1200px;
|
||||
--header-height: 70px;
|
||||
--radius: 8px;
|
||||
--font-main: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
||||
--font-mono: "SF Mono", "Segoe UI Mono", "Roboto Mono", monospace;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--bg-body);
|
||||
color: var(--text-primary);
|
||||
font-family: var(--font-main);
|
||||
line-height: 1.6;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
/* --- Layout Utilities --- */
|
||||
.container {
|
||||
max-width: var(--container-width);
|
||||
margin: 0 auto;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.grid {
|
||||
display: grid;
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.grid-2-cols { grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); }
|
||||
.grid-3-cols { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
|
||||
.grid-4-cols { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
|
||||
|
||||
/* --- Typography --- */
|
||||
h1, h2, h3, h4 {
|
||||
font-weight: 700;
|
||||
line-height: 1.2;
|
||||
margin-bottom: 1rem;
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
h1 { font-size: 3.5rem; letter-spacing: -0.05em; }
|
||||
h2 { font-size: 2.25rem; border-bottom: 1px solid var(--border-color); padding-bottom: 0.5rem; }
|
||||
h3 { font-size: 1.5rem; color: var(--text-primary); }
|
||||
p { margin-bottom: 1.5rem; color: var(--text-secondary); }
|
||||
a { color: var(--primary); text-decoration: none; transition: 0.2s; }
|
||||
a:hover { color: var(--text-accent); }
|
||||
.accent-text { color: var(--primary); text-transform: uppercase; letter-spacing: 0.05em; font-size: 0.875rem; }
|
||||
|
||||
code, pre {
|
||||
font-family: var(--font-mono);
|
||||
}
|
||||
|
||||
/* --- Header & Navigation --- */
|
||||
header {
|
||||
height: var(--header-height);
|
||||
background: rgba(2, 6, 23, 0.9); /* Matches --c-slate-950 */
|
||||
backdrop-filter: blur(10px);
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.nav-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.logo {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 800;
|
||||
color: var(--text-primary);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.logo svg { height: 32px; width: 32px; fill: var(--text-primary); }
|
||||
.logo-accent { fill: var(--primary); }
|
||||
|
||||
nav ul {
|
||||
display: flex;
|
||||
list-style: none;
|
||||
gap: 20px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
nav a {
|
||||
font-size: 0.95rem;
|
||||
color: var(--text-secondary);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
nav a:hover, nav a.active {
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
.nav-cta {
|
||||
background: var(--primary);
|
||||
color: white !important;
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: var(--radius);
|
||||
}
|
||||
|
||||
.nav-cta:hover {
|
||||
background: var(--primary-hover);
|
||||
}
|
||||
|
||||
/* --- Buttons --- */
|
||||
.btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 8px;
|
||||
padding: 0.75rem 1.5rem;
|
||||
border-radius: var(--radius);
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
transition: all 0.2s ease;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: var(--primary);
|
||||
color: white;
|
||||
box-shadow: 0 0 15px var(--primary-glow);
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background: var(--primary-hover);
|
||||
transform: translateY(-1px);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
background: transparent;
|
||||
border: 1px solid var(--border-color);
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.btn-secondary:hover {
|
||||
background: var(--bg-surface);
|
||||
border-color: var(--text-accent);
|
||||
color: var(--text-accent);
|
||||
}
|
||||
|
||||
.btn-block { width: 100%; }
|
||||
|
||||
/* --- Sections --- */
|
||||
.hero-section {
|
||||
padding: 6rem 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.hero-subtext {
|
||||
font-size: 1.25rem;
|
||||
max-width: 700px;
|
||||
margin: 1.5rem auto;
|
||||
}
|
||||
|
||||
.hero-actions {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 1rem;
|
||||
margin-top: 2.5rem;
|
||||
}
|
||||
|
||||
.daemon-section {
|
||||
background: linear-gradient(180deg, var(--bg-body) 0%, var(--bg-surface) 100%);
|
||||
padding: 5rem 0;
|
||||
border-top: 1px solid var(--border-color);
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
.daemon-layout {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.feature-list {
|
||||
list-style: none;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.feature-list li {
|
||||
margin-bottom: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
.icon-check {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
fill: var(--success);
|
||||
}
|
||||
|
||||
.link-arrow {
|
||||
font-weight: 600;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* --- Terminal Mockup --- */
|
||||
.terminal-mockup {
|
||||
background: #000;
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: var(--radius);
|
||||
padding: 0;
|
||||
box-shadow: 0 0 30px rgba(59, 130, 246, 0.1);
|
||||
font-family: var(--font-mono);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.terminal-header {
|
||||
background: var(--bg-surface);
|
||||
padding: 10px 15px;
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
.dot { width: 10px; height: 10px; border-radius: 50%; }
|
||||
.red { background: #ef4444; }
|
||||
.yellow { background: #f59e0b; }
|
||||
.green { background: #10b981; }
|
||||
|
||||
.terminal-body {
|
||||
padding: 20px;
|
||||
color: #e2e8f0;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.term-line { margin-bottom: 4px; }
|
||||
.term-line.success { color: var(--success); }
|
||||
.term-line.warning { color: var(--warning); }
|
||||
.term-line.info { color: var(--text-accent); }
|
||||
.term-line.separator { color: var(--border-color); margin: 8px 0; }
|
||||
|
||||
/* --- Cards --- */
|
||||
.features-section { padding: 5rem 0; }
|
||||
.section-title { text-align: center; margin-bottom: 3rem; }
|
||||
|
||||
.card {
|
||||
background: var(--bg-surface);
|
||||
border: 1px solid var(--border-color);
|
||||
padding: 2rem;
|
||||
border-radius: var(--radius);
|
||||
transition: transform 0.2s, border-color 0.2s;
|
||||
}
|
||||
|
||||
.card:hover {
|
||||
border-color: var(--primary);
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
.card-subtitle {
|
||||
color: var(--text-accent);
|
||||
margin-bottom: 0.5rem;
|
||||
font-style: italic;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.card-icon-wrapper {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
background: rgba(59, 130, 246, 0.1);
|
||||
border-radius: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.card-icon { width: 24px; height: 24px; fill: var(--primary); }
|
||||
|
||||
/* --- Tables --- */
|
||||
.data-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin: 2rem 0;
|
||||
background: var(--bg-surface);
|
||||
border-radius: var(--radius);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.data-table th, .data-table td {
|
||||
text-align: left;
|
||||
padding: 1rem;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
.data-table th {
|
||||
color: var(--text-accent);
|
||||
font-weight: 600;
|
||||
background: rgba(255, 255, 255, 0.02);
|
||||
}
|
||||
|
||||
.data-table tr:last-child td { border-bottom: none; }
|
||||
.data-table tr:hover td { background: var(--bg-surface-hover); }
|
||||
|
||||
/* --- Search Input --- */
|
||||
.search-input {
|
||||
width: 100%;
|
||||
padding: 1rem 1.5rem;
|
||||
font-size: 1rem;
|
||||
background: var(--bg-surface);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: var(--radius);
|
||||
color: var(--text-primary);
|
||||
transition: border-color 0.2s, box-shadow 0.2s;
|
||||
outline: none;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.search-input:focus {
|
||||
border-color: var(--primary);
|
||||
box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
|
||||
}
|
||||
|
||||
.search-input::placeholder {
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
/* --- FAQ Specific Styling --- */
|
||||
#faq-content {
|
||||
max-width: 100%; /* Changed from 900px since it's now in a grid cell */
|
||||
}
|
||||
|
||||
.faq-section {
|
||||
margin-bottom: 4rem;
|
||||
}
|
||||
|
||||
.faq-section h2 {
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 2rem;
|
||||
color: var(--primary);
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
padding-bottom: 0.5rem;
|
||||
font-size: 2rem;
|
||||
letter-spacing: -0.02em;
|
||||
scroll-margin-top: 100px;
|
||||
}
|
||||
|
||||
.faq-item {
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
margin-bottom: 2rem;
|
||||
padding-bottom: 2rem;
|
||||
}
|
||||
|
||||
.faq-item:last-child {
|
||||
border-bottom: none;
|
||||
margin-bottom: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.faq-question {
|
||||
margin-top: 0;
|
||||
margin-bottom: 1rem;
|
||||
font-size: 1.4rem;
|
||||
color: var(--text-primary);
|
||||
font-weight: 700;
|
||||
scroll-margin-top: 100px; /* Offset for sticky header */
|
||||
}
|
||||
|
||||
/* The wrapper for the answer content */
|
||||
.faq-answer {
|
||||
padding-left: 1.5rem;
|
||||
border-left: 3px solid var(--bg-surface-hover);
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.faq-answer:hover {
|
||||
border-left-color: var(--primary);
|
||||
}
|
||||
|
||||
/* Styles for content INSIDE .faq-answer */
|
||||
.faq-answer p {
|
||||
margin-bottom: 1rem;
|
||||
color: var(--text-secondary);
|
||||
line-height: 1.7;
|
||||
background: transparent;
|
||||
padding: 0;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.faq-answer ul, .faq-answer ol {
|
||||
margin-bottom: 1.5rem;
|
||||
padding-left: 1.5rem;
|
||||
color: var(--text-secondary);
|
||||
list-style-position: outside;
|
||||
}
|
||||
|
||||
.faq-answer li {
|
||||
margin-bottom: 0.5rem;
|
||||
padding-left: 0.5rem;
|
||||
}
|
||||
|
||||
.faq-answer table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin: 1.5rem 0;
|
||||
font-size: 0.95rem;
|
||||
background: var(--bg-surface);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: var(--radius);
|
||||
display: block;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.faq-answer table {
|
||||
display: table;
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
|
||||
.faq-answer th, .faq-answer td {
|
||||
padding: 0.75rem 1rem;
|
||||
border: 1px solid var(--border-color);
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.faq-answer th {
|
||||
background: rgba(59, 130, 246, 0.1);
|
||||
color: var(--text-primary);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.faq-answer td {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.faq-answer tr:nth-child(even) td {
|
||||
background: rgba(255, 255, 255, 0.02);
|
||||
}
|
||||
|
||||
.faq-answer a {
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 2px;
|
||||
}
|
||||
|
||||
/* --- Footer --- */
|
||||
footer {
|
||||
border-top: 1px solid var(--border-color);
|
||||
padding: 4rem 0;
|
||||
margin-top: 4rem;
|
||||
background: var(--bg-surface);
|
||||
}
|
||||
|
||||
.footer-content {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.footer-col h3 { color: var(--text-primary); margin-bottom: 0.5rem; }
|
||||
.footer-col h4 { color: var(--text-accent); font-size: 0.9rem; text-transform: uppercase; margin-bottom: 1rem; border: none; }
|
||||
.footer-col ul { list-style: none; }
|
||||
.footer-col ul li { margin-bottom: 0.5rem; }
|
||||
.license { font-size: 0.8rem; color: var(--text-secondary); margin-top: 1rem; }
|
||||
|
||||
/* --- Mobile Menu --- */
|
||||
#menu-toggle { display: none; }
|
||||
.menu-icon { display: none; cursor: pointer; color: var(--text-primary); }
|
||||
|
||||
@media (max-width: 768px) {
|
||||
h1 { font-size: 2.5rem; }
|
||||
.hero-actions { flex-direction: column; }
|
||||
.menu-icon { display: block; }
|
||||
|
||||
nav ul {
|
||||
display: none;
|
||||
flex-direction: column;
|
||||
position: absolute;
|
||||
top: var(--header-height);
|
||||
left: 0;
|
||||
width: 100%;
|
||||
background: var(--bg-surface);
|
||||
padding: 1rem;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
align-items: flex-start;
|
||||
}
|
||||
nav ul li { width: 100%; }
|
||||
nav a { display: block; padding: 0.5rem 0; }
|
||||
nav .nav-cta { text-align: center; }
|
||||
|
||||
#menu-toggle:checked ~ ul { display: flex; }
|
||||
|
||||
.manual-layout, .faq-layout { grid-template-columns: 1fr; }
|
||||
.manual-sidebar { position: static; margin-bottom: 2rem; border-bottom: 1px solid var(--border-color); padding-bottom: 1rem; }
|
||||
}
|
||||
|
||||
/* --- Specific Page: Manual --- */
|
||||
.manual-layout, .faq-layout {
|
||||
display: grid;
|
||||
grid-template-columns: 250px 1fr;
|
||||
gap: 3rem;
|
||||
padding-top: 2rem;
|
||||
padding-bottom: 4rem;
|
||||
}
|
||||
|
||||
.manual-sidebar {
|
||||
position: sticky;
|
||||
top: 90px;
|
||||
height: fit-content;
|
||||
max-height: calc(100vh - 100px);
|
||||
overflow-y: auto;
|
||||
padding-right: 5px;
|
||||
|
||||
/* Hide scrollbar for IE, Edge and Firefox */
|
||||
-ms-overflow-style: none; /* IE and Edge */
|
||||
scrollbar-width: none; /* Firefox */
|
||||
}
|
||||
|
||||
/* Hide scrollbar for Chrome, Safari and Opera */
|
||||
.manual-sidebar::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.manual-sidebar h4 { color: var(--text-primary); margin-bottom: 1rem; }
|
||||
.manual-sidebar ul { list-style: none; }
|
||||
.manual-sidebar a { display: block; padding: 0.5rem 0; color: var(--text-secondary); border-left: 2px solid transparent; padding-left: 10px; }
|
||||
.manual-sidebar a:hover, .manual-sidebar a.current { color: var(--primary); border-left-color: var(--primary); }
|
||||
|
||||
/* Nested TOC for FAQ */
|
||||
.manual-sidebar ul ul {
|
||||
margin-left: 10px;
|
||||
margin-bottom: 10px;
|
||||
border-left: 1px solid var(--border-color);
|
||||
}
|
||||
.manual-sidebar ul ul a {
|
||||
font-size: 0.85rem;
|
||||
padding: 0.25rem 0 0.25rem 10px;
|
||||
border-left: none;
|
||||
}
|
||||
.manual-sidebar ul ul a:hover {
|
||||
color: var(--text-accent);
|
||||
}
|
||||
|
||||
/* --- Manual Content Styling (NEW) --- */
|
||||
.manual-doc {
|
||||
font-family: var(--font-main);
|
||||
color: var(--text-secondary);
|
||||
line-height: 1.7;
|
||||
max-width: 900px;
|
||||
}
|
||||
|
||||
/* Level 1 Sections */
|
||||
.manual-section-level-1 {
|
||||
margin-bottom: 4rem;
|
||||
padding-bottom: 2rem;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
.manual-section-level-1:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.manual-title-level-1 {
|
||||
font-size: 2rem;
|
||||
color: var(--text-primary);
|
||||
margin-bottom: 1.5rem;
|
||||
border-bottom: none;
|
||||
scroll-margin-top: 100px;
|
||||
}
|
||||
|
||||
/* Level 2 Sections */
|
||||
.manual-section-level-2 {
|
||||
margin-top: 3rem;
|
||||
margin-left: 1.5rem;
|
||||
padding-left: 1.5rem;
|
||||
border-left: 2px solid var(--border-color);
|
||||
}
|
||||
|
||||
.manual-title-level-2 {
|
||||
font-size: 1.4rem;
|
||||
color: var(--text-accent);
|
||||
margin-bottom: 1rem;
|
||||
border-bottom: none;
|
||||
scroll-margin-top: 100px;
|
||||
}
|
||||
|
||||
/* Level 3 Sections */
|
||||
.manual-section-level-3 {
|
||||
margin-top: 2rem;
|
||||
margin-left: 1.5rem;
|
||||
padding-left: 1rem;
|
||||
border-left: 1px dashed var(--border-color);
|
||||
}
|
||||
|
||||
.manual-title-level-3 {
|
||||
font-size: 1.1rem;
|
||||
color: var(--text-primary);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
margin-bottom: 0.75rem;
|
||||
scroll-margin-top: 100px;
|
||||
}
|
||||
|
||||
/* Common Text Elements */
|
||||
.manual-doc p { margin-bottom: 1rem; }
|
||||
.manual-doc ul { margin-bottom: 1.5rem; padding-left: 2rem; list-style-type: disc; }
|
||||
.manual-doc li { margin-bottom: 0.5rem; }
|
||||
|
||||
/* The Pre Tag */
|
||||
.manual-doc pre {
|
||||
background: #000000;
|
||||
color: #e2e8f0;
|
||||
padding: 1.25rem;
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: var(--radius);
|
||||
font-family: var(--font-mono);
|
||||
font-size: 0.9rem;
|
||||
overflow-x: auto;
|
||||
margin: 1.5rem 0;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
.manual-indent {
|
||||
margin-left: 2rem;
|
||||
border-left: 3px solid var(--primary);
|
||||
}
|
||||
|
||||
/* Option and Tag Lists (Grid Layout) */
|
||||
.manual-option-list, .manual-tag-list {
|
||||
display: grid;
|
||||
grid-template-columns: auto 1fr;
|
||||
gap: 1rem 2rem;
|
||||
margin: 1.5rem 0;
|
||||
align-items: baseline;
|
||||
}
|
||||
|
||||
.manual-option-entry, .manual-tag-entry {
|
||||
display: contents; /* Allows children to participate in the parent grid */
|
||||
}
|
||||
|
||||
.manual-option-name, .manual-tag-name {
|
||||
font-family: var(--font-mono);
|
||||
color: var(--warning);
|
||||
font-weight: 700;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.manual-option-description, .manual-tag-description {
|
||||
color: var(--text-secondary);
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.manual-option-list, .manual-tag-list {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
.manual-option-description, .manual-tag-description {
|
||||
margin-bottom: 1rem;
|
||||
margin-left: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Compare Grid */
|
||||
.compare-container { overflow-x: auto; position: relative; }
|
||||
.compare-table { min-width: 900px; }
|
||||
.compare-table th { text-align: center; }
|
||||
.compare-table td { text-align: center; vertical-align: middle; }
|
||||
.feature-cell { text-align: left !important; font-weight: 600; color: var(--text-primary); }
|
||||
.cell-subtext { font-size: 0.8rem; color: var(--text-secondary); font-weight: 400; margin-top: 2px; }
|
||||
.check { color: var(--success); }
|
||||
.cross { color: var(--danger); }
|
||||
.partial { color: var(--warning); }
|
||||
.snapraid-col { background: rgba(59, 130, 246, 0.1); border-left: 1px solid var(--primary); border-right: 1px solid var(--primary); }
|
||||
.snapraid-header { color: var(--primary) !important; font-size: 1.2rem; }
|
||||
|
||||
/* Info Button and Popover */
|
||||
.info-wrapper {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.info-btn {
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
padding: 0;
|
||||
color: var(--primary);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
transition: color 0.2s;
|
||||
}
|
||||
|
||||
.info-btn:hover {
|
||||
color: var(--text-accent);
|
||||
}
|
||||
|
||||
.global-popover {
|
||||
display: none;
|
||||
position: absolute;
|
||||
width: 300px;
|
||||
max-width: 90vw;
|
||||
background: var(--bg-surface);
|
||||
border: 1px solid var(--border-color);
|
||||
padding: 1.25rem;
|
||||
border-radius: var(--radius);
|
||||
box-shadow: 0 10px 40px rgba(0,0,0,0.6);
|
||||
z-index: 2000;
|
||||
font-size: 0.9rem;
|
||||
line-height: 1.6;
|
||||
color: var(--text-secondary);
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.global-popover.active {
|
||||
display: block;
|
||||
animation: popIn 0.2s ease-out;
|
||||
}
|
||||
|
||||
@keyframes popIn {
|
||||
from { opacity: 0; transform: translateY(10px); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
|
||||
.popover-overlay {
|
||||
display: none;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
z-index: 1999;
|
||||
}
|
||||
|
||||
.popover-overlay.active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Support Cards */
|
||||
.support-card { display: flex; gap: 1rem; align-items: start; }
|
||||
.support-icon { min-width: 40px; height: 40px; fill: var(--text-secondary); }
|
||||
.donation-card { border-color: var(--warning); background: rgba(245, 158, 11, 0.05); }
|
||||
|
||||
/* UI Gallery */
|
||||
.ui-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1rem; margin-top: 2rem; }
|
||||
.ui-shot {
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: var(--radius);
|
||||
overflow: hidden;
|
||||
height: 200px;
|
||||
background: #000;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
}
|
||||
.ui-shot img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
.ui-shot:hover img {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
.ui-shot-caption { position: absolute; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.8); color: white; padding: 0.5rem; font-size: 0.8rem; text-align: center; }
|
||||
|
||||
/* Preview Overlay */
|
||||
#ui-preview-overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background: rgba(2, 6, 23, 0.85); /* Slate 950 with opacity */
|
||||
backdrop-filter: blur(8px);
|
||||
z-index: 2000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
opacity: 0;
|
||||
pointer-events: none; /* Allows hover events to pass through to underlying elements */
|
||||
transition: opacity 0.3s ease;
|
||||
}
|
||||
|
||||
#ui-preview-overlay.active {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#ui-preview-img {
|
||||
max-width: 90%;
|
||||
max-height: 90%;
|
||||
border-radius: var(--radius);
|
||||
box-shadow: 0 0 50px rgba(0,0,0,0.5);
|
||||
transform: scale(0.95);
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
#ui-preview-overlay.active #ui-preview-img {
|
||||
transform: scale(1);
|
||||
}
|
||||
416
beta/support.html
Normal file
|
|
@ -0,0 +1,416 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="A backup program for disk arrays. It stores parity information of your data and it recovers from up to six disk failures">
|
||||
<meta name="keywords" content="snapraid snapshot raid backup disk array redundancy parity">
|
||||
<title>SnapRAID Support</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
||||
<script src="script.js"></script>
|
||||
|
||||
<!-- Google Analytics 4 -->
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-W1Z5FKHYQ4"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
|
||||
gtag('config', 'G-W1Z5FKHYQ4');
|
||||
</script>
|
||||
|
||||
<!-- Google Universal Analytics -->
|
||||
<script type="text/javascript">
|
||||
|
||||
var _gaq = _gaq || [];
|
||||
_gaq.push(['_setAccount', 'UA-21967501-1']);
|
||||
_gaq.push(['_trackPageview']);
|
||||
|
||||
(function() {
|
||||
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
||||
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
||||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
||||
})();
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="container nav-container">
|
||||
<a href="index.html" class="logo">
|
||||
<img src="favicon-32x32.png"/>
|
||||
SnapRAID
|
||||
</a>
|
||||
<nav>
|
||||
<input type="checkbox" id="menu-toggle">
|
||||
<label for="menu-toggle" class="menu-icon"><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"><path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"/></svg></label>
|
||||
<ul>
|
||||
<li><a href="index" >Home</a></li>
|
||||
<li><a href="ui" >UI & Daemon</a></li>
|
||||
<li><a href="howitworks" >How it Works</a></li>
|
||||
<li><a href="manual" >Manual</a></li>
|
||||
<li><a href="compare" >Compare</a></li>
|
||||
<li><a href="design" >Design</a></li>
|
||||
<li><a href="faq" >FAQ</a></li>
|
||||
<li><a href="support" class="active">Support</a></li>
|
||||
<li><a href="download" class="nav-cta">Download</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
||||
<div class="container" style="padding: 4rem 20px;">
|
||||
<h1 style="text-align: center; margin-bottom: 3rem;">Community Support</h1>
|
||||
|
||||
<div class="grid grid-2-cols" style="margin-bottom: 4rem;">
|
||||
<a href="https://sourceforge.net/p/snapraid/discussion/1677233/" class="card support-card">
|
||||
<svg class="support-icon" viewBox="0 0 24 24"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"/></svg>
|
||||
<div>
|
||||
<h3>Official Forum</h3>
|
||||
<p>SourceForge is the main hub for bug reports and dev discussion.</p>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="https://www.reddit.com/r/Snapraid/" class="card support-card">
|
||||
<svg class="support-icon" viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>
|
||||
<div>
|
||||
<h3>Reddit r/Snapraid</h3>
|
||||
<p>Active community for Q&A, tips, and experience sharing.</p>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="https://forum.openmediavault.org/wsc/index.php?search/&q=snapraid" class="card support-card">
|
||||
<svg class="support-icon" viewBox="0 0 24 24"><path d="M3 13h2v-2H3v2zm0 4h2v-2H3v2zm0-8h2V7H3v2zm4 4h14v-2H7v2zm0 4h14v-2H7v2zM7 7v2h14V7H7z"/></svg>
|
||||
<div>
|
||||
<h3>OpenMediaVault</h3>
|
||||
<p>Support for OMV users running the SnapRAID plugin.</p>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="https://forums.unraid.net/topic/163648-plugin-snapraid-on-unraid/" class="card support-card">
|
||||
<svg class="support-icon" viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 17h-2v-2h2v2zm2.07-7.75l-.9.92C13.45 12.9 13 13.5 13 15h-2v-.5c0-1.1.45-2.1 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41 0-1.1-.9-2-2-2s-2 .9-2 2H8c0-2.21 1.79-4 4-4s4 1.79 4 4c0 .88-.36 1.68-.93 2.25z"/></svg>
|
||||
<div>
|
||||
<h3>UNRAID Plugin</h3>
|
||||
<p>Discussion for users running SnapRAID on Unraid.</p>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div style="margin-top: 4rem;">
|
||||
<h2>Community Guides & Tutorials</h2>
|
||||
<table class="data-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Platform</th>
|
||||
<th>Title</th>
|
||||
<th>Published</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=QFGEKh1A90I" target="_blank">How to install and setup Snapraid</a></td>
|
||||
<td>Jun 26, 2023</td>
|
||||
<td>Step-by-step guide to compiling, installing, and automating SnapRAID parity protection.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=fmuiRLPcuJE" target="_blank">How to recover a failed drive using Snapraid</a></td>
|
||||
<td>Jul 31, 2023</td>
|
||||
<td>Demonstrates recovering data from a failed drive in a MergerFS + SnapRAID setup.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=n7piuhTXeG4" target="_blank">How to install and setup MergerFS</a></td>
|
||||
<td>Jun 26, 2023</td>
|
||||
<td>How to install and setup MergerFS for SnapRAID.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=tX5MA-c6Qq4" target="_blank">MergerFS + SnapRAID : Forget about RAID 5 in your Home Server !</a></td>
|
||||
<td>Feb 21, 2023</td>
|
||||
<td>Explains setting up MergerFS and SnapRAID for home server safety equivalent to RAID 5, with Slack notifications.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=fR0XhaWvR1E" target="_blank">DIY Unraid-like functionality</a></td>
|
||||
<td>Jun 12, 2025</td>
|
||||
<td>Builds Unraid-style setup with SnapRAID overview, install, and use starting at 11:26.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=Yt67zz9p0FU" target="_blank">How to build the Perfect Media Server | Part 1 - The Tech Stack</a></td>
|
||||
<td>Apr 22, 2025</td>
|
||||
<td>Overview of building a media server stack, including SnapRAID integration at 19:28.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=D2Klx-X7pFo" target="_blank">How to setup a Linux Fileserver with Snapraid and Mergerfs Re-Export</a></td>
|
||||
<td>Apr 23, 2018</td>
|
||||
<td>Guides through setting up SnapRAID with MergerFS on Linux for a simple fileserver, including add/remove drives.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Linux (Italian)</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=5QSkDZi9OzY&" target="_blank">Il RAID è OBSOLETO: la migliore ALTERNATIVA in ambito domestico</a></td>
|
||||
<td>Jun 18, 2023</td>
|
||||
<td>Review di SnapRAID da parte di Morro Linux</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>OpenMediaVault</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=_LLB6x5WOR4" target="_blank">Setting up SnapRAID + mergerfs on OpenMediaVault</a></td>
|
||||
<td>Nov 19, 2023</td>
|
||||
<td>Tutorial for configuring SnapRAID and MergerFS on OpenMediaVault, including drive additions.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>OpenMediaVault</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=9XvY6usHSIA" target="_blank">Setting up MergerFS SnapRaid and file server on OpenMediaVault</a></td>
|
||||
<td>Sep 10, 2023</td>
|
||||
<td>Guides through creating a protected storage pool and file server with MergerFS and SnapRAID.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Windows</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=5IXMM4hfIek">Setting up SnapRAID for Windows (and DrivePool) PART 1</a></td>
|
||||
<td>Apr 28, 2023</td>
|
||||
<td>A detailed guide on installing and configuring SnapRAID on Windows, including integration with DrivePool for disk pooling.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Windows</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=Mw_7x_MCwi0">SnapRAID for Windows (and DrivePool) Part 2 - Recovery</a></td>
|
||||
<td>May 12, 2023</td>
|
||||
<td>The second part of the series, focusing on array modification, data recovery from deletions or corruption, and disk replacement.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Windows</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=kDCMpVgZb4g" target="_blank">How to setup Snapraid and DrivePool in Windows</a></td>
|
||||
<td>Sep 29, 2017</td>
|
||||
<td>Shows how to set up SnapRAID and DrivePool to create a large volume with parity backup for files.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
|
||||
<!---
|
||||
|
||||
COMPARISON
|
||||
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://markhenrick.site/2020/11/04/unraid-snapraid.html" target="_blank">Unraid vs Snapraid</a></td>
|
||||
<td>Nov 4, 2020</td>
|
||||
<td>Side-by-side comparison of Unraid and SnapRAID, including pros/cons and summaries.</td>
|
||||
</tr>
|
||||
|
||||
OBSOLETE
|
||||
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://blog.karaolidis.com/ultimate-home-server-part-1/" target="_blank">Building the Ultimate Linux Home Server - Part 1: Intro, MergerFS & SnapRAID</a></td>
|
||||
<td>Jul 24, 2021</td>
|
||||
<td>Introduces MergerFS for pooling drives and SnapRAID for redundancy in a home server build.</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://joshmlwood.com/post/home-file-server-snapraid/" target="_blank">Home File Server - SnapRAID</a></td>
|
||||
<td>Jan 6, 2019</td>
|
||||
<td>Personal guide to using SnapRAID for disk array backups and multi-drive failure recovery.</td>
|
||||
</tr>
|
||||
|
||||
POCO INFORMATIVO
|
||||
<tr>
|
||||
<td><a href="https://noted.lol/an-intro-to-mergerfs-and-snapraid/" target="_blank">An Intro to MergerFS and SnapRAID</a></td>
|
||||
<td>Sep 5, 2023</td>
|
||||
<td>Beginner-friendly overview of benefits for data protection in storage setups.</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://noted.lol/mergerfs-and-snapraid-setup-1/" target="_blank">Setup and Install MergerFS and SnapRAID (Part 1)</a></td>
|
||||
<td>Aug 9, 2024</td>
|
||||
<td>Part 1 of a guide focusing on installing and configuring MergerFS for pooling before SnapRAID protection.</td>
|
||||
</tr>
|
||||
|
||||
https://noted.lol/mergerfs-and-snapraid-setup-part-2/
|
||||
|
||||
<tr>
|
||||
<td><a href="https://mohammedalqadi.sa/snapraid/" target="_blank">SnapRAID</a></td>
|
||||
<td>Mar 11, 2025</td>
|
||||
<td>Overview of SnapRAID's features for static datasets like media, with sample configuration examples.</td>
|
||||
</tr>
|
||||
|
||||
RIMPIAZZATO DA perfectmediaserver.com
|
||||
|
||||
<tr>
|
||||
<td><a href="https://www.linuxserver.io/blog/2019-07-16-perfect-media-server-2019" target="_blank">The Perfect Media Server - 2019 Edition</a></td>
|
||||
<td>Jul 16, 2019</td>
|
||||
<td>Recommends MergerFS + SnapRAID combo for reliable media storage since 2016.</td>
|
||||
</tr>
|
||||
|
||||
AUFS OBSOLETE
|
||||
|
||||
<tr>
|
||||
<td><a href="https://wdullaer.com/blog/2016/03/19/create-a-nas-with-redundancy-using-snapraid/" target="_blank">Create a NAS with Redundancy Using Snapraid</a></td>
|
||||
<td>Mar 19, 2016</td>
|
||||
<td>Details configuring AUFS for pooling and SnapRAID for redundancy and bitrot protection on Ubuntu.</td>
|
||||
</tr>
|
||||
|
||||
2019 e AUFS OBSOLETE
|
||||
<tr>
|
||||
<td><a href="https://www.addictivetips.com/ubuntu-linux-tips/set-up-snapraid-on-ubuntu-server/" target="_blank">How to set up SnapRAID on Ubuntu server</a></td>
|
||||
<td>Feb 26, 2019</td>
|
||||
<td>Comprehensive tutorial for installing and configuring SnapRAID on Ubuntu, including directory setup and conf file editing.</td>
|
||||
</tr>
|
||||
|
||||
--->
|
||||
|
||||
|
||||
<div style="margin-top: 4rem;">
|
||||
<h2>Video Tutorials</h2>
|
||||
<table class="data-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Platform</th>
|
||||
<th>Title</th>
|
||||
<th>Published</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=QFGEKh1A90I" target="_blank">How to install and setup Snapraid</a></td>
|
||||
<td>Jun 26, 2023</td>
|
||||
<td>Step-by-step guide to compiling, installing, and automating SnapRAID parity protection.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=fmuiRLPcuJE" target="_blank">How to recover a failed drive using Snapraid</a></td>
|
||||
<td>Jul 31, 2023</td>
|
||||
<td>Demonstrates recovering data from a failed drive in a MergerFS + SnapRAID setup.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=n7piuhTXeG4" target="_blank">How to install and setup MergerFS</a></td>
|
||||
<td>Jun 26, 2023</td>
|
||||
<td>How to install and setup MergerFS for SnapRAID.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=tX5MA-c6Qq4" target="_blank">MergerFS + SnapRAID : Forget about RAID 5 in your Home Server !</a></td>
|
||||
<td>Feb 21, 2023</td>
|
||||
<td>Explains setting up MergerFS and SnapRAID for home server safety equivalent to RAID 5, with Slack notifications.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=fR0XhaWvR1E" target="_blank">DIY Unraid-like functionality</a></td>
|
||||
<td>Jun 12, 2025</td>
|
||||
<td>Builds Unraid-style setup with SnapRAID overview, install, and use starting at 11:26.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=Yt67zz9p0FU" target="_blank">How to build the Perfect Media Server | Part 1 - The Tech Stack</a></td>
|
||||
<td>Apr 22, 2025</td>
|
||||
<td>Overview of building a media server stack, including SnapRAID integration at 19:28.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Linux</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=D2Klx-X7pFo" target="_blank">How to setup a Linux Fileserver with Snapraid and Mergerfs Re-Export</a></td>
|
||||
<td>Apr 23, 2018</td>
|
||||
<td>Guides through setting up SnapRAID with MergerFS on Linux for a simple fileserver, including add/remove drives.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Linux (Italian)</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=5QSkDZi9OzY&" target="_blank">Il RAID è OBSOLETO: la migliore ALTERNATIVA in ambito domestico</a></td>
|
||||
<td>Jun 18, 2023</td>
|
||||
<td>Review di SnapRAID da parte di Morro Linux</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>OpenMediaVault</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=_LLB6x5WOR4" target="_blank">Setting up SnapRAID + mergerfs on OpenMediaVault</a></td>
|
||||
<td>Nov 19, 2023</td>
|
||||
<td>Tutorial for configuring SnapRAID and MergerFS on OpenMediaVault, including drive additions.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>OpenMediaVault</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=9XvY6usHSIA" target="_blank">Setting up MergerFS SnapRaid and file server on OpenMediaVault</a></td>
|
||||
<td>Sep 10, 2023</td>
|
||||
<td>Guides through creating a protected storage pool and file server with MergerFS and SnapRAID.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Windows</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=5IXMM4hfIek">Setting up SnapRAID for Windows (and DrivePool) PART 1</a></td>
|
||||
<td>Apr 28, 2023</td>
|
||||
<td>A detailed guide on installing and configuring SnapRAID on Windows, including integration with DrivePool for disk pooling.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Windows</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=Mw_7x_MCwi0">SnapRAID for Windows (and DrivePool) Part 2 - Recovery</a></td>
|
||||
<td>May 12, 2023</td>
|
||||
<td>The second part of the series, focusing on array modification, data recovery from deletions or corruption, and disk replacement.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Windows</td>
|
||||
<td><a href="https://www.youtube.com/watch?v=kDCMpVgZb4g" target="_blank">How to setup Snapraid and DrivePool in Windows</a></td>
|
||||
<td>Sep 29, 2017</td>
|
||||
<td>Shows how to set up SnapRAID and DrivePool to create a large volume with parity backup for files.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
|
||||
<!--
|
||||
|
||||
COMPARISON
|
||||
<tr>
|
||||
<td><a href="https://www.youtube.com/watch?v=NQJkTiLXfgs" target="_blank">Best RAID for mixed drive sizes. Unraid vs BTRFS vs...</a></td>
|
||||
<td>Dec 7, 2022</td>
|
||||
<td>Compares SnapRAID + MergerFS with other RAID alternatives, including testing results.</td>
|
||||
</tr>
|
||||
|
||||
UNION FS OBSOLETE
|
||||
<tr>
|
||||
<td><a href="https://www.youtube.com/watch?v=FYkdPyCt5FU" target="_blank">Snapraid and Unionfs: Advanced Array Options on Openmediavault</a></td>
|
||||
<td>Mar 1, 2019</td>
|
||||
<td>Explains installing SnapRAID and UnionFS for array backup and efficient disk space use.</td>
|
||||
</tr>
|
||||
|
||||
SPAGNOLO
|
||||
<tr>
|
||||
<td><a href="https://www.youtube.com/watch?v=0UI2qQC6CRs" target="_blank">OpenMediaVault SnapRAID Tutorial</a></td>
|
||||
<td>Jan 2, 2024</td>
|
||||
<td>Step-by-step tutorial for installing and configuring SnapRAID on OpenMediaVault NAS.</td>
|
||||
</tr>
|
||||
-->
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer>
|
||||
<div class="container footer-content">
|
||||
<div class="footer-col">
|
||||
<h3>SnapRAID</h3>
|
||||
<p>Copyright © 2026 Andrea Mazzoleni</p>
|
||||
<p class="license">Distributed under GPL v3 License</p>
|
||||
</div>
|
||||
<div class="footer-col">
|
||||
<h4>Community</h4>
|
||||
<ul>
|
||||
<li><a href="https://www.reddit.com/r/Snapraid/">Reddit r/snapraid</a></li>
|
||||
<li><a href="https://sourceforge.net/p/snapraid/discussion/1677233/">SourceForge Forum</a></li>
|
||||
<li><a href="https://github.com/amadvance/snapraid/">GitHub</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
BIN
beta/tasks.png
Normal file
|
After Width: | Height: | Size: 108 KiB |
181
beta/ui.html
Normal file
|
|
@ -0,0 +1,181 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="A backup program for disk arrays. It stores parity information of your data and it recovers from up to six disk failures">
|
||||
<meta name="keywords" content="snapraid snapshot raid backup disk array redundancy parity">
|
||||
<title>SnapRAID UI & Daemon</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
||||
<script src="script.js"></script>
|
||||
|
||||
<!-- Google Analytics 4 -->
|
||||
<!-- Google tag (gtag.js) -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-W1Z5FKHYQ4"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
|
||||
gtag('config', 'G-W1Z5FKHYQ4');
|
||||
</script>
|
||||
|
||||
<!-- Google Universal Analytics -->
|
||||
<script type="text/javascript">
|
||||
|
||||
var _gaq = _gaq || [];
|
||||
_gaq.push(['_setAccount', 'UA-21967501-1']);
|
||||
_gaq.push(['_trackPageview']);
|
||||
|
||||
(function() {
|
||||
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
||||
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
||||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
||||
})();
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="container nav-container">
|
||||
<a href="index.html" class="logo">
|
||||
<img src="favicon-32x32.png"/>
|
||||
SnapRAID
|
||||
</a>
|
||||
<nav>
|
||||
<input type="checkbox" id="menu-toggle">
|
||||
<label for="menu-toggle" class="menu-icon"><svg viewBox="0 0 24 24" width="24" height="24" fill="currentColor"><path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"/></svg></label>
|
||||
<ul>
|
||||
<li><a href="index" >Home</a></li>
|
||||
<li><a href="ui" class="active">UI & Daemon</a></li>
|
||||
<li><a href="howitworks" >How it Works</a></li>
|
||||
<li><a href="manual" >Manual</a></li>
|
||||
<li><a href="compare" >Compare</a></li>
|
||||
<li><a href="design" >Design</a></li>
|
||||
<li><a href="faq" >FAQ</a></li>
|
||||
<li><a href="support" >Support</a></li>
|
||||
<li><a href="download" class="nav-cta">Download</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
||||
<div class="container" style="padding: 4rem 20px;">
|
||||
<div class="daemon-header" style="text-align: center; margin-bottom: 4rem;">
|
||||
<h3 class="accent-text">NEXT GENERATION</h3>
|
||||
<h1>Classic Reliability<br/>Modern Control</h1>
|
||||
<p style="max-width: 800px; margin: 0 auto;">
|
||||
The SnapRAID Daemon is the modern companion service designed to move your storage from a manual,
|
||||
terminal-based workflow to an "always-on" background intelligence.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-2-cols" style="margin-bottom: 4rem;">
|
||||
<div>
|
||||
<h2>Why the Daemon?</h2>
|
||||
<div style="margin-top: 2rem;">
|
||||
<h3>The "Set-and-Forget" Philosophy</h3>
|
||||
<p>The daemon handles the heavy lifting so you don't have to. It proactively monitors array health and manages the parity lifecycle in the background. If it detects a massive accidental deletion or a hardware error, it triggers a Safety Freeze, protecting your parity until you intervene. It is the intelligence that knows when to work and the restraint to stay silent when your disks are idle.</p>
|
||||
<h3>The Modern Visual Experience</h3>
|
||||
<p>Move your management from the terminal to the browser. The integrated Web UI provides a high-fidelity command center that is served natively by the daemon, no complex web server setup required.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ui-shot" data-large="dashboard.png" style="width: 110%; min-height: 400px;">
|
||||
<img src="dashboard.png" alt="Daemon Dashboard">
|
||||
<div class="ui-shot-caption">Daemon Dashboard</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2 class="section-title">Feature Spotlight</h2>
|
||||
<div class="grid grid-3-cols">
|
||||
<div class="card">
|
||||
<h3>Autonomous Maintenance</h3>
|
||||
<p class="card-subtitle">SnapRAID on Autopilot</p>
|
||||
<p>Stop managing cron jobs. The daemon handles the full lifecycle of up, diff, sync, and scrub based on your custom schedule, ensuring your parity is never stale.</p>
|
||||
</div>
|
||||
<!--
|
||||
<div class="card">
|
||||
<h3>The Modern Web UI</h3>
|
||||
<p class="card-subtitle">Experience the UI, Forget the CLI</p>
|
||||
<p>A high-performance dashboard with real-time progress bars, ETAs, and a visual "Blocks Age" history map. No CLI required for daily operations.</p>
|
||||
</div>
|
||||
-->
|
||||
<div class="card">
|
||||
<h3>Active Health Guard</h3>
|
||||
<p class="card-subtitle">Listen to Your Disks</p>
|
||||
<p>Beyond parity, the daemon watches the hardware. With integrated SMART monitoring, it detects pre-failure symptoms and rising temperatures before a drive goes dark.</p>
|
||||
</div>
|
||||
<div class="card">
|
||||
<h3>Intelligent Power Management</h3>
|
||||
<p class="card-subtitle">Spin-down Aware Intelligence</p>
|
||||
<p>Intelligent logic ensures disks not accessed by applications are automatically spun down. Routine health probes respect standby states to save energy and hardware life.</p>
|
||||
</div>
|
||||
<div class="card">
|
||||
<h3>Safety Interlocks</h3>
|
||||
<p class="card-subtitle">Defend Against the Accidental</p>
|
||||
<p>Massive accidental deletion? The daemon's safety thresholds will freeze a sync task instantly, protecting your parity from reflecting a disaster</p>
|
||||
</div>
|
||||
<div class="card">
|
||||
<h3>Multi-Channel Alerts</h3>
|
||||
<p class="card-subtitle">In the Loop, Everywhere</p>
|
||||
<p>Whether it's a successful scrub or a critical disk error, get notified via ntfy.sh webhooks, email, or system logs the moment it happens.</p>
|
||||
</div>
|
||||
<div class="card">
|
||||
<h3>Open for Integration</h3>
|
||||
<p class="card-subtitle">The Terminal, Reimagined for Developers</p>
|
||||
<p>Full REST API backend designed for third-party integration. Connect your array to Home Assistant, custom scripts, or mobile apps.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2 style="margin-top: 4rem;">UI Gallery</h2>
|
||||
<div class="ui-gallery">
|
||||
<div class="ui-shot" data-large="disks.png">
|
||||
<img src="disks.png" alt="Dashboard">
|
||||
<div class="ui-shot-caption">Dashboard Overview</div>
|
||||
</div>
|
||||
<div class="ui-shot" data-large="tasks.png">
|
||||
<img src="tasks.png" alt="Disk Health">
|
||||
<div class="ui-shot-caption">Disk Health</div>
|
||||
</div>
|
||||
<div class="ui-shot" data-large="differences.png">
|
||||
<img src="differences.png" alt="Task Manager">
|
||||
<div class="ui-shot-caption">Task Manager</div>
|
||||
</div>
|
||||
<div class="ui-shot" data-large="recovery.png">
|
||||
<img src="recovery.png" alt="File Recovery">
|
||||
<div class="ui-shot-caption">File Recovery</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Preview Overlay -->
|
||||
<div id="ui-preview-overlay">
|
||||
<img id="ui-preview-img" src="" alt="Large Preview">
|
||||
</div>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer>
|
||||
<div class="container footer-content">
|
||||
<div class="footer-col">
|
||||
<h3>SnapRAID</h3>
|
||||
<p>Copyright © 2026 Andrea Mazzoleni</p>
|
||||
<p class="license">Distributed under GPL v3 License</p>
|
||||
</div>
|
||||
<div class="footer-col">
|
||||
<h4>Community</h4>
|
||||
<ul>
|
||||
<li><a href="https://www.reddit.com/r/Snapraid/">Reddit r/snapraid</a></li>
|
||||
<li><a href="https://sourceforge.net/p/snapraid/discussion/1677233/">SourceForge Forum</a></li>
|
||||
<li><a href="https://github.com/amadvance/snapraid/">GitHub</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||