Dataset-Combination / index.html
Parham9292's picture
Update index.html
d7143f5 verified
Raw History Blame Contribute Delete
12.7 kB
<!DOCTYPE html>
<html lang="fa" dir="rtl">
<head>
<meta charset="UTF-8">
<meta
name="viewport"
content="width=device-width, initial-scale=1.0"
>
<title>Persian Dataset Combiner</title>
<link
rel="stylesheet"
href="style.css"
>
</head>
<body>
<div class="app">
<header class="hero">
<div class="logo">
🧩
</div>
<h1>
Persian Dataset Combiner
</h1>
<p>
ترکیب، پاک‌سازی و آماده‌سازی دیتاست‌های فارسی
</p>
</header>
<main>
<!-- SEARCH -->
<section class="card">
<div class="section-title">
<span>🔎</span>
<div>
<h2>جستجوی Hugging Face</h2>
<p>
چند دیتاست را همزمان انتخاب کنید.
</p>
</div>
</div>
<div class="search-row">
<input
id="searchInput"
type="text"
placeholder="مثلاً Persian SFT"
>
<button
id="searchButton"
class="primary"
>
جستجو
</button>
</div>
<div
id="searchStatus"
class="status"
></div>
<div
id="datasetResults"
class="dataset-results"
></div>
<div class="selected-box">
<div class="mini-title">
دیتاست‌های انتخاب‌شده
</div>
<div
id="selectedDatasets"
class="chips"
>
<span class="muted">
هنوز دیتاستی انتخاب نشده
</span>
</div>
</div>
</section>
<!-- MANUAL DATASETS -->
<section class="card">
<div class="section-title">
<span>🧩</span>
<div>
<h2>
افزودن دیتاست به‌صورت دستی
</h2>
<p>
هر دیتاست را در یک خط وارد کنید.
</p>
</div>
</div>
<textarea
id="manualDatasets"
placeholder="username/dataset
username/dataset:config
username/dataset:config:validation"
></textarea>
</section>
<!-- LOCAL FILES -->
<section class="card">
<div class="section-title">
<span>📁</span>
<div>
<h2>
فایل‌های محلی
</h2>
<p>
JSON یا JSONL
</p>
</div>
</div>
<label
class="upload-box"
for="fileInput"
>
<div class="upload-icon">
📤
</div>
<strong>
فایل‌ها را انتخاب کنید
</strong>
<span>
JSON / JSONL
</span>
</label>
<input
id="fileInput"
type="file"
accept=".json,.jsonl,application/json"
multiple
hidden
>
<div
id="fileList"
class="file-list"
></div>
</section>
<!-- AUTH -->
<section class="card">
<div class="section-title">
<span>🔐</span>
<div>
<h2>
احراز هویت Hugging Face
</h2>
<p>
برای ساخت و آپلود Dataset Repository
</p>
</div>
</div>
<input
id="hfToken"
type="password"
placeholder="hf_..."
autocomplete="off"
>
<div class="warning">
⚠️ توکن در مرورگر استفاده می‌شود.
از Token با دسترسی محدود استفاده کنید.
</div>
</section>
<!-- CLEANING -->
<section class="card">
<div class="section-title">
<span>🧹</span>
<div>
<h2>
پاک‌سازی و کیفیت
</h2>
</div>
</div>
<div class="settings-grid">
<label class="toggle">
<input
id="deduplicate"
type="checkbox"
checked
>
<span>
حذف duplicate
</span>
</label>
<label class="toggle">
<input
id="shuffle"
type="checkbox"
checked
>
<span>
Shuffle
</span>
</label>
<label class="toggle">
<input
id="rejectSpam"
type="checkbox"
checked
>
<span>
حذف متن‌های تکراری/اسپم
</span>
</label>
</div>
<div class="fields">
<div>
<label>
حداقل کاراکتر
</label>
<input
id="minChars"
type="number"
value="2"
min="0"
>
</div>
<div>
<label>
حداکثر کاراکتر
</label>
<input
id="maxChars"
type="number"
value="0"
min="0"
>
<small>
0 = بدون محدودیت
</small>
</div>
<div>
<label>
حداقل نسبت فارسی
</label>
<input
id="persianRatio"
type="number"
value="0"
min="0"
max="1"
step="0.05"
>
<small>
مثلاً 0.7
</small>
</div>
</div>
</section>
<!-- SAMPLING -->
<section class="card">
<div class="section-title">
<span>⚖️</span>
<div>
<h2>
Sampling
</h2>
<p>
وزن هر دیتاست را تعیین کنید.
</p>
</div>
</div>
<textarea
id="weights"
placeholder="username/dataset=1
username/math=0.5
username/noisy=0"
></textarea>
<div class="fields">
<div>
<label>
حداکثر رکورد
</label>
<input
id="maxRecords"
type="number"
value="0"
min="0"
>
<small>
0 = بدون محدودیت
</small>
</div>
<div>
<label>
Validation (%)
</label>
<input
id="validation"
type="number"
value="0"
min="0"
max="50"
>
</div>
<div>
<label>
Seed
</label>
<input
id="seed"
type="number"
value="42"
>
</div>
</div>
</section>
<!-- REPOSITORY -->
<section class="card">
<div class="section-title">
<span>🚀</span>
<div>
<h2>
Repository مقصد
</h2>
</div>
</div>
<div class="fields">
<div class="wide">
<label>
Dataset Repository
</label>
<input
id="repoName"
type="text"
placeholder="username/my-persian-dataset"
>
</div>
<div>
<label>
Visibility
</label>
<select id="visibility">
<option value="private">
Private
</option>
<option value="public">
Public
</option>
</select>
</div>
</div>
</section>
<!-- ACTION -->
<button
id="buildButton"
class="build"
>
🚀 ساخت و آپلود دیتاست
</button>
<!-- PROGRESS -->
<section
id="progressSection"
class="card progress-card hidden"
>
<div class="progress-header">
<span>
وضعیت پردازش
</span>
<strong id="progressPercent">
0%
</strong>
</div>
<div class="progress-bar">
<div
id="progressBar"
class="progress-value"
></div>
</div>
<div
id="progressText"
class="progress-text"
>
آماده...
</div>
</section>
<!-- LOG -->
<section class="card">
<div class="section-title">
<span>📊</span>
<div>
<h2>
گزارش
</h2>
</div>
</div>
<pre
id="log"
class="log"
>آماده...</pre>
</section>
<!-- RESULT -->
<section
id="result"
class="result hidden"
>
<div class="result-icon">
✅
</div>
<h2>
دیتاست آماده شد!
</h2>
<p id="resultInfo"></p>
<div class="result-buttons">
<button
id="downloadTrain"
class="primary"
>
⬇️ دانلود train.jsonl
</button>
<button
id="repoButton"
class="secondary"
>
🔗 مشاهده Repository
</button>
</div>
</section>
</main>
<footer>
ConfigFars Dataset Tools
</footer>
</div>
<script src="script.js"></script>
</body>
</html>