ग्राउंड अप से विंडोज साइडबार गैजेट लिखना

हाल ही में, मुझे विंडोज साइडबार के लिए एक गैजेट बनाने की आवश्यकता थी। मेरे पास इसमें कौशल नहीं था, इसलिए, थोड़ा सा Google और प्रलेखन पढ़ने के बाद, हम आगे बढ़ते हैं।

तुरंत दिखाओ कि अंत में क्या हुआ



गैजेट साइट से xml, पार्स के रूप में जानकारी प्राप्त करेगा और वास्तव में, इसे प्रदर्शित करेगा। इसके अलावा, गैजेट नए संस्करणों के लिए जांच करेगा, और यदि वे मौजूद हैं, तो काम करने से मना कर दें :)
प्रारंभ में, अनुभव प्राप्त करने के लिए, मैं पूरी तरह से VBScript में एक गैजेट लिखना चाहता था (क्योंकि मेरे पास अभी तक इसका कोई व्यवसाय नहीं था), लेकिन अंत में मुझे जावास्क्रिप्ट आवेषण करना था।
हम सीधे कोड पर आगे बढ़ते हैं। मैं यहां सभी कोड पर विचार नहीं करूंगा, मैं केवल मुख्य बिंदु दिखाऊंगा। तैयार गैजेट का एक लिंक लेख के अंत में है।
मुख्य गैजेट फ़ाइल इसका प्रकटन है - Gadget.xml फ़ाइल। इसे उस तरह से बुलाया जाना चाहिए और हमारे संग्रह की जड़ में स्थित होना चाहिए (गैजेट कुछ भी नहीं है, लेकिन एक्सटेंशन .gadget के साथ ज़िप संग्रह)।

<?xml version="1.0" encoding="utf-8" ?> <gadget> <name>Weather from Info.Denms.Ru</name> <version>1.0.1232</version> <hosts> <host name="wdenms"> <base type="HTML" apiVersion="1.0.0" src="main.html" /> <permissions>Full</permissions> <platform minPlatformVersion="1.0" /> </host> </hosts> <icons> <icon width="64" height="64" src="icon.png" /> </icons> <author name="cvs"> <info url="http://info.denms.ru" /> </author> <description>Weather Widget (Info.Denms.Ru)</description> </gadget> 

आइए इसे और अधिक विस्तार से विचार करें।
<आधार> तत्व में 1.0.0 (फिलहाल), साथ ही साथ src विशेषता के बराबर एपिवर्शन होना चाहिए, जो हमारे गैजेट की मुख्य फाइल को इंगित करता है;
<अनुमतियाँ> - गैजेट के लिए अनुमतियाँ। पूर्ण के बराबर सेट;
<platform> विधवा साइडबार का न्यूनतम संस्करण है। फिलहाल - 1.0;
पैरामीटर <नाम> - गैजेट का नाम, <संस्करण> - संस्करण, <लेखक> - लेखक के बारे में जानकारी, <जानकारी> - गैजेट के साथ पृष्ठ के लिए लिंक, <आइकन> - गैजेट का आइकन और <descrtiption> स्थापित गैजेट के पैनल पर प्रदर्शित किया जाएगा।

Main.html फ़ाइल एक साधारण html फ़ाइल है, मैं इसे पूरी तरह से नहीं दूंगा, मैं केवल कुछ बिंदुओं पर ध्यान केंद्रित करूंगा।
जी: पृष्ठभूमि तत्व गैजेट की पृष्ठभूमि सेट करता है। चलो इसे पारदर्शी बनाते हैं।

 <g:background id="background" style="position:absolute; z-index:-1; top:0; left:0;" opacity="0"></g:background> 

गैजेट दो अवस्थाओं में हो सकता है - डॉक किया हुआ (ऊपर स्क्रीनशॉट में बाईं तरफ), और अनडॉकड (दाईं ओर)। हम गैजेट की वर्तमान स्थिति को जावास्क्रिप्ट चर में संग्रहीत करेंगे।

 <SCRIPT Language="VBScript"> '  JavaScript   VBS function isDocked isDocked = isDockedJS() End Function </script> <script src="main.vbs" type="text/vbscript"></script> <SCRIPT Language="JavaScript"> docked = 0; function isDockedJS() { return docked; } </SCRIPT> <script type="text/javascript" src="main.js"></script> 

हमें VBScript से गैजेट की वर्तमान स्थिति का पता लगाने के लिए isDocked रैपर फ़ंक्शन की आवश्यकता होगी (जैसा कि मैंने कोशिश की, लेकिन इसे शुद्ध VBScript पर लागू नहीं किया जा सका)। एक और टिप्पणी - स्क्रिप्ट इस क्रम में सही ढंग से काम करती है, अर्थात्। पहले हम VBScript स्क्रिप्ट का वर्णन करते हैं, फिर जावास्क्रिप्ट का।

Main.html में शेष तत्व पूर्ण स्थिति वाले div तत्व हैं। इसके बाद, स्क्रिप्ट से हम उन्हें उनकी आईडी द्वारा एक्सेस करेंगे।

  <div id="small_needupdate"></div> 

जावास्क्रिप्ट का उपयोग करते हुए, हम गैजेट के लिए डॉक और अनडॉक किए गए राज्यों को सेट करते हैं, और सेटिंग फ़ाइल (main.js) भी निर्दिष्ट करते हैं

 System.Gadget.onDock = resize; System.Gadget.onUndock = resize; System.Gadget.settingsUI = "settings.html"; System.Gadget.onSettingsClosed = SettingsClosed; docked=0; //   resize(); // 

जैसा कि आप ऊपर दी गई लिस्टिंग से देख सकते हैं, जब गैजेट की स्थिति बदल रही है, तो रिसाइज़ () फ़ंक्शन कहा जाएगा।

 function resize() { bd = document.body.style; System.Gadget.beginTransition(); if (System.Gadget.docked) { // small state bd.width=148; //   bd.height=201; docked = 1; bd.background='url(images/gadget.png) no-repeat'; //  //      undocked  docked      undocked document.getElementById("small_needupdate").innerHTML = document.getElementById("big_needupdate").innerHTML; document.getElementById("big_needupdate").innerHTML = ""; //... } else { // big state bd.width=230; bd.height=160; bd.background='url(images/gadgeth.png) no-repeat'; docked=0; //    docked  undocked      docked document.getElementById("big_needupdate").innerHTML = document.getElementById("small_needupdate").innerHTML; document.getElementById("small_needupdate").innerHTML = ""; //... } System.Gadget.endTransition(System.Gadget.TransitionType.morph,1); } 

आप सेटिंग सहेजने के कार्य का भी वर्णन कर सकते हैं। वे मेरे गैजेट में नहीं हैं, लेकिन एक उदाहरण के लिए मैं दिखाऊंगा कि यह कैसे किया जाता है

 function SettingsClosed(event) { if (event.closeAction == event.Action.commit) { //alert System.Gadget.Settings.readString('test'); } } 

readString - क्रमशः पहले से सहेजी गई पंक्ति, राइटस्ट्रीमिंग, पढ़ता है।
तरीके System.Gadget.beginTransition (); और सिस्टम.गैगेट.एंडट्रेनशन (); गैजेट के "चिकनी" आकार के लिए आवश्यक है। विंडोज सेवन पर, उन्हें अनदेखा किया जाता है , लेकिन मैंने अभी भी उन्हें पिछड़े संगतता के लिए छोड़ दिया है।

जैसा कि ऊपर उल्लेख किया गया है, सर्वर हमें xml प्रारूप में मौसम की जानकारी प्रदान करता है।

 <?xml version="1.0"?> <all> <day id="today"> <temp>1.7</temp> <cloudyim>41</cloudyim> <cloudy></cloudy> <air></air> <humidity>87</humidity> <wind_direction>-</wind_direction> <wind_speed>5</wind_speed> <min>-3</min> <max>-1</max> </day> <day id=""> <min>-1</min> <cloudyim>26</cloudyim> <max>1</max> </day> <day id=""> <min>-9</min> <cloudyim>41</cloudyim> <max>0</max> </day> … </all> 

डाउनलोड और पार्स xml VBScript में होगा।

 Sub DownloadXML2 Set objXML = CreateObject("Microsoft.XmlHttp") objXML.Open "GET", "http://info.kovonet.ru/weather.xml", True objXML.OnReadyStateChange = GetRef("objXML_onreadystatechange") objXML.setRequestHeader "If-Modified-Since", "Sat, 1 Jan 2000 00:00:00 GMT" objXML.Send iTimeoutID = window.SetTimeout("mySleep", 1000) End Sub 

MySleep फ़ंक्शन टाइमआउट के लिए हमारे कनेक्शन की जांच करेगा।

 Sub mySleep if bRespReceived = "false" then '    iTimeout = iTimeout + 1 if (iTimeout > 30) then ' timerFirstRun = window.SetTimeout("Update", 60000) '     else '   ,    iTimeoutID = window.SetTimeout("mySleep", 1000) end if end if End Sub 

यदि डाउनलोड सफल होता है, तो objXML.readyState चार हो जाएगा, और स्थिति (objXML.status) 200 वापस आ जाएगी।

 Function objXML_onreadystatechange() If (objXML.readyState = 4) Then 'msgbox objXML.statusText If (objXML.status = 200) Then bRespReceived=true SaveFile(objXML.responseText) else timerFirstRun = window.SetTimeout("Update", 60000) '     End If End If End Function 

इस स्थिति में, फ़ाइल को एक अस्थायी विंडोज फ़ोल्डर में सहेजें

 Function SaveFile(what) Set fso = CreateObject("Scripting.FileSystemObject") tempFolder = fso.GetSpecialFolder(2) filepath = tempFolder+"\weather.xml" Dim fso1, tf Set fso1 = CreateObject("Scripting.FileSystemObject") Set tf = fso1.CreateTextFile(filepath, True, True) 'rewrite, unicode tf.Write(what) tf.Close ParseXML End Function 

और फ़ाइल को पार्स करना शुरू करें।

 Sub ParseXML Set fso = CreateObject("Scripting.FileSystemObject") tempFolder = fso.GetSpecialFolder(2) filepath = tempFolder+"\weather.xml" Set xmlDoc = CreateObject("Msxml2.DOMDocument") xmlDoc.async="false" xmlDoc.load(filepath) '  –    <all> Set currNode = xmlDoc.documentElement '  – <day> Set dayNode = currNode.firstChild While Not dayNode Is Nothing Set currNode = dayNode.firstChild While Not currNode Is Nothing if currNode.parentNode.getAttribute("id") = "today" then '  if currNode.nodeName = "temp" then document.getElementById(prefix+"maintemp").innerHTML = currNode.childNodes(0).text+Chr(176) '   Else '  ,    '... end If Set currNode = currNode.nextSibling Wend Set dayNode = dayNode.nextSibling Wend End Sub 

नए संस्करणों की जाँच ठीक उसी तरह से की जाती है।
सेटिंग्स फ़ाइल - settings.html बनाना न भूलें, जिसका अस्तित्व हमने ऊपर घोषित किया था।

 <html> <head> <title></title> <style type="text/css"> body { width:220px; height:120px; } </style> </head> <body> <div style="text-align:center"> <strong>Weather from Info.Denms.Ru<br/><script type="text/javascript">document.write(System.Gadget.version);</script></strong><br/> © cvs, 2011<br/> <a href="http://info.denms.ru">http://info.kovonet.ru</a><br/><br/> </div> </body> </html> 

वह, वास्तव में, सब है। मुझे खुशी होगी अगर मेरा (पहला :)) लेख किसी के लिए उपयोगी था।

उपयोग किए गए स्रोत:
http://www.script-coding.com/XMLDOMscripts.html ;
http://msdn.microsoft.com/en-us/library/bb508511%28v=VS.85%29 .aspx ;
VBScript प्रोग्रामर संदर्भ, तीसरा संस्करण;
अच्छी तरह से, और निश्चित रूप से http://google.com ।

गैजेट के लिए लिंक - http://info.kovonet.ru/test.gadget ।