मैंने एक Google दस्तावेज़ खोला, ऐसा लगता है कि Google डॉक एक साधारण टेक्स्ट क्षेत्र नहीं है .... ऐसा लगता है कि यह एक कस्टमाइज़ सामग्री है .... क्या ऐसी चीजों को करने के लिए कोई पुस्तकालय है?टेक्स्ट दस्तावेज़ जैसे Google दस्तावेज़ को कैसे कार्यान्वित करें?
अधिकांश संपादक contentEditable संपत्ति का उपयोग करते हैं। इसे किसी भी एचटीएमएल तत्व पर सेट करने से संपादन सक्षम हो जाता है, आधुनिक उपयोगकर्ता एजेंटों में & पेस्ट, वर्तनी जांच, स्वरूपण इत्यादि की प्रतिलिपि बनाएँ।
हालांकि, Google दस्तावेज़ विशेष रूप से सामग्री का उपयोग करने योग्य नहीं है। इसके बजाए, उन्होंने जावास्क्रिप्ट में their own rendering engine लागू किया। जब तक आप Google दस्तावेज़ों के पैमाने पर एक प्रोजेक्ट की योजना नहीं बनाते (यानी आपके पास कम से कम, कहें, 3 लोग प्रतिपादन इंजन पर पूर्णकालिक काम करने के इच्छुक हैं), सामग्री योग्यता जाने का तरीका है।
क्या आप वास्तव में सामग्री सोचते हैं संपादन योग्य आपको सभी को मुफ्त में देगा? और वैसे भी यह है कि html5 –
@AnuragUniyal सामग्री संपादन योग्य आईई 5.5 में वापस पेश किया गया है, मोज़िला ने 2002 के अंत में इसके लिए पहला समर्थन जोड़ा https://bugzilla.mozilla.org/show_bug.cgi?id=97284#c162 –
अनुराग्नियल सही है। सामग्री संपादन योग्य के साथ ऐसा करने के लिए कुछ भी नहीं है और गैब्रियल Mazetto द्वारा एकमात्र समझदार जवाब है। – Rob
आप तत्व निरीक्षक (टूल> डेवलपर टूल क्रोम पर, या Firefox के लिए Firebug विस्तार) का उपयोग करते हैं तो आप देख सकते हैं कि तकनीक वे इसे लागू करने के लिए इस्तेमाल किया।
कैसे आप इसे लागू कुछ भी रूप में ही है - छोटे पर्याप्त इकाइयों में कार्य है कि आप हर एक को समझ सकता हूँ को तोड़ने, समझ कैसे इकाइयों संगीत कार्यक्रम में कार्य प्रणाली का एहसास है, तो इकाइयों को लागू करने और उन्हें डाल करने के लिए साथ में।
नया Google डॉक्स tinyMCE, ckEditor और similars जैसे अन्य सभी चीज़ों के लिए बिल्कुल अलग है। यहां एक लेख है जो इसके पीछे कुछ प्रौद्योगिकियों का वर्णन करता है: http://news.softpedia.com/news/Google-Details-the-Powerful-Technology-Behind-the-New-Docs-Editor-141804.shtml
लेख से उद्धृत: "इन समस्याओं को हल करने के लिए, नया Google दस्तावेज़ संपादक संपादन योग्य टेक्स्ट को संभालने के लिए ब्राउज़र का उपयोग नहीं करता है। हमने पूरी तरह से जावास्क्रिप्ट में एक नई नई संपादन सतह और लेआउट इंजन लिखा है, "जेफ हैरिस, उत्पाद प्रबंधक, Google डॉक्स।
यह आश्चर्यजनक है कि कोई ओपन सोर्स कार्यान्वयन नहीं है और लोगों को इसके बारे में पता नहीं है।
संक्षिप्त उत्तर है कि वे, (, लेआउट से, प्रतिपादन करने के लिए सब कुछ करने के लिए) हर एक तर्क यह है कि एक ग्राफिक पाठ संपादक करना होगा लागू किया, सादा जावास्क्रिप्ट में
यदि सभी गणना स्थानीय रूप से की जाती है, तो इसका मतलब यह है कि हम यह देखने के लिए अंदर जा सकते हैं कि उनका कोड कैसे काम करता है? या अभी भी सर्वर पक्ष को संभाला जा रहा है? – Joseph
चीजों को प्रस्तुत करने और प्रदर्शित करने के लिए आवश्यक कोड में "टाइप किया जा रहा है" से संबंधित सभी गणना स्थानीय रूप से हैं, लेकिन वास्तविक महत्वपूर्ण कोड सर्वर की ओर है (जो टाइपिंग, दृढ़ता, टकराव नियंत्रण और प्रसारित करने से सब कुछ संभालता है। वास्तविक "माइक्रोसॉफ्ट फ़ाइल प्रारूप" हालांकि यह सच है कि कोड का अच्छा हिस्सा क्लाइंट पक्ष पर है, याद रखें कि यह obfuscated है और यह एक मालिकाना कोड है ... –
Google Wave क्या गूगल डॉक्स है की ज्यादा का बीड़ा उठाया है, हालांकि है मॉडल पूरी तरह से अलग हैं। वहां अनुसंधान शुरू करें, क्योंकि सीखने के लिए बहुत कुछ है।
यदि आप केवल संरचित दस्तावेज़ों से कुछ सरल करने की कोशिश कर रहे हैं, तो mobwrite, etherpad या इसके कांटे में से एक उपयुक्त हो सकता है।
संपादक मुश्किल हो सकता है और अनिवार्य रूप से जावास्क्रिप्ट में एक संपूर्ण वर्ड प्रोसेसर बनाना शामिल है। इसके कुछ उदाहरण आसपास हैं।
किसी भी प्रकार के संपादक के साथ आपके पास एक रेखा या तत्व बफर है, जिसे आपको पसंद के रीयलटाइम एपीआई पर दर्पण करना होगा।
यह Google drive's realtime API के साथ किया जा सकता है।
संशोधनों की घटनाओं को दोनों दिशाओं में संभालना होगा। स्थानीय मॉडल रीयलटाइम मॉडल और इसके विपरीत प्रचार करने में परिवर्तन करता है। स्थानीय मॉडल में संशोधन के रूप में प्रस्तुत किया जा सकता है।
कर्सर को स्रोत बफर पर पॉइंटर्स रखने के द्वारा नियंत्रित किया जा सकता है, जैसे Index Reference।
सर्वर को कई तरीकों से कार्यान्वित किया जा सकता है, लेकिन सामान्य संरचनाओं का समर्थन करने वाले एक परिचालन परिवर्तन मॉडल की आवश्यकता होगी। Wave protocol's site में एक एक्सएमएल मॉडल का उपयोग कर एक उदाहरण है।
Ritzy एक नया ओपन सोर्स समृद्ध टेक्स्ट एडिटर है जिसमें Google डॉक्स की तरह कस्टम जावास्क्रिप्ट सतह और लेआउट इंजन शामिल है। कुछ विचारों के लिए इसके स्रोत पर नज़र डालें।
यह Facebook React और SwarmJS पर आधारित है और मुख्य रूप से रीयल-टाइम सहयोग के साथ समृद्ध टेक्स्ट एंट्री का समर्थन करने के लिए अनुप्रयोगों में एम्बेड करने का इरादा है।
जहां तक मुझे पता है, यह इस तकनीक का पहला ओपन सोर्स कार्यान्वयन है। ध्यान दें कि यह बहुत नया है और किसी भी वास्तविक दुनिया परीक्षण/उपयोग को नहीं देखा है, इसलिए कुछ known bugs हैं और संभवतः बहुत से अज्ञात भी हैं।
अस्वीकरण: मैं उपर्युक्त परियोजना का लेखक हूं।
<!DOCTYPE html>
<html>
<head>
<script src="https://cloud.tinymce.com/stable/tinymce.min.js"></script>
<script>tinymce.init({ selector:'textarea' });</script>
</head>
<body>
<textarea>Next, get a free TinyMCE Cloud API key!</textarea>
</body>
</html>
आपकी समग्र परियोजना में क्या लिखा गया है? एएसपी.Net, PHP आदि? –
जेएसपी .... ... लेकिन मुझे लगता है कि Google डॉक टेक्स्ट एडिटर कुछ जावास्क्रिप्ट चाल का उपयोग कर रहा है। – Tattat
क्या आपने वेब पर उपलब्ध WYCIWYG संपादकों को देखा था, क्या ऐसा कुछ है जो आपके लिए काम नहीं करता है? – TarasB