تولید شده برای استدیوی هروف
HeCSS Library Logo

HeUI ابزاری ساده ولی توانمند برای تولید ابزار داینامیک در صفحات وب

پروژه HeUI در ادامنه مسیر تولید کتابخانه شیوه نامه های هِه برای رفع نیازهای نرم افزار استدیوی هروف تولید شده است و این ابزار در کنار کتابخانه HeCSS با حجم بسیار کم و کاربرد ساده به شما امکان تولید ابزار متفاوت داینامیک در صفحات وب را می دهد.

آخرین نسخه: v1.0.900 . نسخه های قبلی

0 دانلود

کتابخانه HeUI

کتابخانه HeUI مجموعه اسکریپت هایی به زبان جاوا اسکریپت هستند که در کنار کتابخانه شیوه نامه های هِه امکان تولید فرم ها و اجزای مختلف داینامیک برای صفحات وب را فراهم می سازد. این مجموعه با تولید ابزار مورد نیاز توسعه دهندگان که به صورت پیش فرض در دسترس برای توسعه نیست به بالا بردن سرعت تولید کمک می کند.

شما با دریافت و قراردادن فایل he.ui.min.js در کنار کتابخانه HeCSS می توانید شروع به استفاده از امکانات این کتابخانه ها کنید. توجه داشته باشید که این کتابخانه با استفاده از کتابخانه شیوه نامه های هِه می تواند اقدام به ارائه قابلیت های خود نماید و در غیر این صورت شما نمی توانید از قابلیت های کتابخانه HeUI استفاده کنید.

شروع کار با HeUI

برای استفاده از کتابخانه HeUI ابتدا فایل کتابخانه را دانلود کنید و آن را در پوشه مورد نظر خود کپی کنید و سپس با قرار دادن لینک فایل he.ui.min.js یا he.ui.js مانند مثال بعدی در HTML صفحه پروژه، به امکانات کتابخانه دسترسی پیدا کنید.

                
<html>
    <head>
        [ header tags ]
        <link rel="stylesheet" href="[ your path to HeCSS ]/he.min.css">
        <script type="text/javascript" src="[ your path to HeUI ]/he.ui.min.js"></script>
    </head>
    <body> ...
                
            

اجزا استاتیک

برای افزودن سرعت در توسعه و کاهش کدهای مورد نیاز برای تولید اجزا صفحات وب کتابخانه HeUI کلاسهایی را به توسعه دهندگان ارائه می دهد که زودتر به خواسته خود برسند. برای استفاده از این امکانات مانند نمونه ها از کلاس های ارائه شده استفاده کنید.

افزودن صفحه بارگزاری (Splash Screen):

با قرار دادن یک نگهدارنده محتوا در بالاترین نقطه صفحه بلافاصله پس از تگ body می توانید صفحه بارگزاری به نرم افزار اضافه کنید.


<div class="he-splash">
    <div class="he-cell he-middle">
        [Logo & title]
    </div>
</div>
        

برای تایین مدت حداقل زمان نمایش صفحه بارگزاری می توان از طریق افزودن اسکریپت زیر به صفحه مدت زمان مورد نظر خود را به ثانیه مشخص کنید.


let HeSplashTime = 3.0;
        
تصویر پس زمینه با استفاده از دیتاست:

برای استفاده از تصاوبر پس زمینه به صورت دینامیک و بدون استفاده از کد CSS می توانید از این کلاس و دیتاست استفاده کنید.


<div class="he-bg" data-bg="background.png"></div>
        
لیزخوردن به بالا در زمان مرور:

برای نمایش افکت لیز خوردن به بالا و ظاهر شدن بخش هایی از صفحه به این شیوه می توانید از این کلاس استفاده کنید.

برای مشاهده نمونه صفحه را مجددا بارگزاری کنید. و از بالای صفحه به پایین بیایید.

نمونه
سلام دوست من

از این کلاس می توانید برای تصاویر، متون و بخش های محتلف درون صفحه استفاده کنید.


<img class="he-slidein" src="product.png" >
        

<div class="he-slidein">
    Some content...
</div>
        
لرزش اجزا صفحه:

برای نمایش افکت لرزش اجزا صفحه می توانید مانند نمونه از این دستورات استفاده کنید.


HeShake([obj or id]);
        
نمونه
بلرز بلرزون
دنبال کردن با scroll:

برای دنبال کردن بخشی از صفحه در هنگام Scroll می توانید مانند نمونه از این دستورات استفاده کنید.

برای فرم های بارگزاری شده با Ajax:

readyHeFollowScroll();

برای فراخوانی با اسکریپت:

HeFollowScroll([element OR id]);
نمونه
من دنبال می کنم!

اجزا داینامیک

کتابخانه HeUI ابزار متنوعی را برای تولید اجزا داینامیک در صفحات وب برای ایجاد امکانات بیشتر برای ارائه محتوا و جلب توجه بازدیدکندگان در دستگاه های مختلف فراهم می آورد. با استفاده از کلاسهای این کتابخانه می توانید بدون نیاز به نوشتن کدهای اسکریپت، امکانات مختلفی را به صفحات خود اضافه کنید.

عملکرد کلیک:

برای تعریف عملکرد کلیک بر روی دکمه یا محدوده می توانید از این کلاس و دیتاست استفاده کنید.

نمونه
close این باکس را حذف کنید.
google.com

<a class="he-click" data-remove="#removing_item">remove</a>
<div id="removing_item">
    ...
</div>
        

توجه داشته باشید که در دیتاست ها مشخص کنید که هدف شما کلاس یا id یک بخش است.

نمایش با حرکت موشواره و نا پدید با کلیک:

برای ایجاد منو های متفاوب و یا نمایش توضیحات و راهنما می توانید از این کلاس استفاده کنید

در صورتی که بیش از یک آیتم در صفحه به این شیوه نمایش داده می شوند می توانید با استفاده از این کلاس مشخص کنید که با باز شدن یکی دیگری بسته شود.

برای بستن بخشی از صفحه با کلیک یا تماس بر روی صفحه می توانید از این کلاس استفاده کنید

نمونه
گندم گون

<a class="he-hover" data-hover="#item1">help</a>
<div id="item1" class="absolute he-hover-target hidden he-hide-on-click">
    [Help Card]
</div>
        

توضیحات پیشرفته

برای فرم های بارگزاری شده با Ajax:

readyHeHover();
            
readyHeHover();
        

برای فراخوانی جداگانه یک بخش مخفی:

callHeHover(destination);

متغیر destination می تواند به کلاس یا id یک تکه از صفحه اشاره کند.

            
callHeHover('#objId');
        
            
callHeHover('.class-name');
        

برای بستن جداگانه همه object های دارای کلاس he-hide-on-click:

HeHideOnClick(callback);
            
document.onclick = function() { 
    HeHideOnClick(callback); 
};
        
اسکریپت با حرکت موشواره خارج از مساحت:

برای اجرای اسکریپت خاصی در زمان حرکت موشواره به خارج از کادر مساحت Object می توانید از این اسکریپت استفاده کنید

شمارنده:
برای نمایش شمارنده در صفحه می توان از این کلاس ها استفاده کرد.
نمونه:
تعداد دانلود: ۰
sync دوباره بشمار

برای فرم های بارگزاری شده با Ajax:

readyHeCount();

برای فراخوانی با اسکریپت:

HeCount(element, force = null, callback = null);

برای شمارش به عدد جدید:

HeCountUpdate(element, end, start = null, callback = null);
.he-count data-start data-end data-duration data-farsi data-commas data-onscroll
            
<b class="he-count" data-end="100"></b>
        
            
<b class="he-count" 
      data-start="1"
      data-end="100"
      data-farsi="true"
      data-onscroll="true"
      data-commas="true"
      data-duration="3" ></b>
        
منوی کلیک راست اختصاصی:
برای نمایش منوی کلیک راست اختصاصی در صفحه می توان از این کلاس ها استفاده کرد.
نمونه:

روی آیتم های زیر کلیک راست کنید و یا در موبایل انگشت خود را نگه دارید.

  • Test1
  • Test2

برای نمایش اختصاصی راست به چپ

مقدار data-value:

با کلیک راست بر روی هر یک از اشیا در صفحه می توانید از طریق JavaScript مقدار data-value شی را از متغییر HeContextmenuValue دریافت کنید.

.he-contextmenu-caller data-menu data-value rtl
            
<a class="he-contextmenu-caller" 
    data-menu="contextmenu" data-value="Test1">
    Test1
</a>
<a class="he-contextmenu-caller" 
    data-menu="contextmenu" data-value="Test2">
    Test2
</a>
        
منو:

<div id="contextmenu" class="he-contextmenu">
    <a onclick="alert(HeContextmenuValue);">Edit</a>
    <a onclick="alert(HeContextmenuValue);">Delete</a>
</div>
        
برگه های زبانه دار:
برای تولید زبانه های مختلف در یک صفحه و نمایش محتوا بیشتر در فضای محدود می توانید از این کلاس ها برای تولید زبانه ها دار و برگه های زبانه استفاده کنید.

شما با استفاده از این کلاس ها محدودیتی برای تعداد تولید برگه های زبانه دار در یک صفحه ندارید و می توانید به تعداد دلخواه زبانه و برگه زبانه دار درست کنید.

.he-tabs data-rel id
id
            
<table class="he-tabs" data-rel="tabpages" id="tabListId">
    <tr>
        <td data-id="0" class="he-tab-item selected">
            <a href="https://www.horuph.com">tab 1</a>
        </td>
        <td data-id="1" class="he-tab-item">
            <a>tab 2</a>
        </td>
        <td data-id="2" class="he-tab-item disabled">
            <a>tab 3</a>
        </td>
        <td class="he-border-bottom-light"></td>
    </tr>
</table>
<div id="tabpages">
    <div data-id="0" class="he-tab-page">
        page 1
    </div>
    <div data-id="1" class="he-tab-page hidden">
        page 2
    </div>
    <div data-id="2" class="he-tab-page hidden">
        page 3
    </div>
</div>
            

توضیحات پیشرفته

برای همه برگه های زبانه دار در صفحه بارگزاری شده با Ajax:

readyHeTabs();
            
readyHeTabs();
        

فراخوانی برگه های زبانه دار با Id در صفحه بارگزاری شده با Ajax:

HeTab(tabListId);

متغیر tabListId به Id نگهدارنده برگه های زبانه دار اشاره کند.

            
HeTab(tabListId);
        

برای فراخوانی جداگانه یک زبانه توسط اسکریپت:

HeTabSelect(tabListId, selectedTabID);

متغیر tabListId به Id نگهدارنده زبانه های برگه ها اشاره کند. متغیر selectedTabID به Id ذخیره شده در دیتاست data-id برگه زبانه دار مورد نظر اشاره کند.

            
HeTabSelect(tabListId, selectedTabID);
        
منوی کشویی کناری:

برای افزودن منو های کشویی که از کنار صفحه باز می شوند می توانید مطابق مثال از این کلاس ها و دیتاست ها استفاده کنید.

نمونه:
منوی راست
منوی چپ

<div id="sidemenu" class="he-menu-side">
    <a class="closer">Menu</a>
</div>
<a class="he-menu-side-opener" data-id="sidemenu">OPEN</a>
        

فراخوانی در صفحه بارگزاری شده با Ajax:

readyHeMenuSide();

readyHeMenuSide();
        

بازکردن منو با اسکریپت:

showHeMenuSide(menuId);

showHeMenuSide(menuId);
        

بستن منو با اسکریپت:

closeHeMenuSide(menuId);

closeHeMenuSide(menuId);
        
نمایش toast:
این کلاس در صفحه toast نمایش می دهد.
            
HeToast(text);
            
        
نمایش زمان سپری شده:
با این کلاس می توانید زمان سپری شده را به صورت زنده نمایش دهید.
نمونه:
این صفحه ... پیش باز شده است
This page is opened ... age.

<b class="he-time" data-lang="fa" data-time="2021/11/29 02:27:31"></b>
            

فرمت:


date('Y/m/d H:i:s');
            
        
نمایش چرخ و فلک:
با این کلاس می توانید به محتواهای مورد نظر را به صورت چرخ و فلک نمایش دهید.

دیتاست های مرتبط با این کلاس می تواند به شما در اختصاصی سازی بیشتر چرخ و فلک کمک نماید.

data-time: برای مشخص کردن مدت زمان تغییر خودکار اسلاید به ثانیه است.
data-columns: تعداد ستون های نمایش داده شده در هر صفحه از چرخ و فلک.
data-mobilecolumns: تعداد ستون های نمایش داده شده در هر صفحه برای موبایل.
data-width: عرض محدوده صفحه برای چرخ و فلک به درصد.
data-options: سایر امکانات قابل تغییر شامل.
dots: نمایش نقاط راهبر.
arrows: نمایش پیکان های راهبر.
loop: بازگشت به اول بعد از آخرین اسلاید.
stopOver: توقف حرکت در حالت نمایش زمان دار با نگه داشتن موشواره بر روی اسلاید.
.he-carousel .ltr .rtl

<div class="he-carousel" data-columns="2" data-time="5">
    <div class="center">
        <img src="image1.png">
    </div>
    <div class="center">
        <img src="image2.png">
    </div>
    <div class="center">
        <img src="image3.png">
    </div>
</div>
        

برای فرم های بارگزاری شده با Ajax:

readyHeDatePicker();
            
readyHeDatePicker();
        
نمونه:

ورودی های داده

کتابخانه HeUI ابزار مختلفی برای تولید ورودی های فرمهای داینامیک به جهت ایجاد سهولت در تکمیل فرم برای بازدیدکندگان و استفاده کننده گان این فرم ها فراهم می آورد. برای استفاده از این ابزار نمونه های توضیح داده شده را مطالعه کنید.

ارسال با لینک:

برای ایحاد امکان ارسال (Submit) فرم های Server Side توسط لینک می توانید از این کلاس استفاده کنید.

نمونه

<form>
    <input type="text" name="search">
    <a class="he-submit">submit</a>
</form>
        

برای فرم های بارگزاری شده با Ajax:

readyHeSubmit();
            
readyHeSubmit();
        
بازه انتخاب:

برای تولید ورودی داده به صورت انتخاب بازه یا محدوده با استفاده از کلاس و تگ های توضیح داده شده می توانید مانند مثال ورودی داده را به صفحه مورد نظر اضافه کنید.

برای قرار دادن ابزار انتخاب بازه در صفحه وب به وسیله کتابخانه HeUI دو روش اصلی وجود دارد که می توانید استفاده کنید.

روش اول

ساده ترین روش قرار دادن ابزار انتخاب بازه محدوده در صفحه وب مانند نمونه روش اول و تنها با استفاده از یک تگ و دیتاست های مرتبط است.

مقادیر قابل انتخاب و نمایش در این روش تنها مقادیر عددی صحیح است.

data-start: این دیتاست برای مشخص کردن مقدار حداقل برای بازه است.
data-end: این دیتاست برای مشخص کردن مقدار حداکثر برای بازه است.
data-min: این دیتاست برای مشخص کردن مقدار حداقل پیشفرض انتخاب شده برای بازه است.
data-max: این دیتاست برای مشخص کردن مقدار حداکثر پیشفرض انتخاب شده برای بازه است.
data-action: مشخص کردن متد برای فراخوانی در زمان تغییر مقدار
data-end-plus: برای نمایش + در مقدار حداکثر بازه است.
نمونه
بازه انتخاب خود را مشخص کنید:
روش اول:

<div class="he-range" id="slider" 
        data-start="1" data-end="20" 
        data-min="6" data-max="15"
        data-end-plus="true" >
</div>
<div>
    <span class="float-left" id="slider-min-text"></span>
    <span id="slider-max-text"></span>
</div>
        

روش دوم

با این روش ما می توانید به صورت خصوصی سازی شده مقادیر ورودی و نمایش آنها را مشخص کنید. برای این کار کافی است به جای مشخص کردن مقادیر دیتاست data-start, data-end, data-min, data-max مانند نمونه با استفاده از تگ های فرزند برای تگ دارای کلاس he-range استفاده کنید.

در این شیوه دیتاست data-value در تگ های فرزند برای مقدار قابل انتخاب و متن تگ برای نمایش مقدار استفاده می شود.

با استفاده از دستاست های data-min و data-max با مقدار true برای تگهای فرزند می توانید حداقل و حداکثر انتخاب شده برای بازه را مشخص نمایید

در این روش مقدار بازگشت داده توسط ابزار برای حداقل و حداکثر index آیتم انتخاب شده است.

نمونه
بازه سن را مشخص کنید:
0 ماه 3 ماه 6 ماه 1 سال 2 سال 3 سال 5 سال 10 سال 20 سال
روش دوم:

<div class="he-range" id="slider" data-end-plus="true">
    <i data-value="0">0 ماه</i>
    <i data-value="3">3 ماه</i>
    <i data-value="6" data-min="true">6 ماه</i>
    <i data-value="12">1 سال</i>
    <i data-value="24">2 سال</i>
    <i data-value="36" data-max="true">3 سال</i>
    <i data-value="60">5 سال</i>
    <i data-value="120">10 سال</i>
    <i data-value="240">20 سال</i>
</div>
<div>
    <span class="float-left" id="slider-min-text"></span>
    <span id="slider-max-text"></span>
</div>
        

نمایش مقادیر انتخاب شده

کتابخانه HeUI برای باز گذاشتن دست توسعه دهنده در شیوه نمایش ابزار در صفحه قرار دادن محل و شیوه نمایش مقادیر حداقل و حداکثر انتخاب شده توسط کاربر را به عهده توسعه دهنده قرار داده است.

برای رسیده به این منظور می بایست مانند مثال ها با همان id انتخاب شده برای تگ دارای کلاس he-range تگ های نمایش مقادیر حداقل و حداکثر را تغریف کنید.

روش اول:

<div class="he-range" id="slider" data-start="1" data-end="10" ></div>
<span id="slider-min-text"></span>
<span id="slider-max-text"></span>
    

دریافت مقادیر سمت سرور

مقادیر قابل دسترسی سمت سرور:

کتابخانه HeUI برای شما در صفحه دو ورودی غیرقابل رویت برای دریافت مقدار حداقل و مقدار حداکثر با نام هایی مانند نمونه می سازد که قابل دسترسی است.

(id)_min
(id)_min

توضیحات پیشرفته

برای فرم های بارگزاری شده با Ajax:

readyHeRange();
            
readyHeRange();
        

object های قابل دسترسی با Javascript:

heRange['(id)'].minValue
heRange['(id)'].maxValue
ادیتور WYSIWYG:

برای ایجاد ادیتور WYSIWYG یا Rich text editor ساده در صفحه برای ورود متن و تصویر بهینه شده می توانید از این کلاس برای textarea استفاده کنید.

با دستوراتی که در دیتاست data-buttons ثبت می کنید می توانید مشخص کنید که چه دکمه هایی برای ابزار WYSIWYG نمایش داده شوند.

نمونه

<textarea id="wysiwyg" class="he-editor" data-buttons="link,alignment"></textarea>
    

همچنین با نوشتن مقدار true برای data-spellcheck می توانید مشکلات نگارشی و نوشتاری در صفحه را به کاربر علامت دهید.


<textarea class="he-editor" data-spellcheck="true"></textarea>
        

برای فرم های بارگزاری شده با Ajax:

readyHeEditor();
            
readyHeEditor();
        
انتخابگر تاریخ:

با استفاده از این کلاس و دیتاست ها برای نمایش انتخابگر تاریخ برای تاریخ میلادی و همچنین جلالی استفاده کنید.

با دستوراتی که در دیتاست data-options ثبت می کنید می توانید ویزگی های انتخابگر تاریخ را مشخص کنید.

نمونه

نمونه برای تاریخ شمسی (جلالی)

نمونه برای تاریخ میلادی


<div class="relative">
    <input id="datepicker" 
              class="he-datepicker"
              data-disable="friday" 
              data-type="jalali" 
              data-options="autoClose" >
</div>
        

نمونه استفاده به عنوان ورودی داده:

برای فرم های بارگزاری شده با Ajax:

readyHeDatePicker();
            
readyHeDatePicker();
        

تایید صحت ورودی داده ها

کتابخانه HeUI برای تایید صحت فرم های ورودی به توسعه دهندگان امکاناتی ارائه می دهد که به سادگی و بدون نیاز به اسکریپت و کد اضافه تایید صحت فرم های سمت سرور را انجام دهند. این امکانات به سادگی برای فرم هایی که به صورت Ajax ارسال می شوند نیز قابل استفاده است.

برای فرم هایی که با Ajax ارسال می شوند تایید صحت توسط اسکریپت انجام می وشد و به عهده توسعه دهنده است.

تایید صحت فرم های سمت سرور:

برای فعال کردن تایید صحت برای فرم سمت سرور این کلاس را به فرم اضافه کنید

برای مشخص کردن نوع تایید صحت اعمال شونده برای ورودی داده می توانید از کلاس، دیتاست و ویژگی های روبرو استفاده کنید.

حتما توجه داشته باشید که اسکریپت های سمت کاربر به تنهایی برای تایید صحت داده ورودی کافی نیستند و توسعه دهنده می بایست سمت سرور نیز صجت داده های ورودی را بررسی نماید.

این ابزار برای کمک به کاربر برای تکمیل صحیح فرم و کاستن از نیاز به بازگشت به فرم برای اصلاح اطلاعات است.

نمونه
ایمیل:
تلفن:
تعداد:
نام:
تاریخ:
متن:
کشور:
ورزش:
انتخاب کنید:

برای مشاهده کارکرد نمونه روی دکمه ارسال کلیک کنید.


<form class="he-validate">
    <div class="he-table-form">
        <div class="he-row">
            <div class="he-cell-text">email:</div>
            <div class="he-cell-input">
                <input class="req-email">
            </div>
        </div>
        <div class="he-row">
            <div class="he-cell-text">phone:</div>
            <div class="he-cell-input">
                <input class="req-phone">
            </div>
        </div>
        <div class="he-row">
            <div class="he-cell-text">name:</div>
            <div class="he-cell-input">
                <input class="req-min" data-min="3" maxlength="50">
            </div>
        </div>
    </div>
    <div class="he-form-buttons">
        <input type="submit" value="Submit" >
    </div>
</form>
        

توضیحات پیشرفته

برای فرم های بارگزاری شده با Ajax:

            
window.addEventListener('DOMContentLoaded', (event) => {
    readyHeValidate([foromId]); 
});
        

برای تایید صحت فرم با اسکریپت:

returns: true OR false
            
HeValidateForm(foromId); 
        

برای استفاده در اسکریپت:

برای تایید صحت یک مقدار در اسکریپت های خود می توانید از این متد ها استفاده کنید.

            
if(HeValidateEmail(emailAddress)) {
    alert('Email is valid');
}
        

مقدار بازگشت داده شده توسط این متدها به صورت bool با مقدار true یا false است.

نمایش اعداد:

برای نمایش اعداد می توانید از این اسکریپت استفاده کنید.

نمونه

عدد


var numberWithCommas = HeCommas(n);
        

window.addEventListener('DOMContentLoaded', () => { 
    readyHeCommas(); 
});
        
قدرت سنجی کلمه عبور:

برای بررسی قدرت کلمه عبور وارد شده می توانید از این اسکریپت استفاده کنید.

نمونه

کلمه عبور


<input type="password" id="passwordId">
        

window.addEventListener('load', () => { 
    HePassCheck('passwordId'); 
});
        

توابع قابل استفاده

کتابخانه HeUI مجموعه ای توابع است که برای ساختن ابزار از آنتها استفاده می شود. برخی از این توابع به تنهایی می توانند در تولید سایر بخشهای یک نرم افزار می تواند مورد استفاده قرار بگیرد.

تبدیل تاریخ:

با استفاده از این کدهای می توانید تاریخ شمسی (جلالی) را به تاریخ میلادی و یا بلعکس تبدیل کنید.

نمونه Json
{ y: 1440, m: 1, d: 22 }

var json = toJalali(y, m, d);
        

var json = toGregorian(y, m, d);
        

var days = jalaliMonthLength(y, m); // int
        
تبدیل اعداد به فارسی:

با استفاده از این تابع می تونید اعداد متون را به اعداد فارسی تبدیل کنید.

نمونه

var fa_str = toFarsiNumber(123);
        

نسخه های قبلی

همیشه آخرین نسخه کتابخانه اسکریپ های HeUI، کامل ترین و به روزترین نسخه خواهد بود و برای پروژه های جدید پیشنهاد می کنیم همیشه از آخرین نسخه استفاده کنید ولی در صورتی که نیاز به نسخه های قبلی دارید می توانید اینجا فهرست تمامی نسخه ها را در اختیار داشته باشید.

فهرست نسخ کتابخانه هِه یو آی - HeUI:
کتابخانه هِه یو آی (HeUI) به صورت کدِ باز در اختیار شما قرار گرفته است، شما هم می توانید به کمک به این پروژه به بهتر شدن کیفیت کتابخانه کمک کنید.

ساخته شده با تمام ❤️ در دنیا توسط علی پورناصح به سفارش استدیوی هروف.

آخرین نسخه کتابخانه هِه یو آی 1.0.900 است که می توانید از اینجا دریافت کنید.

Code licensed MIT, docs CC BY 3.0.

تولید شده برای