Creating Applications with Mozilla-Chapter 7. Extending the UI with XBL- P3

Tham khảo tài liệu creating applications with mozilla-chapter 7. extending the ui with xbl- p3, công nghệ thông tin, kỹ thuật lập trình phục vụ nhu cầu học tập, nghiên cứu và làm việc hiệu quả
Nội dung trích xuất từ tài liệu:
Creating Applications with Mozilla-Chapter 7. Extending the UI with XBL- P3Chapter 7. Extending the UI with XBL- P3Although it is most commonly used just for getting and setting values on theproperty, nothing stops you from putting more code in the element that carries out other actions on the binding. One scenario shown inExample 7-3 is if you have a property that holds a search value, you cansend that text to the Google [1] API, and fill another widget in the UI withthe results every time the value is updated. [2]Example 7-3. Performing a Google search when setting a property new SOAPParameter(this.start, start), new SOAPParameter(this.maxResults,maxResults), new SOAPParameter(this.filter, filter), new SOAPParameter(this.restrict,restrict), new SOAPParameter(this.safeSearch,safeSearch), new SOAPParameter(this.lr, lr), new SOAPParameter(utf8, ie), new SOAPParameter(utf8, oe) ]; s.encode(soapversion, method, object,headers.length, headers, params.length, params); s.transportURI =http://api.google.com/search/beta2 var response = s.invoke( ); if (response.fault) return { msg : SOAP call error, fault :response.fault }; // At this point you would pass the resultsback to the UI return response.message; ]]> The value of the search string is set to the value that has been given to theproperty: var q = val. This value is then added to the parameter list(SOAPParameter) for the SOAP call, along with other parameters that areobtained from other properties in the binding (e.g., this.maxResults).Notes[1] This example is modified code taken from http://www.segment7.net/mozilla/GoogleAPI/GoogleAPI.html, and is covered by a three- clause BSD license. More on SOAP and the SOAP API in Mozilla can be found at http://lxr.mozilla.org/mozilla/source/extensions/xmlextras/docs/Soap_Scripts_in_Mozilla.[2] The Google API requires a Google Key, and more information can be found at http://www.google.com/apis/.7.4. XBL and the DOMThis section introduces the DOM interfaces in XBL, illustrates how theywork, and explains the core concepts involved in XBL interaction with theDOM, such as scope characteristics and insertion points.7.4.1. The XBL DOM InterfacesXBL has two core DOM interfaces, DocumentXBL and ElementXBL.These extensions to the Document and Element interfaces are not part of theformal DOM specifications. All methods can be accessed and used fromJavaScript. Here is a list of these interface methods.7.4.1.1. DocumentXBL methodsThe DocumentXBL interface gains access to and interacts with an XBLdocument. The methods of this interface are as follows:loadBindingDocument(URL) XBL documents are loaded only the first time a bound document uses a binding from it. You can get around this problem and load the binding documents synchronously by using this method. It returns an XBL document for use within a bound document. If your document is large and you need to optimize performance, this method may provide better performance.document.loadBindingDocument(chrome://package/content/myBindings.xml);getBindingParent(element) For use only within a binding, this method returns the bound element - - i.e., the top-level node of the binding, when passed an element within a binding.var listbox = document.getBindingParent(this);var cellValue =listbox.childNodes[3].firstChild.label;getAnonymousNodes(element) Returns an array with the input bindings top-level content nodes. Refer to the section Section 7.4.3, later in this chapter, for more details.getAnonymousElementByAttribute(element, attribute, value) Returns a single anonymous element when passed an element, an attribute from that element, and its value. Refer to the section Section 7.4.3 for more details.7.4.1.2. ElementXBL methodsThe ElementXBL interface adds and removes bindings from a boundelement. The methods of this interface are as follows:addBinding(element, URL) Dynamically attaches a binding, given as a parameter, to an element. Refer to the following sections for more details.removeBinding(element, URL) Dynamically removes the given binding. Refer to the following sections for more details.7.4.1.3. Dynamically adding a bindingThe section Section 7.2 covered the attachment of a binding to a boundelement using CSS. This technique is the most common method, but you canalso attach bindings with the addBinding method.Using this method as an alternative to CSS attachment is useful when you donot want to attach a binding in all circumstances. In an application based onuser input, you may not want to load a binding until certain values areentered. For example, in a membership database, the information thatappears on screen may depend on the users level of membership. Thefollowing snippets show how it is used.To load a binding, add these two lines in your script.var binding =document.getElementById(myNewWidget);document.addBinding(binding,chrome://mypackage/content/myBindings.xml#super);Notice that the URL used to access the binding takes the same format as inthe CSS property -- i.e., the path to the file and the id of the bindingqualified by #. Neither addBinding nor removeBinding are implemented at the time of writing. They are covered because they are part of the XBL 1.0 specification. When implemented, they offer crucial alternatives for attaching and detaching bindings, making XBL a more interactive technology.7.4.1.4. Removing bindingsThe best way to remove a binding attached via CSS is to change the stylerule for that element. You can change the class to one that does not have ...