עץ דינמי ב HTML - חיפוש קוד פתוח

[Y.Excel.Access]

אני מחפש קוד פתוח הכי קרוב ל:

• עץ דינמי של HTML
• ללא קישורים חיצוניים (HTML JS ו CSS טהורים), זה מיועד לשמירה כקובץ טקסט בסיומת HTML עם עבודה ללא חיבור לאינטרנט.
• עם מיקוד מקלדת (הכולל פתיחה וסגירה של ענפים ומעבר ביניהם)
• אפשרות להוספת / מחיקת ענפים או עלים (נתוני אמצע או סופיים)

עדיף גם:

• קווקו לתצוגה ברורה באיזו רמה זו (בדומה לדוגמה זו)
• קוד הכי פשוט שאפשר - יהיה לי צורך בעריכתו
• כתיבה למשתמש שנשמרת בדף אוטומטית (input רגיל לא עוזר, זה נמחק בשמירה. מצאתי לבינתיים רק את הקוד הזה: <span class="input" role="text" contenteditable="">מה שכותבים</span>

אם מישהו מכיר אשמח, אני כבר חופר על זה כמה זמן.

בנוסף אשמח להערות / המלצות בעניין.

[dovid]

@Y-Excel-Access כתב בעץ דינמי ב HTML - חיפוש קוד פתוח:

קווקו לתצוגה ברורה באיזו רמה זו (בדומה לדוגמה זו)

מה באמת לא מושלם בדוגמה הזו?

@Y-Excel-Access כתב בעץ דינמי ב HTML - חיפוש קוד פתוח:

כתיבה למשתמש שנשמרת בדף אוטומטית (input רגיל לא עוזר, זה נמחק בשמירה. מצאתי לבינתיים רק את הקוד הזה: <span class="input" role="text" contenteditable="">מה שכותבים</span>

contenteditable גם לא נשמר בדף.
הפתרון הוא JS קטן שוומר לlocalstorage.

[Y.Excel.Access]

@dovid כתב בעץ דינמי ב HTML - חיפוש קוד פתוח:

קווקו לתצוגה ברורה באיזו רמה זו (בדומה לדוגמה זו)

מה באמת לא מושלם בדוגמה הזו?

היא קרובה, אבל אין שם אפשרות לניווט באמצעות המקלדת
שמירה של הטקסט שנכתב
ואפשרות להוספת ומחיקת ענפים (מצאתי דוגמה עם הוספה ומחיקה של ענפים, אבל היא הייתה מסובכת מכדי לבודד את הפונקציונליות והיה חסר בה דברים אחרים).

@dovid כתב בעץ דינמי ב HTML - חיפוש קוד פתוח:

הפתרון הוא JS קטן שוומר לlocalstorage.

תודה, אני בודק את זה כעת.

@dovid כתב בעץ דינמי ב HTML - חיפוש קוד פתוח:

מצאתי לבינתיים רק את הקוד הזה: <span class="input" role="text" contenteditable="">מה שכותבים</span>

contenteditable גם לא נשמר בדף.

ראיתי שכן - הקשתי Ctrl + s ושמר. תוכל לנסות.

כנראה התכוונת ללא צורך בפעולת שמירה. (input לא נשמר אפי' עם Ctrl + s)

[dovid]

@Y-Excel-Access כתב בעץ דינמי ב HTML - חיפוש קוד פתוח:

הקשתי Ctrl + s ושמר

אתה מתכוון לשמירה בשם של הדפדפן עם התיבת דו שיח???

[dovid]

@Y-Excel-Access כתב בעץ דינמי ב HTML - חיפוש קוד פתוח:

ללא קישורים חיצוניים (HTML JS ו CSS טהורים)

כל דוגמה בעולם שתמצא כמעט תהיה HTML JS ו CSS טהורים, וקישורים חיצוניים אפשר תמיד להטמיע.

[Y.Excel.Access]

@dovid כתב בעץ דינמי ב HTML - חיפוש קוד פתוח:

אתה מתכוון לשמירה בשם של הדפדפן עם התיבת דו שיח???

כן.
עדיף האופציה שהבאת, אבל עדיין מעשי למקרה וצריך לשמור יותר מ 5 MB.

@dovid כתב בעץ דינמי ב HTML - חיפוש קוד פתוח:

כל דוגמה בעולם שתמצא כמעט תהיה HTML JS ו CSS טהורים, וקישורים חיצוניים אפשר תמיד להטמיע.

נכון, אבל אי אפשר לעבוד איתם בצורה לא מקוונת. ויהיה אפשר להשתמש בהם כך רק אחר התקנה - אפשרות אבל פחות אופטימלית.

[dovid]

@Y-Excel-Access כתב בעץ דינמי ב HTML - חיפוש קוד פתוח:

אבל עדיין מעשי למקרה וצריך לשמור יותר מ 5 MB.

בשמירת טקסט לא סביר שתגרד אפילו אחוז מזה.

@Y-Excel-Access כתב בעץ דינמי ב HTML - חיפוש קוד פתוח:

נכון, אבל אי אפשר לעבוד איתם בצורה לא מקוונת. ויהיה אפשר להשתמש בהם כך רק אחר התקנה - אפשרות אבל פחות אופטימלית.

שגוי. תביא דוגמה שמוצאת חן בעיניך ואסביר לך איך להפוך את זה לאופליין מוחלט.

[dovid]

מצאתי משהו שאני חושב שיענה על כל הצרכים שלך, אבל ייתכן שהוא מסובך להבנת הקוד ולביצוע שינויים:
https://www.jqueryscript.net/layout/Powerful-Multi-Functional-jQuery-Folder-Tree-Plugin-zTree.html

יש שמה גם עריכה:
https://www.jqueryscript.net/demo/Powerful-Multi-Functional-jQuery-Folder-Tree-Plugin-zTree/demo/en/

זה אמנם ישן מלפני עשר שנים אבל יכול להיות שזה מצויין עבורך.

עריכה: אני רואה שאין שמה ניווט מקלדת... אבל אפשר לסדר את זה אולי בJS.

[Y.Excel.Access]

@dovid כתב בעץ דינמי ב HTML - חיפוש קוד פתוח:

נכון, אבל אי אפשר לעבוד איתם בצורה לא מקוונת. ויהיה אפשר להשתמש בהם כך רק אחר התקנה - אפשרות אבל פחות אופטימלית.

שגוי. תביא דוגמה שמוצאת חן בעיניך ואסביר לך איך להפוך את זה לאופליין מוחלט.

חידש לי ממש, לא חשבתי שיהיה אפשר להטמיע בלי התקנה, ולהעביר הלאה את קובץ ה HTML לבדו למשתמשים אחרים.
אמשיך לחפש גם עם קישורים חיצוניים.