Table of Contents

क्यों एक अनुकूलित स्कोरबोर्ड मामले

पेंटबॉल में, मैच तेजी से होते हैं और सेकंड में निर्णय होते हैं। ऑफ-द-शेल्फ स्कोरबोर्ड आमतौर पर बास्केटबॉल या फुटबॉल जैसे पारंपरिक खेलों के लिए डिज़ाइन किए जाते हैं और पेंटबॉल के अद्वितीय गेम मोड के लिए आवश्यक लचीलेपन की कमी होती है। एक कस्टम सिस्टम प्रदान करता है:

  • Real-time score अद्यतन [ जो उन्मूलन, ध्वज कैप्चर, या तुरंत बिंदु आधारित उद्देश्यों को दर्शाता है।
  • ]एक से अधिक प्रारूपों के लिए समर्थन - 3-मैन टीमों से बड़े परिदृश्य खेल तक - एक कठोर टेम्पलेट को मजबूर किए बिना।
  • ]वर्धित दर्शक सगाई [ गतिशील ग्राफिक्स, लाइव टाइमर और टीम विशिष्ट आँकड़ों के माध्यम से।
  • ]Reduced human error टैबलेट या रेफरी के उपकरणों के माध्यम से डेटा प्रविष्टि को स्वचालित करके।
  • ]ब्रांडिंग अवसर प्रायोजक लोगो, घटना नाम और कस्टम रंग योजनाओं को प्रदर्शित करने के लिए।

एक कस्टम समाधान के साथ, आप डेटा भी स्वामित्व में हैं। बाद में आप मैच इतिहास, खिलाड़ी प्रदर्शन और टूर्नामेंट के रुझान का विश्लेषण कर सकते हैं- डिस्पोजेबल पेपर शीट या बंद मालिकाना सिस्टम के साथ कुछ असंभव। एक आधुनिक हेडलेस सीएमएस जैसे डायरेक्टस इस को न केवल संभव बल्कि घटनाओं में दोहराने योग्य बनाता है।

अपने स्कोरबोर्ड बैकएंड के लिए डायरेक्टस का लाभ उठाते हुए

Directus एक खुला स्रोत हेडलेस CMS है जो आपके स्कोरबोर्ड एप्लिकेशन के लिए एक शक्तिशाली बैकएंड के रूप में कार्य करता है। यह एक स्वच्छ, उपयोगकर्ता के अनुकूल इंटरफेस प्रदान करता है ताकि टीमों, मैचों और स्कोर को कोड की एक एकल पंक्ति लिखने के बिना प्रबंधित किया जा सके। इसका REST और GraphQL APIs, वास्तविक समय WebSocket समर्थन के साथ संयुक्त, इसे लाइव स्कोरबोर्ड सिस्टम के लिए एक आदर्श विकल्प बनाती है।

एक डायरेक्टस परियोजना की स्थापना

आप अपने सर्वर (स्वयं होस्ट) पर डायरेक्टस चला सकते हैं या प्रबंधित अनुभव के लिए डायरेक्टस क्लाउड सर्विस का उपयोग कर सकते हैं। एक टूर्नामेंट सेटिंग के लिए, स्थानीय नेटवर्क पर स्वयं-होस्टिंग विलंबता से बचने के लिए बेहतर हो सकता है। इन चरणों का पालन करें:

  1. डायरेक्टस को डोकर या प्रत्यक्ष नोड.जेएस तैनाती के माध्यम से स्थापित करें। ]official Quickstart गाइड मिनटों में प्रक्रिया की रूपरेखा तैयार करता है।
  2. अपने डेटाबेस को कॉन्फ़िगर करें (पोस्टग्रेसक्यूएल, MySQL, SQLite-SQLite ऑफ़लाइन उपयोग के लिए आदर्श है)।
  3. एक व्यवस्थापक उपयोगकर्ता को सेट करें और विशेष रूप से अपने टूर्नामेंट के लिए एक परियोजना बनाएं।
  4. यदि आप तत्काल स्कोर अपडेट के लिए WebSockets का उपयोग करने की योजना बना रहे हैं तो "Realtime" मॉड्यूल को सक्षम करें।

डेटा मॉडल डिजाइन करना

अपने स्कोरबोर्ड के डेटा स्कीमा को आपके टूर्नामेंट की संरचना को प्रतिबिंबित करना चाहिए। डायरेक्टस में संग्रह (टेबल) बनाएं:

  • Teams-name, Logo (image URL), roster (words)) प्राथमिक रंग।
  • Players-नाम, संख्या, टीम (संबंध), वैकल्पिक आँकड़े ( उन्मूलन, मृत्यु, हिट)।
  • Matches-round, Field, start time, status (pending, live, end, overtime), अवधि.
  • Scores-मैच (संबंध), टीम (संबंध), स्कोर वैल्यू, टाइमस्टैम्प (विशेष रूप से लाइव स्कोरिंग के लिए उपयोगी), स्कोरिंग इवेंट टाइप (एल्यूमीनियमन, ध्वज कैप्चर, आदि)।
  • Penalties-वैकल्पिक, खिलाड़ी और मैच संबंधों के साथ अपवर्तन (न्यूनर्स, प्रमुख, अयोग्यता) को ट्रैक करने के लिए।
  • मैच इवेंट्स - पुनः खेलने और लेखा परीक्षा के लिए सभी महत्वपूर्ण घटनाओं (स्कोर परिवर्तन, दंड, टाइमआउट) का एक लॉग।

डायरेक्टस का उपयोग करें' निर्मित संबंध क्षेत्र (मैनी-टू-वन, कई-टू-मैनी) इन संग्रहों को जोड़ने के लिए। उदाहरण के लिए, एक मैच में दो टीमें (या बहु-टीम प्रारूपों के लिए अधिक) और एकाधिक स्कोर प्रविष्टियों को अलग-अलग समय पर रिकॉर्ड किया जा सकता है। एक को जोड़ने पर विचार करें, अगर आप एक ही डायरेक्टस उदाहरण से एकाधिक घटनाओं को चलाने की योजना बनाते हैं - प्रत्येक टूर्नामेंट में अपना खुद का शेड्यूल और नियम हो सकता है।

अनुमतियां निर्धारित करें ताकि केवल प्रमाणित रेफरी स्कोर लिख सकें, जबकि सार्वजनिक स्कोरबोर्ड फ्रंटेंड को हाल के डेटा तक पहुंच की आवश्यकता होती है। आप केवल मैच स्टेटस और स्कोर तक सीमित लेखन पहुंच के साथ एक "स्कोरकीपर" भूमिका भी बना सकते हैं।

रियल टाइम अपडेट्स के साथ डायरेक्टस रियलटाइम

पेंटबॉल टूर्नामेंट जल्दी से चलते हैं - स्कोर प्रदर्शन में देरी भ्रम पैदा करते हैं। डायरेक्टस ']Realtime मॉड्यूल आपको किसी भी संग्रह में बदलाव की सदस्यता लेने की अनुमति देता है। जब कोई रेफरी स्कोर या मैच स्टेटस में बदलाव को अपडेट करता है, तो फ्रंटेंड को तुरंत WebSocket के माध्यम से अपडेट प्राप्त होता है।

इसका उपयोग करने के लिए:

  • अपने फ्रंटएंड प्रोजेक्ट में ] स्थापित करें।
  • अपने डायरेक्टस उदाहरण के लिए WebSocket कनेक्शन बनाएं।
  • वास्तविक समय की घटनाओं के लिए "स्कोर" या "मैच" संग्रह की सदस्यता लें।
  • , ], और ] घटनाओं को सुनें और तदनुसार यूआई अद्यतन करें।

यह दृष्टिकोण मतदान की आवश्यकता को समाप्त करता है और यह सुनिश्चित करता है कि स्कोरबोर्ड को देखने वाला हर डिवाइस सिंक्रनाइज़ हो गया है। कई एक साथ मैचों के साथ बड़े टूर्नामेंट के लिए, बैंडविड्थ को कम करने के लिए विशिष्ट मैच IDs के लिए WebSocket चैनलों का उपयोग करने पर विचार करें।

डीप डाइव: WebSocket कनेक्शन प्रबंधन

जब एक मजबूत स्कोरबोर्ड का निर्माण होता है, तो कनेक्शन को आसानी से गिर जाता है। और ] WebSocket क्लाइंट से घटनाओं की सदस्यता लें। डिस्कनेक्ट करने पर, एक्सोनेंशियल बैकऑफ रिकनेक्टेशन को लागू करें - एक 1-सेकंड देरी के साथ शुरू करें और 30 सेकंड तक दोहराएं। डायरेक्टस 'रियलटाइम मॉड्यूल डिफ़ॉल्ट रूप से हर 30 सेकंड दिल की धड़कन को भेजता है; यदि आप तीन दिल की धड़कन याद करते हैं, तो कनेक्शन को खोना सुरक्षित है। स्कोरबोर्ड पर एक छोटा "कनेक्शन खो गया" सूचक दिखाएं ताकि कर्मचारी नेटवर्क की जांच के लिए जानते हों।

फ्रंटेंड डिस्प्ले का निर्माण

फ्रंटेंड वह है जो खिलाड़ी, रेफरी और दर्शक वास्तव में देखते हैं। आप इसे एक वेब एप्लिकेशन, एक समर्पित टैबलेट इंटरफ़ेस या यहां तक कि एक बड़े स्क्रीन डैशबोर्ड के रूप में बना सकते हैं।

एक रूपरेखा का चयन करना

किसी भी आधुनिक जावास्क्रिप्ट फ्रेमवर्क (React, Vue, Svelte, या यहां तक कि वेनिला जे एस) काम करेगा। यदि आपका टूर्नामेंट कर्मचारी गैर-तकनीकी है, तो एक छोटी स्क्रिप्ट के साथ एक सरल एचटीएमएल + सीएसएस पेज सबसे आसान हो सकता है। अधिक उन्नत इंटरएक्टिविटी के लिए, डायरेक्टस एसडीके के साथ प्रतिक्रिया एक ठोस विकल्प है। इसके रचना एपीआई के साथ Vue 3 भी वास्तविक समय डेटा के साथ मिलकर काम करता है या कस्टम रिएक्टिविटी का उपयोग करना।

उन टीमों के लिए जो हल्के समाधान पसंद करते हैं, का उपयोग करने पर विचार करें Alpine.js] -यह आपको बिना किसी निर्माण के स्थिर HTML में प्रतिक्रियाशील व्यवहार जोड़ने देता है। यह छोटे टूर्नामेंट के लिए आदर्श हो सकता है जहां आप फ्लाई पर स्कोरबोर्ड को संपादित करना चाहते हैं।

Directus SDK के साथ एकीकृत

Directus एक REST क्लाइंट और एक वास्तविक समय क्लाइंट दोनों प्रदान करता है। एक स्कोरबोर्ड के लिए, आप आम तौर पर करेंगे:

  • प्रारंभिक मैच डेटा और टीम की जानकारी को लोड करने के लिए REST API का उपयोग करें।
  • लाइव अपडेट के लिए WebSocket सदस्यता पर स्विच करें।
  • बिना किसी फ्लिकरिंग (CSS संक्रमण मदद) स्कोर को अपडेट करने के लिए यूआई को डिज़ाइन करें।

उदाहरण एकीकरण प्रवाह:

  1. सामने के (यदि आवश्यक हो) को प्रमाणित करें या केवल API टोकन को सार्वजनिक रूप से पढ़ने का उपयोग करें।
  2. डायरेक्टस से वर्तमान मैच सूची को आकर्षित करें।
  3. प्रत्येक सक्रिय मैच के लिए, दो टीमों और उनके वर्तमान स्कोर को प्रदर्शित करें।
  4. "स्कोर" संग्रह पर बदलाव की सदस्यता लें और स्कोर डिस्प्ले को फिर से प्रस्तुत करें।

यूआई स्नैपी रखने के लिए, बैच स्कोर अपडेट: यदि एकाधिक स्कोर इवेंट कुछ मिलीसेकेंड के भीतर आते हैं, तो उन्हें एक अलग रेंडर में एक डीबॉन्ड स्टेट अपडेट (जैसे, अनुरोध एनिमेशनफ्रेम या 100ms डिबॉन्ट) का उपयोग करके समूहित करें।

उपयोगकर्ता इंटरफ़ेस को डिजाइन करना

Clarity पैरामाउंट है। एक अच्छा स्कोरबोर्ड लेआउट में शामिल हैं:

  • टीम के नाम (बड़े, विषम रंग)।
  • स्कोर संख्या (बहुत बड़ा, प्राथमिक स्कोर के लिए एक दूरी से पढ़ने में आसान - न्यूनतम 80px फ़ॉन्ट)।
  • एक मैच टाइमर (काउंटडाउन या रिसने का समय)।
  • "status" सूचक (जैसे, "प्लेइंग", "ब्रेक", "फाइनल")।
  • वैकल्पिक: उन्मूलन काउंटर या व्यक्तिगत आँकड़ों के लिए मृत्यु अनुपात को मारते हैं।

उच्च विपरीत रंगों का प्रयोग करें (जैसे, अंधेरे पृष्ठभूमि पर सफेद पाठ) और स्क्रीन को बंद करने से बचें। उत्तरदायी डिजाइन यह सुनिश्चित करता है कि स्कोरबोर्ड 50 इंच टीवी और रेफरी टैबलेट दोनों पर अच्छा दिखता है। टीवी डिस्प्ले के लिए, एक एकल मैच व्यू के साथ 16: 9 पहलू अनुपात पर विचार करें; मोबाइल रेफरी स्क्रीन के लिए, एकाधिक मैचों के लिए टैब के साथ एक अधिक कॉम्पैक्ट लेआउट का उपयोग करें।

स्कोर, टाइमर और मैच की स्थिति प्रदर्शित करना

इस तरह के डेटा प्रवाह काम करता है:

  • एक रेफरी मोबाइल फॉर्म पर स्कोर (या एक उन्मूलन घटना) में प्रवेश करती है। यह पोस्ट अनुरोध डायरेक्टस एपीआई में जाता है।
  • Directus रिकॉर्ड को बचाता है और WebSocket के माध्यम से एक "create" घटना प्रसारित करता है।
  • फ्रंटेंड को यह घटना प्राप्त होती है, अपने स्थानीय राज्य को अपडेट करती है और स्कोर को फिर से प्रस्तुत करती है।
  • टाइमर को क्लाइंट-साइड (एक स्थानीय घड़ी का उपयोग करके) या सर्वर-साइड को शुरू / अंत समय के लिए डायरेक्टस फ़ील्ड के साथ संभाला जा सकता है। सटीकता के लिए, सर्वर-साइड दृष्टिकोण का उपयोग करें: जब एक मैच शुरू होता है, तो रेफरी फ़ील्ड सेट करता है, और फ्रंटेंड शेष समय की गणना करता है। सर्वर एक फ़ील्ड को हर दूसरे को एक डायरेक्टस प्रवाह या एक छोटे कस्टम एंडपॉइंट के माध्यम से अपडेट कर सकता है।

मैच की स्थिति के लिए, Letees डायरेक्टस में स्थिति क्षेत्र बदल (उदाहरण के लिए, "सेटअप" से "प्लेइंग" से "पूर्ण" तक)। एक सामान्य पैटर्न में टाइमर, वृद्धि स्कोर और कॉल पेनल्टी को शुरू / बंद करने के लिए बटन के साथ रेफरी के लिए "कंट्रोल पैनल" दृश्य होना चाहिए। इसे एक अलग पृष्ठ के रूप में बनाएं जिसके लिए प्रमाणीकरण-प्रयोग से डायरेक्टस' ने इसे सुरक्षित करने के लिए भूमिका-आधारित अनुमतियां बनाईं।

एक कस्टम स्कोरबोर्ड सिस्टम की प्रमुख विशेषताएं

मूल बातें परे, इन उन्नत सुविधाओं को अपने टूर्नामेंट को बाहर खड़े करने के लिए विचार करें:

  • ]एकाधिक मैच विचार - यदि आपका टूर्नामेंट एक साथ क्षेत्रों में चलता है, तो स्कोरबोर्ड सभी सक्रिय मैचों को दिखा सकता है या फ़ील्ड के बीच स्विच करने की अनुमति देता है। मल्टी-फील्ड डिस्प्ले के लिए 2x2 या 3x2 पैनल के साथ एक ग्रिड लेआउट का उपयोग करें।
  • ]Replay or slow-motion-नहीं स्कोरबोर्ड के लिए, लेकिन डेटा परत "undo" क्रियाओं (स्टोरिंग इतिहास) का समर्थन कर सकता है ताकि आप गलतियों को सही कर सकें। सभी स्कोर परिवर्तनों के एक लॉग को टाइमस्टैम्प के साथ लागू करें; नियंत्रण कक्ष में एक "आत्मिक" बटन शामिल हो सकता है जो हाल के सबसे हाल के आयोजन को उलट देता है।
  • ]Sponsor एकीकरण - एक साइडबार में या मैचों के बीच प्रायोजक लोगो को घुमाएं। एक छवि क्षेत्र और एक तरह के आदेश के साथ "स्पोंसर" के लिए एक डायरेक्टस संग्रह का उपयोग करें। फ्रंटेंड प्रत्येक 30 सेकंड में एक यादृच्छिक प्रायोजक दिखा सकता है या उन्हें एक टिकर में प्रदर्शित कर सकता है।
  • ] स्ट्रीमिंग के लिए पब्लिक एपीआई - यदि आप ऑनलाइन टूर्नामेंट का प्रसारण करते हैं, तो iframe या कस्टम RTMP के साथ स्कोरबोर्ड ओवरले को एम्बेड करें। OBS जैसे कई स्ट्रीमिंग टूल एक ब्राउज़र विंडो को कैप्चर कर सकते हैं; स्कोरबोर्ड को पारदर्शी पृष्ठभूमि के साथ डिज़ाइन करें ताकि यह गेम फीड को ओवरले करता है।
  • Paper बैकअप मोड - यहां तक कि एक डिजिटल सिस्टम के साथ, हमेशा एक मुद्रित स्कोरकार्ड और एक पेन तैयार है। इसके अतिरिक्त, एक सरल ऑफ़लाइन-संभावित गिरावट पृष्ठ बनाता है जो नेटवर्क रिटर्न के दौरान स्थानीय स्टोर और सिंक में स्कोर करता है।

उन्नत: लाइवस्ट्रीम के लिए स्कोरबोर्ड ओवरले

यदि आप अपने टूर्नामेंट को लाइवस्ट्रीम करने की योजना बना रहे हैं, तो OBS ओवरले के लिए अनुकूलित एक अलग HTML पेज बनाएं। सभी पृष्ठभूमि निकालें, पूर्ण स्थिति का उपयोग करें, और टीम के रंगों और स्कोर के लिए सीएसएस चर को उजागर करें ताकि स्ट्रीमिंग टीम उन्हें आसानी से समायोजित कर सके। के साथ एक पारदर्शी [[FLT:]] का उपयोग करें। इस पृष्ठ को OBS में एक ब्राउज़र स्रोत के रूप में एम्बेड करें, और यह वास्तविक समय में स्कोर परिवर्तन के रूप में अपडेट होगा।

कार्यान्वयन चरण

इस संरचनात्मक प्रक्रिया को अपना स्कोरबोर्ड स्क्रैच से लेकर लाइव तक का निर्माण करने के लिए देखें।

चरण 1: टूर्नामेंट नियमों और स्कोरिंग को परिभाषित करें

किसी भी कोड लिखने से पहले, दस्तावेज़ वास्तव में कैसे काम करता है। क्या एक बिंदु को एक ध्वज को छूने की आवश्यकता होती है? क्या एक दया नियम है? ओवरटाइम टाई कैसे हल हो गया? यह नियम आपके डेटा मॉडल को निर्धारित करता है। उदाहरण के लिए, यदि उन्मूलन बिंदु गिनती होती है, तो आपको उन्मूलन घटनाओं के लिए एक अलग संग्रह की आवश्यकता होती है। समय सीमा, दंड बिंदु कटौती और अचानक मृत्यु जैसी किसी विशेष परिदृश्य को भी परिभाषित करता है।

स्टेप 2: सेट अप डायरेक्टस कलेक्शन

अपनी डायरेक्टस परियोजना में लॉग इन करें और पहले उल्लिखित संग्रह बनाएं। सत्यापन नियम जोड़ें- उदाहरण के लिए, स्कोर को गैर-नकारात्मक पूर्णांक होना चाहिए। स्कोर और मैच की स्थिति तक पहुंच लिखने की अनुमति देने के लिए "रेफेरी" भूमिका के लिए अनुमतियां कॉन्फ़िगर करें, जबकि "सार्वजनिक" भूमिका ( फ्रंटेंड द्वारा उपयोग किया जाता है) ने केवल एक्सेस पढ़ा है। कुछ क्षेत्रों (जैसे खिलाड़ी संपर्क जानकारी) को छिपाना चाहिए, तो डायरेक्टस फील्ड-स्तर अनुमतियों का उपयोग करें।

चरण 3: बिल्ड एपीआई एंडपॉइंट्स या डायरेक्टस एसडीके का उपयोग करें

आप सीधे फ्रंटेंड से सीधे REST एंडपॉइंट का उपयोग कर सकते हैं, या कस्टम एपीआई एंडपॉइंट्स का निर्माण कर सकते हैं यदि आपको अतिरिक्त व्यावसायिक तर्क (जैसे, एकाधिक घटनाओं से कुलों की गणना करने के लिए) की आवश्यकता है। अधिकांश टूर्नामेंट के लिए, अंतर्निहित REST और WebSocket समापन बिंदु पर्याप्त हैं। Directus SDK] का उपयोग करके प्रमाणीकरण और वास्तविक समय की सदस्यता को सरल बनाने के लिए करें। यदि आपको सर्वर-साइड टाइमर सिंक्रनाइज़ेशन की आवश्यकता है, तो एक डायरेक्टस कस्टम एंडपॉइंट बनाएं जो अपडेट [[FLT: 11]]] हर दूसरे को क्रोन नौकरी या एक फ्लो के माध्यम से करें।

चरण 4: फ्रंटएंड घटक का विकास

दर्शकों के लिए प्रदर्शन पृष्ठ और रेफरी के लिए नियंत्रण कक्ष बनाएं। दर्शकों को केवल पढ़ने और बड़े, स्पष्ट तत्वों पर ध्यान केंद्रित करने के लिए केवल देखें। नियंत्रण कक्ष बटन और रूपों के साथ अधिक कॉम्पैक्ट हो सकता है। स्कोर परिवर्तनों के लिए सीएसएस एनिमेशन का उपयोग करें (जैसे, स्कोर वृद्धि के दौरान एक संक्षिप्त फ्लैश)। नियंत्रण कक्ष के लिए, बड़े बटन के साथ एक मोबाइल-पहली डिजाइन का उपयोग करने पर विचार करें जिसे दस्ताने पहनते समय भी आसानी से टैप किया जा सकता है।

स्टेप 5: रियल मैच के साथ टेस्ट

रन अभ्यास स्वयंसेवकों के साथ मिलान रेफरी और खिलाड़ियों के रूप में अभिनय करते हैं। विभिन्न परिदृश्यों को अनुकरण करें: त्वरित स्कोर परिवर्तन, एकाधिक फ़ील्ड, दंड कॉल और नेटवर्क के मुद्दों। जांचें कि WebSocket कनेक्शन ड्रॉप होने पर स्वचालित रूप से कनेक्ट हो जाता है।

स्टेप 6: डिप्लॉय और ट्रेन स्टाफ

एक स्थानीय सर्वर या क्लाउड होस्ट पर फ्रंटेंड को तैनात करें। ऑफ़लाइन घटनाओं के लिए, डायरेक्टस चलाएं और एक वाईफाई हॉटस्पॉट के साथ स्थानीय लैपटॉप पर फ्रंटेंड करें। फ्रंटेंड के लिए डायरेक्टस और एक लाइटवेट वेब सर्वर (जैसे Nginx या Caddy) को बंडल करने के लिए डॉकर कॉम्पोज़ का उपयोग करें। ट्रेनें नियंत्रण कक्ष का उपयोग कैसे करें - इसे जितना संभव हो उतना सरल बनाएं: एक टीम के स्कोर में वृद्धि करने के लिए एक टैप करें, टाइमर को शुरू करने / बंद करने के लिए एक बटन। त्वरित-पुनर्भाव कार्ड प्रिंट करें। कुल सिस्टम विफलता के मामले में पेपर मैनुअल सिस्टम पर बैकअप स्कोरर को भी प्रशिक्षित करें।

Directus में सुरक्षा और अनुमति

क्योंकि स्कोरबोर्ड कई भूमिकाओं से पहुँचा एक लाइव सिस्टम है, सुरक्षा महत्वपूर्ण है। तीन डायरेक्टस भूमिकाओं को बनाने से शुरू करें:

  • Administrator-सभी संग्रहों और सेटिंग्स के लिए पूर्ण पहुँच (विपणन आयोजकों द्वारा उपयोग किया जाता है)।
  • Referee- स्कोर, मैच स्टेटस, दंड, और मैच इवेंट्स तक पहुंच लिखने के लिए। टीमों, खिलाड़ियों और टूर्नामेंट तक पहुंच पढ़ें।
  • पब्लिक -केवल स्कोर, मैचों (केवल स्टेटस "live" या "finished"), टीमों और खिलाड़ियों के लिए उपयोग पढ़ें। कोई भी पहुंच नहीं लिखें।

इन संग्रह स्तर पर लागू करने के लिए Directus की अनुमति प्रणाली का उपयोग करें। अतिरिक्त सुरक्षा के लिए, यदि नियंत्रण कक्ष केवल विशिष्ट टैबलेट पर प्रयोग किया जाता है तो आईपी पते द्वारा रेफरी एक्सेस को प्रतिबंधित करें। अपने Directus उदाहरण पर HTTPS सक्षम करें, खासकर यदि आप इसे ओवरले स्ट्रीमिंग के लिए इंटरनेट पर उजागर करते हैं।

लाइव स्कोरबोर्ड के लिए प्रदर्शन अनुकूलन

एक टूर्नामेंट में दर्जनों मैच एक साथ हो सकते हैं। वेबसोकेट फ़ीड उत्तरदायी रखने के लिए:

  • केवल उन संग्रहों की सदस्यता लें जो अक्सर बदलते हैं (जैसे, ] और ]). इस घटना के दौरान अद्यतन होने तक ]] जैसे स्थैतिक संग्रहों की सदस्यता लें.
  • केवल प्रासंगिक रिकॉर्ड्स को सब्सक्राइब करने के लिए डायरेक्टस के फ़िल्टर पैरामीटर का उपयोग करें। उदाहरण के लिए, शोर को कम करने के लिए को फ़िल्टर करने के लिए ] के साथ ] को सब्सक्राइब करें।
  • फ्रंटेंड पर, यूआई अपडेट को डिबेंज करें। यदि एकाधिक स्कोर इवेंट्स एक ही एनीमेशन फ्रेम के भीतर पहुंचते हैं, तो उन्हें एक ही DOM अपडेट में बैच करें।
  • कैश टीम के नाम और लोगो को स्थानीय रूप से ब्राउज़र के स्थानीय स्टोरेज में इसलिए उन्हें हर कनेक्ट पर लाने की आवश्यकता नहीं है।
  • बहुत बड़े टूर्नामेंट (प्लेयर के सैकड़ों) के लिए, पगिनेटर खिलाड़ी आँकड़े और उन्हें मांग पर लोड करते हैं।

सफल कार्यान्वयन के लिए युक्तियाँ

  • ]] नेटवर्क को सरल रखें पर्याप्त बैंडविड्थ के साथ एक एकल वाईफाई नेटवर्क का उपयोग करें सार्वजनिक उपकरणों को जोड़ने से बचें; रेफरी के लिए समर्पित टैबलेट का उपयोग करें। निचले हस्तक्षेप के लिए 5 गीगाहर्ट्ज नेटवर्क पर विचार करें।
  • ] प्रारंभिक डेटा कैश करें। सभी टीम नामों, मैच शेड्यूल और स्टार्टअप पर फ्रंटेंड में लोगो को लोड करें ताकि एक WebSocket आउटेज तुरंत प्रदर्शन को तोड़ न सके।
  • ]एक गिरावट का उपयोग करें एक स्थिर HTML पृष्ठ है जिसमें मैन्युअल इनपुट फ़ील्ड को एक अंतिम रिसोर्ट के रूप में जोड़ा गया है, जिसे बाद में अपलोड किया जा सकता है।
  • ]समयसीमा का परीक्षण करें. यदि सर्वर-साइड टाइमर का उपयोग किया जाता है, तो सुनिश्चित करें कि आपके WebSocket संदेशों में उपकरणों के बीच बहाव से बचने के लिए सटीक सर्वर समय शामिल है। वैकल्पिक रूप से, ] ] ]]]] का उपयोग ग्राहक पर अधिक सटीक अंतराल के लिए किया जाता है।
  • Consider accessibility.] बड़े फोंट और दृश्य हानि के साथ दर्शकों के लिए उच्च विपरीत का प्रयोग करें। मैच शुरू / अंत जैसे महत्वपूर्ण घटनाओं के लिए ऑडियो प्रतिक्रिया (एक बजर) प्रदान करें। [[FLT: 18]] क्षेत्रों का उपयोग स्क्रीन रीडर उपयोगकर्ताओं के लिए अंक परिवर्तन की घोषणा करने के लिए करें।
  • Plan for power. सभी उपकरणों को पूरी तरह से चार्ज किया जाना चाहिए, और बैटरी और पावर स्ट्रिप्स के लिए बैकअप होना चाहिए। यदि संभव हो तो स्कोरबोर्ड लैपटॉप को यूपीएस पर चलाएं।
  • ]आपके डेटा मॉडल को दस्तावेज संग्रह और रिश्तों का एक आरेख रखें ताकि भविष्य के टूर्नामेंट आयोजक आसानी से सिस्टम को संशोधित कर सकते हैं।

निष्कर्ष

एक अनुकूलित स्कोरबोर्ड प्रणाली जो डायरेक्टस पर बनाया गया है, एक पेशेवर, आकर्षक अनुभव के लिए अराजक मैनुअल स्कोर से पेंटबॉल टूर्नामेंट को बदल देती है। अपने डेटा मॉडल के मालिक और वास्तविक समय के अद्यतन का लाभ उठाकर, आप खिलाड़ियों और दर्शकों को मैच के हर दूसरे को सूचित करते हुए किसी भी नियम सेट के अनुकूल होने के लिए कुल लचीलापन प्राप्त करते हैं। यहां उल्लिखित चरणों के साथ- डाटा मॉडलिंग से तैनाती तक - आप एक स्कोरबोर्ड बना सकते हैं जो टूर्नामेंट के दिन में विश्वसनीय रूप से चल रहे हैं और क्षेत्र में सभी को प्रभावित कर सकते हैं।

आगे पढ़ने के लिए, Directus वेबसाइट , APPA टूर्नामेंट नियम, और ]Vue.js]] या ]]React]]]] के साथ वास्तविक समय डैशबोर्ड बनाने के लिए व्यावहारिक वेब विकास ट्यूटोरियल।