HTMLProgressElement - Web APIs
the htmlprogresselement interface provides special properties and methods (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating the layout and presentation of <progress> elements. <div id="interfacediagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveaspectratio="xminymin meet"><a xlink:href="/docs/web/api/eventtarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-ba...
...aco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y2="25" stroke="#d4dde4"/><line x1="509" y1="25" x2="509" y2="90" stroke="#d4dde4"/><line x1="509" y1="90" x2="492" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlprogresselement" target="_top"><rect x="301" y="65" width="190" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlprogresselement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherit...
..."190" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlprogresselement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherits properties from its parent, htmlelement. htmlprogresselement.max is a double value reflecting the content attribute of the same name, limited to numbers greater than zero. its default value is 1.0. ...
...And 4 more matches

progressmeter - Archive of obsolete content
« xul reference home [ examples | attributes | properties | methods | related ] a meter which can be used to display the progress of a lengthy operation. it is drawn as a bar that is filled as the operation completes. in addition, an indeterminate progressmeter may be created by setting the mode attribute to undetermined. this is used when the length of time to complete an operation is not known beforehand. more information is available in the xul tutorial. ...
... drawn as a bar that is filled as the operation completes. in addition, an indeterminate progressmeter may be created by setting the mode attribute to undetermined. this is used when the length of time to complete an operation is not known beforehand. more information is available in the xul tutorial. ...
...n completes. in addition, an indeterminate progressmeter may be created by setting the mode attribute to undetermined. this is used when the length of time to complete an operation is not known beforehand. more information is available in the xul tutorial. ...
...And 3 more matches

nsIWebProgressListener2
an extended version of nsiwebprogresslistener. uriloader/base/nsiwebprogresslistener2.idlscriptable please add a summary to this article. last changed in gecko 1.9 (firefox 3) inherits from: nsiwebprogresslistener method overview void onprogresschange64(in nsiwebprogress awebprogress, in nsirequest arequest, in long long acurselfprogress, in long long amaxselfprogress, in long long acurtotalprogress, in long long amaxtotalprogress); boolean onrefreshattempted(in nsiwebprogress awebprogress, in nsiuri arefreshuri, in long amillis, in boolean asameuri); methods onprogresschange64() notification that the progress has changed for one of the requests associated with awebprogress. ...
...sirequest arequest, in long long acurselfprogress, in long long amaxselfprogress, in long long acurtotalprogress, in long long amaxtotalprogress); boolean onrefreshattempted(in nsiwebprogress awebprogress, in nsiuri arefreshuri, in long amillis, in boolean asameuri); methods onprogresschange64() notification that the progress has changed for one of the requests associated with awebprogress. progress totals are reset to zero when all requests in awebprogress complete (corresponding to onstatechange being called with astateflags including the state_stop and state_is_window flags). this function is identical to nsiwebprogresslistener.onprogresschange(), except that this function supports 64-bit values. ...
...gress has changed for one of the requests associated with awebprogress. progress totals are reset to zero when all requests in awebprogress complete (corresponding to onstatechange being called with astateflags including the state_stop and state_is_window flags). this function is identical to nsiwebprogresslistener.onprogresschange(), except that this function supports 64-bit values. note: if any progress value is unknown, then its value is replaced with -1. void onprogresschange64( in nsiwebprogress awebprogress, in nsirequest arequest, in long long acurselfprogress, in long long amaxselfprogress, in long long acurtotalprogress, in long long amaxtotalprogress ); parameters awebprogress the nsiwebprogress instance that fired the notification. arequest the nsirequest that has new prog...
...And 3 more matches

ProgressEvent() - Web APIs
it defaults to false. loaded optional is an unsigned long long representing the amount of work already performed by the underlying process. ...
...it defaults to false. loaded optional is an unsigned long long representing the amount of work already performed by the underlying process. ...
...it defaults to false. loaded optional is an unsigned long long representing the amount of work already performed by the underlying process. ...
...And 3 more matches

Using the progressbar role - Accessibility
this technique demonstrates how to use the progressbar role and describes the effect it has on browsers and assistive technology. the progressbar role should be used for an element that displays the progress status for a task that take a long time or consists of several steps. a progressbar indicates that the user's request has been received and the application is making progress toward completing the requested action. if the actual value of the progressbar can be determined, the developer has to indicate this progress using the aria-valuenow, aria-valuemin, and aria-valuemax attributes. if the progress value is indeterminate, the developer should omit the aria-valuenow attribute. ...
...at the user's request has been received and the application is making progress toward completing the requested action. if the actual value of the progressbar can be determined, the developer has to indicate this progress using the aria-valuenow, aria-valuemin, and aria-valuemax attributes. if the progress value is indeterminate, the developer should omit the aria-valuenow attribute. as the task progresses, the aria-valuenow value has to be updated dynamically to indicate this progress to assistive technology products. if the progressbar is describing the loading progress of a particular region of a page, the author should use aria-describedby to point to the status, and set the aria-busy attribute to true on the region until it is finished loading. it is not possible for the user to alter the ...
... note: assistive technologies generally will render the value of aria-valuenow as a percent of the range between the value of aria-valuemin and aria-valuemax, unless aria-valuetext is specified. ...
...And 3 more matches

nsIDOMProgressEvent
dom/interfaces/events/nsidomprogressevent.idlscriptable this interface represents the events sent with progress information while uploading data using the xmlhttprequest object. 1.0 66 introduced gecko 1.9.1 deprecated gecko 22 inherits from: nsidomevent last changed in gecko 1.9.1 (firefox 3.5 / thunderbird 3.0 / seamonkey 2.0) the nsidomprogressevent is used in the media elements (<video> and <audio>) to inform interested code of the progress of the media download. this implementation is a placeholder until the specification is complete, and is compatible with the webkit progressevent. ...
...its from: nsidomevent last changed in gecko 1.9.1 (firefox 3.5 / thunderbird 3.0 / seamonkey 2.0) the nsidomprogressevent is used in the media elements (<video> and <audio>) to inform interested code of the progress of the media download. this implementation is a placeholder until the specification is complete, and is compatible with the webkit progressevent. method overview void initprogressevent(in domstring typearg, in boolean canbubblearg, in boolean cancelablearg, in boolean lengthcomputablearg, in unsigned long long loadedarg, in unsigned long long totalarg); deprecated since gecko 22.0 attributes attribute type description lengthcomputable boolean specifies whether or not the total size of the transfer is known. read only. loaded ...
... loaded unsigned long long the number of bytes transferred since the beginning of the operation. this doesn't include headers and other overhead, but only the content itself. read only. total unsigned long long the total number of bytes of content that will be transferred during the operation. if the total size is unknown, this value is zero. read only. ...
...And 2 more matches

HTMLMediaElement: progress event - Web APIs
the progress event is fired periodically as the browser loads a resource. ...
... the progress event is fired periodically as the browser loads a resource. ...
...bel { display: block; } javascript const loadvideo = document.queryselector('button'); const video = document.queryselector('video'); const eventlog = document.queryselector('.event-log-contents'); let source = null; function handleevent(event) { eventlog.textcontent = eventlog.textcontent + `${event.type}\n`; } video.addeventlistener('loadstart', handleevent); video.addeventlistener('progress', handleevent); video.addeventlistener('canplay', handleevent); video.addeventlistener('canplaythrough', handleevent); loadvideo.addeventlistener('click', () => { if (source) { document.location.reload(); } else { loadvideo.textcontent = "reset example"; source = document.createelement('source'); source.setattribute('src', 'https://interactive-examples.md...
...And 2 more matches

webProgress - Archive of obsolete content
...
... ...
... ...
... ...

nsITaskbarProgress
widget/public/nsitaskbarprogress.idlscriptable starting in windows 7, applications can display a progress notification in the taskbar. this class wraps around the native functionality to do this. 1.0 66 introduced gecko 1.9.2 inherits from: nsisupports last changed in gecko 1.9.2 (firefox 3.6 / thunderbird 3.1 / fennec 1.0) method overview void setprogressstate(in nstaskbarprogressstate state, in unsigned long long currentvalue optional, in unsigned long long maxvalue optional); constants constant value description state_no_progress 0 stop displaying progress on the taskbar button. this should be used when the operation is complete or canceled. state_indeterminate 1 display a cycling, indeterminate progress bar. state_normal 2 display a determinate,...
...gressstate state, in unsigned long long currentvalue optional, in unsigned long long maxvalue optional); constants constant value description state_no_progress 0 stop displaying progress on the taskbar button. this should be used when the operation is complete or canceled. state_indeterminate 1 display a cycling, indeterminate progress bar. state_normal 2 display a determinate, normal progress bar. state_error 3 display a determinate, error progress bar. state_paused 4 display a determinate progress bar indicating that the operation has paused. methods setprogressstate() sets the taskbar progress state and value for this window. the currentvalue and maxvalue parameters are optional and should be supplied when state is one of state_normal, state_error or state_paused. void setpro...
...lay a determinate, error progress bar. state_paused 4 display a determinate progress bar indicating that the operation has paused. methods setprogressstate() sets the taskbar progress state and value for this window. the currentvalue and maxvalue parameters are optional and should be supplied when state is one of state_normal, state_error or state_paused. void setprogressstate( in nstaskbarprogressstate state, in unsigned long long currentvalue, optional in unsigned long long maxvalue optional ); parameters state one of the state constants. currentvalue the current progress value. maxvalue the maximum progress value. exceptions thrown ns_error_illegal_value if currentvalue is greater than maxvalue. ...
...id setprogressstate( in nstaskbarprogressstate state, in unsigned long long currentvalue, optional in unsigned long long maxvalue optional ); parameters state one of the state constants. currentvalue the current progress value. maxvalue the maximum progress value. exceptions thrown ns_error_illegal_value if currentvalue is greater than maxvalue. ns_error_invalid_arg if state is state_no_progress or state_indeterminate, and either currentvalue or maxvalue is not 0. see also nsiwintaskbar windows 7 taskbar apis ...

FileReader: progress event - Web APIs
the progress event is fired periodically as the filereader reads data. ...
... the progress event is fired periodically as the filereader reads data. ...
... the progress event is fired periodically as the filereader reads data. ...
... eventlog.textcontent = eventlog.textcontent + `${event.type}: ${event.loaded} bytes transferred\n`; if (event.type === "load") { preview.src = reader.result; } } function addlisteners(reader) { reader.addeventlistener('loadstart', handleevent); reader.addeventlistener('load', handleevent); reader.addeventlistener('loadend', handleevent); reader.addeventlistener('progress', handleevent); reader.addeventlistener('error', handleevent); reader.addeventlistener('abort', handleevent); } function handleselected(e) { eventlog.textcontent = ''; const selectedfile = fileinput.files[0]; if (selectedfile) { addlisteners(reader); reader.readasdataurl(selectedfile); } } fileinput.addeventlistener('change', handleselected); result ...

HTMLProgressElement.labels - Web APIs
the htmlprogresselement.labels read-only property returns a nodelist of the <label> elements associated with the <progress> element. syntax var labelelements = progress.labels; return value a nodelist containing the <label> elements associated with the <progress> element. ...
... the htmlprogresselement.labels read-only property returns a nodelist of the <label> elements associated with the <progress> element. syntax var labelelements = progress.labels; return value a nodelist containing the <label> elements associated with the <progress> element. ...
... the htmlprogresselement.labels read-only property returns a nodelist of the <label> elements associated with the <progress> element. syntax var labelelements = progress.labels; return value a nodelist containing the <label> elements associated with the <progress> element. ...
...s> element. syntax var labelelements = progress.labels; return value a nodelist containing the <label> elements associated with the <progress> element. example html <label id="label1" for="test">label 1</label> <progress id="test" value="70" max="100">70%</progress> <label id="label2" for="test">label 2</label> javascript window.addeventlistener("domcontentloaded", function() { const progress = document.getelementbyid("test"); for(var i = 0; i < progress.labels.length; i++) { console.log(progress.labels[i].textcontent); // "label 1" and "label 2" } }); specifications specification status comment html living standardthe definition of 'labels' in that specification. living standard no change html5the definition of 'labels' in that s...

XMLHttpRequest: progress event - Web APIs
the progress event is fired periodically when a request receives more data. ...
... the progress event is fired periodically when a request receives more data. ...
... the progress event is fired periodically when a request receives more data. ...
....queryselector('.xhr.abort'); const log = document.queryselector('.event-log'); function handleevent(e) { log.textcontent = log.textcontent + `${e.type}: ${e.loaded} bytes transferred\n`; } function addlisteners(xhr) { xhr.addeventlistener('loadstart', handleevent); xhr.addeventlistener('load', handleevent); xhr.addeventlistener('loadend', handleevent); xhr.addeventlistener('progress', handleevent); xhr.addeventlistener('error', handleevent); xhr.addeventlistener('abort', handleevent); } function runxhr(url) { log.textcontent = ''; const xhr = new xmlhttprequest(); addlisteners(xhr); xhr.open("get", url); xhr.send(); return xhr; } xhrbuttonsuccess.addeventlistener('click', () => { runxhr('https://mdn.mozillademos.org/files/16553/dgszyjnx...

Progressive Enhancement - MDN Web Docs Glossary: Definitions of Web-related terms
progressive enhancement is a design philosophy that provides a baseline of essential content and functionality to as many users as possible, while delivering the best possible experience only to users of the most modern browsers that can run all the required code. feature detection is generally used to determine whether browsers can handle more modern functionality, while polyfills are often used to add missing features with javascript. special notice should be taken of accessibility. acceptable alternatives should be provided where possible. progressive enhancement is a useful technique that allows web developers to focus on developing the best possible websites while making those websites work on multiple unknown user agents. graceful degradation is related but is not the same thing a...
...ce should be taken of accessibility. acceptable alternatives should be provided where possible. progressive enhancement is a useful technique that allows web developers to focus on developing the best possible websites while making those websites work on multiple unknown user agents. graceful degradation is related but is not the same thing and is often seen as going in the opposite direction to progressive enhancement. in reality both approaches are valid and can often complement one another. ...
...echnique that allows web developers to focus on developing the best possible websites while making those websites work on multiple unknown user agents. ...

XMLHttpRequestEventTarget.onprogress - Web APIs
the xmlhttprequesteventtarget.onprogress is the function called periodically with information when an xmlhttprequest before success completely. syntax xmlhttprequest.onprogress = callback; values callback is the function to be called periodically before the request is completed. event event.loaded the amount of data currently transfered. event.total the total amount of data to be transferred. ...
....onprogress is the function called periodically with information when an xmlhttprequest before success completely. syntax xmlhttprequest.onprogress = callback; values callback is the function to be called periodically before the request is completed. event event.loaded the amount of data currently transfered. event.total the total amount of data to be transferred. ...
...iodically before the request is completed. event event.loaded the amount of data currently transfered. event.total the total amount of data to be transferred. ...

How to make PWAs installable - Progressive web apps (PWAs)
the installed web app can then be launched by users just as if it were any native app. this article explains how to achieve this using the web app's manifest. these technologies allow the app to be launched directly from the device's home screen, rather than the user having to open the browser and then navigate to the site by using a bookmark or typing the url. your web app can sit next to native applications as first class citizens. ...
... of manifest file that have been used in the past: manifest.webapp was popular in firefox os app manifests, and many use manifest.json for web manifests as the contents are organized in a json structure. however, the .webmanifest file format is explicitly mentioned in the w3c manifest specification, so that's what we'll use here. the content of the file looks like this: { "name": "js13kgames progressive web app", "short_name": "js13kpwa", "description": "progressive web app that lists games submitted to the a-frame category in the js13kgames 2017 competition.", "icons": [ { "src": "icons/icon-32.png", "sizes": "32x32", "type": "image/png" }, // ... { "src": "icons/icon-512.png", "sizes": "512x512", "type": "image/png" } ], "sta...
...to read our add to home screen guide. ...

Making PWAs work offline with Service workers - Progressive web apps (PWAs)
in this article, we look at how it is used in our js13kpwa example (see the source code also). we examine how to add offline functionality. service workers explained service workers are a virtual proxy between the browser and the network. they finally fix issues that front-end developers have struggled with for years — most notably how to properly cache the assets of a website and make them available when the user’s device is offline. ...
...u can always test on a localhost or setup github pages — both support https. offline first the "offline first" — or "cache first" — pattern is the most popular strategy for serving content to the user. if a resource is cached and available offline, return it first before trying to download it from the server. if it isn’t in the cache already, download it and cache it for future usage. "progressive" in pwa when implemented properly as a progressive enhancement, service workers can benefit users who have modern browsers that support the api by providing offline support, but won't break anything for those using legacy browsers. service workers in the js13kpwa app enough theory — let's see some source code! registering the service worker we'll start by looking at the code that regist...
...this article we took a simple look at how you can make your pwa work offline with service workers. be sure to check out our further documentation if you want to learn more about the concepts behind the service worker api and how to use it in more detail. service workers are also used when dealing with push notifications — this will be explained in a subsequent article. previous overview: progressive web apps next ...

progress - Archive of obsolete content
read only. type string the type of event. read only. canbubble boolean does the event normally bubble? read only. cancelable boolean is it possible to cancel the event? read only. lengthcomputable boolean specifies whether or not the total size of the transfer is known. read only. ...
...number of bytes transferred since the beginning of the operation. this doesn't include headers and other overhead, but only the content itself. read only. total unsigned long (long) the total number of bytes of content that will be transferred during the operation. if the total size is unknown, this value is zero. read only. related events checking noupdate downloading progress cached updateready obsolete error ...

removeProgressListener - Archive of obsolete content
...
... ...

-ms-block-progression - Archive of obsolete content
initial valuetbapplies toall elementsinheritednocomputed valueas specifiedanimation typediscrete syntax values tb default. top-to-bottom block flow. layout is horizontal. rl right-to-left block flow. layout is vertical. bt bottom-to-top block flow. layout is horizontal. lr left-to-right block flow. layout is vertical. formal syntax tb | rl | bt | lr specifications not part of any specification. remarks in vertical layout, text lines are rotated 90° clockwise. images are not rotated, but tables are. ...
...yout is vertical. formal syntax tb | rl | bt | lr specifications not part of any specification. remarks in vertical layout, text lines are rotated 90° clockwise. images are not rotated, but tables are. box layout in vertical orientations is exactly analogous to layout in the horizontal orientation: width, height, top, bottom, right, and left do not rotate with the text. only one block progression is active at a time; these values cannot be combined. this property is based on the block-progression property of the css3 text layout module. ...

Progressive web apps - MDN Web Docs Glossary: Definitions of Web-related terms
progressive web apps is a term used to describe the modern state of web app development. this involves taking standard web sites/apps that enjoy all the best parts of the web — such as discoverability via search engines, being linkable via urls, and working across multiple form factors — and supercharging them with modern apis (such as service workers and push) and features that confer other benefits more commonly attributed to native apps. these features include being installable, working offline, and being easy to sync with and re-engage the user from the server. ...
...ngines, being linkable via urls, and working across multiple form factors — and supercharging them with modern apis (such as service workers and push) and features that confer other benefits more commonly attributed to native apps. these features include being installable, working offline, and being easy to sync with and re-engage the user from the server. learn more the app center on mdn progressive web apps on google developers ...

mozIStorageProgressHandler
the mozistorageprogresshandler interface lets storage consumers receive callbacks during the execution of sqlite requests. storage/public/mozistorageprogresshandler.idlscriptable please add a summary to this article. last changed in gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) inherits from: nsisupports method overview boolean onprogress(in mozistorageconnection aconnection); methods onprogress() the onprogress() method is called periodically while an sqlite operation is ongoing. this allows you to monitor the progress and possibly display status information to the user. ...
... return value return true to abort the request or false to allow it to continue. ...

FileRequest.onprogress - Web APIs
this feature is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. summary this property specifies a callback function to be run repeatedly while the operation represented by a filerequest object is in progress. syntax instanceoffilerequest.onprogress = function; where instanceoffilerequest is a filerequest object and function is the javascript function to execute. each time the function callback is called, it gets an object as its first parameter. those objects contain two properties: loaded a number representing the current amount of bytes processed by the operation. total a number represen...
...ion to execute. each time the function callback is called, it gets an object as its first parameter. those objects contain two properties: loaded a number representing the current amount of bytes processed by the operation. total a number representing the total amount of bytes that will be processed by the operation. example // assuming 'request' which is a filerequest object request.onprogress = function (status) { var progress = document.queryselector('progress'); progress.value = status.loaded; progress.max = status.total; } specification not part of any current specification. ...

::-webkit-progress-bar - CSS: Cascading Style Sheets
the ::-webkit-progress-bar css pseudo-element represents the entire bar of a <progress> element. normally it's only visible as the unfilled portion of the bar, since by default it's rendered below the ::-webkit-progress-value pseudo-element. it is a child of the ::-webkit-progress-inner-element pseudo-element and the parent of the ::-webkit-progress-value pseudo-element. note: for ::-webkit-progress-value to take effect, appearance needs to be set to none on the <progress> element. ...
...s only visible as the unfilled portion of the bar, since by default it's rendered below the ::-webkit-progress-value pseudo-element. it is a child of the ::-webkit-progress-inner-element pseudo-element and the parent of the ::-webkit-progress-value pseudo-element. note: for ::-webkit-progress-value to take effect, appearance needs to be set to none on the <progress> element. syntax ::-webkit-progress-bar examples css content progress { -webkit-appearance: none; } ::-webkit-progress-bar { background-color: orange; } html content <progress value="10" max="50"> result result screenshot if you're not using a webkit or blink browser, the code above results in a progress bar that looks like this: specifications not part of any standard. ...

::-webkit-progress-inner-element - CSS: Cascading Style Sheets
the ::-webkit-progress-inner-element css pseudo-element represents the outermost container of the <progress> element. it is the parent of the ::-webkit-progress-bar pseudo-element. note: in order to let ::-webkit-progress-value take effect, -webkit-appearance needs to be set to none on the <progress> element. syntax ::-webkit-progress-inner-element examples these examples work only on blink and webkit. adding a black border around the progress bar in this example, a 2px black border is added around the progress bar. ...
...he ::-webkit-progress-bar pseudo-element. note: in order to let ::-webkit-progress-value take effect, -webkit-appearance needs to be set to none on the <progress> element. syntax ::-webkit-progress-inner-element examples these examples work only on blink and webkit. adding a black border around the progress bar in this example, a 2px black border is added around the progress bar. html <progress value="10" max="50"> css progress { -webkit-appearance: none; } ::-webkit-progress-inner-element { border: 2px solid black; } result result screenshot if you're not using a blink or webkit browsear, the above code resuls in a progress bar looking like this: specifications not part of any standard. ...

How to make PWAs re-engageable using Notifications and Push - Progressive web apps (PWAs)
allowing the user to install the web app on their home screen is even better. but instead of relying only on user actions, we can do more, using push messages and notifications to automatically re-engage and deliver new content whenever it is available. two apis, one goal the push api and notifications api are two separate apis, but they work well together when you want to provide engaging functionality in your app. push is used to deliver new content from the server to the app without any client-side intervention, and its operation is handled by the app's service worker. ...
...), and then wait until the notification is shown to the user. feel free to explore the rest of the examples in the service worker cookbook if you want to know how they are handled — the full source code is available on github. there's a big collection of working examples showing general use, but also web push, caching strategies, performance, working offline, and more. previous overview: progressive next ...

progressmeter.max - Archive of obsolete content
« xul reference home max type: integer the maximum value that progressmeter may have. the default value if not specified is 100 such that the value may be used as a percentage. ...

progressmeter.mode - Archive of obsolete content
« xul reference home mode type: one of the values below a determinedprogressmeter is used in cases where you know how long an operation will take. an undeterminedprogressmeter can be used when you don't and will typically be drawn as a spinning barber pole. determined the progress meter uses its value attribute to determine the amount of the bar that is filled in. undetermined the progressmeter is indeterminate. ...

progressmeter.value - Archive of obsolete content
« xul reference home value type: integer an integer ranging from 0 to the maximum value that indicates the progress. for instance, if no maximum value has been set, setting the value to "0" shows an empty bar, "100" shows a bar at full length and "25" shows the first quarter of the bar. ...

addTabsProgressListener - Archive of obsolete content
« xul reference home addtabsprogresslistener( listener ) return type: no return value add a progress listener to the browser which will monitor loaded documents in all tabs in the tabbed browser. the progress listener should be based on the nsiwebprogresslistener interface with an additional "browser" argument as the first argument of every method, which is the browser (not <tabbrowser> = gbrowser) where the event occurred. see listening to events on all tabs for details. ...

removeTabsProgressListener - Archive of obsolete content
« xul reference home removetabsprogresslistener( listener ) return type: no return value removes a progress listener to the browser which has been monitoring all tabs. the progress listener should implement the nsiwebprogresslistener interface. ...

addProgressListener - Archive of obsolete content
« xul reference home addprogresslistener( listener ) return type: no return value add a progress listener to the browser which will monitor loaded documents. the progress listener should implement the nsiwebprogresslistener interface. ...

progressmeter.max - Archive of obsolete content
the default value is 100. ...

::-moz-tree-progressmeter
activated when the type attribute is set to progressmeter. associated elements <xul:treecell> style properties margin color ...

NSS Tools Man Pages - work in progress
these man pages where generated from xml docbook files. ...

ProgressEvent.lengthComputable - Web APIs
the progressevent.lengthcomputable read-only property is a boolean flag indicating if the resource concerned by the progressevent has a length that can be calculated. if not, the progressevent.total property has no significant value. syntax flag = progressevent.lengthcomputable specifications specification status comment xmlhttprequestthe definition of 'progressevent.lengthcomputable' in that specification. living standard ...

ProgressEvent.loaded - Web APIs
the progressevent.loaded read-only property is an integer representing the amount of work already performed by the underlying process. the ratio of work done can be calculated with the property and progressevent.total. when downloading a resource using http, this only represent the part of the content itself, not headers and other overhead. syntax value = progressevent.loaded specifications specification status comment xmlhttprequestthe definition of 'progressevent.loaded' in that specification. living standard ...

ProgressEvent.total - Web APIs
the progressevent.total read-only property is an integer representing the total amount of work that the underlying process is in the progress of performing. when downloading a resource using http, this only represent the content itself, not headers and other overhead. syntax value = progressevent.total specifications specification status comment xmlhttprequestthe definition of 'progressevent.lengthcomputable' in that specification. living standard ...

XDomainRequest.onprogress - Web APIs
this method is called periodically as an event handler for progress events on xdomainrequests, so that code can monitor progress while loading content. note: while handling this event, you can look at xdomainrequest.responsetext to get the response so far. once loading is complete, the xdomainrequest.onload event handler gets called. syntax xdr.onprogress = funcref; parameters funcref a function to call when progress events occur. example var xdr = new xdomainrequest(); xdr.open("post", "http://example.com/api/method"); xdr.onprogress = function(){ //handle partial response with xdr.responsetext } xdr.onload = function(){ //handle response with xdr.responsetext } xdr.send("param1=value1&param2=value2"); specification not part of any specification. ...

::-moz-progress-bar - CSS: Cascading Style Sheets
the ::-moz-progress-bar css pseudo-element is a mozilla extension that represents the progress bar inside a <progress> element. (the bar represents the amount of progress that has been made.) if you want to select the unfinished part of <progress> in mozilla, please select the <progress> directly. syntax ::-moz-progress-bar examples html <progress value="30" max="100">30%</progress> <progress max="100">indeterminate</progress> css ::-moz-progress-bar { background-color: red; } /* force indeterminate bars to have zero width */ :indeterminate::-moz-progress-bar { width: 0; } result specifications not part of any standard. ...

::-moz-range-progress - CSS: Cascading Style Sheets
the ::-moz-range-progress css pseudo-element is a mozilla extension that represents the lower portion of the track (i.e., groove) in which the indicator slides in an <input> of type="range". this portion corresponds to values lower than the value currently selected by the thumb (i.e., virtual knob). note: using ::-moz-range-progress with anything but an <input type="range"> doesn't match anything and has no effect. syntax ::-moz-range-progress examples html <input type="range" min="0" max="100" step="5" value="50"/> css input[type=range]::-moz-range-progress { background-color: green; height: 1em; } result a progress bar using this style might look something like this: specifications not part of any standard. ...

::-webkit-progress-value - CSS: Cascading Style Sheets
the ::-webkit-progress-value css pseudo-element represents the filled-in portion of the bar of a <progress> element. it is a child of the ::-webkit-progress-bar pseudo-element. note: in order to let ::-webkit-progress-value take effect, -webkit-appearance needs to be set to none on the <progress> element. syntax ::-webkit-progress-value examples this example will only work in browsers based on blink or webkit. html <progress value="10" max="50"> css progress { -webkit-appearance: none; } ::-webkit-progress-value { background-color: orange; } result result screenshot a progress bar using the style above would look like this: specifications not part of any standard. ...

Add to Home screen - Progressive web apps (PWAs)
short) is a feature available in modern browsers that allows a user to "install" a web app, ie. add a shortcut to their home screen representing their favorite web app (or site) so they can subsequently access it with a single tap. this guide explains how a2hs is used, and what you need to do as a developer to allow your users to take advantage of it. why a2hs? a2hs is thought to be part of the progressive web app philosophy — giving web apps the same user experience advantages as native apps so they can compete in today's ecosystem wars. part of this is the simple gesture of accessing an app by tapping its icon on your home screen, and then having it appear neatly in its own window. a2hs makes this possible. what browsers support a2hs? a2hs is supported in all mobile browsers, except ios we...

Installing and uninstalling web apps - Progressive web apps (PWAs)
g system and browser, this can result in what is essentially a fully featured application (for example, using webapk on android) or as a shortcut added to their device’s screen. this guide explains how installation is performed, what it means, and what you need to do as a developer to let your users take advantage of it. why installation? the option to install a web application is part of the progressive web app philosophy—giving web apps the same user experience advantages as native apps so they can be competitive. installed applications are more conveniently invoked as they have a presence in a device’s home screen or app list or bar. this makes it simple for a user to use a gesture to access an app by tapping or clicking its icon. the application itself may then manifest as in a chromel...

PWA developer guide - Progressive web apps (PWAs)
for all other documentation about web development, which generally pertains to pwas as well, see our primary web development documentation. --->>> titles below are just for the list; give articles good seo names and feel free to tweak those and this as needed... <<<--- web app basics introduction and getting started with pwa development some description installing and uninstalling web apps an introductory guide to how a web app can be installed on the user's device... ...

Media - Progressive web apps (PWAs)
. see privacy and the : visited selector for more details. the cursor property specifies the shape of the pointer: some of the common shapes are as follows. place your mouse over the items in this list to see the actual pointer shapes in your browser: selector selects pointer indicating a link wait indicating that the program cannot accept input progress indicating that the program is working, but can still accept input default the default (usually an arrow) an outline property creates an outline that is often used to indicate keyboard focus. its values are similar to the border property, except that you cannot specify individual sides. some other features of user interfaces are implemented using attributes, in the normal w...

Mobile first - Progressive web apps (PWAs)
ncountered, rather than having desktop/wider screen styling first. this way, mobile devices don't have to load assets and other information twice. if you are using mechanisms like feature detection and matchmedia to conditionally load scripting functionality depending on viewport size, feature support, etc., you should just load the very basics that pretty much all browsers will need first, then progressively enhance browsers higher up the food chain. note: starting with very little and working up as the need arises usually makes more sense than starting with everything and then covering up things if they aren't needed! mobile constraints we have already mentioned the fact that mobiles generally have less memory, processing power and bandwidth than other devices (although bear in mind that ...

Index - Web APIs
diocontext, experimental, property, reference, web audio api, outputlatency the outputlatency read-only property of the audiocontext interface provides an estimation of the output latency of the current audio context. ...
...me() api, audio, audiocontext, method, reference, web audio api, resume the resume() method of the audiocontext interface resumes the progression of time in an audio context that has previously been suspended. 135 audiocontext.suspend() api, audio, audiocontext, method, reference, web audio api, suspend the suspend() method of the audiocontext interface suspends the progression of time in the audio context, temporarily halting audio hardware access and reducing cpu/battery usage in the process — this is useful if you want an application to power down the audio hardware when it will not be using an audio context for a while. 136 audiocontextlatencycategory api, audio, audio context, audiocontextlatencycategory, enum, interface, media, reference, type,...
...terationstart or after animation's end time. 1094 effecttiming.iterationstart api, animation, effecttiming, experimental, keyframeeffect, property, reference, web animations, animate, iterationstart, waapi, web animations api web animations api's effecttiming dictionary's iterationstart property specifies the repetition number which repetition the animation begins at and its progress through it. 1095 effecttiming.iterations api, animation, effecttiming, experimental, keyframeeffect, property, reference, web animations, animate, iterations, waapi, web animations api the web animations api dictionary effecttiming's iterations property specifies the number of times the animation should repeat. the default value is 1, indicating that it should only play once,...
...And 37 more matches

Creating a cross-browser video player - Developer guides
viewing the video, a fallback for a fallback if you like). the code above would allow playback of the video in most browsers, using the browser's default control set. the next step is to define a custom control set, also in html, which will be used to control the video. ...
...ie8 and ie9). this list is inserted after the <video> element, but inside the <figure> element (this is important for the fullscreen functionality, which is explained later on). ...
...ie8 and ie9). this list is inserted after the <video> element, but inside the <figure> element (this is important for the fullscreen functionality, which is explained later on). ...
...And 20 more matches

Background Tasks API - Web APIs
updates to the document content using requestanimationframe(). below you'll find only the html and javascript for this example. the css is not shown, since it's not particularly crucial to understanding this functionality. html content in order to be oriented about what we're trying to accomplish, let's have a look at the html. this establishes a box (id "container") that's used to present the progress of an operation (because you never know how long decoding "quantum filament tachyon emissions" will take, after all) as well as a second main box (with the id "logbox"), which is used to display textual output. <p> demonstration of using <a href="/docs/web/api/background_tasks_api"> cooperatively scheduled background tasks</a> using the <code>requestidlecallback()</code> method. </p> <div...
...ill take, after all) as well as a second main box (with the id "logbox"), which is used to display textual output. <p> demonstration of using <a href="/docs/web/api/background_tasks_api"> cooperatively scheduled background tasks</a> using the <code>requestidlecallback()</code> method. ...
...er all) as well as a second main box (with the id "logbox"), which is used to display textual output. <p> demonstration of using <a href="/docs/web/api/background_tasks_api"> cooperatively scheduled background tasks</a> using the <code>requestidlecallback()</code> method. ...
...And 19 more matches

Index - Archive of obsolete content
extensions, places no summary! 175 boxes code snippets make the box style="display: block" and the wrapping behavior will occur when the box is resized: 176 canvas code snippets canvas, code snippets, graphics no summary! 177 cookies add-ons, code snippets, cookies, extensions no summary! 178 customizing the download progress bar no summary! 179 delayed execution code snippets no summary! 180 dialogs and prompts add-ons, code snippets, extensions, xul no summary! 181 downloading files code snippets to download a file, create an instance of nsiwebbrowserpersist and call its nsiwebbrowserpersist.saveuri() method, passing it a url to download and a...
... 199 modules no summary! 200 on page load add-ons, extensions no summary! 201 page loading code snippets no summary! 202 post data to window add-ons, extensions, needscontent no summary! 203 preferences add-ons, code snippets, extensions, guide, mozilla, preferences no summary! 204 progress listeners add-ons, extensions no summary! 205 queryselector dom no summary! 206 rosetta c, dom, html, htmlscriptelement, javascript, non-javascript, programming languages no summary! 207 running applications add-ons, code snippets, extensions no summary! 208 svg animation needscontent no summary! ...
... archives comments, ideas, questions and other discussion should be added on the devmo talk:1.0 launch roadmap page. further details on smaller tasks being done are available at user:dria:todo page. see also current events. 423 download manager improvements in firefox 3 download manager, firefox 3 firefox 3 offers improvements to the download manager that allow multiple progress listeners, use of the storage api for data management, download resuming, and more. in addition, you can augment or replace the download manager's user interface by implementing the new nsidownloadmanagerui interface. 424 download manager preferences there are several preferences used by the download manager. this article provides a list of them. 425 drag and drop...
...And 18 more matches

Downloading Files - Archive of obsolete content
omes from. if, and only if, the url is not // related to a window, null should be used instead. ...
...var privacy = privatebrowsingutils.privacycontextfromwindow(urlsourcewindow); persist.persistflags = persist.persist_flags_from_cache | persist.persist_flags_replace_existing_files; persist.saveuri(uritosave, null, null, null, "", targetfile, privacy); if you don't need detailed progress information, you might be happier with nsidownloader. ...
...ow(urlsourcewindow); persist.persistflags = persist.persist_flags_from_cache | persist.persist_flags_replace_existing_files; persist.saveuri(uritosave, null, null, null, "", targetfile, privacy); if you don't need detailed progress information, you might be happier with nsidownloader. ...
...And 17 more matches

Web applications and ARIA FAQ - Accessibility
overview of accessible web applications and widgets. where is aria supported? aria is a relatively new specification, but support for it is growing. a wide variety of commonly-used browsers, assistive technologies, javascript toolkits, and applications now support aria. however, many users may still be using older versions of these technologies. you may want to consider implementing aria using progressive enhancement techniques—such as adding aria using javascript, not directly to your markup—in order to more gracefully support older browsers and assistive technologies. browsers aria is supported in the following browsers: browser minimum version notes firefox 3.0+ works with nvda, jaws 10+, and orca chrome latest screen reader support still e...
...mber of popular javascript user interface toolkits, including: dojo/dijit jquery ui fluid infusion google closure google web toolkit bbc glow yahoo! user interface library (yui) for more information about javascript toolkit accessibility: steve faulkner's wai-aria implementation in javascript ui libraries can you show me an example of aria in action? sure. here's the markup for a progress bar widget: <div id="percent-loaded" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" /> this progress bar is built using a <div>, which is not very descriptive. unfortunately, there isn't a more semantic tag available to developers in html 4, so we need to include aria roles and properties. these are specified by adding attributes to the element. in this example, the...
...dget: <div id="percent-loaded" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" /> this progress bar is built using a <div>, which is not very descriptive. unfortunately, there isn't a more semantic tag available to developers in html 4, so we need to include aria roles and properties. these are specified by adding attributes to the element. in this example, the role="progressbar" attribute informs the browser that this element is actually a javascript-powered progress bar widget. the aria-valuemin and aria-valuemax attributes specify the minimum and maximum values for the progress bar, and the aria-valuenow describes the current state of it. along with placing them directly in the markup, aria attributes can be added to the element and updated dynamically using javas...
...And 16 more matches

Video player styling basics - Developer guides
styled example on github, and view it live. preliminary modifications from the original example this section summarises the modifications that were made to the original video player example to make the styling task easier, before the bulk of the work was started. html markup there are a few changes that were made to the html markup shown in the previous article. ...
...ols and <progress> element are now contained within <div> elements, rather than residing inside unordered list items. ...
... element are now contained within <div> elements, rather than residing inside unordered list items. ...
...And 16 more matches

Listening to events on all tabs
firefox 3.5 adds support for listening to progress events on all tabs. adding a listener to listen to progress events on all tabs, call the browser's addtabsprogresslistener() method: gbrowser.addtabsprogresslistener(myprogresslistener); myprogresslistener is an object that implements the callbacks used to provide notifications of progress events. removing a listener to remove a previously installed progress listener, call removetabsprogresslistener(): gbrowser.removetabsprogresslistener(myprogresslistener); implementing a listener the listener object itself has five methods it can implement to handle various events: onlocationchange called when the uri of the document displayed in the tab changes. ...
... arequest the nsirequest object representing the associated request. ...
... arequest the nsirequest object representing the associated request. ...
...And 15 more matches

Index
a c++ class hierarchy to pass string data, rather than using raw pointers. this guide documents the string classes which are visible to code within the mozilla codebase (code which is linked into libxul). 118 receiving startup notifications component manager, embedding mozilla, needsupdate, xpcom sometimes it's necessary for xpcom components to receive notifications as to the progress of the application's startup process, so they can start new services at appropriate times, for example. 119 xpcom stream guide guide, needscontent, xpcom in mozilla code, a stream is an object which represents access to a sequence of characters. it is not that sequence of characters, though: the characters may not all be available when you read from the stream. 120 ...
...sentence rather than the screen reader's. the rest of the boundary types must be supported. this enum is used in textbeforeoffset(), textatoffset(), and textafteroffset(). 174 iaccessiblevalue interfaces, xpcom, xpcom interface reference the iaccessiblevalue interface represents a single numerical value and should be implemented by any class that supports numerical value like progress bars and spin boxes. this interface lets you access the value and its upper and lower bounds. 175 idispatch interfaces, interfaces:scriptable, xpcom, xpcom interface reference no summary! 176 ijsdebugger debugger, interfaces, interfaces:scriptable, xpcom interface reference implemented by: @mozilla.org/jsdebugger;1 as a service: 177 amiinstallc...
... objects implementing this interface can be registered with mozistorageconnection.createfunction(). 211 mozistoragependingstatement interfaces, interfaces:scriptable, storage the mozistoragependingstatement interface represents a pending asynchronous database statement, and offers the cancel() method which allows you to cancel the pending statement. 212 mozistorageprogresshandler interfaces, storage, xpcom, xpcom api reference the mozistorageprogresshandler interface lets storage consumers receive callbacks during the execution of sqlite requests. 213 mozistorageresultset interfaces, storage the mozistorageresultset interface represents a set of results from a storage statement. 214 mozistoragerow interfaces, storage ...
...And 15 more matches

Mail composition back end
ou want to do the delivery operation "blind" the addlistener/removelistener methods let the caller add and remove listeners to the sending interface. ns_imethod addlistener(nsimsgsendlistener *alistener) = 0; ns_imethod removelistener(nsimsgsendlistener *alistener) = 0; sending listener interfaces the nsimsgsendlistener interface will let a caller keep track of the progress and any status of a send operation. these are critical for message delivery since message sending is asynchronous. it is the only way to determine if the operation was successful or not. an important item to note is the fact that this interface should also implement the nsimsgcopyservicelistener interface if it wants to be notified of the progress and completion of the copy operation. ...
...d when the sending operation has begun. this is called after messages creation has completed. if message creation fails, the nsimsgsend operation will return an ns_failed() return code. ...
...ration has begun. this is called after messages creation has completed. if message creation fails, the nsimsgsend operation will return an ns_failed() return code. ...
...And 13 more matches

Working with windows in chrome code
ersa, read this instead. example 1: passing data to window when opening it with opendialog when you open a window using window.opendialog or nsiwindowwatcher.openwindow, you can pass an arbitrary number of arguments to that window. arguments are simple javascript objects, accessible through window.arguments property in the opened window. ...
...alog when you open a window using window.opendialog or nsiwindowwatcher.openwindow, you can pass an arbitrary number of arguments to that window. arguments are simple javascript objects, accessible through window.arguments property in the opened window. in this example, we're using window.opendialog to open a progress dialog. we pass in the current status text as well as the maximum and current progress values. note that using nsiwindowwatcher.openwindow is a bit less trivial . ...
...in the opened window. in this example, we're using window.opendialog to open a progress dialog. we pass in the current status text as well as the maximum and current progress values. note that using nsiwindowwatcher.openwindow is a bit less trivial . ...
...And 11 more matches

Event reference
gan. stalled the user agent is trying to fetch media data, but data is unexpectedly not forthcoming. suspend media data loading has been suspended. timeupdate the time indicated by the currenttime attribute has been updated. volumechange the volume has changed. waiting playback has stopped because of a temporary lack of data. progress events event name fired when abort progression has been terminated (not due to an error). error progression has failed. load progression has been successful. loadend progress has stopped (after "error", "abort", or "load" have been dispatched). loadstart progress has begun. progress in progress. time...
... event name fired when abort progression has been terminated (not due to an error). error progression has failed. load progression has been successful. loadend progress has stopped (after "error", "abort", or "load" have been dispatched). loadstart progress has begun. progress in progress. timeout progression is terminated due to preset time expiring. storage events change (see non-standard events) storage update events checking downloading error noupdate obsolete updateready value change events broadcast checkboxstatechange hashchange input radiostatechange readystatechange valuechange uncategorized events invalid message message open show less common and non-standard events aborta...
... the interface representing the object sent to recipients of the event (so you can find information about what data is provided with each event) as well as a link to the specification or specifications that define the event. event name event type specification fired when... abort uievent dom l3 the loading of a resource has been aborted. abort progressevent progress and xmlhttprequest progression has been terminated (not due to an error). abort event indexeddb a transaction has been aborted. afterprint event html5 the associated document has started printing or the print preview has been closed. animationcancel animationevent css animations a css animation has aborted. anima...
...And 10 more matches

nsIDownloadManager
ad-manager;1"] .getservice(components.interfaces.nsidownloadmanager); method overview nsidownload adddownload(in short adownloadtype, in nsiuri asource, in nsiuri atarget, in astring adisplayname, in nsimimeinfo amimeinfo, in prtime astarttime, in nsilocalfile atempfile, in nsicancelable acancelable, in boolean aisprivate); void addlistener(in nsidownloadprogresslistener alistener); void canceldownload(in unsigned long aid); void cleanup(); void endbatchupdate(); obsolete since gecko 1.9.1 void flush(); obsolete since gecko 1.8 nsidownload getdownload(in unsigned long aid); void onclose(); obsolete since gecko 1.9.1 void open(in nsidomwindow aparent, in nsidownload adownload); obsolete since...
...void canceldownload(in unsigned long aid); void cleanup(); void endbatchupdate(); obsolete since gecko 1.9.1 void flush(); obsolete since gecko 1.8 nsidownload getdownload(in unsigned long aid); void onclose(); obsolete since gecko 1.9.1 void open(in nsidomwindow aparent, in nsidownload adownload); obsolete since gecko 1.9.1 void openprogressdialogfor(in nsidownload adownload, in nsidomwindow aparent, in boolean acanceldownloadonclose); obsolete since gecko 1.9.1 void pausedownload(in unsigned long aid); void removedownload(in unsigned long aid); void removedownloadsbytimeframe(in long long abegintime, in long long aendtime); void removelistener(in nsidownloadprogresslistener alistener); ...
...ve completed, have failed or have been canceled. read only. datasource nsirdfdatasource read only. obsolete since gecko 1.8 dbconnection mozistorageconnection the database connection to the downloads database. read only. defaultdownloadsdirectory nsilocalfile returns the platform default downloads directory. read only. listener nsidownloadprogresslistener the download manager's progress listener. obsolete since gecko 1.8 userdownloadsdirectory nsilocalfile returns the user configured downloads directory. the path is dependent on two user configurable prefs set in preferences: browser.download.folderlist defines the default download location for files: 0: files are downloaded to the desktop by default.
...And 9 more matches

Cross-browser audio basics - Developer guides
first, let's take a look at the media loading process in order: loadstart the loadstart event tells us simply that load process has started and the browser is connecting to the media. myaudio.addeventlistener("loadstar...
...ad before doing something, you can detect the loadedmetadata event. myaudio.addeventlistener("loadedmetadata", function() { //you can display the duration now }); loadeddata the loadeddata event is fired when the first bit of media arrives. the playhead is in position but not quite ready to play. myaudio.addeventlistener("loadeddata", function() { //you could display the playhead now }); progress the progress event indicates that the download of media is still in progress. it is good practice to display some kind of 'loader' at this point. myaudio.addeventlistener("progress", function() { // you could let the user know the media is downloading }); canplay canplay is a useful event to detect should you want to determine whether the media is ready to play. you could, for example, disa...
...rough (that is to say that the file has completely downloaded, or it is estimated that it will download in time so that buffering stops do not occur). myaudio.addeventlistener("canplaythrough", function() { //audio is ready to play all the way through }); media loading event order to recap, the order of the media loading events are: loadstart > durationchange > loadedmetadata > loadeddata > progress > canplay > canplaythrough loading interruption events we also have a few events available that will fire when there is some kind of interruption to the media loading process. suspend media data is no longer being fetched even though the file has not been entirely downloaded. abort media data download has been aborted but not due to an error. error an error is encountered while media da...
...And 9 more matches

nsIDocumentLoader
inherits from: nsisupports last changed in gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) implemented by: @mozilla.org/docloaderservice;1. ...
...obsolete since gecko 1.8 ns...
...obsolete since gecko 1.8 nsiloadgroup ge...
...And 8 more matches

nsIPrintingPrompt
h can be used without knowlege of a parent window. the parentage is hidden by the getinterface though which it is gotten. inherits from: nsisupports last changed in gecko 1.7 this interface is identical to nsipintingpromptservice but without the parent nsidomwindow parameter. see nsiprintingpromptservice for all documentation. this service enables embedders to implement their own print and progress dialogs. each platform has a "base" or "backstop" implementation of the service. the service is automatically registered at start up. historically, platform toolkits with native dialogs have implemented them in the gfx layer usually they were displayed when a new devicecontextspec specific to that platform was created. windows: the gfx layer no longer supports default toolkit behavior for disp...
...an embedder implemented service returns any error code (other than ns_error_abort) printing will terminate. returning ns_ok assumes that the printsettings object was correctly filled in and if it does not have valid fields for printer name, and so on. it may also terminate. ...
... note: the windows version mozilla implements this service which is automatically built and registered for you. you can use it as an example. ...
...And 8 more matches

appearance (-moz-appearance, -webkit-appearance) - CSS: Cascading Style Sheets
ppearance: auto; appearance: menulist-button; appearance: textfield; /* "compat-auto" values, which have the same effect as 'auto' */ appearance: button; appearance: searchfield; appearance: textarea; appearance: push-button; appearance: slider-horizontal; appearance: checkbox; appearance: radio; appearance: square-button; appearance: menulist; appearance: listbox; appearance: meter; appearance: progress-bar; /* partial list of available values in gecko */ -moz-appearance: scrollbarbutton-up; -moz-appearance: button-bevel; /* partial list of available values in webkit/blink (as well as gecko and edge) */ -webkit-appearance: media-mute-button; -webkit-appearance: caret; values standard keywords value demo browser description none div{ color: black; -m...
...box; } <div>lorem</div> firefox chrome safari edge menulist div { color: black; -moz-appearance: menulist; -webkit-appearance: menulist; } <div>lorem</div> firefox chrome safari edge meter div{ color: black; -webkit-appearance: meter; } <div>lorem</div> chrome safari firefox progress-bar div{ color: black; -webkit-appearance: progress-bar; } <div>lorem</div> chrome safari firefox push-button div{ color: black; -webkit-appearance: push-button; } <div>lorem</div> chrome safari edge radio div { color: black; -moz-appearance: radio; -webkit-appearance: radio; } <div>lor...
...not implemented for the windows platform) meterbar div { color: black; -moz-appearance: meterbar; -webkit-appearance: meterbar; } <div>lorem</div> firefox use meter instead. ...
...And 8 more matches

Listening to events in Firefox extensions - Archive of obsolete content
. if the page contains frames, then when the cached page is loaded: pageshow events from each frame fire before the pageshow event in the main document fires. when the user navigates away from the cached page, the pagehide event from each frame fires before the pagehide event in the main document. for navigation that occurs inside a single frame, events fire only in the affected frame. ...
...ded: pageshow events from each frame fire before the pageshow event in the main document fires. when the user navigates away from the cached page, the pagehide event from each frame fires before the pagehide event in the main document. for navigation that occurs inside a single frame, events fire only in the affected frame. web progress listeners for more information about web loads a web progress listener can be used; these provide more details about the progress of loading data from the web. both browser and tabbrowser elements support the following: var progresslistener = { // add nsiwebprogressimplementation here } b.addprogresslistener(progresslistener); where b is the browser or tabbrowser you want to listen to events for. there are code snippets available that give more detail...
...be used; these provide more details about the progress of loading data from the web. both browser and tabbrowser elements support the following: var progresslistener = { // add nsiwebprogressimplementation here } b.addprogresslistener(progresslistener); where b is the browser or tabbrowser you want to listen to events for. there are code snippets available that give more detail on using web progress listeners. for a tabbrowser, the above code will only get events from the browser that is currently displayed at the time the event occurs. ...
...And 7 more matches

Intercepting Page Loads - Archive of obsolete content
http requests, specially when redirects are involved. if you enter gmail.com in your browser, you will probably be redirected a few times before reaching the page that actually displays any content. all of these "hops" will involve a call to your observer. . the aforementioned observer notifications page has more information about these notifications and links to other useful documentation. webprogresslisteners when used in the chrome, this is a more sophisticated way of intercepting and modifying the various stages in page loads. but of course, there's always a price to pay: web progress listeners in the chrome are attached to specific instances of the browser element. what does this mean? it means you have to keep track of tabs being opened and closed, in order to add and remove your listene...
...it means you have to keep track of tabs being opened and closed, in order to add and remove your listener. ...
...ce to pay: web progress listeners in the chrome are attached to specific instances of the browser element. what does this mean? it means you have to keep track of tabs being opened and closed, in order to add and remove your listener. here's a code sample that keeps track of your progress listeners for all tabs: init : function() { gbrowser.browsers.foreach(function (browser) { this._toggleprogresslistener(browser.webprogress, true); }, this); gbrowser.tabcontainer.addeventlistener("tabopen", this, false); gbrowser.tabcontainer.addeventlistener("tabclose", this, false); }, uninit : function() { gbrowser.browsers.foreach(function (browser) { this ._toggleprogresslistener(browser.webprogress, false); }, this); gbrowser.tabcontainer.removeeventlistener("tabopen", this, false...
...And 7 more matches

Download
false until the cancellation request has been processed. temporary files or part files may still exist even if they are expected to be deleted, until the stopped property becomes true. contenttype string the mime type of the download, for example "text/plain", or null if the mime type is not available. this property may be populated or changed while the download is in progress, using the mime type provided by the server. currentbytes read only number number of bytes currently transferred. this value starts at zero, and may be updated regardless of the value of hasprogress. note: you shouldn't rely on this property being equal to totalbytes to determine whether the download is completed. you should use the individual state properties inste...
...download has been completed successfully or has been canceled, this property is null. this property is reset to null when a failed download is restarted. haspartialdata read only boolean indicates whether, at this time, there is any partially downloaded data that can be used when restarting a failed or canceled download. ...
...this depends on the saver and the download source. ...
...And 7 more matches

Index - Archive of obsolete content
no summary! 295 prefpane.src xul attributes, xul reference no summary! 296 prefwindow.onload no summary! 297 prefwindow.type xul attributes, xul reference no summary! 298 primary xul attributes, xul reference no summary! 299 priority xul attributes, xul reference no summary! 300 progressmeter.max no summary! 301 progressmeter.mode xul attributes, xul reference no summary! 302 progressmeter.value xul attributes, xul reference no summary! 303 properties xul attributes, xul reference no summary! 304 query.name xul attributes, xul reference no summary! 305 query.type xul attr...
... to use an overlay to modify a menu, see using menus and popups in extensions 441 methods xul methods, xul reference no summary! 442 acceptdialog xul methods, xul reference no summary! 443 additemtoselection xul methods, xul reference no summary! 444 addpane xul methods, xul reference no summary! 445 addprogresslistener xul methods, xul reference no summary! 446 addsession xul methods, xul reference no summary! 447 addtab method, mozilla, reference, xul, xul methods, xul reference no summary! 448 addtabsprogresslistener no summary! 449 advance xul methods, xul reference no summary! 450 advanceselecte...
... xul methods, xul reference no summary! 558 removecurrenttab xul methods, xul reference no summary! 559 removeitemat xul methods, xul reference no summary! 560 removeitemfromselection xul methods, xul reference no summary! 561 removenotification xul methods, xul reference no summary! 562 removeprogresslistener xul methods, xul reference no summary! 563 removesession needshelp, xul methods, xul reference no summary! 564 removetab xul methods, xul reference no summary! 565 removetabsprogresslistener xul methods, xul reference no summary! 566 removetransientnotifications xul methods, xul reference no summ...
...And 6 more matches

tabbrowser - Archive of obsolete content
dlectrlpageupdown, onbookmarkgroup, onnewtab, tabmodalpromptshowing properties browsers, cangoback, cangoforward, contentdocument, contenttitle, contentvieweredit, contentviewerfile, contentwindow, currenturi, docshell, documentcharsetinfo, homepage, markupdocumentviewer, securityui, selectedbrowser, selectedtab, sessionhistory, tabcontainer, tabs, visibletabs, webbrowserfind, webnavigation, webprogress methods addprogresslistener, addtab, addtabsprogresslistener,appendgroup, getbrowseratindex, getbrowserindexfordocument, getbrowserfordocument, getbrowserfortab, geticon, getnotificationbox, gettabforbrowser, gettabmodalpromptbox, goback, gobackgroup, goforward, goforwardgroup, gohome, gotoindex, loadgroup, loadonetab, loadtabs, loaduri, loaduriwithflags, movetabto, pintab, reload, reloadalltab...
... autocompletepopup type: id the id of a popup element used to hold autocomplete results for the element. autoscroll type: boolean set to false ...
... autocompletepopup type: id the id of a popup element used to hold autocomplete results for the element. autoscroll type: boolean set to false to disable autoscroll for this browser.
...And 6 more matches

nsIMsgMessageService
in nsimsgwindow amsgwindow, out nsiuri aurl); parameters asrcuri the string url of the message to copy. acopylistener an nsistreamlistener to be notified of copy events. amovemessage set to true if you want the message to be moved. false leaves it as just a copy. aurllistener a nsiurllistener to be notified of url events. amsgwindow nsimsgwindow for progress and status feedback return values aurl the new nsiuri of the message. copymessages() copy multiple messages at a time. see copymessage [noscript] void copymessages(in nsmsgkeyarrayptr keys, in nsimsgfolder srcfolder, in nsistreamlistener acopylistener, in boolean amovemessage, ...
... in nsimsgwindow amsgwindow, out nsiuri aurl); parameters keys an array of message keys to be copied. srcfolder acopylistener an nsistreamlistener to be notified of copy events. amovemessage set to true if you want the message to be moved. false leaves it as just a copy. aurllistener an nsiurllistener amsgwindow nsimsgwindow for progress and status feedback return values aurl the new nsiuri of the message. (?) displaymessage() when you want a message displayed.... void displaymessage(in string amessageuri, in nsisupports adisplayconsumer, in nsimsgwindow amsgwindow, in nsiurllistener aurllistener, in string acharsetoverride, ...
...supports adisplayconsumer, in nsimsgwindow amsgwindow, in nsiurllistener aurllistener, in string acharsetoverride, out nsiuri aurl); parameters amessageuri a uri representing the message to display. adisplayconsumer is (for now) an nsidocshell which the message is loaded into. amsgwindow nsimsgwindow for progress and status feedback aurllistener an nsiurllistener acharsetoverride (optional) character set over ride to force the message to use. return values aurl the new nsiuri of the message. openattachment() downloads and opens an attachment. void openattachment(in string acontenttype, in string afilename, in string aurl, in str...
...And 6 more matches

Using XMLHttpRequest - Web APIs
setype of "arraybuffer" to fetch the remote content into a arraybuffer object, which stores the raw binary data. var oreq = new xmlhttprequest(); oreq.onload = function(e) { var arraybuffer = oreq.response; // not responsetext /* ... */ } oreq.open("get", url); oreq.responsetype = "arraybuffer"; oreq.send(); for more examples check out the sending and receiving binary data page monitoring progress xmlhttprequest provides the ability to listen to various events that can occur while the request is being processed. this includes periodic progress notifications, error notifications, and so forth. support for dom progress event monitoring of xmlhttprequest transfers follows the specification for progress events: these events implement the progressevent interface. the actual events you can mon...
...events that can occur while the request is being processed. this includes periodic progress notifications, error notifications, and so forth. support for dom progress event monitoring of xmlhttprequest transfers follows the specification for progress events: these events implement the progressevent interface. the actual events you can monitor to determine the state of an ongoing transfer are: progress the amount of data that has been retrieved has changed. ...
...lhttprequest transfers follows the specification for progress events: these events implement the progressevent interface. the actual events you can monitor to determine the state of an ongoing transfer are: progress the amount of data that has been retrieved has changed. load the transfer is complete; all data is now in the response var oreq = new xmlhttprequest(); oreq.addeventlistener("progress", updateprogress); oreq.addeventlistener("load", transfercomplete); oreq.addeventlistener("error", transferfailed); oreq.addeventlistener("abort", transfercanceled); oreq.open(); // ... // progress on transfers from the server to the client (downloads) function updateprogress (oevent) { if (oevent.lengthcomputable) { var percentcomplete = oevent.loaded / oevent.total * 100; // ... ...
...And 6 more matches

Advanced form styling - Learn web development
or some more specific tricks: checkboxes and radio buttons <input type="search"> the ugly: some elements can't be styled thoroughly using css. these include: elements involved in creating dropdown widgets, including <select>, <option>, <optgroup> and <datalist>. <input type="color"> date-related controls such as <input type="datetime-local"> <input type="range"> <input type="file"> <progress> and <meter> let's first talk about the appearance property, which is pretty useful for making all of the above more stylable. appearance: controlling os-level styling in the previous article we said that historically, styling of web form controls was largely taken from the underlying operating system, which is part of the problem with customizing the look of these controls. the appearance p...
...heckbox"> </p> <p><input type="submit" value="submit"></p> <p><input type="button" value="button"></p> </form> applying the following css to them removes system-level styling. input { -webkit-appearance: none; appearance: none; } note: it is a good idea to always include both declarations — prefixed and unprefixed — when using a prefixed property. prefixed usually means "work in progress", so in the future browser vendors may come to a consensus to drop the prefix. the above code is good for future-proofing against such an eventuality. the following live example shows you what they look like in your system — default on the left, and with the above css applied on the right (find it here also if you want to test it on other systems). in most cases, the effect is to remove th...
...les the targeting of checkboxes in ie only. this technique works for radio buttons too, despite the name -ms-check. what can be done about the "ugly" elements? now let's turn our attention to the "ugly" controls — the ones that are really hard to thoroughly style. in short, these are drop-down boxes, complex control types like color and datetime-local, and feedback—oriented controls like <progress> and <meter>. the problem is that these elements have very different default looks across browsers, and while you can style them in some ways, some parts of their internals are literally impossible to style. if you are prepared to live with some differences in look and feel, you can get away with some simple styling to make sizing consistent, uniform styling of things like background-colors, an...
...And 5 more matches

mozIStorageConnection
s(anumstatements)] in mozistoragebasestatement astatements, in unsigned long anumstatements, [optional] in mozistoragestatementcallback acallback ); void executesimplesql(in autf8string asqlstatement); boolean indexexists(in autf8string aindexname); void preload(); obsolete since gecko 1.9 void removefunction(in autf8string afunctionname); mozistorageprogresshandler removeprogresshandler(); void rollbacktransaction(); void setgrowthincrement(in print32 aincrement, in autf8string adatabasename); mozistorageprogresshandler setprogresshandler(in print32 agranularity, in mozistorageprogresshandler ahandler); boolean tableexists(in autf8string atablename); attributes attribute type description ...
...long long the row id from the last sql insert operation. read only. note: this is not reliable if you are using asynchronous statements or if you are using the connection on multiple threads. schemaversion long the schema version of the database. this should not be used until the database is ready. the version will be reported as 0 if it is not set. transactioninprogress boolean returns true if there is a transaction in progress on the database. otherwise returns false. read only. constants transaction execution time constants. constant value description transaction_deferred 0 no database lock is obtained until the first statement is run. transaction_immediate 1 a reserved lock is obtained on the databas...
...n mozistoragestatementcallback acallback optional ); parameters astatements the array of statements to execute asynchronously. they will be executed sequentially, in the order in which they appear in the array. prior to gecko 2.0 this was type mozistoragestatement. anumstatements the number of statements in astatements. acallback optional a mozistoragestatementcallback object to receive progress, error, and completion notifications. return value a mozistoragependingstatement object that can be used to cancel the statements' execution. executesimplesql() executes an sql expression that has no bound parameters. warning: performing synchronous io on the main thread can cause serious performance problems. as a result, this method of modifying the database is strongly discouraged! ...
...And 5 more matches

nsITreeView
getcelltext(in long row, in nsitreecolumn col); astring getcellvalue(in long row, in nsitreecolumn col); astring getcolumnproperties(in nsitreecolumn col, in nsisupportsarray properties obsolete since gecko 22); astring getimagesrc(in long row, in nsitreecolumn col); long getlevel(in long index); long getparentindex(in long rowindex); long getprogressmode(in long row, in nsitreecolumn col); astring getrowproperties(in long index, in nsisupportsarray properties obsolete since gecko 22); boolean hasnextsibling(in long rowindex, in long afterindex); boolean iscontainer(in long index); boolean iscontainerempty(in long index); boolean iscontaineropen(in long index); boolean iseditable(in long ro...
... void settree(in nsitreeboxobject tree); void toggleopenstate(in long index); attributes attribute type description rowcount long the total number of rows in the tree (including the offscreen rows). read only. selection nsitreeselection the selection for this view. ...
... void toggleopenstate(in long index); attributes attribute type description rowcount long the total number of rows in the tree (including the offscreen rows). read only. selection nsitreeselection the selection for this view. ...
...And 5 more matches

nsIZipWriter
om: nsisupports last changed in gecko 1.9 (firefox 3) once all the operations you wish to perform are added to the queue, a call to processqueue() will perform the operations in the order they were added to the queue. operations performed on the queue throw any errors that occur out to the observer. attempting to perform a synchronous operation on the interface while the background queue is in progress will throw an ns_error_in_progress exception. file and directory names should use slashes ("/") as separators and should not begin with a slash. note: although it is not necessary to add directory entries in order to add file entries within them, some zip utilities may have problems with that, so it may be best to add the directory entries explicitly first. implemented by: @mozilla.org/zipwrit...
... acstring gets or sets the comment associated with the currently open zip file. exceptions thrown ns_error_not_initialized if no zip file has been opened. file nsifile the zip file being written to. read only. inqueue boolean true if operations are being performed in the background queue, or false if background operations are not in progress. read only. constants constant value description compression_none 0 do not compress the file. compression_fastest 1 use the fastest compression method when adding the file to the archive. compression_default 6 use the default compression method when adding the file to the archive. compression_best 9 use the best co...
...ession method to use. achannel the channel from which to get the data. aqueue if true, the operation is queued for later execution. if false, the operation is performed immediately. will be performed when processqueue() is called. exceptions thrown ns_error_not_initialized no zip file is open. ns_error_file_already_exists the specified path already exists in the zip file. ns_error_in_progress the zip writer is already performing another operation. addentrydirectory() adds a new directory entry to the zip file. if azipentry does not end with "/" then it will be added. note: although it is not necessary to add directory entries in order to add file entries within them, some zip utilities may have problems with that, so it may be best to add the directory entries explicitly first. ...
...And 5 more matches

XUL Questions and Answers - Archive of obsolete content
tically opened when the "oncontextmenu" event is called? if you have a similar code base as the following: onbookmarkcontextmenu: function(event, id) { document.getelementbyid("bookmarkpopup").showpopup(document.getelementbyid(id), event.screenx + 6, event.screeny + 6, "popup", "bottomright", "bottomright"); } use the hidepopup() function to solve this issue. ...
...have a similar code base as the following: onbookmarkcontextmenu: function(event, id) { document.getelementbyid("bookmarkpopup").showpopup(document.getelementbyid(id), event.screenx + 6, event.screeny + 6, "popup", "bottomright", "bottomright"); } use the hidepopup() function to solve this issue. ...
...n(event, id) { document.getelementbyid("bookmarkpopup").showpopup(document.getelementbyid(id), event.screenx + 6, event.screeny + 6, "popup", "bottomright", "bottomright"); } use the hidepopup() function to solve this issue. ...
...And 4 more matches

XPCOM Interface Reference
ynchistorymozicoloranalyzermozijssubscriptloadermozipersonaldictionarymoziplaceinfomoziplacesautocompletemoziregistrymozirepresentativecolorcallbackmozispellcheckingenginemozistorageaggregatefunctionmozistorageasyncstatementmozistoragebindingparamsmozistoragebindingparamsarraymozistoragecompletioncallbackmozistorageconnectionmozistorageerrormozistoragefunctionmozistoragependingstatementmozistorageprogresshandlermozistorageresultsetmozistoragerowmozistorageservicemozistoragestatementmozistoragestatementcallbackmozistoragestatementparamsmozistoragestatementrowmozistoragestatementwrappermozistoragevacuumparticipantmozistoragevaluearraymozitxttohtmlconvmozithirdpartyutilmozivisitinfomozivisitinfocallbackmozivisitstatuscallbacknsiabcardnsiaboutmodulensiabstractworkernsiaccelerometerupdatensiaccessnoden...
...onsnsidomglobalpropertyinitializernsidomhtmlaudioelementnsidomhtmlformelementnsidomhtmlmediaelementnsidomhtmlsourceelementnsidomhtmltimerangesnsidomjswindownsidommousescrolleventnsidommoznetworkstatsnsidommoznetworkstatsdatansidommoznetworkstatsmanagernsidommoztoucheventnsidomnshtmldocumentnsidomnavigatordesktopnotificationnsidomnodensidomofflineresourcelistnsidomorientationeventnsidomparsernsidomprogresseventnsidomserializernsidomsimplegestureeventnsidomstoragensidomstorage2nsidomstorageeventobsoletensidomstorageitemnsidomstoragelistnsidomstoragemanagernsidomstoragewindownsidomuserdatahandlernsidomwindownsidomwindow2nsidomwindowinternalnsidomwindowutilsnsidomxpathevaluatornsidomxpathexceptionnsidomxpathexpressionnsidomxpathresultnsidomxulcontrolelementnsidomxulelementnsidomxullabeledcontrolelemen...
...devicemotionlistenernsidialogcreatornsidialogparamblocknsidictionarynsidirindexnsidirindexlistenernsidirindexparsernsidirectoryenumeratornsidirectoryiteratornsidirectoryservicensidirectoryserviceprovidernsidirectoryserviceprovider2nsidiskcachestreaminternalnsidispatchsupportnsidocshellnsidocumentloadernsidownloadnsidownloadhistorynsidownloadmanagernsidownloadmanageruinsidownloadobservernsidownloadprogresslistenernsidownloadernsidragdrophandlernsidragservicensidragsessionnsidroppedlinkhandlernsidroppedlinkitemnsidynamiccontainernsieditornsieditorboxobjectnsieditordocshellnsieditorimesupportnsieditorloggingnsieditormailsupportnsieditorobservernsieditorspellchecknsieffectivetldservicensienumeratornsienvironmentnsierrorservicensieventlistenerinfonsieventlistenerservicensieventsourcensieventtargetnsiex...
...And 4 more matches

FileHandle API - Web APIs
etfile method. such a file object is completely desynchronized from the original file, which means any change made to that object will never be reflected to the handled file as well as any change made to the handled file will never be pushed to the file object. ...
...e as well as any change made to the handled file will never be pushed to the file object. var mysnapshot = null; var request = myfilehandle.getfile(); request.onsuccess = function () { mysnapshot = this.result; } managing progress all the methods from the lockedfile interface return a filerequest object. such an object is basically a domrequest with an extra power: it allows to monitor the progress of an operation. sometimes writing and reading operations can be very long, therefore it is a good idea to monitor the operation to provide feedback to the user. ...
...ging progress all the methods from the lockedfile interface return a filerequest object. such an object is basically a domrequest with an extra power: it allows to monitor the progress of an operation. sometimes writing and reading operations can be very long, therefore it is a good idea to monitor the operation to provide feedback to the user. such monitoring can be done using the filerequest.onprogress event handler. ...
...And 4 more matches

Media buffering, seeking, and time ranges - Developer guides
this article discusses how to build a buffer/seek bar using timeranges, and other features of the media api. buffered the buffered attribute will tell us which parts of the media has been downloaded. it returns a timeranges object, which will tell us which chunks of media have been downloaded. this is usually contiguous but if the user jumps about while media is buffering, it may contain holes. ...
...each red filled white rectangle represents a time range. note: you can see the timerange code running live on js bin. seekable the seekable attribute returns a timeranges object and tells us which parts of the media can be played without delay; this is irrespective of whether that part has been downloaded or not. some parts of the media may be se...
...lmost instantly. it is better perhaps to give an indication of how much media has actually downloaded — this what the browser's native players seem to display. so let's build this. ...
...And 4 more matches

Index - MDN Web Docs Glossary: Definitions of Web-related terms
i-fi router can be compromised. 272 mixin codingscripting, glossary, method, mixin, property a mixin is a class or interface in which some or all of its methods and/or properties are unimplemented, requiring that another class or interface provide the missing implementations. 273 mobile first design, glossary, layout, layout mobile mobile first, a form of progressive enhancement, is a web-development and web-design approach that focuses on prioritizing design and development for mobile screen sizes over design and development for desktop screen sizes. the rationale behind the mobile-first approach is to provide users with good user experiences at all screen sizes—by starting with creating a user experience that works well on small screens, and then build...
...h of designing for desktop screen sizes first, and then only later adding some support for small screen sizes. 274 modem infrastructure, navigation a modem ("modulator-demodulator") is a device that converts digital information to analog signals and vice-versa, for sending data through networks. 275 modern web apps composing, glossary, modern web apps see progressive web apps 276 modularity codingscripting, glossary the term modularity refers to the degree to which a system's components may be separated and recombined, it is also division of a software package into logical units. the advantage of a modular system is that one can reason the parts independently 277 mozilla firefox browser, firefox, glossary, infrastructure...
...ull, which is seemingly primitive, but indeed is a special case for every object: and any structured type is derived from null by the prototype chain. 332 privileged glossary, security users are said to be privileged when they are granted additional rights to a system, or given ultimate access to content in a higher priority level when compared to normal users. ...
...And 3 more matches

nsIWinTaskbar
on the window. unlike window previews, tab previews require most of the functionality of the nsitaskbarpreviewcontroller interface be implemented. warning: this api has undergone changes that are not yet documented. among these is the addition of the method getoverlayiconcontroller(). this method is currently known to crash if used under certain conditions. see bug 744992 for details and to track progress on a fix. implemented by: @mozilla.org/windows-taskbar;1. to create an instance, use: var wintaskbar = components.classes["@mozilla.org/windows-taskbar;1"] .getservice(components.interfaces.nsiwintaskbar); method overview nsijumplistbuilder createjumplistbuilder(); nsitaskbartabpreview createtaskbartabpreview(in nsidocshell shell, in nsitaskbarpreviewcontroller controller)...
...lemented by: @mozilla.org/windows-taskbar;1. ...
...la.org/windows-taskbar;1. to create an instance, use: var wintaskbar = components.classes["@mozilla.org/windows-taskbar;1"] .getservice(components.interfaces.nsiwintaskbar); method overview nsijumplistbuilder createjumplistbuilder(); nsitaskbartabpreview createtaskbartabpreview(in nsidocshell shell, in nsitaskbarpreviewcontroller controller); nsitaskbarprogress gettaskbarprogress(in nsidocshell shell); nsitaskbarwindowpreview gettaskbarwindowpreview(in nsidocshell shell); void setgroupidforwindow(in nsidomwindow aparent, in astring aidentifier); attributes attribute type description available boolean returns true if the operating system supports windows 7 or later taskbar features; you can use this instead of in-place operating system version checking. read o...
...And 3 more matches

ARIA - Accessibility
many of these widgets were later incorporated into html5, and developers should prefer using the correct semantic html element over using aria, if such an element exists. for instance, native elements have built-in keyboard accessibility, roles and states. however, if you choose to use aria, you are responsible for mimicking (the equivalent) browser behaviour in script. here's the markup for a progress bar widget: <div id="percent-loaded" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"> </div> this progress bar is built using a <div>, which has no meaning. unfortunately, there isn't a more semantic tag available to developers in html 4, so we need to include aria roles and properties. these are specified by adding attributes to the element. in this example, t...
...et: <div id="percent-loaded" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"> </div> this progress bar is built using a <div>, which has no meaning. unfortunately, there isn't a more semantic tag available to developers in html 4, so we need to include aria roles and properties. these are specified by adding attributes to the element. in this example, the role="progressbar" attribute informs the browser that this element is actually a javascript-powered progress bar widget. the aria-valuemin and aria-valuemax attributes specify the minimum and maximum values for the progress bar, and the aria-valuenow describes the current state of it and therefore must be kept updated with javascript. along with placing them directly in the markup, aria attributes can be added...
...progress bar widget. the aria-valuemin and aria-valuemax attributes specify the minimum and maximum values for the progress bar, and the aria-valuenow describes the current state of it and therefore must be kept updated with javascript. along with placing them directly in the markup, aria attributes can be added to the element and updated dynamically using javascript code like this: // find the progress bar <div> in the dom. var progressbar = document.getelementbyid("percent-loaded"); // set its aria roles and states, // so that assistive technologies know what kind of widget it is. ...
...And 3 more matches

:indeterminate - CSS: Cascading Style Sheets
the :indeterminate css pseudo-class represents any form element whose state is indeterminate, such as checkboxes which have their html indeterminate attribute set to true, radio buttons which are members of a group in which all radio buttons are unchecked, and indeterminate <progress> elements. ...
...ns are unchecked, and indeterminate <progress> elements. /* selects any <input> whose state is indeterminate */ input:indeterminate { background: lime; } elements targeted by this selector are: <input type="checkbox"> elements whose indeterminate property is set to true by javascript <input type="radio"> elements, when all radio buttons with the same name value in the form are unchecked <progress> elements in an indeterminate state syntax :indeterminate examples checkbox & radio button this example applies special styles to the labels associated with indeterminate form fields. html <div> <input type="checkbox" id="checkbox"> <label for="checkbox">this label starts out lime.</label> </div> <div> <input type="radio" id="radio"> <label for="radio">this label starts out lime.<...
... living standard no change. html5the definition of ':indete...
...And 3 more matches

Using CSS gradients - CSS: Cascading Style Sheets
you can choose between three types of gradients: linear (created with the linear-gradient() function), radial (created with radial-gradient()), and conic (created with the conic-gradient() function). you can also create repeating gradients with the repeating-linear-gradient(), repeating-radial-gradient(), and repeating-conic-gradient() functions. gradients can be used anywhere you would use an <image>, such as in backgrounds. ...
...gradients are generated by the browser, they look better than raster images when zoomed in, and can be resized on the fly. we'll start by introducing linear gradients, then introduce features that are supported in all gradient types using linear gradients as the example, then move on to radial, conic and repeating gradients using linear gradients a linear gradient creates a band of colors that progress in a straight line. a basic linear gradient to create the most basic type of gradient, all you need is to specify two colors. these are called color stops. you must have at least two, but you can have as many as you want. <div class="simple-linear"></div> div { width: 120px; height: 120px; } .simple-linear { background: linear-gradient(blue, pink); } changing the direction by ...
...lor is at the same location as the first color stop for the adjacent color, creating a striped effect. in both examples, the gradient is written twice: the first is the css images level 3 method of repeating the color for each stop and the second example is the css images level 4 multiple color stop method of including two color-stop-lengths in a linear-color-stop declaration. controlling the progression of a gradient by default, a gradient evenly progresses between the colors of two adjacent color stops, with the midpoint between those two color stops being the midpoint color value. you can control the interpolation, or progression, between two color stops by including a color hint location. in this example, the color reaches the midpoint between lime and cyan 20% of the way through the grad...
...And 3 more matches

browser - Archive of obsolete content
story, disablesecurity, droppedlinkhandler, homepage, showcaret, src, type properties accessibletype, cangoback, cangoforward, contentdocument, contentprincipal, contenttitle, contentvieweredit, contentviewerfile, contentwindow, currenturi, docshell, documentcharsetinfo, homepage, markupdocumentviewer, messagemanager, preferences, securityui, sessionhistory, webbrowserfind, webnavigation, webprogress methods addprogresslistener, goback, goforward, gohome, gotoindex, loaduri, loaduriwithflags, reload, reloadwithflags, removeprogresslistener, stop, swapdocshells examples <!-- shows mozilla homepage inside a groupbox --> <groupbox flex="1"> <caption label="mozilla homepage"/> <browser type="content" src="http://www.mozilla.org" flex="1"/> </groupbox> attributes autocomple...
...wserfind object which can be used to search for text in the document. webnavigation type: nsiwebnavigation this read-only property contains the nsiwebnavigation object for the document. most of its methods are callable directly on the element itself, such as goback and goforward. it also contains the load constants used by reloadwithflags and loaduriwithflags. webprogress type: nsiwebprogress this read-only property contains an nsiwebprogress object which is used to monitor the progress of a document loading. methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, dispatchevent(), docommand, focus, getattribute(), getattributenode(), getattributenodens(), getattributens(), getboundingclie...
... goback() return type: no return value go back one page in the history. goforward() return type: no return value go forward one page in the history. gohome() return type...
...And 2 more matches

Other form controls - Learn web development
prerequisites: basic computer literacy, and a basic understanding of html. ...
...for each datalist <option> value. you can see an implementation example of this on the <input type="range"> reference page. and browsers that support <datalist>s and <input type="color"> should display a customized palette of colors as the default, while still making the full color palette available. ...
...s progressive enhancement, and ensure they degrade gracefully. other form features there are a few other form features that are not as obvious as the ones we have already mentioned, but still useful in some situations, so we thought it would be worth giving them a brief mention. note: you can find the examples from this section on github as other-examples.html (see it live also). meters and progress bars meters and progress bars are visual representations of numeric values. progress a progress bar represents a value that changes over time up to a maximum value specified by the max attribute. such a bar is created using a <progress> element. ...
...And 2 more matches

Embedding Tips
ialogs and embedders may wish to render them in a way more appropriate for their application and platform.. how do i load a page? get thensiwebnavigation interface on your webbrowser and call the loaduri method with the appropriate uri and flags. this interface also has methods for reloading, stopping a load and going back and forward in the history. how do i block a load? implement the nsiwebprogresslistener interface and register it with the appropriate web browser object via the nsiwebbrowser::addwebbrowserlistener() method. use the callbacks for after-the-fact cancellation. alternatively, implement a nsiuricontentlistener as described below. how do i watch/intercept a load before it happens? implement the nsiuricontentlistener interface, and register it with the appropriate web browser o...
... the nsiwebbrowserpersist interface implemented on the web browser object and call the saveuri() or savedocument() methods on that. alternatively, create a standalone webbrowser persist object and call the nsiwebbrowserpersist interface on that to save uris and documents. this is recommended if you intend anything other than the uri or document your browser is looking at. register your own nsiwebprogresslistener object to listen for progress and state notifications. how do i save / upload a document / data to a web or ftp site? again, use the webbrowser persist object, but specify a remote location as the target uri. your web progress listener must also implement nsiauthprompt if you want to be able to upload to a password protected location (e.g. an ftp site). the nsiauthprompt interface allo...
...ment nsiauthprompt if you want to be able to upload to a password protected location (e.g. an ftp site). the nsiauthprompt interface allows the networking layer to pose a user / password prompt to obtain the values needed for authentication. your own implementation should pose this dialog, or fill in the values that are needed for the upload to succeed. ...
...And 2 more matches

InstallListener
installlisteners are notified of an addoninstall's progress. they may be registered to hear events from all addoninstalls through addinstalllistener or to a single addoninstall through addlistener. ...
... installlisteners are notified of an addoninstall's progress. they may be registered to hear events from all addoninstalls through addinstalllistener or to a single addoninstall through addlistener. ...
... void onnewinstall( in addoninstall install ) parameters install the addoninstall representing the install ondownloadstarted() called when downloading begins for an add-on install. only called for add-ons that need to be downloaded. a listener may return false to cancel the download. void ondownloadstarted( in addoninstall install ) parameters install the addon...
...And 2 more matches

Adding captions and subtitles to HTML5 video - Developer guides
ion to adding the <track> elements, we have also added a new button to control the subtitles menu that we will build. ...
...<track> elements, we have also added a new button to control the subtitles menu that we will build. ...
...nts, we have also added a new button to control the subtitles menu that we will build. ...
...And 2 more matches

HTML attribute: max - HTML: Hypertext Markup Language
e min attribute. if the max attribute is present by is not specified or is invalid, no max value is applied. if the max attribute is valid and a non-empty value is greater than the maximum allowed by the max attribute, constraint validation will prevent form submission. valid for the numeric input types, including the date, month, week, time, datetime-local, number and range types, and both the <progress> and <meter> elements, the max attribute is a number that specifies the most positive value a form control to be considered valid. if the value exceeds the max value allowed, the validitystate.rangeoverflow will be true, and the the control will be matched by the :out-of-range and :invalid pseudo-classes. syntax syntax for max values by input type input type syntax example ...
...="number" min="0" step="5" max="100"> range <number> <input type="range" min="60" step="5" max="100"> note: when the data entered by the user doesn't adhere to the maximum value set, the value is considered invalid in contraint validation and will match the :invalid and :out-of-range pseudoclasses see client-side validation and rangeoverflow for more information. for the<progress> element, the max attribute describes how much work the task indicated by the progress element requires. if present, must have a value greater than zero and be a valid floating point number. for the <meter> element, the max attribute defines the upper numeric bound of the measured range. this must be greater than the minimum value (min attribute), if specified. in both cases, if omitted, the val...
..., must have a value greater than zero and be a valid floating point number. for the <meter> element, the max attribute defines the upper numeric bound of the measured range. ...
...And 2 more matches

async function - JavaScript
ssed to the function. statements the statements comprising the body of the function. the await mechanism may be used. return value a promise which will be resolved with the value returned by the async function, or rejected with an exception thrown from, or uncaught within, the async function. description async functions can contain zero or more await expressions. await expressions suspend progress through an async function, yielding control and subsequently resuming progress only when an awaited promise-based asynchronous operation is either fulfilled or rejected. the resolved value of the promise is treated as the return value of the await expression. use of async / await enables the use of ordinary try / catch blocks around asynchronous code. the await keyword is only valid inside asyn...
...synchronously. if there is an await expression inside the function body, however, the async function will always complete asynchronously. for example: async function foo() { await 1 } ...is equivalent to: function foo() { return promise.resolve(1).then(() => undefined) } code after each await expression can be thought of as existing in a .then callback. ...
... ...is equivalent to: function foo() { return promise.resolve(1).then(() => undefined) } code after each await expression can be thought of as existing in a .then callback. in this way a promise chain is progressively constructed with each reentrant step through the function. the return value forms the final link in the chain. in the following example, we successively await two promises. progress moves through function foo in three stages. the first line of the body of function foo is executed synchronously, with the await expression configured with the pending promise. progress through foo is then suspended and control is yielded back to the function that called foo. some time later, when the first promise has either been fulfilled or rejected, control moves back into foo. the result...
...And 2 more matches

Document Object Model - Archive of obsolete content
checked; the value casecheck corresponds to the id of the case sensitive checkbox. once we have an indication of whether it is checked or not, we can use the state to perform the search. we could do something similar for the other check box, or any other element that has an id. we'll need to get the text in the input field for example. ...
... it doesn't make sense to have the progress bar and the dummy tree data displayed when the find files dialog is first displayed. these were added so that we could see them. let's take them out now and have them displayed when the find button is pressed. first, we need to make them initially invisible. the hidden attribute is used to control whether an element is visible or not. we'll change the progress meter so that its initially hidden. also, we'll add an id attribute so that we can refer to it in a script to show and hide it. while we're at it, let's also hide the splitter and results tree as we only need to show them after a search is performed. <tree id="results" hidden="true" flex="1"> . . . ...
...this causes the element to be hidden when it first appears. next, let's add a function that is called when the find button is pressed. we'll put scripts in a separate file findfile.js. in the last section, we added the script element in the xul file. ...
.... the script tag does allow code to be contained directly inside of it. however, for various reasons, including better performance, you should always put scripts in separate files, except for short fragments which can be put directly in the event handler. function dofind(){ var meter = document.getelementbyid('progmeter'); meter.hidden = false; } this function first gets a reference to the progress meter using its id, progmeter. the second line of the function body changes the hidden state so that the element is visible again. finally, let's have an alert box pop up that displays what will be searched for. of course, we wouldn't want this in the final version but we'll add it to reassure us that something would happen. function dofind(){ var meter=document.getelementbyid('progmeter'); ...

XULRunner tips - Archive of obsolete content
xulrunner frequently asked questions. work in progress. contains tons of non-working code (bit rot). extension manager to be able to install any extensions, you first need to enable the extension manager in application.ini. xulrunner 1.8.0 does not load extensions from the application directory; only the xulrunner directory and the user profile directory are checked. however, it seems that with xulrunner 1.9 the xulrunner directory is ignored, while the profile and application directories are checked. ...
...user profile directory are checked. however, it seems that with xulrunner 1.9 the xulrunner directory is ignored, while the profile and application directories are checked. ...
...gnored, while the profile and application directories are checked. ...
...the xpinstall dialog, extension manager, and theme manager work: pref("xpinstall.dialog.confirm", "chrome://mozapps/content/xpinstall/xpinstallconfirm.xul"); pref("xpinstall.dialog.progress.skin", "chrome://mozapps/content/extensions/extensions.xul?type=themes"); pref("xpinstall.dialog.progress.chrome", "chrome://mozapps/content/extensions/extensions.xul?type=extensions"); pref("xpinstall.dialog.progress.type.skin", "extension:manager-themes"); pref("xpinstall.dialog.progress.type.chrome", "extension:manager-extensions"); pref("extensions.update.enabled", true); pref("extensions.update.interval", 86400); pref("extensions.dss.enabled", false); pref("extensions.dss.switchpending", false); pref("extensions.ignoremtimechanges", false); pref("extensions.logging.enabled", false); pref("general.skins.se...

CSS - Archive of obsolete content
e.-moz-text-blinkthe -moz-text-blink non-standard mozilla css extension specifies the blink mode.-moz-window-shadowthe -moz-window-shadow css property specifies whether a window will have a shadow. ...
...-text-blink non-standard mozilla css extension specifies the blink mode.-moz-window-shadowthe -moz-window-shadow css property specifies whether a window will have a shadow. ...
...z-window-shadowthe -moz-window-shadow css property specifies whether a window will have a shadow. ...
...s non-standard, supported only in internet explorer 10, internet explorer 11, and microsoft edge.::-ms-expandthe ::-ms-expand css pseudo-element is a microsoft extension that represents the button of a <select> menu control that opens or closes the drop-down menu. typically it is a triangle that points downward.::-ms-fillthe ::-ms-fill css pseudo-element is a microsoft extension that represents a progress bar displayed by <progress>.::-ms-fill-lowerthe ::-ms-fill-lower css pseudo-element represents the lower portion of the track of a slider control; that is, the portion corresponding to values less than the value currently selected by the thumb. a slider control is one possible representation of <input type="range">.::-ms-fill-upperthe ::-ms-fill-upper css pseudo-element is a microsoft extension t...

Gecko info for Windows accessibility vendors
when the user has jumped to a named anchor within the page. the event is fired on the first accessible object in the part of the document that has been jumped to. event_menupopupstart and event_menupopupend are fired when xul menus are opened or closed. event_menustart and event_menuend are fired when the xul menubar is activated or deactivated. event_valuechange is fired for sliders, progress meters and other objects who's get_accvalue() may change. event_show, event_hide and event_locationchange are fired for the caret object. event_reorder is fired on an object whenever its children change. event_show and event_hide may also be fired with the reorder event, for the child who's visibility changed. the show and hide events are not fired on every iaccessible when a new subtree ...
...hide and event_locationchange are fired for the caret object. event_reorder is fired on an object whenever its children change. event_show and event_hide may also be fired with the reorder event, for the child who's visibility changed. the show and hide events are not fired on every iaccessible when a new subtree of iaccessibles changes visibility -- only the top iaccessible. the exception is progress meters, which are guaranteed to fire event_show and event_hide events when they are displayed or hidden. event_alert is fired when an object of role_alert appears or changes. this should indicate to a screen reader to read the contents of the alert (it may be a container who's descendents should be read). event_selection is fired on children of single selection containers along with the e...
...escription. this makes it clear that the description is truly intended to be read. neither "description:" or "of" in the above strings is ever localized, so they should be parsed out. dhtml accessibility is supported this means that you may encounter roles that are not typically in html content. be prepared for new combinations of roles and states in content, such as role_slider, role_progressbar and state_required. in addition, check the state_focusable bit on tables, which indicates a traversable dhtml spreadsheet. please see the dhtml accessibility documentation page for more information on this topic. iaccessibles persist unless the document changes, retrieving the iaccessible more than once for the same object will return the same iaccessible*. the uniqueid will remain...
...nt_state_change when radiobutton is set role_combobox xul: <menulist> html: <select size="1"> dhtml: role="wairole:combobox" fires event_valuechange when current combobox option changes. role_droplist not supported. n/a role supported? unique features role_progressbar xul: <progressmeter> dhtml: role="wairole:progressbar" fires event_valuechange when progressbar moves by at least 3% fires event_show and event_hide directly on role_progressbar when it appears/disappears as well as on ancestor container that visibility may have changed on. role_dial not supported n/a ...

nsIApplicationUpdateService
ion updates might be disabled by the application and the platform the application is running on. read only. canupdate boolean true if the update service is able to download and install updates. this depends on whether or not the current user has the necessary access privileges for the install directory. read only. obsolete since gecko 1.9.1.7pre isdownloading boolean true if a download is in progress, otherwise false. read only. methods adddownloadlistener() adds a listener that receives progress and state information about the update that is currently being downloaded. this information is most commonly used to update a user interface that informs the user as to the status of an update. void adddownloadlistener( in nsirequestobserver listener ); parameters listener an object implementi...
... downloadupdate() starts downloading a software update. astring downloadupdate( in nsiupdate update, in boolean background ); parameters update an nsiupdate object indicating the update to download. ...
... downloadupdate() starts downloading a software update. astring downloadupdate( in nsiupdate update, in boolean background ); parameters update an nsiupdate object indicating the update to download. background true to download the update in the background or false to download it in the foreground. ...
...date is ready to be applied. "applying" the update is in the process of being applied. "succeeded" the update has been installed successfully. "download-failed" the update failed to be downloaded. "failed" installing the update failed. pausedownload() pauses the currently active update download. void pausedownload(); parameters none. removedownloadlistener() removes a listener that is receiving progress and state information about the update that is currently being downloaded. void removedownloadlistener( in nsirequestobserver listener ); parameters listener the listener object to remove. selectupdate() selects the best update to install from a provided list of available updates. nsiupdate selectupdate( [array, size_is(updatecount)] in nsiupdate updates, in unsigned long updatecount ); ...

nsIHttpChannel
only be set before the channel is opened. note: the channel may silently refuse to set the referer: header if the uri does not pass certain security checks (e.g., a "https://" url will never be sent as the referrer for a plaintext http request). the implementation is not required to throw an exception when the referrer uri is rejected. exceptions thrown ns_error_in_progress if set after the channel has been opened. ns_error_failure if used for setting referrer during visitrequestheaders(). getting the value will not throw. requestmethod acstring set or get the http request method (default is "get"). setter is case insensitive; getter returns an uppercase string. this attribute may only be set before the channel is op...
... returns an uppercase string. this attribute may only be set before the channel is opened. note: the data for a "post" or "put" request can be configured via nsiuploadchannel. however, after setting the upload data, it may be necessary to set the request method explicitly. the documentation for nsiuploadchannel has further details. exceptions thrown ns_error_in_progress if set after the channel has been opened. requestsucceeded boolean returns true if the http response code indicates success. the value of nsirequest.status() will be ns_ok even when processing a 404 file not found response because such a response may include a message body that (in some cases) should be shown to the user. use this attribute to distinguish server ...
...quest header. this should be used with caution in the cases where the behavior of setrequestheader() ignoring empty header values is undesirable. this method may only be called before the channel is opened. void setemptyrequestheader( in acstring aheader ); parameters aheader the case-insensitive name of the request header to set (for example "cookie"). exceptions thrown ns_error_in_progress if called after the channel has been opened. ns_error_failure if called during visitrequestheaders(). setreferrerwithpolicy() call this method to set the channel's referrer using the referrer policy indicated with one of the predefined constants. void setreferrerwithpolicy( in nsiuri areferrer, in unsigned long areferrerpolicy ); parameters areferrer the uri to base the referrer ...
... merged with any existing values for the specified header. this flag is ignored if the specified header does not support merging (for example the "content-type" header can only have one value). the list of headers for which this flag is ignored is an implementation detail. if this flag is false, then the header value will be replaced with the contents of avalue. exceptions thrown ns_error_in_progress if called after the channel has been opened. ns_error_failure if called during visitrequestheaders(). setresponseheader() set the value of a particular response header. this method allows, for example, the html content sink to inform the http channel about http-equiv headers found in html <meta> tags. if value is empty and merge is false, the header will be cleared. void setresponseheader...

XPCOM Interface Reference by grouping
swindow nsidomnode nsidomnshtmldocument nsidomstorageitem nsidomstoragemanager nsidomwindow nsidomwindow2 nsidomwindowinternal nsidomwindowutils nsidynamiccontainer nsieditor event nsidomevent nsidomeventgroup nsidomeventlistener nsidomeventtarget nsidommousescrollevent nsidommoztouchevent nsidomorientationevent nsidomprogressevent nsidomsimplegestureevent nsidragdrophandler nsidragservice nsidragsession html nsiaccessibilityservice nsiaccessiblecoordinatetype nsiaccessibledocument nsiaccessibleeditabletext nsiaccessibleevent nsiaccessiblehyperlink nsiaccessiblehypertext nsiaccessibleimage nsiaccessibleprovider nsiaccessibleretrieval nsiaccessiblerole...
...riptableunicodeconverter nsiscripterror nsiscripterror2 stylesheet nsistylesheetservice url nsiuri nsiurl util nsidomserializer nsidomxpathevaluator nsidomxpathexception nsidomxpathexpression nsidomxpathresult xslt nsixsltexception nsixsltprocessor download nsidownload nsidownloadmanager nsidownloadprogresslistener element internal nsiworker nsiworkerglobalscope nsiworkermessageevent nsiworkermessageport nsiworkerscope tree nsitreeboxobject nsitreecolumn nsitreecolumns nsitreecontentview nsitreeselection nsitreeview xform nsixformsmodelelement nsixformsnsinstanceelement nsixformsnsmodelelement xmlhttprequest ...
... nsijetpackservice offlinestorage nsiapplicationcache nsiapplicationcachechannel nsiapplicationcachecontainer nsiapplicationcachenamespace nsiapplicationcacheservice places nsiannotationobserver rss feed nsifeed nsifeedcontainer nsifeedelementbase nsifeedentry nsifeedgenerator nsifeedperson nsifeedprocessor nsifeedprogresslistener nsifeedresult nsifeedresultlistener nsifeedtextconstruct script mozijssubscriptloader storage mozistoragevacuumparticipant util nsieffectivetldservice worker nsiabstractworker data nsiarray nsicategorymanager nsicollection nsidictionary nsimutablearray nsisimpleenumerator nsisupportschar ns...
... nsipipe nsitraceablechannel nsitransport nsitransporteventsink nsitransportsecurityinfo timer nsitimer nsitimercallback ui windows nsitaskbarpreview nsitaskbarpreviewbutton nsitaskbarpreviewcontroller nsitaskbarprogress nsitaskbartabpreview nsitaskbarwindowpreview nsiwintaskbar nsialertsservice nsiwebprogress nsiwebprogresslistener nsiwebprogresslistener2 update nsiupdate nsiupdatechecker nsiupdatechecklistener nsiupdateitem nsiupdatemanager nsiupdatepatch ...

XDomainRequest - Web APIs
quest.timeout gets or sets the amount of time until a request times out. xdomainrequest.responsetext gets the response body as a string. methods xdomainrequest.open() opens the request, specifing the method (get/post) and url. xdomainrequest.send() sends the request. post data is specified in this method. xdomainrequest.abort() aborts the request. event handlers xdomainrequest.onprogress a handler for when the request has made progress between the send method call and the onload event. xdomainrequest.ontimeout a handler for when the request times out. xdomainrequest.onerror a handler for when a request has errored. xdomainrequest.onload a handler for when the full response has been received from the server. example if(window.xdomainrequest){ var xdr = new xdomainreque...
...method call and the onload event. xdomainrequest.ontimeout a handler for when the request times out. xdomainrequest.onerror a handler for when a request has errored. xdomainrequest.onload a handler for when the full response has been received from the server. ...
...t. xdomainrequest.ontimeout a handler for when the request times out. xdomainrequest.onerror a handler for when a request has errored. xdomainrequest.onload a handler for when the full response has been received from the server. ...
...xdr.onerror = function () { //error occurred }; xdr.onload = function() { //success(xdr.responsetext); } settimeout(function () { xdr.send(); }, 0); } note: the xdr.send() call is wrapped in a timeout (see window.settimeout() to prevent an issue with the interface where some requests are lost if multiple xdomainrequests are being sent at the same time. note: the xdr.onprogress event should always be defined, even as an empty function, or xdomainrequest may not fire onload for duplicate requests. security the xdomainrequest is built to be secure in multiple ways. the origin's security protocol must match that of the requested url. (http to http, https to https). if these do not match, the request will error "access is denied". the requested url's server must have...

XMLHttpRequest.upload - Web APIs
abort onabort the upload operation was aborted. error onerror the upload failed due to an error. ...
... abort onabort the upload operation was aborted. error onerror the upload failed due to an error. load onload the upload completed successfully. ...
... abort onabort the upload operation was aborted. error onerror the upload failed due to an error. load onload the upload completed successfully. ...
... abort onabort the upload operation was aborted. ...

Using the aria-valuenow attribute - Accessibility
if the current value is not known, the author should not set the aria-valuenow attribute. if the aria-valuenow has a known minimum and maximum value, authors should set the aria-valuemin and aria-valuemax attributes. when the rendered value cannot be accurately represented as a number, authors should use the aria-valuetext attribute in conjunction with aria-valuenow to provide a user-friendly representation of the range's current value. for example, a slider may have rendered values of small, medium, and large. ...
... values of aria-valuenow could range from 1 through 3, which indicate the position of each value in the value space, but the aria-valuetext would be one of the strings: small, medium, or large. aria-valuenow is a required attribute of role slider, scrollbar and spinbutton. value string representation of a number possible effects on user agents and assistive technology for elements with role progressbar and scrollbar, assistive technologies should render the actual value as a percentage, calculated as a position on the range from aria-valuemin to aria-valuemax if both are defined, otherwise the actual value with a percent indicator. for elements with role slider and spinbutton, assistive technologies should render the actual value to users. note: opinions may differ on how assistive technol...
...hould render the actual value to users. note: opinions may differ on how assistive technology should handle this technique. the information provided above is one of those opinions and therefore not normative. examples example 1: the snippet below shows a simple slider with a current value of 4. ...
...logy should handle this technique. the information provided above is one of those opinions and therefore not normative. examples example 1: the snippet below shows a simple slider with a current value of 4. ...

Accessibility documentation index - Accessibility
hat user input is required on an element before a form can be submitted. this attribute can be used with any typical html form element; it is not limited to elements that have an aria role assigned. 26 using the aria-valuemax attribute aria, accessibility the aria-valuemax attribute is used to define the maximum value allowed for a range widget such as a slider, spinbutton or progressbar. 27 using the aria-valuemin attribute aria, accessibility, needscontent the aria-valuemin attribute is used to define the minimum value allowed for a range widget such as a slider, spinbutton or progressbar. if the aria-valuenow has a known maximum and minimum, the author should provide properties for aria-valuemax and aria-valuemin.the value of aria-valuemin must be less...
...w has a known maximum and minimum, the author should provide properties for aria-valuemax and aria-valuemin.the value of aria-valuemin must be less than or equal to the value of aria-valuemax. 28 using the aria-valuenow attribute aria, accessibility, needscontent the aria-valuenow attribute is used to define the current value for a range widget such as a slider, spinbutton or progressbar. if the current value is not known, the author should not set the aria-valuenow attribute. if the aria-valuenow has a known minimum and maximum value, authors should set the aria-valuemin and aria-valuemax attributes. 29 using the aria-valuetext attribute aria, accessibility, attribute the aria-valuetext attribute is used to define the human readable text alternative of ar...
... the author should not set the aria-valuenow attribute. if the aria-valuenow has a known minimum and maximum value, authors should set the aria-valuemin and aria-valuemax attributes. 29 using the aria-valuetext attribute aria, accessibility, attribute the aria-valuetext attribute is used to define the human readable text alternative of aria-valuenow for a range widget such as progressbar, spinbutton or slider. 30 using the article role aria, accessible, needscontent the article role is used to identify a section of a page that forms an independent part of a document, page or site. examples of an article include web log posts, newspaper or magazine articles and use-submitted comments. it is independent in that its contents could stand alone, for example in ...
...ty, needscontent this technique demonstrates how to use the log role and describes the effect it has on browsers and assistive technology. 34 using the presentation role aria, needscontent, section 508, wai-aria, wcag this technique demonstrates how to use the presentation role and describes the effect it has on browsers and assistive technology. 35 using the progressbar role aria, accessibility, needscontent, needsexample this technique demonstrates how to use the progressbar role and describes the effect it has on browsers and assistive technology. 36 using the radio role needscontent this technique demonstrates how to use the radio role and describes the effect it has on browsers and assistive technology. 37 using t...

Using feature queries - CSS: Cascading Style Sheets
feature queries are created using the css at-rule @supports, and are useful as they give web developers a way to test to see if a browser has support for a certain feature, and then provide css that will only run based on the result of that test. in this guide you will learn how to implement progressive enhancement using feature queries. syntax css feature queries are part of the css conditional rules module, which also contains the media query @media rule; when you use feature queries, you will find they behave in a similar way to media queries. the difference is that with a media query you are testing something about the environment in which the web page is running, whereas with feature queries you are testing browser support for css features. a feature query consists of the @supports rule, ...
...bugs! in addition, feature queries cannot test for partial implementations. a good example of this is the gap property. all browsers that support css grid support gap in css grid, however only firefox supports gap in flexbox. if you test for the gap property, because you want to use it in flexbox, you will get a positive response even though it is not implemented. how to use feature queries for progressive enhancement feature queries are an incredibly useful tool when progressively enhancing a site. they enable you to provide a good solution for all browsers, and an enhanced solution for those browsers that support newer features. however, there are browsers that don't support feature queries but also have no support for a feature we want to use. for example, we might want to use css grid, whi...
...t support newer features. however, there are browsers that don't support feature queries but also have no support for a feature we want to use. for example, we might want to use css grid, which is not supported in ie11. we can't create a fallback by checking for browsers which do not have support, as ie11 doesn't support feature queries either! in practice however, when using feature queries for progressive enhancement, this doesn't matter. you do however need to structure your css in a certain way, writing css for non-supporting browsers and overwriting it with the css inside the feature query. let's walk through a very simple example where feature queries come in handy, which uses them in the way described above. let's say we want to create a layout of three boxes in a row, and ideally we wou...
.... ...

WebKit CSS extensions - CSS: Cascading Style Sheets
-webkit-border-start-width** -webkit-border-vertical-spacing -webkit-box-align** -webkit-box-direction** -webkit-box-flex-group** -webkit-box-flex** -webkit-box-lines** -webkit-box-ordinal-group** -webkit-box-orient** -webkit-box-pack** -webkit-box-reflect** c -webkit-column-axis -webkit-column-break-after -webkit-column-break-before -webkit-column-break-inside -webkit-column-progression -webkit-cursor-visibility d-i -webkit-dashboard-region -webkit-font-size-delta -webkit-font-smoothing -webkit-highlight -webkit-hyphenate-character -webkit-hyphenate-limit-after -webkit-hyphenate-limit-before -webkit-hyphenate-limit-lines -webkit-initial-letter l -webkit-line-align -webkit-line-box-contain -webkit-line-clamp -webkit-line-grid -webkit-line-snap -webkit-l...
...if a pseudo-element (but not pseudo-class) has a -webkit- pre...
...if a pseudo-element (but not pseudo-class) has a -webkit- prefix, as of firefox 63, b...
...if a pseudo-element (but not pseudo-class) has a -webkit- prefix, as of firefox 63, blink, webkit and gecko browsers as...

Content categories - Developer guides
a few other elements belong to this category, but only if a specific condition is fulfilled: <area>, if it is a descendant of a <map> element <link>, if the itemprop attribute is present <meta>, if the itemp...
...hrasing content defines the text and the mark-up it contains. runs of phrasing content make up paragraphs. elements belonging to this category are <abbr>, <audio>, <b>, <bdo>, <br>, <button>, <canvas>, <cite>, <code>, <command>, <data>, <datalist>, <dfn>, <em>, <embed>, <i>, <iframe>, <img>, <input>, <kbd>, <keygen>, <label>, <mark>, <math>, <meter>, <noscript>, <object>, <output>, <picture>, <progress>, <q>, <ruby>, <samp>, <script>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <svg>, <textarea>, <time>, <var>, <video>, <wbr> and plain text (not only consisting of white spaces characters). a few other elements belong to this category, but only if a specific condition is fulfilled: <a>, if it contains only phrasing content <area>, if it is a descendant of a <map> element <del>, if i...
...low content or phrasing content should have at least one node which is palpable. form-associated content form-associated content comprises elements that have a form owner, exposed by a form attribute. a form owner is either the containing <form> element or the element whose id is specified in the form attribute. ...
... submittable elements that can be used for constructing the form data set when the form is submitted. contains <button>, <input>, <keygen>, <object>, <select>, and <textarea>. resettable elements that can be affected when a form is reset. contains <input>, <keygen>, <output>,<select>, and <textarea>. ...

Browser detection using the user agent - HTTP
but browsers and standards are not perfect, and there are still some edge cases where detecting the browser is needed. using the user agent to detect the browser looks simple, but doing it well is, in fact, a very hard problem. ...
...this is usually a bad practice, but there are some cases in which this is necessary. in these cases, you should first analyze your situation to be sure it's really necessary. can you prevent it by adding some non-semantic <div> or <span> elements? the difficulty of successfully using user agent detection is worth a few disruptions to the purity of your html. also, rethink your design: can you use progressive enhancement or fluid layouts to help remove the need to do this? avoiding user agent detection if you want to avoid using user agent detection, you have options! feature detection feature detection is where you don't try to figure out which browser is rendering your page, but instead, you check to see if the specific feature you need is available. if it's not, you use a fallback. in tho...
...rted browsers. this may sound obvious and simple, but sometimes it is not. for example, in the above code snippets, using lookbehind in short-regexp notation (e.g. /reg/igm) will cause a parser error in unsupported browsers. thus, in the above example, you would use new regexp("(?<=look_behind_stuff)"); instead of /(?<=look_behind_stuff)/, even in the lookbehind supported section of your code. progressive enhancement this design technique involves developing your web site in 'layers', using a bottom-up approach, starting with a simpler layer and improving the capabilities of the site in successive layers, each using more features. graceful degradation this is a top-down approach in which you build the best possible site using all the features you want, then tweak it to make it work on older ...
...ur web site in 'layers', using a bottom-up approach, starting with a simpler layer and improving the capabilities of the site in successive layers, each using more features. graceful degradation this is a top-down approach in which you build the best possible site using all the features you want, then tweak it to make it work on older browsers. this can be harder to do, and less effective, than progressive enhancement, but may be useful in some cases. mobile device detection arguably the most common use and misuse of user agent sniffing is to detect if the device is a mobile device. however, people too often overlook what they are really after. people use user agent sniffing to detect if the users' device is touch-friendly and has a small screen so they can optimize their website accordingly. ...

Optimizing startup performance - Web Performance
e locked up. why is it important to be asynchronous? other than the reasons suggested above, consider the impact of a non-responsive page or user interface. the user is unable to cancel if they launched your app by mistake. if the app is being run in a browser, it's possible the user may get an "unresponsive app" or "slow script" notification. you should present some kind of interface, such as a progress bar, so that the user knows how much longer they'll need to wait while your app starts up. where there's a will... if you're starting your project from scratch, it's usually pretty easy to just write everything the "right way," making appropriate bits of the code asynchronous. all pure startup calculations should be performed in background threads, while you keep the run-time of main thread eve...
...h longer they'll need to wait while your app starts up. where there's a will... if you're starting your project from scratch, it's usually pretty easy to just write everything the "right way," making appropriate bits of the code asynchronous. all pure startup calculations should be performed in background threads, while you keep the run-time of main thread events as short as possible. include a progress indicator so the user knows what's going on and how long they'll be waiting. in theory, anyway, it should be pretty easy to design your new app to start up nicely. on the other hand, however, it can get tricky when you're porting an existing app to the web. a desktop application doesn't need to be written in an asynchronous fashion because usually the operating system handles that for you, or th...
...se usually the operating system handles that for you, or the app is the only thing that matters which is currently running, depending on the operating environment. the source application might have a main loop that can easily be made to operate asynchronously (by running each main loop iteration separately); startup is often just a continuous, monolithic procedure that might periodically update a progress meter. while you can use web workers to run even very large, long-duration chunks of javascript code asynchronously, there's a huge caveat that: workers don't have access to webgl or audio, and they can't send synchronous messages to the main thread, so you can't even proxy those apis to the main thread. this all means that unless you can easily pull out the "pure calculation" chunks of your sta...
...e do your best to optimize the size of your game data; smaller level files will download and be processed faster than larger ones. subjective factors anything you can do to help keep the user engaged during the startup process will help make the time seem to go by faster. for games, consider having background music playing or a nice splash screen displayed. in between calculations, update your progress indicator, make changes to the display, or anything else you might be able to do to help the user feel like your app is doing something instead of sitting there quietly. ...

Adding the structure - Archive of obsolete content
. to implement this ui, we'll add a statusbarpanel element to the statusbar element in the navigator.xul file. ...
... this ui, we'll add a statusbarpanel element to the statusbar element in the navigator.xul file. ...
... statusbarpanel element to the statusbar element in the navigator.xul file. ...

Making it into a static overlay - Archive of obsolete content
cript" src="chrome://navigator/content/tinderstatus.js"/> <!-- hook for stringbundle overlays --> ... ...
...rc="chrome://navigator/content/tinderstatus.js"/> <!-- hook for stringbundle overlays --> ... ...
...r/content/tinderstatus.js"/> <!-- hook for stringbundle overlays --> ... ...

Embedding FAQ - Archive of obsolete content
mplement your own protocol method. you can find more information on adding new protocols here how to embedding mozilla inside of java there hasn't been any good code examples found. however, there is a stripped down, uncommented code with eclipse libraries in this thread. ...
...d more information on adding new protocols here how to embedding mozilla inside of java there hasn't been any good code examples found. however, there is a stripped down, uncommented code with eclipse libraries in this thread. ...
...e.swt.widgets.shell; import org.mozilla.xpcom.nsidomdocument; public class test { public static void main(string args[]) { display display = new display(); shell shell = new shell(display); final mozillabrowser browser = new mozillabrowser(shell,wt.border); browser.seturl("http://www.google.com"); browser.addprogresslistener(new progresslistener() { public void changed(progressevent event) { } public void completed(progressevent event) { nsidomdocument doc = browser.getdocument(); system.out.println(doc); } }); while (!she...

Priority Content - Archive of obsolete content
s list, feel free to add it. note: use example at sample:original document information to credit original authors. devedge devedge mirror note: if you're digging around the mirror and see anything there that you think should be migrated to devmo that isn't on this list, feel free to add it below. a raw list of everything that has not been migrated at all appears there. ...
...rything that has not been migrated at all appears there. book length works in progress: netscape gecko plugin api reference 1.0 original: netscape gecko plugin api reference 1.0 wiki location: gecko plugin api reference migrators: started: core javascript reference 1.5 original: core javascript reference 1.5 wiki location: core javascript 1.5 reference migrators: deb richardson in progress: transforming xml: netscape and xslt 1.0 original: transforming xml: netscape and xslt 1.0 wiki location: transforming xml with xslt migrators: serge k. keller in progress: rapid application development with mozilla original: author's page and planned host, ben's temporary host wiki location: toc and links page still under construction. migrators: nigel mcfarlane and ben karel shorter...
...keller licensing: these css charts appear to be under a cc:by-nc-sa license, please make note of that on the page when you do the migration. started: using mozilla in testing and debugging web sites original: using mozilla in testing and debugging web sites wiki l...

Accessibility/XUL Accessibility Reference - Archive of obsolete content
> <menuitem label="<!--option3-->" /> </menupopup> </menulist> menupopup see menulist and menubar popup see popupset popupset be careful regarding keyboard access of popups. i don't see a means of accessing a popup brought up via the popup attribute. using context="popupid" allows access via shift+f10 on windows and linux. ...
...!--option3-->" /> </menupopup> </menulist> menupopup see menulist and menubar popup see popupset popupset be careful regarding keyboard access of popups. i don't see a means of accessing a popup brought up via the popup attribute. using context="popupid" allows access via shift+f10 on windows and linux. ...
... menupopup see menulist and menubar popup see popupset popupset be careful regarding keyboard access of popups. i don't see a means of accessing a popup brought up via the popup attribute. using context="popupid" allows access via shift+f10 on windows and linux. ...

RDF in Mozilla FAQ - Archive of obsolete content
); } say the datasource wasn't loaded, and is loading asynchronously. using this api and javascript's settimeout(), one could set up a polling loop that would continually check the loaded property. this is kludgy, and even worse, won't detect a failed load, for example, if there wasn't any data at the url! for this reason, there is an observer interface that allows you to spy on a datasource's progress. ...
...ut(), one could set up a polling loop that would continually check the loaded property. this is kludgy, and even worse, won't detect a failed load, for example, if there wasn't any data at the url! for this reason, there is an observer interface that allows you to spy on a datasource's progress. ...
...} note that the observer will remain attached to the rdf/xml datasource unless removexmlsinkobserver is called. how do i access the information in a datasource? the nsirdfdatasource interface is the means by which you access and manipulate the assertions in a datasource. boolean hasassertion(asource, aproperty, atarget, atruthvalue). this tests the datasource to see if it has the spec...

Efficient animation for web games - Game development
ion prototype, which you definitely should use (as opposed to using the date object), as this will be the time the frame began rendering, and ought to make your animations look more fluid. ...
...which you definitely should use (as opposed to using the date object), as this will be the time the frame began rendering, and ought to make your animations look more fluid. ...
...be the time the frame began rendering, and ought to make your animations look more fluid. you may have a callback that ends up looking something like this: var starttime = -1; var animationlength = 2000; // animation length in milliseconds function doanimation(timestamp) { // calculate animation progress var progress = 0; if (starttime < 0) { starttime = timestamp; } else { progress = timestamp - starttime; } // do animation ... if (progress < animationlength) { requestanimationframe(doanimation); } } // start animation requestanimationframe(doanimation); you will note that we set starttime to -1 at the beginning, when we could just as easily have set the time using the date() object and avoided the extra code in the animation callback. we do this so that an...

Index - Learn web development
ent, getting help it is great that you are putting some time into learning a new set of skills, but there are good practices to employ that will make your learning more effective. there are also are times when you'll get stuck and feel frustrated — even professional web developers feel like this regularly — and it pays to know about the most effective ways to try and get help so you can progress in your work. this article provides some hints and tips in both of these areas that will help you get more out of learning web development, as well as further reading so you can find out more information about each sub-topic should you wish.. 14 common questions codingscripting, infrastructure, learn, web, webmechanics this section of the learning area is designed to provide ...
...nt wrong? troubleshooting javascript article, beginner, codingscripting, debugging, developer tools, error, javascript, learn, tutorial, console.log, l10n:priority so there we have it, the basics of figuring out errors in simple javascript programs. it won't always be that simple to work out what's wrong in your code, but at least this will save you a few hours of sleep and allow you to progress a bit faster when things don't turn out right, especially in the earlier stages of your learning journey. 89 javascript building blocks article, assessment, beginner, codingscripting, conditionals, functions, guide, introduction, javascript, landing, loops, module, events, l10n:priority in this module, we continue our coverage of all javascript's key fundamental features, tur...
...n, client-side great! everything looks as it should. we have successfully refactored our html into components! in the next article we'll start looking into adding interactivity to our ember application. 281 ember interactivity: events, classes and state beginner, classes, ember, frameworks, javascript, learn, services, client-side, decorators, events ok, so that's great progress for now. we can now add todo items to our app, and the state of the data is tracked using our service. next we'll move on to getting our footer functionality working, including the todo counter, and look at conditional rendering, including correctly styling todos when they've been checked. we'll also wire up our "clear completed" button. 282 ember resources and troubleshooting begi...

Getting started with Vue - Learn web development
nstallation, and to use some of the more advanced features of vue (like single file components or render functions), you'll need a terminal with node + npm installed. objective: to setup a local vue development environment, create a starter app, and understand the basics of how it works. a clearer vue vue is a modern javascript framework that provides useful facilities for progressive enhancement — unlike many other frameworks, you can use vue to enhance existing html. this lets you use vue as a drop-in replacement for a library like jquery. that being said, you can also use vue to write entire single page applications (spas). this allows you to create markup managed entirely by vue, which can improve developer experience and performance when dealing with complex applica...
... state management when you need to. additionally, vue takes a "middle ground" approach to tooling like client-side routing and state management. while the vue core team maintains suggested libraries for these functions, they are not directly bundled into vue. this allows you to select a different routing/state management library if they better fit your application. in addition to allowing you to progressively integrate vue into your applications, vue also provides a progressive approach to writing markup. like most frameworks, vue lets you create reusable blocks of markup via components. most of the time, vue components are written using a special html template syntax. when you need more control than the html syntax allows, you can write jsx or plain javascript functions to define your component...
...em if you want more information on any sub topic. for a good (but potentially biased) comparison between vue and many of the other frameworks, see vue docs: comparison with other frameworks. installation to use vue in an existing site, you can drop one of the following <script> elements onto a page. this allows you to start using vue on existing sites, which is why vue prides itself on being a progressive framework. this is a great option when migrating an existing project using a library like jquery to vue. with this method, you can use a lot of the core features of vue, such as the attributes, custom components, and data-management. development script (unoptimized, but includes console warnings. great for development <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script...

Eclipse CDT Manual Setup
that identifies your mozilla source tree, set the code location to the root of your source tree, select an appropriate toolchain (e.g., "macosx gcc"), and click finish. the status bar at the bottom right of the window should now show that eclipse is "refreshing the workspace" (gathering a list of all the files in the source tree). click on the little green button beside this message to open the "progress" tab, and keep an eye on the "refreshing workspace" item as you continue with the steps below. (if an "indexing" item starts after the "refreshing the workspace" item has finished, click the little red box beside that item to cancel it, since we want to configure the project before the indexer runs.) initial project properties so that the indexer will run faster and give better results, and so ...
...in compiler settings" and add the flag "-std=c++11" at the end of the field labeled "command to get compiler specs". in cdt 8.3 (unreleased as of august 2013), there will be a more user-friendly way to specify this (see http://wiki.eclipse.org/cdt/user/newin83#toolchains). building the index once you see the end of the build output in the console tab and the build item has disappeared from the progress tab, you can start indexing the source. if indexing started automatically (see the progress tab), cancel it, since there seems to be a bug that makes it give bad results when it starts automatically at this stage. right-click the project root in the project explorer tab and select "index > rebuild". you will now see "indexing..." in the status bar at the bottom right and an indexing item in the p...
...e bad results when it starts automatically at this stage. right-click the project root in the project explorer tab and select "index > rebuild". you will now see "indexing..." in the status bar at the bottom right and an indexing item in the progress tab. it will take 10 minutes or so on a decent developer machine for a full rebuild of the index. once the indexer has finished (keep an eye on the progress tab), sanity check that everything went as it should have by right-clicking the project in the project explorer tab and selecting "index > search for unresolved includes". if you get many more than 2000 unresolved includes (as of may 2012), then things have gone pretty wrong. you should be able to use the list of unresolved includes to help figure out what the problem is (see also the parser erro...

Overview of Mozilla embedding APIs
id implemented interfaces: nsiexternalhelperappservice preferences service the preferences service provides access to persistent data stored within a user's profile directory. contract-id: ns_pref_contractid implemented interfaces: nsiprefservice nsiprefbranch related interfaces: nsipreflistener profile manager service contract-id: implemented interfaces: document loader service (webprogress) eventually, this service will be replaced by thewebprogress service... contract-id: ns_document_loader_service_contractid implemented interfaces: nsiwebprogress nsidocumentloader related interfaces: nsiwebprogresslistener public components nswebbrowser the nswebbrowser is the main embedding component which gecko exposes. conceptually, each nswebbrowser instance represents a html conten...
... domwindow interfaces. manipulation of the entire document structure is done via the various webbrowser interfaces. contract-id: ns_webbrowser_contractid implemented interfaces: nsiwebbrowser nsiwebnavigation nsiwebbrowsersetup nsiwebbrowserpersist nsiwebbrowserfind nsiwebbrowserprint nsiwebbrowserfocus nsibasewindow requestor interfaces: nsidomwindow nsidomdocument nsiwebprogress nsiclipboardcommands nsiprompt related interfaces: nsiprompt nsiwebbrowserchrome nsiwebbrowsersitewindow nsiwebprogresslistener nsicontextmenulistener nsiprintoptions overview: most of gecko's functionality is exposed through the nswebbrowser component. the webbrowser provides a simple mechanism for other applications to leverage gecko functionality. each instance of a webbrows...
...efinition: nsiwebbrowserprint.idl nsiwebbrowserfind this interface exposes the searching capabilities of the nswebbrowser component. interface status... none interface definition: nsiwebbrowserfind.idl nsiwebbrowserfocus this interface provides access to the focus information of a nswebbrowser instance. interface status... being reviewed interface definition: nsiwebbrowserfocus.idl nsiwebprogress interface status... interface definition: nsiwebprogresslistener interface status... interface definition: nsiprompt interface status... interface definition: nsiprefs interface status... interface definition: nsiprofile the profile manager creates and manages user profiles; each profile is essentially a complete configuration of the application, including preferences, installed exten...

DownloadSummary
tsummary() function. method overview promise bindtolist(downloadlist alist); promise addview(object aview); promise removeview(object aview); properties attribute type description allhavestopped read only boolean indicates whether all the downloads are currently stopped. progresstotalbytes read only number indicates the total number of bytes to be transferred before completing all the downloads that are currently in progress. for downloads that do not have a known final size, the number of bytes currently transferred is reported as part of this property. this is zero if no downloads are currently in progress. pr...
... methods bindtolist() this method may be called once to bind this object to a downloadlist. views on the summarized data can be registered before this object is bound to an actual list. this allows the summary to be used without requiring the initialization of the downloadlist first. ...
... methods bindtolist() this method may be called once to bind this object to a downloadlist. views on the summarized data can be registered before this object is bound to an actual list. ...

Application Translation with Mercurial
a. file and text editor for editing individual files a text editor can be a better choice than a file comparion program, e.g. because the file is new and everything has to be translated, the file is too customized to compare it to the english one, or special functionality is required (e.g. bookmarking untranslated lines). use a text editor you are comfortable with. this example uses notepad++. progress tracking tool to track which strings and files already have been translated and later also to see which new strings have already been tested in the product as being a good translation for the functionality behind the translated strings and that the translated texts fit into the available, the translation progress should be tracked. this can be done in a text editor or word processor or any other...
...nd open it in your favorite text editor. windows users can use e.g. notepad++. paste the following content into the file: [ui] username = firstname lastname <mynick@example.com> merge = internal:merge [alias] qexport = export -g -r qtip qexportall = diff -r qparent [defaults] commit = -v diff = -p -u 8 qdiff = -p -u 8 qnew = -u [diff] git = 1 showfunc = 1 unified = 8 [extensions] hgext.mq = progress = [hooks] put in your name and email address which later will be public on the internet after your translation patch got accepted and uploaded. save the file and close it. enabling mercurial queues (revertable patches) some time will pass between the moment in which you start the localization, finish it, test it, improve it, upload it for review and get review (maybe not approved on first t...
...g.dtd. tips for finding files with usually easily translateable texts: look for files in browser/chrome/browser/ look for a file with only a few changes suggestions files starting with about... files in the preferences directory (browser/chrome/browser/preferences/) the browser.dtd and browser.properties files if there aren't too many new strings. tracking the translation progress if you translate more than a few strings, you usually want to keep track of what has already been translated (and later if the text has been tested in the product as fitting into the available area and suiting the functionality it describes). this guide achieves this with the firefox extension scrapbook. you installed scrapbook earlier, now open it in firefox either by calling it from the fir...

Localization technical reviews
the technical review process we use for new localizations can be confusing for any trying to start a new localization. we use this review process to perform quality assurance (qa) testing on your l10n efforts. this ensures that every user who downloads your localized mozilla application receives all of your hard work in a functional product. ...
...once attached, open the attachment details. in the attachment details, select the ? from the dropdown menu next to the review flag. this will display a text box to assign the review to someone. enter :pike as the requestee. we will perform a technical review of your work and provide you with feedback. we're happy to work with you to make sure that your work is fully functional. tracking your progress you can track your reviews progress two ways: within the bug and through your team's dashboard. if your work is approved, you'll see a + review flag next to your attached revision in your request bug. if bugs are discovered, your technical review is rejected (- review flag) and the bugs are filed in bugzilla. once they are fixed, push your fix to your repo, attach it to the corresponding bug u...
...your technical review is rejected (- review flag) and the bugs are filed in bugzilla. once they are fixed, push your fix to your repo, attach it to the corresponding bug using the same mercurial revision number as before, and then request another review. the process is then repeated until the bug is fixed to satisfaction. these bugs are also pulled into the dashboards, which track your revision's progress. in order to ultimately have your revision included as an official build, your dashboards must be at 100% green. to the right, you'll see the current dashboard page for a german localization. revisions are approved using the buttons in the furthest column to the right. as your work is approved, you'll see a green circle in the furthest column to the right as well as a measure of percentage in t...

PRCallOnceType
status an indication of the outcome of the initialization process. ...
... status an indication of the outcome of the initialization process. ...
... status an indication of the outcome of the initialization process. ...

PR_ConnectContinue
out_flags); parameters the function has the following parameters: fd a pointer to a prfiledesc object representing a socket. out_flags the out_flags field of the poll descriptor returned by pr_poll(). returns if the nonblocking connect has successfully completed, pr_connectcontinue returns pr_success. if pr_connectcontinue() returns pr_failure, call pr_geterror(): - pr_in_progress_error: the nonblocking connect is still in progress and has not completed yet. the caller should poll the file descriptor for the in_flags pr_poll_write|pr_poll_except and retry pr_connectcontinue later when pr_poll() returns. - other errors: the nonblocking connect has failed with this error code. description continue a nonblocking connect. after a nonblocking connect is initiated with...
...repeat the pr_poll(), pr_connectcontinue() sequence until the nonblocking connect has completed. ...
...h this error code. description continue a nonblocking connect. after a nonblocking connect is initiated with pr_connect() (which fails with pr_in_progress_error), one should call pr_poll() on the socket, with the in_flags pr_poll_write | pr_poll_except. when pr_poll() returns, one calls pr_connectcontinue() on the socket to determine whether the nonblocking connect has completed or is still in progress. repeat the pr_poll(), pr_connectcontinue() sequence until the nonblocking connect has completed. ...

Components.isSuccessCode
m to an nsioutputstream, checking for whether the copy succeeded using components.issuccesscode(). note: nsiasyncstreamcopier.init() has changed in gecko 1.9.2, omit last 2 boolean parameters if you're using gecko 1.9.1 and earlier. ...
...ast 2 boolean parameters if you're using gecko 1.9.1 and earlier. ...
... components.interfaces; const cr = components.results; // global flags polled externally var copyfailed = false; var copyinprogress = false; function copybufferedstream(instream, outstream) { var copyobserver = { onstartrequest: function(request, context) { copyinprogress = true; }, onstoprequest: function(request, context, statuscode) { copyinprogress = false; // did the copy fail? if (!components.issuccesscode(statuscode)) copyfailed = true; }, queryinterface: function(aiid) { if (aiid.equals(ci.nsirequestobserver) || aiid.equals(ci.nsisupports)) return this; throw cr.ns_error_no_interface; } }; var copier = cc["@mozilla.org/network/async-stream-c...

nsIChannel
if a charset parameter is given, then its value will replace the the contentcharset attribute of the channel. the stripped contenttype will be lowercased. any implementation of nsichannel must follow these rules. notificationcallbacks nsiinterfacerequestor the notification callbacks for the channel. ...
... when the channel is done, it must not continue holding references to this object. note: a channel implementation should take care when "caching" an interface pointer queried from its notification callbacks. ...
... not required to implement this method. moreover, since this method may block the calling thread, it should not be called on a thread that processes ui events. like any other nsichannel method it must not be called on any thread other than the xpcom main thread. nsiinputstream open(); parameters none. return value blocking input stream to the channel's data. exceptions thrown ns_error_in_progress if the channel is reopened. see also nsichanneleventsink for onchannelredirect ...

nsITransportEventSink
netwerk/base/public/nsitransport.idlscriptable implemented by clients that wish to receive transport events. inherits from: nsisupports last changed in gecko 1.7 method overview void ontransportstatus(in nsitransport atransport, in nsresult astatus, in unsigned long long aprogress, in unsigned long long aprogressmax); methods ontransportstatus() transport status notification. ...
...ransport events. inherits from: nsisupports last changed in gecko 1.7 method overview void ontransportstatus(in nsitransport atransport, in nsresult astatus, in unsigned long long aprogress, in unsigned long long aprogressmax); methods ontransportstatus() transport status notification. void ontransportstatus( in nsitransport atransport, in nsresult astatus, in unsigned long long aprogress, in unsigned long long aprogressmax ); parameters atransport the transport sending this status notification. astatus the transport status (resolvable to a string using nsierrorservice). ...
...t status notification. void ontransportstatus( in nsitransport atransport, in nsresult astatus, in unsigned long long aprogress, in unsigned long long aprogressmax ); parameters atransport the transport sending this status notification. astatus the transport status (resolvable to a string using nsierrorservice). see nsisockettransport for socket specific status codes and more comments. aprogress the amount of data either read or written depending on the value of the status code. this value is relative to aprogressmax. aprogressmax the maximum amount of data that will be read or written. if unknown, 0xffffffff will be passed. see also nsitransport nsisockettransport ...

nsIWebBrowser
object before creating the browser window via the browser's nsibasewindow interface. the chrome object must also implement nsiembeddingsitewindow. the chrome may optionally implement nsiinterfacerequestor, nsiwebbrowserchromefocus, nsicontextmenulistener and nsitooltiplistener to receive additional notifications from the browser object. the chrome object may optionally implement nsiwebprogresslistener instead of explicitly calling addwebbrowserlistener() and removewebbrowserlistener() to register a progress listener object. if the implementation does this, it must also implement nsiweakreference. note: the implementation should not refcount the supplied chrome object; it should assume that a non nsnull value is always valid. the embedder must explicitly set this value back to nsnul...
...dder should explicitly set this value back to null if the parent content listener is destroyed before the browser object. methods addwebbrowserlistener() registers a listener of the type specified by the iid to receive callbacks. the browser stores a weak reference to the listener to avoid any circular dependencies. typically this method will be called to register an object to receive nsiwebprogresslistener or nsishistorylistener notifications in which case the the iid is that of the interface. void addwebbrowserlistener( in nsiweakreference alistener, in nsiidref aiid ); parameters alistener the listener to be added. aiid the iid of the interface that will be called on the listener as appropriate. return value ns_ok listener was successfully added. ns_err...
...as successfully added. ...

Streams - Plugins
stream, which is valid until the stream is destroyed. the seekable parameter specifies whether the stream is seekable (true) or not (false). seekable streams support random access (for example, local files or http servers that support byte-range requests). the plug-in can set the output parameter type to one of these transmission modes: np_normal: (default): the plug-in can process the data progressively as it arrives from the network or file system through a series of calls to npp_writeready and npp_write. np_asfileonly: this plug-in gets full random access to the data using platform-specific file operations. the browser saves stream data to a local file, and, when the stream is complete, delivers the path of the file through a call to npp_streamasfile. np_asfile: this mode is like np_asf...
...p_writeready to determine the maximum number of bytes that the plug-in can consume. this function allows the browser to send only as much data to the instance as it can handle at one time, and it helps both the browser and the plug-in to use their resources efficiently. after a call to npp_newstream, in which the plug-in requested a normal-mode stream, the browser delivers the data in the stream progressively in a series of calls to npp_writeready and npp_write. the browser calls npp_writeready before each call to npp_write. the value returned by npp_writeready indicates how many bytes the plug-in instance can accept for this stream. if the plug-in allocates memory for the entire stream at once, it can return a large number. this number tells the browser that it can pass as much data to the inst...
...p_write. int32 npp_writeready(npp instance, npstream *stream); the instance parameter is the current plug-in instance; the stream parameter specifies the current stream. writing the stream to the plug-in the next step is to write the data to a plug-in from a stream. after a call to npp_newstream, in which the plug-in requested a normal-mode stream, the browser delivers the data in the stream progressively in a series of calls to npp_writeready and npp_write. the npp_write function should return the number of bytes consumed by the instance. if this is a negative number, the browser calls npp_destroystream to destroy the stream. if the number returned is smaller than the size of the buffer, the browser sends the remaining data in the buffer to the plug-in through repeated calls to npp_writerea...

Using files from web applications - Web APIs
s uploading the corresponding file. handling the upload process for a file the fileupload function accepts two inputs: an image element and a file from which to read the image data. ...
... the xmlhttprequest's upload load even...
...-binary'); reader.onload = function(evt) { xhr.send(evt.target.result); }; reader.readasbinarystring(file); } the fileupload() function shown above creates a throbber, which is used to display progress information, and then creates an xmlhttprequest to handle uploading the data. before actually transferring the data, several preparatory steps are taken: the xmlhttprequest's upload progress listener is set to update the throbber with new percentage information so that as the upload progresses the throbber will be updated based on the latest information. the xmlhttprequest's upload load event handler is set to update the throbber progress information to 100% to ensure the progress indicator actually reaches 100% (in case of granularity quirks during the process). it then removes the...

window.cancelAnimationFrame() - Web APIs
onframe || window.mozrequestanimationframe || window.webkitrequestanimationframe || window.msrequestanimationframe; var cancelanimationframe = window.cancelanimationframe || window.mozcancelanimationframe; var start = window.mozanimationstarttime; // only supported in ff. other browsers can use something like date.now(). ...
... window.webkitrequestanimationframe || window.msrequestanimationframe; var cancelanimationframe = window.cancelanimationframe || window.mozcancelanimationframe; var start = window.mozanimationstarttime; // only supported in ff. other browsers can use something like date.now(). ...
...uestanimationframe || window.msrequestanimationframe; var cancelanimationframe = window.cancelanimationframe || window.mozcancelanimationframe; var start = window.mozanimationstarttime; // only supported in ff. other browsers can use something like date.now(). ...

Using the aria-valuemax attribute - Accessibility
if the aria-valuenow has a known maximum and minimum, the author should provide properties for aria-valuemax and aria-valuemin. the value of aria-valuemax must be greater than or equal to the value of aria-valuemin. aria-valuemax is a required attribute of role slider, scrollbar and spinbutton. ...
...e handled by the assistive technology. note: opinions may differ on how assistive technology should handle this technique. the information provided above is one of those opinions and therefore not normative. examples example 1: the snippet below shows a simple slider with a maximum value of 10. ...
...ogy should handle this technique. the information provided above is one of those opinions and therefore not normative. examples example 1: the snippet below shows a simple slider with a maximum value of 10. ...

Using the aria-valuemin attribute - Accessibility
if the aria-valuenow has a known maximum and minimum, the author should provide properties for aria-valuemax and aria-valuemin.the value of aria-valuemin must be less than or equal to the value of aria-valuemax. aria-valuemin is a required attribute of role slider, scrollbar and spinbutton. ...
...be handled by the assistive technology. note: opinions may differ on how assistive technology should handle this technique. the information provided above is one of those opinions and therefore not normative. examples example 1: the snippet below shows a simple slider with a minimum value of 1. ...
...logy should handle this technique. the information provided above is one of those opinions and therefore not normative. examples example 1: the snippet below shows a simple slider with a minimum value of 1. ...

ARIA Test Cases - Accessibility
sults: at firefox ie opera safari jaws 9 - - n/a n/a jaws 10 - - - - voiceover (leopard) n/a n/a - fail window-eyes - - - - nvda - n/a - - zoom (leopard) pass n/a pass pass zoomtext - - - - orca - - - - progressbar dojo nightly build progress bar in "off" live region progressbar in "assertive" live region expected at behavior: the progress updates should be treated as the screen reader treats any progress updates. the live region markup should not affect how the progress updates are presented. (al) if the screen reader provides a keystroke to announce the current progress, this should work wit...
...o nightly build progress bar in "off" live region progressbar in "assertive" live region expected at behavior: the progress updates should be treated as the screen reader treats any progress updates. the live region markup should not affect how the progress updates are presented. (al) if the screen reader provides a keystroke to announce the current progress, this should work with an aria progressbar as well. jaws - jaws announces the level of progress at each time interval the user selects in jaws configuration. ...
...ated as the screen reader treats any progress updates. the live region markup should not affect how the progress updates are presented. (al) if the screen reader provides a keystroke to announce the current progress, this should work with an aria progressbar as well. jaws - jaws announces the level of progress at each time interval the user selects in jaws configuration. ...

scan - CSS: Cascading Style Sheets
this context does not refer to an image scanner, such as one used to digitize a photograph. rather, it means the process by which an image is painted onto a television screen (or other device). syntax the scan feature is specified as a single keyword value chosen from the list below. interlace the device draws odd lines and even lines alternately. some televisions use interlaced scanning. ...
... a photograph. rather, it means the process by which an image is painted onto a television screen (or other device). syntax the scan feature is specified as a single keyword value chosen from the list below. interlace the device draws odd lines and even lines alternately. some televisions use interlaced scanning. progressive the device draws all lines in sequence. all computer screens use progressive scanning. ...
...ified as a single keyword value chosen from the list below. interlace the device draws odd lines and even lines alternately. some televisions use interlaced scanning. progressive the device draws all lines in sequence. all computer screens use progressive scanning. examples html <p>if your screen uses interlaced rendering, this text should be in a sans-serif font. if your screen uses progressive scanning, you should see a serif font.</p> css p { font-family: cursive; } @media (scan: interlace) { p { font-family: sans-serif; } } @media (scan: progressive) { p { font-family: serif; } } result specifications specification status comment media queries level 4the definition of 'scan' in that specification. candidate recommendati...

Mozilla CSS extensions - CSS: Cascading Style Sheets
o menuseparator -moz-mac-unified-toolbar -moz-win-borderless-glass -moz-win-browsertabbar-toolbox -moz-win-communications-toolbox -moz-win-glass -moz-win-media-toolbox -moz-window-button-box -moz-window-button-box-maximized -moz-window-button-close -moz-window-button-maximize -moz-window-button-minimize -moz-window-button-restore -moz-window-titlebar -moz-window-titlebar-maximized progressbar progresschunk radio radio-container radio-label radiomenuitem resizer resizerpanel scale-horizontal scalethumb-horizontal scalethumb-vertical scale-vertical scrollbarbutton-down scrollbarbutton-left scrollbarbutton-right scrollbarbutton-up scrollbar-small scrollbarthumb-horizontal scrollbarthumb-vertical scrollbartrack-horizontal scrollbartrack-vertical separator spinner ...
...t-node :-moz-list-bullet :-moz-list-number :-moz-loading :-moz-locale-dir(ltr) :-moz-locale-dir(rtl) :-moz-lwtheme :-moz-lwtheme-brighttext :-moz-lwtheme-darktext n – r :-moz-native-anonymous :-moz-only-whitespace ::-moz-page ::-moz-page-sequence ::-moz-pagebreak ::-moz-pagecontent :-moz-placeholderobsolete since gecko 51 ::-moz-placeholderdeprecated since gecko 51 ::-moz-progress-bar ::-moz-range-progress ::-moz-range-thumb ::-moz-range-track :-moz-read-only :-moz-read-write s ::-moz-scrolled-canvas ::-moz-scrolled-content ::-moz-scrolled-page-sequence ::-moz-selectiondeprecated since gecko 62 :-moz-submit-invalid :-moz-suppressed ::-moz-svg-foreign-content t ::-moz-table ::-moz-table-cell ::-moz-table-column ::-moz-table-column-group ::-moz-t...
...-moz-suppressed ::-moz-svg-foreign-content t ::-moz-table ::-moz-table-cell ::-moz-table-column ::-moz-table-column-group ::-moz-table-outer ::-moz-table-row ::-moz-table-row-group :-moz-tree-cell :-moz-tree-cell-text :-moz-tree-cell-text(hover) :-moz-tree-checkbox :-moz-tree-column :-moz-tree-drop-feedback :-moz-tree-image :-moz-tree-indentation :-moz-tree-line :-moz-tree-progressmeter :-moz-tree-row :-moz-tree-row(hover) :-moz-tree-separator :-moz-tree-twisty u – x :-moz-ui-invalid :-moz-ui-valid :-moz-user-disabled ::-moz-viewport ::-moz-viewport-scroll :-moz-window-inactive ::-moz-xul-anonymous-block at-rules @-moz-document media features -moz-mac-graphite-theme -moz-maemo-classic -moz-device-pixel-ratio -moz-os-version -moz-scrollba...

cursor - CSS: Cascading Style Sheets
eyword value if no images could be loaded (or if none were specified). each <url> may be optionally followed by a pair of space-separated numbers, which represent <x><y> coordinates. these will set the cursor's hotspot, relative to the top-left corner of the image. for example, this specifies two images using <url> values, providing <x><y> coordinates for the second one, and falling back to the progress keyword value if neither image can be loaded: cursor: url(one.svg), url(two.svg) 5 5, progress; values <url> a url(…) or a comma separated list url(…), url(…), …, pointing to an image file. more than one <url> may be provided as fallbacks, in case some cursor image types are not supported. a non-url fallback (one or more of the keyword values) must be at the end of the fallback list...
... default the platform-dependent default cursor. typically an arrow. none no cursor is rendered. links & status context-menu a context menu is available. help help information is available. pointer the cursor is a pointer that indicates a link. typically an image of a pointing hand. progress the program is busy in the background, but the user can still interact with the interface (in contrast to wait). wait the program is busy, and the user can't interact with the interface (in contrast to progress). sometimes an image of an hourglass or a watch. selection cell the table cell or set of cells can be selected. crosshair...
...e range supported by the browser will generally just be ignored. check the browser compatibility table for any notes on cursor size limits. ...

HTML attribute reference - HTML: Hypertext Markup Language
icon) to present for the enter key on virtual keyboards. the attribute can be used with form controls (such as the value of textarea elements), or in elements in an editing host (e.g., using contenteditable attribute). for <label>, <output> describes elements which belongs to this one. form <button>, <fieldset>, <input>, <keygen>, <label>, <meter>, <object>, <output>, <progress>, <select>, <textarea> indicates the form that is the owner of the element. formaction <input>, <button> indicates the action of the element, overriding the action defined in the <form>. formenctype <button>, <input> if the button/input is a submit button (type="submit"), this attribute sets the encoding type to use during form submission. if this attribute is spe...
...op <audio>, <bgsound>, <marquee>, <video> indicates whether the media should start playing from the start when it's finished. low <meter> indicates the upper bound of the lower range. manifest <html> specifies the url of the document's cache manifest. note: this attribute is obsolete, use <link rel="manifest"> instead. max <input>, <meter>, <progress> indicates the maximum value allowed. maxlength <input>, <textarea> defines the maximum number of characters allowed in the element. minlength <input>, <textarea> defines the minimum number of characters allowed in the element. media <a>, <area>, <link>, <source>, <style> specifies a hint of the media for which the linked resource was designed. ...
...attribute values and the values of its text node children are to be translated when the page is localized, or whether to leave them unchanged. type <button>, <input>, <command>, <embed>, <object>, <script>, <source>, <style>, <menu> defines the type of the element. usemap <img>, <input>, <object> value <button>, <data>, <input>, <li>, <meter>, <option>, <progress>, <param> defines a default value which will be displayed in the element on page load. width <canvas>, <embed>, <iframe>, <img>, <input>, <object>, <video> for the elements listed here, this establishes the element's width. note: for all other instances, such as <div>, this is a legacy attribute, in which case the css width property should be used instead. ...

HTTP Index - HTTP
f the information is available to sites the browser connects to as well. 12 browser detection using the user agent compatibility, http, web development serving different web pages or services to different browsers is usually a bad idea. the web is meant to be accessible to everyone, regardless of which browser or device they're using. there are ways to develop your website to progressively enhance itself based on the availability of features rather than by targeting specific browsers. 13 compression in http guide, http, compression compression is an important way to increase the performance of a web site. for some documents, size reduction of up to 70% lowers the bandwidth capacity needs. over the years, algorithms also got more efficient, and new ones are...
...ks to the resource (in 'seo-speak', it is said that the 'link-juice' is not sent to the new url). 231 303 see other http, http status code, reference, redirects the hypertext transfer protocol (http) 303 see other redirect status response code indicates that the redirects don't link to the newly uploaded resources, but to another page (such as a confirmation page or an upload progress page). this response code is usually sent back as a result of put or post. the method used to display this redirected page is always get. 232 304 not modified http, redirection, reference, status code the http 304 not modified client redirection response code indicates that there is no need to retransmit the requested resources. it is an implicit redirection to a cached resou...
... also known as url forwarding, is a technique to give a page, a form, or a whole web application, more than one url address. http provides a special kind of response, called http redirect, to perform this operation and is used for numerous goals: temporary redirection while site maintenance is ongoing, permanent redirection to keep external links working after a change of the site's architecture, progress pages when uploading a file, and so on. 276 resources and uris http, mime, mime type, overview, type, uri, uris, url, resources, urls http allows a browser, or another user agent, to a communicate with different resources on internet: to do this the browser needs both the identity and the location of the resources. these two bits of information are described by a uri. ...

Redirections in HTTP - HTTP
also known as url forwarding, is a technique to give more than one url address to a page, a form, or a whole web site/application. http has a special kind of response, called a http redirect, for this operation. redirects accomplish numerous goals: temporary redirects during site maintenance or downtime permanent redirects to preserve existing links/bookmarks after changing the site's urls, progress pages when uploading a file, etc. principle in http, redirection is triggered by a server sending a special redirect response to a request. redirect responses have status codes that start with 3, and a location header holding the url to redirect to. when browsers receive a redirect, they immediately load the new url provided in the location header. besides the small performance hit of an addi...
...ing non-get methods. temporary redirections sometimes the requested resource can't be accessed from its canonical location, but it can be accessed from another place. in this case, a temporary redirect can be used. search engine robots and other crawlers don't memorize the new, temporary url. temporary redirections are also used when creating, updating, or deleting resources, to show temporary progress pages. code text method handling typical use case 302 found get methods unchanged. others may or may not be changed to get.[2] the web page is temporarily unavailable for unforeseen reasons. 303 see other get methods unchanged. others changed to get (body lost). used to redirect after a put or a post, so that refreshing the result...
...oad button is pressed, only that page is redisplayed, without replaying the unsafe requests. temporary responses to long requests some requests may need more time on the server, like delete requests that are scheduled for later processing. in this case, the response is a 303 (see other) redirect that links to a page indicating that the action has been scheduled, and eventually informs about its progress, or allows to cancel it. configuring redirects in common servers apache redirects can be set either in the server config file or in the .htaccess of each directory. the mod_alias module has redirect and redirectmatch directives that set up 302 redirects by default: <virtualhost *:443> servername example.com redirect / https://www.example.com </virtualhost> the url https://example.com/ wi...

Handling media support issues in web content - Web media technologies
milar concept can be applied to still images; if an image you wish to present is very large and may take time to download (especially for slower devices or connections), you can offer a lower-resolution or alternate version that will be displayed until the full-quality version is available to be displayed. we'll look at both of these scenarios and how to implement them. poster frames for video progressive images images—whether embedded using <img> or <picture>—don't support a concept similar to poster frames. however, there are ways to present an image in low quality while it's still loading. this requires creating your images using progressive formats, such as progressive jpeg or interlaced png. once your image has been converted to progressive form, you can simply use it as usual. <img...
...edded using <img> or <picture>—don't support a concept similar to poster frames. however, there are ways to present an image in low quality while it's still loading. this requires creating your images using progressive formats, such as progressive jpeg or interlaced png. once your image has been converted to progressive form, you can simply use it as usual. ...
.... however, there are ways to present an image in low quality while it's still loading. this requires creating your images using progressive formats, such as progressive jpeg or interlaced png. once your image has been converted to progressive form, you can simply use it as usual. <img src="/images/stafff-photo-huge-progressive.jpg" alt="staff photo, taken in january of 1972"> when using a progressive image, the data is stored in such a way that the browser is able to render a low-quality representation of the image as soon as possible, then update the image as it loads—or after it's finished loading—to present it in full quality. note: progressive (or interlaced) images are inherently slightly larger than the non-progressive versions of the same images. whether the interlacing will b...

places/bookmarks - Archive of obsolete content
ects, referred to as bookmark items, in the bookmarks database in firefox two additional functions, save() to create, update, and remove bookmark items, and search() to retrieve the bookmark items that match a particular set of criteria. save() and search() are both asynchronous functions: they synchronously return a placesemitter object, which then asynchronously emits events as the operation progresses and completes. each retrieved bookmark item represents only a snapshot of state at a specific time. the module does not automatically sync up a bookmark instance with ongoing changes to that item in the database from the same add-on, other add-ons, or the user. examples creating a new bookmark let { bookmark, save } = require("sdk/places/bookmarks"); // create a new bookmark instance, unsa...
...from the server as `saved` (with properties // such as `updated` and `id`), as well as the initial input // item as `inputitem` console.log(saved.title === inputitem.title); // true console.log(saved !== inputitem); // true console.log(inputitem === bookmark); // true }).on("end", function (saveditems, inputitems) { // similar to "data" events, except "end" is an aggregate of // all progress events, with ordered arrays as `saveditems` // and `inputitems` }); creating several bookmarks with a new group let { bookmark, group, save } = require("sdk/places/bookmarks"); let group = group({ title: "guitars" }); let bookmarks = [ bookmark({ title: "ran", url: "http://ranguitars.com", group: group }), bookmark({ title: "ibanez", url: "http://ibanez.com", group: group }), bookmark(...

On page load - Archive of obsolete content
this article is for xul/javascript developers who want to have custom code executed each time a new page is loaded in browser/mail. if you need finer control over custom code execution—for example, as documents are loading or when tabs are switched—see progress listeners. progress listeners allow extensions to be notified of events associated with documents loading in the browser and with tab switching events. progress listeners implement the nsiwebprogresslistener interface. creating an overlay first, you need to create an overlay to one (or more, depending on which applications you target) of the following xul documents: application uri to overlay firefox chrome://browser/content/browser.xul thunderbird chrome://messenger/content/messenger.xul ...
... window. // if (win.frameelement) return; // skip iframes/frames alert("page is loaded \n" +doc.location.href); } } window.addeventlistener("load", function load(event){ window.removeeventlistener("load", load, false); //remove listener, no longer needed myextension.init(); },false); references if you need to have a more complicated listener (not just onload), use progress listeners. see also domcontentloaded event in listening to events: simple dom events ...

CSS3 - Archive of obsolete content
and :last-of-type, :only-child and :only-of-type,:empty, and :not. pseudo-elements are now characterized by two colons rather than one: :after becomes ::after, :before becomes ::before, :first-letter becomes ::first-letter, and :first-line becomes ::first-line. the new general sibling combinator ( h1~pre ). the next iteration of the selectors specification is already in progress, though it still hasn't reached the first public working draft stage. media queries recommendation since june 19th, 2012 extends the former media type ( print, screen, … ) to a full language allowing queries on the device media capabilities like only screen and (color) . media queries are not only used in css document but also in some attributes of html elements,...
...r-bottom-right-radius properties. support for the use of an <image> as the border with the css border-image, border-image-source, border-image-slice, border-image-width, border-image-outset, and border-image-repeat properties. support for shadows of the element with the css box-shadow property. the css4 iteration of the backgrounds and borders specification is already in progress, though it still hasn't reached the first public working draft stage, it plans to add the ability to clip a border (with the css border-clip, border-clip-top, border-clip-right, border-clip-bottom, and border-clip-left properties) or to control the shape of the border in a corner (using the css border-corner-shape property). css conditional rules module level 3 candidate recommendati...

Index of archived content - Archive of obsolete content
using xpcom without chrome using third-party modules (jpm) bootstrapped extensions code snippets alerts and notifications autocomplete bookmarks boxes canvas code snippets cookies customizing the download progress bar delayed execution dialogs and prompts downloading files drag & drop embedding svg examples and demos from articles file i/o finding window handles forms related code snippets html in xul for rich tooltips html to dom isdefaultnamespace js ...
...debugger service javascript timers javascript daemons management label and description lookupnamespaceuri lookupprefix miscellaneous modules on page load page loading post data to window preferences progress listeners queryselector rosetta running applications svg animation svg general scrollbar sidebar stringview tabbox toolbar tree uri parsing view source for xul applications windows xml-related code snippet...

In-Depth - Archive of obsolete content
erating system. possible are (this is probably an incomplete list): none - (!important may be needed) will override the operating system default. use this when you want one or two controls to look different from the operating systems defaults. ...
...m. possible are (this is probably an incomplete list): none - (!important may be needed) will override the operating system default. use this when you want one or two controls to look different from the operating systems defaults. ...

Download Manager improvements in Firefox 3 - Archive of obsolete content
firefox 3 offers improvements to the download manager that allow multiple progress listeners, use of the storage api for data management, download resuming, and more. in addition, you can augment or replace the download manager's user interface by implementing the new nsidownloadmanagerui interface. note: these changes will require some modest revisions to code using the download manager; several methods have had minor changes. download manager interfaces nsidownloadmanager gives applications and extensions access to the download manager, allowing them to add and remove files to the download list, retrieve information about past and present downloads, and request notifications as to the progress of downloads. nsidownload describes a file in the download queue; these...
...ns access to the download manager, allowing them to add and remove files to the download list, retrieve information about past and present downloads, and request notifications as to the progress of downloads. nsidownload describes a file in the download queue; these files may currently be queued for download, actively being downloaded, or finished being downloaded. nsidownloadprogresslistener applications and extensions implement this interface to be made aware of changes in the status of downloads. nsidownloadmanagerui implement this interface to replace or augment the download manager user interface. other download manager documentation download manager preferences this article lists preferences used by the download manager as well as th...

HTTP Class Overview - Archive of obsolete content
implementation. it's meant as a guide to developers wishing to understand or extend the mozilla http implementation. ...
...rences owns the authentication cache holds references to frequently used services nshttpchannel implements nsihttpchannel talks to the cache initiates http transactions processes http response codes intercepts progress notifications nshttpconnection implements nsistreamlistener & nsistreamprovider talks to the socket transport service feeds data to its transaction object routes progress notifications nshttpconnectioninfo identifies a connection nshttptransaction implements nsirequest encapsulates a http request and response parses incoming data nshttpchunkeddecoder owned by a transaction strips chunked transfer encoding nshttprequesthead owns a nshttpheaderarray knows how to fill a request buffer nshttpresponsehead owns a nshttpheaderarray knows how...

Monitoring downloads - Archive of obsolete content
nnection method close() is being added to firefox 3 alpha 8; in prior versions of firefox, there is no way to explicitly close the database. instead, it is closed when the garbage collector disposes of the connection object. handling download state changes once the code above is run, our ondownloadstatechange() method is called whenever a download's state changes. this is part of the nsidownloadprogresslistener interface. that code looks like this: ondownloadstatechange: function(astate, adownload) { var statement; switch(adownload.state) { case components.interfaces.nsidownloadmanager.download_downloading: // add a new row for the download being started; each row includes the // source uri, size, and start time. the end time and download speed // are both s...
...he fly, instead of generating a static list when it's first opened. add additional statistics. what's the average download speed across all downloads? what times of day do you get the best download performance? add buttons to delete items from the log, or to delete all items that have finished downloading. add searching. see also storage, nsidownloadmanager, nsidownload, nsidownloadprogresslistener ...

The Download Manager schema - Archive of obsolete content
the table is kept in a database file named "downloads.sqlite", in a table called "moz_downloads". the current database schema version is 8. this information is available using nsidownloadmanager methods to retrieve nsidownload objects for each download entry; however, if you feel like poking directly into the table, you can do so using the storage api. the schema table field name type description id integer a unique id for the download. this field is the primary key for the table. name text the download's file name. ...
.... ...

treecol.type - Archive of obsolete content
this is used in mozilla's download manager window. text the content of the columns is text. if you are using type="checkbox", then the tree and each treecol must be editable. you need to apply css to make the checkbox toggle. ...
...this is used in mozilla's download manager window. text the content of the columns is text. if you are using type="checkbox", then the tree and each treecol must be editable. you need to apply css to make the checkbox toggle. ...

Methods - Archive of obsolete content
« xul reference home acceptdialog additemtoselection addpane addprogresslistener addsession addtab addtabsprogresslistener advance advanceselectedtab appendcustomtoolbar appendgroup appenditem appendnotification blur cancel canceldialog centerwindowonscreen checkadjacentelement clearresults clearselection click close collapsetoolbar contains decrease decreasepage docommand ensureelementisvisible ensureindexisvisible ensureselectedelementisvisible expandtoolbar extra1 extra2 focus getbrowseratindex getbrowserfordocument getbrowserfortab getbrowserindexfordocument getbutton getdefaultsession geteditor getelementsbyattribute getelementsbyattributens getformattedstring gethtmleditor getindexoffirstvis...
... moveto movetoalertposition onsearchcomplete ontextentered ontextreverted openpopup openpopupatscreen opensubdialog openwindow preferenceforelement reload reloadalltabs reloadtab reloadwithflags removeallitems removeallnotifications removealltabsbut removecurrentnotification removecurrenttab removeitemat removeitemfromselection removenotification removeprogresslistener removesession removetab removetabsprogresslistener removetransientnotifications replacegroup reset rewind scrollbyindex scrollbypixels scrolltoindex select selectall selectitem selectitemrange selecttabatindex setselectionrange showpane showpopup sizeto startediting stop stopediting swapdocshells syncsessions timedselect toggleitemselect...

Building Trees - Archive of obsolete content
el="?date"/> </treerow> </treeitem> </treechildren> </action> </template> </tree> features of the tree builder besides the label of a cell, there are several other cell properties you can set when using the tree builder. the supported properties are: label, mode, properties, src and value. the label attribute is used to set the label for a cell. ...
...> </action> </template> </tree> features of the tree builder besides the label of a cell, there are several other cell properties you can set when using the tree builder. the supported properties are: label, mode, properties, src and value. the label attribute is used to set the label for a cell. the mode is used for progress meter columns. it may be set to either “normal” for a normal progress meter or “undetermined” for an undetermined progress meter. the value attribute is used to set the current progress value for normal progress meters. the value attribute may also be used for checkbox columns by setting it to either true or false. whether a cell is a normal labeled value, a progress meter or a checkbox is determined by the type attribute on the column the cell is in. for cells...

Adding Style Sheets - Archive of obsolete content
earchmode"> <menupopup> <menuitem label="is"/> <menuitem label="is not"/> </menupopup> </menulist> <spacer class="springspace"/> <menulist id="find-text" flex="1" editable="true" datasources="file:///mozilla/recents.rdf" ref="http://www.xulplanet.com/rdf/recent/all"/> ... <spacer class="titlespace"/> <hbox> <progressmeter id="progmeter" value="50%" style="display:none;"/> the new xml-stylesheet line is used to import the style sheet. it will contain the styles instead of having them directly in the xul file. you can include any number of style sheets in a similar way. here the style sheet is placed in the same directory as findfile.xul. some of the styles in the code above have been removed. one that was...
...le="display:none;"/> the new xml-stylesheet line is used to import the style sheet. it will contain the styles instead of having them directly in the xul file. you can include any number of style sheets in a similar way. here the style sheet is placed in the same directory as findfile.xul. some of the styles in the code above have been removed. one that wasn't was the display property on the progressmeter. this will be changed by a script so it was left in, as it doesn't really make sense to have the progress bar visible initially. you could still put this in a separate style sheet if you really wanted to. a class was added to the spacers so that they can be referred to. a style sheet also needs to be created. create a file findfile.css in the same directory as the xul file. (it would norma...

Styling a Tree - Archive of obsolete content
. you can set the image with the list-style-image property. ::-moz-tree-row: a row. use this to set the background color of a row. ::-moz-tree-indentation: the indentation to the left of rows that are children of other rows. ::-moz-tree-column: a column. ::-moz-tree-line: the lines that are drawn to connect child rows to parent rows. ::-moz-tree-separator: a separator in a tree. ::-moz-tree-progressmeter: content for progressmeter cells. you can create a progressmeter column by setting the type attribute on the column to progressmeter. ::-moz-tree-drop-feedback: the drag and drop feedback. ::-moz-tree-checkbox: the image to use for checkbox columns. you can check for multiple properties by separating them with commas. the example below sets the background color to grey for rows that have...
...ing dragged. dropon if a drag is occuring over the tree, this property is set for the row currently being dragged over, as long as the mouse pointer is hovering over the row. dropbefore this property is set if the mouse pointer is hovering before the row currently being dragged over. dropafter this property is set if the mouse pointer is hovering after the row currently being dragged over. progressnormal this property is set for progress meter cells. progressundetermined this property is set for undeterminate progress meter cells. progressnone this property is set for non-progress meter cells. the properties are set for rows or cells in rows with the necessary state. for columns and cells, one additional property, the id of the column or column the cell is in will be set. setting pr...

XULBrowserWindow - Archive of obsolete content
see the linked interfaces for the definition of the implemented methods. you may also wish to refer to the implementation of xulbrowserwindow in browser/base/content/browser.js. ...
...see the linked interfaces for the definition of the implemented methods. you may also wish to refer to the implementation of xulbrowserwindow in browser/base/content/browser.js. ...

XUL Reference - Archive of obsolete content
picker deck description dialog dialogheader dropmarker editor grid grippy groupbox hbox iframe image key keyset label listbox listcell listcol listcols listhead listheader listitem member menu menubar menuitem menulist menupopup menuseparator notification notificationbox observes overlay page panel param popupset preference preferences prefpane prefwindow progressmeter query queryset radio radiogroup resizer richlistbox richlistitem row rows rule scale script scrollbar scrollbox scrollcorner separator spacer spinbuttons splitter stack statusbar statusbarpanel stringbundle stringbundleset tab tabbrowser (firefox-only starting with firefox 3/gecko 1.9) tabbox tabpanel tabpanels tabs template textnode textbox textbox (firefox...
...barpanel dialogheader notification notificationbox menubar menu menuitem menuseparator menupopup panel tooltip popupset toolbar toolbarbutton toolbargrippy toolbaritem toolbarpalette toolbarseparator toolbarset toolbarspacer toolbarspring toolbox tabbox tabs tab tabpanels tabpanel groupbox caption separator spacer button checkbox colorpicker datepicker menulist progressmeter radio radiogroup scale splitter textbox textbox (firefox autocomplete) textbox (mozilla autocomplete) timepicker description label image listbox listitem listcell listcol listcols listhead listheader richlistbox richlistitem tree treecell treechildren treecol treecols treeitem treerow treeseparator box hbox vbox bbox deck stack grid columns column rows ...

Archived Mozilla and build documentation - Archive of obsolete content
oadmap comments, ideas, questions and other discussion should be added on the devmo talk:1.0 launch roadmap page. further details on smaller tasks being done are available at user:dria:todo page. see also current events. download manager improvements in firefox 3 firefox 3 offers improvements to the download manager that allow multiple progress listeners, use of the storage api for data management, download resuming, and more. in addition, you can augment or replace the download manager's user interface by implementing the new nsidownloadmanagerui interface. download manager preferences there are several preferences used by the download manager. this article provides a list of them. drag and dro...
...n fixed and auto layout of tables has been introduced. the auto-layout mechanism is implemented in basictablelayoutstrategy.cpp the fixed-layout in fixedtablelayoutstrategy.cpp. all these files are in the layout/html/table/src subdirectory. tamarin the download manager schema the download manager uses an sqlite table to keep track of downloads in progress as well as queued and past downloads. the life of an html http request the new nsstring class implementation (1999) this document is intended to briefly describe the new nsstring class architecture, and discuss the implications on memory management, optimizations, internationalization and usage patterns. tracevis tracevis is a performance...

::-ms-fill - Archive of obsolete content
the ::-ms-fill css pseudo-element is a microsoft extension that represents a progress bar displayed by <progress>. this pseudo-element is available only in internet explorer 10, internet explorer 11, and microsoft edge. all allowable properties except animation-name apply to a determinate progress bar. only animation-name applies to an indeterminate one. (a progress bar is determinate if it has a value attribute set; otherwise it is indeterminate. an indeterminate progress bar can be selected with the :indeterminate pseudo-class.) by default, internet explorer and edge display a moving dots animation for an indeterminate progress bar. by setting animation-name on ::-ms-fill, you can change the animation, as shown in this table: value description none turns off...
... background-repeat, and background-size border border-radius box-shadow box-sizing color cursor display (values block, inline-block, none) font height margin -ms-background-position-x -ms-background-position-y -ms-high-contrast-adjust opacity outline-color, outline-style, and outline-width padding transform and transform-origin visibility syntax ::-ms-fill example html <progress value="10" max="50"></progress> css progress::-ms-fill { background-color: orange; } result a progress bar using this style might look something like this: ...

Anatomy of a video game - Game development
ed scene resulting from that input. the game loop is advanced by the user's input and sleeps until they provide it. this is more of a turn-based approach that doesn't demand a constant update every frame, only when the player reacts. other games demand control over each of the smallest possible individual timeslices. the same principles as above apply with a slight twist: each frame of animation progresses the cycle and any change in user input is caught at the first available turn. this once-per-frame model is implemented in something called a main loop. if your game loops based on time then this will be its authority that your simulations will adhere to. but it might not need per-frame control. your game loop might be similar to the find the differences example and base itself on input events.
...be more subtle than that. you could draw every pixel individually on a canvas or you could layer dom elements (including multiple webgl canvases with transparent backgrounds if you want) into a complex hierarchy. each of these paths will lead to different opportunities and constraints. it is decision... time you will need to make hard decisions about your main loop: how to simulate the accurate progress of time. if you demand per-frame control then you will need to determine how frequently your game will update and draw. you might even want update and draw to occur at different rates. you will also need to consider how gracefully your game will fail if the user's system cannot keep up with the workload. let us start by assuming that you will handle user input and update the game state every time...

Game promotion - Game development
g related to your gamedev activities. write about your development process, nasty bugs you encounter, funny stories, lessons learned, and the ups and downs of being a game developer. continually publishing information about your games will help educate others, increase your reputation in the community, and further improve seo. a further option is to publish monthly reports that summarize all your progress — it helps you see what you've accomplished throughout the month and what's still left to do, and it keeps reminding people that your game is coming out soon — building buzz is always good. while you can create your website from scratch, there are also tools that can help make the process easier. manakeep is a website builder made for indie game developers and provides a great starting poin...
...-app purchases instead, promoting your game across free portals can be effective. you can send your games for publication on portals like crazygames.com, gamedistribution.com, lagged.com, pacogames.com ,games4html5.com or html5games.com, and there are about 20-30 other notable game portals with and without api. those portals that have their own api will allow you to authorize users, save their progress and process in-app purchases. you can also sell a full version of the game from inside your browser demo version, which will be a great move considering high competition, some developers even manage to make full browser versions. most portals offer revenue share deals or will buy non exclusive license. free portals offer traffic, but only the best ones are popular enough to generate revenues fro...

2D maze game with device orientation - Game development
rue; this.game.scale.pagealignvertically = true; this.game.state.start('preloader'); } }; the main ball object is defined and we're adding two variables called _width and _height that are the width and the height of the game canvas — they will help us position the elements on the screen. we're loading two images first that will be used later in the preload state to show the progress of loading all the other assets. the create function holds some basic configuration: we're setting up the scaling and alignment of the canvas, and moving on to the preload state when everything's ready. preloader.js the preloader state takes care of loading all the assets: ball.preloader = function(game) {}; ball.preloader.prototype = { preload: function() { this.preloadbg = this.a...
... this.load.spritesheet('button-start', 'img/button-start.png', 146, 51); // ... this.load.audio('audio-bounce', ['audio/bounce.ogg', 'audio/bounce.mp3', 'audio/bounce.m4a']); }, create: function() { this.game.state.start('mainmenu'); } }; there are single images, spritesheets and audio files loaded by the framework. in this state the preloadbar is showing the progress on the screen. that progress of the loaded assets is visualized by the framework with the use of one image. with every asset loaded you can see more of the preloadbar image: from 0% to 100%, updated on every frame. after all the assets are loaded, the mainmenu state is launched. mainmenu.js the mainmenu state shows the main menu of the game, where you can start playing by clicking the button. ...

CSS values and units - Learn web development
es have the same html. the only difference is that the first has a class of ems and the second a class of rems. to start with, we set 16px as the font size on the <html> element. to recap, the em unit means "my parent element's font-size" in the case of typography. the <li> elements inside the <ul> with a class of ems take their sizing from their parent. so each successive level of nesting gets progressively larger, as each has its font size set to 1.3em — 1.3 times its parent's font size. to recap, the rem unit means "the root element's font-size". (rem stands for "root em".) the <li> elements inside the <ul> with a class of rems take their sizing from the root element (<html>). this means that each successive level of nesting does not keep getting larger. however, if you change the <html> ...
...nside a wrapper that is 400 pixels wide. the second 200px wide box is the same width as the first one, but the second 40% box is now 40% of 400px — a lot narrower than the first one! try changing the width of the wrapper or the percentage value to see how this works. the next example has font sizes set in percentages. each <li> has a font-size of 80%, therefore the nested list items become progressively smaller as they inherit their sizing from their parent. note that, while many values accept a length or a percentage, there are some that only accept length. you can see which values are accepted on the mdn property reference pages. if the allowed value includes <length-percentage> then you can use a length or a percentage. if the allowed value only includes <length>, it is not possible ...

Supporting older browsers - Learn web development
on of grid layout that is very usable, although different to the modern specification documented on this site. the ie10 and 11 implementations is -ms- prefixed, which means you can use it for these browsers and it will be ignored by non-microsoft browsers. edge does still understand the old syntax, however, so take care that everything is safely overwritten in your modern grid css. the guide to progressive enhancement in grid layout can help you understand the ie version of the grid, and we have included some additional useful links at the end of this lesson. however, unless you have a very high number of visitors in older ie versions, you may find it better to focus on creating a fallback that works for all non-supporting browsers. testing older browsers with the majority of browsers supporti...
...great way to test in old and modern windows browsers even if you are not using a windows computer. summary you now have the knowledge to confidently use techniques such as grid and flexbox, create fallbacks for older browsers, and make use of any new techniques that might come along in the future. ...

CSS property compatibility table for form controls - Learn web development
text-overflow n.a. n.a. text-shadow n.a. n.a. text-transform n.a. n.a. border and background background no[1] no[1] supported, but there is too much inconsistency between browsers to be reliable. ...
... n.a. text-shadow n.a. n.a. text-transform n.a. n.a. border and background background no[1] no[1] supported, but there is too much inconsistency between browsers to be reliable. border-radius no[1] no[1] box-shadow no[1] no[1] meters and progress see the <meter> and <progress> elements: property n t note css box model width yes yes height yes yes border partial yes margin yes yes padding yes partial[1] chrome hides the <progress> and <meter> element when the padding property is applied on a tweaked element. text...

What’s in the head? Metadata in HTML - Learn web development
mozilla developer network. view the page's source (right/ctrl + click on the page, choose view page source from the context menu.) find the description meta tag. ...
...lla.net/static/img/favicon32.e02854fdcf73.png"> the comments explain what each icon is used for — these elements cover things like providing a nice high resolution icon to use when the website is saved to an ipad's home screen. don't worry too much about implementing all these types of icon right now — this is a fairly advanced feature, and you won't be expected to have knowledge of this to progress through the course. the main purpose here is to let you know what such things are, in case you come across them while browsing other websites' source code. note: if your site uses a content security policy (csp) to enhance its security, the policy applies to the favicon. if you encounter problems with the favicon not loading, verify that the content-security-policy header's img-src directive is...

Aprender y obtener ayuda - Learn web development
it is great that you are putting some time into learning a new set of skills, but there are good practices to employ that will make your learning more effective. there are also are times when you'll get stuck and feel frustrated — even professional web developers feel like this regularly — and it pays to know about the most effective ways to try and get help so you can progress in your work. this article provides some hints and tips in both of these areas that will help you get more out of learning web development, as well as further reading so you can find out more information about each sub-topic should you wish.. effective learning let's move straight on and think about effective learning. different learning methods it is interesting to consider that there are two main ways in which yo...
...u should keep a record of what you manage to do each week in a simple spreadsheet or even in a notebook! also, it might be a good idea to have some sub-goals worked out to allow you to keep track of where you are more easily, for example: html and css basics learnt by summer javascript basics learnt by december example website project built by next april etc. keep thinking about how much progress you are making, and adjust your plan if needs be. staying motivated it is hard to stay motivated, especially if you are trying to learn a complex skill like programming or web development. what follows are some tips to stay motivated and keep working: try to make your work environment as productive as possible. try to get a comfortable desk and chair to work in, make sure you have enough lig...

Multimedia: Images - Learn web development
r pixel which makes the transparency borders appear hard and jagged. the size is small but the price is visual fidelity. a good online tool for optimizing svgs is svgomg. for pngs there is imageoptim online or squoosh. with photographic motifs that do not feature transparency there is a lot wider range of formats to chose from. if you want to play it safe, then you would go for well compressed progressive jpegs. progressive jpegs, in contrast to normal jpegs, render progressively (hence the name), meaning the user sees a low-resolution version that gains clarity as the image downloads, rather than the image loading at full resolution top-to-bottom or even only rendering once completely downloaded. a good compressor for these would be mozjpeg, e.g. available to use in the online image optimizati...
...hese would be mozjpeg, e.g. available to use in the online image optimization tool squoosh. a quality setting of 75% should yield decent results. other formats improve on jpeg's capabilities in regards to compression, but are not available on every browser: webp — created by google and nowadays supported by all major browsers except safari. supports transparency and also animation, but not progressive display. jpeg-xr — created by microsoft and only available in internet explorer and edgehtml based edge. doesn't support progressive display and the image decoding is not hardware accellerated and therefore resource intensive on the browser's main thread. jpeg2000 — once to be successor to jpeg but only supported in safari. doesn't support progressive display either. in the future bro...

Perceived performance - Learn web development
oaded first. delay, or lazy load, the rest of the assets. don't load images or scripts that aren’t used or visible on the initial page load. either delay their load, loading them when the page becomes usable, or, loading them when they become necessary. loading additional assets and resources after initial page load improves perceived performance. loading essential data in initial requests and progressively loading features and data only as needed helps mitigate low bandwidth and lower spec hardware. additionally, you should optimize the assets you do load. images and video should be served in the most optimal format, compressed, and in the correct size. prevent jumping content and other reflows images or other assets causing content to be pushed down or jump to a different location, like th...
...e visible interactive elements are always interactive and responsive. if input elements are visible, the user should be able to interact with them without a lag. users feel that something is laggy when they take more than 50ms to react. they feel that a page is janky when content repaints slower than 16.67ms (or 60 frames per second) or repaints at uneven intervals. make things like type-ahead a progressive enhancement: use css to display input modal, js to add typeahead/autocomplete as it is available make task initiators appear more interactive making a content request on keydown rather than waiting for keyup can shave 200ms off the perceived load of the content. adding an interesting but unobtrusive 200ms animation to that keyup even can reduce another 200ms of the perceived load. you're not...

TypeScript support in Svelte - Learn web development
pplication, have a look at this troubleshooting/faq section about typescript support. as we said before, typescript is a superset of javascript, so your application will run without modifications. currently you will be running a regular javascript application with typescript support enabled, without taking advantage of any of the features that typescript provides. you can now start adding types progressively. once you have typescript configured, you can start using it from a svelte component by just adding a <script lang='ts'> at the beginning of the script section. to use it from regular javascript files, just change the file extension from .js to .ts. you'll also have to update any corresponding import statements (don't include the .ts in your import statements; typescript chose to omit the e...
... with lots of information to allow them to deliver a friendlier development experience. we'll use visual studio code to do a quick test and see how we can get autocompletion hints and type-checking as we're writing components. note: if you don't wish to use vs code, we also provide instructions for using typescript error checking from the terminal instead, slightly later on. there is work in progress to support typescript in svelte projects in several code editors; the most complete support so far is available in the svelte for vs code extension, which is developed and maintained by the svelte team. this extension offers type checking, inspecting, refactoring, intellisense, hover-information, auto-completion, and other features. this kind of developer assistance is another good reason to star...

Accessibility API cross-reference
the current window pane n/a region or group ? the most common content type in most documents. a paragraph generally encloses distinct portions of content that are not otherwise specified with other block level structure element types such as heading, table or list elements. <p> <p> shows percentage completion for task progressbar progress_bar n/a progressbar page showing properties of something propertypage n/a n/a n/a your average, run-of-the-mill button pushbutton push_button push_button button <button> only one radio button in a group is selectable. aria requires the parent to have role radiogroup radiobutto...
...is the default button or menu item default n/a n/a identifies the element that provides an error message for the object. n/a n/a aria-errormessage an item that has been expanded, such as a tree item or accordion expanded expanded expanded aria-expanded=true indicates this object allows progressive disclosure of its children. n/a expandable expandable implied by the presence of the aria-expanded attribute, regardless of value can extend selection extselectable n/a n/a not clipped to boundary of parent, does not auto-move with parent floating n/a n/a identifies the next element...

Software accessibility: Where are we today?
where are we today? up until this point, the largest driving force behind desktop computing environments has been microsoft, first with ms dos, followed by variants of microsoft windows. these operating systems were not designed with the needs of people with disabilities in mind. many, including those who were blind or physically disabled, were unable to use applications which were written for microsoft operating systems. ...
...h of. each end user has a unique set problems, and in the open source world, providing highly customized solutions can be a business in itself. right now, gui's on linux are mostly not accessible. microsoft windows is still far more accesible. gnome, kde, staroffice, koffice, mozilla and all other gui software packages in linux are unuseable by large numbers of disabled users. there has been some progress with the support of gnome's atk apis in many of these packages, and the development of gok (gnome onscreen keyboard) and gnopernicus (screenreader and magnifier). however, these solutions are not yet truly usable for real disabled end users. what do i need to do? mozilla developers follow the general front-end accessibility requirements: there are a number of potential "gotchas" when devel...

Creating Sandboxed HTTP Connections
} gchannel = null; }, // nsichanneleventsink onchannelredirect: function (aoldchannel, anewchannel, aflags) { // if redirecting, store the new channel gchannel = anewchannel; }, // nsiinterfacerequestor getinterface: function (aiid) { try { return this.queryinterface(aiid); } catch (e) { throw components.results.ns_nointerface; } }, // nsiprogresseventsink (not implementing will cause annoying exceptions) onprogress : function (arequest, acontext, aprogress, aprogressmax) { }, onstatus : function (arequest, acontext, astatus, astatusarg) { }, // nsihttpeventsink (not implementing will cause annoying exceptions) onredirect : function (aoldchannel, anewchannel) { }, // we are faking an xpcom interface, so we need to implement qi ...
...it would be better to have the entire implementat...

Experimental features in Firefox
is preference is enabled, any webgl extensions currently in "draft" status which are being tested are enabled for use. currently, there are no webgl extensions being tested by firefox. webgpu api this new api provides low-level support for performing computation and graphics rendering using the graphics processing unit (gpu) of the user's device or computer. the specification is still a work-in-progress. see bug 1602129 for our progress on this api. release channel version added enabled by default? nightly 73 no developer edition 73 no beta 73 no release 73 no preference name dom.webgpu.enabled html dom api global event: beforeinput the global beforeinput event is sent to an <input> element—or ...
... enabled by default? nightly 60 no developer edition 60 no beta 60 no release 60 no preference name security.mixed_content.upgrade_display_content ftp support disabled for security reasons, mozilla intends to remove support for ftp from firefox in 2020, effective in firefox 82. see bug 1622409 for implementation progress. the network.ftp.enabled preference must be enabled (set to true) to allow ftp to be used. release channel version added enabled by default? nightly 77 yes developer edition 77 no beta 77 no release 77 no preference name network.ftp.enabled developer tools mozilla's developer tools are constantly e...

Limitations of chrome scripts
. the content to check is forwarded as a cpow. the chrome process then checks the content against the policy supplied by the add-on, and forwards the response back to the child to be enforced. to make the shim unnecessary: define and register nsicontentpolicy in the content process. if you need to ensure that the policy is only registered once, use a process script to register the policy. nsiwebprogresslistener this api will work in the chrome process. there is a shim that gives you access to the domwindow property of the nsiwebprogress object passed into onstatechange. however, the domwindow is passed asynchronously, so by the time the chrome process receives it, the dom might have changed (for example, because code running in the content process modified it or we navigated to a different page...
...into onstatechange. however, the domwindow is passed asynchronously, so by the time the chrome process receives it, the dom might have changed (for example, because code running in the content process modified it or we navigated to a different page). we're working on fixing this issue in bug 1118880. also note that unlike other shims, this shim is always active. alternatively, you can use nsiwebprogresslistener in the content process. observers in the chrome process depending on the topic, you need to register observers in either the chrome process or in a frame script. for most topics you need to register observers in the chrome process. however, you must listen to content-document-global-created and document-element-inserted in a frame script. observers for these topics get content objects...

Chrome-only CSS reference
::-moz-tree-rowthe ::-moz-tree-row css pseudo-element is used to select rows and apply styles to tree rows.::-moz-tree-row(hover)the ::-moz-tree-row(hover) css pseudo-class will match an element if the mouse cursor is presently hovering over a tree row.::-moz-tree-separatoractivated by the properties attribute.::-moz-tree-twistyac...
...esently hovering over text in a tree cell.::-moz-tree-columnactivated by the properties attribute.::-moz-tree-drop-feedbackactivated by the properties attribute.::-moz-tree-imageactivated by the properties attribute.::-moz-tree-indentationactivated by the properties attribute.::-moz-tree-lineactivated by the properties attribute.::-moz-tree-progressmeteractivated when the type attribute is set to progressmeter. ::-moz-tree-rowthe ::-moz-tree-row css pseudo-element is used to select rows and apply styles to tree rows.::-moz-tree-row(hover)the ::-moz-tree-row(hover) css pseudo-class will match an element if the mouse cursor is presently hovering over a tree row.::-moz-tree-separatoractivated by the properties attribute.::-moz-tree-twistyactivated by the properties attribute.css -moz-bool-pref() ...

MozBeforePaint
power and improving overall system performance. example this example performs a simple animation, moving a box a short distance after a short period of time. ...
...s example performs a simple animation, moving a box a short distance after a short period of time. <!doctype html> <html> <body> <div id="d" style="width:100px; height:100px; background:lime; position:relative;"></div> <script> var d = document.getelementbyid("d"); var start = window.mozanimationstarttime; function step(event) { var progress = event.timestamp - start; d.style.left = math.min(progress/10, 200) + "px"; if (progress < 2000) { window.mozrequestanimationframe(); } else { window.removeeventlistener("mozbeforepaint", step, false); } } window.addeventlistener("mozbeforepaint", step, false); window.mozrequestanimationframe(); </script> </body> </html> as you can see, each time the mozbeforepaint event fires, our step() method is called. this computes the current positi...

How to implement a custom autocomplete search component
to do so put the following declaration in your chrome.manifest file: component {x753d830-ba1e-11...
... if (searchresults[i].comment) comments.push(searchresults[i].comment); else comments.push(null); } } var newresult = new simpleautocompleteresult(searchstring, ci.nsiautocompleteresult.result_success, 0, "", results, comments); listener.onsearchresult(this, newresult); } }, /* * stop an asynchronous search that is in progress */ stopsearch: function() { }, queryinterface: function(aiid) { if (!aiid.equals(ci.nsiautocompletesearch) && !aiid.equals(ci.nsisupports)) throw components.results.ns_error_no_interface; return this; } }; // factory var simpleautocompletesearchfactory = { singleton: null, createinstance: function (aouter, aiid) { if (aouter != null) throw components.res...

Add-on Repository
) void retrieverecommendedaddons(in integer maxresults, in searchcallback callback) void searchaddons(in string searchterms, in integer maxresults, in searchcallback callback) properties property type description homepageurl string the url of the repository site's home page. issearching boolean true if a search is currently in progress; otherwise false. methods getrecommendedurl() returns the url that can be visited to see recommended add-ons. string getrecommendedurl(); parameters none. return value an url indicating the repository's page of recommended add-ons. getsearchurl() returns an url of a web page that can be visited to see search results for the specified search terms. string getsearchurl( in string...
...itory's page of recommended add-ons. getsearchurl() returns an url of a web page that can be visited to see search results for the specified search terms. string getsearchurl( in string searchterms ); parameters searchterms search terms used to search the repository. return value the url of the search results page for the specified search terms. cancelsearch() cancels the search in progress. does nothing if there is no search in progress. void cancelsearch(); parameters none. retrieverecommendedaddons() begins a search for recommended add-ons in the repository. the list of recommended add-ons frequently changes. results will be passed to the given searchcallback callback. void retrieverecommendedaddons( in integer maxresults, in searchcallback callback ); parameters ma...

Downloads.jsm
previous session. the summary will behave as if no downloads are present until the getlist() method is called. promise<downloadsummary> getsummary(atype); parameters atype this can be downloads.public, downloads.private, or downloads.all. promise resolves to the requested downloadsummary object. examples downloading to a local file this example downloads an html file without showing progress, handling errors programmatically. components.utils.import("resource://gre/modules/downloads.jsm"); components.utils.import("resource://gre/modules/osfile.jsm") components.utils.import("resource://gre/modules/task.jsm"); task.spawn(function () { yield downloads.fetch("http://www.mozilla.org/", os.path.join(os.constants.path.tmpdir, ...
...t of active downloads. if a count is needed, it should be maintained using a view on a downloadlist. the start() method can be used to restart a failed download. handling of downloads that have been paused is also different. while some of the legacy methods and properties have an equivalent in downloads.jsm, there might be subtle differences in behavior. for example, the properties that handle progress are now more detailed and don't use the special value -1 anymore. you may see the documentation of the new methods and properties for details. using it in a xul app in a xul standalone application (running with xulrunner or firefox --app), you have to do additionnal things in order to use the new download manager. by default it is not enabled. it will be enabled when the bug 851471 will be clos...

Sqlite.jsm
e connection. close() close this database connection. this must be called on every opened connection or else application shutdown will fail due to waiting on the opened connection to close (gecko doesn't force close connections because it doesn't know that you are really done with them). this function returns a promise that will be resolved when the database has closed. if a transaction is in progress at the time this function is called, the transaction will be forcibly rolled back. if statements are in progress at the time this function is called, they will be cancelled. callers should not attempt to use the connection after calling this method as the connection will be unusable. it is possible to automatically close the connection when the browser is closed with the shutdown hook: const ...
...-promise. these functions receive the following arguments: readonly (optional) if true the clone will be read-only, default is false. if the original connection is already read-only, the clone will be, regardless of this option. if the original connection is using the shared cache, this parameter will be ignored and the clone will be as privileged as the original connection. transactioninprogress this boolean property indicates whether a transaction is in progress. this is rarely needed by external callers. shrinkmemory() this function can be called to shrink the memory usage of the connection. this is a glorified wrapper around the pragma shrink_memory statement, which tells sqlite to shrink its memory usage (by clearing caches, etc). while calling this has the benefit of shrinking m...

Webapps.jsm
alid) _writemanifestfile: function(aid, aispackage, ajsonmanifest) _nextlocalid: function() _appidformanifesturl: function(auri) makeappid: function() _saveapps: function() _readmanifests: function(adata) _ensuresufficientstorage: function(anewapp) _checkdownloadsize: function(afreebytes, anewapp) _getrequestchannel: function(afullpackagepath, aislocalfileinstall, aoldapp,) _senddownloadprogressevent: function(anewapp, aprogress) _getpackage: function(arequestchannel, aid, aoldapp, anewapp) _computefilehash: function(afilepath) _sendappliedevent: function(aapp) _openandreadpackage: function(azipfile, aoldapp, anewapp, aislocalfileinstall,) _openpackage: function(azipfile, aapp, aislocalfileinstall) _opensignedpackage: function(ainstallorigin, amanifesturl, azipfile, acertdb) _read...
...id: function(alocalid) getapplocalidbymanifesturl: function(amanifesturl) getcoreappsbasepath: function() getwebappsbasepath: function() _islaunchable: function(aapp) _notifycategoryandobservers: function(subject, topic, data, msg) registerbrowserelementparentforapp: function(amsg, amn) receiveappmessage: function(appid, message) _clearprivatedata: function(appid, browseronly, msg) _sendprogressevent: function() updatestatechanged: function appobs_update(aupdate, astate) applicationcacheavailable: function appobs_cacheavail(aapplicationcache) ...

Index
a reward for your efforts, you get to move on to the very reason you've come here: to localize mozilla projects. 17 localization sign-off reviews guide, localization, mozilla this article presents an overview of why we do sign-off reviews of localizations, the details on the criteria used for the sign-off reviews, and the process for requesting a review and for following its progress. 18 localization technical reviews guide, localization, mozilla this guide provides details on what a localization technical review is, what criteria are used for the technical reviews, and the process for requesting one and following its progress. 19 localization: frequently asked questions faq, guide, internationalization, localization, mozilla this pag...
...rimary types of localization files (dtd and properties) used in the mozilla source code. with that document, users can see immediately two localized files in their user interface by following closely and carefully the steps to create a language pack or a binary file that is ready for installation. repeating the process allows a localizer to create a testable package to see his or her work as they progress to a final version. 28 mozilla l10n style guide localization cultural references, idioms, and slang require a full understanding of these references between the cultures of your source and target languages. an example of a cultural reference in english would be the phrase, "kick-off meeting." this is a reference that uses an american football term. it means a meeting to begin...

Initial setup
u can help. if a community doesn't exist, send an email to the new-locales newsgroup for additional guidance. accounts there are a handful of accounts that you need to be aware of as you begin. they're not required for you to begin contributing, but will be required when you are preparing to produce an official release. for now, simply be aware that these will become important as your efforts progress. these accounts will store your code, contributions, and help you produce an official localization. hg (mercurial) mercurial is the revision control environment that houses the main mozilla source code as well as localized code for each official mozilla localization. you will need this for localizing mozilla applications. hg commit access is not necessary to begin localizing. after you have s...
...e them, you may need to create a personal account. mozilla ldap you will need a mozilla ldap account once you're ready to have your localization registered on the main mozilla repositories. add a request about creating your ldap account to the new locales newsgroup. locale-specific bugzilla component having a bugzilla component specific to your locale will help us to track your localization's progress from first steps to official release. it will also notify us when you're having problems unique to your localization team's work. add a request about creating your locale's bugzilla component to the new locales newsgroup. local environment tools similar to accounts, there is a number of environment tools that you should install on your personal computer. these tools will help you to store your...

Localization sign-off reviews
the sign-off review process has been notoriously shrouded in mystery. we use this review process to perform quality assurance (qa) testing on your l10n efforts. this ensures that every user who downloads your localized mozilla application receives all of your hard work in a functional product. ...
...e attached, open the attachment details. in the attachment details, select the ? from the dropdown menu next to the appropriate approval flags (see image). this will display a text box to assign the review to someone. enter :pike as the requestee. once you have made the formal request in bugzilla and you have pushed your work into your l10n repo, refer to the dashboards to follow your review's progress. sign-off dashboards to the right, you'll see the current sign-offs page for a german localization. sign-offs are approved using the buttons in the farthest column to the right. you can work with the l10n-drivers to track the progress of your review and correlate your review/sign-off's approval progress with specific bugzilla bugs. as your work is approved, you'll see a green circle in the farth...

sslerr.html
error should never occur. if it does, it indicates a flaw in the nss ssl library. ssl_error_close_notify_alert -12230 "ssl peer has closed this connection." the local socket received an ssl3 alert record from the remote peer, reporting that the remote peer has chosen to end the connection. the receipt of this alert is an error only if it occurs while a handshake is in progress. ssl_error_pub_key_size_limit_exceeded -12210 "ssl server attempted to use domestic-grade public key with export cipher suite." on a client socket, this error reports that the remote server has failed to perform an "ssl step down" for an export cipher. it has sent a certificate bearing a domestic-grade public key, but has not sent a serverkeyexchange message contain...
...6 "server has no key for the attempted key exchange algorithm." an ssl client has requested an ssl cipher suite that uses a key exchange algorithm for which the local server has no appropriate public key. this indicates a configuration error on the local server. ssl_error_token_insertion_removal -12205 "pkcs #11 token was inserted or removed while operation was in progress." a cryptographic operation required to complete the handshake failed because the token that was performing it was removed while the handshake was underway. another token may also have been inserted into the same slot. ssl_error_token_slot_not_found -12204 "no pkcs#11 token could be found to do a required operation." a cryptographic operation required a pk...

Web Replay
at this point and allow state to be inspected, forward/reverse stepping, and so forth. timeline the timeline is shown above the developer tools and provides several features to help with navigating the recording: the timeline changes color depending on whether the tab is currently recording (red) or replaying (blue). the current position within the recording is shown on the timeline with a progress indicator. console error/messages are marked on the timeline and can be clicked to seek to that point. advanced options preferences devtools.recordreplay.enablerewinding when disabled, firefox records a page signifcantly faster. default true. devtools.recordreplay.fastlogpoints when enabled, firefox web replay evaluates logpoints consecutively. logpoints cannot have side-effects or diver...
...state whenever they are waiting to acquire a lock or perform an atomic action that is part of the recording. while recording, threads may make blocking calls to libraries (e.g. kevent). to allow these threads to be snapshotted, the call is instead performed on a separate thread that does not participate in the recording, so that the calling thread may enter the correct idle state even while its progress is blocked on the call completing. once all thread are idle, the main thread computes the memory diff, reads the stacks from each thread and their register state (which each thread recorded by calling setjmp before idling). restoring snapshots is also done from the main thread. as for taking a snapshot, all other threads enter an idle state. the dirty memory information computed since the las...

Gecko object attributes
t-align specifies how lines of text are aligned with each other (see css text-align property). ...
... text-indent specifies how much horizontal space should be left before beginning of the first line of the text content of an text accessible (see the css text-indent property). value attributes valuetext a text equivalent to the current value, such as "high" in a slider or "unzipping files" in a progress meter. applied to: anything that supports the value interface, especially a slider or progress meter ...

AT APIs Support
but in the meantime it more up-to-date and contains more details than existed analogues for at-spi and msaa this documentation explains how makers of screen readers, voice dictation packages, onscreen keyboards, magnification software and other assitive technologies can support gecko-based software. we provide for them the support of these products on windows, linux/unix and os x platforms. accessible gecko gecko is a rendering engine that firefox, seamonkey, netscape and yelp use. gecko can render a variety of content, not just html and supports key web standards such as cascading style sheets, javascript and the w3c dom. gecko also handles the users keystrokes and mouse clicks. ...
...set of interfaces that overlay the msaa (iaccessible) and dom (isimpledom*) interface support. any object that supports iaccessible will also support iaccessible2 and possibly any of the other ia2 interfaces. linux/unix platform we support atk/at-spi interfaces on linux. mac platform we currently support only a subset of universal access. the rest of the mozilla universal access support is in progress. accessible web standards gecko exposes the number of xml languages including html to at. refer to accessible web specifications page to learn what and how markup languages are exposed. at apis implementation details refer to implementation details page to see how gecko supports interesting at api. there you will find information how at api interfaces, roles, states and etc are mapped into ge...

imgIDecoderObserver
1.0 66 introduced gecko 12.0 inherits from: imgicontainerobserver last changed in gecko 1.7 we make the distinction here between "load" and "decode" notifications. load notifications are fired as the image is loaded from the network or filesystem. decode notifications are fired as the image is decoded. ...
...ect ); parameters arequest the request on which data is available, or null if being called for an imgidecoder object. acurrentframe missing description arect missing description ondiscard() called when the decoded image data is discarded. this means that the frames no longer exist in decoded form, and any attempt to access or draw the image will initiate a new series of progressive decode notifications. void ondiscard( in imgirequest arequest ); parameters arequest the request on which data is available, or null if being called for an imgidecoder object. onimageisanimated() notification for when an image is known to be animated. this should be fired at the earliest possible time. void onimageisanimated( in imgirequest arequest ); parameters arequest ...

mozIStorageFunction
mozistoragestatementwrapper storage statement wrapper ...
... mozistoragestatementwrapper storage statement wrapper ...

mozIStorageStatement
ode>?1</code> maps to <code>0</code>, and so on). avalue to be bound to the specified index. avaluesize size of avalue. execution functions these functions are discussed in more detail with sample code in the overview document. executeasync() starts the execution of a query asynchronously using the currently bound parameters. the optional callback routine receives notifications about the progress of the query. for sample code and more details, see the overview document. note: the statement does not have to be reset before being reused. mozistoragependingstatement executeasync( [optional] mozistoragestatementcallback acallback ); parameters acallback a callback object that will be notified of progress, errors, and query completion. this parameter is optional. return value a mo...
...ep(), and then calling reset(). void execute(); see also storage introduction and how-to article mozistorageconnection database connection to a specific file or in-memory data storage mozistoragevaluearray wraps an array of sql values, such as a result row. mozistoragefunction create a new sqlite function. mozistorageaggregatefunction create a new sqlite aggregate function. mozistorageprogresshandler monitor progress during the execution of a statement. mozistorageasyncstatement mozistoragestatementwrapper storage statement wrapper mozistoragebindingparams mozistoragebindingparamsarray ...

nsIDOMMouseScrollEvent
axis long indicates which mouse wheel axis changed; this will be either horizontal_axis or vertical_axis. read only. constants constant value description horizontal_axis 1 the horizontal (x) axis. vertical_axis 2 the vertical (y) axis. methods initmousescrollevent() initializes the progress event object. void initmousescrollevent( in domstring typearg, in boolean canbubblearg, in boolean cancelablearg, in nsidomabstractview viewarg, in long detailarg, in long screenxarg, in long screenyarg, in long clientxarg, in long clientyarg, in boolean ctrlkeyarg, in boolean altkeyarg, in boolean shiftkeyarg, in boolean metakeyarg, in unsigned short buttonarg, in n...
...etailarg, in long screenxarg, in long screenyarg, in long clientxarg, in long clientyarg, in boolean ctrlkeyarg, in boolean altkeyarg, in boolean shiftkeyarg, in boolean metakeyarg, in unsigned short buttonarg, in nsidomeventtarget relatedtargetarg, in long axis ); parameters typearg the type of event. must be one of "abort", "error", "load", "loadstart", or "progress". canbubblearg specifies whether or not the created event will bubble. cancelablearg specifies whether or not the created event can be canceled. viewarg the nsidomabstractview in which the event occurred. detailarg screenxarg the x coordinate at which the event occurred, in screen coordinates. screenyarg the y c...

nsIDocShell
must be possible to serialise this in less than 640k characters. atitle gecko currently ignores this parameter. aurl the url associated with the new history entry. for instance, if the user tries to reload the page, then this is the url that will be reloaded. areplace whether to modify the current history entry instead of creating a new one. beginrestore() begin firing webprogresslistener notifications for restoring a page presentation. this method will post an event to complete the simulated load after returning to the event loop. void beginrestore( in nsicontentviewer viewer, in boolean top ); parameters viewer the content viewer whose document we are starting to load. if null, it defaults to the docshell's current content viewer, creating one if necessary.
...; parameters loadinfo the new nsidocshellloadinfo object. violates the xpcom interface guidelines detacheditorfromwindow() disconnects this docshell's editor from its window, and stores the editor data in the open document's session history entry. this should be called only during page transitions. void detacheditorfromwindow(); parameters none. finishrestore() finish firing webprogresslistener notifications and dom events for restoring a page presentation. this should only be called via beginrestore(). void finishrestore(); parameters none. native code only!firepagehidenotification notify the associated content viewer and all child docshells that they are about to be hidden. if isunload is true, then the document is being unloaded as well. void firepagehidenotification( in ...

nsIDragService
ts the drag service for handling drag and drop operations. inherits from: nsisupports last changed in gecko 43 (firefox 43 / thunderbird 43 / seamonkey 2.40) note: using this interface directly from add-on code is deprecated. add-ons should use the standard datatransfer drag and drop api instead. the only exception is getcurrentsession(), since there's currently no way to check for a drag in progress using standard dom methods or properties. method overview void enddragsession( in prbool adonedrag ) ; void dragmoved(in long ax, in long ay); native code only! void firedrageventatsource(in unsigned long amsg); obsolete since gecko 43 void firedrageventatsource(in mozilla::eventmessage aeventmessage); native code only! nsidragsession getcurrentse...
... void firedrageventatsource( in mozilla::eventmessage aeventmessage ); parameters aeventmessage one of the event messages between edragdropeventfirst and edragdropeventlast defined in widget/eventmessagelist.h getcurrentsession() returns the current nsidragsession. nsidragsession getcurrentsession(); parameters none. return value the current drag session, or null if no drag is in progress. invokedragsession() starts a modal drag session with an array of transferables void invokedragsession( in nsidomnode adomnode, in nsisupportsarray atransferables, in nsiscriptableregion aregion, in unsigned long aactiontype ); parameters adomnode the source node on which the drag gesture was started. atransferables an array of transferables to be dragged. aregion a region co...

nsIFeedResultListener
toolkit/components/feeds/public/nsifeedlistener.idlscriptable this interface should be implemented by programs to receive events from the feed parser as parsing progresses. 1.0 66 introduced gecko 1.8 inherits from: nsisupports last changed in gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) method overview void handleresult(in nsifeedresult result); methods handleresult() called when feed processing is complete. even if an error occurred during processing, there may be valid data available for feed-level data or entries processed before the error occurred. if you don't care about doing progress display or the like, this is all you need to implement in order to receive the parsed feed. void handleresult( in nsifeedresult result ); ...
...occurred during processing, there may be valid data available for feed-level data or entries processed before the error occurred. if you don't care about doing progress display or the like, this is all you need to implement in order to receive the parsed feed. ...

nsIUpdateCheckListener
toolkit/mozapps/update/nsiupdateservice.idlscriptable an interface describing an object that listens to the progress of an update check operation. this object is notified as the check continues, finishes and if it has an error. 1.0 66 introduced gecko 1.8 inherits from: nsisupports last changed in gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) method overview void oncheckcomplete(in nsixmlhttprequest request, [array, size_is(updatecount)] in nsiupdate updates, in unsigned long updatecount); void onerror(in nsixmlhttprequest request, in nsiupdate update); void onprogress(in nsixmlhttprequest request, in unsigned long position, in unsigned long totalsize); methods oncheckcomplete() called when the update check is completed. void oncheckcomplete(...
...ailable updates. updatecount the number of updates in the updates array. onerror() called when an error occurs while loading the remote update service file. void onerror( in nsixmlhttprequest request, in nsiupdate update ); parameters request the nsixmlhttprequest object handling the update check. update an nsiupdate object containing details about the error in its statustext attribute. onprogress() called every time there is a progress notification loading the update service file. void onprogress( in nsixmlhttprequest request, in unsigned long position, in unsigned long totalsize ); parameters request the nsixmlhttprequest object handling the update check. position the number of bytes downloaded so far. totalsize the total number of bytes that need to be downloaded. see also nsi...

nsIXMLHttpRequestEventTarget
javascript function object that gets invoked when the operation is successfully completed. onloadend nsidomeventlistener a javascript function object that gets invoked when the operation is completed for any reason; it will always follow a an abort, error, or load event. onloadstart nsidomeventlistener a javascript function object that gets invoked exactly once when the operation begins. onprogress nsidomeventlistener a javascript function object that gets invoked zero or more times, after the loadstart event, but before any abort, error, or load events occur. handling the events when the handler functions for these events are called, they receive as a parameter a progressevent, which implements the nsidomprogressevent interface. see also using xmlhttprequest xmlhttprequest nsixmlhttpre...
...listener a javascript function object that gets invoked zero or more times, after the loadstart event, but before any abort, error, or load events occur. ...

nsIXmlRpcClient
null if the last call didn't return an xml-rpc fault. result readonly nsisupports the most recent xml-rpc call result returned from this server. null if the last call didn't return a valid result. responsestatus readonly unsigned long the most rec...
...null if the last call didn't return an xml-rpc fault. result readonly nsisupports the most recent xml-rpc call result returned from this server. null if the last call didn't return a valid result. responsestatus readonly unsigned long the most recent http status code returned from this server. null i...

Storage
ther commit the changes by calling mozistorageconnection.committransaction(), or rollback the changes by calling mozistorageconnection.rollbacktransaction(). in c++ code, there is a helper class defined in storage/public/mozstoragehelper.h, mozstoragetransaction, that will attempt to get a transaction for you, and handle it appropriately when it falls out of scope. if a transaction is already in progress, no transaction is obtained. if your function returns without calling commit on the helper object, the transaction will be rolled back. nsresult myclass::myfunction() { // mdbconn is a member variable of our mozistorageconnection. mozstoragetransaction transaction(mdbconn); // execute some statements. if we encounter an error, the transaction will // be rolled back. return transacti...
...d by storage. see also mozistorageconnection database connection to a specific file or in-memory data storage mozistoragestatement create and execute sql statements on a sqlite database. mozistoragevaluearray wraps an array of sql values, such as a result row. mozistoragefunction create a new sqlite function. mozistorageaggregatefunction create a new sqlite aggregate function. mozistorageprogresshandler monitor progress during the execution of a statement. mozistoragestatementwrapper storage statement wrapper mozistorageservice storage service storage:performance how to get your database connection performing well. storage inspector extension makes it easy to view any sqlite database files in the current profile. sqlite syntax query language understood by sqlite sqlite database b...

Plugin Roadmap for Firefox - Plugins
plugins are a security and performance problem for firefox users. npapi plugins are an obsolete technology, and mozilla has been moving toward a web which doesn't need plugins. the last remaining npapi plugin, adobe flash, has announced an end-of-life plan. to support the transition away from flash, firefox is working with other browsers to progressively and carefully make flash usage less common. below is the roadmap of past and future support for plugins in firefox. schedule june 2016 starting with firefox 47 in june 2016, all plugins other than adobe flash are click-to-activate. users choose which sites are allowed to activate each plugin. in addition, the 64-bit firefox for windows only supports the flash plugin. march 2017 starting with firefox 52 in march 2017, plugins other ...
...arch 2017, plugins other than adobe flash are no longer supported in firefox. firefox extended support release 52 will continue to support non-flash plugins until early 2018. august 2017 starting with firefox 55 in august 2017, users must choose which sites are allowed to activate the flash plugin. users will have the choice to remember the flash setting per-site. this change will be rolled out progressively during august and september 2017. in order to improve security and performance, mozilla will maintain a list of sites which cannot use any plugins. september 2017 starting with firefox 56 in september 2017, firefox for android will remove all support for plugins (bug 1381916). 2019 in september 2019, firefox 69 will remove the "always activate" flash option so we always ask for user p...

Examine and edit CSS - Firefox Developer Tools
rties by clicking the arrow besides them. ...
...w besides them. ...

Document - Web APIs
ent is raised. globaleventhandlers.onloadeddata is an eventhandler representing the code to be called when the loadeddata event is raised. globaleventhandlers.onloadedmetadata is an eventhandler representing the code to be called when the loadedmetadata event is raised. globaleventhandlers.onloadend is an eventhandler representing the code to be called when the loadend event is raised (when progress has stopped on the loading of a resource.) globaleventhandlers.onloadstart is an eventhandler representing the code to be called when the loadstart event is raised (when progress has begun on the loading of a resource.) globaleventhandlers.onlostpointercapture is an eventhandler representing the code to be called when the lostpointercapture event type is raised. globaleventhandlers.onmousedo...
... is an eventhandler representing the code to be called when the pointerleave event is raised. globaleventhandlers.onpointerlockchange is an eventhandler representing the code to be called when the pointerlockchange event is raised. globaleventhandlers.onpointerlockerror is an eventhandler representing the code to be called when the pointerlockerror event is raised. globaleventhandlers.onprogress is an eventhandler representing the code to be called when the progress event is raised. globaleventhandlers.onratechange is an eventhandler representing the code to be called when the ratechange event is raised. globaleventhandlers.onreset is an eventhandler representing the code to be called when the reset event is raised. globaleventhandlers.onresize is an eventhandler representing the ...

EffectTiming.iterationStart - Web APIs
element.animate(), keyframeeffectreadonly.keyframeeffectreadonly(), and keyframeeffect.keyframeeffect() all accept an object of timing properties including iterationstart. the value of iterationstart corresponds directly to animationeffecttimingreadonly.iterationstart in timing objects returned by animationeffectreadonly, keyframeeffectreadonly, and keyframeeffect. ...
...ingproperties = { iterationstart = iterationnumber }; timingproperties.iterationstart = iterationnumber; value a floating-point value whose value is at least 0 and is not +infinity, indicating the offset into the number of iterations the animation sequence is to run at which to start animating. iterationstart represents the iteration index at which the animation effect begins as well as its progress through that iteration. usually you'll use a value between 0.0 and 1.0 to indicate an offset into the first run of the animation at which to begin the animation performance, but any positive, non-infinite value is allowed. since all animations' iteration indexes start at 0, a value of 0.5 would start the animation halfway through its first iteration or loop. meanwhile, a value of 1.2 means the a...

Event - Web APIs
it can also be triggered programmatically, such as by calling the htmlelement.click() method of an element, or by defining the event, then sending it to a specified target using eventtarget.dispatchevent(). there are many types of events, some of which use other interfaces based on the main event interface. ...
... properties event.bubbles read only a bool...

FileReader: abort event - Web APIs
the abort event is fired when a read has been aborted: for instance because the program called filereader.abort(). ...
... eventlog.textcontent = eventlog.textcontent + `${event.type}: ${event.loaded} bytes transferred\n`; if (event.type === "load") { preview.src = reader.result; } } function addlisteners(reader) { reader.addeventlistener('loadstart', handleevent); reader.addeventlistener('load', handleevent); reader.addeventlistener('loadend', handleevent); reader.addeventlistener('progress', handleevent); reader.addeventlistener('error', handleevent); reader.addeventlistener('abort', handleevent); } function handleselected(e) { eventlog.textcontent = ''; const selectedfile = fileinput.files[0]; if (selectedfile) { addlisteners(reader); reader.readasdataurl(selectedfile); } reader.abort(); } fileinput.addeventlistener('change', handlesel...

FileReader: load event - Web APIs
the load event is fired when a file has been read successfully. ...
... eventlog.textcontent = eventlog.textcontent + `${event.type}: ${event.loaded} bytes transferred\n`; if (event.type === "load") { preview.src = reader.result; } } function addlisteners(reader) { reader.addeventlistener('loadstart', handleevent); reader.addeventlistener('load', handleevent); reader.addeventlistener('loadend', handleevent); reader.addeventlistener('progress', handleevent); reader.addeventlistener('error', handleevent); reader.addeventlistener('abort', handleevent); } function handleselected(e) { eventlog.textcontent = ''; const selectedfile = fileinput.files[0]; if (selectedfile) { addlisteners(reader); reader.readasdataurl(selectedfile); } } fileinput.addeventlistener('change', handleselected); result ...

FileReader: loadend event - Web APIs
the loadend event is fired when a file read has completed, successfully or not. ...
... eventlog.textcontent = eventlog.textcontent + `${event.type}: ${event.loaded} bytes transferred\n`; if (event.type === "load") { preview.src = reader.result; } } function addlisteners(reader) { reader.addeventlistener('loadstart', handleevent); reader.addeventlistener('load', handleevent); reader.addeventlistener('loadend', handleevent); reader.addeventlistener('progress', handleevent); reader.addeventlistener('error', handleevent); reader.addeventlistener('abort', handleevent); } function handleselected(e) { eventlog.textcontent = ''; const selectedfile = fileinput.files[0]; if (selectedfile) { addlisteners(reader); reader.readasdataurl(selectedfile); } } fileinput.addeventlistener('change', handleselected); result ...

FileReader: loadstart event - Web APIs
the loadstart event is fired when a file read operation has begun. ...
... eventlog.textcontent = eventlog.textcontent + `${event.type}: ${event.loaded} bytes transferred\n`; if (event.type === "load") { preview.src = reader.result; } } function addlisteners(reader) { reader.addeventlistener('loadstart', handleevent); reader.addeventlistener('load', handleevent); reader.addeventlistener('loadend', handleevent); reader.addeventlistener('progress', handleevent); reader.addeventlistener('error', handleevent); reader.addeventlistener('abort', handleevent); } function handleselected(e) { eventlog.textcontent = ''; const selectedfile = fileinput.files[0]; if (selectedfile) { addlisteners(reader); reader.readasdataurl(selectedfile); } } fileinput.addeventlistener('change', handleselected); result ...

FileReader - Web APIs
andler for the load event. this event is triggered each time the reading operation is successfully completed. filereader.onloadstart a handler for the loadstart event. this event is triggered each time the reading is starting. filereader.onloadend a handler for the loadend event. this event is triggered each time the reading operation is completed (either in success or failure). filereader.onprogress a handler for the progress event. this event is triggered while reading a blob content. as filereader inherits from eventtarget, all those events can also be listened for by using the addeventlistener method. methods filereader.abort() aborts the read operation. upon return, the readystate will be done. filereader.readasarraybuffer() starts reading the contents of the specified blob,...
...ort property. error fired when the read failed due to an error. also available via the onerror property. load fired when a read has completed successfully. also available via the onload property. loadend fired when a read has completed, successfully or not. also available via the onloadend property. loadstart fired when a read has started. also available via the onloadstart property. progress fired periodically as data is read. also available via the onprogress property. specifications specification status comment file apithe definition of 'filereader' in that specification. working draft initial definition ...

GlobalEventHandlers - Web APIs
ent is raised. globaleventhandlers.onloadeddata is an eventhandler representing the code to be called when the loadeddata event is raised. globaleventhandlers.onloadedmetadata is an eventhandler representing the code to be called when the loadedmetadata event is raised. globaleventhandlers.onloadend is an eventhandler representing the code to be called when the loadend event is raised (when progress has stopped on the loading of a resource.) globaleventhandlers.onloadstart is an eventhandler representing the code to be called when the loadstart event is raised (when progress has begun on the loading of a resource.) globaleventhandlers.onlostpointercapture is an eventhandler representing the code to be called when the lostpointercapture event type is raised. globaleventhandlers.onmousedo...
... is an eventhandler representing the code to be called when the pointerleave event is raised. globaleventhandlers.onpointerlockchange is an eventhandler representing the code to be called when the pointerlockchange event is raised. globaleventhandlers.onpointerlockerror is an eventhandler representing the code to be called when the pointerlockerror event is raised. globaleventhandlers.onprogress is an eventhandler representing the code to be called when the progress event is raised. globaleventhandlers.onratechange is an eventhandler representing the code to be called when the ratechange event is raised. globaleventhandlers.onreset is an eventhandler representing the code to be called when the reset event is raised. globaleventhandlers.onresize is an eventhandler representing the ...

OfflineAudioContext - Web APIs
offlineaudiocontext.oncomplete is an eventhandler called when processing is terminated, that is when the complete event (of type offlineaudiocompletionevent) is raised, after the event-based version of offlineaudiocontext.startrendering() is used. methods also inherits methods from its parent interface, baseaudiocontext. ...
... note: the resume() method is still available — it is now defined on the baseaudiocontext interface (see baseaudiocontext.resume()) and thus can be accessed by both the audiocontext and offlineaudiocontext interfaces. ...

Window - Web APIs
ens a new window. window.postmessage() provides a secure means for one window to send a string of data to another window, which need not be within the same domain as the first. window.print() opens the print dialog to print the current document. window.prompt() returns the text entered by the user in a prompt dialog. window.requestanimationframe() tells the browser that an animation is in progress, requesting that the browser schedule a repaint of the window for the next animation frame. window.requestidlecallback() enables the scheduling of tasks during a browser's idle periods. window.resizeby() resizes the current window by a certain amount. window.resizeto() dynamically resizes window. window.scroll() scrolls the window to a particular place in the document. window.scrollby(...
...handler property for paint events on the window. window.onrejectionhandled an event handler for handled promise rejection events. window.onuserproximity an event handler property for user proximity events. event handlers implemented from elsewhere globaleventhandlers.onabort called when the loading of a resource has been aborted, such as by a user canceling the load while it is still in progress windoweventhandlers.onafterprint called when the print dialog box is closed. see afterprint event. windoweventhandlers.onbeforeprint called when the print dialog box is opened. see beforeprint event. windoweventhandlers.onbeforeunload an event handler property for before-unload events on the window. globaleventhandlers.onblur called after the window loses focus, such as due to a popup. g...

How to check the security state of an XMLHTTPRequest over SSL - Web APIs
error.name + "\n"); } let secinfo = channel.securityinfo; // print general connection security state dump("security information:\n"); if (secinfo instanceof ci.nsitransportsecurityinfo) { secinfo.queryinterface(ci.nsitransportsecurityinfo); dump("\tsecurity state of connection: "); // check security state flags if ((secinfo.securitystate & ci.nsiwebprogresslistener.state_is_secure) == ci.nsiwebprogresslistener.state_is_secure) { dump("secure connection\n"); } else if ((secinfo.securitystate & ci.nsiwebprogresslistener.state_is_insecure) == ci.nsiwebprogresslistener.state_is_insecure) { dump("insecure connection\n"); } else if ((secinfo.securitystate & ci.nsiwebprogresslistener.state_is_broken)...
... == ci.nsiwebprogresslistener.state_is_secure) { dump("secure connection\n"); } else if ((secinfo.securitystate & ci.nsiwebprogresslistener.state_is_insecure) == ci.nsiwebprogresslistener.state_is_insecure) { dump("insecure connection\n"); } else if ((secinfo.securitystate & ci.nsiwebprogresslistener.state_is_broken) == ci.nsiwebprogresslistener.state_is_broken) { dump("unknown\n"); dump("\tsecurity description: " + secinfo.shortsecuritydescription + "\n"); dump("\tsecurity error message: " + secinfo.errormessage + "\n"); } } else { dump("\tno security info available for this channel\n"); } // print ssl certificate details if (secinfo instanceof ci.nsisslstatusprovider) { ...

XMLHttpRequest: abort event - Web APIs
the abort event is fired when a request has been aborted, for example because the program called xmlhttprequest.abort(). ...
....queryselector('.xhr.abort'); const log = document.queryselector('.event-log'); function handleevent(e) { log.textcontent = log.textcontent + `${e.type}: ${e.loaded} bytes transferred\n`; } function addlisteners(xhr) { xhr.addeventlistener('loadstart', handleevent); xhr.addeventlistener('load', handleevent); xhr.addeventlistener('loadend', handleevent); xhr.addeventlistener('progress', handleevent); xhr.addeventlistener('error', handleevent); xhr.addeventlistener('abort', handleevent); } function runxhr(url) { log.textcontent = ''; const xhr = new xmlhttprequest(); addlisteners(xhr); xhr.open("get", url); xhr.send(); return xhr; } xhrbuttonsuccess.addeventlistener('click', () => { runxhr('https://mdn.mozillademos.org/files/16553/dgszyjnx...

XMLHttpRequest: error event - Web APIs
the error event is fired when the request encountered an error. ...
....queryselector('.xhr.abort'); const log = document.queryselector('.event-log'); function handleevent(e) { log.textcontent = log.textcontent + `${e.type}: ${e.loaded} bytes transferred\n`; } function addlisteners(xhr) { xhr.addeventlistener('loadstart', handleevent); xhr.addeventlistener('load', handleevent); xhr.addeventlistener('loadend', handleevent); xhr.addeventlistener('progress', handleevent); xhr.addeventlistener('error', handleevent); xhr.addeventlistener('abort', handleevent); } function runxhr(url) { log.textcontent = ''; const xhr = new xmlhttprequest(); addlisteners(xhr); xhr.open("get", url); xhr.send(); return xhr; } xhrbuttonsuccess.addeventlistener('click', () => { runxhr('https://mdn.mozillademos.org/files/16553/dgszyjnx...

XMLHttpRequest: load event - Web APIs
the load event is fired when an xmlhttprequest transaction completes successfully. ...
....queryselector('.xhr.abort'); const log = document.queryselector('.event-log'); function handleevent(e) { log.textcontent = log.textcontent + `${e.type}: ${e.loaded} bytes transferred\n`; } function addlisteners(xhr) { xhr.addeventlistener('loadstart', handleevent); xhr.addeventlistener('load', handleevent); xhr.addeventlistener('loadend', handleevent); xhr.addeventlistener('progress', handleevent); xhr.addeventlistener('error', handleevent); xhr.addeventlistener('abort', handleevent); } function runxhr(url) { log.textcontent = ''; const xhr = new xmlhttprequest(); addlisteners(xhr); xhr.open("get", url); xhr.send(); return xhr; } xhrbuttonsuccess.addeventlistener('click', () => { runxhr('https://mdn.mozillademos.org/files/16553/dgszyjnx...

XMLHttpRequest: loadend event - Web APIs
the loadend event is fired when a request has completed, whether successfully (after load) or unsuccessfully (after abort or error). ...
....queryselector('.xhr.abort'); const log = document.queryselector('.event-log'); function handleevent(e) { log.textcontent = log.textcontent + `${e.type}: ${e.loaded} bytes transferred\n`; } function addlisteners(xhr) { xhr.addeventlistener('loadstart', handleevent); xhr.addeventlistener('load', handleevent); xhr.addeventlistener('loadend', handleevent); xhr.addeventlistener('progress', handleevent); xhr.addeventlistener('error', handleevent); xhr.addeventlistener('abort', handleevent); } function runxhr(url) { log.textcontent = ''; const xhr = new xmlhttprequest(); addlisteners(xhr); xhr.open("get", url); xhr.send(); return xhr; } xhrbuttonsuccess.addeventlistener('click', () => { runxhr('https://mdn.mozillademos.org/files/16553/dgszyjnx...

XMLHttpRequest: loadstart event - Web APIs
the loadstart event is fired when a request has started to load data. ...
....queryselector('.xhr.abort'); const log = document.queryselector('.event-log'); function handleevent(e) { log.textcontent = log.textcontent + `${e.type}: ${e.loaded} bytes transferred\n`; } function addlisteners(xhr) { xhr.addeventlistener('loadstart', handleevent); xhr.addeventlistener('load', handleevent); xhr.addeventlistener('loadend', handleevent); xhr.addeventlistener('progress', handleevent); xhr.addeventlistener('error', handleevent); xhr.addeventlistener('abort', handleevent); } function runxhr(url) { log.textcontent = ''; const xhr = new xmlhttprequest(); addlisteners(xhr); xhr.open("get", url); xhr.send(); return xhr; } xhrbuttonsuccess.addeventlistener('click', () => { runxhr('https://mdn.mozillademos.org/files/16553/dgszyjnx...

XMLHttpRequest - Web APIs
tes whether or not the object represents a background service request. xmlhttprequest.mozresponsearraybuffer obsolete since gecko 6 read only arraybuffer. the response to the request, as a javascript typed array. xmlhttprequest.multipartobsolete since gecko 22 this gecko-only feature, a boolean, was removed in firefox/gecko 22. please use server-sent events, web sockets, or responsetext from progress events instead. event handlers onreadystatechange as a property of the xmlhttprequest instance is supported in all browsers. since then, a number of additional event handlers have been implemented in various browsers (onload, onerror, onprogress, etc.). see using xmlhttprequest. more recent browsers, including firefox, also support listening to the xmlhttprequest events via standard addevent...
...rror property. load fired when an xmlhttprequest transaction completes successfully. also available via the onload property. loadend fired when a request has completed, whether successfully (after load) or unsuccessfully (after abort or error). also available via the onloadend property. loadstart fired when a request has started to load data. also available via the onloadstart property. progress fired periodically when a request receives more data. also available via the onprogress property. timeout fired when progress is terminated due to preset time expiring. also available via the ontimeout property. specifications specification status comment xmlhttprequest living standard live standard, latest version ...

Web APIs
labelelement htmllegendelement htmllinkelement htmlmapelement htmlmarqueeelement htmlmediaelement htmlmenuelement htmlmenuitemelement htmlmetaelement htmlmeterelement htmlmodelement htmlolistelement htmlobjectelement htmloptgroupelement htmloptionelement htmloptionscollection htmlorforeignelement htmloutputelement htmlparagraphelement htmlparamelement htmlpictureelement htmlpreelement htmlprogresselement htmlquoteelement htmlscriptelement htmlselectelement htmlshadowelement htmlslotelement htmlsourceelement htmlspanelement htmlstyleelement htmltablecaptionelement htmltablecellelement htmltablecolelement htmltableelement htmltablerowelement htmltablesectionelement htmltemplateelement htmltextareaelement htmltimeelement htmltitleelement htmltrackelement htmlulistelement htmlunknownelement ...
...tasktiming performancemark performancemeasure performancenavigation performancenavigationtiming performanceobserver performanceobserverentrylist performancepainttiming performanceresourcetiming performanceservertiming performancetiming periodicwave permissionstatus permissions photocapabilities plugin pluginarray point pointerevent popstateevent positionoptions processinginstruction progressevent promiserejectionevent publickeycredential publickeycredentialcreationoptions publickeycredentialrequestoptions pushevent pushmanager pushmessagedata pushregistrationmanager pushsubscription r rtcansweroptions rtccertificate rtcconfiguration rtcdtmfsender rtcdtmftonechangeevent rtcdatachannel rtcdatachannelevent rtcdtlstransport rtcerror rtcerrorevent rtcicecandidate rtciceca...

Using the aria-valuetext attribute - Accessibility
authors should only set the aria-valuetext attribute when the rendered value cannot be accurately represented as a number. for example, a slider may have rendered values of small, medium, and large. in this case, the values of aria-valuenow could range from 1 through 3, which indicate the position of each value in the value space, but thearia-valuetext would be one of the strings: small, medium, or large. ...
... simple slider for selecting a day of the week. the value of the slider is numeric, and the aria-valuetext attribute is used to provide the name of the day. the application would programmatically update aria-valuetext depending on aria-valuenow. ...

Cognitive accessibility - Accessibility
nconsistent or non-traditional web page layouts. in this document, we focus on steps developers should take to improve the cognitive accessibility of their web sites and applications. overview cognitive and intellectual disabilities cover a large spectrum, and may be momentary, temporary, or permanent conditions. for example, dementia and alzheimer's are permanent cognitive impairments that get progressively worse. other permanent cognitive impairments include aphasia, speech and language, autism, add/adhd, dyslexia, and dyscalculia. an example of a temporary cognitive impairment could be people affected by substances such as alcohol or drugs. another form it can take is depression, such as when mourning the loss of a loved one, or being momentarily saddened by a tweet or video they just saw on...
... wcag guidelines wcag, web content accessibility guidelines, includes several guidelines to improve cognitive accessibility. these guidelines are published by the web accessibility initiative (wai) of the w...

Implementing a Microsoft Active Accessibility (MSAA) Server - Accessibility
check with your assistive technology partners to find out what states you need to support. there's a very good chance they won't ask for more than the stat...
...] role_outline [important] role_outlineitem [important] role_pagetab [important] role_propertypage [important] role_indicator role_graphic [important] role_statictext [important] role_text [important] role_pushbutton [important] role_checkbutton [important] role_radiobutton [important] role_combobox [important] role_droplist [important] role_progressbar [important] role_dial role_hotkeyfield role_slider role_spinbutton role_diagram role_animation role_equation role_buttondropdown role_buttonmenu role_buttondropdowngrid role_whitespace role_pagetablist [important] role_clock role_splitbutton role_ipaddress role_nothing msaa object identifiers cheat sheet for information on...

-moz-orient - CSS: Cascading Style Sheets
for horizontal writing modes, vertically for vertical writing modes. block the element is rendered orthogonally to the axis of the text: vertically for horizontal writing modes, horizontal for vertical writing modes. horizontal the element is rendered horizontally. vertical the element is rendered vertically. ...
...orizontal the element is rendered horizontally. vertical the element is rendered vertically. formal definition initial valueinlineapplies toany element; it has an effect on progress and meter, but not on <input type="range"> or other elementsinheritednocomputed valueas specifiedanimation typediscrete formal syntax inline | block | horizontal | vertical examples html <p> the following progress meter is horizontal (the default): </p> <progress max="100" value="75"></progress> <p> the following progress meter is vertical: </p> <progress class="vert" max="100" value="75"></progress> css .vert { -moz-orient: vertical; width: 16px; height: 150px; } result specifications not part of any standard. though submitted to the w3c, with positive initial feedback, this property is ...

<easing-function> - CSS: Cascading Style Sheets
e [0, 1] or the value is invalid. keywords for common cubic-bezier easing functions ease the animation starts slowly, accelerates sharply, and then slows gradually towards the end. this keyword represents the easing function cubic-bezier(0.25, 0.1, 0.25, 1.0). it is similar to ease-in-out, though it accelerates more sharply at the beginning. ease-in the animation starts slowly, and then progressively speeds up until the end, at which point it stops abruptly. this keyword represents the easing function cubic-bezier(0.42, 0.0, 1.0, 1.0). ease-in-out the animation starts slowly, speeds up, and then slows down towards the end. this keyword represents the easing function cubic-bezier(0.42, 0.0, 0.58, 1.0). at the beginning, it behaves like the ease-in function; at the end, it is like the ...
...yword represents the easing function cubic-bezier(0.42, 0.0, 1.0, 1.0). ease-in-out the animation starts slowly, speeds up, and then slows down towards the end. this keyword represents the easing function cubic-bezier(0.42, 0.0, 0.58, 1.0). at the beginning, it behaves like the ease-in function; at the end, it is like the ease-out function. ease-out the animation starts abruptly, and then progressively slows down towards the end. this keyword represents the easing function cubic-bezier(0.0, 0.0, 0.58, 1.0). the steps() class of easing functions the steps() functional notation defines a step function dividing the domain of output values in equidistant steps.this subclass of step functions are sometimes also called staircase functions. syntax steps(number_of_steps, direction) where: ...

<gradient> - CSS: Cascading Style Sheets
the <gradient> css data type is a special type of <image> that consists of a progressive transition between two or more colors. the source for this interactive example is stored in a github repository. if you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request. a css gradient has no intrinsic dimensions; i.e., it has no natural or preferred size, nor a preferred ratio. its concrete size will match the size of the element to which it applies. syntax the <gradient> data type is defined with one of the function types listed below. linear gradient linear gradients transition colors progressively along an imaginary line. they are generated with the linear-gradient() function. radial gradient radial g...
...ed size, nor a preferred ratio. its concrete size will match the size of the element to which it applies. syntax the <gradient> data type is defined with one of the function types listed below. linear gradient linear gradients transition colors progressively along an imaginary line. they are generated with the linear-gradient() function. radial gradient radial gradients transition colors progressively from a center point (origin). they are generated with the radial-gradient() function. repeating gradient repeating gradients duplicate a gradient as much as necessary to fill a given area. they are generated with the repeating-linear-gradient() and repeating-radial-gradient() functions. conic gradient conic gradients transition colors progressively around a circle. they are generated...

linear-gradient() - CSS: Cascading Style Sheets
its result is an object of the <gradient> data type, which is a special kind of <image>. the source for this interactive example is stored in a github repository. if you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request. ...
...gle. <angle> the gradient line's angle of direction. a value of 0deg is equivalent to to top; increasing values rotate clockwise from there. <linear-color-stop> a color-stop's <color> value, followed by one or two optional stop positions, (each being either a <percentage> or a <length> along the gradient's axis). <color-hint> the color-hint is an interpolation hint defining how the gradient progresses between adjacent color stops. the length defines at which point between two color stops the gradient color should reach the midpoint of the color transition. if omitted, the midpoint of the color transition is the midpoint between two color stops. note: rendering of color stops in css gradients follows the same rules as color stops in svg gradients. note also that the first example above...

radial-gradient() - CSS: Cascading Style Sheets
its shape may be a circle or an ellipse. the function's result is an object of the <gradient> data type, which is a special kind of <image>. the source for this interactive example is stored in a github repository. if you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request. ...
...epresents the center of the gradient; the value 100% represents the intersection of the ending shape with the virtual gradient ray. percentage values in between are linearly positioned on the gradient ray. including two stop positions is equivalent to declaring two color stops with the same color at the two positions. <color-hint> th color-hint is an interpolation hint defining how the gradient progresses between adjacent color stops. the length defines at which point between two color stops the gradient color should reach the midpoint of the color transition. if omitted, the midpoint of the color transition is the midpoint between two color stops. description as with any gradient, a radial gradient has no intrinsic dimensions; i.e., it has no natural or preferred size, nor a preferred ratio.

Live streaming web audio and video - Developer guides
ite file we are relaying a file that is being created on the fly and has no pre-determined start or end. key differences between streamed and static media in this case, we are using static media to describe media that is represented by a file, whether it be an mp3 or webm file. this file sits on a server and can be delivered — like most other files — to the browser. this is often known as a progressive download. live streamed media lacks a finite start and end time as rather than a static file, it is a stream of data that the server passes on down the line to the browser and is often adaptive (see below). usually, we require different formats and special server-side software to achieve this. adaptive streaming one of the main priorities for live streaming is to keep the player synchronize...
... have this capability, we need to use formats that facilitate this. live streaming formats generally allow adaptive streaming by breaking streams into a series of small segments and making those segments available at different qualities and bit rates. streaming audio and video on demand streaming technology is not used exclusively for live streams. ...

Audio and Video Delivery - Developer guides
not displayed, create custom controls using html and css, then use javascript to link your controls to the audio/video api. if you need something extra, it's possible to add features that are not currently present in default players, such as playback rate, quality stream switches or even audio spectrums. you can also choose how to make your player responsive — for example you might remove the progress bar under certain conditions. you may detect click, touch and/or keyboard events to trigger actions such as play, pause and scrubbing. it's often important to remember keyboard controls for user convenience and accessibility. a quick example — first set up your audio and custom controls in html: <audio id="my-audio" src="http://jplayer.org/audio/mp3/miaow-01-tempered-song.mp3"></audio> <...
...basic guide to creating an html5 audio player that works cross browser, with all the associated attributes, properties and events explained, and a quick guide to custom controls created using the media api. media buffering, seeking, and time ranges sometimes it's useful to know how much <audio> or <video> has downloaded or is playable without delay — a good example of this is the buffered progress bar of an audio or video player. this article discusses how to build a buffer/seek bar using timeranges, and other features of the media api. html5 playbackrate explained the playbackrate property allows us to change the speed or rate at which a piece of web audio or video is playing. this article explains it in detail. using the web audio api explains the basics of using the web audio api to...

<video>: The Video Embed element - HTML: Hypertext Markup Language
ended playback has stopped because the end of the media was reached. loadeddata the first frame of the media has finished loading. loadedmetadata the metadata has been loaded. pause playback has been paused. play playback has begun. playing playback is ready to start after having been paused or delayed due to lack of data. progress fired periodically as the browser loads a resource. ratechange the playback rate has changed. seeked a seek operation completed. seeking a seek operation began. stalled the user agent is trying to fetch media data, but data is unexpectedly not forthcoming. suspend media data loading has been suspended. timeupdate the time ...
...s attribute, the video won't include the browser's default controls; you can create your own custom controls using javascript and the htmlmediaelement api. see creating a cross-browser video player for more details. to allow precise control over your video (and audio) content, htmlmediaelements fire many different events. in addition to providing controllability, these events let you monitor the progress of both download and playback of the media, as well as the playback state and position. you can use the object-position property to adjust the positioning of the video within the element's frame, and the object-fit property to control how the video's size is adjusted to fit within the frame. to show subtitles/captions along with your video, you can use some javascript along with the <track> ele...

SVG Presentation Attributes - SVG: Scalable Vector Graphics
pecifies whether a font should be used with some of their variation such as small caps or ligatures. value: see css font-variant; animatable: yes font-weight it specifies the weight (or boldness) of the font. value: normal|bold|lighter|bolder|100|200|300|400|500|600|700|800|900; animatable: yes glyph-orientation-horizontal deprecated since svg 2 it controls glyph orientation when the inline-progression-direction is horizontal. value: <angle>|inherit; animatable: no glyph-orientation-vertical deprecated since svg 2 it controls glyph orientation when the inline-progression-direction is vertical. value: auto|<angle>|inherit; animatable: no image-rendering it provides a hint to the browser about how to make speed vs. quality tradeoffs as it performs image processing. value: auto|optimizeq...
...pecifies the vector effect to use when drawing an object. value: default|non-scaling-stroke|inherit|<uri>; animatable: yes visibility lets you control the visibility of graphical elements. value: visible|hidden|collapse|inherit; animatable: yes word-spacing specifies spacing behavior between words. value: <length>|inherit; animatable: yes writing-mode specifies whether the initial inline-progression-direction for a <text> element shall be left-to-right, right-to-left, or top-to-bottom. value: lr-tb|rl-tb|tb-rl|lr|rl|tb|inherit; animatable: yes ...

externalResourcesRequired - SVG: Scalable Vector Graphics
sheets must be available since any style sheet might affect the rendering of that element. the externalresourcesrequired attribute is not inheritable (from a sense of attribute value inheritance), but if set on a container element, its value will apply to all elements within the container. because setting externalresourcesrequired="true" on a container element will have the effect of disabling progressive display of the contents of that container, if that container includes elements that reference external resources, authors should avoid simply setting externalresourcesrequired="true" on the outermost <svg> element on a universal basis. instead, it is better to specify externalresourcesrequired="true" on those particular graphics elements or container elements which specifically need the availa...
...rue" on those particular graphics elements or container elements which specifically need the availability of external resources in order to render properly. usage notes value false | true default value false animatable no true this value indicates that resources external to the current document are required. if an external resource is not available, progressive rendering is suspended, the document's svgload event is not fired and the animation timeline does not begin until that resource and all other required resources become available, have been parsed and are ready to be rendered. false this value indicates that resources external to the current document are optional. document rendering can proceed even if external resources are unavailable to th...

writing-mode - SVG: Scalable Vector Graphics
see the css writing-mode property for more information. ...
...see the css writing-mode property for more information. ...

SVG documentation index - SVG: Scalable Vector Graphics
deprecated, svg, svg attribute the widths attribute indicates a list of range values, each followed by one or more glyph widths. 249 word-spacing svg, svg attribute the word-spacing attribute specifies spacing behavior between words. ...
... 250 writing-mode needsexample, svg, svg attribute the writing-mode attribute specifies whether the initial inline-progression-direction for a <text> element shall be left-to-right, right-to-left, or top-to-bottom. the writing-mode attribute applies only to <text> elements; the attribute is ignored for <tspan>, <tref>, <altglyph> and <textpath> sub-elements. (note that the inline-progression-direction can change within a <text> element due to the unicode bidirectional algorithm and properties direction and unicode-bidi.) 251 x svg, svg attribute the x attribute defines a x-axis coordinate in the user coordinate system. 252 x-height deprecated, svg, svg attribute the x-height attribute indicates the height of lowercase glyphs in the font wi...

Page Loading - Archive of obsolete content
page loading on page load how to execute code each time a new page is loaded in browser/mail progress listeners progress listeners allow extensions to be notified of events associated with documents loading in the browser and with tab switching events. post data to window code to post data to an existing or new window/tab ...

Code snippets - Archive of obsolete content
d browser, which is the heart of mozilla's browser applications cookies reading, writing, modifying, and removing cookies page loading code used to load pages, reload pages, and listen for page loads interaction between privileged and non-privileged code how to communicate from extensions to websites and vice-versa. ...

Enhanced Extension Installation - Archive of obsolete content
ager checks the startup cache to see if there is another copy of the item installed at a lower install location. if there is one, then the item is uninstalled and an entry is added to the pending operations list that indicates the item at the lower install location needs to be installed. the install operation finalization process loops continuously installing, upgrading and uninstalling items at progressively lower locations until the size of the pending operations list is finally zero. little things this upgrade fixes or changes it used to not be possible to move items in the extension manager ui up and down if there were items that were from two different install locations in the list - that is there were actually two rdf containers and ordering is unique to each. by moving to a unified datas...

Chapter 3: Introduction to XUL—How to build a more intuitive UI - Archive of obsolete content
="center"> <label value="name"/> <textbox/> </row> </rows> </grid> listing 20: layout using the grid figure 16: output from listing 20 stack use the stack element to overlap multiple widgets. the stack element differs from a normal box in that all the elements in it are layered over each other, working from the bottom up. listing 21 shows an example of a thermometer-style progress bar, with its output shown in figure 17. <stack> <progressmeter mode="normal" value="50"/> <hbox align="center"> <label value="in progress…"/> </hbox> </stack> listing 21: overlapping with stack figure 17: progress bar tab use the tab element to divide multiple pages, as used in the properties dialog; use the tabbox element to group related elements. this is demonstrated in li...

Chapter 2: Technologies used in developing extensions - Archive of obsolete content
age defining the display of data marked up in xml and html. as shown in listing 1, it has an extremely simple syntax. by separating the structure of the data, expressed through html or xml, and the display style, indicated by css, data can be reused better than it is when structural and stylistic markup are both embedded in html. there are three css specifications (level 1 through level 3), with progressively powerful features. the gecko rendering engine handles nearly all of css level 2 and some of css level 3. listing 2: css code sample body { color: black; background-color: white; } p { margin-bottom: 1em; text-indent: 1em; } javascript: the world's most misunderstood language javascript is a scripting language first developed in the 1990s, at which time it was created as a way to...

Appendix F: Monitoring DOM changes - Archive of obsolete content
ht delay, or even polling, via settimeout, for cases where the url change happens before the page is fully loaded. this method works particularly well with services like google instant, and the gawker family of sites. network listeners ajax-based page changes are almost universally tied to xmlhttprequests. these requests can be tracked from chrome code using a variety of methods, including web progress listeners, http observers, and content policies. while these are not exceptionally efficient (they run for every http request, and considerably more often for some methods), they work very well for certain applications pure css pure css can be more powerful than most people suspect. it is often possible to do things for which people have traditionally resorted to javascript with css alone. in p...

The Essentials of an Extension - Archive of obsolete content
d, though. this is the information firefox and other mozilla applications need to install an add-on. any errors or missing information will cause the installation process to fail, or the extension to be installed in a disabled state. the chrome.manifest file chrome is the set of user interface elements of the application window that are outside of a window's content area. toolbars, menu bars, progress bars, and window title bars are all examples of elements that are typically part of the chrome. taken from chrome registration. in other words, the chrome is everything you see in firefox. all firefox windows can be seen as having two parts: (1) the chrome and (2) possibly a content area, like the one that displays web pages in a firefox tab. windows like the downloads window are pure chrome. ...

Tabbed browser - Archive of obsolete content
notification when a tab's attributes change requires gecko 2.0(firefox 4 / thunderbird 3.3 / seamonkey 2.1) starting in gecko 2.0, you can detect when a tab's attributes change by listening for the tabattrmodified event. the attributes to which changes result in this event being sent are: label crop busy image selected function exampletabattrmodified(even...

Promises - Archive of obsolete content
cond request. xhr = yield request(updateurl, { data: form }); // use the response of the second request. notifyuser(xhr.responsetext); }); downloading remote files nearly all previous methods of downloading remote files have been superseded by the much simpler downloads.jsm module. the downloads object provides a promise-based api for downloading remote files, with full support for progress tracking, pause and resume, and, optionally, integration with the download manager ui. representative example usage components.utils.import("resource://gre/modules/downloads.jsm"); task.spawn(function* () { // fetch a file in the background. let download_1 = downloads.fetch(url_1, path_1); // fetch a file visible in the download manager. let download_2 = yield downloads.created...

cached - Archive of obsolete content
description target eventtarget (dom element) the event target (the topmost target in the dom tree). read only. type string the type of event. read only. canbubble boolean does the event normally bubble? read only. cancelable boolean is it possible to cancel the event? read only. related events checking noupdate downloading progress cached updateready obsolete error ...

checking - Archive of obsolete content
description target eventtarget (dom element) the event target (the topmost target in the dom tree). read only. type string the type of event. read only. canbubble boolean does the event normally bubble? read only. cancelable boolean is it possible to cancel the event? read only. related events checking noupdate downloading progress cached updateready obsolete error ...

downloading - Archive of obsolete content
rty type description target eventtarget (dom element) the event target (the topmost target in the dom tree). read only. type string the type of event. read only. canbubble boolean does the event normally bubble? read only. cancelable boolean is it possible to cancel the event? read only. related events checking noupdate progress cached updateready obsolete error ...

error - Archive of obsolete content
description target eventtarget (dom element) the event target (the topmost target in the dom tree). read only. type string the type of event. read only. canbubble boolean does the event normally bubble? read only. cancelable boolean is it possible to cancel the event? read only. related events checking noupdate downloading progress cached updateready obsolete error ...

noupdate - Archive of obsolete content
description target eventtarget (dom element) the event target (the topmost target in the dom tree). read only. type string the type of event. read only. canbubble boolean does the event normally bubble? read only. cancelable boolean is it possible to cancel the event? read only. related events checking noupdate downloading progress cached updateready obsolete error ...

obsolete - Archive of obsolete content
description target eventtarget (dom element) the event target (the topmost target in the dom tree). read only. type string the type of event. read only. canbubble boolean does the event normally bubble? read only. cancelable boolean is it possible to cancel the event? read only. related events checking noupdate downloading progress cached updateready obsolete error ...

updateready - Archive of obsolete content
description target eventtarget (dom element) the event target (the topmost target in the dom tree). read only. type string the type of event. read only. canbubble boolean does the event normally bubble? read only. cancelable boolean is it possible to cancel the event? read only. related events checking noupdate downloading progress cached updateready obsolete error ...

Events - Archive of obsolete content
archived event pages domsubtreemodifiedmozaudioavailablemozbeforeresizemozorientationcachedchargingchangechargingtimechangecheckingdischargingtimechangedownloadingerrorlevelchangenoupdateobsoleteprogressupdateready ...

Download Manager preferences - Archive of obsolete content
letes. default value is 2. browser.download.manager.focuswhenstarting a boolean value that indicates whether or not to focus the download manager window when a download begins. in firefox,thunderbird and seamonkey the default value is false. in other applications the default value is true. browser.download.manager.quitbehavior indicates what should happen to in-progress downloads if the application is quit while they're ongoing. 0 indicates that the downloads should be paused and resumed automatically the next time firefox is run; 1 indicates that the downloads should be paused but will not automatically resume when the application is restarted; and 2 indicates that the downloads will be canceled on quit. default value is 0 (resume on next launch). ...

Block and Line Layout Cheat Sheet - Archive of obsolete content
if you know the answer, please pass it along to me so i can update the document. objects this section presents some of the classes involved in block and line reflow, along with important members of each object that control reflow processing. nsframe the base class for all frames. mflags flags set on the frame to indicate its state. ...

Creating a Help Content Pack - Archive of obsolete content
a.org/projects/help.../content_packs i hesitate to call it "original", tho, because i've basically rewritten the entire thing so that it's easier and faster to use to create help content. the previous document had a lot of places where ideas were simply introduced without explanation, and i've tried to go through things a bit more slowly with better descriptions. this is still very much a work in progress, tho, and i need to complete the rest of it soon (where "complete" means "use what's there that's good, build on the stuff that's not as good, and add other useful information as necessary". this document describes how to integrate html help documentation into your application using the mozilla help viewer. documentation contained in the help viewer can be accessed using any xul application or p...

Mozilla Application Framework - Archive of obsolete content
port generation, code reformatting (pretty printing), and more. dom inspector a tool for inspecting and editing the structure and widgets of your user interface while your application is running. xulmaker a gui builder currently under development that lets you drag-and-drop widgets onto a grid to build your user interface. bugzilla the mozilla bug tracking webtool to help you track progress in fixing bugs and implementing features that affect your applications. lxr a web interface to the mozilla codebase that shows you every file in the repository as well as a line-by-line breakdown of who changed which line when in each file bonsai a web interface to the checkin log that you can query for checkins between certain dates, of certain files, or by certain developers. tind...

HostWindow - Archive of obsolete content
cannot be hidden as it is the only ui to show a collapsed sidebar. when not displayed the entire sidebar area, including the splitter are hidden. note: the sidebar is currently not supported. we are considering whether to support a sidebar in future versions of prism and welcome input on this subject. status - area of the statusbar that displays the loading status message and a "percent complete" progress bar, as well as the "gear" menu that provides access to prism commands such as displaying the error console. to display the status bar, the statusbar option in webapp.ini must be set to true. command menu - a popup menu showing several prism-specific commands. ...

Rsyncing the CVS Repository - Archive of obsolete content
the mozilla.org cvs repository can be downloaded via rsync. this is useful for faster diffs or for attempting to import it into another version control system. here's how to do it: rsync -az --delete --stats cvs-mirror.mozilla.org::mozilla ~/cvs-mirror this will mirror the cvs repository into ~/cvs-mirror. optionally, the --progress option will show the progress for each file, and a percentage of the total files that are transferred. at the time of this writing, this will take 2.8 gb of disk space. note that for using this copy, the nolocks line in cvsroot/config will need to be commented out, as it requires a modified cvs binary. references thanks also to bz for telling me the exact commands that i need ...

Tamarin Roadmap - Archive of obsolete content
is a living document representing current best thinking and is subject to change. comments or questions are welcome and encouraged via the tamarin-devel mailing list. tc jan '09 feature links status integrate the tt string class tamarin:string implementation tamarin:strings bug 465506 complete enhanced c++ profiler enhance memory profiler to work in release builds and be more performant in progress enable lir for arm targets bug 460764 complete amd64 nanojit bug 464476 in progress port nanojit to powerpc bug 458077 complete add mac-x64 and linux-x64 buildbots complete fail build on assertion in acceptance tests complete merge tracking bug bug 469836 in progress tc feb '09 spring backlog tbd. ...

Elements - Archive of obsolete content
an existing element. for example, use the value 'xul:button' to create an element that is displayed like a button. the part before the colon is a namespace prefix so you must declare the xul namespace as well. not all tags have a unique display type. the following xul display types may be used: browser, button, checkbox, description, editor, grippy, iframe, image, label, menu, menuitem, menubar, progressmeter, radio, resizer, scrollbar, scrollbox, spacer, splitter, titlebar, treechildren and treecol. you may also use a number of html, mathml and svg tags. the 'display' attribute does not work unless the extends attribute is set, see bug bug 119389. in that case, put the value of the display attribute into the extends attribute. inheritstyle - the inheritstyle attribute indicates whether style ru...

XBL 1.0 Reference - Archive of obsolete content
that are registered on the bound element, an implementation of new methods and properties that become accessible from the bound element, and anonymous content that is inserted around the bound element. there are numerous adjustments in the current implementation in comparison of earlier xbl proposals, and not all of them are reflected yet in this document. the documentation process is still in progress: please keep it in your mind while using the provided information. xbl elements xbl 1.0 elements are in the http://www.mozilla.org/xbl namespace. bindings binding content children implementation constructor destructor field property getter setter method parameter body handlers handler resources stylesheet image binding attachment and detachment attachment using css a...

max - Archive of obsolete content
« xul reference home type: integer the maximum value that the scale or number box may be set to. the default value is 100 for scales and infinity for number boxes. see also progressmeter.ma ...

mode - Archive of obsolete content
see progressmeter.mode toolbar.mode treecell.mode ...

treecell.mode - Archive of obsolete content
« xul reference home mode type: one of the values below for columns that are progress meters, this determines the type of progress meter to use. none no progress meter is displayed. the cell text is displayed instead. normal the cell uses its value attribute to determine the amount of the bar that is filled in. undetermined the progressmeter is indeterminate. ...

value - Archive of obsolete content
future-proof); 3) use setuserdata() (future-proof and clean, but not easily serializable). ...

ValueChange - Archive of obsolete content
this event is used mainly for an accessibility purpose. general info specification xul interface event bubbles yes cancelable yes target element default action none properties property type description target read only eventtarget the event target (the topmost target in the dom tree). type read only domstring the type of event. ...

XUL Events - Archive of obsolete content
<tooltip> is about to become visible. the default action of the event can be prevented to prevent the popup to appear.popupshownthe popupshown event is executed when a <menupopup>, <panel> or <tooltip> has become visible.radiostatechangethe radiostatechange event is executed when the state of a <radio> element has changed.valuechangethe valuechange event is executed when the value of an element, <progress> for example, has changed. inherited dom events event description blur the opposite of the focus event, the blur event is passed after an element loses the focus. attribute: onblur change ...

accessibleType - Archive of obsolete content
xullisthead 1024 xullistheader 1025 xullistitem 100c xulmenubar 100d xulmenuitem 100e xulmenupopup 100f xulmenuseparator 1010 xulpane 1011 xulprogressmeter 1012 xulscale 1013 xulstatusbar 1014 xulradiobutton 1015 xulradiogroup 1016 xultab 1017 xultabbox 1018 xultabs 1019 xultext 101a ...

Property - Archive of obsolete content
thscroll spinbuttons src state statusbar statustext stringbundle strings style subject suppressonselect tabcontainer tabindex tabs tabscrolling tabpanels tag textlength textvalue timeout title toolbarname toolbarset tooltip tooltiptext top treeboxobject type uri useraction value valuenumber view webbrowserefind webnavigation webprogress width wizardpages wraparound year yearleadingzero related dom element properties dom:element.attributes dom:element.baseuri dom:element.childelementcount dom:element.childnodes dom:element.children dom:element.clientheight dom:element.clientleft dom:element.clienttop dom:element.clientwidth dom:element.clonenode dom:element.firstchild dom:element.firstelementch...

The Joy of XUL - Archive of obsolete content
"bindings" for xul widgets. with xbl, developers can define new content for xul widgets, add additional event handlers to a xul widget, and add new interface properties and methods. essentially, xbl empowers developers with the ability to extend xul by customizing existing tags and creating new tags of their own. by using xbl, developers can easily build custom user interface widgets such as progress meters, fancy pop-up menus, and even toolbars and search forms. these custom components can then be used in xul applications by specifying the custom tag and associated attributes. overlays overlays are xul files used to describe extra content for the ui. they are a general mechanism for adding ui for additional components, overriding small pieces of a xul file without having to r...

Tree Widget Changes - Archive of obsolete content
cleheader(column), since the code can get the element from the column object. the constants below have been changed, and their integer values are different: nsitreeview.indropbefore -> nsitreeview.drop_before (-1) nsitreeview.indropon -> nsitreeview.drop_on (0) nsitreeview.indropafter -> nsitreeview.drop_after (1) nsitreeview.progressnormal -> nsitreeview.progress_normal (1) nsitreeview.progressundetermined -> nsitreeview.progress_undetermined (2) nsitreeview.progressnode -> nsitreeview.progress_none (3) as well, the drag and drop methods candropon and candropbeforeafter have been replaced with a single method candrop(idx,orientation) which handles both. it should return true if a drop is al...

Creating an Installer - Archive of obsolete content
in an install trigger which is a small piece of script which launches the install. the user is presented with a dialog which indicates the package being installed. it is possible for the install trigger to launch multiple installers. in this case, they will be presented in a list. the user may choose to continue or cancel. if the user chooses to continue, the installer xpi file is downloaded. a progress bar is displayed to the user during this process. the file install.js is extracted from the install archive and executed. this script will call install functions which will indicate which files from the archive should be installed. once the script is complete, the new package has been installed. if multiple packages are being installed, their scripts will run in sequence. install triggers as...

List Controls - Archive of obsolete content
« previousnext » ...

Localization - Archive of obsolete content
a dtd file has been included near the beginning of t...

Skinning XUL Files by Hand - Archive of obsolete content
the chrome registry and change the global skin. and with the advent of new css2 conventions like positioning, the changes you can make to the presentation and behavior of the basic structure in a xul file is dramatic. the syntax for creating all this information with text -- added to the distributed nature and the sheer volume of text required to define a single chrome -- can sometimes make the progress seem slow. but the advantages of using xul so far outweigh those of using the standard c++ toolkits that xul authoring should rightfully be considered in a separate category of development. xul represents, as one evangelist put it, the "democratization" of interface design and ofapplications development, about which we will have more to say in a later article. in short, xul provides the tools fo...

Stacks and Decks - Archive of obsolete content
aning on a stack as children are laid out above each other rather than from side to side. the size of the stack is determined by its largest child, but you can use the css properties width, height, min-width and other related properties on both the stack and its children. the stack element might be used for cases where a status indicator needs to be added over an existing element. for example, a progress bar might be created using a bar and a label overlaid on top of it. shadowing with stacks one convenient use of the stack element however is that you could emulate a number of css properties with it. for example, you could create an effect similar to the text-shadow property with the following: example 1 : source view <stack> <description value="shadowed" style="padding-left: 1px; padding-t...

Tabboxes - Archive of obsolete content
to our find files dialog let's add a second panel to the find files dialog. we'll create an options tab (and select it by default) that will contain some options for searching. this may not be the best interface for doing this, but we'll use it to demonstrate tabs. the label across the top and the search criteria box will need to go on the first tab. we'll add some options on the second tab. the progress bar and the buttons can stay on the main dialog, outside of the tabs. <vbox flex="1"> <tabbox selectedindex="1"> <tabs> <tab label="search"/> <tab label="options"/> </tabs> <tabpanels> <tabpanel id="searchpanel" orient="vertical"> <description> enter your search criteria below and select the find button to begin the search. </description> <spacer style=...

Tree View Details - Archive of obsolete content
{ item[2] = true; var label = this.visibledata[idx][0]; var toinsert = this.childdata[label]; for (var i = 0; i < toinsert.length; i++) { this.visibledata.splice(idx + i + 1, 0, [toinsert[i], false]); } this.treebox.rowcountchanged(idx + 1, toinsert.length); } this.treebox.invalidaterow(idx); }, getimagesrc: function(idx, column) {}, getprogressmode : function(idx,column) {}, getcellvalue: function(idx, column) {}, cycleheader: function(col, elem) {}, selectionchanged: function() {}, cyclecell: function(idx, column) {}, performaction: function(action) {}, performactiononcell: function(action, index, column) {}, getrowproperties: function(idx, prop) {}, getcellproperties: function(idx, column, prop) {}, getcolumnproperti...

Trees - Archive of obsolete content
r the bookmarks window in mozilla. in some ways, a tree has some similarities with the listbox. both can be used to create tables of data with multiple rows and columns, and both may contain column headers. the tree also supports nested rows, whereas the listbox does not. however, listboxes may contain any type of content, whereas trees may only contain text and images. (using advanced features, progress meters or checkboxes also can be added to the tree) a tree consists of two parts, the set of columns, and the tree body. the set of columns is defined by a number of treecol elements, one for each column. each column will appear as a header at the top of the tree. the second part, the tree body, contains the data to appear in the tree and is created with a treechildren tag. the tree is uni...

XUL Tutorial - Archive of obsolete content
this tutorial describes xul, the xml user-interface language. this language was created for the mozilla application and is used to describe its user interface. ...

Using the Editor from XUL - Archive of obsolete content
hell.loadurl(url); loading the document in the <iframe> of course happens asynchronously, so we need to know when we have a document that we can start editing. nseditorshell is able to observe the document load on the <iframe>, because it implements nsidocumentloaderobserver, and registered itself as a doc loader when it was assigned the content window. it thus gets callbacks for the start, progress, and end of the document load. note: these callbacks also fire for every subdocument that loads as a result of the parent document load, for example with frameset documents, or html documents with their own embedded <iframe>s. in this case, we need to be careful to instantiate the editor on the correct document. we are currently only able to have one editor per composer window; in future, rela...

The Implementation of the Application Object Model - Archive of obsolete content
dropped the z from its name and replaced it with an x, and upon doing so, transformed into something far worse than a demon. it became a markup language. xul stands for "extensible user interface language". it is an xml-based language for describing the contents of windows and dialogs. xul has language constructs for all of the typical dialog controls, as well as for widgets like toolbars, trees, progress bars, and menus. where html describes the contents of a single document, xul describes the contents of an entire window (which could itself contain multiple html documents). the html content tree structure for a single document is represented as a set of objects that can be accessed and manipulated. this is referred to as the dom (document object model). in a similar fashion, xul's content tree f...

XML - Archive of obsolete content
what does xul have to do with xml? this article describes the relationship of xul to xml, its parent language. xul syntax & rules xul is a standards-based interface definition language. it attempts to balance precise control of layout with flexibility and ease of use, and in this respect it does a great job. using a combination of xul's ready-made widgets (e.g., menubar, scrollbar, progressmeter, and so on) and xul's incorporation of such standards as html4, dom1/2, and cascading stylesheets, you can design any interface that you can imagine, using any number of different features, tools, and methodologies. there are many times, for example, when you may use javascript tricks to add extra behavior. but the necessary tradeoff for xul's flexibility is a lack of implicit functionality -- the lack ...

XUL controls - Archive of obsolete content
ay be modified directly or values not in the popup list may be entered. <menulist editable="true"> <menupopup> <menuitem label="elephants"/> <menuitem label="kangaroos"/> <menuitem label="bats" /> </menupopup> </menulist> more information about the editable menulist element. menulist reference related elements: menupopup menuitem <progressmeter> a progress meter is used to display the progress of a lengthy task. <progressmeter value="40"/> more information about the progressmeter element. progressmeter reference <radio> a radio button is used when only one of a set of options may be selected at a time. <radiogroup> <radio label="light" value="light"/> <radio label="heav...

elements - Archive of obsolete content
ription dialog dialogheader e editor grid grippy groupbox h hbox i iframe image k key keyset l label listbox listcell listcol listcols listhead listheader listitem m member menu menubar menuitem menulist menupopup menuseparator o observes overlay p page popup popupset preference preferences prefpane prefwindow progressmeter r radio radiogroup resizer richlistbox richlistitem resizer row rows rule s script scrollbar scrollbox scrollcorner separator spacer splitter stack statusbar statusbarpanel stringbundle stringbundleset t tab tabbrowser tabbox tabpanel tabpanels tabs template textnode textbox titlebar toolbar toolbarbutton toolbargrippy...

statusbar - Archive of obsolete content
« xul reference home [ examples | attributes | properties | methods | related ] an element used to create a status bar, usually placed along the bottom of a window. it is virtually equivalent to a standard box, but may be rendered differently. contains statusbarpanels. ...

<statusbarpanel> - Archive of obsolete content
ut not both. this element is often used with a short label or icon to indicate status, for instance whether the user is online or whether there are new messages. attributes crop, image, label properties image, label style classes statusbarpanel-iconic, statusbarpanel-iconic-text, statusbarpanel-menu-iconic examples <statusbar> <statusbarpanel label="left panel"/> <spacer flex="1"/> <progressmeter mode="determined" value="82"/> <statusbarpanel label="right panel"/> </statusbar> attributes crop type: one of the values below if the label of the element is too big to fit in its given space, the text will be cropped on the side specified by the crop attribute. an ellipsis will be used in place of the cropped text. if the box direction is reversed, the croppin...

treecell - Archive of obsolete content
der for this to work. the tree must be a content tree for this to work on treecells. label type: string the label that will appear on the element. if this is left out, no text appears. for an editable menuitem element the value of this attribute is copied to the menulist.value property upon user selection of the menuitem. mode type: one of the values below for columns that are progress meters, this determines the type of progress meter to use. none no progress meter is displayed. the cell text is displayed instead. normal the cell uses its value attribute to determine the amount of the bar that is filled in. undetermined the progressmeter is indeterminate. properties type: space-separated list of property names sets the properties of the element, wh...

treecol - Archive of obsolete content
ust be used on the treecol element for the image to appear. you should still specify a label for use in the column picker if ignoreincolumnpicker is not true and hidecolumnpicker is not true on the tree. type type: one of the values below the type of tree column. the default is a text column that displays the content as text. checkbox the content of the columns are checkboxes. progressmeter the content of the columns are a progress meters. this is used in mozilla's download manager window. text the content of the columns is text. width type: string (representing an integer) the preferred width of the tree column. the value should not include a unit as all values are in pixels. specifying widths for your columns causes gecko to allow the tree to be scrolled h...

Gecko Compatibility Handbook - Archive of obsolete content
e is to be laid out in a fashion compatible with the older browsers or if it is to be laid out in a fashion compatible with the w3 standards. using the appropriate doctype in an html document allows a web page author to continue to support the older, less compliant browsers while also supporting the newer, more compliant browsers by specifiying special quirks mode layout via the doctype. as time progresses and the older browsers drop in market share, web page authors can transition to standards-based layout by using the appropriate doctype. (related article) while doctype sniffing is a useful means of continuing to support the older browsers, it can be a problem for newer browsers such as netscape 6.x and netscape 7.x if an inappropriate layout mode is specified. gecko has two layout modes: qui...

Mozilla release FAQ - Archive of obsolete content
ually needs -- certain images may be shared between several pages, the user may have images turned off or lack capabilities to use a certain type of media. dynamically generated pages make this nearly impossible. devising a system that would handle all of these situations would make web servers more complex, slower, and likely hurt the transfer time that this proposal is attempting to save. also, progressive display of the webpage would be completely gone with this idea. for these reasons, this is generally considered a bad idea. i'd like to port mozilla to xxxos. any advice? if you're targeting a relatively recent unix, you probably will have very few problems. otherwise, the more unixlike the target system is, the easier your port will go. i would suggest that before you devote much time and eff...

Mozilla.dev.apps.firefox-2006-10-06 - Archive of obsolete content
discussions firefox trunk and rc1 slowdown using tabs discussion regarding certain theme components (specifically alpha-transparency) creating a high cpu load on os/2. ...

2006-10-06 - Archive of obsolete content
discussions firefox trunk and rc1 slowdown using tabs discussion regarding certain theme components (specifically alpha-transparency) creating a high cpu load on os/2. ...

2006-11-17 - Archive of obsolete content
ser want to add a filter to his tb, so that it could color the mail that is for a particular recepient, however, the regular expression that he uses doesn't work and want suggestion from others. a few suggestion is posted. what file format is tb's address book using? tb's address book uses mork (file format). there are also some perl code provided in this link. how to get review for work-in-progress patch? answer: cc whoever you need review from, but don't post a formal review. steps for posting a formal review is provided also. how to access xyz.properties items more detail and code examples are provided in the posting. how to create top-level folders in inbox with an imap account on courier server. solution is provided by jay lee should there be an additional options for account c...

Extentsions FAQ - Archive of obsolete content
has anyone experienced problem with update that it only considers themes and extensions during the update check, ignoring langpacks with firefox 2.0? what language does it require to write xpcom/xpconnect component that able to intercept,process and redirect http request? when does content become available in the cache? can "partial" data be read from the cache while the request is still in progress?how difficult is to write a firefox extensions that does intercetp, process and redirect http request? can anyone point me to any good tutorials that may help me get started? where to modify the email addresses being returned by an ldap address book? friday, october 13 - 20, 2006 (↑ top) is there an extension or script get the actual link of a redirected zip file? which mozilla objec...

NPP_NewStream - Archive of obsolete content
ction npn_geturl. the browser calls npp_destroystream when the stream completes (either successfully or abnormally). the plug-in can terminate the stream itself by calling npn_destroystream. the parameter stype defines the mode of the stream. values: np_normal (default): delivers stream data to the instance in a series of calls to npp_writeready and npp_write. the plug-in can process the data progressively as it arrives from the network or file system. np_asfileonly: the browser saves stream data to a file in the local cache. when the stream is complete, the browser calls npp_streamasfile to deliver the path of the file to the plug-in. if the stream comes from a local file, the npp_write and npp_writeready functions are not called. npp_streamasfile is simply called immediately. this mode allo...

NPP_Write - Archive of obsolete content
int32 npp_write(npp instance, npstream* stream, int32 offset, int32 len, void* buf); parameters the function has the following parameters: instance pointer to the current plug-in instance. stream pointer to the current stream. offset offset in bytes of buf from the beginning of the data in the stream. can be used to check stream progress or by range requests from npn_requestread. len length in bytes of buf; number of bytes accepted. buf buffer of data, delivered by the stream, that contains len bytes of data offset bytes from the start of the stream. the buffer is allocated by the browser and is deleted after returning from the function, so the plug-in should make a copy of the data it needs to keep. returns the plug-in shoul...

Common Firefox theme issues and solutions - Archive of obsolete content
operty. use css standard transition property instead (supported by firefox since firefox 4). resources amo editors theme testing guidelines when developing and testing your themes, please refer to the theme testing guidelines amo editors use to review themes. this guide will help you thoroughly test your theme to find and fix issues before you push updates to amo. this is document is a work in progress so feedback and/or suggestions is appreciated. mdn css reference mozilla's developer network maintains a great css reference. amo themes forum we'd like to encourage you to participate in the amo (addons.mozilla.org) forums theme forum. mozillazine themes forum mozillazine is not an official mozilla website, but it does have the largest community of firefox theme developers and is a great ...

Using IO Timeout And Interrupt On NT - Archive of obsolete content
equests, so the timeouts are all handled at the nspr level.) in this case, the error is <tt>pr_io_timeout_error</tt>. if the thread gets interrupted by another thread's <tt>pr_interrupt()</tt> call. in this case, the error is <tt>pr_pending_interrupt_error</tt>. these two errors are generated by the nspr layer, so the os is oblivious of what is going on and the overlapped io request is still in progress. the os still has a pointer to the overlapped buffer in the thread's <tt>prthread</tt> structure. if the thread subsequently exists and its <tt>prthread</tt> structure gets deleted, the pointer to the overlapped buffer will be pointing to freed memory. this is problematic. canceling overlapped io by closing the file descriptor therefore, we need to cancel the outstanding overlapped io request ...

::-ms-fill-upper - Archive of obsolete content
y outline-color outline-style outline-width padding-bottom padding-left padding-right padding-top transform transform-origin visibility width syntax ::-ms-fill-upper specifications not part of any specification. browser compatibility historically supported in internet explorer and edge before version 79. see also ::-ms-fill-lower ::-ms-track ::-ms-thumb ::-moz-range-progress css-tricks: styling cross-browser compatible range inputs with css quirksmode: styling and scripting sliders ...

XForms Custom Controls - Archive of obsolete content
following information, a good understanding of xforms, xbl, javascript and css is needed. xpcom knowledge will certainly not hurt. but even if you are only comfortable with a couple of these technologies, we hope that the possibilities outlined below will inspire you to learn more where you need to. implementation status the framework we use in the mozilla xforms processor is very much a "work in progress". please keep in mind that just about everything we mention here may change to some degree as we continue to work on it. work has just started in the w3c xforms working group to investigate the custom control issue, so eventually (hopefully?) there will be an "official" and common way to customize your form's user interface across all xforms processors. why do you need this you will probably find...

Implementation Status - Archive of obsolete content
ut 2010! limitations and extensions the extension has some limitations and custom extension to the xforms 1.1 specification. these can be found on the mozilla xforms specials page. specification chapter index here we give an overview of xforms 1.1 specification chapters and the current status of the mozilla support. the sections are marked with their current status: supported, partial support, in progress, and not currently supported. we have listed the most relevant bugs here, but check out the bugzilla xforms buglist for the complete list. 3. document structure section title status notes bugs 3.1 namespaces supported 3.2.1 common attributes supported 3.2.

Choosing Standards Compliance Over Proprietary Practices - Archive of obsolete content
ed international standards will make cross-functional integration possible. adopting standards will not only help an organizations end users enjoy a cross application experience; organizations will help themselves by giving development and quality assurance engineers the tools to become better equipped and flexible. lastly, by following a series of standards, organizations can more easily measure progress, performance, and results across the organization. the most compelling dilemma is how an organization chooses to follow open external standards vs. a proprietary de facto standard. following proprietary de facto standards leaves an organization vulnerable and open to obsolescence when the owner of the de facto changes focus or direction, or abandons the de facto altogether and renders the standa...

Index - Game development
more than one life to the player. they could make a mistake or two and still be able to finish the game. we could also improve our code rendering. 65 game over beginner, canvas, games, graphics, javascript, tutorial, game over it's fun to watch the ball bouncing off the walls and be able to move the paddle around, but other than that the game does nothing and doesn't have any progression or end goal. it would be good from the gameplay point of view to be able to lose. the logic behind losing in breakout is simple. if you miss the ball with the paddle and let it reach the bottom edge of the screen, then it's game over. 66 mouse controls beginner, canvas, controls, games, javascript, tutorial, mouse the game itself is actually finished, so let's work on poli...

Game over - Game development
« previousnext » this is the 5th step out of 10 of the gamedev canvas tutorial. you can find the source code as it should look after completing this lesson at gamedev-canvas-workshop/lesson5.html. it's fun to watch the ball bouncing off the walls and be able to move the paddle around, but other than that the game does nothing and doesn't have any progression or end goal. it would be good from the gameplay point of view to be able to lose. the logic behind losing in breakout is simple. if you miss the ball with the paddle and let it reach the bottom edge of the screen, then it's game over. implementing game over let's try to implement game over in our game. here's the piece of code from the third lesson where we made the ball bounce off the walls: if(x + dx > canvas.width-ballrad...

Decryption - MDN Web Docs Glossary: Definitions of Web-related terms
cific algorithm and a secret, called the key. since the algorithm is often public, the key must stay secret if the encryption stays secure. decryption is the reverse of encryption and if the key stays secret, decryption without knowing the specific secret, decryption is mathematically hard to perform. how hard depends on the security of the cryptographic algorithm chosen and evolves with the progress of cryptanalysis. learn more technical reference encryption and decryption ...

Encryption - MDN Web Docs Glossary: Definitions of Web-related terms
led a cipher. encryption in modern ciphers is performed using a specific algorithm and a secret, called the key. since the algorithm is often public, the key must stay secret if the encryption stays secure. without knowing the secret, the reverse operation, decryption, is mathematically hard to perform. how hard depends on the security of the cryptographic algorithm chosen and evolves with the progress of cryptanalysis. learn more learn more about encryption and decryption ...

Graceful degradation - MDN Web Docs Glossary: Definitions of Web-related terms
alternatives to features like styling and layout should be provided where possible, for example by using the css cascade, or html fallback behaviour. some good examples can be found in handling common html and css problems. it is a useful technique that allows web developers to focus on developing the best possible websites, given that those websites are accessed by multiple unknown user-agents. progressive enhancement is related but different — often seen as going in the opposite direction to graceful degredation. in reality both approaches are valid and can often complement one another. ...

Mobile First - MDN Web Docs Glossary: Definitions of Web-related terms
the rationale behind the mobile-first approach is to provide users with good user experiences at all screen sizes—by starting with creating a user experience that works well on small screens, and then building on top of that to further enrich the user experience as the screen size increases. the mobile-first approach contrasts with the older approach of designing for desktop screen sizes first, and then only later adding some support for small screen sizes. ...

Modern web apps - MDN Web Docs Glossary: Definitions of Web-related terms
see progressive web apps ...

Time to interactive - MDN Web Docs Glossary: Definitions of Web-related terms
tti, proposed by the web incubator community group in 2018, is intended to provide a metric that describes when a page or application contains useful content and the main thread is idle and free to respond to user interactions, including having event handlers registered. caveat: tti is derived by leveraging information from the long tasks api. ...

MDN Web Docs Glossary: Definitions of Web-related terms
parse parser pdf perceived performance percent-encoding php pixel placeholder names plaintext png polyfill polymorphism pop3 port prefetch preflight request prerender presto primitive privileged privileged code progressive enhancement progressive web apps promise property property (css) property (javascript) protocol prototype prototype-based programming proxy server pseudo-class pseudo-element pseudocode public-key cryptography python q quality values qu...

HTML: A good basis for accessibility - Learn web development
to find this content!</p> <h2>my 2nd subheading</h2> <p>this is the second subsection of my content. i think is more interesting than the last one.</p> we've prepared a version with longer text for you to try out with a screen reader (see good-semantics.html). if you try navigating through this, you'll see that this is pretty easy to navigate: the screen reader reads each header out as you progress through the content, notifying you what a heading is, what is a paragraph, etc. it stops after each element, letting you go at whatever pace is comfortable for you. you can jump to the next/previous heading in many screen readers. you can also bring up a list of all headings in many screen readers, allowing you to use them as a handy table of contents to find specific content. people sometim...

HTML: A good basis for accessibility - Learn web development
to find this content!</p> <h2>my 2nd subheading</h2> <p>this is the second subsection of my content. i think is more interesting than the last one.</p> we've prepared a version with longer text for you to try out with a screen reader (see good-semantics.html). if you try navigating through this, you'll see that this is pretty easy to navigate: the screen reader reads each header out as you progress through the content, notifying you what a heading is, what is a paragraph, etc. it stops after each element, letting you go at whatever pace is comfortable for you. you can jump to the next/previous heading in many screen readers. you can also bring up a list of all headings in many screen readers, allowing you to use them as a handy table of contents to find specific content. people sometim...

What is accessibility? - Learn web development
notes designing with cognitive accessibility will lead to good design practices. they will benefit everyone. many people with cognitive impairments also have physical disabilities. websites must conform with t...

Handling different text directions - Learn web development
tally, and by default the web tends to support left-to-right languages (e.g. english or french) better than right-to-left languages (such as arabic). in recent years however, css has evolved in order to better support different directionality of content, including right-to-left but also top-to-bottom content (such as japanese) — these different directionalities are called writing modes. as you progress in your study and begin to work with layout, an understanding of writing modes will be very helpful to you, therefore we will introduce them now. prerequisites: basic computer literacy, basic software installed, basic knowledge of working with files, html basics (study introduction to html), and an idea of how css works (study css first steps.) objective: to understand th...

CSS building blocks - Learn web development
nts, background images, and rounded corners, backgrounds and borders are the answer to a lot of styling questions in css. handling different text directions in recent years, css has evolved in order to better support different directionality of content, including right-to-left but also top-to-bottom content (such as japanese) — these different directionalities are called writing modes. as you progress in your study and begin to work with layout, an understanding of writing modes will be very helpful to you, therefore we will introduce them in this article. overflowing content in this lesson we will look at another important concept in css — overflow. overflow is what happens when there is too much content to be contained comfortably inside a box. in this guide, you will learn what it is an...

What is a web server? - Learn web development
rtext (linked web documents) between two computers. a protocol is a set of rules for communication between two computers. http is a textual, stateless protocol. textual all commands are plain-text and human-readable. stateless neither the server nor the client remember previous communications. for example, relying on http alone, a server can't remember a password you typed or remember your progress on an incomplete transaction. you need an application server for tasks like that. (we'll cover that sort of technology in other articles.) http provides clear rules for how a client and server communicate. we'll cover http itself in a technical article later. for now, just be aware of these things: only clients can make http requests, and then only to servers. servers can only respond to a c...

HTML forms in legacy browsers - Learn web development
al". there are so many cases where we want forms that are "nicer" or "with advanced functionality", but building efficient html forms is not a question of design or technology. rather, it's about simplicity, intuitivess, and ease of user interaction. the tutorial, forms usability on ux for the masses, explains it well. graceful degradation is web developer's best friend graceful degradation and progressive enhancement are development patterns that allow you to build great stuff by supporting a wide range of browsers at the same time. when you build something for a modern browser, and you want to be sure it will work, one way or another, on legacy browsers, you are performing graceful degradation. let's see some examples related to html forms. html input types the input types added in html5 ar...

Sending forms through JavaScript - Learn web development
let's first talk about why this requires a different approach. ...

Styling web forms - Learn web development
ribe how to handle these more specific features in the article advanced form styling. the ugly some elements can't be styled thoroughly using css. these include: <input type="color"> date-related controls such as <input type="datetime-local"> <input type="range"> <input type="file"> elements involved in creating dropdown widgets, including <select>, <option>, <optgroup> and <datalist>. <progress> and <meter> again, we'll describe what can be done in terms of styling these elements in advanced form styling. the real problem with all these controls is that they have a very complex structure, and beyond some basic styling (such as changing the width or margin of the control) you generally don't have the ability to style the controls' internal components (such as the date picker calendar,...

UI pseudo-classes - Learn web development
. also mentioned above radios/checkboxes will be matched by the :indeterminate pseudo-class when they are in a state where they are neither checked nor unchecked. but what does this mean? elements that are indeterminate include: <input/radio> inputs, when all radio buttons in a same-named group are unchecked <input/checkbox> inputs whose indeterminate property is set to true via javascript <progress> elements that have no value. this isn't something you'll likely use very often. one use case could be an indicator to tell users that they really need to select a radio button before they move on. let's look at a couple of modified versions of the previous example that remind the user what the default option was, and style the radio buttons when indeterminate. both of these have the following...

Web forms — Working with user data - Learn web development
es here we continue our deep dive into the <input> element, looking at the additional input types provided when html5 was released, and the various ui controls and data collection enhancements they provide. additionally, we look at the <output> element. other form controls next we take a look at all the non-<input> form controls and associated tools, such as <select>, <textarea>, <meter>, and <progress>. form styling guides styling web forms this article provides an introduction to styling forms with css, including all the basics you might need to know for basic styling tasks. advanced form styling here we look at some more advanced form styling techniques that need to be used when trying to deal with some of the more difficult-to-style form elements. ui pseudo-classes an introducti...

CSS basics - Learn web development
hat will have text inside the html body (<h1>, <li>, and <p>). we'll also center the heading. finally, let's expand the second ruleset (below) with settings for line height and letter spacing to make body content more readable. h1 { font-size: 60px; text-align: center; } p, li { font-size: 16px; line-height: 2; letter-spacing: 1px; } adjust the px values as you like. your work-in-progress should look similar to this: css: all about boxes something you'll notice about writing css: a lot of it is about boxes. this includes setting size, color, and position. most html elements on your page can be thought of as boxes sitting on top of other boxes. css layout is mostly based on the box model. each box taking up space on your page has properties like: padding, the space around...

JavaScript basics - Learn web development
an opportunity to play with a few browser api features too. have fun! a hello world! example javascript is one of the most popular modern web technologies! as your javascript skills grow, your websites will enter a new dimension of power and creativity. however, getting comfortable with javascript is more challenging than getting comfortable with html and css. you may have to start small, and progress gradually. to begin, let's examine how to add javascript to your page for creating a hello world! example. (hello world! is the standard for introductory programming examples.) important: if you haven't been following along with the rest of our course, download this example code and use it as a starting point. go to your test site and create a new folder named scripts. within the scripts fo...

The web and web standards - Learn web development
. in short, we are trying to make the web work for all, as much as possible. you'll come across the below concepts at some point in your studies. cross-browser compatibility is the practice of trying to make sure your webpage works across as many devices as possible. this includes using technologies that all the browsers support, delivering better experiences to browsers that can handle them (progressive enhancement), and/or writing code so that it falls back to a simpler but still usable experience in older browsers (graceful degradation). it also involves a lot of testing to see if anything fails in certain browsers, and then more work to fix those failures. responsive web design is the practice of making your functionality and layouts flexible so they can automatically adapt to different b...

Tips for authoring fast-loading HTML pages - Learn web development
, should be initially disabled, and then only enabled after the page has loaded. this will cause the javascript to be loaded after the page contents, which will improve the overall appearance of the page load. reduce the number of inline scripts inline scripts can be expensive for page loading since the parser must assume that an inline script could modify the page structure while parsing is in progress. reducing the use of inline scripts in general, and reducing the use of document.write() to output content in particular, can improve overall page loading. use modern ajax methods to manipulate page content for modern browsers, rather than the older approaches based on document.write(). use modern css and valid markup use of modern css reduces the amount of markup, can reduce the need for (spac...

Use JavaScript within a webpage - Learn web development
javascript can make your website more accessible if you use it wisely, or it can become a disaster if you use scripting without care. to make javascript work in your favor, it's worth knowing about certain best practices for adding javascript: make all content available as (structured) text. rely on html for your content as much as possible. for example, if you've implemented a nice javascript progress bar, make sure to supplement it with matching text percentages inside the html. likewise, your drop-down menus should be structured as unordered lists of links. make all functionality accessible from the keyboard. let users tab through all controls (e.g., links and form input) in a logical order. if you use pointer events (like mouse events or touch events), duplicate the functionality ...

Introducing asynchronous JavaScript - Learn web development
nd then() block. try fixing this now. note: if you get stuck, you can find an answer here (see it running live also). you can also find a lot more information on promises in our graceful asynchronous programming with promises guide, later on in the module. conclusion in its most basic form, javascript is a synchronous, blocking, single-threaded language, in which only one operation can be in progress at a time. but web browsers define functions and apis that allow us to register functions that should not be executed synchronously, and should instead be invoked asynchronously when some kind of event occurs (the passage of time, the user's interaction with the mouse, or the arrival of data over the network, for example). this means that you can let your code do several things at the same time w...

Cooperative asynchronous JavaScript: Timeouts and intervals - Learn web development
portant to know that you can (and often will) run other code before a settimeout() call executes, or between iterations of setinterval(). depending on how processor-intensive these operations are, they can delay your async code even further, as any async code will execute only after the main thread is available. (in other words, when the stack is empty.) you will learn more on this matter as you progress through this article. in any case, these functions are used for running constant animations and other background processing on a web site or application. in the following sections we will show you how they can be used. settimeout() as we said before, settimeout() executes a particular block of code once after a specified time has elapsed. it takes the following parameters: a function to ru...

Fetching data from the server - Learn web development
rking on. xhr has been around for a long time now and has very good cross-browser support. fetch and promises, on the other hand, are a more recent addition to the web platform, although they're supported well across the browser landscape, with the exception of internet explorer. if you need to support older browsers, then an xhr solution might be preferable. if however you are working on a more progressive project and aren't as worried about older browsers, then fetch could be a good choice. you should really learn both — fetch will become more popular as internet explorer declines in usage (ie is no longer being developed, in favor of microsoft's new edge browser), but you might need xhr for a while yet. a more complex example to round off the article, we'll look at a slightly more complex...

What went wrong? Troubleshooting JavaScript - Learn web development
...

Getting started with Ember - Learn web development
d an interface to integrating with other libraries or systems. for example, the router (which will be mentioned later in this tutorial) is a service. components and services make up the majority of any emberjs application. use cases generally, emberjs works well for building apps that desire either or both of the following traits: single page applications, including native-like web apps, and progressive web apps (pwas) ember works best when it is the entire front end of your application. increasing cohesion among many team's technology stacks community-backed "best practices" allow for faster long-term development speed. ember has clear conventions that are useful for enforcing consistency and helping team members get up to speed quickly. ember with add-ons emb...

Ember interactivity: Events, classes and state - Learn web development
s: <label>buy movie tickets</label> update this line to use the argument @todo — which will represent the todo that we passed in to this component when it was invoked in todo-list.hbs, in the line <todo @todo={{todo}} />: <label>{{@todo.text}}</label> ok, try it again. you should find that now the text submitted in the <input> is properly reflected in the ui: summary ok, so that's great progress for now. we can now add todo items to our app, and the state of the data is tracked using our service. next we'll move on to getting our footer functionality working, including the todo counter, and look at conditional rendering, including correctly styling todos when they've been checked. we'll also wire up our "clear completed" button. previous overview: client-side javascript frameworks...

Deployment and next steps - Learn web development
. compressing objects: 100% (5/5), done. writing objects: 100% (5/5), 541 bytes | 541.00 kib/s, done. total 5 (delta 3), reused 0 (delta 0) to gitlab.com:opensas/mdn-svelte-todo.git 7dac9f3..5725f46 master -> master whenever there's a job running gitlab will display an icon showing the process of the job. clicking on it will let you inspect the output of the job. you can also check the progress of the current and previous jobs from the ci / cd > jobs menu option of your gitlab project. once gitlab finishes building and publishing your app, it will be accessible at https://your-user.gitlab.io/mdn-svelte-todo/; in my case it's https://opensas.gitlab.io/mdn-svelte-todo/. you can check your page's url in gitlab's ui — see the settings > pages menu option. with this configuration, when...

Dynamic behavior in Svelte: working with variables and props - Learn web development
do) and the result will be passed as a handler, which is not what we had in mind. in this case you have to specify on:click={() => removetodo(todo)} as the handler. if removetodo() received no params, you could use on:event={removetodo}, but not on:event={removetodo()}. this is not some special svelte syntax — here we are just using regular javascript arrow functions. again, this is good progress — at this point, we can now delete tasks. when a todo item's delete button is pressed, the relevant todo is removed from the todos array, and the ui updates to no longer show it. in addition, we can now check the checkboxes, and the completed status of the relevant todos will now update in the todos array. however, the "x out of y items completed" heading is not being updated. read on to find ...

Deploying our app - Learn web development
more specifically, a url to view your project online and to share it with your friends, family, and colleagues. deploying to hosting tends to be at the tail-end of the project life cycle, but with services such as netlify bringing down the cost of deployments (both in financial terms and also the time required to actually deploy) it's possible to deploy during development to either share work in progress or to have a pre-release for some other purpose. netlify, amongst other things, also allows you to run pre-deployment tasks, which in our case means that all the production code build processes can be performed inside of netlify and if the build is successful, the website changes will be deployed. although netlify offers a drag and drop deployment service, we are intending to trigger a new depl...

Introducing a complete toolchain - Learn web development
us a number of useful tools for working with them). note that, although we're using github in this chapter, there are several alternatives including gitlab and bitbucket, and you could even host your own git repositories. using revision control in your projects and including it as part of the toolchain will help manage the evolution of your code. it offers a way to "commit" blocks of work as you progress, along with comments such as "x new feature implemented", or "bug z now fixed due to y changes". revision control can also allow you to branch out your project code, creating a separate version and try out new functionality on, without those changes affecting your original code. finally, it can help you undo changes or revert your code back to a time "when it was working" if a mistake has been ...

Mozilla accessibility architecture
they are fired by gecko whenever nodes in the document are created, moved or changed. common reasons for these mutations are web page scripts, and user actions in the editor. we listen to dom mutation events for several resons: to broadcast do...

Mozilla’s UAAG evaluation report
ion about whether link will open in same window does not support fee links 10.7 highlight current viewport. (p1) vg uses title bar color and focus indicator to indicate with view port has focus the currently focused content frame has a dotted outline, until a key is pressed or scrolling occurs the focus appearance is not configurable 10.8 indicate rendering progress. (p3) vg a progress bar and status bar message indicates loading progress the scroll bar indicates how far into the document the current graphical view is the size of the current document is in the page info screen, sometimes it says unavailable guideline 11. allow configuration and customization. checkpoint title status notes/plans 11.

Accessible Toolkit Checklist
ible value that holds text, protected for password fields and readonly for read-only fields checkboxes space bar to toggle msaa support, including checkbox state and statechange event sliders keyboard support for moving slider: arrow keys, home, end, pgup, pgdn msaa support including role_slider, accessible value, value change events progress bars msaa support including accessible name, value, name and value change events grouped navigation widgets menus arrow keys, enter, escape alt alone enters main menu after leaving menus, focus is restored to where it was modified and unmodified mnemonics msaa support (including focus events, menu start and end events, radio and checkbox m...

ZoomText
here's how you can test: download a copy of mozilla 1.8a6 (this is not firefox). read the release notes if you're interested. these builds are pretty stable considering they're only alpha, i'm having very good luck with them. it doesn't do us any good to get bug reports on older stuff right now. our main focus is on the browser itself, so you you only need to install mailnews or address book if curious about the other apps. you will also need to install zoomtext 8.11.3. happy testing! you may wish to read through the current issues on this page before reporting bugs. ...

Accessibility and Mozilla
i.e. software that renders web content. the uaag is not the basis for any government accessibility regulations at this time.multiprocess on windowsa high-level overview of the ideas behind the a11y+e10s design is available on the wiki.software accessibility: where are we today?the accessibility of computer software has seen drastic improvements over the past two decades. this article reviews the progress and technology as it has developed.zoomtextwe've made a lot of progress with mozilla/zoomtext compatibility. ...

Application cache implementation overview
d'. then it associates any documents waiting for this update to finish with the current existing nsiapplicationcache. if the manifest load failed, onerror event is invoked and the update 'finishes'. the parallel load is implemented by asynchronous recursive calls to processnexturi(), a method searching always a single entry that is scheduled to load. when found, channel is open for it (+onprogress event is invoked). processnexturi then invokes it self asynchronously via dispatch to a main thread when not already on the concurrency limit of 15 loads. when concurrency limit is reached, the processnexturi self-invocation cycle is stopped. from now on processnexturi can only be called from loadcompleted() again. note: the processnexturi method early returns when state of the update is diff...

Testopia
ns/testopia/lib/. this is not an trivial task, it takes time (it started in august 2014), and we decided that it was not a good idea to release half-baked code which still needs testing to make sure we didn't regress anything. the good news is that the current code in the git repository already works with bugzilla 5.0, and so if you upgraded to 5.0 already, and if you don't mind having a work-in-progress extension on your machine, you can decide to pull the code from the git repository. this would also let us get some early feedback in case you find regressions. if you find bugs in the code available from the git repository, please report it to us so that we can fix most critical ones on time for testopia 3.0. do not ask when we plan to release 3.0, because we really don't know. "as soon as poss...

Chrome registration
mozilla locates and reads the root chrome.manifest file for extensions and themes. note: with gecko 1.9.2 and older, mozilla reads chrome/*.manifest files from applications. starting with gecko 2.0, the root chrome.manifest is the only manifest used; you can add manifest commands to that file to load secondary manifests. ...

Creating a Language Pack
number of firefox changes. windows: replace make with mozmake in the commands below! creating a langpack we will now merge the localized files from x-testing locale with the en-us files from the original source. every time you want to create a langpack, you need to be in the directory obj-firefox-build/browser/locales. it is likely that you will continue to generate language packs as your progress just to test your work. while in that directory, issue the following command: $ make merge-x-testing locale_mergedir=$(pwd)/mergedir x-testing: browser chrome browser aboutcerterror.dtd // add and localize this file ... // lots of notifications about missing entities ... x-testing: changed: 6 missinginfiles: 6124 missing: 5 0% of entries...

Debugging on Mac OS X
code you should see a tree item where the root item has the project name. if the temporary directory that you originally created the xcode project in is under that, right click it and delete it. now, right click on the root item, select 'add files to "<project-name>"', select all the files and directories in your source directory, untick "copy items if needed", then click add. (these will then be progressively added under the root item <project-name> in the left-hand pane. note that subdirectories may initially appear to be empty, but they too will progressively be populated as xcode processes the sourse files. once done, you should be able to open any file quickly by hitting cmd-shift-o and typing in the name of a file.) in the product menu, select scheme > new scheme and name your scheme (for e...

Debugging on Windows
avoiding stepping into certain functions you can avoid stepping into certain functions, such as nscomptr methods, using an undocumented feature of vc. see the blog post how to not step into functions using the visual c++ debugger for details. here are some wildcards you can use (tested with vc 8): nscomptr.*\:\:.*=nostepinto (nsg|g)etter_*addrefs.*=nostepinto ns_convertutf.*...

Simple Instantbird build
depending on your operating system you will need to carry out a different process to prepare your machine. so firstly complete the instructions for your os and then continue following these build instructions. windows build prerequisites gnu/linux build prerequisites mac os x build prerequisites tip: after completing setup for your os, and before you get the source, you can opt to add the progressextension to your mercurial.ini (for windows) or .hgrc (for *nix / mac) file. this will provide status feedback during the lengthy clone / download process. see: configure mercurial .hgrc file for progress extension. get the source note: on windows, you won't be able to build the instantbird source code if it's under a directory with spaces in the path (e.g., don't use "documents and settings").

Windows SDK versions
information is available at obsolete build caveats and tips [en-us] under the windows sdk article. windows 8 sdk (official) features that depend on this sdk include: metro firefox front end gamepad api support you can download the sdk from the microsoft download center [web setup]. windows 7 sdk features that depend on this sdk include: windows 7 taskbar previews windows 7 download taskbar progress windows 7 jump lists you can download the sdk (v7.0 [web setup or iso image] or unsupported v7.1 [web setup or iso image]) from the microsoft download center. note that if you're running a 64 bit version of windows you may require the "amd" version of the sdk even if you have an intel processor, and you may need to deselect the documentation component in the installer in order to avoid an insta...

Error codes returned by Mozilla APIs
ad group. ns_error_malformed_uri (0x804b000a) the uri is malformed. ns_error_already_connected (0x804b000b) the connection is already established. xxx currently unused - consider removing. ns_error_not_connected (0x804b000c) the connection does not exist. xxx currently unused - consider removing. ns_error_connection_refused (0x804b000d) ns_error_net_timeout (0x804b000e) ns_error_in_progress (0x804b000f) the requested action could not be completed while the object is busy. implementations of nsichannel.asyncopen() will commonly return this error if the channel has already been opened (and has not yet been closed). ns_error_offline (0x804b0010) ns_error_no_content (0x804b0011) returned from nsichannel.asyncopen() to indicate that ondataavailable will not be called because there...

Extending a Protocol
s: at the top, add #include "mozilla/dom/echochild.h" and then, as part of the windowglobalchild class definition, add the following two public methods: already_addrefed<echochild> allocpechochild(); bool deallocpechochild(pechochild* aactor); super tedious, we know... nearly there though! let's give this a compile and see how we are doing! we should see ./mach build make significant progress now, but obviously, wihtout a backing cpp implementation, it's not going to do much. let's implement the .cpp files, starting with windowglobalparent.cpp. implementing methods on windowglobalparent.cpp open up dom/ipc/windowglobalparent.cpp and let's implement: allocpechoparent() deallocpechoparent(pechoparent* aactor) so, let's add: already_addrefed<echoparent> windowglobalparent::...

Implementing Download Resuming
ition, and the previously stored entity id. (it is possible to pass an empty string as the id; however, this means that you have no assurance that the file remained unchanged) now, you can open the channel as usual (using nsichannel.asyncopen() in the common case) and write to the file in the ondataavailable notifications. you may want to use nsisimplestreamlistener to simplify this task; to get progress notifications, you can implement nsiprogresseventsink and set an interface requester as the notificationcallbacks of the channel that gives out such an event sink (this needs to be done before calling asyncopen). note: in versions of firefox prior to 3.0 alpha 7, nsiwebbrowserpersist cannot append to existing files (as opposed to overwriting them), and is therefore not usable for this task (see ...

AddonInstall
the installation. error integer if an error has been encountered during the download or install this will hold the error code. sourceuri nsiuri the uri that the add-on is being installed from. file nsifile the file that the add-on is being installed from. this may be null if the add-on is coming from the internet and has yet to be downloaded. progress integer the progress of any necessary downloads. maxprogress integer the expected size of any necessary downloads or -1 if unknown. certificate nsix509cert if the add-on to be installed is signed this is the certificate of the signer. only available after downloading is complete. certname string if the add-on to be installed is signed this is the...

Add-on Manager
l() methods on the addonmanager object. these will pass an addoninstall instance to the callback, which can then be used to install the add-on: components.utils.import("resource://gre/modules/addonmanager.jsm"); addonmanager.getinstallforurl("http://www.foo.com/test.xpi", function(ainstall) { // ainstall is an instance of addoninstall ainstall.install(); }, "application/x-xpinstall"); the progress of addoninstalls can be monitored using an installlistener. a listener can be registered either for a specific install using the addlistener() method or for all installs using the addinstalllistener() method. finding updates add-ons can be checked for updates using the findupdates() method. it must be passed an updatelistener to receive information about compatibility information and new update...

AsyncShutdown.jsm
(function|promise condition) methods addblocker () register a blocker for the completion of a phase. void addblocker( in string name, in function|promise|* condition, optional in function info ) arguments name the human-readable name of the blocker. used for debugging/error reporting. please make sure that the name respects the following model: "some service: some action in progress" - for instance "os.file: flushing all pending i/o". condition a condition blocking the completion of the phase. generally, this is a function returning a promise. this function is evaluated during the phase and the phase is guaranteed to not terminate until the resulting promise is either resolved or rejected. if condition is not a function but another value v, it behaves as if it were a funct...

DeferredTask.jsm
y pending write is processed, using the latest version of the data if the timer is armed: asyncshutdown.profilebeforechange.addblocker( "example service: shutting down", () => savedeferredtask.finalize() ); instead, if you are going to delete the saved data from disk anyways, you might as well prevent any pending write from starting, while still ensuring that any write that is currently in progress terminates, so that the file is not in use any more: savedeferredtask.disarm(); savedeferredtask.finalize().then(() => os.file.remove(...)) .then(null, components.utils.reporterror); ...

DownloadTarget
namic property, which is updated when the download finishes or whenever the download.refresh() method is called. you can use this value from the front-end to reduce file i/o that would be required to check the file directly. methods refresh() updates the state of a finished, failed, or canceled download based on the current state as indicated by the file system. if the download is in progress or has been finalized, this method does nothing and returns a resolved promise. calling this method lets the download object's properties be updated if the user moves or deletes the target file or its associated ".part" file, which contains a partially-downloaded file's contents. promise refresh(); parameters none. promise resolves to undefined when the state of the download has been updat...

Interfacing with the Add-on Repository
e, providing the methods that get called when a search either fails or completes successfully. handling failed requests the callback object must have a searchfailed() method; this gets called when a repository search fails to execute. the most common cause of failure (other than the search url preference being incorrect) is if there is already a pending request, since only one request can be in progress at a time. for example: searchfailed: function() { this.shownotification("i have no recommendations for you right now!", "oh noes!", null); }, here, we call a shownotification() method with some parameters that we'll look at shortly when we get to our shownotification() method below. the important thing to note is that this will handle the failure case. handling successful request...

Following the Android Toasts Tutorial from a JNI Perspective
it will use the jni.jsm module that is available in firefox for android since version 17. this article teaches developers how to port java code to jni by reading the java and android documentation. toast description a toast provides simple feedback about an operation in a small popup. it only fills the amount of space required for the message, and the current activity remains visible and interactive. for example, navigating away from an email before you send it triggers a "draft saved" toast to let you know that you can continue editing later. ...

Log.jsm
the log.jsm javascript code module (formerly named log4moz.js) provides a log4j style api for logging log messages to various endpoints, such as the browser console or a file on disk. ...

Using the Source Editor API
obviously a work in progress. creating an editor destroying the editor common tasks ...

source-editor.jsm
ing the offset into the text at which the first character of the found string is located, or -1 if the string wasn't found. find options the aoptions object can customize the search operation. it may have the following properties: property type description backwards boolean if true, the search begins at start (or the end of the text, if start is not specified) and progresses toward the beginning of the text. otherwise the search progresses forward. the default is false. ignorecase boolean if true, the search is performed in a case-insensitive manner; otherwise case is considered. the default is false. start number an integer value indicating the offset into the text at which to begin the find operation. the default is 0 if backwards is...

Localization content best practices
and especially localization comments for strings that contain references, or obscure technical details. localization files choose good key ids the ids (names) chosen for your keys, regardless of the file format, should always be descriptive of the string, and its role in the interface (button label, title, etc.). think of them as long variable names. when you have to change a key id, adding a progressive number to the existing key should always be used as a last resort. for example, suppose this string needs to be changed from "event" to "add new event": new-event-header = event add-new-event-header is definitely a better choice for the new string than new-event-header1. if a string is tied to an accesskey or a tooltip, use string ids that highlight this relation: neweventbtn.label = add e...

Localizing with Mozilla Translator
the product(s) in mt. this will remove obsolete strings and files from the internal database of mt, and will present you with a list of new and updated strings. if you are starting a new localization, all strings will be marked as new or updated.mt puts a fuzzy flag on each flag and saves it in its database. all this means is that the strings have yet to be translated. you can save your work in progress and reopen it to continue working by selecting view fuzzy from the edit menu. after translating those strings (if using the edit phrase dialog, you can get translation suggestions for strings having an original text equal to existing translations), you can run some automated tests to detect typical errors. after that, you export either the whole product or indvididual files. finally, you commit...

Localizing with Pontoon
r with a list of all strings to localize. project selector (affiliates) switches between projects to localize. resource selector (homepage) switches between project resources to localize, like subpages or localization files. hidden if no resources available for project. locale selector (slovenian) switches between languages to localize. go opens project-resource-locale selection. progress indicator displays your progress on the resource being localized. more details are available in the popup. user menu allows for user-specific tasks, like commiting to repository, downloading files and signing out. info menu gives important information, like the anticipated project timeline and a list of keyboard shortcuts. alright, how about we do some translating now? translate...

Localizing without a specialized tool
rimary types of localization files (dtd and properties) used in the mozilla source code. with that document, users can see immediately two localized files in their user interface by following closely and carefully the steps to create a language pack or a binary file that is ready for installation. repeating the process allows a localizer to create a testable package to see his or her work as they progress to a final version. if you choose to localize mozilla with nothing more than a text editing application and not a specialized tool, this document (along with create a new localization) will enable you to learn just what needs to be done. before we start, did you make sure to install mercurial and confirm that you have set up the proper build environment on your local machine? you cannot begin lo...

QA phase
er and start testing! now you should be able to see all of your work up to this point. click here for guidelines on how to test your localization. don't lose your work! your work is so important! we would really hate to see you lose any of it. after you test your localization, you should send it to a remote repository, which will serve as a backup for your work and will let others follow your progress. we're going to go through the process below. the official localization teams use repositories at hg.mozilla.org. before a team becomes official, we like to get the localizers comfortable with the hg commands that allow for cloning, pulling, committing, and pushing work to an experimental repository. we use a web service called bit bucket to start the learning process. note: you must have merc...

Release phase
ed 4 changesets with 242 changes to 239 files updating to branch default 239 files updated, 0 files merged, 0 files removed, 0 files unresolved the default push url is the same as the default pull url (i.e., ssh://hg.mozilla.org/releases/l10n-central/x-testing). you should now be able to push to the remote repository! commit, outgoing, and push you should try to commit your work regularly as you progress through the localization files. keep in mind that the hg commit command will save your changes locally (in the local clone). with the hg push command you can send the changesets to the remote server. here's how that's done: run this command to see recent commits in your local clone: $ hg log -l 3 you should a list of the most recent commits, similar to this one: changeset: 0:7c543e8f3a6a ta...

Translation phase
r, web development tools, and an irc chat client. firefox mobile by adding firefox® to your mobile phone, you can access rich web content and enjoy your favorite firefox features wherever you go. lightning lightning is a popular calendaring, scheduling and task management extension. if your locale has an hg repository hosted on the mozilla servers, you can track your localization's current progress by visiting the l10n dashboards. note: if you are starting a new localization and decide to use an offline tool for localizing mozilla applications, you will need to become familiar with using mercurial (hg). visit the tutorial on using hg in your localization efforts here. mozilla websites so you're interested in localizing mozilla websites. each l10n tool follows a different workflow for ...

Mozilla MathML Status
sections related to semantics/content mathml or irrelevant features are left blank or not listed at all. if only the main features of an element are implemented then its section is marked as supported but details of unsupported attributes are specified below. the top-level math element see § 2.2. ...

Mozilla Development Tools
(based on lxr) that lets you cross-reference function and variable names. bonsai bonsai is tree control (get it?). it is our home-grown web-based tool for watching the up-to-the-minute goings-on in our cvs repository (viewing checkins and log messages, reading diffs, etc.) tinderbox tinderbox is for knowing when the tree is in flames. it is our home-grown web-based tool for watching the progress of the continuous builds that we run on multiple platforms. it is how we are able to tell when a checkin has broken the build on some platform, and how we know which person needs to be viciously flogged. bugzilla bugzilla is where developers can report bugs in the mozilla source releases, and browse an online database of already-reported bugs. doctor doctor is a web interface to cvs. it...

Investigating leaks using DMD heap scan mode
e cycle collector could not collect the window, using the find_roots.py script from the heapgraph repository. the command to invoke this looks like this: python $heapgraph/find_roots.py $cclog $winaddr this may take a few seconds. it will eventually produce some output. you'll want to save a copy of this output for later. ...

Profiling with the Firefox Profiler
eady to service incoming events. there are os-specific waiting functions like ntwaitformultipleobjects seen in the example above taken on windows or mach_msg_trap on macos. tip: you can quickly go deeper into the call tree by holding down your right arrow key. alternatively, expand an entire tree segment by holding alt and clicking on the arrow to the left of the collapsed tree segment. as we progress into a more specific part of the tree, you'll notice that the 'running time' decreases. this happens when a function has 2 or more non-trivial calls: the running time will be split between its children. tip: focus on one section of the tree by clicking on the "arrow-in-a-circle" icon that appears to the right of the tree element as you hover over it. a "tree breadcrumb" will appear similar to t...

Preferences
bout how to use the preference system. documentation preferences system an introduction to using the preference system in mozilla. xul school: handling preferences the xul school tutorial chapter on preferences. mozilla preference reference a reference guide to all mozilla preferences; currently a work in progress. a brief guide to mozilla preferences an introductory guide to where preferences are stored and other useful information about the core preference system. using preferences from application code firefox 6 introduced static functions for accessing preferences efficiently from within application code. this api is not available for add-ons, but if you're work...

Installing JSHydra
obj configure arguments to tell jshydra to use existing copies of the source and build. cd $home/jshydra hg clone http://hg.mozilla.org/users/pidgeot18_gmail.com/jshydra/ cd jshydra ./configure make # run jshydra tests make check processing input files jshydra requires the files it processes to be correct js files. converting html, xul, or xbl files into a readable js equivalent is a work in progress, as is accounting for the preprocessing that mozilla files sometimes use. there is not yet a repository for this information, but bug 506128 contains more information. ...

NSPR Poll Method
is one of the functions in the priomethods table. the prototype of the poll method is print16 poll_method(prfiledesc *fd, print16 in_flags, print16 *out_flags); the purpose of the poll method is to allow a layer to modify that flags that will ultimately be used in the call to the underlying network transport's select (or equivalent) function, and to indicate that a layer is already able to make progress in the manner suggested by the polling flags. the arguments and return value of the poll method are described below. in_flags [input argument] the in_flags argument specifies the events at the top layer of the i/o layer stack that the caller is interested in. for pr_recv, you should pass pr_poll_read as the in_flags argument to the poll method for pr_send, you should pass pr_poll_write as t...

NSPR Error Handling
desired operation. pr_device_is_locked_error the device needed to perform the desired request is locked. pr_no_more_files_error there are no more entries in the directory. pr_end_of_file_error unexpectedly encountered end of file (mac os only). pr_file_seek_error an unexpected seek error (mac os only). pr_file_is_busy_error the file is busy and the operation cannot be performed. pr_in_progress_error the operation is still in progress (probably a nonblocking connect). pr_already_initiated_error the (retried) operation has already been initiated (probably a nonblocking connect). pr_group_empty_error the wait group is empty. pr_invalid_state_error the attempted operation is on an object that was in an improper state to perform the request. pr_max_error placeholder for the end of ...

PRErrorCode
error codes that can be retrieved with pr_geterror. you can also set your own errors using pr_seterror. syntax #include <prerror.h> typedef print32 prerrorcode description the service nspr offers in this area is the ability to associate a thread-specific condition with an error number. the error number namespace is not well managed. nspr assumes error numbers starting at -6000 (decimal) and progressing towards zero. at present less than 100 error codes have been defined. if nspr's error handling is adopted by calling clients, then some sort of partitioning of the namespace will have to be employed. nspr does not attempt to address this issue. for nspr errors, see error codes. ...

PR_GetConnectStatus
ameter the function has the following parameter: pd a pointer to a prpolldesc satructure whose fd field is the socket and whose in_flags field must contain pr_poll_write and pr_poll_except. returns the function returns one of these values: if successful, pr_success. if unsuccessful, pr_failure. the reason for the failure can be retrieved via pr_geterror. if pr_geterror returns pr_in_progress_error, the nonblocking connection is still in progress and has not completed yet.other errors indicate that the connection has failed. description after pr_connect on a nonblocking socket fails with pr_in_progress_error, you may wait for the connection to complete by calling pr_poll on the socket with the in_flags pr_poll_write | pr_poll_except. when pr_poll returns, call pr_getconnectstatus on...

Index
te database such as the cert8.db database provided with nss. this was converted from "chapter 5: certificate functions". 301 nss key functions nss this chapter describes two functions used to manipulate private keys and key databases such as the key3.db database provided with nss. this was converted from "chapter 6: key functions". 302 nss tools man pages - work in progress certutil certutil 303 nss cryptographic module nss no summary! 304 fips mode of operation nss no summary! 305 nss environment variables nss these environment variables affect the run time behavior of nss shared libraries. there is a separate set of environment variables that affect how nss is built, documented below. ...

JSS
stay tuned! legacy jss information can still be found at: source: https://hg.mozilla.org/projects/jss issues: https://bugzilla.mozilla.org/buglist.cgi?product=jss wiki: /docs/mozilla/projects/nss/jss network security services for java (jss) is a java interface to nss. jss supports most o...

NSS Sample Code Utilities_1
char meter[] = { "\r| |" }; int fd, count; int c; secstatus rv = secsuccess; cc_t orig_cc_min; cc_t orig_cc_time; tcflag_t orig_lflag; struct termios tio; fprintf(stderr, "to generate random numbers, " "continue typing until the progress meter is full:\n\n"); fprintf(stderr, "%s", meter); fprintf(stderr, "\r|"); /* turn off echo on stdin & return on 1 char instead of nl */ fd = fileno(stdin); tcgetattr(fd, &tio); orig_lflag = tio.c_lflag; orig_cc_min = tio.c_cc[vmin]; orig_cc_time = tio.c_cc[vtime]; tio.c_lflag &= ~echo; tio.c_lflag &= ~icanon; tio.c_cc[vmin] = 1; tio.c_cc[vtime] ...

Utilities for nss samples
char meter[] = { "\r| |" }; int fd, count; int c; secstatus rv = secsuccess; cc_t orig_cc_min; cc_t orig_cc_time; tcflag_t orig_lflag; struct termios tio; fprintf(stderr, "to generate random numbers, " "continue typing until the progress meter is full:\n\n"); fprintf(stderr, "%s", meter); fprintf(stderr, "\r|"); /* turn off echo on stdin & return on 1 char instead of nl */ fd = fileno(stdin); tcgetattr(fd, &tio); orig_lflag = tio.c_lflag; orig_cc_min = tio.c_cc[vmin]; orig_cc_time = tio.c_cc[vtime]; tio.c_lflag &= ~echo; tio.c_lflag &= ~icanon; tio.c_cc[vmin] = 1; tio.c_cc[vtime] ...

New NSS Samples
new nss sample code this collection of sample code demonstrates how nss can be used for cryptographic operations, certificate handling, ssl, etc. it also demonstrates some best practices in the application of cryptography. these new examples are a work in progress. see https://bugzilla.mozilla.org/show_bug.cgi?id=490238 how to download the samples: hg clone https://hg.mozilla.org/projects/nss; cd nss; hg update samples_branch samples list: sample code 1: hashing sample code 2: init nss database sample code 3: encrypt/decrypt and mac using token sample code 4: encrypt/decrypt and mac using session objects sample code 5: encrypt/decrypt/mac output public key as a csr sample code 6: encrypt/decrypt/mac generating a pkcs#11 csr common code used by these samples: sample co...

Python binding for NSS
es. all nss/nspr python objects can print their current value by evaluting the python object in a string context or by using the python str() function. support threading. the python global interpreter lock (gil) is released prior to calling nss/nspr c functions and reaquired after the nss/nspr c function returns. this allows other python threads to execute during the time a nss/nspr function is progress in another thread. also, any "global" values which are set in python-nss are actually thread-local. examples of this are the various callbacks which can be set and their parameters. thus each thread gets it own set of callbacks. many methods/functions provide sane default (keyword) parameters freeing the python programmer from having to specify all parameters yet allowing them to be overriden wh...

NSS environment variables
a pre-master secrets to this file. this allows packet sniffers to decrypt tls connections. see documentation. 3.12.6 ssltrace integer tracing level note: the code must be built with trace defined to use this functionality. before 3.0 build-time environment variables these environment variables affect the build (compilation) of nss. note: this section is a work in progress and is not yet complete. variable type description introduced in version build_opt boolean (1 to enable) do an optimized (not debug) build. default is to do a debug build. before 3.0 moz_debug_symbols boolean (1 to enable) needed on windows to build with versions of msvc (such as vc8 and vc9) that do not understand /pdb:none 3.11 ...

NSS tools : crlutil
name crlutil — list, generate, modify, or delete crls within the nss security database file(s) and list, create, modify or delete certificates entries in a particular crl. synopsis crlutil [options] [[arguments]] status this documentation is still work in progress. please contribute to the initial review in mozilla nss bug 836477[1] description the certificate revocation list (crl) management tool, crlutil, is a command-line utility that can list, generate, modify, or delete crls within the nss security database file(s) and list, create, modify or delete certificates entries in a particular crl. the key and certificate management process generally begins with creating keys in the key database, then generating and managing certificates in the certificate database(see certut...

NSS tools : modutil
please contribute to the initial review in mozilla nss bug 836477[1] description the security module database tool, modutil, is a command-line utility for managing pkcs #11 module information both within secmod.db files and within hardware tokens. ...

NSS reference
f nspr functions are required for using the certificate verification and ssl functions in nss. these functions are listed in this section. error codes based on "nss and ssl error codes" in the ssl reference. nss environment variables nss cryptographic module nss tech notes nss tech notes nss memory allocation tools based on nss tools documentation. based on nss tools man pages : work in progress ...

Pork
elsa (and oink) tool chain, and the mcpp preprocessor. as of october 2009 oink incorporates the pork functionality into its standard distribution; look for files and tests having the prefix "xform". documentation installing pork download, installation and dependency info for pork pork tools description of rewriting tools pork tool development in progress page... old pork page pork details that haven't been moved to mdc renaming with pork sample pork application todos pork 1.0 release tracking bug pork releases download pork here community view pork forums... mailing list newsgroup rss feed #static on irc.mozilla.org related topics dehydra, tree...

GCIntegration - SpiderMonkey Redirect 1
gets marked by the gc. the problem is that c is never marked even though it's reachable. this will likely lead to a crash if c is accessed via b. write barriers all the schemes for preventing this sort of thing require write barriers. every time a pointer is updated, a small amount of code runs that may mark one of the objects involved in the update. this only happens if an incremental gc is in progress. spidermonkey uses a simple barrier commonly called a "snapshot at the beginning" barrier. the fundamental invariant that this barrier guarantees is that any object reachable when the incremental gc started will be marked. in addition, objects allocated during the incremental gc are marked unconditionally. at the end of the gc, any reachable object must have been newly allocated or else reachable...

Index
dow in the bottom left with a line like "artifact uploaded: mozjs-57.0.1.tar.bz2". 540 spidermonkey 1.8 spidermonkey spidermonkey 1.8 has one known significant regression from 1.7. 541 spidermonkey 1.8.5 spidermonkey spidermonkey 1.8.5 is supported on all the platforms where firefox 4 runs. 542 spidermonkey 1.8.7 spidermonkey draft in progress - this is a draft, and right now it's mostly just a copy of the 1.8.5 release notes. 543 spidermonkey 1.8.8 spidermonkey spidermonkey 1.8.8 is supported on all the platforms where firefox insert-actual-firefox-version-number-here runs. 544 spidermonkey 17 spidermonkey spidermonkey 17 is supported on all the platforms where firefox 17 runs. 545 ...

JIT Optimization Strategies
this page has two intended uses: 1. provide a repository of jit optimization strategy information which the jit coach tool can parse to display in its ui. 2. provide a user-browsable documentation of optimization strategies, how they work, how they are defeated, and options for how to re-enable them. ...

JSAPI User Guide
is: the application compiles some javascript code. to protect the compiled script from garbage collection, the application creates a compiled script object by calling js_newscriptobject and makes that object gc-reachable using js_setproperty, js_setreservedslot, js_add*root, or some other function. the application executes the compiled script any number of times. as the application progresses, eventually it doesn't need the compiled script anymore, and the compiled script object becomes unreachable. the garbage collector then eventually collects the unreachable script and its components. here is example code demonstrating the technique—but note that this case is not really complex enough to warrant the use of js_newscriptobject. the above example does the same thing more dir...

JS_GetGCParameter
cthreshold, lastsize) * thresholdfactor, this establishes allocthreshold as a baseline or default heap size. jsgc_allocation_threshold_factor / "allocationthresholdfactor" these thresholds (as percentages) are compared with the zone threshold (above) to decide when to begin an incremental collection. jsgc_allocation_threshold_factor_avoid_interrupt is used when a gc is already in progress for other zones and we may wish to avoid interrupting it. additionally if a zone expands beyond the threshold without this factor, then it will be collected non-incrementally jsgc_allocation_threshold_factor_avoid_interrupt / "allocationthresholdfactoravoidinterrupt" jsgc_min_empty_chunk_count / "minemptychunkcount" we try to keep at least this many unused chunks in ...

SpiderMonkey 1.8.7
xxx needs updating the mozilla javascript team is pleased to announce the release of spidermonkey 1.8.5. you can download full source code here: http://ftp.mozilla.org/pub/mozilla.org/js/js185-1.0.0.tar.gz (md5 checksum: a4574365938222adca0a6bd33329cb32). spidermonkey 1.8.5 is the javascript engine that shipped in firefox 4.0. it is much faster than spidermonkey 1.8, implements es-5 (ecma 262, 5th edition), and contains many new language and api features, described in detail below. please let us know about your experiences with this release by posting in the mozilla.dev.tech.js-engine newsgroup. ...

Running Automated JavaScript Tests
of test262 tests is included in the tree, jstests take a long time to complete. for a smoke test or if you are not changing language-level functionality, you may wish to use jstests.py path_to_js_shell --exclude=test262 other options allow you to show the test command lines being run, command output and return codes, run tests named in a given file, exclude tests named in a given file, hide the progress bar, change the timeout, run skipped tests, print output in tinderbox format, run a test in the debugger, or run tests in valgrind. run with the -h option to see all the options. the jstests test suite also includes some tests from web-platform-tests. by default, these are only run when no tests paths are specified; this can be overridden by the --wpt=enabled flag. running jstest in a browser ...

Gecko Roles
n, also called a radio button. it is one of a group of mutually exclusive options. all objects sharing a single parent that have this attribute are assumed to be part of single mutually exclusive group. role_combobox represents a combo box; an edit control with an associated list box that provides a set of predefined choices. role_droplist represents the calendar control. role_progressbar represents a progress bar, dynamically showing the user the percent complete of an operation in progress. role_dial represents a dial or knob whose purpose is to allow a user to set a value. role_hotkeyfield represents a hot-key field that allows the user to enter a combination or sequence of keystrokes. role_slider represents a slider, which allows the user to adju...

AT Development
guidelines at apis implementation by gecko at vendors guide to support gecko-based applications like firefox, thunderbird and so on. accessibility architecture how the accessibility hierarchy is implemented in mozilla (some issues aren't addressed by previous guide). ...

XUL Accessibility
at api general rules this section holds some rules applied to generating accessible name and description. ...

Accessibility API Implementation Details
makers of screen readers, voice dictation packages, onscreen keyboards, magnification software and other assitive technologies can support gecko-based software. we provide for them the support of these products on windows, linux/unix and os x platforms.at developmentthe accessibility of computer software has seen drastic improvements over the past two decades. this article (from 2007) reviews the progress and technology as it has developed. xforms accessibilitythis article provides a quick guide to how accessibility is handled in gecko for xforms.xul accessibilitythis article shows how xul control elements are mapped to accessibility api. it is much in progress. ...

Feed content access API
l of the other feed-related interfaces. nsifeedentry represents a single entry in an rss or atom feed. nsifeedgenerator describes the software that generated an rss or atom feed. nsifeedperson represents a person. contains the person's name, email address, and their home page address. nsifeedprocessor parses rss and atom feeds. nsifeedprogresslistener implemented by the program that wants to parse an rss or atom feed to receive messages during the parsing process. nsifeedresult describes the result of parsing a feed. nsifeedresultlistener implemented by the program that wants to parse an rss or atom feed to receive notification when parsing is complete. nsifeedtextconstruct represents te...

Component Internals
arfait! everybody likes parfaits. xpcom components have at least three layers. from the innermost and moving outward these layers include: the core xpcom object the factory code the module code the core xpcom object is the object that will implement the functionality you need. for example, this is the object that may start a network download and implement interfaces that will listen to the progress. or the object may provide a new content type handler. whatever it does, this object is at the core of the xpcom component, and the other layers are supporting it, plugging it into the xpcom system. a single library may have many of these core objects. one layer above the core object is the factory code. the factory object provides a basic abstraction of the core xpcom object. an overview of xpc...

Creating the Component Code
ew of the weblock module source as we mentioned in the previous section, components have layers. there are three main parts to every xpcom component. from the innermost and moving outward, the first object is the xpcom object. this is the object that contains the business logic, that implements functionality such as starting a network download, implementing interfaces that listen to the download progress, or providing a new content type handler. in weblock, this is the part that brings together various gecko services and prevents users from leaving the list of acceptable domains. in a way, the factory and module layers are glue to plug the xpcom object into the larger xpcom system. one layer above the object itself is the nsifactory object. this object provides basic abstraction of the xpcom obj...

Receiving startup notifications
receiving startup notifications in gecko 2.0 (firefox 4) and later in order to improve startup times, changes were made to the xpcom startup process. see the startup process for details on how this now works, if you're interested in specifics. the important thing to note is that now instead of registering with the category manager programmatically as was done in the past, you add lines to your chrome.manifest to let the application handle it for you. ...

XPCOM guide
ch is linked into libxul). mozilla::services namespacethe services c++ namespace offers an easy and efficient alternative for obtaining a service as compared to the indirect xpcom approach: getservice(), callgetservice(), etc methods are expensive and should be avoided when possible.receiving startup notificationssometimes it's necessary for xpcom components to receive notifications as to the progress of the application's startup process, so they can start new services at appropriate times, for example.xpcom array guidemozilla has many array classes because each array is optimized for a particular usage pattern. this guide describes the available arrays as well as the enumerator classes that can be used to get to them. in this document the term array refers to a container for multiple objects ...

IAccessibleValue
other-licenses/ia2/accessiblevalue.idlnot scriptable this interface gives access to a single numerical value. 1.0 66 introduced gecko 1.9 inherits from: iunknown last changed in gecko 1.9 (firefox 3) the iaccessiblevalue interface represents a single numerical value and should be implemented by any class that supports numerical value like progress bars and spin boxes. this interface lets you access the value and its upper and lower bounds. method overview [propget] hresult currentvalue([out] variant currentvalue ); [propget] hresult maximumvalue([out] variant maximumvalue ); [propget] hresult minimumvalue([out] variant minimumvalue ); hresult setcurrentvalue([in] variant value ); methods currentvalue() returns the value of this object as a number. the ...

imgIContainer
y error, zero is returned, and an exception will be thrown. read only. constants constant value description type_raster 0 enumerated values for the 'type' attribute (below). type_vector 1 flag_none 0x0 flags for imgicontainer operations. meanings: flag_none: lack of flags. flag_sync_decode: forces synchronous/non-progressive decode of all available data before the call returns. it is an error to pass this flag from a call stack that originates in a decoder (that is, from a decoder observer event). flag_decode_no_premultiply_alpha: do not premultiply alpha if it is not already premultiplied in the image data. flag_decode_no_colorspace_conversion: do not do any colorspace conversion; ignore any embedded prof...

mozIStorageValueArray
pecified by aindex is null, or false otherwise. see also storage introduction and how-to article mozistorageconnection database connection to a specific file or in-memory data storage mozistoragestatement create and execute sql statements on a sqlite database. mozistoragefunction create a new sqlite function. mozistorageaggregatefunction create a new sqlite aggregate function. mozistorageprogresshandler monitor progress during the execution of a statement. mozistoragestatementwrapper storage statement wrapper ...

nsIAccessibleProvider
xultabbox 0x00001018 a combination of a tabs object and a tabpanels object. xultabs 0x00001019 the collection of tab objects, usable in the tabbox and independent of as well. xultext 0x...

nsIAccessibleRole
sumed to be part of single mutually exclusive group. it is used for xul:radio, html:input@type="radio", role="radio". role_combobox 46 represents a combo box; an edit control with an associated list box that provides a set of predefined choices. it is used for html:select, xul:menulist, role="combobox". role_droplist 47 represents the calendar control. it is used for date xforms:input. role_progressbar 48 represents a progress bar, dynamically showing the user the percent complete of an operation in progress. it is used for xul:progressmeter, role="progressbar". role_dial 49 represents a dial or knob whose purpose is to allow a user to set a value. role_hotkeyfield 50 represents a hot-key field that allows the user to enter a combination or sequence of keystrokes. role_slider 51 repres...

nsIAsyncStreamCopier
unsigned long achunksize, in boolean aclosesource, in boolean aclosesink); methods asynccopy() starts the copy operation. the specified observer is notified when the copy completes. void asynccopy( in nsirequestobserver aobserver, in nsisupports aobservercontext ); parameters aobserver receives notifications. aobservercontext the object to receive notifications with information about the progress of the copy operation. init() initializes the stream copier. note: at least one of the streams must be buffered. void init( in nsiinputstream asource, in nsioutputstream asink, in nsieventtarget atarget, in boolean asourcebuffered, in boolean asinkbuffered, in unsigned long achunksize, in boolean aclosesource, in boolean aclosesink ); parameters asource contains the data to be ...

nsIAutoCompleteSearch
void stopsearch(); parameters none. ...

nsIBrowserBoxObject
plements this interface. note: please consider using nsicontainerboxobject instead. attributes attribute type description docshell nsidocshell read only. obsolete since gecko 1.9 the nsidocshell object that manages the contained document. the browser.xml binding uses this property to gain access to the webnavigation, contentdocument, contentwindow, webbrowserfind, webprogress and sessionhistory properties. ...

nsICancelable
1.0 66 introduced gecko 1.8 inherits from: nsisupports last changed in gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) method overview void cancel(in nsresult areason); methods cancel() call this method to request that this object abort whatever operation it may be performing. ...

nsIDOMOfflineResourceList
ecking for updates. onerror nsidomeventlistener an event listener to be called when an error occurs during the caching process. onnoupdate nsidomeventlistener an event listener to be called when there is no update to download. ondownloading nsidomeventlistener an event listener to be called when resources are being downloaded into the cache. onprogress nsidomeventlistener an event listener to be called periodically throughout the download process. onupdateready nsidomeventlistener an event listener to be called when a resource update is ready; this event is not currently used since versioned application caches aren't supported yet. oncached nsidomeventlistener an event listener to be called when caching is co...

nsIDOMOrientationEvent
mount of tilt along the x axis. read only. y double the amount of tilt along the y axis. read only. z double the amount of tilt along the z axis. read only. the values of x, y, and z can range from -1 to 1, where 0 means the device is balanced on that axis. see accelerometer values explained for details. methods initorientationevent() initializes the orientation event object. void initprogressevent( in domstring eventtypearg, in boolean canbubblearg, in boolean cancelablearg, in double x, in double y, in double z ); parameters eventtypearg the type of event. must be "mozorientation". canbubblearg specifies whether or not the created event will bubble. cancelablearg specifies whether or not the created event can be canceled. x the amount of tilt along the x axis. y the amo...

nsIDownload
as started. read only. ...

nsIMessenger
ize_is(acount)] out string ahistory); note: prior to gecko 8.0, all references to nsidomwindow used in this interface were nsidomwindow. attributes attribute type description transactionmanager nsitransactionmanager readonly: the transaction manager for this nsimessenger instance. sendingunsentmsgs boolean indicates if sending messages is in progress. lastdisplayedmessageuri acstring readonly: the url of the last displayed message. navigatepos long the current index in the navigation history. constants name value description eunknown 0 unknown transaction type. edeletemsg 1 delete transaction type. emovemsg 2 move transaction type. ecopy...

nsIRequest
me of the request. often this is the uri of the request. read only. status nsresult the error status associated with the request. read only. constants various load flags which may be or'd together. constant value description load_normal 0 no special load flags. load_background 1 << 0 do not deliver status notifications to the nsiprogresseventsink, or keep this load from completing the nsiloadgroup it may belong to. the following flags control the flow of data into the cache. constant value description inhibit_caching 1 << 7 this flag prevents caching of any kind. it does not, however, prevent cached content from being used to satisfy this request. inhibit_persistent_caching 1 << 8...

nsIStringBundleService
ndles() flushes the string bundle cache - useful when the locale changes or when we need to get some extra memory back. (automatically called for the memory-pressure and chrome-flush-caches global observer topics.) void flushbundles(); parameters none. formatstatusmessage() formats a message string from a status code and status arguments. typically used to format a message received by a nsiprogresseventsink's onstatus method. wstring formatstatusmessage( in nsresult astatus, in wstring astatusarg ); parameters astatus the status code. this is mapped into a string id and and used in the string lookup process (see nsierrorservice). astatusarg the status message argument(s). multiple arguments can be separated by newline ('\n') characters. return value the formatted message. s...

nsISupports proxies
mes very complex and can require long execution time due to unzipping or native file system actions. if xpinstall ran on the ui thread, the product would appear frozen until the script was complete. this is definitely bad. because of this, xpinstall was moved to its own thread. now xpinstall can do its installations while the product renders, but now xpinstall can not access ui elements such as a progress meter or a confirmation dialog. how can a separate non-ui thread act as if it was on the ui thread? herein lays the utility of nsisupports proxies. i believe that other people working on mozilla need similar solutions. in this document, i will try to explain how to use nsisupports proxies. how do i use it? the api has changed in mozilla 1.9, but the prose below hasn't been updated yet. see xp...

nsITransportSecurityInfo
transport security, including the security state and any error message for the connection. inherits from: nsisupports last changed in gecko 1.9 (firefox 3) attributes attribute type description errormessage wstring error message on connection failure. read only. securitystate unsigned long a flag detailing the security state of the connection. the possible values are defined in nsiwebprogresslistener. read only. shortsecuritydescription wstring for secure connections (ssl) gives the common name (cn) of the certifying authority. read only. see also nsisockettransport ...

nsITreeColumn
table attribute is not set, the column cells are not selectable. read only. type short the type of the column, see constants. read only. width long the width of nsitreecolumn. read only. x long the x position in the tree of the left edge of the nsitreecolumn. read only. constants constant value description type_text 1 text column type. type_checkbox 2 checkbox column type. type_progressmeter 3 progress meter column type. methods native code only!getidconst void getidconst( [shared] out wstring idconst ); parameters idconst getnext() get the next column in the nsitreecolumns. nsitreecolumn getnext(); parameters none. return value the next nsitreecolumn in the nsitreecolumns. getprevious() get the previous column in the nsitreecolumn. nsitreecolumn getprevious(); parame...

nsIWebBrowserPersist
pports afile, in boolean aisprivate); attributes attribute type description currentstate unsigned long current state of the persister object. read only. persistflags unsigned long flags governing how data is fetched and saved from the network. it is best to set this value explicitly unless you are prepared to accept the default values. progresslistener nsiwebprogresslistener callback listener for progress notifications. the object that the embbedder supplies may also implement nsiinterfacerequestor and be prepared to return nsiauthprompt or other interfaces that may be required to download data. result unsigned long value indicating the success or failure of the persist operation. read only. constants ...

nsIXMLHttpRequestUpload
rget last changed in gecko 1.9.1 (firefox 3.5 / thunderbird 3.0 / seamonkey 2.0) attributes attribute type description onabort nsidomeventlistener onerror nsidomeventlistener onload nsidomeventlistener onloadstart nsidomeventlistener onprogress nsidomeventlistener see also nsixmlhttprequest nsixmlhttprequesteventtarget xmlhttprequest using xmlhttprequest ...

Using the Gecko SDK
te: nspr is the one exception to this rule. all nspr functions are frozen by default and are not marked as such in the respective header files.) the glue library exists to make common tasks easier. for example, the nscomptr class is defined in the xpcom glue library. if your component does not use any of the glue classes or functions, then you do not need to link against the glue library. work in progress... linking (link line, version script to only expose nsgetmodule, etc.) ...

XPCOM tasks
issues, e.g., too many locks. see bug 13009. not enough locks. see bug 5795, bug 12755, and bug 12755. p1 we would like to move to a scheme where no one writes queryinterface, and we save code-space with a table driven implementation. a first step is moving all qi implementations to the table-like macros already in place (and some slight modifications to those macros). see bug 23737 work is progressing on this. see in particular, the new ns_interface_map_... macros in "nsisupportsutils.h". p1 we need to use ns_get_iid instead of ns_define_iid. see bug 25886. work is progressing on this. p2 classes that parallel standard library classes should have compatible apis, i.e., nsdeque bug 18505 nsstring nsavltree nshashtable our various array classes in some cases, this might initially be...

Address Book examples
this article provides examples on accessing and manipulating thunderbird address books. address book interfaces provides an overview of the related interfaces. see an overview of thunderbird components for a general description of the thunderbird user interface and related programmatic interfaces. how do i get all address books? use the address book manager to get an nsisimpleenumerator, then progress through the enumerator, looking for nsiabitem, nsiabcollection or nsiabdirectory interfaces as you require. let abmanager = components.classes["@mozilla.org/abmanager;1"] .getservice(components.interfaces.nsiabmanager); let alladdressbooks = abmanager.directories; while (alladdressbooks.hasmoreelements()) { let addressbook = alladdressbooks.getnext() ...

Address book sync client design
.cooookies! */ void onstopauthoperation(in nsresult astatus, in wstring amsg, in string acookie); /** * notify the observer that the ab sync operation has begun. this method is * called only once, at the beginning of a sync transaction * */ void onstartoperation(in print32 atransactionid, in pruint32 amsgsize); /** * notify the observer that progress as occurred for the ab sync operation */ void onprogress(in print32 atransactionid, in pruint32 aprogress, in pruint32 aprogressmax); /** * notify the observer with a status message for sync operation */ void onstatus(in print32 atransactionid, in wstring amsg); /** * notify the observer that the ab sync operation has been completed. * * thi...

nsIMsgCloudFileProvider
e() returns the url for a file that has been uploaded. acstring urlforfile(in nsilocalfile afile); parameters afile the previously uploaded file to get the url for. return value the string representation of the url for the uploaded file. if the file was not uploaded with this instance of the nsimsgcloudfileprovider, returns undefined. cancelfileupload() cancels an upload currently in progress for some nsilocalfile. void cancelfileupload(in nsilocalfile afile); parameters afile the nsilocalfile that is currently being uploaded to cancel. refreshuserinfo() refreshes the data for this user account - for example, the storage quota, or the amount of storage being used. void refreshuserinfo(in boolean awithui, in nsirequestobserver acallback); parameters ...

Mail client architecture overview
e the datasource to create user interfaces based on this data. datasources are also used to run commands that operate on this mail data. events - as data changes throughout the mail application, the event system notifies key components such as datasources and the url system of these changes. mail window management - each mail window maintains a certain amount of state to aid in view navigation, progress display, etc. url display and dispatching - in order to perform network operations such as downloading new mail, copying and moving messages, and displaying messages from a remote server, the url system interacts with necko and reflects it's state to the mail window. there are also a number of protocol independant subsystems that have a symbiotic relationship with base: libmime - for dealin...

Activity Manager examples
ation is omitted, initiator is not provided process.init("processing folder: " + folder.prettiestname, null); // note that we don't define a custom icon, default process icon // will be used process.contexttype = "account"; // group this activity by account process.contextobj = folder.server; // account in question gactivitymanager.addactivity(process); // step 2: showing some progress let percent = 50; process.setprogress(percent, "junk processing 25 of 50 messages", 25, 50); // step 3: removing the process and adding an event using process' attributes process.state = components.interfaces.nsiactivityprocess.state_completed; gactivitymanager.removeactivity(process.id); let event = components.classes["@mozilla.org/activity-event;1"].createinstance(nsiae); // localization is...

js-ctypes reference
ctypes reference the ctypes object is the base of the ctypes api. it is obtained by by loading the ctypes module: components.utils.import("resource://gre/modules/ctypes.jsm"); you can use the ctypes object to load libraries, construct types, and perform miscellaneous tasks such as type casting. the ctypes object also provides numerous predefined types that correspond to primitives and common typedefs in c. working with libraries to load a library, use ctypes.open(). the library object is used mostly to declare native functions provided by the library so that js-ctypes knows how to call them. see library.declare() for instructions on how to declare these functions. once you have finished working with a library, call library.close(). ...

Mozilla
memory allocator there are a lot of different memory allocators in the mozilla source tree. this article looks over some of them and tries to sort out which should be used under what circumstances. chrome registration chrome is the set of user interface elements of the application window that are outside the window's content area. toolbars, menu bars, progress bars, and window title bars are all examples of elements that are typically part of the chrome. command line options command line options are used to specify various startup options for mozilla applications.this page describes the commonly used options and how to use them. you can open the command line interface by pressing shift + f2. ...

Version, UI, and Status Information - Plugins
« previousnext » this chapter describes the functions that allow a plug-in to display a message on the status line, get agent information, and check on the current version of the plug-in api and the browser. displaying a status line message users are accustomed to checking the ui status line at the bottom of the browser window for updates on the progress of an operation or the url of a link on the page. you can also use the status line to notify the user of plug-in-related information. the user might appreciate seeing the percentage completed of the current operation or the url of a button or other link object when the cursor is over it, all of which the browser shows. in fact, your plug-in interface should be consistent with the rest of the browser in this way. to accomplish thi...

Application - Firefox Developer Tools
this includes inspection of service workers and web app manifests. accessing the application panel the application panel is available on the standard devtools tab menu under application, in firefox 79+. if you can’t see it there, you can enable it by going to the "three dot" menu and selecting settings (also accessible by pressing f1), then checking the application checkbox under default developer tools. ...

Access debugging in add-ons - Firefox Developer Tools
tools/debugger-controller.js chrome://browser/content/devtools/debugger-toolbar.js chrome://browser/content/devtools/debugger-view.js chrome://browser/content/devtools/debugger-panes.js unfortunately there is not yet any api to evaluate watches/expressions within the debugged scope, or highlight elements on the page that are referenced as variables in the debugged scope. (currently a work in progress, see bug 653545.) ...

Debugger.Frame - Firefox Developer Tools
-compartment, intra-thread calls: the call takes place in the thread to which the frame belongs, and runs in the compartment to which the handler method belongs. debugger.frame instances inherit the following handler method properties: onstep this property must be either undefined or a function. if it is a function, spidermonkey calls it when execution in this frame makes a small amount of progress, passing no arguments and providing this debugger.frame instance as the thisvalue. the function should return a resumption value specifying how the debuggee’s execution should proceed. what constitutes “a small amount of progress” varies depending on the implementation, but it is fine-grained enough to implement useful “step” and “next” behavior. if multiple debugger instances e...

DevTools API - Firefox Developer Tools
introduction the devtools api provides a way to register and access developer tools in firefox. in terms of user interface, each registered tool lives in its own tab (we call one tab a panel). these tabs are located in a box we call a toolbox. ...

Index - Firefox Developer Tools
ulate the dom by hand, if desired. 10 all keyboard shortcuts tools, l10n:priority this page lists all keyboard shortcuts used by the developer tools built into firefox. 11 application application, debugging, devtools, firefox, guide, manifests, service workers the application panel provides tools for inspecting and debugging modern web apps (also known as progressive web apps). this includes inspection of service workers and web app manifests. 12 debugging service workers application, devtools, firefox, guide, service workers in this article we will look at debugging service workers using the firefox devtools application panel. 13 inspecting web app manifests application, devtools, firefox, guide, manifest in this ...

Work with animations - Firefox Developer Tools
one way to specify the timing function is with a cubic bézier curve. timing functions defined as cubic bézier curves get an icon in the rules view. if you click the icon you get a visual editor for the curve, enabling you to drag p1 and p2, and see the results in the page: this feature uses open source code from lea verou’s cubic-bezier.com. the cubic bézier editor includes a number ...

Rich output - Firefox Developer Tools
console.log(todolist) array(4) [ {…}, {…}, {…}, {…} ] debugger eval code:1:9 undefined if you expand objects, such as arrays, you get slightly different content. ...

Firefox Developer Tools
, and layout performance. responsive design mode see how your website or app will look and behave on different devices and network types. accessibility inspector provides a means to access the page's accessibility tree, allowing you to check what's missing or otherwise needs attention. application panel provides tools for inspecting and debugging modern web apps (also known as progressive web apps). this includes inspection of service workers and web app manifests. note: the collective term for the ui inside which the devtools all live is the toolbox. more tools these developer tools are also built into firefox. unlike the "core tools" above, you might not use them every day. memory figure out which objects are keeping memory in use. storage inspector inspect cook...

AnimationEffect.getComputedTiming() - Web APIs
s associated with an animation). (also includes effecttiming.enddelay in that calculation.) activeduration the length of time in milliseconds that the animation's effects will run. this is equal to the iteration duration multiplied by the iteration count. localtime the current time of the animation in milliseconds. if the keyframeeffect is not associated with an animation, its value is null. progress indicates how far along the animation is through its current iteration with values between 0 and 1. returns null if the animation is not running or its keyframeeffect isn't associated with an animation. currentiteration the number of times this animation has looped, starting from 0. returns null if the animation is not running or its keyframeeffect isn't associated with an animation. specifi...

AnimationEvent.initAnimationEvent() - Web APIs
summary the animationevent.initanimationevent() method initializes an animation event created using the deprecated document.createevent("animationevent") method. animationevent created this way are untrusted. note: during the standardization process, this method was removed from the specification. it has been deprecated and is in the progress of being removed from most implementations. do not use this method; instead, use the standard constructor, animationevent(), to create a synthetic animationevent. syntax animationevent.initanimationevent(typearg, canbubblearg, cancelablearg, animationnamearg, elapsedtimearg); parameters typearg a domstring identifying the specific type of animation event that occurred. the following values are allowed: value meaning ...

AudioContext.close() - Web APIs
o resources that it uses. closed contexts cannot have new nodes created, but can decode audio data, create buffers, etc. this function does not automatically release all audiocontext-created objects, unless other references have been released as well; however, it will forcibly release any system audio resources that might prevent additional audiocontexts from being created and used, suspend the progression of audio time in the audio context, and stop processing audio data. the returned promise resolves when all audiocontext-creation-blocking resources have been released. this method throws an invalid_state_err exception if called on an offlineaudiocontext. syntax var audioctx = new audiocontext(); audioctx.close().then(function() { ... }); await audioctx.close(); returns a promise that reso...

AudioContext.resume() - Web APIs
this method will cause an invalid_state_err exception to be thrown if called on an offlineaudiocontext. syntax completepromise = audiocontext.resume(); parameters none. return value a promise that resolves when the context has resumed. the promise is rejected if the context has already been closed. example the following snippet is taken from our audiocontext states demo (see it running live.) when the suspend/resume button is clicked, the audiocontext.state is queried — if it is running, suspend() is called; if it is suspended, resume() is called. ...

AudioContext.suspend() - Web APIs
this method will cause an invalid_state_err exception to be thrown if called on an offlineaudiocontext. syntax var audioctx = new audiocontext(); audioctx.suspend().then(function() { ... }); returns a promise that resolves with void. the promise is rejected if the context has already been closed. ...

AudioContext - Web APIs
h may be stored in a local file or sent to another computer. audiocontext.createmediastreamtracksource() creates a mediastreamtrackaudiosourcenode associated with a mediastream representing an media stream track. audiocontext.getoutputtimestamp() returns a new audiotimestamp object containing two audio timestamp values relating to the current audio context. audiocontext.resume() resumes the progression of time in an audio context that has previously been suspended/paused. audiocontext.suspend() suspends the progression of time in the audio context, temporarily halting audio hardware access and reducing cpu/battery usage in the process. examples basic audio context declaration: var audioctx = new audiocontext(); cross browser variant: var audiocontext = window.audiocontext || window.w...

AudioParam.setTargetAtTime() - Web APIs
ve to worry about reaching the target value; once you are close enough, any further changes will be imperceptible to a human listener. depending on your use case, getting 95% toward the target value may already be enough; in that case, you could set timeconstant to one third of the desired duration. for more details, check the following table on how the value changes from 0% to 100% as the time progresses. time since starttime value 0 * timeconstant 0% 0.5 * timeconstant 39.3% 1 * timeconstant 63.2% 2 * timeconstant 86.5% 3 * timeconstant 95.0% 4 * timeconstant 98.2% 5 * timeconstant 99.3% n * timeconstant 1-e-n1 - e^{-n} examples in this example, we have a media source with t...

DirectoryEntrySync - Web APIs
ssion to access the element referred to by path. [ todo: explain why ] type_mismatch_err the path supplied exists, but it is not a directory. removerecursively() deletes a directory and all of its contents. you cannot delete the root directory of a file system. if you delete a directory that contains a file that cannot be removed or if an error occurs while the deletion is in progress, some of the contents might not be deleted. catch these cases with error callbacks and retry the deletion. void removerecursively ( ) raises (fileexception); parameter none returns void exceptions this method can raise a fileexception with the following codes: exception description not_found_err the target directory does not exist. invalid_state_err ...

Cross-global fetch usage - Web APIs
ed in the spec, which could lead to problems further down the line. the solution in firefox 60 onwards, mozilla resolves the relative url against the global that owns the fetch() function being used (see bug 1432272). so in the case described above, it is resolved against the iframe's location: let absolute = new url(relative, frame.contentwindow.location.href) there is a lot of discussion in progress about getting new specs to align with this behavior change, to mitigate potential problems going forward. ...

FileReader.abort() - Web APIs
the abort method aborts the read operation. upon return, the readystate will be done. syntax instanceoffilereader.abort(); exceptions dom_file_abort_err thrown when abort is called while no read operation is in progress (that is, the state isn't loading). specifications specification status comment file apithe definition of 'abort()' in that specification. working draft initial definition ...

FileReader: error event - Web APIs
the error event is fired when the read failed due to an error (for example, because the file was not found or not readable). ...

FileRequest - Web APIs
work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. summary the filerequest interface extends the domrequest interface to provide some extra properties necessary for the lockedfile objects. properties filerequest.lockedfile read only the lockedfile object from which the request was started. filerequest.onprogress a callback handler called repeatedly while the operation represented by the filerequest is in progress. the filerequest interface also inherits from the domrequest interface. methods none. specifications specification status comment filesystem api editor's draft draft proposal. ...

Using the Gamepad API - Web APIs
v"); b.classname = "buttons"; for (var i = 0; i < gamepad.buttons.length; i++) { var e = document.createelement("span"); e.classname = "button"; //e.id = "b" + i; e.innerhtml = i; b.appendchild(e); } d.appendchild(b); var a = document.createelement("div"); a.classname = "axes"; for (var i = 0; i < gamepad.axes.length; i++) { var p = document.createelement("progress"); p.classname = "axis"; //p.id = "a" + i; p.setattribute("max", "2"); p.setattribute("value", "1"); p.innerhtml = i; a.appendchild(p); } d.appendchild(a); // see https://github.com/luser/gamepadtest/blob/master/index.html var start = document.getelementbyid("start"); if (start) { start.style.display = "none"; } document.body.appendchild(d); requesta...

GlobalEventHandlers.onloadstart - Web APIs
e onloadstart property sets and returns the event handler for the loadstart event. syntax element.onloadstart = handlerfunction; var handlerfunction = element.onloadstart; handlerfunction should be either null or a javascript function specifying the handler for the event. notes see the dom event handlers page for information on working with on... handlers. the loadstart event is fired when progress has begun. see the loadstart event documentation for more information about the event. specification specification status comment html living standardthe definition of 'loadstart' in that specification. living standard ...

GlobalEventHandlers.onloadend - Web APIs
the onloadend property of the globaleventhandlers mixin is an eventhandler representing the code to be called when the loadend event is raised (when progress has stopped on the loading of a resource.) syntax img.onloadend = funcref; value funcref is the handler function to be called when the resource's loadend event fires. examples html content <img src="myimage.jpg"> javascript content // 'loadstart' fires first, then 'load', then 'loadend' image.addeventlistener('load', function(e) { console.log('image loaded'); }); image.addeventlistener('loadstart', function(e) { console.log('image load started'); }); image.addeventlistener('loadend', function(e) { console.log('image load finished'); }); ...

GlobalEventHandlers.onloadstart - Web APIs
the onloadstart property of the globaleventhandlers mixin is an eventhandler representing the code to be called when the loadstart event is raised (when progress has begun on the loading of a resource.) syntax img.onloadstart = funcref; value funcref is the handler function to be called when the resource's loadstart event fires. examples html content <img src="myimage.jpg"> javascript content // 'loadstart' fires first, then 'load', then 'loadend' image.addeventlistener('load', function(e) { console.log('image loaded'); }); image.addeventlistener('loadstart', function(e) { console.log('image load started'); }); image.addeventlistener('loadend', function(e) { console.log('image load finished'); }); specifications specification status comment html li...

HTMLImageElement.lowSrc - Web APIs
ways to achieve this; primary among them: higher compression levels (for example, a primary image saved as a jpeg using 85% quality might have a lowsrc version saved at 15%. reduced color depth; a primary image in 32-bit color might have an alternate image in 8-bit color. important: the lowsrc property is obsolete and should not be used. instead, you should use an image format which loads progressively (such as progressive jpeg). or simply make sure your images are all well-optimized and balanced for appearance versus size. usage notes lowsrc is a strange case. it was never technically part of the html specification (it was a mozilla extension to html); however, html 5 does list it among the obsolete attributes. browser compatibility the compatibility table on this page is generated f...

HTMLMediaElement: loadstart event - Web APIs
t-log>label { display: block; } js const loadvideo = document.queryselector('button'); const video = document.queryselector('video'); const eventlog = document.queryselector('.event-log-contents'); let source = null; function handleevent(event) { eventlog.textcontent = eventlog.textcontent + `${event.type}\n`; } video.addeventlistener('loadstart', handleevent); video.addeventlistener('progress', handleevent); video.addeventlistener('canplay', handleevent); video.addeventlistener('canplaythrough', handleevent); loadvideo.addeventlistener('click', () => { if (source) { document.location.reload(); } else { loadvideo.textcontent = "reset example"; source = document.createelement('source'); source.setattribute('src', 'https://interactive-examples.md...

HTMLMediaElement - Web APIs
e play is handled and the activity has entered its paused state, most commonly occurring when the media's htmlmediaelement.pause() method is called. play fired when the paused property is changed from true to false, as a result of the htmlmediaelement.play() method, or the autoplay attribute playing fired when playback is ready to start after having been paused or delayed due to lack of data progress fired periodically as the browser loads a resource. ratechange fired when the playback rate has changed. seeked fired when a seek operation completes seeking fired when a seek operation begins stalled fired when the user agent is trying to fetch media data, but data is unexpectedly not forthcoming. suspend fired when the media data loading has been suspended. timeupdate fired when t...

The HTML DOM API - Web APIs
mliframeelement htmlimageelement htmlinputelement htmllielement htmllabelelement htmllegendelement htmllinkelement htmlmapelement htmlmediaelement htmlmenuelement htmlmetaelement htmlmeterelement htmlmodelement htmlolistelement htmlobjectelement htmloptgroupelement htmloptionelement htmloutputelement htmlparagraphelement htmlparamelement htmlpictureelement htmlpreelement htmlprogresselement htmlquoteelement htmlscriptelement htmlselectelement htmlslotelement htmlsourceelement htmlspanelement htmlstyleelement htmltablecaptionelement htmltablecellelement htmltablecolelement htmltableelement htmltablerowelement htmltablesectionelement htmltemplateelement htmltextareaelement htmltimeelement htmltitleelement htmltrackelement htmlulistelement htmlunknownelement ...

IDBRequest.error - Web APIs
b workers. syntax var myerror = request.error; value a domerror containing the relevant error. in chrome 48+/firefox 58+ this property returns a domexception because domerror has been removed from the dom standard. the following error codes are returned under certain conditions: error explanation aborterror if you abort the transaction, then all requests still in progress receive this error. constrainterror if you insert data that doesn't conform to a constraint. it's an exception type for creating stores and indexes. you get this error, for example, if you try to add a new key that already exists in the record. quotaexceedederror if you run out of disk quota and the user declined to grant you more space. unknownerror if the ope...

Using the MediaStream Recording API - Web APIs
r.start() is used to start recording the stream once the record button is pressed: record.onclick = function() { mediarecorder.start(); console.log(mediarecorder.state); console.log("recorder started"); record.style.background = "red"; record.style.color = "black"; } when the mediarecorder is recording, the mediarecorder.state property will return a value of "recording". as recording progresses, we need to collect the audio data. we register an event handler to do this using mediarecorder.ondataavailable: let chunks = []; mediarecorder.ondataavailable = function(e) { chunks.push(e.data); } note: the browser will fire dataavailable events as needed, but if you want to intervene you can also include a timeslice when invoking the start() method — for example start(10000) — to c...

Navigator.vibrate() - Web APIs
if the method was unable to vibrate because of invalid parameters, it will return false, else it returns true. if the pattern leads to a too long vibration, it is truncated: the max length depends on the implementation. ...

OfflineAudioContext.resume() - Web APIs
the promise resolves immediately because the offlineaudiocontext does not require the audio hardware. if the context is not currently suspended or the rendering has not started, the promise is rejected with invalidstateerror. syntax offlineaudiocontext.resume().then(function() { ... }); parameters none. returns a promise resolving to void. exceptions the promise is rejected when the following exception is encountered. invalidstateerror if the context is not currently suspended or the rendering has not started. ...

OfflineAudioContext.suspend() - Web APIs
this is generally useful at the time of manipulating the audio graph synchronously on offlineaudiocontext. note that the maximum precision of suspension is the size of the render quantum and the specified suspension time will be rounded down to the nearest render quantum boundary. for this reason, it is not allowed to schedule multiple suspends at the same quantized frame. also scheduling should be done while the context is not running to ensure the precise suspension. ...

Using the Performance API - Web APIs
...

Using Performance Timeline - Web APIs
three getentries*() methods as the performance interface and these methods are used to retrieve observed performance entries within the observer callback. these methods have been used in the above stated example. specifications the interfaces described in this document are defined in the performance timeline standard which has two levels: performance timeline level 2; editors draft; work in progress. this version introduces performance observers (and the performanceobserver and performanceobserverentrylist interfaces). performance timeline; w3c recommendation 12 december 2013 see also performance timeline (overview) a primer for web performance timing apis ...

Using the Permissions API - Web APIs
o support in browsers is pretty spotty: it can only be found in chrome 44 and later and firefox 43 and later. the only supported method right now is permissions.query(), which queries permission status. the only two apis currently recognized by the permissions api in chrome are geolocation and notification, with firefox also recognizing push and webmidi. more features will be added as time progresses. a simple example for this article, we have put together a simple demo called location finder. it uses geolocation to query the user's current location and plot it out on a google map: you can run the example live, or view the source code on github. most of the code is simple and unremarkable — below we'll just be walking through the permissions api-related code, so check the code yourse...

Using Pointer Events - Web APIs
n", handlestart, false); el.addeventlistener("pointerup", handleend, false); el.addeventlistener("pointercancel", handlecancel, false); el.addeventlistener("pointermove", handlemove, false); log("initialized."); } this simply sets up all the event listeners for our <canvas> element so we can handle the touch events as they occur. tracking new touches we'll keep track of the touches in-progress. var ongoingtouches = new array(); when a pointerdown event occurs, indicating that a new touch on the surface has occurred, the handlestart() function below is called. function handlestart(evt) { log("pointerdown."); var el = document.getelementsbytagname("canvas")[0]; var ctx = el.getcontext("2d"); log("pointerdown: id = " + evt.pointerid); ongoingtouches.push(copytouch(evt)); ...

RTCIceCandidatePairStats.state - Web APIs
the check list, it begins in the frozen state. as soon as there are no checks ongoing which block the pair from being analyzed, it is unfrozen and moves into the waiting state. this may happen immediately upon being added to the check list. each time a candidate pair is done being checked, the next-highest priority candidate pair remaining on the check list moves from the waiting state to the in-progress state, and its check begins. if the check fails for any reason, the pair moves into its final state, failed. if the check succeeds, the pair ends up in the succeeded state. the ice check list state for any given pair of ice candidates can be found in the corresponding the state property. specifications specification status comment identifiers for webrtc's statistics...

RTCIceTransport: selectedcandidatepairchange event - Web APIs
to establish a connection to be used by the rtcicetransport, and, by extension, by an rtcpeerconnection. bubbles no cancelable no interface event event handler property onselectedcandidatepairchange examples this example creates an event handler for selectedcandidatepairchange that updates a display providing the user information about the progress of the ice negotiation for an rtcpeerconnection called pc. let icetransport = pc.getsenders[0].transport.icetransport; let localprotoelem = document.getelementbyid("local-protocol"); let remoteprotoelem = document.getelementbyid("remote-protocol"); icetransport.addeventlistener("selectedcandidatepairchange", ev => { let pair = icetransport.getselectedcandidatepair(); localprotoelem.innertex...

RTCPeerConnection.onnegotiationneeded - Web APIs
is fired when a change has occurred which requires session negotiation. this negotiation should be carried out as the offerer, because some session changes cannot be negotiated as the answerer. most commonly, the negotiationneeded event is fired after a send track is added to the rtcpeerconnection. if the session is modified in a manner that requires negotiation while a negotiation is already in progress, no negotiationneeded event will fire until negotiation completes, and only then if negotiation is still needed. syntax rtcpeerconnection.onnegotiationneeded = eventhandler; value this should be set to a function you provide which is passed a single parameter: an event object containing the negotiationneeded event. there's no additional information provided in the event; anything you need, y...

RTCPeerConnection.pendingLocalDescription - Web APIs
currently stands, but as it may exist in the near future. use rtcpeerconnection.currentlocaldescription or rtcpeerconnection.localdescription to get the current state of the endpoint. for details on the difference, see pending and current descriptions in webrtc connectivity. syntax sessiondescription = rtcpeerconnection.pendinglocaldescription; return value if a local description change is in progress, this is an rtcsessiondescription describing the proposed configuration. otherwise, this returns null. example this example looks at the pendinglocaldescription to determine whether or not there's a description change being processed. var pc = new rtcpeerconnection(); … var sd = pc.pendinglocaldescription; if (sd) { // there's a description change underway! } else { // no description cha...

RTCPeerConnection.pendingRemoteDescription - Web APIs
t may exist in the near future. use rtcpeerconnection.currentremotedescription or rtcpeerconnection.remotedescription to get the current session description for the remote endpoint. for details on the difference, see pending and current descriptions in webrtc connectivity. syntax sessiondescription = rtcpeerconnection.pendingremotedescription; return value if a remote description change is in progress, this is an rtcsessiondescription describing the proposed configuration. otherwise, this returns null. example this example looks at the pendingremotedescription to determine whether or not there's a description change being processed. var pc = new rtcpeerconnection(); … var sd = pc.pendingremotedescription; if (sd) { // there's a description change underway! } else { // no description c...

RTCStatsIceCandidatePairState - Web APIs
is pair has been performed but failed. a failure can occur either because no response was received or because the response indicated that an unrecoverable error occurred. frozen no check has been performed yet for this candidate pair, and performing the check is blocked until another check is successful. once that check has succeeded, this pair will unfreeze and move into the waiting state. in-progress a check has been initiated for this pair, but the check's transaction is still in progress. succeeded a check for this pair has been completed successfully. waiting this pair has not yet been checked, but the check can be performed as soon as this pair is the highest priority pair remaining in the waiting state. specifications specification status comment ident...

ServiceWorkerGlobalScope.skipWaiting() - Web APIs
lves with undefined. example while self.skipwaiting() can be called at any point during the service worker's execution, it will only have an effect if there's a newly installed service worker that might otherwise remain in the waiting state. therefore, it's common to call self.skipwaiting() from inside of an installevent handler. the following example causes a newly installed service worker to progress into the activating state, regardless of whether there is already an active service worker. self.addeventlistener('install', function(event) { // the promise that skipwaiting() returns can be safely ignored. self.skipwaiting(); // perform any other actions required for your // service worker to install, potentially inside // of event.waituntil(); }); specifications specifi...

ServiceWorkerGlobalScope - Web APIs
ange property. sync triggered when a call to syncmanager.register is made from a service worker client page. the attempt to sync is made either immediately if the network is available or as soon as the network becomes available. also available via the serviceworkerglobalscope.onsync property. methods serviceworkerglobalscope.skipwaiting() allows the current service worker registration to progress from waiting to active state while service worker clients are using it. serviceworkerglobalscope implements workerglobalscope — which implements windoworworkerglobalscope. therefore it also has the following property available to it: globalfetch.fetch() starts the process of fetching a resource. this returns a promise that resolves to the response object representing the response to your ...

SourceBuffer.updating - Web APIs
the updating read-only property of the sourcebuffer interface indicates whether the sourcebuffer is currently being updated — i.e. whether an sourcebuffer.appendbuffer(), sourcebuffer.appendstream(), or sourcebuffer.remove() operation is currently in progress. syntax var isupdating = sourcebuffer.updating; value a boolean. example tbd specifications specification status comment media source extensionsthe definition of 'updating' in that specification. recommendation initial definition. ...

SourceBuffer - Web APIs
default values to use if kind, label, and/or language information is not available in the initialization segment of the media to be appended to the sourcebuffer. sourcebuffer.updating read only a boolean indicating whether the sourcebuffer is currently being updated — i.e. whether an sourcebuffer.appendbuffer(), sourcebuffer.appendstream(), or sourcebuffer.remove() operation is currently in progress. sourcebuffer.videotracks read only a list of the video tracks currently contained inside the sourcebuffer. event handlers sourcebuffer.onabort fired whenever sourcebuffer.appendbuffer() or sourcebuffer.appendstream() is ended by a call to sourcebuffer.abort(). sourcebuffer.updating changes from true to false. sourcebuffer.onerror fired whenever an error occurs during sourcebuffer.appe...

Streams API - Web APIs
s can be read independently. simple writer: this example shows how to to write to a writable stream, then decode the stream and write the contents to the ui. unpack chunks of a png: this example shows how pipethrough() can be used to transform a readablestream into a stream of other data types by transforming a data of a png file into a stream of png chunks. examples from other developers: progress indicators with streams, service workers, & fetch. specifications specification status comment streams living standard initial definition. ...

TextEncoder.prototype.encodeInto() - Web APIs
this is potentially more performant than the older encode() method especially when the target buffer is a view into a wasm heap. syntax b1 = encoder.encodeinto(string, uint8array); parameters string is a usvstring containing the text to encode. uint8array is a uint8array object instance to place the resulting utf-8 encoded text into. ...

TextEncoder - Web APIs
d only always returns "utf-8". methods the textencoder interface doesn't inherit any method. textencoder.prototype.encode() takes a usvstring as input, and returns a uint8array containing utf-8 encoded text. textencoder.prototype.encodeinto() takes a usvstring to encode and a destination uint8array to put resulting utf-8 encoded text into, and returns a dictionary object indicating the progress of the encoding. this is potentially more performant than the older encode() method. polyfill the below polyfill is compliant with the standard and therefore only supports utf-8. it is designed to work in ie5 "out of the box". however, in ie5-ie9, it will return a regular array instead of a typedarray. in those cases a polyfill might be impractical for large strings. finally, note that you sho...

Using Touch Events - Web APIs
node should be large enough to accommodate a finger touch. if the target area is too small, touching it could result in firing other events for adjacent elements. implementation and deployment status the touch events browser compatibility data indicates touch event support among mobile browsers is relatively broad, with desktop browser support lagging although additional implementations are in progress. some new features regarding a touch point's touch area - the area of contact between the user and the touch surface - are in the process of being standardized. the new features include the x and y radius of the ellipse that most closely circumscribes a touch point's contact area with the touch surface. the touch point's rotation angle - the number of degrees of rotation to apply to the describe...

Touch events - Web APIs
l.addeventlistener("touchend", handleend, false); el.addeventlistener("touchcancel", handlecancel, false); el.addeventlistener("touchmove", handlemove, false); } document.addeventlistener("domcontentloaded", startup); this simply sets up all the event listeners for our <canvas> element so we can handle the touch events as they occur. tracking new touches we'll keep track of the touches in-progress. var ongoingtouches = []; when a touchstart event occurs, indicating that a new touch on the surface has occurred, the handlestart() function below is called. function handlestart(evt) { evt.preventdefault(); console.log("touchstart."); var el = document.getelementbyid("canvas"); var ctx = el.getcontext("2d"); var touches = evt.changedtouches; for (var i = 0; i < touches.length; ...

TransformStream - Web APIs
s, encoding, options} super(t) _jstes_wm.set(this, t) } get encoding() {return _jstds_wm.get(this).decoder.encoding} get fatal() {return _jstds_wm.get(this).decoder.fatal} get ignorebom() {return _jstds_wm.get(this).decoder.ignorebom} } chaining multiple readablestreams together this is a useful one, where multiple streams can be conjoined. examples include building a pwa with progressive loading and progressive streaming. let responses = [ /* conjoined response tree */ ] let {readable, writable} = new transformstream responses.reduce( (a, res, i, arr) => a.then(() => res.pipeto(writable, {preventclose: (i+1) !== arr.length})), promise.resolve() ) note that this is not resilient to other influences. specifications specification status comment s...

TransitionEvent.initTransitionEvent() - Web APIs
the transitionevent.inittransitionevent() method initializes a transition event created using the deprecated document.createevent("transitionevent") method. transitionevent created that way are untrusted. note: this method has been dropped during the standard process. it has been deprecated and is in the progress of been removed from most implementation. do not use it anymore, use the standard constructor, transitionevent(), to create a synthetic transitionevent syntax transitionevent.inittransitionevent(typearg, canbubblearg, cancelablearg, transitionnamearg, elapsedtimearg); parameters typearg is a domstring identifying the specific type of transition event that occurred. the following value is allowed: value meaning transitionend the transit...

Geometry and reference spaces in WebXR - Web APIs
n reference spaces some xr devices simply can't be made to support a given experience, despite the efforts the api goes to to make up for any missing capabilities. for example, there's simply no way for a basic headset such as a gearvr device to be made to work in an app that requires support for allowing the user to walk around the environment by tracking their real-world movements. to support progressive enhancement—and thus broaden the availability of your app or site—you should choose a reference space that offers the lowest amount of functionality needed, or provide a fallback mechanism that detects failed attempts to obtain reference spaces and tries again with a less powerful alternative. the compatibility issues that arise may be as fundamental as being unable to support immersive-a...

Starting up and shutting down a WebXR session - Web APIs
) { case "hidden": myframerate = 10; break; case "blurred-visible": myframerate = 30; break; case "visible": default: myframerate = 60; break; } }; this example changes a variable myframerate depending on the visibility state as it changes. presumably the renderer uses this value to compute how often to render new frames as the animation loop progresses, thus rendering less frequently the more "blurred" the scene becomes. detecting reference space resets occasionally, discontinuities or jumps in the native origin may occur while tracking the user's position in the world. the most common scenarios in which this happens are when the user requests a recalibration of their xr device or when a hiccup or glitch occurs in the flow of tracking data ...

Web Animations API Concepts - Web APIs
the timeline object, assembles a playable animation we can view and reference. we currently have only one animation effect type available: keyframeeffect. potentially we could have all kinds of animation effects in the future—e.g. effects for grouping and sequencing, not unlike features we had in flash. in fact, group effects and sequence effects have already been outlined in the currently-in-progress level 2 spec of the web animations api. assembling the animation from disparate pieces we can assemble all these pieces together to create a working animation with the animation() constructor or we can use the element.animate() shortcut function. (read more about how to use element.animate() in using the web animations api.) uses the api allows for the creation of dynamic animations that can ...

Advanced techniques: Creating and sequencing audio - Web APIs
) { // while there are notes that will need to play before the next interval, schedule them and advance the pointer. while (nextnotetime < audioctx.currenttime + scheduleaheadtime ) { schedulenote(currentnote, nextnotetime); nextnote(); } timerid = window.settimeout(scheduler, lookahead); } we also need a draw function to update the ui, so we can see when the beat progresses. let lastnotedrawn = 3; function draw() { let drawnote = lastnotedrawn; let currenttime = audioctx.currenttime; while (notesinqueue.length && notesinqueue[0].time < currenttime) { drawnote = notesinqueue[0].note; notesinqueue.splice(0,1); // remove note from queue } // we only need to draw if the note has moved. if (lastnotedrawn != drawnote) { ...

Web Locks API - Web APIs
ved by the script: // capture promise control functions: let resolve, reject; const p = new promise((res, rej) => { resolve = res; reject = rej; }); // request the lock: navigator.locks.request('my_resource', lock => { // lock is acquired. return p; // now lock will be held until either resolve() or reject() is called. }); deadlocks a deadlock occurs when a process can no longer make progress because each part is waiting on a request that cannot be satisfied. this can occur with this api in complex use-cases, for example, if multiple locks are requested out-of-order. if tab 1 holds lock a and tab 2 holds lock b, then tab 1 attempts to also acquire lock b and tab 2 attempts to also acquire lock a, neither request can be granted. web applications can avoid this through several strategie...

Window.onappinstalled - Web APIs
the onappinstalled attribute of the window object serves as an event handler for the appinstalled event, which is dispatched once the web application is successfully installed as a progressive web app. the event that is fired is a "simple event" that implements the event interface. syntax window.onappinstalled = function(event) { ... }; example window.onappinstalled = function(ev) { console.log('the application was installed.'); }; ...

Window.requestAnimationFrame() - Web APIs
e multiple callbacks in a single frame, each receives the same timestamp even though time has passed during the computation of every previous callback's workload. this timestamp is a decimal number, in milliseconds, but with a minimal precision of 1ms (1000 µs). be sure to always use the first argument (or some other method for getting the current time) to calculate how much the animation will progress in a frame, otherwise the animation will run faster on high refresh rate screens. check the example below for a way to do this. syntax window.requestanimationframe(callback); parameters callback the function to call when it's time to update your animation for the next repaint. the callback function is passed one single argument, a domhighrestimestamp similar to the one returned by perfor...

XDomainRequest.responseText - Web APIs
returns the response body of an xdomainrequest as a string. note: this property is valid during the xdomainrequest.onprogress and xdomainrequest.onload events. syntax var response = xdr.responsetext; this sets response to contain the response body of the request, as a string. example var response = xdr.responsetext; specification not part of any specification. ...

XMLHttpRequest.multipart - Web APIs
e is non-standard and is not on a standards track. do not use it on production sites facing the web: it will not work for every user. there may also be large incompatibilities between implementations and the behavior may change in the future. obsolete since gecko 22 this gecko-only feature was removed in firefox/gecko 22. please use server-sent events, web sockets, or responsetext from progress events instead. this boolean indicates if the response is expected to be a stream of possibly multiple xml documents. if set to true, the content type of the initial response must be multipart/x-mixed-replace or an error will occur. all requests must be asynchronous. this enables support for server push; for each xml document that's written to this request, a new xml dom document is created and...

XMLHttpRequest.readyState - Web APIs
ed, headers_received, loading and done, the names readystate_uninitialized (0), readystate_loading (1), readystate_loaded (2), readystate_interactive (3) and readystate_complete (4) are used. ...

XMLHttpRequest.status - Web APIs
the read-only xmlhttprequest.status property returns the numerical http status code of the xmlhttprequest's response. before the request completes, the value of status is 0. browsers also report a status of 0 in case of xmlhttprequest errors. ...

XMLHttpRequest.statusText - Web APIs
"not found". if the request's readystate is in unsent or opened state, the value of statustext will be an empty string. if the server response doesn't explicitly specify a status text, statustext will assume the default value "ok". ...

XMLHttpRequest: timeout event - Web APIs
the timeout event is fired when progression is terminated due to preset time expiring. bubbles no cancelable no interface progressevent event handler property ontimeout examples const client = new xmlhttprequest(); client.open('get', 'http://www.example.org/example.txt'); client.ontimeout = () => { console.error('timeout!!') }; client.send(); you could also set up the event handler using the addeventlistener() method: client.addeventlistener('timeout', () => { console.error("timeout!!"); }); specifications specification status comment xmlhttprequestthe definition of 'timeout event' in that specification. living standard ...

XMLHttpRequestEventTarget.onload - Web APIs
the value of this (i.e. the context) is the same xmlhttprequest this callback is related to. ...

XMLHttpRequestEventTarget - Web APIs
y this object. xmlhttprequesteventtarget.onload contains the function to call when an http request returns after successfully fetching content and the load event is received by this object. xmlhttprequesteventtarget.onloadstart contains the function that gets called when the http request first begins loading data and the loadstart event is received by this object. xmlhttprequesteventtarget.onprogress contains the function that is called periodically with information about the progress of the request and the progress event is received by this object. xmlhttprequesteventtarget.ontimeout contains the function that is called if the event times out and the timeout event is received by this object; this only happens if a timeout has been previously established by setting the value of the xmlhttp...

XMLHttpRequestResponseType - Web APIs
e is a text in a domstring object. ms-stream the response is part of a streaming download; this response type is only allowed for download requests, and is only supported by internet explorer. deprecated values moz-chunked-arraybuffer a firefox-only value which instructs xmlhttprequest to deliver arraybuffer objects containing chunks of the incoming data. accessing response during a progress event returns the data received so far. outside the progress event handler, the value of response is always null. you shouldn't use this non-standard (and, as of firefox 68, entirely removed) api; instead, consider using the fetch api with readable streams, which offers a standard alternative to accessing the response in a streaming fashion. specifications specification status ...

XRInputSourceArray.forEach() - Web APIs
syntax xrinputsourcearray.foreach(callback, thisarg); parameters callback a function to execute once for each entry in the array xrinputsourcearray. the callback accepts up to three parameters: currentvalue a xrinputsource object which is the value of the item from within the xrinputsourcearray which is currently being processed. currentindex optional an integer value providing the index into the array at which the element given by currentvalue is located. ...

XRSystem: requestSession() - Web APIs
syntax var sessionpromise = xr.requestsession(sessionmode, sessioninit) parameters sessionmode a domstring whose value is one of those included in the xrsessionmode enum. ...

XRView.eye - Web APIs
updateinjury() returns true if the eye is still injured or false if the eye has been restored to health by the function,. if the result is false, indicating that the eye is now healthy, we render the scene for that eye. otherwise, we don't. specifications specification status comment webxr device ...

XRViewport.y - Web APIs
to which webxr content is to be rendered. the viewport's x property identifies the x component of the origin, and its is given by the width and height properties. syntax y = xrviewport.y; value the offset from the bottom edge of the rendering surface to the bottom edge of the viewport, in pixels. note: although other web apis typically consider the y axis to begin at the top and grow larger progressing downward, webgl reverses this, with y growing larger as it goes upward on the screen. examples see the main xrviewport page for examples. specifications specification status comment webxr device apithe definition of 'xrviewport.y' in that specification. working draft initial definition. ...

ARIA live regions - Accessibility
r or warning message that flashes on the screen. alerts are particularly important for client side validation notices to users. (tbd: link to aria form tutorial with aria info) to maximize compatibility, some people recommend adding a redundant aria-live="assertive" when using this role. however, adding both aria-live and role="alert" causes double speaking issues in voiceover on ios. progressbar a hybrid between a widget and a live region. use this with aria-valuemin, aria-valuenow and aria-valuemax. (tbd: add more info here). marquee for text which scrolls, such as a stock ticker. timer or any kind of timer or clock, such as a countdown timer or stopwatch readout. advanced live regions (tbd: more granular information on the support of th...

Using ARIA: Roles, states, and properties - Accessibility
ate states and properties to an element during its life-cycle, unless the element already has appropriate aria semantics (via use of an appropriate html element). addition of aria semantics only exposes extra information to a browser's accessibility api, and does not affect a page's dom. roles widget roles button checkbox gridcell link menuitem menuitemcheckbox menuitemradio option progressbar radio scrollbar searchbox separator (when focusable) slider spinbutton switch tab tabpanel textbox treeitem composite roles the techniques below describe each composite role as well as their required and optional child roles. combobox grid (including row, gridcell, rowheader, columnheader roles) listbox (including option role) menu menubar radiogroup (see radio role) t...

WAI-ARIA Roles - Accessibility
ones for which the first draft is completed have been removed from the below list. ...

An overview of accessible web applications and widgets - Accessibility
eric elements such as <div> and <span>. while this results in a widget that looks like its desktop counterpart, there usually isn't enough semantic information in the markup to be usable by an assistive technology. the problem dynamic content on a web page can be particularly problematic for users who, for whatever reason, are unable to view the screen. stock tickers, live twitter feed updates, progress indicators, and similar content modify the dom in ways that an assistive technology (at) may not be aware of. that's where aria comes in. example 1: markup for a tabs widget built without aria labeling. there's no information in the markup to describe the widget's form and function. <!-- this is a tabs widget. how would you know, looking only at the markup? --> <ol> <li id="ch1tab"> <a hr...

Text labels and names - Accessibility
er"> <label for="mothman">mothman</label> </fieldset> </form> you can see a live, interactive version of this example on the <fieldset> reference page. see also <fieldset> <legend> form elements must be labeled all elements within a form must have a <label> that identifies its purpose. this applies to all types of <input> items, as well as <button>, <output>, <select>, <textarea>, <progress> and <meter> elements, as well as any element with the switch aria role. the form element can be placed inside the <label>, in which case the association between the form element and the label is obvious from the structure. or, you can create an association between a <label> and a form element by specifying the form element's id value as the value of the label's for attribute. example <label>i...

:-moz-ui-invalid - CSS: Cascading Style Sheets
d items have the pseudo-class applied only if the user changes them or attempts to submit an unchanged valid value. by default, gecko applies a style that creates a red "glow" (using the box-shadow property) around items, which have this pseudo-class applied. see the :invalid pseudo-class for an example that shows how to override the default style. the specification for :user-invalid is still in progress. syntax syntax not found in db! specifications specification status comment selectors level 4the definition of ':user-invalid' in that specification. working draft :user-invalid ...

::-moz-range-thumb - CSS: Cascading Style Sheets
ange". the user can move the thumb along the input's track to alter its numerical value. note: using ::-moz-range-thumb with anything but an <input type="range"> doesn't match anything and has no effect. syntax ::-moz-range-thumb examples html <input type="range" min="0" max="100" step="5" value="50"/> css input[type=range]::-moz-range-thumb { background-color: green; } result a progress bar using this style might look something like this: specifications not part of any standard. ...

::-moz-range-track - CSS: Cascading Style Sheets
ts the track (i.e., groove) in which the indicator slides in an <input> of type="range". note: using ::-moz-range-track with anything but an <input type="range"> doesn't match anything and has no effect. syntax ::-moz-range-track examples html <input type="range" min="0" max="100" step="5" value="50"/> css input[type=range]::-moz-range-track { background-color: green; } result a progress bar using this style might look something like this: specifications not part of any standard. ...

::-webkit-scrollbar - CSS: Cascading Style Sheets
others). css scrollbar selectors you can use the following pseudo elements to customize various parts of the scrollbar for webkit browsers: ::-webkit-scrollbar — the entire scrollbar. ::-webkit-scrollbar-button — the buttons on the scrollbar (arrows pointing upwards and downwards). ::-webkit-scrollbar-thumb — the draggable scrolling handle. ::-webkit-scrollbar-track — the track (progress bar) of the scrollbar. ::-webkit-scrollbar-track-piece — the part of the track (progress bar) not covered by the handle. ::-webkit-scrollbar-corner — the bottom corner of the scrollbar, where both horizontal and vertical scrollbars meet. ::-webkit-resizer — the draggable resizing handle that appears at the bottom corner of some elements. syntax syntax not found in db! examples .visi...

Using CSS animations - CSS: Cascading Style Sheets
imize performance and efficiency by, for example, reducing the update frequency of animations running in tabs that aren't currently visible. configuring the animation to create a css animation sequence, you style the element you want to animate with the animation property or its sub-properties. this lets you configure the timing, duration, and other details of how the animation sequence should progress. this does not configure the actual appearance of the animation, which is done using the @keyframes at-rule as described in defining the animation sequence using keyframes below. the sub-properties of the animation property are: animation-name specifies the name of the @keyframes at-rule describing the animation’s keyframes. animation-duration configures the length of time that an animat...

CSS Display - CSS: Cascading Style Sheets
candidate recommendation added run-in, flow, flow-root, contents and multi-keyword values. css level 2 (revision 1)the definition of 'display' in that specification. recommenda...

Auto-placement in CSS Grid Layout - CSS: Cascading Style Sheets
this is generally what you want, if you are laying out a form for example you wouldn’t want the labels and fields to become jumbled up in order to fill in some gap. however sometimes, we are laying things out that don’t have a logical order and we would like to create a layout that doesn’t have gaps in it. to do this, add the property grid-auto-fl...

CSS Grid Layout - CSS: Cascading Style Sheets
grid area gutters grid axis grid row grid column guides basic concepts of grid layout relationship of grid layout to other layout methods layout using line-based placement grid template areas layout using named grid lines auto-placement in css grid layout box alignment in css grid layout css grid, logical values and writing modes css grid layout and accessibility css grid and progressive enhancement realising common layouts using css grid subgrid external resources css grid and ie11 (polyfill) examples from jen simmons grid by example - a collection of usage examples and video tutorials codrops grid reference firefox devtools css grid inspector css grid playground grid garden - a game for learning css grid specifications specification status com...

Recipe: Media objects - CSS: Cascading Style Sheets
e once floated elements become grid items the float no longer applies so you don’t need to do anything special to clear the float. what you will need to do is remove any margins applied to the item, and any widths which we don’t need in a grid context (we have the gap property to control it in grids, and the track takes control of the sizing). relevant resources on mdn css grid layout progressive enhancement and grid layout using grid template areas fit-content grid-template-areas ...

Microsoft CSS extensions - CSS: Cascading Style Sheets
microsoft applications such as edge and internet explorer support a number of special microsoft extensions to css. these extensions are prefixed with -ms-. microsoft-only properties (avoid using on websites) note: these properties will only work in microsoft applications, and are not on a standards track. ...

animation-timing-function - CSS: Cascading Style Sheets
the source for this interactive example is stored in a github repository. if you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request. it is often convenient to use the shorthand property animation to set all animation properties at once. ...

conic-gradient() - CSS: Cascading Style Sheets
s as the background-position property, the position defines center of the gradient. if omitted, the default value is center, meaing the gradient will be centered, . <angular-color-stop> a color-stop's <color> value, followed by one or two optional stop positions, (an <angle> along the gradient's circumference axis). <color-hint> th color-hint is an interpolation hint defining how the gradient progresses between adjacent color stops. the length defines at which point between two color stops the gradient color should reach the midpoint of the color transition. if omitted, the midpoint of the color transition is the midpoint between two color stops. note: rendering of color stops in css gradients follows the same rules as color stops in svg gradients. description as with any gradient,...

display - CSS: Cascading Style Sheets
this will cause the element and all its descendant elements to no longer be announced by screen reading technology. if you want to visually hide the element, a more accessible alternative is to use a combination of p...

page-break-after - CSS: Cascading Style Sheets
syntax values auto initial value. automatic page breaks (neither forced nor forbidden). always always force page breaks after the element. avoid avoid page breaks after the element. left force page breaks after the element so that the next page is formatted as a left page. right force page breaks after the element so that the next page is formatted as a right page. recto if pages progress left-to-right, then this acts like right. if pages progress right-to-left, then this acts like left. verso if pages progress left-to-right, then this acts like left. if pages progress right-to-left, then this acts like right. page break aliases the page-break-after property is now a legacy property, replaced by break-after. for compatibility reasons, page-break-after should be treated by...

page-break-before - CSS: Cascading Style Sheets
ax values auto initial value. automatic page breaks (neither forced nor forbidden). always always force page breaks before the element. avoid avoid page breaks before the element. left force page breaks before the element so that the next page is formatted as a left page. right force page breaks before the element so that the next page is formatted as a right page. recto if pages progress left-to-right, then this acts like right. if pages progress right-to-left, then this acts like left. verso if pages progress left-to-right, then this acts like left. if pages progress right-to-left, then this acts like right. page break aliases the page-break-before property is now a legacy property, replaced by break-before. for compatibility reasons, page-break-before should be treated ...

repeating-conic-gradient() - CSS: Cascading Style Sheets
he default value is center, meaing the gradient will be centered, . <angular-color-stop> a color-stop's <color> value, followed by one or two optional stop positions, (an <angle> along the gradient's circumference axis). the last color stop minus the first color-stop angle defines the size of the repeating gradient. <color-hint> th color-hint is an interpolation hint defining how the gradient progresses between adjacent color stops. the length defines at which point between two color stops the gradient color should reach the midpoint of the color transition. if omitted, the midpoint of the color transition is the midpoint between two color stops. note: rendering of color stops in css gradients follows the same rules as color stops in svg gradients. description example repeating con...

repeating-linear-gradient() - CSS: Cascading Style Sheets
or-stop> a color-stop's <color> value, followed by one or two optional stop positions, (each being either a <percentage> or a <length> along the gradient's axis). a percentage of 0%, or a length of 0, represents the start of the gradient; the value 100% is 100% of the image size, meaning the gradient will not repeat. <color-hint> th color-hint is an interpolation hint defining how the gradient progresses between adjacent color stops. the length defines at which point between two color stops the gradient color should reach the midpoint of the color transition. if omitted, the midpoint of the color transition is the midpoint between two color stops. note: rendering of color stops in css gradients follows the same rules as color stops in svg gradients. formal syntax repeating-linear-gr...

text-overflow - CSS: Cascading Style Sheets
e https://github.com/mdn/interactive-examples and send us a pull request. the text-overflow property doesn't force an overflow to occur. to make text overflow its container you have to set other css properties: overflow and white-space. for example: overflow: hidden; white-space: nowrap; the text-overflow property only affects content that is overflowing a block container element in its inline progression direction (not text overflowing at the bottom of a box, for example). syntax the text-overflow property may be specified using one or two values. if one value is given, it specifies overflow behavior for the end of the line (the right end for left-to-right text, the left end for right-to-left text). if two values are given, the first specifies overflow behavior for the left end of the line, ...

writing-mode - CSS: Cascading Style Sheets
when set for an entire document, it should be set on the root element (html element for html documents). the source for this interactive example is stored in a github repository. if you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request. ...

CSS: Cascading Style Sheets
open web and is standardized across web browsers according to the w3c specification. previously development of various parts of css specification was done synchronously, which allowed versioning of the latest recommendation. you might have heard about css1, css2.1, css3. however, css4 has never become an official version. from css3, the scope of the specification increased significantly and the progress on different css modules started to differ so much, that it became more effective to develop and release recommendations separately per module. instead of versioning the css specification, w3c now periodically takes a snapshot of the latest stable state of the css specification. css introduction if you're new to web development, be sure to read our css basics article to learn what css is a...

Ajax - Developer guides
ging information in the ajax model. documentation getting started this article guides you through the ajax basics and gives you two simple hands-on examples to get you started. using the xmlhttprequest api the xmlhttprequest api is the core of ajax. this article will explain how to use some ajax techniques, like: analyzing and manipulating the response of the server monitoring the progress of a request submitting forms and upload binary files – in pure ajax, or using formdata objects using ajax within web workers fetch api the fetch api provides an interface for fetching resources. it will seem familiar to anyone who has used xmlhttprequest, but this api provides a more powerful and flexible feature set. server-sent events traditionally, a web page has to send a reque...

DOM onevent handlers - Developer guides
t when calling onclick(). this continues until every handler has been called, unless one of the event handlers explicitly halts the processing of the event by calling stoppropagation() on the event object itself. non-element objects event handlers can also be set with properties on non-element objects that generate events, like window, document, xmlhttprequest, and others. for example, for the progress event on instances of xmlhttprequest: const xhr = new xmlhttprequest(); xhr.onprogress = function() { … }; html onevent attributes html elements have attributes named onevent which can be used to register a handler for an event directly within the html code. when the element is built from the html, the value of its onevent attributes are copied to the dom object that represents the element, ...

Media events - Developer guides
anged to paused (paused property is true). play sent when the playback state is no longer paused, as a result of the play method, or the autoplay attribute. playing sent when the media has enough data to start playing, after the play event, but also when recovering from being stalled, when looping media restarts, and after seeked, if it was playing before seeking. progress sent periodically to inform interested parties of progress downloading the media. information about the current amount of the media that has been downloaded is available in the media element's buffered attribute. ratechange sent when the playback speed changes. seeked sent when a seek operation completes. seeking sent when a seek operation begins. s...

HTML5 - Developer guides
<video> elements embed and allow the manipulation of new multimedia content. forms improvements a look at the constraint validation api, several new attributes, new values for the <input> attribute type and the new <output> element. new semantic elements beside sections, media and forms elements, there are numerous new elements, like <mark>, <figure>, <figcaption>, <data>, <time>, <output>, <progress>, or <meter> and <main>, increasing the number of valid html5 elements. improvement in <iframe> using the sandbox and srcdoc attributes, authors can now be precise about the level of security and the wished rendering of an <iframe> element. mathml allows directly embedding mathematical formulas. introduction to html5 this article introduces how to indicate to the browser that you are using ...

Index - Developer guides
ubject with a lot of variables, so in this article, we'll introduce you to the subject and let you know how you can get started. 11 media buffering, seeking, and time ranges apps, buffer, html5, timeranges, video, buffering, seeking sometimes it's useful to know how much <audio> or <video> has downloaded or is playable without delay — a good example of this is the buffered progress bar of an audio or video player. this article discusses how to build a buffer/seek bar using timeranges, and other features of the media api. 12 setting up adaptive streaming media sources audio, hls, html5, http live streaming, mpeg-dash, video, adaptive streaming let's say you want to set up an adaptive streaming media source on a server, to be consumed inside an html5 medi...

A hybrid approach - Developer guides
ite should look great at a wide variety of resolutions, being built with responsive design in mind. future plans include exploring serving images based on user-agent. so far there is not much to see for mobile, since things are still in the formative stages of development, but you can always watch the new mozilla.org grow up on github. subscribe to the mozilla webdev blog for updates about our progress. summary no approach is a one-size-fits-all solution. web applications that want to heavily modify the content or user flow for mobile users should probably go for a separate mobile site. content-oriented pages that don’t need to modify their content for mobile users will be satisfied with responsive design. if you need to slightly alter the site’s message for mobile users, but want to reap...

Developer guides
ed for transferring text over the network to the browser. the html specification recommends the use of the utf-8 encoding (which can represent all of unicode), and regardless of the encoding used requires web content to declare that encoding. mobile web development this article provides an overview of some of the main techniques needed to design web sites that work well on mobile devices. progressive web apps progressive web apps (pwas) use modern web apis along with traditional progressive enhancement strategy to create cross-platform web applications. these apps work everywhere and provide several features that give them the same user experience advantages as native apps. this set of guides tells you all you need to know about pwas. optimization and performance when building modern we...

<img>: The Image Embed element - HTML: Hypertext Markup Language
mitted parents any element that accepts embedded content. implicit aria role with non-empty alt attribute or no alt attribute: img with empty alt attribute: no corresponding role permitted aria roles with non-empty alt attribute: button checkbox link menuitem menuitemcheckbox menuitemradio option progressbar scrollbar separator slider switch tab treeitem with empty alt attribute, none or presentation with no alt attribute, no role permitted dom interface htmlimageelement specifications specification status comment referrer policythe definition of 'referrer attribute' in that specification. ca...

<input type="range"> - HTML: Hypertext Markup Language
then a step of 1 will allow only values such as 1.5, 2.5, 3.5,... in the positive direction and -0.5, -1.5, -2.5,... in the negative direction. see the html step attribute. non standard attributes attribute description orient sets the orientation of the range slider. firefox only. orient similar to the -moz-orient non-standard css property impacting the <progress> and <meter> elements, the orient attribute defines the orientation of the range slider. values include horizontal, meaing the range is rendered horizontally, and vertical, where the range is rendered vertically. note: the following input attributes do not apply to the input range: accept, alt, checked, dirname, formaction, formenctype, formmethod, formnovalidate, formtarget, height, maxlength...

<input>: The Input (Form Input) element - HTML: Hypertext Markup Language
ut types that were checked on page load or render. :checked matches checkbox and radio input types that are currently checked (and the (<option> in a <select> that is currently selected). :indeterminate checkbox elements whose indeterminate property is set to true by javascript, radio elements, when all radio buttons with the same name value in the form are unchecked, and <progress> elements in an indeterminate state :valid form controls that can have constraint validation applied and are currently valid. :invalid form controls that have constraint validation applied and are currently not valid. matches a form control whose value doesn't match the constraints set on it by it's attributes, such as required, pattern , step and max. :in-range ...

HTML elements reference - HTML: Hypertext Markup Language
l <option> element is used to define an item contained in a <select>, an <optgroup>, or a <datalist> element. as such, <option> can represent menu items in popups and other lists of items in an html document. <output> the html output element (<output>) is a container element into which a site or app can inject the results of a calculation or the outcome of a user action. <progress> the html <progress> element displays an indicator showing the completion progress of a task, typically displayed as a progress bar. <select> the html <select> element represents a control that provides a menu of options <textarea> the html <textarea> element represents a multi-line plain-text editing control, useful when you want to allow users to enter a sizeable ...

Global attributes - HTML: Hypertext Markup Language
list of global attributes accesskey provides a hint for generating a keyboard shortcut for the current element. this attribute consists of a space-separated list of characters. the browser should use the first one that ...

HTML documentation index - HTML: Hypertext Markup Language
ext the html plaintext element (<plaintext>) renders everything following the start tag as raw text, ignoring any following html. 177 <pre>: the preformatted text element element, html, html grouping content, html:flow content, reference, web the html <pre> element represents preformatted text which is to be presented exactly as written in the html file. 178 <progress>: the progress indicator element element, html, html forms, html5, reference, web the html <progress> element displays an indicator showing the completion progress of a task, typically displayed as a progress bar. 179 <q>: the inline quotation element citation, cite, element, html, html text-level semantics, q, quotation, quotation marks, reference, web, quote the h...

Inline elements - HTML: Hypertext Markup Language
gh block and inline elements are no longer defined in html 5, use content categories instead): <a> <abbr> <acronym> <audio> (if it has visible controls) <b> <bdi> <bdo> <big> <br> <button> <canvas> <cite> <code> <data> <datalist> <del> <dfn> <em> <embed> <i> <iframe> <img> <input> <ins> <kbd> <label> <map> <mark> <meter> <noscript> <object> <output> <picture> <progress> <q> <ruby> <s> <samp> <script> <select> <slot> <small> <span> <strong> <sub> <sup> <svg> <template> <textarea> <time> <u> <tt> <var> <video> <wbr> see also block-level elements html element reference display content categories block and inline layout in normal flow ...

Preloading content with rel="preload" - HTML: Hypertext Markup Language
"sintel-short.mp4">link to the video</a> instead.</p> </video> </body> so in this case, browsers that support mp4s will preload and use the mp4, making the video player hopefully smoother/more responsive for users. browsers that don't support mp4 can still load the webm version, but don't get the advantages of preloading. this shows how preloading content can be combined with the philosophy of progressive enhancement. cross-origin fetches if you've got your sites' cors settings worked out properly, you can successfully preload cross-origin resources as long as you set a crossorigin attribute on your <link> element. one interesting case where this applies, even if the fetch is not cross-origin, is font files. because of various reasons, these have to be fetched using anonymous mode cors (see ...

Using the application cache - HTML: Hypertext Markup Language
change the manifest file itself, so that the browser knows it needs to fetch all the resources again. if the manifest file has changed, all the files listed in the manifest—as well as those added to the cache by calling applicationcache.add()—are fetched into a temporary cache, following the appropriate http caching rules. for each file fetched into this temporary cache, the browser sends a progress event to the applicationcache object. if any errors occur, the browser sends an error event, and the update halts. once all the files have been successfully retrieved, they are moved into the real offline cache automatically, and a cached event is sent to the applicationcache object. since the document has already been loaded into the browser from the cache, the updated document will not be rend...

HTML: Hypertext Markup Language
ages created by other people, you become an active participant in the world wide web. html uses "markup" to annotate text, images, and other content for display in a web browser. html markup includes special "elements" such as <head>, <title>, <body>, <header>, <footer>, <article>, <section>, <p>, <div>, <span>, <img>, <aside>, <audio>, <canvas>, <datalist>, <details>, <embed>, <nav>, <output>, <progress>, <video>, <ul>, <ol>, <li> and many others. an html element is set off from other text in a document by "tags", which consist of the element name surrounded by "<" and ">". the name of an element inside a tag is case insensitive. that is, it can be written in uppercase, lowercase, or a mixture. for example, the <title> tag can be written as <title>, <title>, or in any other way. the articles ...

Evolution of HTTP - HTTP
n practices has been published, rfc 1945. this is the definition of http/1.0 and it is notable that, in the narrow sense of the term, it isn't an official standard. http/1.1 – the standardized protocol in parallel to the somewhat chaotic use of the diverse implementations of http/1.0, and since 1995, well before the publication of http/1.0 document the next year, proper standardization was in progress. the first standardized version of http, http/1.1 was published in early 1997, only a few months after http/1.0. http/1.1 clarified ambiguities and introduced numerous improvements: a connection can be reused, saving the time to reopen it numerous times to display the resources embedded into the single original document retrieved. pipelining has been added, allowing to send a second request ...

Configuring servers for Ogg media - HTTP
s the browser to automatically begin downloading the media as soon as the page is loaded, under the assumption that the user will play it. configuration for older firefox versions serve x-content-duration headers note: as of firefox 41, the x-content-duration header is no longer supported. see bug 1160695 for more details. the ogg format doesn't encapsulate the duration of media, so for the progress bar on the video controls to display the duration of the video, gecko needs to determine the length of the media using other means. there are two ways gecko can do this. the best way is to offer an x-content-duration header when serving ogg media files. this header provides the duration of the video in seconds (not in hh:mm:ss format) as a floating-point value. for example, if the video is 1 mi...

HTTP headers - HTTP
expires the date/time after which the response is considered stale. pragma implementation-specific header that may have various effects anywhere along the request-response chain. used for backwards compatibility with http/1.0 caches where the cache-control header is not yet present. warning general warning information about possible problems. client hints http client hints are a work in progress. actual documentation can be found on the website of the http working group. accept-ch servers can advertise support for client hints using the accept-ch header field or an equivalent html <meta> element with http-equiv attribute ([html5]). accept-ch-lifetime servers can ask the client to remember the set of client hints that the server supports for a specified period of time, to enable...

Link prefetching FAQ - HTTP
ection 6.12: link types). however, the exact mechanism employed by mozilla is not yet standardized. an internet-draft is in the works. standardization of this technique is part of the scope of html 5, see the current working draft, section §5.11.3.13. link type "prefetch". how is browser idle time determined? in the current implementation (mozilla 1.2), idle time is determined using the nsiwebprogresslistener api. we attach a listener to the toplevel nsiwebprogress object ("@mozilla.org/docloaderservice;1"). from this, we receive document start & stop notifications, and we approximate idle time as the period between the last document stop and the next document start. the last document stop notification occurs roughly when the onload handler would fire for the toplevel document. this is when we...

An overview of HTTP - HTTP
s are sent in close succession. in order to mitigate this flaw, http/1.1 introduced pipelining (which proved difficult to implement) and persistent connections: the underlying tcp connection can be partially controlled using the connection header. http/2 went a step further by multiplexing messages over a single connection, helping keep the connection warm and more efficient. experiments are in progress to design a better transport protocol more suited to http. for example, google is experimenting with quic which builds on udp to provide a more reliable and efficient transport protocol. what can be controlled by http this extensible nature of http has, over time, allowed for more control and functionality of the web. cache or authentication methods were functions handled early in http history.

303 See Other - HTTP
this response code is usually sent back as a result of put or post. ...

Regular expressions - JavaScript
the roles of "class" and "argument" get reversed: in the case of .match(), the string class (or data type) owns the method and the regular expression is just an argument, while in the case of .exec(), it is the regular expression that owns the method, with the string being the argument. contrast this str.match(re) versus re.exec(str). the g flag is used with the .exec() method to get iterative progression. var xarray; while(xarray = re.exec(str)) console.log(xarray); // produces: // ["fee ", index: 0, input: "fee fi fo fum"] // ["fi ", index: 4, input: "fee fi fo fum"] // ["fo ", index: 7, input: "fee fi fo fum"] the m flag is used to specify that a multiline input string should be treated as multiple lines. if the m flag is used, ^ and $ match at the start or end of any line within the input...

Working with objects - JavaScript
for example, in the above code, when the key obj is added to the myobj, javascript will call the obj.tostring() method, and use this result string as the new key. you can also access properties by using a string value that is stored in a variable: var propertyname = 'make'; mycar[propertyname] = 'ford'; propertyname = 'model'; mycar[propertyname] = 'mus...

Array - JavaScript
console.log(vegetables) // ["cabbage", "carrot"] (the original array is changed) console.log(removeditems) // ["turnip", "radish"] copy an array let shallowcopy = fruits.slice() // this is how to make a copy // ["strawberry", "mango"] accessing array elements javascript arrays are zero-indexed. the first element of an array is at index 0, and the last element i...

Function.arguments - JavaScript
arguments object available within functions is simply to refer to the variable arguments. in the case of recursion, i.e. if function f appears several times on the call stack, the value of f.arguments represents the arguments corresponding to the most recent invocation of the function. the value of the arguments property is normally null if there is no outstanding invocation of the function in progress (that is, the function has been called but has not yet returned. examples using the arguments object function f(n) { g(n - 1) } function g(n) { console.log('before: ' + g.arguments[0]) if (n > 0) { f(n) } console.log('after: ' + g.arguments[0]) } f(2) console.log('returned: ' + g.arguments) // output // before: 1 // before: 0 // after: 0 // after: 1 // returned: null specification...

background_color - Web app manifests
ld match the background-color css property in the site’s stylesheet for a smooth transition between launching the web application and loading the site's content. note: the background_color member is only meant to improve the user experience while the main stylesheet is loading from the network or the storage media; it is not used by the user agent as the background-color css property when the progressive web app stylesheet is available. examples "background_color": "red" specification specification status comment feedback web app manifestthe definition of 'background_color' in that specification. working draft initial definition. web app manifest working group drafts ...

screenshots - Web app manifests
type object mandatory no the screenshots member defines an array of screenshots intended to showcase the application. these images are intended to be used by progressive web app stores. examples "screenshots" : [ { "src": "screenshot1.webp", "sizes": "1280x720", "type": "image/webp" }, { "src": "screenshot2.webp", "sizes": "1280x720", "type": "image/webp" } ] specification specification status comment feedback web app manifestthe definition of 'screenshots' in that specification. working draft initial definition. web app manifest working group drafts ...

Web app manifests
unlike regular web apps with simple homescreen links or bookmarks, pwas can be downloaded in advance and can work offline, as well as use regular web apis. the web app manifest provides information about a web application in a json text file, necessary for the web app to be downloaded and be presented to the user similarly to a native app (e.g., be installed on the homescreen of a device, providing users with quicker access and a richer experience). ...

Authoring MathML - MathML
ow and may conflict with the html parsing (e.g. "<" for tags or "$" for money amounts) you may need to synchronize the javascript converter with other javascript programs on your page. texzilla has an <x-tex> custom element, that can be used to write things like <x-tex>\frac{x^2}{a^2} + \frac{y^2}{b^2} = 1</x-tex> and get it automatically converted into mathml. this is still a work-in-progress, but could be improved in the future thanks to web components and shadow dom. alternatively, you can use the more traditional javascript parsing of expressions at load time as all the other tools in this section do. one simple client-side conversion tools is asciimathml. just download the asciimathml.js script and copy it to your web site. then on your web pages, add a <script> tag to load ascii...

Image file type and format guide - Web media technologies
mozilla which extends the png standard to add support for animated images. conceptually similar to the animated gif format which has been in use for decades, apng is more capable in that it supports a variety of color depths, whereas animated gif supports only 8-bit indexed color. apng is ideal for basic animations that do not need to synchronize to other activities or to a sound track, such as progress indicators, activity throbbers, and other animated sequences. for example, apng is one of the formats supported when creating animated stickers for apple's imessage application (and the messages application on ios). they're also commonly used for the animated portions of web browsers' user interfaces. mime type image/apng file extension(s) .apng specification ...

Web video codec guide - Web media technologies
profile color depths chroma subsampling constrained baseline (cbp) 8 4:2:0 baseline (bp) 8 4:2:0 extended (xp) 8 4:2:0 main (mp) 8 4:2:0 high (hip) 8 4:0:0 (greyscale) and 4:2:0 progressive high (prohip) 8 4:0:0 (greyscale) and 4:2:0 high 10 (hi10p) 8 to 10 4:0:0 (greyscale) and 4:2:0 high 4:2:2 (hi422p) 8 to 10 4:0:0 (greyscale), 4:2:0, and 4:2:2 high 4:4:4 predictive 8 to 14 4:0:0 (greyscale), 4:2:0, 4:2:2, and 4:4:4 hdr support ...

The "codecs" parameter in common media types - Web media technologies
t in mpeg-4 format. not used for high-definition television broadcasts. this profile's importance has faded since the introduction of the high profile—which was added for hdtv use—in 2004. 4d 00 high profile (hip) currently, hip is the primary profile used for broadcast and disc-based hd video; it's used both for hd tv broadcasts and for blu-ray video. 64 00 progressive high profile (phip) essentially high profile without support for field coding. 64 08 constrained high profile phip, but without support for bi-predictive slices ("b-slices"). 64 0c high 10 profile (hi10p) high profile, but with support for up to 10 bits per color component. 6e 00 high 4:2:2 profile (hi422p) expands upon hi10p by addi...

Recommended Web Performance Timings: How long is too long? - Web Performance
t it's something few sites achieve. expectations differ. a 'hello world' on the corporate network would be expected to load in milliseconds, but a user downloading a cat video on a five-year-old device over an edge network in northern siberia would likely find a 20-second download speedy. if you wait three or four seconds without communicating to the user that a load is happening and showing some progress, the typical site will lose potential visitors, and those visitors will take a long time to come back if they ever do. in optimizing for performance, do set an ambitious first load goal, such as 5 seconds over the mobile 3g network and 1.5 seconds on an office t1 line, with even more ambitious page load goals for subsequent page loads, leveraging service workers and caching. there are different ...

SVG Event Attributes - SVG: Scalable Vector Graphics
e, ondblclick, ondrag, ondragend, ondragenter, ondragexit, ondragleave, ondragover, ondragstart, ondrop, ondurationchange, onemptied, onended, onerror, onfocus, oninput, oninvalid, onkeydown, onkeypress, onkeyup, onload, onloadeddata, onloadedmetadata, onloadstart, onmousedown, onmouseenter, onmouseleave, onmousemove, onmouseout, onmouseover, onmouseup, onmousewheel, onpause, onplay, onplaying, onprogress, onratechange, onreset, onresize, onscroll, onseeked, onseeking, onselect, onshow, onstalled, onsubmit, onsuspend, ontimeupdate, ontoggle, onvolumechange, onwaiting graphical event attributes onactivate, onfocusin, onfocusout ...

glyph-orientation-vertical - SVG: Scalable Vector Graphics
otherwise, if the angle is not a multiple of 180 degrees, then the current text position is incremented according to the horizontal metrics of the glyph. this attribute is applied only to text written in a vertical writing-mode. ...

keyPoints - SVG: Scalable Vector Graphics
ber>]* ;? default value none animatable no <number> [; <number>] ;? this value defines a semicolon-separated list of floating point values between 0 and 1 and indicates how far along the motion path the object shall move at the moment in time specified by corresponding keytimes value. the distance is calculated along the path specified by the path attribute. each progress value in the list corresponds to a value in the keytimes attribute list. if a list of key points is specified, there must be exactly as many values in the keypoints list as in the keytimes list. if there's a semicolon at the end of the value, optionally followed by white space, both the semicolon and the trailing white space are ignored. if there are any errors in the value specification (i.

SVG Attribute reference - SVG: Scalable Vector Graphics
e, ondblclick, ondrag, ondragend, ondragenter, ondragexit, ondragleave, ondragover, ondragstart, ondrop, ondurationchange, onemptied, onended, onerror, onfocus, oninput, oninvalid, onkeydown, onkeypress, onkeyup, onload, onloadeddata, onloadedmetadata, onloadstart, onmousedown, onmouseenter, onmouseleave, onmousemove, onmouseout, onmouseover, onmouseup, onmousewheel, onpause, onplay, onplaying, onprogress, onratechange, onreset, onresize, onscroll, onseeked, onseeking, onselect, onshow, onstalled, onsubmit, onsuspend, ontimeupdate, ontoggle, onvolumechange, onwaiting graphical event attributes onactivate, onfocusin, onfocusout ...

Securing your site - Web security
user information security how to turn off form autocompletion form fields support autocompletion in gecko; that is, their values can be remembered and automatically brought back the next time the user visits your site. ...

Web technology for developers
cal equations and syntax. temporary the stuff below here is temporary to help keep track of things while organization work is ongoing. pay it no mind. ...

Understanding WebAssembly text format - WebAssembly
ti-value instructions available are calls to functions that themselves return multiple values. for example: (module (func $get_two_numbers (result i32 i32) i32.const 1 i32.const 2 ) (func (export "add_to_numbers") (result i32) call $get_two_numbers i32.add ) ) but this will pave the way for more useful instruction types, and other things besides. for a useful write up of progress so far and how this works, see multi-value all the wasm! by nick fitzgerald. webassembly threads webassembly threads (supported in firefox 79 onwards) allow webassembly memory objects to be shared across multiple webassembly instances running in separate web workers, in the same fashion as sharedarraybuffers in javascript. this allows very fast communication between workers, and significant per...