سید حسین رضوی
3 سال پیش توسط سید حسین رضوی مطرح شد
13 پاسخ

نوشتن یه text editor برای کسب تجربه

باسلام
توی آخرین پروژه ای که داشتم کار میکردم در استفاده از تکست ادیتور به مشکل خوردم که تصمیم گرفتم برای اینکه دانش جاوااسکریپت خودمو محک بزنم و همچنین یکم خودمو ارتقا بدم یه تکست ادیتور بنویسم و از سه ادیتور tinymce 5, ckeditor 5, froala به عنوان رفرنس استفاده کنم
حدود 20 روزی هست شروع کردم و فک میکنم باید 3 تا 4 ماه دیگه زمان نیاز داشته باشه
در خواستم از دوستان اینه که هر نظری دارند در این رابطه بفرمایند، چه ظاهر و چه فیچر ها
بیشتر تمرکزم روی فیچرهایی است که این سه ادیتور دارند و در سایر ادیتور ها وجود ندارد ، مثل مدیریت جداول، تصاویر ، بلوک ها و ...
مثلا توی ckeditor 5 وقتی روی یک جدول یا تصویر کلیک کنید دوتا دکمه در اختیارتون میذاره که برای ایجاد پاراگراف در بالا و پایین المنت مورد نظر که توی سایر ادیور ها افزودن پاراگراف بعد از تصاویر یا جداول یه دردسر بزرگه که من همین الان این امکان رو توی ادیتورم قرار دادم، یا هندل هایی که با انتخاب تصاویر به ما کمک میکنند تصویر رو کوچیک یا بزرگ کنیم که اینو هم من تا اینجا پیاده کردم
خلاصه که منتظر نظرات شما دوستان هستم هم در رابطه با ظاهر و هم امکانات
توی فاز اول برنامه ام اینه که ادیتور رو آماده کنم و در فاز بعدی افزودن یه فایل منیجر چیزی شبیه فایل منیجر وردپرس
انشاالله با نظرات و کمک های شما دوستان این کار دور از ذهن نیست
راستی قرار نیست این ادیتور با دستور execcommand کار کنه بلکه تمام موارد به صورت پویا توسط خودم کد نویسی میشه، اگه وبسایت موزیلا رو یه نیگاه بندازید میبینید که گفته این دستور به زودی حذف میشه
در پایان بگم که من یه کد نویس خفن نیستم و فقط برای کسب تجربه دارم این کارو انجام میدم، فردا روزی که انشاالله کدهاشو منتشر کردم نیان بگید که چرا کدهات استاندارد نیست و فلان و فلان مشکلات رو داره


ثبت پرسش جدید
سید حسین رضوی
تخصص : برنامه نویس وب و طراح رابط کار...
@hossein.r.1442 3 سال پیش مطرح شد
0

هندل های تصاویر

اینم تصویری از ظاهر هندل های تصاویر اون تصویر هم لوگوی ادیتوره، اسمش کِکِنیک ادیتور
بخش های دیگه ادیتور ظاهر مشخصی ندارند هنوز برای همین چیز دیگه ای وجود نداره که عکسشو بذارم، چون برای ظاهر هنوز ایده ای ندارم و دوست دارم شما کمک کنید تا ظاهر متفاوتی براش بسازم، من خودم ظاهر froala چشمم رو گرفته


فرزین
تخصص : طراح و توسعه‌دهنده‌ی وب
@farzin 3 سال پیش مطرح شد
2

سلام دوست عزیز
من چند موردی تو ذهنم هست نمی‌دونم اینارو پیاده سازی کردید یا نه ولی به شدت ضروری هستن:
۱- بشه یه فایل css آپشنال بهش پاس داد و از این طریق این امکان رو فراهم کنه که بشه ظاهرش رو به سادگی شخصی سازی کرد.
۲- برای تایپ ریاضیات بهینه سازی بشه.
۳- مدیریت تصاویر محدود به آپلود از سیستم نشه و آپلود از لینک هم داشته باشه.
۴- paragraph direction و text alignment رو کامل داشته باشه.
آرزوی موفقیت دارم براتون و بی صبرانه منتظر دیدن نتیجه هستم.


سید حسین رضوی
تخصص : برنامه نویس وب و طراح رابط کار...
@hossein.r.1442 3 سال پیش مطرح شد
1

@farzin
ممنون از نظر شما دوست عزیز
در رابطه با css مورادی که تا الان پیاده کردم یا توی برنامه ام هست رو میگم خدمتتون، تصاویر هم میتونید بهشون کلاس بدید و هم به صورت inline-style، جداول رو هم به همین صورت که میتونه یا برای کل جدول باشه یا یک سلول خاص یا هر ردیف به صورت جداگانه
و اینکه یه فایل css رو به صورت آپشنال بهش پاس داد رو متوجه نمیشم دقیق منظورتون چیه ولی قراره این امکان رو قرار بدم که با توجه به طرح وبسایت تون بتونید ادیتور رو کاستوم کنید، مثلا هدر ادیتور یا همون بخش دکمه های ادیتور رو بتونید یه جا از وبسایت قرار بدید و wrapper ادیتور رو یه جای دیگه، همچنین رنگ بندی ها و سایر موراد، همچنین کاربر میتونه خودش محل قرار گیری دکمه ها رو مشخص کنه، یعنی بگه این دکمه ها توی یه گروه، این دکمه ها توی یه گروه دیگه و الی آخر و همچنین ترتیب نمایششون یعنی اول این گروه بعد این گروه و.....
برای آپلود تصاویر هم سه نوع برنامه دارم، یکی با زدن روی دکمه افزودن تصویر مستقیم پنجره انتخاب تصویر خود مرورگر نمایش داده بشه، یکی یه پاپ آپ باز بشه که از داخل اون بتونید تصویر رو انتخاب کنید مثل ckeditor و tinymce که این خودش دکمه انتخاب تصویر یا میره از سیستم انتخاب میکنه یا فایل منیجر رو براتون باز میکنه و یکی هم اپلود از url
text align و direction هم کاملا کنترل میشن
در رابطه با تایپ ریاضیات بهش فکر کردم ولی هنوز نتونستم حلش کنم که چطوری مدیریت کنم، یعنی هنوز نتونستم درک کنم که ابزارهایی که این کارو انجام میدن به چه روشی این کارو میکنند


میلاد-م
تخصص : توسعه‌دهنده رابط کاربری - Fron...
@milad 3 سال پیش آپدیت شد
0

این گفتگو بحث هایی رو شامل میشه:
https://roocket.ir/discuss/12411

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


میلاد-م
تخصص : توسعه‌دهنده رابط کاربری - Fron...
@milad 3 سال پیش مطرح شد
1
  1. نسخه سبک و نسخه کامل مجزا از هم داشته باشه.
  2. امکان درج شکلک ها رو داشته باشه.
  3. امکان اضافه کردن کدها باشه.
  4. عکس رو با کشیدن و انداختن، بشه بارگذاری کرد.

میلاد-م
تخصص : توسعه‌دهنده رابط کاربری - Fron...
@milad 3 سال پیش مطرح شد
1

انتخاب زبان راست به چپ و یا چپ به راست رو داشته باشه و به تناسب اون متن راستچین یا چپ چین بشه، دکمه ها هم همینطور.


سید حسین رضوی
تخصص : برنامه نویس وب و طراح رابط کار...
@hossein.r.1442 3 سال پیش مطرح شد
1

@milad
ممنون از نظراتتون
حتما سعی میکنم استفاده کنم مخصوصا

نسخه سبک و نسخه کامل مجزا از هم داشته باشه.


فرزین
تخصص : طراح و توسعه‌دهنده‌ی وب
@farzin 3 سال پیش آپدیت شد
1

@hossein.r.1442
در مورد css آپشنال من توی یکی از نمونه‌های خارجی (یادم نیست کدوم بود) دیدم که برای initialize در کنار سلکتور text area به صورت آپشنال css هم دریافت می‌کرد (میتونید یه object دریافت کنید برای این تنظیمات آپشنال مثل همین css و یا زبان و ...) که میشد ظاهر المنت‌های درون iframe و سایر قسمت‌ها رو باش خیلی ساده شخصی سازی کرد. حالا شما اگه این امکان رو به شکل دیگه ‌ای فراهم کردید که بسیار هم عالی و نیازی به این قضیه نیست.
برای تایپ ریاضی ckeditor یه پلاگین داره اونو بررسی کنید شاید بشه ازش یه ایده‌ای گرفت.


سید حسین رضوی
تخصص : برنامه نویس وب و طراح رابط کار...
@hossein.r.1442 3 سال پیش مطرح شد
2

@farzin
ممنون از شما، برای تایپ ریاضی یه کتابخونه پیداکردم، حالا بررسی کنم اگه تونستم حتما ازش استفاده میکنم


mmjvox
تخصص : QML,Objective-C,Qt/C++,Webasse...
@mmdjv.kh94 3 سال پیش آپدیت شد
1

من جای شما بودم حرکت بنیادین می کردم و این ادیتور رو با opengl (یا لایبرری های برپایه opengl ) می نوشتم که روی بروزرها با cancas استفاده بشه (چون opengl هست خیلی هم سبک و روان اجرا میشه)، که علاوه بر بروزرها هم بتونه جاهای دیگه اجرا بشه.
اینجوری حتی دیگه نیاز نیست برای تغییر فونت یک قسمت، متن اون رو داخل تگ دیگه ای قرار بدید و بعد از یک ادیت طولانی متن شما با تگ های اضافی کثیف نمیشه.
برای توسعه بیشتر به مشکل و محدودیتی برنمیخورید و میتونید قابلیت های تازه و عجیبی بهش بدید.
البته یک مقدار خیلی زیادی کار سخت تر میشه ولی به نظر من به زحمتش می ارزه.
اگه خواستید منم میتونم در این زمینه کمک کنم.


سید حسین رضوی
تخصص : برنامه نویس وب و طراح رابط کار...
@hossein.r.1442 3 سال پیش آپدیت شد
0

@mmdjv.kh94
ممنون از نظرتون
توی canvas زیاد نمیشه روی متن مانور داد، میتونید اینو توی ابزارهایی مثل figma, adobe xd, uxpin و غیره ببینید
موضوع دیگه اینکه درنهایت صفحات وب نیاز به تگ های HTML دارند مگه اینکه ادیتور شما برای ابزراهایی مثل notion و غیره بخواد استفاده بشه که اونم باز میگم قدرت مانور پایین داره
من خودم به این فکر کردم که برای تایپ عبارات ریاضی بیام از canvas استفاده کنم، البته هنوز در حد ایده است و نمیدونم در حد دانش من خواهد بود یا نه


محمد حکمتی
تخصص : مثلا backend
@mohammad.hekmaty 3 سال پیش مطرح شد
1

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


سید حسین رضوی
تخصص : برنامه نویس وب و طراح رابط کار...
@hossein.r.1442 3 سال پیش مطرح شد
0

@mohammad.hekmaty
سلام، ممنون از توجهتون
همونطور که بالاتر هم اشاره کردم هنوز احتمالا بین 3 تا 4 ماه دیگه زمان لازم باشه و همین که منتشر شد همینجا اعلام میکنم، میتونید همین گفتگو رو دنبال کنید


برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام