👁️ 🧚🏻 ☝🏽 हम जेएस पर सैमसंग स्मार्टटीवी के लिए एक खेल लिख रहे हैं 🎡 🤹🏾 ™️

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

टूलबॉक्स की तैयारी

सबसे पहले, हमें विंडोज के साथ एक कंप्यूटर की आवश्यकता है (हमने इसे मैक पर वर्चुअल मशीन पर परीक्षण किया)।
अब samsungdforum.com पर जाएं और एसडीके डाउनलोड करें
मैंने 2.5.1 संस्करण डाउनलोड किया है ताकि अधिक से अधिक मॉडल कवर किए जा सकें।
दुर्भाग्य से, व्यावसायिक विकास के लिए, टीवी स्वयं ही आवश्यक है, क्योंकि वास्तव में एमुलेटर और वास्तविक डिवाइस कभी-कभी व्यवहार में बहुत भिन्न होते हैं (ठीक है, एमुलेटर पर इशारा मान्यता का परीक्षण नहीं किया जा सकता है)। मैंने 2012 मॉडल का इस्तेमाल किया।
खेल विकास के लिए जेएस इंजन के रूप में, मैंने खुद के लिए 2 विकल्प चुने: इवांका लीब और क्राफ्टीजेएस । एफपीएस परीक्षण के परिणामों से पता चला है कि चालाक दो बार तेज है, इसलिए मैं उस पर बस गया। यह इस तथ्य के कारण है कि इवानक कैनवास का उपयोग करता है, जो स्मार्टटीवी पर हार्डवेयर त्वरित नहीं है। थोड़ा सा अंदरूनी सूत्र: सहकर्मियों ने कहा कि जल्द ही एचटीएमएल 5 में सब कुछ फिर से लिखने के संबंध में बहुत काम की आवश्यकता होगी, क्योंकि, सबसे अधिक संभावना है, 2013 के मॉडल में, सभी एचटीएमएल 5 को "वरीयता और कविता के साथ" किया जाएगा।

डिबग

सामान्य तौर पर, samsungdforum.com पर डिबगिंग प्रक्रिया काफी सटीक रूप से वर्णित है।
(गाइड-> विषय-> आरंभ करना-> टीवी पर अपने एप्लिकेशन का परीक्षण करना) संक्षेप में: एमुलेटर पर शुरू करने के लिए, आईडीई में केवल एक बटन पर क्लिक करें, टीवी पर चलाने के लिए आपको एक पैकेज बनाने की जरूरत है, इसे वेब सर्वर पर अपलोड करें (सब कुछ किया है) आईडीई) और स्मार्टटीवी (रिमोट कंट्रोल पर कुछ कीस्ट्रोक्स) के साथ अनुप्रयोगों को सिंक्रनाइज़ करें।

डिज़ाइन

इसलिए हमने SDK और CraftyJS का dev संस्करण डाउनलोड किया। अच्छा, चलो चलते हैं।
हम एसडीके, तथाकथित सैमसंग एसडीके टीवी एडिटर की डिलीवरी में आईडीई शुरू कर रहे हैं। एक डिफ़ॉल्ट जावास्क्रिप्ट परियोजना बनाएँ।
प्रोजेक्ट बनाते समय, "विजेटनाम" संपत्ति को संपादित करें और "y" के मान के साथ "माउस" नामक एक संपत्ति जोड़ें (यह संपत्ति हमें स्मार्टटीवी चिप - जेस्चर कंट्रोल का उपयोग करने की अनुमति देगा)। अन्य सभी गुणों को "डिफ़ॉल्ट रूप से" छोड़ा जा सकता है।
IDE हमारे लिए एक डिफ़ॉल्ट प्रोजेक्ट बनाएगा। सामान्य तौर पर, इसकी आवश्यकता नहीं होती है और इसे पूरी तरह से साफ किया जा सकता है और केवल 2 widget.info और config.xml फाइलें छोड़ी जा सकती हैं।

Index.html फ़ाइल

Index.html प्रोजेक्ट में निम्न सामग्री जोड़ें:

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>PongTv</title> </head> <body style="margin:0px;padding:0px;"> <script type="text/javascript" src="crafty.js"></script> <script type="text/javascript" src="pong.js"></script> </body> </html>

टिप्पणी करने के लिए कुछ खास नहीं है, यहां सब कुछ स्पष्ट है।
तदनुसार, हमें 2 और फाइलें जोड़ने की आवश्यकता है: CraftyJS लाइब्रेरी और गेम कोड।

खेल कोड pong.js

 if (window.curWidget) { curWidget.setPreference('ready', 'true'); } var wdth = 960; var hght = 540; var margin = 20; var back_color = 'rgb(0,0,0)'; var act_color = 'rgb(255,255,255)'; var ppdl_w = 20; var ppdl_h = 100; var ball_s = 10; Crafty.init(wdth, hght); Crafty.background(back_color); //Paddles Crafty.e("Paddle, 2D, DOM, Color, Multiway, Mouse") .color(act_color) .attr({ x:margin, y:(hght-ppdl_h)/2, w:ppdl_w, h:ppdl_h }) .multiway(4, { W:-90, S:90, REMOTE_UP:-90, REMOTE_DOWN:90 }); Crafty.e("Paddle, 2D, DOM, Color, Multiway, Mouse") .color(act_color) .attr({ x:wdth-margin-ppdl_w, y:(hght-ppdl_h)/2, w:ppdl_w, h:ppdl_h }) .multiway(4, { UP_ARROW:-90, DOWN_ARROW:90}) .bind('MouseMove', function (e) { this.y = ey-ppdl_h/2; }); //Ball Crafty.e("2D, DOM, Color, Collision") .color(act_color) .attr({ x:wdth/2, y:hght/2, w:ball_s, h:ball_s, dX:Crafty.math.randomInt(2, 5), dY:Crafty.math.randomInt(2, 5) }) .bind('EnterFrame', function () { //hit floor or roof if (this.y <= 0 || this.y >= hght) this.dY *= -1; if (this.x > wdth-margin) { this.x = wdth/2; Crafty("LeftPoints").each(function () { this.text(++this.points + " Points") }); } if (this.x < margin) { this.x = wdth/2; Crafty("RightPoints").each(function () { this.text(++this.points + " Points") }); } this.x += this.dX; this.y += this.dY; }) .onHit('Paddle', function () { this.dX *= -1; }); //Score boards Crafty.e("LeftPoints, DOM, 2D, Text") .attr({ x:margin, y:margin, w:100, h:20, points:0 }) .textColor('#FFFFFF') .text("0 Points"); Crafty.e("RightPoints, DOM, 2D, Text") .attr({ x:wdth -100, y:margin, w:100, h:20, points:0 }) .textColor('#FFFFFF') .text("0 Points");

कोड की पहली कुछ पंक्तियां टीवी को बताती हैं कि एप्लिकेशन तैयार है और स्क्रीन पर दिखाया जा सकता है।
इसके अलावा Crafty पर काफी मानक कोड अपने आप में है। आप तुरंत सवाल पूछ सकते हैं: "ठीक है, इशारे कहाँ हैं?" इसका उत्तर है: सैमसंग स्मार्टटीवी में इशारे एक साधारण माउस से ज्यादा कुछ नहीं हैं। तदनुसार, यदि आपका कोड किसी ब्राउज़र में माउस पर प्रतिक्रिया करता है, तो टेलीविज़न इशारों को पकड़ लेगा (आप, जैसा कि यह थे, अपने हाथ से कर्सर को नियंत्रित करेगा, और एक इशारे के साथ क्लिक करें)

लांच

हम एमुलेटर पर सब कुछ शुरू करते हैं और कुछ भी काम नहीं करता है। क्यों? यह सरल है: CraftyJS किसी भी उपाय के बारे में नहीं जानता है।
हम CraftyJS कोड में कीबोर्ड कोड की एक सरणी ("कुंजियाँ: {") पाते हैं और निम्नलिखित जोड़ते हैं:

 ... 'REMOTE_UP': 29460, 'REMOTE_DOWN':29461,

मैंने craftyJS के लेखकों को पुल अनुरोध भेजा और इसे स्वीकार कर लिया, इसलिए एक मौका है कि यह पहले से ही CraftyJS के आपके संस्करण में मौजूद होगा।

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

निष्कर्ष

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

हम जेएस पर सैमसंग स्मार्टटीवी के लिए एक खेल लिख रहे हैं