Add Arabic documentation

README.ar.md

@@ -0,0 +1,97 @@
+<div dir="rtl">
+
+# block-ui.js
+
+<p>
+<a href="https://github.com/vzool/block-ui.js/blob/main/README.md"><img src="https://img.shields.io/badge/lang-en-green.svg" alt="en" data-canonical-src="https://img.shields.io/badge/lang-en-green.svg" style="max-width: 100%;"></a>
+<a href="https://npmjs.org/package/block-ui.js" title="View this project on NPM"><img src="https://img.shields.io/npm/v/block-ui.js.svg" alt="NPM رقم الاصدارة في مدير حزم مكتبات" /></a>
+</p>
+
+مكون إضافي بسيط ولكنه قوي بالجافا سكريبت خالص وذلك لعرض صفحة انتظار تمنع المستخدم من التفاعل مع الصفحة أثناء تنفيذ إجراءات متعددة في الخلفية.
+
+![لقطة شاشة](screenshot.gif)
+
+## التثبيت (Installation)
+
+### مدير حزم مكتبات NPM الخاصة بـ Node.js
+
+```bash
+npm install block-ui.js
+```
+
+### مدير حزم مكتبات Yarn الخاص بـ Node.js
+
+```bash
+yarn add block-ui.js
+```
+
+### شبكة توصيل المحتوى (Content Delivery Network - CDN)
+
+```html
+<script src="https://unpkg.com/block-ui.js"></script>
+```
+
+## الاستخدام (Usage)
+
+### الدمج البرمجي (Import)
+
+</div>
+
+```javascript
+import 'block-ui.js';
+```
+<div dir="rtl">
+
+### التهيئة (Initialize)
+
+```javascript
+document.vzool_blockui_image = 'https://i.imgur.com/3g7OaQx.gif'; // or local file like loader.gif
+document.vzool_blockui_background = '#121111'; // optional
+document.vzool_blockui_color = '#ffffff'; // optional
+```
+
+### حجب الصفحة (Block UI)
+
+يجب أن يكون هناك عنصر بمعرف `id` في الصفحة لحظره باستخدام مُحمل gif ولون الخلفية المحدد في `document.vzool_blockui_background` و `document.vzool_blockui_color` المتغيرات أعلاه.
+
+```javascript
+BlockUI("container").show(); // not #container
+```
+
+### حالة حجب الصفحة (Block UI Status)
+
+```javascript
+BlockUI("container").blocked(); // true or false
+```
+
+### تحديث رسائل حجب الصفحة (Update Messages)
+
+
+```javascript
+BlockUI("container").message("<h1 style='padding-top: 190px;'>Loading...</h1>"); // set message
+BlockUI("container").message(); // clear the message
+```
+
+يمكنك استخدام `padding-top` أو `padding-bottom` لتحريك الرسالة لأعلى أو لأسفل وفقًا لذلك ، لذا فهي محتوى `HTML` ، ويمكنك التحديث بأي شيء صالح لـ `HTML`.
+
+* ملاحظة: يجب تهيئته باستدعاء `show()` أولاً ، وإلا فلن يعمل وسيُعيد فقط `false`.
+
+### إزالة حجب الصفحة (Unblock UI)
+
+</div>
+
+```javascript
+BlockUI("container").hide();
+```
+
+<div dir="rtl">
+
+### المرجع (Reference)
+
+https://onezeronull.com/2013/03/25/simple-element-blocker-with-and-without-jquery/#comment-842
+
+### الترخيص (License)
+
+ISC License
+
+</div>

README.md

@@ -1,7 +1,14 @@
 # block-ui.js
 
+<p>
+<a href="https://github.com/vzool/block-ui.js/blob/main/README.ar.md"><img src="https://img.shields.io/badge/lang-ar-green.svg" alt="ar" data-canonical-src="https://img.shields.io/badge/lang-en-green.svg" style="max-width: 100%;"></a>
+<a href="https://npmjs.org/package/block-ui.js" title="View this project on NPM"><img src="https://img.shields.io/npm/v/block-ui.js.svg" alt="NPM version" /></a>
+</p>
+
 A simple but powerful vanilla pure javascript plugin to block user interaction with a page while an action is being performed in the background.
 
+![Screenshot](screenshot.gif)
+
 ## Installation
 
 ### NPM
@@ -27,7 +34,7 @@ yarn add block-ui.js
 ### Import
 
 ```javascript
-import BlockUI from 'block-ui.js';
+import 'block-ui.js';
 ```
 
 ### Initialize
@@ -46,6 +53,12 @@ There should be an element with `id` identifier in the page to block it with loa
 BlockUI("container").show(); // not #container
 ```
 
+### Block UI Status
+
+```javascript
+BlockUI("container").blocked(); // true or false
+```
+
 ### Update Messages
 
 
@@ -64,6 +77,10 @@ You can use `padding-top` or `padding-bottom` to move the message up or down acc
 BlockUI("container").hide();
 ```
 
+### Reference
+
+https://onezeronull.com/2013/03/25/simple-element-blocker-with-and-without-jquery/#comment-842
+
 ### License
 
 ISC License

package.json

@@ -1,6 +1,6 @@
 {
   "name": "block-ui.js",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "Library to block UI elements with loading image",
   "main": "block-ui.js",
   "scripts": {
@@ -11,9 +11,11 @@
     "url": "git+https://github.com/vzool/block-ui.js.git"
   },
   "keywords": [
-    "BlockUI",
-    "Pure Javascript",
-    "Javascript"
+    "blockui",
+    "blockui-plugin",
+    "pure-javascript",
+    "javascript",
+    "front-end"
   ],
   "author": "Abdelaziz Elrashed <[email protected]>",
   "license": "ISC",