forked from Namozag/eshkal
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
116 lines (95 loc) · 4.36 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
<html dir="rtl">
<head>
<title>إشكال</title>
<link rel="stylesheet" href='https://cdn.jsdelivr.net/npm/plume-css@1.0.5/lib/plume-all.min.css'>
<style>
@import url(https://fonts.googleapis.com/earlyaccess/droidarabickufi.css);
:root {
--pm-button-rounded-size: 150px;
--pm-primary-color: green;
--pm-secondary-color: yellow;
--pm-font-family-primary: 'Droid Arabic Kufi';
--pm-font-family-secondary: 'serif';
--pm-button-font-size: '300px'
}
h1.title {
direction:rtl;
color:#444;
font-size: 40pt;
font-family: 'Droid Arabic Kufi', serif;
}
.kufi {
direction:rtl;
color:#444;
font-family: 'Droid Arabic Kufi', serif;
}
textarea.main-text {
height: 50%;
font-size: 30;
}
.flex-container {
display: flex;
}
button.action {
/* font-size: 100px; */
width: 300px;
height: 300px;
}
.flex-container {
display: flex;
}
.flex-container > div {
margin: 10px;
}
</style>
</head>
<body onload="init()" class="plume kufi">
<div class="flex-container pm-container" style="height: 90%;">
<div style="flex-grow: 1">
<h1 id='title' class='title'>إشڴاڵ</h1>
<div>
<button id="apply" class="pm-btn-round pm-btn-primary action" onclick="apply()">إشكال</button>
</div>
<div>
<div title="استبدال الحروف الأصلية للكلمة بحروف شبيهة">
<input type="checkbox" class="option" id="option-similar" /> تمويه
</div>
<div title="إخفاء نقاط الحروف">
<input type="checkbox" class="option" id="option-nodots" checked="checked" /> لا نقاط
</div>
<div title="إضافة بعض الحروف الإنجليزية بدلاً من الحروف العربية">
<input type="checkbox" class="option" id="option-english" /> فرنكة
</div>
<div title="إضافة تشكيل عشوائي للكلمة">
<input type="checkbox" class="option" id="option-tashkeel" /> تشكيل
</div>
<div title="إضافة فواصل عشوائية بين أحرف الكلمة">
<input type="checkbox" class="option" id="option-fasel" /> فواصل
</div>
</div>
<hr />
<div>
<div style="width: 170px; font-size: 14px;">
إشكال تساعدك على جعل كلماتك العربية أكثر غموضاً
<br />
الأداة بدائية وليست مضمونة في جعل كلماتك مستعصية على القراءة الآلية للنصوص ولكنها تزيد من صعوبة الأمر وقد تساعد على الإشكال في الفهم للآلة مع الحفاظ قدر الإمكان في الوضوح للبشر
<br />
يتم تجاهل الكلمات المكونة من ثلاثة حروف فأقل والكلامات البادئة بعلامة #
</div>
</div>
</div>
<div style="flex-grow: 11" >
<div>
<textarea id='in' class="main-text"></textarea>
</div>
<div>
<textarea id='out' class="main-text" readonly='true'></textarea>
</div>
<div style="margin-top: 12px;">
<button id="copy" onclick="copyToClipBoard()">نسخ للحافظة</button>
</div>
</div>
</div>
<script src="eshkal.js"></script>
</body>
</html>