Search completed in 1.09 seconds.
Introduction to progressive web apps - Progressive web apps (PWAs)
overview:
progressive web apps next this article provides an introduction to
progressive web apps (pwas), discussing what they are and the advantages they offer over regular web apps.
... what is a
progressive web app?
... the term "
progressive web app" isn't a formal or official name.
...And 11 more matches
<progress>: The Progress Indicator element - HTML: Hypertext Markup Language
the html <
progress> element displays an indicator showing the completion
progress of a task, typically displayed as a
progress bar.
... permitted content phrasing content, but there must be no <
progress> element among its descendants.
... implicit aria role
progressbar permitted aria roles no role permitted dom interface html
progresselement attributes this element includes the global attributes.
...And 7 more matches
Progressive loading - Progressive web apps (PWAs)
previous overview:
progressive web apps in previous articles we covered apis that help us make our js13kpwa example a
progressive web app: service workers, web manifests, notifications and push.
... in this article we will go even further and improve the performance of the app by
progressively loading its resources.
... this could be achieved by
progressive loading — also known as lazy loading.
...And 6 more matches
Progressive web app structure - Progressive web apps (PWAs)
previous overview:
progressive web apps next now that we know the theory behind pwas, let's look at the recommended structure of an actual app.
...in addition to the basic shell, you can add other features such as add to home screen or push notifications, safe in the knowledge that the app will still work ok if they are not supported by the user's browser — this is the beauty of
progressive enhancement.
... being linkable,
progressive and responsive by design it's important to remember the pwa advantages and keep them in mind when designing the application.
...And 5 more matches
ProgressEvent.initProgressEvent() - Web APIs
the
progressevent.init
progressevent() method initializes an animation event created using the deprecated document.createevent("
progressevent") method.
...
progressevent created that way are untrusted.
...do not use it anymore, use the standard constructor,
progressevent(), to create a synthetic
progressevent syntax
progress.init
progressevent(typearg, canbubblearg, cancelablearg, lengthcomputable, loaded, total); parameters typearg is a domstring identifying the specific type of animation event that occurred.
...And 4 more matches
Structural overview of progressive web apps - Progressive web apps (PWAs)
while
progressive web apps (pwas) can do anything any web content can do, they need to have a particular structure and include specific components in order to be recognized as a web app that can be used both on the web and installed and run as a local application.
...in addition to the basic shell, you can add other features such as add to home screen or push notifications, safe in the knowledge that the app will still work ok if they are not supported by the user's browser — this is the beauty of
progressive enhancement.
... being linkable,
progressive, and responsive by design it's important to remember the pwa advantages and keep them in mind when designing the application.
...And 3 more matches
nsIWebProgressListener
uriloader/base/nsiweb
progresslistener.idlscriptable this interface is implemented by clients wishing to listen in on the
progress associated with the loading of asynchronous requests in the context of a nsiweb
progress instance as well as any child nsiweb
progress instances.
... inherits from: nsisupports last changed in gecko 15 (firefox 15 / thunderbird 15 / seamonkey 2.12) nsiweb
progress describes the parent-child relationship of nsiweb
progress instances.
... method overview void onlocationchange(in nsiweb
progress aweb
progress, in nsirequest arequest, in nsiuri alocation, [optional] in unsigned long aflags); void on
progresschange(in nsiweb
progress aweb
progress, in nsirequest arequest, in long acurself
progress, in long amaxself
progress, in long acurtotal
progress, in long amaxtotal
progress); void onsecuritychange(in nsiweb
progress aweb
progress, in nsirequest arequest, in unsigned long astate); void onstatechange(in nsiweb
progress aweb
progress, in nsirequest arequest, in unsigned long astateflags, in nsresult astatus); void onstatuschange(in nsiweb
progress aweb
progress, in nsirequest arequest, in nsresult astatus, in wstring amessage); constants state transition flags these flags indicate the variou...
...And 33 more matches
nsIWebProgress
the nsiweb
progress interface is used to add or remove nsiweb
progresslistener instances to observe the loading of asynchronous requests (usually in the context of a dom window).
... nsiweb
progress instances may be arranged in a parent-child configuration, corresponding to the parent-child configuration of their respective dom windows.
... however, in some cases a nsiweb
progress instance may not have an associated dom window.
...And 24 more matches
nsIDownloadProgressListener
/toolkit/components/downloads/nsidownload
progresslistener.idlscriptable this interface gives applications and extensions a way to monitor the status of downloads being processed by the download manager.
... this interface works very similarly to the nsiweb
progress interface.
... method overview void ondownloadstatechange(in short astate, in nsidownload adownload); void onlocationchange(in nsiweb
progress aweb
progress, in nsirequest arequest, in nsiuri alocation, in nsidownload adownload); obsolete since gecko 1.9.1 void on
progresschange(in nsiweb
progress aweb
progress, in nsirequest arequest, in long long acurself
progress, in long long amaxself
progress, in long long acurtotal
progress, in long long amaxtotal
progress, in nsidownload adownload); void onsecuritychange(in nsiweb
progress aweb
progress, in nsirequest arequest, in unsigned long astate, in nsidownload adownload); ...
...And 18 more matches
Progress Meters - Archive of obsolete content
« previousnext » in this section, we'll look at creating
progress meters.
... adding a
progress meter a
progress meter is a bar that indicates how much of a task has been completed.
...xul has a
progressmeter element which can be used to create these.
...And 16 more matches
Progressive web apps (PWAs)
progressive web apps are web apps that use emerging web browser apis and features along with traditional
progressive enhancement strategy to bring a native app-like user experience to cross-platform web applications.
...
progressive web apps are a useful design pattern, though they aren't a formalized standard.
... manifest file a json file that controls how your app appears to the user and ensures that
progressive web apps are discoverable.
...And 15 more matches
nsIWebProgressListener2
an extended version of nsiweb
progresslistener.
... uriloader/base/nsiweb
progresslistener2.idlscriptable please add a summary to this article.
... last changed in gecko 1.9 (firefox 3) inherits from: nsiweb
progresslistener method overview void on
progresschange64(in nsiweb
progress aweb
progress, in nsirequest arequest, in long long acurself
progress, in long long amaxself
progress, in long long acurtotal
progress, in long long amaxtotal
progress); boolean onrefreshattempted(in nsiweb
progress aweb
progress, in nsiuri arefreshuri, in long amillis, in boolean asameuri); methods on
progresschange64() notification that the
progress has changed for one of the requests associated with aweb
progress.
...And 14 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.
...And 10 more matches
Progress Listeners - Archive of obsolete content
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 nsiweb
progresslistener interface.
... in the examples below the
progress listener is attached to the tabbrowser, which means you don't get any notifications for inactive tabs.
...And 8 more matches
nsITaskbarProgress
widget/public/nsitaskbar
progress.idlscriptable starting in windows 7, applications can display a
progress notification in the taskbar.
... 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 set
progressstate(in nstaskbar
progressstate 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.
... state_indeterminate 1 display a cycling, indeterminate
progress bar.
...And 8 more matches
ProgressEvent - Web APIs
the
progressevent interface represents events measuring
progress of an underlying process, like an http request (for an xmlhttprequest, or the loading of the underlying resource of an <img>, <audio>, <video>, <style> or <link>).
...75" height="50" fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="38.5" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">event</text></a><polyline points="76,25 86,20 86,30 76,25" stroke="#d4dde4" fill="none"/><line x1="86" y1="25" x2="116" y2="25" stroke="#d4dde4"/><a xlink:href="/docs/web/api/
progressevent" target="_top"><rect x="116" y="1" width="130" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="181" y="30" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">
progressevent</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constructor
progressevent...
...() creates a
progressevent event with the given parameters.
...And 8 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.
...in addition, an indeterminate
progressmeter may be created by setting the mode attribute to undetermined.
... attributes max, mode, value properties accessibletype, max, mode, value examples <
progressmeter mode="determined" value="82"/> <
progressmeter mode="undetermined"/> <!-- switching modes while the mouse is over a button --> <
progressmeter mode="determined" id="my
progress"/> <button label="example" onmouseover="setloading(true)" onmouseout="setloading(false)"/> function setloading(state){ document.getelementbyid('my
progress').mode = (state) ?
...And 6 more matches
nsIDOMProgressEvent
dom/interfaces/events/nsidom
progressevent.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 nsidom
progressevent 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.
...And 6 more matches
HTMLProgressElement - Web APIs
the html
progresselement 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.
...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/html
progresselement" 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">html
progresselement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherit...
... html
progresselement.max is a double value reflecting the content attribute of the same name, limited to numbers greater than zero.
...And 6 more matches
Customizing the download progress bar - Archive of obsolete content
this example illustrates how to customize the
progress bar displayed for a given download in the downloads window.
... the myextension.css file will look something like this: richlistitem
progressmeter { %ifdef xp_win min-height: 17px !important; %else %ifdef xp_macosx -moz-appearance: none !important; background-image: url(chrome://myextension/skin/
progress_bg_osx.png) !important; %endif %endif } richlistitem .
progress-bar { %ifdef xp_win -moz-appearance: none !important; background-image: url(chrome://myextension/skin/
progress_fd_win.png) !important; %else %ifd...
...ef xp_macosx background-image: url(chrome://myextension/skin/
progress_fd_osx.gif) !important; %endif %endif } note: this file only supports windows and mac, but it would be straightforward to add support for linux.
...And 5 more matches
nsIProgressEventSink
netwerk/base/public/nsi
progresseventsink.idlscriptable this interface is used to asynchronously convey channel status and
progress information that is generally not critical to the processing of the channel.
... inherits from: nsisupports last changed in gecko 1.7 this interface is used to asynchronously convey channel status and
progress information that is generally not critical to the processing of the channel.
...the channel will begin passing notifications to the
progress event sink after its asyncopen method has been called.
...And 4 more matches
ProgressEvent() - Web APIs
the
progressevent() constructor returns a newly created
progressevent, representing the current completion of a long process.
... syntax
progressevent = new
progressevent(type, {lengthcomputable: abooleanvalue, loaded: anumber, total: anumber}); arguments the
progressevent() constructor also inherits arguments from event().
... type is a domstring representing the name of the type of the
progressevent.
...And 4 more matches
::-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.
...And 3 more matches
mozIStorageProgressHandler
the mozistorage
progresshandler interface lets storage consumers receive callbacks during the execution of sqlite requests.
... storage/public/mozistorage
progresshandler.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 on
progress(in mozistorageconnection aconnection); methods on
progress() the on
progress() method is called periodically while an sqlite operation is ongoing.
...And 2 more matches
HTMLMediaElement: progress event - Web APIs
the
progress event is fired periodically as the browser loads a resource.
... bubbles no cancelable no interface event event handler property on
progress examples live example html <div class="example"> <button type="button">load video</button> <video controls width="250"></video> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents"></textarea> </div> </div> css .event-log-contents { width: 18rem; height: 5rem; border: 1px solid black; margin: .2rem; padding: .2rem; } .example { display: grid; grid-template-areas: "button log" "video log"; } button { grid-area: button; width: 10rem; margin: .5rem 0; } video { grid-area: video; } .event-log { grid-area: log; } .event-log>label { ...
... 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.mdn.mozil...
...And 2 more matches
::-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.
...And 2 more matches
::-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.
...And 2 more matches
progressmeter.mode - Archive of obsolete content
« xul reference home mode type: one of the values below a determined
progressmeter is used in cases where you know how long an operation will take.
... an undetermined
progressmeter 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.
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.
...
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.
... learn more general knowledge
progressive enhancement on wikipedia ...
progress - Archive of obsolete content
the
progress event is fired when the user agent is downloading resources listed by the manifest.
... general info specification offline interface
progressevent bubbles no cancelable no target applicationcache default action none properties property type description target eventtarget (dom element) the event target (the topmost target in the dom tree).
... related events checking noupdate downloading
progress cached updateready obsolete error ...
-ms-block-progression - Archive of obsolete content
the -ms-block-
progression css property is a microsoft extension that specifies the block
progression and layout orientation.
... 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.
FileReader: progress event - Web APIs
the
progress event is fired periodically as the filereader reads data.
... bubbles no cancelable no interface
progressevent event handler property filereader.on
progress examples live example html <div class="example"> <div class="file-select"> <label for="avatar">choose a profile picture:</label> <input type="file" id="avatar" name="avatar" accept="image/png, image/jpeg"> </div> <img src="" class="preview" height="200" alt="image preview..."> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents"></textarea> </div> </div> css img.preview { margin: 1rem 0; } .event-log-contents { width: 18rem; height: 5rem; border: 1px solid black; margin: .2rem; padding: .2rem; } .exam...
... 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 ...
FileRequest.onprogress - Web APIs
summary this property specifies a callback function to be run repeatedly while the operation represented by a filerequest object is in
progress.
... syntax instanceoffilerequest.on
progress = function; where instanceoffilerequest is a filerequest object and function is the javascript function to execute.
... example // assuming 'request' which is a filerequest object request.on
progress = function (status) { var
progress = document.queryselector('
progress');
progress.value = status.loaded;
progress.max = status.total; } specification not part of any current specification.
HTMLProgressElement.labels - Web APIs
the html
progresselement.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.
... 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.
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.
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.
... syntax value =
progressevent.loaded specifications specification status comment xmlhttprequestthe definition of '
progressevent.loaded' in that specification.
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.
... syntax xdr.on
progress = 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.on
progress = function(){ //handle partial response with xdr.responsetext } xdr.onload = function(){ //handle response with xdr.responsetext } xdr.send("param1=value1¶m2=value2"); specification not part of any specification.
XMLHttpRequest: progress event - Web APIs
the
progress event is fired periodically when a request receives more data.
... bubbles no cancelable no interface
progressevent event handler property on
progress examples live example html <div class="controls"> <input class="xhr success" type="button" name="xhr" value="click to start xhr (success)" /> <input class="xhr error" type="button" name="xhr" value="click to start xhr (error)" /> <input class="xhr abort" type="button" name="xhr" value="click to start xhr (abort)" /> </div> <textarea readonly class="event-log"></textarea> css .event-log { width: 25rem; height: 4rem; border: 1px solid black; margin: .5rem; padding: .2rem; } input { width: 11rem; margin: .5rem; } js const xhrbuttonsuccess = document.queryselector('.xhr.success'); const xhrbuttonerror = document.
....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...
XMLHttpRequestEventTarget.onprogress - Web APIs
the xmlhttprequesteventtarget.on
progress is the function called periodically with information when an xmlhttprequest before success completely.
... syntax xmlhttprequest.on
progress = callback; values callback is the function to be called periodically before the request is completed.
... xmlhttprequest.on
progress = function (event) { event.loaded; event.total; }; example var xmlhttp = new xmlhttprequest(), method = 'get', url = 'https://developer.mozilla.org/'; xmlhttp.open(method, url, true); xmlhttp.on
progress = function () { //do something }; xmlhttp.send(); specifications specification status comment xmlhttprequest living standard whatwg living standard ...
::-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".
... 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.
How to make PWAs installable - Progressive web apps (PWAs)
previous overview:
progressive next in the last article, we read about how the example application, js13kpwa, works offline thanks to its service worker, but we can go even further and allow users to install the web app on mobile and desktop browers that support doing so.
... 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" }, // ...
... previous overview:
progressive next ...
Making PWAs work offline with Service workers - Progressive web apps (PWAs)
previous overview:
progressive web apps next now that we’ve seen what the structure of js13kpwa looks like and have seen the basic shell up and running, let's look at how the offline capabilities using service worker are implemented.
... "
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.
... previous overview:
progressive web apps next ...
addTabsProgressListener - Archive of obsolete content
« xul reference home addtabs
progresslistener( 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 nsiweb
progresslistener interface with an additional "browser" argument as the first argument of every method, which is the browser (not <tabbrowser> = gbrowser) where the event occurred.
removeTabsProgressListener - Archive of obsolete content
« xul reference home removetabs
progresslistener( 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 nsiweb
progresslistener interface.
Mobile first - Progressive web apps (PWAs)
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.
Index - Web APIs
134 audiocontext.resume() 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.
... 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.
...And 35 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 addtabs
progresslistener() method: gbrowser.addtabs
progresslistener(my
progresslistener); my
progresslistener 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 removetabs
progresslistener(): gbrowser.removetabs
progresslistener(my
progresslistener); 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.
...And 26 more matches
Index - Archive of obsolete content
178 customizing the download
progress bar no summary!
... 204
progress listeners add-ons, extensions no summary!
... 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.
...And 22 more matches
Index
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.
... 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.
... 212 mozistorage
progresshandler interfaces, storage, xpcom, xpcom api reference the mozistorage
progresshandler interface lets storage consumers receive callbacks during the execution of sqlite requests.
...And 15 more matches
Web applications and ARIA FAQ - Accessibility
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.
...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.
...in this example, the role="
progressbar" attribute informs the browser that this element is actually a javascript-powered
progress bar widget.
...And 14 more matches
Event reference
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.
...And 14 more matches
Creating a cross-browser video player - Developer guides
the control set most browser's default video controls have the following functionality: play/pause mute volume control
progress bar skip ahead go fullscreen the custom control set will also support this functionality, with the addition of a stop button.
...for the
progress bar, the
progress element is taken advantage of, with a fallback provided for browsers that don't support it (e.g.
... <ul id="video-controls" class="controls"> <li><button id="playpause" type="button">play/pause</button></li> <li><button id="stop" type="button">stop</button></li> <li class="
progress"> <
progress id="
progress" value="0" min="0"> <span id="
progress-bar"></span> </
progress> </li> <li><button id="mute" type="button">mute/unmute</button></li> <li><button id="volinc" type="button">vol+</button></li> <li><button id="voldec" type="button">vol-</button></li> <li><button id="fs" type="button">fullscreen</button></li> </ul> each button is given an id so it can be easily accessed with j...
...And 14 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 nsidownload
progresslistener 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...
... gecko 1.9.1 void open
progressdialogfor(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 nsidownload
progresslistener alistener); void resumedownload(in unsigned long aid); void retrydownload(in unsigned long aid); void savestate(); obsolete since gecko 1.8 void startbatchupdate(); obsolete since gecko 1.9.1 attributes attribute type description activedownloadcount long the number of files currently being downloaded.
... listener nsidownload
progresslistener the download manager's
progress listener.
...And 13 more matches
Background Tasks API - Web APIs
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> <div class="container"> <div class="label">decoding quantum filament tachyon emissions...</div> <
progress id="
progress" value="0"></
progress> <div class="button" id="startbutton"> start </div> <div class="label counter"> task <span id="currenttasknumber">0</span> of <span id="totaltaskcount">0</span> </div> </div> <div class="logbox"> <div class="logheader"> log </div> <div id="log"> </div> </div> the
progress box uses a <
progress> element to show the
progress, along with a label with sections that are changed to present numeric information about the
progress.
... black; display: block; overflow: auto; } .label { display: inline-block; } .counter { text-align: right; padding-top: 4px; float: right; } .button { padding-top: 2px; padding-bottom: 4px; width: 100px; display: inline-block; float: left; border: 1px solid black; cursor: pointer; text-align: center; margin-top: 0; color: white; background-color: darkgreen; } #
progress { width: 100%; padding-top: 6px; } javascript content now that the document structure is defined, construct the javascript code that will do the work.
...And 12 more matches
Using XMLHttpRequest - Web APIs
*/ } 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.
...And 12 more matches
nsIPrintingPrompt
this service enables embedders to implement their own print and
progress dialogs.
... defaults for platform service: showprintdialog - displays a native dialog showpagesetup() - displays a xul dialog show
progress() - displays a xul dialog summary for windows embedders: stated once again: there is no "fallback" native platform support in gfx for the displaying of the native print dialog.
... the current default implementation for windows display a native print dialog but a xul-based
progress dialog.
...And 11 more matches
Video player styling basics - Developer guides
the custom video controls and <
progress> element are now contained within <div> elements, rather than residing inside unordered list items.
... the markup for the custom controls now looks as follows: <div id="video-controls" class="controls" data-state="hidden"> <button id="playpause" type="button" data-state="play">play/pause</button> <button id="stop" type="button" data-state="stop">stop</button> <div class="
progress"> <
progress id="
progress" value="0" min="0"> <span id="
progress-bar"></span> </
progress> </div> <button id="mute" type="button" data-state="mute">mute/unmute</button> <button id="volinc" type="button" data-state="volup">vol+</button> <button id="voldec" type="button" data-state="voldown">vol-</button> <button id="fs" type="button" data-state="go-fullscreen">fullscreen</button> </div> related css alteration the previous article simply set the display property of the video co...
... the <div> container for the <
progress> element also requires some specific settings; it is set to be much wider than the other child elements and its cursor value is set to be pointer: .controls .
progress { cursor:pointer; width:75.390625%; } buttons the first major styling task to tackle is to make the video control's buttons actually look like and act like real buttons.
...And 11 more matches
Listening to events in Firefox extensions - Archive of obsolete content
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 nsiweb
progressimplementation here } b.add
progresslistener(
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.
...And 10 more matches
Intercepting Page Loads - Archive of obsolete content
web
progresslisteners 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.
...here's a code sample that keeps track of your
progress listeners for all tabs: init : function() { gbrowser.browsers.foreach(function (browser) { this._toggle
progresslistener(browser.web
progress, true); }, this); gbrowser.tabcontainer.addeventlistener("tabopen", this, false); gbrowser.tabcontainer.addeventlistener("tabclose", this, false); }, uninit : function() { gbrowser.browsers.foreach(function (browser) { this ._toggle
progresslistener(browser.web
progress, false); }, this); gbrowser.tabcontainer.removeeventlistener("tabopen", this, false); gbrowser.tabcontainer.removeeventlistener("tabclose", this, false); }, handleevent : function(aevent...
...And 10 more matches
Index - Archive of obsolete content
300
progressmeter.max no summary!
... 301
progressmeter.mode xul attributes, xul reference no summary!
... 302
progressmeter.value xul attributes, xul reference no summary!
...And 10 more matches
Mail composition back end
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.
...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.
... ns_imethod onstartsending(const char *amsgid, - the message id for the message being sent pruint32 amsgsize) = 0; - the total message size for the message being sent on
progress the on
progress interface is called with
progress notification on the send operation.
...And 9 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, web
progress methods add
progresslistener, addtab, addtabs
progresslistener,appendgroup, getbrowseratindex, getbrowserindexfordocument, getbrowserfordocument, getbrowserfortab, geticon, getnotificationbox, gettabforbrowser, gettabmodalpromptbox, goback, gobackgroup, goforward, goforwardgroup, gohome, gotoindex, loadgroup, loadonetab, loadtabs, loaduri, loaduriwithflags, movetabto, pintab, reload, reloadalltab...
...s, reloadtab, reloadwithflags, removealltabsbut, removecurrenttab, remove
progresslistener, removetab, removetabs
progresslistener,replacegroup, selecttabatindex, seticon, showonlythesetabs, stop, unpintab attributes autocompleteenabled type: boolean set to true to enable autocomplete of fields.
... web
progress type: nsiweb
progress this read-only property contains an nsiweb
progress object which is used to monitor the
progress of a document loading.
...And 7 more matches
Download
this property may be populated or changed while the download is in
progress, using the mime type provided by the server.
...this value starts at zero, and may be updated regardless of the value of has
progress.
... this property is relevant while the download is in
progress, and also if it failed or has been canceled.
...And 7 more matches
Downloading Files - Archive of obsolete content
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.
... downloading binary files with a
progress listener to download a binary file with custom
progress listener: components.utils.import("resource://gre/modules/privatebrowsingutils.jsm"); const webbrowserpersist = components.constructor("@mozilla.org/embedding/browser/nswebbrowserpersist;1", "nsiwebbrowserpersist"); var persist = webbrowserpersist(); var targetfile = services.dirsvc.get("desk", ci.nsifile); targetfile.append("file.bin"); var obj_uri = services.io.newuri(aurltodownload, null, null); // obtain the privacy context of the browser window that the url // we are downloading comes from.
...var privacy = privatebrowsingutils.privacycontextfromwindow(aurlsourcewindow); var
progresselement = document.getelementbyid("
progress_element"); persist.
progresslistener = { on
progresschange: function(aweb
progress, arequest, acurself
progress, amaxself
progress, acurtotal
progress, amaxtotal
progress) { var percentcomplete = math.round((acurtotal
progress / amaxtotal
progress) * 100);
progresselement.textcontent = percentcomplete +"%"; }, onstatechange: function(aweb
progress, arequest, astateflags, astatus) { // do something } } persist.saveuri(obj_uri, null, null, null, "", targetfile, privacy); downloading files that require credentials before calling nsiwebbrowserpersist.saveuri(), you need ...
...And 6 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); mozistorage
progresshandler remove
progresshandler(); void rollbacktransaction(); void setgrowthincrement(in print32 aincrement, in autf8string adatabasename); mozistorage
progresshandler set
progresshandler(in print32 agranularity, in mozistorage
progresshandler ahandler); boolean tableexists(in autf8string atablename); attributes attribute type description ...
... transactionin
progress boolean returns true if there is a transaction in
progress on the database.
... acallback optional a mozistoragestatementcallback object to receive
progress, error, and completion notifications.
...And 6 more matches
nsIMsgMessageService
amsgwindow nsimsgwindow for
progress and status feedback return values aurl the new nsiuri of the message.
... aurllistener an nsiurllistener amsgwindow nsimsgwindow for
progress and status feedback return values aurl the new nsiuri of the message.
... amsgwindow nsimsgwindow for
progress and status feedback aurllistener an nsiurllistener acharsetoverride (optional) character set over ride to force the message to use.
...And 6 more matches
nsIZipWriter
attempting to perform a synchronous operation on the interface while the background queue is in
progress will throw an ns_error_in_
progress exception.
... inqueue boolean true if operations are being performed in the background queue, or false if background operations are not in
progress.
... ns_error_in_
progress the zip writer is already performing another operation.
...And 6 more matches
Cross-browser audio basics - Developer guides
ementbyid('play'); var pause = document.getelementbyid('pause'); // associate functions with the 'onclick' events play.onclick = playaudio; pause.onclick = pauseaudio; function playaudio() { myaudio.play(); } function pauseaudio() { myaudio.pause(); } } media loading events above we have shown how you can create a very simple audio player, but what if we want to show
progress, buffering and only activate the buttons when the media is 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.
... 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.
...And 6 more matches
Advanced form styling - Learn web development
<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.
...prefixed usually means "work in
progress", so in the future browser vendors may come to a consensus to drop the prefix.
...in short, these are drop-down boxes, complex control types like color and datetime-local, and feedback—oriented controls like <
progress> and <meter>.
...And 5 more matches
Other form controls - Learn web development
previous overview: forms next we now look at the functionality of non-<input> form elements in detail, from other control types such as drop-down lists and multi-line text fields, to other useful form features such as the <output> element (which we saw in action in the previous article), and
progress bars.
... in this case, different browsers behave differently from case to case, so consider such uses as
progressive enhancement, and ensure they degrade gracefully.
... meters and
progress bars meters and
progress bars are visual representations of numeric values.
...And 5 more matches
Working with windows in chrome code
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.
...todo: link to how to pass an xpcom object to a new window when it has a more useful example opener code: window.opendialog("chrome://test/content/
progress.xul", "my
progress", "chrome,centerscreen", {status: "reading remote data", max
progress: 50,
progress: 10} );
progress.xul: <?xml version="1.0"?> <?xml-stylesheet href="chrome://global/skin/" type="text/css"?> <window onload="onload();" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <script><![cdata[ var gstatus, g
progressmeter; var max
progress = 100; function onload() { gstatus = document.getelementbyid("status"); g
progressmeter = document.getelementbyid("
progressmeter"); if("arguments" in window && windo...
...And 5 more matches
Embedding Tips
implement the nsiweb
progresslistener interface and register it with the appropriate web browser object via the nsiwebbrowser::addwebbrowserlistener() method.
...register your own nsiweb
progresslistener object to listen for
progress and state notifications.
... your web
progress listener must also implement nsiauthprompt if you want to be able to upload to a password protected location (e.g.
...And 4 more matches
XPCOM Interface Reference
ynchistorymozicoloranalyzermozijssubscriptloadermozipersonaldictionarymoziplaceinfomoziplacesautocompletemoziregistrymozirepresentativecolorcallbackmozispellcheckingenginemozistorageaggregatefunctionmozistorageasyncstatementmozistoragebindingparamsmozistoragebindingparamsarraymozistoragecompletioncallbackmozistorageconnectionmozistorageerrormozistoragefunctionmozistoragependingstatementmozistorage
progresshandlermozistorageresultsetmozistoragerowmozistorageservicemozistoragestatementmozistoragestatementcallbackmozistoragestatementparamsmozistoragestatementrowmozistoragestatementwrappermozistoragevacuumparticipantmozistoragevaluearraymozitxttohtmlconvmozithirdpartyutilmozivisitinfomozivisitinfocallbackmozivisitstatuscallbacknsiabcardnsiaboutmodulensiabstractworkernsiaccelerometerupdatensiaccessnoden...
...onsnsidomglobalpropertyinitializernsidomhtmlaudioelementnsidomhtmlformelementnsidomhtmlmediaelementnsidomhtmlsourceelementnsidomhtmltimerangesnsidomjswindownsidommousescrolleventnsidommoznetworkstatsnsidommoznetworkstatsdatansidommoznetworkstatsmanagernsidommoztoucheventnsidomnshtmldocumentnsidomnavigatordesktopnotificationnsidomnodensidomofflineresourcelistnsidomorientationeventnsidomparsernsidom
progresseventnsidomserializernsidomsimplegestureeventnsidomstoragensidomstorage2nsidomstorageeventobsoletensidomstorageitemnsidomstoragelistnsidomstoragemanagernsidomstoragewindownsidomuserdatahandlernsidomwindownsidomwindow2nsidomwindowinternalnsidomwindowutilsnsidomxpathevaluatornsidomxpathexceptionnsidomxpathexpressionnsidomxpathresultnsidomxulcontrolelementnsidomxulelementnsidomxullabeledcontrolelemen...
...devicemotionlistenernsidialogcreatornsidialogparamblocknsidictionarynsidirindexnsidirindexlistenernsidirindexparsernsidirectoryenumeratornsidirectoryiteratornsidirectoryservicensidirectoryserviceprovidernsidirectoryserviceprovider2nsidiskcachestreaminternalnsidispatchsupportnsidocshellnsidocumentloadernsidownloadnsidownloadhistorynsidownloadmanagernsidownloadmanageruinsidownloadobservernsidownload
progresslistenernsidownloadernsidragdrophandlernsidragservicensidragsessionnsidroppedlinkhandlernsidroppedlinkitemnsidynamiccontainernsieditornsieditorboxobjectnsieditordocshellnsieditorimesupportnsieditorloggingnsieditormailsupportnsieditorobservernsieditorspellchecknsieffectivetldservicensienumeratornsienvironmentnsierrorservicensieventlistenerinfonsieventlistenerservicensieventsourcensieventtargetnsiex...
...And 4 more matches
ARIA - Accessibility
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.
...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.
...And 4 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...
... number-input div { color: black; -moz-appearance: number-input; -webkit-appearance: number-input; } <div>lorem</div> firefox
progress-bar-value div{ color: black; -webkit-appearance:
progress-bar-value; } <div>lorem</div> chrome safari
progressbar div { color: black; -moz-appearance:
progressbar; -webkit-appearance:
progressbar; } <div>lorem</div> firefox the element is styled like a
progress bar.
...And 4 more matches
Media buffering, seeking, and time ranges - Developer guides
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.
... var startx = myaudio.buffered.start(i) * inc; var endx = myaudio.buffered.end(i) * inc; var width = endx - startx; context.fillrect(startx, 0, width, mycanvas.height); context.rect(startx, 0, width, mycanvas.height); context.stroke(); } }); } this works better with longer pieces of audio or video, but press play and click about the player
progress bar and you should get something like this.
...the html for our player looks like this: <audio id="my-audio" preload controls> <source src="music.mp3" type="audio/mpeg"> </audio> <div class="buffered"> <span id="buffered-amount"></span> </div> <div class="
progress"> <span id="
progress-amount"></span> </div> we'll use the following css to style the buffering display: .buffered { height: 20px; position: relative; background: #555; width: 300px; } #buffered-amount { display: block; height: 100%; background-color: #777; width: 0; } .
progress { margin-top: -20px; height: 20px; position: relative; width: 300px; } #
progress-amount ...
...And 4 more matches
InstallListener
installlisteners are notified of an addoninstall's
progress.
... method overview void onnewinstall(in addoninstall install) void ondownloadstarted(in addoninstall install) void ondownload
progress(in addoninstall install) void ondownloadended(in addoninstall install) void ondownloadcancelled(in addoninstall install) void ondownloadfailed(in addoninstall install) void oninstallstarted(in addoninstall install) void oninstallended(in addoninstall install, in addon addon) void oninstallcancelled(in addoninstall install) void oninstallfailed(in addoninstall install) void onexternalinstall(in addon install, in addon existingaddon, in...
... boolean needsrestart) methods onnewinstall() called when a new instance of addoninstall is created, primarily so ui can display some kind of
progress for all installs.
...And 3 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 get
progressmode(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...
... constants constant value description
progress_normal 1 note: renamed from
progressnormal in gecko 1.8
progress_undetermined 2 note: renamed from
progressundetermined in gecko 1.8
progress_none 3 note: renamed from
progressnone in gecko 1.8 drop_before -1 drop_on 0 drop_after 1 indropbefore 0 obsolete since gecko 1.8 ...
... get
progressmode() the
progress mode for a given cell.
...And 3 more matches
nsIWinTaskbar
see bug 744992 for details and to track
progress on a fix.
...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); nsitaskbar
progress gettaskbar
progress(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 versi...
...ll = navigator2.queryinterface(components.interfaces.nsidocshell); // get the parent docshell; this is the top-level docshell var docshelltreeitem = docshell.queryinterface(components.interfaces.nsidocshelltreeitem); var parent = docshelltreeitem.parent; var ds = parent.queryinterface(components.interfaces.nsidocshell); // create the preview taskbar.createtaskbartabpreview(ds, {}); gettaskbar
progress() gets the taskbar
progress for a window.
...And 3 more matches
Using CSS gradients - CSS: Cascading Style Sheets
css gradients are represented by the <gradient> data type, a special type of <image> made of a
progressive transition between two or more colors.
... 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.
... 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.
...And 3 more matches
async function - JavaScript
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.
...in this way a promise chain is
progressively constructed with each reentrant step through the function.
...
progress moves through function foo in three stages.
...And 3 more matches
Styling a Tree - Archive of obsolete content
::-moz-tree-
progressmeter: content for
progressmeter cells.
... you can create a
progressmeter column by setting the type attribute on the column to
progressmeter.
...
progressnormal this property is set for
progress meter cells.
...And 2 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, web
progress methods add
progresslistener, goback, goforward, gohome, gotoindex, loaduri, loaduriwithflags, reload, reloadwithflags, remove
progresslistener, 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...
... web
progress type: nsiweb
progress this read-only property contains an nsiweb
progress object which is used to monitor the
progress of a document loading.
...aschildnodes(), insertbefore(), isdefaultnamespace(), isequalnode, issamenode, issupported(), lookupnamespaceuri, lookupprefix, normalize(), queryselector(), queryselectorall(), removeattribute(), removeattributenode(), removeattributens(), removechild(), removeeventlistener(), replacechild(), setattribute(), setattributenode(), setattributenodens(), setattributens(), setuserdata add
progresslistener( listener ) return type: no return value add a
progress listener to the browser which will monitor loaded documents.
...And 2 more matches
::-ms-fill - Archive of obsolete content
the ::-ms-fill css pseudo-element is a microsoft extension that represents a
progress bar displayed by <
progress>.
... all allowable properties except animation-name apply to a determinate
progress bar.
...(a
progress bar is determinate if it has a value attribute set; otherwise it is indeterminate.
...And 2 more matches
Index - MDN Web Docs Glossary: Definitions of Web-related terms
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.
... 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.
... 333
progressive enhancement accessibility, design, glossary
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.
...And 2 more matches
Multimedia: Images - Learn web development
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.
...supports transparency and also animation, but not
progressive display.
...And 2 more matches
Eclipse CDT Manual Setup
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.
... 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.
...And 2 more matches
Overview of Mozilla embedding APIs
contract-id: ns_pref_contractid implemented interfaces: nsiprefservice nsiprefbranch related interfaces: nsipreflistener profile manager service contract-id: implemented interfaces: document loader service (web
progress) eventually, this service will be replaced by theweb
progress service...
... contract-id: ns_document_loader_service_contractid implemented interfaces: nsiweb
progress nsidocumentloader related interfaces: nsiweb
progresslistener public components nswebbrowser the nswebbrowser is the main embedding component which gecko exposes.
...contract-id: ns_webbrowser_contractid implemented interfaces: nsiwebbrowser nsiwebnavigation nsiwebbrowsersetup nsiwebbrowserpersist nsiwebbrowserfind nsiwebbrowserprint nsiwebbrowserfocus nsibasewindow requestor interfaces: nsidomwindow nsidomdocument nsiweb
progress nsiclipboardcommands nsiprompt related interfaces: nsiprompt nsiwebbrowserchrome nsiwebbrowsersitewindow nsiweb
progresslistener nsicontextmenulistener nsiprintoptions overview: most of gecko's functionality is exposed through the nswebbrowser component.
...And 2 more matches
nsITransportEventSink
inherits from: nsisupports last changed in gecko 1.7 method overview void ontransportstatus(in nsitransport atransport, in nsresult astatus, in unsigned long long a
progress, in unsigned long long a
progressmax); methods ontransportstatus() transport status notification.
... void ontransportstatus( in nsitransport atransport, in nsresult astatus, in unsigned long long a
progress, in unsigned long long a
progressmax ); parameters atransport the transport sending this status notification.
...a
progress the amount of data either read or written depending on the value of the status code.
...And 2 more matches
XMLHttpRequest - Web APIs
please use server-sent events, web sockets, or responsetext from
progress events instead.
... since then, a number of additional event handlers have been implemented in various browsers (onload, onerror, on
progress, etc.).
...
progress fired periodically when a request receives more data.
...And 2 more matches
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 with an aria
progressbar as well.
...And 2 more matches
Accessibility documentation index - Accessibility
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.
... 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.
...And 2 more matches
Handling media support issues in web content - Web media technologies
poster frames for video
progressive images images—whether embedded using <img> or <picture>—don't support a concept similar to poster frames.
...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.
...And 2 more matches
On page load - Archive of obsolete content
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 nsiweb
progresslistener interface.
... // 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.
Building Trees - Archive of obsolete content
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.
...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.
Document Object Model - Archive of obsolete content
our find files 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.
... we'll change the
progress meter so that its initially hidden.
...<splitter id="splitbar" resizeafter="grow" hidden="true"/> <hbox> <
progressmeter id="progmeter" value="50%" style="margin: 4px;" hidden="true"/> we've added the hidden attribute and set the value to true.
... function dofind(){ var meter = document.getelementbyid('progmeter'); meter.hidden = false; } this function first gets a reference to the
progress meter using its id, progmeter.
Gecko info for Windows accessibility vendors
event_valuechange is fired for sliders,
progress meters and other objects who's get_accvalue() may change.
...the exception is
progress meters, which are guaranteed to fire event_show and event_hide events when they are displayed or hidden.
...be prepared for new combinations of roles and states in content, such as role_slider, role_
progressbar and state_required.
... 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.
DownloadSummary
progresstotalbytes read only number indicates the total number of bytes to be transferred before completing all the downloads that are currently in
progress.
... this is zero if no downloads are currently in
progress.
...
progresscurrentbytes read only number number of bytes currently transferred as part of all the downloads that are currently in
progress.
... this is zero if no downloads are currently in
progress.
nsIApplicationUpdateService
obsolete since gecko 1.9.1.7pre isdownloading boolean true if a download is in
progress, otherwise false.
... methods adddownloadlistener() adds a listener that receives
progress and state information about the update that is currently being downloaded.
...void adddownloadlistener( in nsirequestobserver listener ); parameters listener an object implementing nsirequestobserver and optionally nsi
progresseventsink that will be notified of state and
progress information as the update is downloaded.
...removedownloadlistener() removes a listener that is receiving
progress and state information about the update that is currently being downloaded.
nsIDocumentLoader
it is also responsible for sending nsiweb
progresslistener notifications.
...mponents.classes["@mozilla.org/docloaderservice;1"] .createinstance(components.interfaces.nsidocumentloader); method overview void clearparentdocloader(); obsolete since gecko 1.8 void createdocumentloader(out nsidocumentloader aninstance); obsolete since gecko 1.8 void destroy(); obsolete since gecko 1.8 void fireonlocationchange(in nsiweb
progress aweb
progress, in nsirequest arequest, in nsiuri auri); obsolete since gecko 1.8 void fireonstatuschange(in nsiweb
progress aweb
progress, in nsirequest arequest, in nsresult astatus, in wstring amessage); obsolete since gecko 1.8 void getcontentviewercontainer(in nsisupports adocumentid, out nsicontentviewercontainer aresult); native code only!
... fireonlocationchange() obsolete since gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) void fireonlocationchange( in nsiweb
progress aweb
progress, in nsirequest arequest, in nsiuri auri ); parameters aweb
progress arequest auri fireonstatuschange() obsolete since gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) void fireonstatuschange( in nsiweb
progress aweb
progress, in nsirequest arequest, in nsresult astatus, in wstring amessage ); parameters ...
... aweb
progress arequest astatus amessage native code only!getcontentviewercontainer obsolete since gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0)this feature is obsolete.
nsIHttpChannel
exceptions thrown ns_error_in_
progress if set after the channel has been opened.
... exceptions thrown ns_error_in_
progress if set after the channel has been opened.
... exceptions thrown ns_error_in_
progress if called after the channel has been opened.
... exceptions thrown ns_error_in_
progress if called after the channel has been opened.
nsIUpdateCheckListener
toolkit/mozapps/update/nsiupdateservice.idlscriptable an interface describing an object that listens to the
progress of an update check operation.
... 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 on
progress(in nsixmlhttprequest request, in unsigned long position, in unsigned long totalsize); methods oncheckcomplete() called when the update check is completed.
... on
progress() called every time there is a
progress notification loading the update service file.
... void on
progress( in nsixmlhttprequest request, in unsigned long position, in unsigned long totalsize ); parameters request the nsixmlhttprequest object handling the update check.
XPCOM Interface Reference by grouping
swindow nsidomnode nsidomnshtmldocument nsidomstorageitem nsidomstoragemanager nsidomwindow nsidomwindow2 nsidomwindowinternal nsidomwindowutils nsidynamiccontainer nsieditor event nsidomevent nsidomeventgroup nsidomeventlistener nsidomeventtarget nsidommousescrollevent nsidommoztouchevent nsidomorientationevent nsidom
progressevent 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 nsidownload
progresslistener 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 nsifeed
progresslistener 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 nsitaskbar
progress nsitaskbartabpreview nsitaskbarwindowpreview nsiwintaskbar nsialertsservice nsiweb
progress nsiweb
progresslistener nsiweb
progresslistener2 update nsiupdate nsiupdatechecker nsiupdatechecklistener nsiupdateitem nsiupdatemanager nsiupdatepatch ...
Using files from web applications - Web APIs
function fileupload(img, file) { const reader = new filereader(); this.ctrl = createthrobber(img); const xhr = new xmlhttprequest(); this.xhr = xhr; const self = this; this.xhr.upload.addeventlistener("
progress", function(e) { if (e.lengthcomputable) { const percentage = math.round((e.loaded * 100) / e.total); self.ctrl.update(percentage); } }, false); xhr.upload.addeventlistener("load", function(e){ self.ctrl.update(100); const canvas = self.ctrl.ctx.canvas; canvas.parentnode.removechild(canvas); }, false); xhr.open("pos...
...t", "http://demos.hacks.mozilla.org/paul/demos/resources/webservices/devnull.php"); xhr.overridemimetype('text/plain; charset=x-user-defined-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).
FileHandle API - Web APIs
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.
...such monitoring can be done using the filerequest.on
progress event handler.
... var
progress = document.queryselector('
progress'); var myfile = myfilehandle.open('readonly'); // let's read a 1gb file var action = myfile.readasarraybuffer(1000000000); action.on
progress = function (event) { if (
progress) {
progress.value = event.loaded;
progress.max = event.total; } } action.onsuccess = function () { console.log('yeah \o/ just read a 1gb file'); } action.onerror = function () { console.log('oups :( unable to read a 1gb file') } file storage when a file handle is created, the associated file only exists as a "temporary file" as long as you hold the filehandle instance.
Using feature queries - CSS: Cascading Style Sheets
in this guide you will learn how to implement
progressive enhancement using feature queries.
... how to use feature queries for
progressive enhancement feature queries are an incredibly useful tool when
progressively enhancing a site.
...in practice however, when using feature queries for
progressive enhancement, this doesn't matter.
... see also the @supports rule learn layout: supporting older browsers css grid layout and
progressive enhancement using feature queries in css ...
cursor - CSS: Cascading Style Sheets
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.
...
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).
..., ]* [ auto | default | none | context-menu | help | pointer |
progress | wait | cell | crosshair | text | vertical-text | alias | copy | move | no-drop | not-allowed | e-resize | n-resize | ne-resize | nw-resize | s-resize | se-resize | sw-resize | w-resize | ew-resize | ns-resize | nesw-resize | nwse-resize | col-resize | row-resize | all-scroll | zoom-in | zoom-out | grab | grabbing ] ] examples setting cursor types .foo { cursor: crosshair; } .bar { curso...
<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.
... linear gradient linear gradients transition colors
progressively along an imaginary line.
... radial gradient radial gradients transition colors
progressively from a center point (origin).
... conic gradient conic gradients transition colors
progressively around a circle.
page-break-after - CSS: Cascading Style Sheets
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-before - CSS: Cascading Style Sheets
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.
Content categories - Developer guides
on>, <canvas>, <cite>, <code>, <command>, <data>, <datalist>, <del>, <details>, <dfn>, <div>, <dl>, <em>, <embed>, <fieldset>, <figure>, <footer>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <header>, <hgroup>, <hr>, <i>, <iframe>, <img>, <input>, <ins>, <kbd>, <keygen>, <label>, <main>, <map>, <mark>, <math>, <menu>, <meter>, <nav>, <noscript>, <object>, <ol>, <output>, <p>, <picture>, <pre>, <
progress>, <q>, <ruby>, <s>, <samp>, <script>, <section>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <svg>, <table>, <template>, <textarea>, <time>, <ul>, <var>, <video>, <wbr> and text.
... 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).
... <button> <fieldset> <input> <keygen> <label> <meter> <object> <output> <
progress> <select> <textarea> this category contains several sub-categories: listed elements that are listed in the form.elements and fieldset.elements idl collections.
...contains <button>, <input>, <keygen>, <meter>, <output>, <
progress>, <select>, and <textarea>.
Browser detection using the user agent - HTTP
there are ways to develop your website to
progressively enhance itself based on the availability of features rather than by targeting specific browsers.
...also, rethink your design: can you use
progressive enhancement or fluid layouts to help remove the need to do this?
...
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.
...this can be harder to do, and less effective, than
progressive enhancement, but may be useful in some cases.
Optimizing startup performance - Web Performance
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.
...include a
progress indicator so the user knows what's going on and how long they'll be waiting.
...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.
...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.
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.
... 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
progresslistener applications and extensions implement this interface to be made aware of changes in the status of downloads.
Priority Content - Archive of obsolete content
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 an...
...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.
...started: scripting plugins: macromedia flash original: scripting plugins: macromedia flash wiki location: scripting plugins: macromedia flash migrators: dependant on (these parts need to be done, put your name down) completed: soap in netscape gecko-based browsers original: soap in netscape gecko-based browsers wiki location: soap in gecko-based browsers migrators: doron rosenberg in
progress: css support charts original: css support charts and archive.org mirror wiki location: css support charts migrators: serge k.
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.
... undetermined the
progressmeter is indeterminate.
Adding Style Sheets - Archive of obsolete content
<spacer class="titlespace"/> <hbox> <
progressmeter id="progmeter" value="50%" style="display:none;"/> the new xml-stylesheet line is used to import the style sheet.
...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.
XUL Questions and Answers - Archive of obsolete content
what is an example of add
progresslistener?
... an example of this is this: // associate the
progress listener for a "browser" to a listener object browserobject.add
progresslistener( listobj, components.interfaces.nsiweb
progress.notify_state_window ); // remember to define the object, something like this: listobj = new object(); listobj.wpl = components.interfaces.nsiweb
progresslistener; listobj.queryinterface = function(aiid) { if (aiid.equals(listobj.wpl) || aiid.equals(components.interfaces.nsisupportsweakreference) || aiid.equals(components.interfaces.nsisupports)) return this; throw components.results.ns_nointerface; } listobj.onstatechange = function(a
progress, arequest, aflag, astatus) { if (aflag & listobj.wpl.state_start) { // this fires when the load event is initiated } else { if (aflag ...
...} if ( aflag & listobj.wpl.state_is_network ) { // fires when all load are really over, // do something "final" here // (my two cents) } else { // this fires when a load finishes } } } return 0; } // this fires when the location bar changes i.e load event is confirmed // or when the user switches tabs listobj.onlocationchange = function(a
progress, arequest, auri) { // do whatever you want to do return 0; } // for definitions of the remaining functions see xulplanet.com listobj.on
progresschange = function() { return 0 }; listobj.onstatuschange = function() { return 0 }; listobj.onsecuritychange = function() { return 0 }; listobj.onlinkiconavailable = function() { return 0 }; /* i use the
progress listener to trap the end of a local h...
XUL controls - Archive of obsolete content
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.
treecell - Archive of obsolete content
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.
... undetermined the
progressmeter is indeterminate.
RDF in Mozilla FAQ - Archive of obsolete content
for this reason, there is an observer interface that allows you to spy on a datasource's
progress.
... the following code illustrates its usage: // this is the object that will observe the rdf/xml load's
progress var observer = { onbeginload: function(asink) {}, oninterrupt: function(asink) {}, onresume: function(asink) {}, onendload: function(asink) { asink.removexmlsinkobserver(this); alert("done!"); }, onerror: function(asink, astatus, aerrormsg) { alert("error!
...ed) { alert("the datasource was already loaded!"); } else { alert("the datasource wasn't loaded, but it's loading now!"); // rdf/xml datasources are all nsirdfxmlsinks var sink = ds.queryinterface(components.interfaces.nsirdfxmlsink); // attach the observer to the datasource-as-sink sink.addxmlsinkobserver(observer); // now observer's methods will be called-back as // the load
progresses.
2D maze game with device orientation - Game development
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.
...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.
Index - Learn web development
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.
...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.
... 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.
Getting started with Vue - Learn web development
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.
... in addition to allowing you to
progressively integrate vue into your applications, vue also provides a
progressive approach to writing markup.
...this allows you to start using vue on existing sites, which is why vue prides itself on being a
progressive framework.
Experimental features in Firefox
the specification is still a work-in-
progress.
... see bug 1602129 for our
progress on this api.
...see bug 1622409 for implementation
progress.
Limitations of chrome scripts
nsiweb
progresslistener this api will work in the chrome process.
... there is a shim that gives you access to the domwindow property of the nsiweb
progress object passed into onstatechange.
... alternatively, you can use nsiweb
progresslistener in the content process.
Add-on Repository
issearching boolean true if a search is currently in
progress; otherwise false.
... cancelsearch() cancels the search in
progress.
... does nothing if there is no search in
progress.
Sqlite.jsm
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.
... transactionin
progress this boolean property indicates whether a transaction is in
progress.
Application Translation with Mercurial
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.
... 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.
... 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).
Index
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.
...repeating the process allows a localizer to create a testable package to see his or her work as they
progress to a final version.
Localization sign-off reviews
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.
... 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.
...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.
Localization technical reviews
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.
... tracking your
progress you can track your reviews
progress two ways: within the bug and through your team's dashboard.
...these bugs are also pulled into the dashboards, which track your revision's
progress.
PRCallOnceType
syntax #include <prinit.h> typedef struct prcalloncetype { printn initialized; print32 in
progress; prstatus status; } prcalloncetype; fields the structure has these fields: initialized if not zero, the initialization process has been completed.
... in
progress if not zero, the initialization process is currently being executed.
... calling threads that observe this status block until in
progress is zero.
PR_ConnectContinue
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.
...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.
mozIStorageStatement
the optional callback routine receives notifications about the
progress of the query.
... mozistoragependingstatement executeasync( [optional] mozistoragestatementcallback acallback ); parameters acallback a callback object that will be notified of
progress, errors, and query completion.
... mozistorage
progresshandler monitor
progress during the execution of a statement.
nsIChannel
this is set by clients, who wish to provide a means to receive
progress, status and protocol-specific notifications.
... interfaces commonly requested include: nsi
progresseventsink, nsiprompt, and nsiauthprompt / nsiauthprompt2.
... exceptions thrown ns_error_in_
progress if the channel is reopened.
nsIFeedResultListener
toolkit/components/feeds/public/nsifeedlistener.idlscriptable this interface should be implemented by programs to receive events from the feed parser as parsing
progresses.
...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.
... see also nsifeed
progresslistener nsisupports interwiki link ...
nsIWebBrowser
the chrome object may optionally implement nsiweb
progresslistener instead of explicitly calling addwebbrowserlistener() and removewebbrowserlistener() to register a
progress listener object.
...typically this method will be called to register an object to receive nsiweb
progresslistener or nsishistorylistener notifications in which case the the iid is that of the interface.
... see also nsibasewindow nsicontextmenulistener nsidomwindow nsiembeddingsitewindow nsiinterfacerequestor nsishistorylistener nsitooltiplistener nsiuricontentlistener nsiweakreference nsiwebbrowserchrome nsiwebbrowserchromefocus nsiweb
progresslistener ...
nsIXMLHttpRequestEventTarget
on
progress 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 nsidom
progressevent interface.
... see also using xmlhttprequest xmlhttprequest nsixmlhttprequest nsidom
progressevent ...
Streams - Plugins
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.
... 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.
...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.
FileReader - Web APIs
filereader.on
progress a handler for the
progress event.
...
progress fired periodically as data is read.
... also available via the on
progress property.
XDomainRequest - Web APIs
event handlers xdomainrequest.on
progress a handler for when the request has made
progress between the send method call and the onload event.
... example if(window.xdomainrequest){ var xdr = new xdomainrequest(); xdr.open("get", "http://example.com/api/method"); xdr.on
progress = function () { //
progress }; xdr.ontimeout = function () { //timeout }; 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 xdomainre...
... note: the xdr.on
progress event should always be defined, even as an empty function, or xdomainrequest may not fire onload for duplicate requests.
Using the aria-valuenow attribute - Accessibility
the aria-valuenow attribute is used to define the current value for a range widget such as a slider, spinbutton or
progressbar.
... 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.
... <div role="slider" aria-valuenow="4" aria-valuemin="1" aria-valuemax="10"> working examples:
progressbar example slider example spinbutton example notes used with aria roles
progressbar scrollbar slider spinbutton related aria techniques aria-valuemax aria-valuemin aria-valuetext compatibility tbd: add support information for common ua and at product combinations additional resources wai-aria specification for the aria-valuenow attribute ...
: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.
... /* 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.
...kbox" 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.</label> </div> css input:indeterminate + label { background: lime; } javascript var inputs = document.getelementsbytagname("input"); for (var i = 0; i < inputs.length; i++) { inputs[i].indeterminate = true; }
progress bar html <
progress> css
progress { margin: 4px; }
progress:indeterminate { opacity: 0.5; background-color: lightgray; box-shadow: 0 0 2px 1px red; } result specifications specification status comment html living standardthe definition of ':indeterminate' in that specification.
scan - CSS: Cascading Style Sheets
progressive the device draws all lines in sequence.
... all computer screens use
progressive scanning.
...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.
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...
...able-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-scrollbar-end-backward -moz-scrollbar-end-forward -moz-scrollbar-start-backward -moz-scrollbar-start-forward -moz-scrollbar-thumb-proportional -m...
HTML attribute: max - HTML: Hypertext Markup Language
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.
... for the<
progress> element, the max attribute describes how much work the task indicated by the
progress element requires.
... syntax for max values for other elements input type syntax example <
progress> <number> <
progress id="file" max="100" value="70"> 70% </
progress> <meter> <number> <meter id="fuel" min="0" max="100" low="33" high="66" optimum="80" value="40"> at 40/100</meter> ...
HTML attribute reference - HTML: Hypertext Markup Language
form <button>, <fieldset>, <input>, <keygen>, <label>, <meter>, <object>, <output>, <
progress>, <select>, <textarea> indicates the form that is the owner of the element.
... max <input>, <meter>, <
progress> indicates the maximum value allowed.
... 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.
HTTP Index - HTTP
there are ways to develop your website to
progressively enhance itself based on the availability of features rather than by targeting specific browsers.
... 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).
...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.
Redirections in HTTP - HTTP
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.
...temporary redirections are also used when creating, updating, or deleting resources, to show temporary
progress pages.
...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.
SVG Presentation Attributes - SVG: Scalable Vector Graphics
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: <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.
places/bookmarks - Archive of obsolete content
save() and search() are both asynchronous functions: they synchronously return a placesemitter object, which then asynchronously emits events as the operation
progresses and completes.
...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(...
Chapter 3: Introduction to XUL—How to build a more intuitive UI - Archive of obsolete content
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.
CSS3 - Archive of obsolete content
the next iteration of the selectors specification is already in
progress, though it still hasn't reached the first public working draft stage.
... 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).
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...
Embedding FAQ - Archive of obsolete content
here is the code : import org.eclipse.swt.swt; import org.eclipse.swt.browser.mozillabrowser; import org.eclipse.swt.browser.
progressevent; import org.eclipse.swt.browser.
progresslistener; import org.eclipse.swt.widgets.display; import org.eclipse.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 mozi...
...llabrowser(shell,wt.border); browser.seturl("http://www.google.com"); browser.add
progresslistener(new
progresslistener() { public void changed(
progressevent event) { } public void completed(
progressevent event) { nsidomdocument doc = browser.getdocument(); system.out.println(doc); } }); while (!shell.isdisposed()) { if (!display.readanddispatch()) { display.sleep(); } } } how to map a javascript function to a c++ function define an xpcom class defining the function you'll be d...
Methods - Archive of obsolete content
« xul reference home acceptdialog additemtoselection addpane add
progresslistener addsession addtab addtabs
progresslistener 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 remove
progresslistener removesession removetab removetabs
progresslistener removetransientnotifications replacegroup reset rewind scrollbyindex scrollbypixels scrolltoindex select selectall selectitem selectitemrange selecttabatindex setselectionrange showpane showpopup sizeto startediting stop stopediting swapdocshells syncsessions timedselect toggleitemselect...
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 ...
XULRunner tips - Archive of obsolete content
work in
progress.
...the following prefs must also be set to make 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.upd...
Archived Mozilla and build documentation - Archive of obsolete content
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.
... 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.
CSS - Archive of obsolete content
it only works on mac os x.-ms-acceleratorthe -ms-accelerator css property is a microsoft extension that sets or retrieves a string indicating whether the object represents a keyboard shortcut.-ms-block-
progressionthe -ms-block-
progression css property is a microsoft extension that specifies the block
progression and layout orientation.-ms-content-zoom-chainingthe -ms-content-zoom-chaining css property is a microsoft extension specifying the zoom behavior that occurs when a user hits the zoom limit during page manipulation.-ms-content-zoom-limitthe -ms-content-zoom-limit css shorthand property is a micro...
...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.
Anatomy of a video game - Game development
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.
...time you will need to make hard decisions about your main loop: how to simulate the accurate
progress of time.
Game promotion - Game development
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.
... those portals that have their own api will allow you to authorize users, save their
progress and process in-app purchases.
Efficient animation for web games - Game development
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.
CSS values and units - Learn web development
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.
...each <li> has a font-size of 80%, therefore the nested list items become
progressively smaller as they inherit their sizing from their parent.
Supporting older browsers - Learn web development
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.
... see also using feature queries in css backwards compatibility of flexbox css grid layout and
progressive enhancement using css grid: supporting browsers without grid a tutorial which uses the ie10 and 11 version of grid should i try to use the ie10 implementation of grid layout?
What’s in the head? Metadata in HTML - Learn web development
it will look something like this (although it may change over time): <meta name="description" content="the mdn web docs site provides information about open web technologies including html, css, and apis for both web sites and
progressive web apps."> now search for "mdn web docs" in your favorite search engine (we used google.) you'll notice the description <meta> and <title> element content used in the search result — definitely worth having!
... 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.
Aprender y obtener ayuda - Learn web development
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.
... keep thinking about how much
progress you are making, and adjust your plan if needs be.
Perceived performance - Learn web development
loading essential data in initial requests and
progressively loading features and data only as needed helps mitigate low bandwidth and lower spec hardware.
... 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.
TypeScript support in Svelte - Learn web development
you can now start adding types
progressively.
... 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.
Accessibility API cross-reference
<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.
... 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.
Software accessibility: Where are we today?
this article reviews the
progress and technology as it has developed.
...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).
Mozilla’s UAAG evaluation report
(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.
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; } }, // nsi
progresseventsink (not implementing will cause annoying exceptions) on
progress : function (arequest, acontext, a
progress, a
progressmax) { }, 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 ...
... queryinterface : function(aiid) { if (aiid.equals(components.interfaces.nsisupports) || aiid.equals(components.interfaces.nsiinterfacerequestor) || aiid.equals(components.interfaces.nsichanneleventsink) || aiid.equals(components.interfaces.nsi
progresseventsink) || aiid.equals(components.interfaces.nsihttpeventsink) || aiid.equals(components.interfaces.nsistreamlistener)) return this; throw components.results.ns_nointerface; } }; quick note: storing the channel in a global (especially in an extension) isn't a good idea, but was done to make the code easier to read.
Debugging on Mac OS X
(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.
Simple Instantbird build
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.
...see: configure mercurial .hgrc file for
progress extension.
How to implement a custom autocomplete search component
earch is complete */ startsearch: function(searchstring, searchparam, previousresult, listener) { var results = ['mary', 'john']; var autocomplete_result = new providerautocompleteresult(searchstring, ci.nsiautocompleteresult.result_success, 0, "", results, null); listener.onsearchresult(this, autocomplete_result); }, /** * stops an asynchronous search that is in
progress */ stopsearch: function() { }, queryinterface: xpcomutils.generateqi([ ci.nsiautocompletesearch ]) }; // the following line is what xpcom uses to create components const nsgetfactory = xpcomutils.generatensgetfactory([ providerautocompletesearch ]); then register your xpcom component.
... 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...
AddonInstall
progress integer the
progress of any necessary downloads.
... max
progress integer the expected size of any necessary downloads or -1 if unknown.
Downloads.jsm
examples downloading to a local file this example downloads an html file without showing
progress, handling errors programmatically.
...for example, the properties that handle
progress are now more detailed and don't use the special value -1 anymore.
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,) _senddownload
progressevent: function(anewapp, a
progress) _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) _send
progressevent: function() updatestatechanged: function appobs_update(aupdate, astate) applicationcacheavailable: function appobs_cacheavail(aapplicationcache) ...
source-editor.jsm
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.
Initial setup
for now, simply be aware that these will become important as your efforts
progress.
... 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.
PR_GetConnectStatus
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.
sslerr.html
the receipt of this alert is an error only if it occurs while a handshake is in
progress.
... 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.
Web Replay
the current position within the recording is shown on the timeline with a
progress indicator.
... 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.
Gecko object attributes
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
introduction documentation is in
progress still.
...the rest of the mozilla universal access support is in
progress.
imgIDecoderObserver
it lets you monitor the
progress of loading an image.
...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.
nsIAccessibleRole
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".
nsIDOMMouseScrollEvent
methods initmousescrollevent() initializes the
progress event object.
...must be one of "abort", "error", "load", "loadstart", or "
progress".
nsIDocShell
beginrestore() begin firing web
progresslistener notifications for restoring a page presentation.
...finishrestore() finish firing web
progresslistener notifications and dom events for restoring a page presentation.
nsIDragService
the only exception is getcurrentsession(), since there's currently no way to check for a drag in
progress using standard dom methods or properties.
... return value the current drag session, or null if no drag is in
progress.
Storage
if a transaction is already in
progress, no transaction is obtained.
... mozistorage
progresshandler monitor
progress during the execution of a statement.
XPCOM tasks
see bug 23737 work is
progressing on this.
... work is
progressing on this.
Plugin Roadmap for Firefox - Plugins
to support the transition away from flash, firefox is working with other browsers to
progressively and carefully make flash usage less common.
...this change will be rolled out
progressively during august and september 2017.
Debugger.Frame - Firefox Developer Tools
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.
... 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.
AudioContext - Web APIs
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.
Document - Web APIs
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.on
progress is an eventhandler representing the code to be called when the
progress event is raised.
EffectTiming.iterationStart - Web APIs
web animations api's effecttiming dictionary's iterationstart property specifies the repetition number which repetition the animation begins at and its
progress through it.
...iterationstart represents the iteration index at which the animation effect begins as well as its
progress through that iteration.
Event - Web APIs
clicking the mouse button or tapping keyboard, or generated by apis to represent the
progress of an asynchronous task.
...rientationevent deviceproximityevent domtransactionevent dragevent editingbeforeinputevent errorevent fetchevent focusevent gamepadevent hashchangeevent idbversionchangeevent inputevent keyboardevent mediastreamevent messageevent mouseevent mutationevent offlineaudiocompletionevent overconstrainederror pagetransitionevent paymentrequestupdateevent pointerevent popstateevent
progressevent relatedevent rtcdatachannelevent rtcidentityerrorevent rtcidentityevent rtcpeerconnectioniceevent sensorevent storageevent svgevent svgzoomevent timeevent touchevent trackevent transitionevent uievent userproximityevent webglcontextevent wheelevent constructor event() creates an event object, returning it to the caller.
FileReader: abort event - Web APIs
bubbles no cancelable no interface
progressevent event handler property filereader.onabort examples live example html <div class="example"> <div class="file-select"> <label for="avatar">choose a profile picture:</label> <input type="file" id="avatar" name="avatar" accept="image/png, image/jpeg"> </div> <img src="" class="preview" height="200" alt="image preview..."> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents"></textarea> </div> </div> css img.preview { margin: 1rem 0; } .event-log-c...
... 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
bubbles no cancelable no interface
progressevent event handler property filereader.onload examples live example html <div class="example"> <div class="file-select"> <label for="avatar">choose a profile picture:</label> <input type="file" id="avatar" name="avatar" accept="image/png, image/jpeg"> </div> <img src="" class="preview" height="200" alt="image preview..."> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents"></textarea> </div> </div> css img.preview { margin: 1rem 0; } .event-log-contents { width: 18rem; height: 5rem; border: ...
... 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
bubbles no cancelable no interface
progressevent event handler property filereader.onloadend examples live example html <div class="example"> <div class="file-select"> <label for="avatar">choose a profile picture:</label> <input type="file" id="avatar" name="avatar" accept="image/png, image/jpeg"> </div> <img src="" class="preview" height="200" alt="image preview..."> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents"></textarea> </div> </div> css img.preview { margin: 1rem 0; } .event-log-contents { width: 18rem; heigh...
... 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
bubbles no cancelable no interface
progressevent event handler property filereader.onloadstart examples live example html <div class="example"> <div class="file-select"> <label for="avatar">choose a profile picture:</label> <input type="file" id="avatar" name="avatar" accept="image/png, image/jpeg"> </div> <img src="" class="preview" height="200" alt="image preview..."> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents"></textarea> </div> </div> css img.preview { margin: 1rem 0; } .event-log-contents { width: 18rem; height: 5rem; ...
... 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 ...
GlobalEventHandlers - Web APIs
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.on
progress is an eventhandler representing the code to be called when the
progress event is raised.
OfflineAudioContext - Web APIs
offlineaudiocontext.suspend() schedules a suspension of the time
progression in the audio context at the specified time and returns a promise.
... deprecated methods offlineaudiocontext.resume() resumes the
progression of time in an audio context that has previously been suspended.
Window - Web APIs
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.
... 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.
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.nsiweb
progresslistener.state_is_secure) == ci.nsiweb
progresslistener.state_is_secure) { dump("secure connection\n"); } else if ((secinfo.securitystate & ci.nsiweb
progresslistener.state_is_insecure) == ci.nsiweb
progresslistener.state_is_insecure) { dump("insecure connection\n"); } else if ((secinfo.securitystate & ci.nsiweb
progresslistener.state_is_broken)...
... == ci.nsiweb
progresslistener.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) { var cert = secinfo.queryinterface(ci.nsisslstatusprovider) .sslstatus.queryinterface(ci.nsisslstatus).servercert; dump("\tcommon name (cn) = " + cert.commonname + "\n"); dump("\tissuer = " + cert.issuerorganization + "\n"); dump("\torganisation = " + cert.organization + "\n"); dump("\tsha1 fingerprint = ...
XMLHttpRequest: abort event - Web APIs
bubbles no cancelable no interface
progressevent event handler property onabort examples live example html <div class="controls"> <input class="xhr success" type="button" name="xhr" value="click to start xhr (success)" /> <input class="xhr error" type="button" name="xhr" value="click to start xhr (error)" /> <input class="xhr abort" type="button" name="xhr" value="click to start xhr (abort)" /> </div> <textarea readonly class="event-log"></textarea> css .event-log { width: 25rem; height: 4rem; border: 1px solid black; margin: .5rem; padding: .2rem; } input { width: 11rem; mar...
....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
bubbles no cancelable no interface
progressevent event handler property onerror examples live example html <div class="controls"> <input class="xhr success" type="button" name="xhr" value="click to start xhr (success)" /> <input class="xhr error" type="button" name="xhr" value="click to start xhr (error)" /> <input class="xhr abort" type="button" name="xhr" value="click to start xhr (abort)" /> </div> <textarea readonly class="event-log"></textarea> css .event-log { width: 25rem; height: 4rem; border: 1px solid black; margin: .5rem; padding: .2rem; } input { width: 11rem; margin: .5rem; } js const xhrbuttonsuccess = document.qu...
....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
bubbles no cancelable no interface
progressevent event handler property onload examples live example html <div class="controls"> <input class="xhr success" type="button" name="xhr" value="click to start xhr (success)" /> <input class="xhr error" type="button" name="xhr" value="click to start xhr (error)" /> <input class="xhr abort" type="button" name="xhr" value="click to start xhr (abort)" /> </div> <textarea readonly class="event-log"></textarea> css .event-log { width: 25rem; height: 4rem; border: 1px solid black; margin: .5rem; padding: .2rem; } input { width: 11rem; margin: .5rem; } js const xhrbuttonsuc...
....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
bubbles no cancelable no interface
progressevent event handler property onloadend examples live example html <div class="controls"> <input class="xhr success" type="button" name="xhr" value="click to start xhr (success)" /> <input class="xhr error" type="button" name="xhr" value="click to start xhr (error)" /> <input class="xhr abort" type="button" name="xhr" value="click to start xhr (abort)" /> </div> <textarea readonly class="event-log"></textarea> css .event-log { width: 25rem; height: 4rem; border: 1px solid black; margin: .5rem; padding: .2rem; } input { width: ...
....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
bubbles no cancelable no interface
progressevent event handler property onloadstart examples live example html <div class="controls"> <input class="xhr success" type="button" name="xhr" value="click to start xhr (success)" /> <input class="xhr error" type="button" name="xhr" value="click to start xhr (error)" /> <input class="xhr abort" type="button" name="xhr" value="click to start xhr (abort)" /> </div> <textarea readonly class="event-log"></textarea> css .event-log { width: 25rem; height: 4rem; border: 1px solid black; margin: .5rem; padding: .2rem; } input { width: 11rem; margin: .5rem; } js const xhrbuttonsuccess = d...
....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: 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.
XMLHttpRequest.upload - Web APIs
the xmlhttprequest upload property returns an xmlhttprequestupload object that can be observed to monitor an upload's
progress.
...
progress on
progress periodically delivered to indicate the amount of
progress made so far.
XMLHttpRequestResponseType - Web APIs
accessing response during a
progress event returns the data received so far.
... outside the
progress event handler, the value of response is always null.
Web APIs
labelelement htmllegendelement htmllinkelement htmlmapelement htmlmarqueeelement htmlmediaelement htmlmenuelement htmlmenuitemelement htmlmetaelement htmlmeterelement htmlmodelement htmlolistelement htmlobjectelement htmloptgroupelement htmloptionelement htmloptionscollection htmlorforeignelement htmloutputelement htmlparagraphelement htmlparamelement htmlpictureelement htmlpreelement html
progresselement 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-valuemax attribute - Accessibility
description the aria-valuemax attribute is used to define the maximum value allowed for a range widget such as a slider, spinbutton or
progressbar.
... <div role="slider" aria-valuenow="4" aria-valuemin="1" aria-valuemax="10"> working examples:
progressbar example slider example spinbutton example notes used with aria roles
progressbar scrollbar slider spinbutton related aria techniques aria-valuemin aria-valuenow aria-valuetext compatibility tbd: add support information for common ua and at product combinations additional resources wai-aria specification for the aria-valuemax attribute ...
Using the aria-valuemin attribute - Accessibility
the aria-valuemin attribute is used to define the minimum value allowed for a range widget such as a slider, spinbutton or
progressbar.
... <div role="slider" aria-valuenow="4" aria-valuemin="1" aria-valuemax="10"> working examples:
progressbar example slider example spinbutton example notes used with aria roles
progressbar scrollbar slider spinbutton related aria techniques aria-valuemax aria-valuenow aria-valuetext compatibility tbd: add support information for common ua and at product combinations additional resources wai-aria specification for the aria-valuemin attribute ...
Using the aria-valuetext attribute - Accessibility
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.
... <div role="slider" aria-valuenow="1" aria-valuemin="1" aria-valuemax="7" aria-valuetext="sunday"> working examples: notes used with aria roles
progressbar scrollbar slider spinbutton related aria techniques aria-valuenow compatibility tbd: add support information for common ua and at product combinations additional resources wai-aria specification for the aria-valuetext attribute ...
Cognitive accessibility - Accessibility
for example, dementia and alzheimer's are permanent cognitive impairments that get
progressively worse.
...ontent, such as text written using plain-language standards; focusing attention on important content; minimizing distractions, such as unnecessary content or advertisements; providing consistent web page layout and navigation; incorporating familiar elements, such as underlined links that are blue when not visited and purple when visited; dividing processes into logical, essential steps with
progress indicators; making website authentication as easy as possible without compromising security; and making forms easy to complete, such as with clear error messages and simple error recovery.
Implementing a Microsoft Active Accessibility (MSAA) Server - Accessibility
add [important for multiple selection] event_object_selectionremove [important for multiple selection] event_object_selectionwithin [important for multiple selection] event_object_statechange [important for checkboxes and radio buttons] event_object_locationchange event_object_namechange event_object_descriptionchange event_object_valuechange [important for sliders and
progress meters] event_object_parentchange event_object_helpchange event_object_defactionchange event_object_acceleratorchange msaa states cheat sheet for information on what each state does, see the msdn state constants page.
...] 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
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.
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...
...sed-captions-button ::-webkit-media-controls-volume-control-container ::-webkit-media-controls-volume-control-hover-background ::-webkit-media-controls-volume-slider ::-webkit-meter-bar ::-webkit-meter-even-less-good-value ::-webkit-meter-inner-element ::-webkit-meter-optimum-value ::-webkit-meter-suboptimum-value -webkit-media-text-track-container ::-webkit-outer-spin-button ::-webkit-
progress-bar ::-webkit-
progress-inner-element ::-webkit-
progress-value ::-webkit-search-cancel-button ::-webkit-search-results-button ::-webkit-slider-runnable-track ::-webkit-slider-thumb note: generally, if there is an invalid pseudo-element or pseudo-class within in a chain or group of selectors, the whole selector list is invalid.
<easing-function> - CSS: Cascading Style Sheets
ease-in the animation starts slowly, and then
progressively speeds up until the end, at which point it stops abruptly.
... ease-out the animation starts abruptly, and then
progressively slows down towards the end.
linear-gradient() - CSS: Cascading Style Sheets
the linear-gradient() css function creates an image consisting of a
progressive transition between two or more colors along a straight line.
... <color-hint> the color-hint is an interpolation hint defining how the gradient
progresses between adjacent color stops.
radial-gradient() - CSS: Cascading Style Sheets
the radial-gradient() css function creates an image consisting of a
progressive transition between two or more colors that radiate from an origin.
... <color-hint> th color-hint is an interpolation hint defining how the gradient
progresses between adjacent color stops.
Live streaming web audio and video - Developer guides
this is often known as a
progressive download.
...it can also be used instead of the traditional
progressive download method for audio and video on demand: there are several advantages to this: latency is generally lower so media will start playing more quickly adaptive streaming makes for better experiences on a variety of devices media is downloaded just in time which makes bandwidth usage more efficient streaming protocols while static media is usually served over http, there are several ...
Audio and Video Delivery - Developer guides
you can also choose how to make your player responsive — for example you might remove the
progress bar under certain conditions.
... 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.
Link prefetching FAQ - HTTP
in the current implementation (mozilla 1.2), idle time is determined using the nsiweb
progresslistener api.
... we attach a listener to the toplevel nsiweb
progress object ("@mozilla.org/docloaderservice;1").
externalResourcesRequired - SVG: Scalable Vector Graphics
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.
...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.
writing-mode - SVG: Scalable Vector Graphics
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.
...(note that the inline-
progression-direction can change within a <text> element due to the unicode bidirectional algorithm and properties direction and unicode-bidi.) note: as a presentation attribute, writing-mode can be used as a css property.
SVG documentation index - SVG: Scalable Vector Graphics
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.
...(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.
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.
Code snippets - Archive of obsolete content
downloading files code to download files, images, and to monitor download
progress password manager code used to read and write passwords to/from the integrated password manager bookmarks code used to read and write bookmarks javascript debugger service code used to interact with the javascript debugger service svg general general information and utilities svg animation animate svg using javascript and smil svg interacting with script using javascript and dom ev...
Tabbed browser - Archive of obsolete content
ner("tabmove", exampletabmoved, false); container.addeventlistener("tabclose", exampletabremoved, false); // when no longer needed container.removeeventlistener("tabopen", exampletabadded, false); container.removeeventlistener("tabmove", exampletabmoved, false); container.removeeventlistener("tabclose", exampletabremoved, false); note: starting in gecko 1.9.1, there's an easy way to listen on
progress events on all tabs.
Promises - Archive of obsolete content
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.
Events - Archive of obsolete content
archived event pages domsubtreemodifiedmozaudioavailablemozbeforeresizemozorientationcachedchargingchangechargingtimechangecheckingdischargingtimechangedownloadingerrorlevelchangenoupdateobsolete
progressupdateready ...
Adding the structure - Archive of obsolete content
<statusbar id="status-bar" class="chromeclass-status" ondragdrop="nsdraganddrop.drop(event, contentareadndobserver);"> <statusbarpanel id="component-bar"/> <statusbarpanel id="statusbar-display" label="&statustext.label;" flex="1"/> <statusbarpanel class="statusbarpanel-
progress"> <
progressmeter class="
progressmeter-statusbar" id="statusbar-icon" mode="normal" value="0"/> </statusbarpanel> <statusbarpanel class="statusbarpanel-iconic" id="tinderbox-status" status="none"/> <statusbarpanel class="statusbarpanel-iconic" id="offline-status"/> <statusbarpanel class="statusbarpanel-iconic" id="security-button" onclick="browserpageinfo(null...
Making it into a static overlay - Archive of obsolete content
<statusbar id="status-bar" class="chromeclass-status" ondragdrop="nsdraganddrop.drop(event, contentareadndobserver);"> <statusbarpanel id="component-bar"/> <statusbarpanel id="statusbar-display" label="&statustext.label;" flex="1"/> <statusbarpanel class="statusbarpanel-
progress"> <
progressmeter class="
progressmeter-statusbar" id="statusbar-icon" mode="normal" value="0"/> </statusbarpanel> <statusbarpanel class="statusbarpanel-iconic" id="tinderbox-status" status="none"/> <statusbarpanel class="statusbarpanel-iconic" id="offline-status"/> <statusbarpanel class="statusbarpanel-iconic" id="security-button" onclick="brow...
In-Depth - Archive of obsolete content
button, checkbox-container, checkbox, dialog, dualbutton, dualbutton-dropdown, listbox, menu, menulist-textfield, menulist-button, menulist, menulist-text,
progressbar,
progresschunk, radio-container, radio, resizer, resizerpanel, separator, scrollbar, statusbar, statusbarpanel, toolbarbutton, toolbox, toolbar, treeheadercell, treeheadersortarrow, treeview, treeitem, treetwisty, treetwistyopen, tooltip, textfield, tabpanels, tab, tab-left-edge, tab-right-edge, scrollbartrack-horizontal, scrollbartrack-vertical, scrollbarthumb-vertical, scrollbarthumb-horizon...
HTTP Class Overview - Archive of obsolete content
nshttphandler implements nsiprotocolhandler manages preferences 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 transactio...
Creating a Help Content Pack - Archive of obsolete content
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".
HostWindow - Archive of obsolete content
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.
Tamarin Roadmap - Archive of obsolete content
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
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.
XUL Events - Archive of obsolete content
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.
accessibleType - Archive of obsolete content
xullisthead 1024 xullistheader 1025 xullistitem 100c xulmenubar 100d xulmenuitem 100e xulmenupopup 100f xulmenuseparator 1010 xulpane 1011 xul
progressmeter 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 web
progress 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...
Tree Widget Changes - Archive of obsolete content
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.
Localization - Archive of obsolete content
size;" flex="1"/> </treecols> <treechildren> <treeitem> <treerow> <treecell label="mozilla"/> <treecell label="/usr/local"/> <treecell label="&bytes.before;2520&bytes.after;"/> </treerow> </treeitem> </treechildren> </tree> <splitter id="splitbar" resizeafter="grow" style="display: none;"/> <spacer class="titlespace"/> <hbox> <
progressmeter id="progmeter" value="50%" style="display: none;"/> <spacer flex="1"/> <button id="find-button" label="&button.find;" oncommand="dofind()"/> <button id="cancel-button" label="&button.cancel;" oncommand="window.close();"/> </hbox> </vbox> </window> each text string has been replaced by an entity reference.
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) {}, get
progressmode : 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
(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.
XUL Tutorial - Archive of obsolete content
introduction introduction xul structure the chrome url manifest files simple elements creating a window adding buttons adding labels and images input controls numeric controls list controls
progress meters adding html elements using spacers more button features the box model the box model element positioning box model details groupboxes adding more elements more layout elements stacks and decks stack positioning tabboxes grids content panels splitters toolbars and menus toolbars simple menu bars more menu features popup menus scrolling menus events and scripts adding event handle...
XULBrowserWindow - Archive of obsolete content
in order to do so it implements the following interfaces: nsisupports nsixulbrowserwindow nsiweb
progresslistener nsiweb
progresslistener2 nsisupportsweakreference note: this page is not complete at this time.
Accessibility/XUL Accessibility Reference - Archive of obsolete content
progressmeter <
progressmeter mode="determined" value="10" /> as
progress advances, jaws indicates percentage to the user radio see radiogroup radiogroup <label value='<!--radio group-->' control='radioid' /> <radiogroup id='radioid'> <radio selected="true" label='<!--option1-->' /> <radio label='<!--option2-->' /> </radiogroup> row ...
XML - Archive of obsolete content
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.
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
properties accessibletype examples <statusbar> <statusbarpanel label="left panel"/> <spacer flex="1"/> <
progressmeter mode="determined" value="82"/> <statusbarpanel label="right panel"/> </statusbar> attributes inherited from xul element align, allowevents, allownegativeassertions, class, coalesceduplicatearcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minhe...
<statusbarpanel> - Archive of obsolete content
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.
Index - Game development
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.
Game over - Game development
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.
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...
What is accessibility? - Learn web development
or by video; easily-understood content, such as text written using plain-language standards; focusing attention on important content; minimizing distractions, such as unnecessary content or advertisements; consistent webpage layout and navigation; familiar elements, such as underlined links blue when not visited and purple when visited; dividing processes into logical, essential steps with
progress indicators; website authentication as easy as possible without compromising security; and making forms easy to complete, such as with clear error messages and simple error recovery.
CSS building blocks - Learn web development
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.
Getting started with Ember - Learn web development
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.
Deploying our app - Learn web development
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.
Mozilla accessibility architecture
event_menuend nsdocaccessible::scrollpositiondidchange(), then nsdocaccessible::scrolltimercallback() nsiscrollpositonlistener and nsitimer callbacks event_scrollingend (quick timer is used to determine when scrolling pauses or stops, to avoid extra events being fired) nsdocaccessible::onstatechange(), :nsdocaccessible:onlocationchange() nsiweb
progresslistener callback event_state_change (msaa) event_reorder (atk) dom mutation events - multiple uses dom mutation events are a great thing.
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
instructions for testers we've made a lot of
progress with mozilla/zoomtext compatibility.
Accessibility and Mozilla
this article reviews the
progress and technology as it has developed.zoomtextwe've made a lot of
progress with mozilla/zoomtext compatibility.
Testopia
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.
Chrome registration
toolbars, menu bars,
progress bars, and window title bars are all examples of elements that are typically part of the chrome.
Creating a Language Pack
it is likely that you will continue to generate language packs as your
progress just to test your work.
Debugging on Windows
ernal strings nsastring_internal=<mdata,su>, length=<mlength,u> nsacstring_internal=<mdata,s>, length=<mlength,u> ; xpcom strings nsastring=<nsstringcontainer.v,su>, length=<nsstringcontainer.d1,u> nsacstring=<nscstringcontainer.v,s>, length=<nscstringcontainer.d1,u> nsstringcontainer=<v,su>, length=<d1,u> nscstringcontainer=<v,s>, length=<d1,u> there is a more extensive version of this file in
progress in autoexpforvc8.
Windows SDK versions
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.
Error codes returned by Mozilla APIs
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.
Chrome-only CSS reference
udo-class will match an element if the mouse cursor is presently 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.
MozBeforePaint
<!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,...
Extending a Protocol
we should see ./mach build make significant
progress now, but obviously, wihtout a backing cpp implementation, it's not going to do much.
Implementing Download Resuming
you may want to use nsisimplestreamlistener to simplify this task; to get
progress notifications, you can implement nsi
progresseventsink 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).
Add-on Manager
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.
AsyncShutdown.jsm
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".
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
if the download is in
progress or has been finalized, this method does nothing and returns a resolved promise.
Interfacing with the Add-on Repository
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.
Log.jsm
progress is tracked in bugzilla using dependencies of bug 451283.
Index
302 nss tools man pages - work in
progress certutil certutil 303 nss cryptographic module nss no summary!
JSS
tagpki/jss.git -- or -- git clone https://github.com/dogtagpki/jss.git all future upstream enquiries to jss should now use the pagure issue tracker system: https://pagure.io/jss/issues documentation regarding the jss project should now be viewed at: http://www.dogtagpki.org/wiki/jss note: as much of the jss documentation is sorely out-of-date, updated information will be a work in
progress, and many portions of any legacy documentation will be re-written over the course of time.
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] ...
Python binding for NSS
this allows other python threads to execute during the time a nss/nspr function is
progress in another thread.
NSS tools : crlutil
synopsis crlutil [options] [[arguments]] status this documentation is still work in
progress.
NSS tools : modutil
synopsis modutil [options] [[arguments]] status this documentation is still work in
progress.
NSS reference
based on nss tools man pages : work in
progress ...
Pork
documentation installing pork download, installation and dependency info for pork pork tools description of rewriting tools pork tool development in
progress page...
Index
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.
JIT Optimization Strategies
note: this page is an in-
progress documentation of jit optimization strategies planned to support the "jit coach" feature intended for inclusion in firefox developer tools.
JSAPI User Guide
as the application
progresses, eventually it doesn't need the compiled script anymore, and the compiled script object becomes unreachable.
JS_GetGCParameter
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.
SpiderMonkey 1.8.7
draft in
progress - this is a draft, and right now it's mostly just a copy of the 1.8.5 release notes.
Running Automated JavaScript Tests
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.
Gecko Roles
role_
progressbar represents a
progress bar, dynamically showing the user the percent complete of an operation in
progress.
AT Development
this article (from 2007) reviews the
progress and technology as it has developed.
Feed content access API
nsifeed
progresslistener implemented by the program that wants to parse an rss or atom feed to receive messages during the parsing process.
Component Internals
for example, this is the object that may start a network download and implement interfaces that will listen to the
progress.
Creating the Component Code
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.
Receiving startup notifications
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.
XPCOM guide
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.
Components.isSuccessCode
const cc = components.classes; const ci = components.interfaces; const cr = components.results; // global flags polled externally var copyfailed = false; var copyin
progress = false; function copybufferedstream(instream, outstream) { var copyobserver = { onstartrequest: function(request, context) { copyin
progress = true; }, onstoprequest: function(request, context, statuscode) { copyin
progress = false; // did the copy fail?
IAccessibleValue
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.
imgIContainer
flag_sync_decode: forces synchronous/non-
progressive decode of all available data before the call returns.
mozIStorageFunction
mozistorage
progresshandler monitor
progress during the execution of a statement.
nsIWebBrowserPersist
progresslistener nsiweb
progresslistener callback listener for
progress notifications.
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 on
progress nsidomeventlistener see also nsixmlhttprequest nsixmlhttprequesteventtarget xmlhttprequest using xmlhttprequest ...
nsIXmlRpcClient
me, in string password); void setencoding(in string encoding); void setencoding(in unsigned long type, out nsiidref uuid, out nsqiresult result); void asynccall (in nsixmlrpcclientlistener listener, in nsisupports ctxt, in string methodname, in nsisupports arguments, in pruint32 count); attributes attribute type description serverurl readonly nsiurl the url of the xml-rpc server in
progress readonly boolean whether or not a call is in
progress fault readonly nsixmlrpcfault the most recent xml-rpc fault from returned from this server.
Address Book examples
use the address book manager to get an nsisimpleenumerator, then
progress through the enumerator, looking for nsiabitem, nsiabcollection or nsiabdirectory interfaces as you require.
Address book sync client design
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 on
progress(in print32 atransactionid, in pruint32 a
progress, in pruint32 a
progressmax); /** * 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.
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.set
progress(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...
Mozilla
toolbars, menu bars,
progress bars, and window title bars are all examples of elements that are typically part of the chrome.
Version, UI, and Status Information - Plugins
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.
Index - Firefox Developer Tools
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).
Examine and edit CSS - Firefox Developer Tools
displaying pseudo-elements the rule view displays the following pseudo-elements, if they are applied to the selected element: ::after ::backdrop ::before ::first-letter ::first-line ::selection :-moz-color-swatch :-moz-number-spin-box :-moz-number-spin-down :-moz-number-spin-up :-moz-number-text :-moz-number-wrapper :-moz-placeholder :-moz-
progress-bar :-moz-range-
progress :-moz-range-thumb :-moz-range-track :-moz-selection if the selected element has pseudo-elements applied to it, they are displayed before the selected element but hidden by a disclosure triangle: clicking the triangle displays them: viewing common pseudo-classes there's a button to the right of the filter box: click the button to see checkboxes that you can ...
Work with animations - Firefox Developer Tools
ransform' cannot be run on the compositor when geometric properties are animated on the same element at the same time." edit @keyframes any @keyframes rules associated with the currently selected element are displayed in the rules view and are editable: edit timing functions when you create a css animation you can specify a timing function: this determines the rate at which the animation
progresses.
Rich output - Firefox Developer Tools
for example, by expanding the array in the above list, i get the following: console.log(todolist) (4) […] ​ 0: object { status: "done", description: "morning pages", datecreated: 1552404478137 } ​ 1: object { status: "in
progress", description: "refactor styles", datecreated: 1552404493169 } ​ 2: object { status: "to do", description: "create feedback form", datecreated: 1552404512630 } ​ 3: object { status: "to do", description: "normalize table", datecreated: 1552404533790 } ​ length: 4 ​ <prototype>: array [] debugger eval code:1:9 undefined highlighting and inspecting dom nodes if you hover the mouse over an...
Firefox Developer Tools
application panel provides tools for inspecting and debugging modern web apps (also known as
progressive web apps).
AudioContext.close() - Web APIs
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.
AudioContext.resume() - Web APIs
the resume() method of the audiocontext interface resumes the
progression of time in an audio context that has previously been suspended.
AudioContext.suspend() - Web APIs
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.
DirectoryEntrySync - Web APIs
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.
Cross-global fetch usage - Web APIs
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
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).
FileReader: error event - Web APIs
bubbles no cancelable no interface
progressevent event handler property filereader.onerror examples const fileinput = document.queryselector('input[type="file"]'); const reader = new filereader(); function handleselected(e) { const selectedfile = fileinput.files[0]; if (selectedfile) { reader.addeventlistener('error', () => { console.error(`error occurred reading file: ${selectedfile.name}`); }); reader.addeventlistener('load', () => { console.error(`file: ${selectedfile.name} read successfully`); }); reader.readasdataurl(selectedfile); } ...
FileRequest - Web APIs
filerequest.on
progress a callback handler called repeatedly while the operation represented by the filerequest is in
progress.
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.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.
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.
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
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.
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 html
progresselement htmlquoteelement htmlscriptelement htmlselectelement htmlslotelement htmlsourceelement htmlspanelement htmlstyleelement htmltablecaptionelement htmltablecellelement htmltablecolelement htmltableelement htmltablerowelement htmltablesectionelement htmltemplateelement htmltextareaelement htmltimeelement htmltitleelement htmltrackelement htmlulistelement htmlunknownelement ...
IDBRequest.error - Web APIs
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.
Navigator.vibrate() - Web APIs
if a vibration pattern is already in
progress when this method is called, the previous pattern is halted and the new one begins instead.
OfflineAudioContext.suspend() - Web APIs
the suspend() method of the offlineaudiocontext interface schedules a suspension of the time
progression in the audio context at the specified time and returns a promise.
Using the Performance API - Web APIs
o.innerhtml += "<p>peformance.timing = " + json.stringify(timing) + "</p>"; var navigation = perf.navigation; o.innerhtml += "<p>peformance.navigation = " + json.stringify(navigation) + "</p>"; } } specifications the interfaces described in this document are defined in the high resolution time standard which has two levels: high-resolution time level 2; editors draft; work in
progress high-resolution time; w3c recommendation 17 december 2012 interoperability as shown in the performance interface's browser compatibility table, most of the performance interfaces are broadly implemented by desktop browsers.
XMLHttpRequest.readyState - Web APIs
example var xhr = new xmlhttprequest(); console.log('unsent', xhr.readystate); // readystate will be 0 xhr.open('get', '/api', true); console.log('opened', xhr.readystate); // readystate will be 1 xhr.on
progress = function () { console.log('loading', xhr.readystate); // readystate will be 3 }; xhr.onload = function () { console.log('done', xhr.readystate); // readystate will be 4 }; xhr.send(null); specifications specification status comment xmlhttprequest living standard whatwg living standard ...
XMLHttpRequest.status - Web APIs
example var xhr = new xmlhttprequest(); console.log('unsent: ', xhr.status); xhr.open('get', '/server'); console.log('opened: ', xhr.status); xhr.on
progress = function () { console.log('loading: ', xhr.status); }; xhr.onload = function () { console.log('done: ', xhr.status); }; xhr.send(); /** * outputs the following: * * unsent: 0 * opened: 0 * loading: 200 * done: 200 */ specifications specification status comment xmlhttprequest living standard whatwg living standard ...
XMLHttpRequest.statusText - Web APIs
example var xhr = new xmlhttprequest(); console.log('0 unsent', xhr.statustext); xhr.open('get', '/server', true); console.log('1 opened', xhr.statustext); xhr.on
progress = function () { console.log('3 loading', xhr.statustext); }; xhr.onload = function () { console.log('4 done', xhr.statustext); }; xhr.send(null); /** * outputs the following: * * 0 unsent * 1 opened * 3 loading ok * 4 done ok */ specifications specification status comment xmlhttprequest living standard whatwg living standard ...
XMLHttpRequestEventTarget - Web APIs
xmlhttprequesteventtarget.on
progress contains the function that is called periodically with information about the
progress of the request and the
progress event is received by this object.
XRInputSourceArray.forEach() - Web APIs
the xrinputsourcearray method foreach() executes the specified callback once for each input source in the array, starting at index 0 and
progressing until the end of the list.
XRView.eye - Web APIs
; gl.viewport(viewport.x, viewport.y, viewport.width, viewport.height); renderscene(gl, view); } } for each of the views, the value of eye is checked and if it's either left or right, we check to see if the body.lefteye.injured or body.righteye.injured property is true; if so, we call a function updateinjury() on that eye to do things such as allow a bit of healing to occur, track the
progress of a poison effect, or the like, as appropriate for the game's needs.
XRViewport.y - Web APIs
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.
Using ARIA: Roles, states, and properties - Accessibility
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.
WAI-ARIA Roles - Accessibility
alertdialog banner combobox command columnheader (estelle) complementary composite definition directory feed gridcell (eric e) group input landmark link - old page listbox log - old page marquee math menu menubar menuitem menuitemcheckbox menuitemradio none note option presentation
progressbar - old page radio - old page radiogroup range region roletype rowheader(estelle) scrollbar searchbox section sectionhead select separator slider - old page spinbutton status - old page structure tab tablist (michiel) tabpanel (michiel) term timer toolbar tooltip tree treegrid treeitem widget window ...
Text labels and names - Accessibility
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.
::-moz-range-thumb - CSS: Cascading Style Sheets
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
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.
CSS Display - CSS: Cascading Style Sheets
layout methods backwards compatibility of flexbox typical use cases of flexbox display: grid basic concepts of grid layout relationship to other layout methods line-based placement grid template areas layout using named grid lines auto-placement in grid layout box alignment in grid layout grids, logical values and writing modes css grid layout and accessibility css grid layout and
progressive enhancement realizing common layouts using grids specifications specification status comment css display module level 3the definition of 'display' in that specification.
Auto-placement in CSS Grid Layout - CSS: Cascading Style Sheets
; grid-auto-rows: 100px; grid-gap: 10px; } .wrapper div:nth-child(4n+1) { grid-column-end: span 2; grid-row-end: span 2; background-color: #ffa94d; } .wrapper div:nth-child(2) { grid-column: 3; grid-row: 2 / 4; } .wrapper div:nth-child(5) { grid-column: 1 / 3; grid-row: 1 / 3; } filling in the gaps so far, other than items we have specifically placed, grid is always
progressing forward and keeping items in dom order.
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...
Microsoft CSS extensions - CSS: Cascading Style Sheets
-ms-accelerator -ms-block-
progression -ms-content-zoom-chaining -ms-content-zooming -ms-content-zoom-limit -ms-content-zoom-limit-max -ms-content-zoom-limit-min -ms-content-zoom-snap -ms-content-zoom-snap-points -ms-content-zoom-snap-type -ms-filter -ms-flow-from -ms-flow-into -ms-high-contrast-adjust -ms-hyphenate-limit-chars -ms-hyphenate-limit-lines -ms-hyphenate-limit-zone -ms-ime-align -ms-overflow-style -ms-scrollbar-3dlight-color -ms-scrollbar-arrow-color ...
display - CSS: Cascading Style Sheets
layout methods backwards compatibility of flexbox typical use cases of flexbox display: grid basic concepts of grid layout relationship to other layout methods line-based placement grid template areas layout using named grid lines auto-placement in grid layout box alignment in grid layout grids, logical values and writing modes css grid layout and accessibility css grid layout and
progressive enhancement realizing common layouts using grids accessibility concerns display: none using a display value of none on an element will remove it from the accessibility tree.
text-overflow - CSS: Cascading Style Sheets
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).
CSS: Cascading Style Sheets
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.
Ajax - Developer guides
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.
Adding captions and subtitles to HTML5 video - Developer guides
as a consequence, the video controls now look as follows: <div id="video-controls" class="controls" data-state="hidden"> <button id="playpause" type="button" data-state="play">play/pause</button> <button id="stop" type="button" data-state="stop">stop</button> <div class="
progress"> <
progress id="
progress" value="0" min="0"> <span id="
progress-bar"></span> </
progress> </div> <button id="mute" type="button" data-state="mute">mute/unmute</button> <button id="volinc" type="button" data-state="volup">vol+</button> <button id="voldec" type="button" data-state="voldown">vol-</button> <button id="fs" type="button" data-state="go-fullscreen">ful...
DOM onevent handlers - Developer guides
for example, for the
progress event on instances of xmlhttprequest: const xhr = new xmlhttprequest(); xhr.on
progress = 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.
HTML5 - Developer guides
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.
Index - Developer guides
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.
Developer guides
progressive web apps
progressive web apps (pwas) use modern web apis along with traditional
progressive enhancement strategy to create cross-platform web applications.
<img>: The Image Embed element - HTML: Hypertext Markup Language
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.
<input>: The Input (Form Input) element - HTML: Hypertext Markup Language
: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.
Global attributes - HTML: Hypertext Markup Language
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, on
progress, onratechange, onreset, onresize, onscroll, onseeked, onseeking, onselect, onshow, onsort, onstalled, onsubmit, onsuspend, ontimeupdate, ontoggle, onvolumechange, onwaiting.
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 ...
HTML: Hypertext Markup Language
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.
Evolution of HTTP - HTTP
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.
Configuring servers for Ogg media - HTTP
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.
303 See Other - HTTP
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).
Working with objects - JavaScript
= 'random number'; myobj[obj] = 'object'; myobj[''] = 'even an empty string'; console.log(myobj); please note that all keys in the square bracket notation are converted to string unless they're symbols, since javascript object property names (keys) can only be strings or symbols (at some point, private names will also be added as the class fields proposal
progresses, but you won't use them with [] form).
Array - JavaScript
item // ["strawberry", "mango"] remove items from an index position let vegetables = ['cabbage', 'turnip', 'radish', 'carrot'] console.log(vegetables) // ["cabbage", "turnip", "radish", "carrot"] let pos = 1 let n = 2 let removeditems = vegetables.splice(pos, n) // this is how to remove items, n defines the number of items to be removed, // starting at the index position specified by pos and
progressing toward the end of array.
Function.arguments - JavaScript
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.
background_color - Web app manifests
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.
Web app manifests
web app manifests are part of a collection of web technologies called
progressive web apps (pwas), which are websites that can be installed to a device’s homescreen without an app store.
Authoring MathML - MathML
this is still a work-in-
progress, but could be improved in the future thanks to web components and shadow dom.
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 ...
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, on
progress, 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
when the inline-
progression-direction is vertical and the glyph-orientation-vertical results in an orientation angle that is a multiple of 180 degrees, then the current text position is incremented according to the vertical metrics of the glyph.
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, on
progress, 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
note: this article is a work in
progress, and is neither complete nor does following its suggestions guarantee your site will be fully secure.
Web technology for developers
accessibilitycss houdinicss: cascading style sheetsdemos of open web technologiesdeveloper guidesexsltevent referencehtml: hypertext markup languagehttpjavascriptmathmlopensearch description formatprivacy, permissions, and information security
progressive web apps (pwas)svg: scalable vector graphicstutorialsweb apisweb componentsweb performanceweb app manifestsweb media technologiesweb securityweb technology referencexml: extensible markup languagexpathxslt: extensible stylesheet language transformations ...