Search completed in 1.09 seconds.
598 results for "progress":
Your results are loading. Please wait...
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
WebHTMLElementprogress
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 htmlprogresselement 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.initprogressevent() 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.initprogressevent(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/nsiwebprogresslistener.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 nsiwebprogress instance as well as any child nsiwebprogress instances.
... inherits from: nsisupports last changed in gecko 15 (firefox 15 / thunderbird 15 / seamonkey 2.12) nsiwebprogress describes the parent-child relationship of nsiwebprogress instances.
... method overview void onlocationchange(in nsiwebprogress awebprogress, in nsirequest arequest, in nsiuri alocation, [optional] in unsigned long aflags); void onprogresschange(in nsiwebprogress awebprogress, in nsirequest arequest, in long acurselfprogress, in long amaxselfprogress, in long acurtotalprogress, in long amaxtotalprogress); void onsecuritychange(in nsiwebprogress awebprogress, in nsirequest arequest, in unsigned long astate); void onstatechange(in nsiwebprogress awebprogress, in nsirequest arequest, in unsigned long astateflags, in nsresult astatus); void onstatuschange(in nsiwebprogress awebprogress, in nsirequest arequest, in nsresult astatus, in wstring amessage); constants state transition flags these flags indicate the variou...
...And 33 more matches
nsIWebProgress
the nsiwebprogress interface is used to add or remove nsiwebprogresslistener instances to observe the loading of asynchronous requests (usually in the context of a dom window).
... nsiwebprogress 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 nsiwebprogress instance may not have an associated dom window.
...And 24 more matches
nsIDownloadProgressListener
/toolkit/components/downloads/nsidownloadprogresslistener.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 nsiwebprogress interface.
... method overview void ondownloadstatechange(in short astate, in nsidownload adownload); void onlocationchange(in nsiwebprogress awebprogress, in nsirequest arequest, in nsiuri alocation, in nsidownload adownload); obsolete since gecko 1.9.1 void onprogresschange(in nsiwebprogress awebprogress, in nsirequest arequest, in long long acurselfprogress, in long long amaxselfprogress, in long long acurtotalprogress, in long long amaxtotalprogress, in nsidownload adownload); void onsecuritychange(in nsiwebprogress awebprogress, 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 nsiwebprogresslistener.
... uriloader/base/nsiwebprogresslistener2.idlscriptable please add a summary to this article.
... last changed in gecko 1.9 (firefox 3) inherits from: nsiwebprogresslistener method overview void onprogresschange64(in nsiwebprogress awebprogress, in nsirequest arequest, in long long acurselfprogress, in long long amaxselfprogress, in long long acurtotalprogress, in long long amaxtotalprogress); boolean onrefreshattempted(in nsiwebprogress awebprogress, in nsiuri arefreshuri, in long amillis, in boolean asameuri); methods onprogresschange64() notification that the progress has changed for one of the requests associated with awebprogress.
...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 nsiwebprogresslistener 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/nsitaskbarprogress.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 setprogressstate(in nstaskbarprogressstate state, in unsigned long long currentvalue optional, in unsigned long long maxvalue optional); constants constant value description state_no_progress 0 stop displaying progress on the taskbar button.
... 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="myprogress"/> <button label="example" onmouseover="setloading(true)" onmouseout="setloading(false)"/> function setloading(state){ document.getelementbyid('myprogress').mode = (state) ?
...And 6 more matches
nsIDOMProgressEvent
dom/interfaces/events/nsidomprogressevent.idlscriptable this interface represents the events sent with progress information while uploading data using the xmlhttprequest object.
... 1.0 66 introduced gecko 1.9.1 deprecated gecko 22 inherits from: nsidomevent last changed in gecko 1.9.1 (firefox 3.5 / thunderbird 3.0 / seamonkey 2.0) the nsidomprogressevent is used in the media elements (<video> and <audio>) to inform interested code of the progress of the media download.
... this implementation is a placeholder until the specification is complete, and is compatible with the webkit progressevent.
...And 6 more matches
HTMLProgressElement - Web APIs
the htmlprogresselement interface provides special properties and methods (beyond the regular htmlelement interface it also has available to it by inheritance) for manipulating the layout and presentation of <progress> elements.
...aco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y2="25" stroke="#d4dde4"/><line x1="509" y1="25" x2="509" y2="90" stroke="#d4dde4"/><line x1="509" y1="90" x2="492" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmlprogresselement" target="_top"><rect x="301" y="65" width="190" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlprogresselement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties inherit...
... htmlprogresselement.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/nsiprogresseventsink.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 mozistorageprogresshandler interface lets storage consumers receive callbacks during the execution of sqlite requests.
... storage/public/mozistorageprogresshandler.idlscriptable please add a summary to this article.
... last changed in gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) inherits from: nsisupports method overview boolean onprogress(in mozistorageconnection aconnection); methods onprogress() the onprogress() method is called periodically while an sqlite operation is ongoing.
...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 onprogress 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 determinedprogressmeter is used in cases where you know how long an operation will take.
... an undeterminedprogressmeter can be used when you don't and will typically be drawn as a spinning barber pole.
... determined the progress meter uses its value attribute to determine the amount of the bar that is filled in.
... undetermined the progressmeter is indeterminate.
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.onprogress 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.onprogress = function; where instanceoffilerequest is a filerequest object and function is the javascript function to execute.
... example // assuming 'request' which is a filerequest object request.onprogress = function (status) { var progress = document.queryselector('progress'); progress.value = status.loaded; progress.max = status.total; } specification not part of any current specification.
HTMLProgressElement.labels - Web APIs
the htmlprogresselement.labels read-only property returns a nodelist of the <label> elements associated with the <progress> element.
... syntax var labelelements = progress.labels; return value a nodelist containing the <label> elements associated with the <progress> element.
... 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.onprogress = funcref; parameters funcref a function to call when progress events occur.
... example var xdr = new xdomainrequest(); xdr.open("post", "http://example.com/api/method"); xdr.onprogress = function(){ //handle partial response with xdr.responsetext } xdr.onload = function(){ //handle response with xdr.responsetext } xdr.send("param1=value1&param2=value2"); specification not part of any specification.
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 onprogress 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.onprogress is the function called periodically with information when an xmlhttprequest before success completely.
... syntax xmlhttprequest.onprogress = callback; values callback is the function to be called periodically before the request is completed.
... xmlhttprequest.onprogress = function (event) { event.loaded; event.total; }; example var xmlhttp = new xmlhttprequest(), method = 'get', url = 'https://developer.mozilla.org/'; xmlhttp.open(method, url, true); xmlhttp.onprogress = 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 addtabsprogresslistener( listener ) return type: no return value add a progress listener to the browser which will monitor loaded documents in all tabs in the tabbed browser.
... the progress listener should be based on the nsiwebprogresslistener interface with an additional "browser" argument as the first argument of every method, which is the browser (not <tabbrowser> = gbrowser) where the event occurred.
removeTabsProgressListener - Archive of obsolete content
« xul reference home removetabsprogresslistener( listener ) return type: no return value removes a progress listener to the browser which has been monitoring all tabs.
... the progress listener should implement the nsiwebprogresslistener interface.
addProgressListener - Archive of obsolete content
« xul reference home addprogresslistener( listener ) return type: no return value add a progress listener to the browser which will monitor loaded documents.
... the progress listener should implement the nsiwebprogresslistener interface.
Progressive web apps - MDN Web Docs Glossary: Definitions of Web-related terms
progressive web apps is a term used to describe the modern state of web app development.
... learn more the app center on mdn progressive web apps on google developers ...
ProgressEvent.total - Web APIs
the progressevent.total read-only property is an integer representing the total amount of work that the underlying process is in the progress of performing.
... syntax value = progressevent.total specifications specification status comment xmlhttprequestthe definition of 'progressevent.lengthcomputable' in that specification.
How to make PWAs re-engageable using Notifications and Push - Progressive web apps (PWAs)
previous overview: progressive next having the ability to cache the contents of an app to work offline is a great feature.
... previous overview: progressive next ...
progressmeter.max - Archive of obsolete content
« xul reference home max type: integer the maximum value that progressmeter may have.
progressmeter.value - Archive of obsolete content
« xul reference home value type: integer an integer ranging from 0 to the maximum value that indicates the progress.
removeProgressListener - Archive of obsolete content
« xul reference home removeprogresslistener( listener ) return type: no return value remove a nsiwebprogresslistener from the browser.
webProgress - Archive of obsolete content
« xul reference webprogress type: nsiwebprogress this read-only property contains an nsiwebprogress object which is used to monitor the progress of a document loading.
progressmeter.max - Archive of obsolete content
« xul reference home max type: integer the maximum value that the progressmeter may reach.
::-moz-tree-progressmeter
activated when the type attribute is set to progressmeter.
NSS Tools Man Pages - work in progress
certutil certutil pk12util pk12util modutil modutil crlutil crlutil cmsutil cmsutil vfychain vfychain vfyserv vfyserv ssltap ssltap this is still a work in progress and in early stages.
Add to Home screen - Progressive web apps (PWAs)
a2hs is thought to be part of the progressive web app philosophy — giving web apps the same user experience advantages as native apps so they can compete in today's ecosystem wars.
Installing and uninstalling web apps - Progressive web apps (PWAs)
the option to install a web application is part of the progressive web app philosophy—giving web apps the same user experience advantages as native apps so they can be competitive.
PWA developer guide - Progressive web apps (PWAs)
in the articles listed here, you'll find guides about every aspect of development specific to the greation of progressive web applications (pwas).
Media - Progressive web apps (PWAs)
place your mouse over the items in this list to see the actual pointer shapes in your browser: selector selects pointer indicating a link wait indicating that the program cannot accept input progress indicating that the program is working, but can still accept input default the default (usually an arrow) an outline property creates an outline that is often used to indicate keyboard focus.
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
WebAPIIndex
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 addtabsprogresslistener() method: gbrowser.addtabsprogresslistener(myprogresslistener); myprogresslistener is an object that implements the callbacks used to provide notifications of progress events.
... removing a listener to remove a previously installed progress listener, call removetabsprogresslistener(): gbrowser.removetabsprogresslistener(myprogresslistener); implementing a listener the listener object itself has five methods it can implement to handle various events: onlocationchange called when the uri of the document displayed in the tab changes.
...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
MozillaTechXPCOMIndex
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 mozistorageprogresshandler interfaces, storage, xpcom, xpcom api reference the mozistorageprogresshandler 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 nsidownloadprogresslistener alistener); void canceldownload(in unsigned long aid); void cleanup(); void endbatchupdate(); obsolete since gecko 1.9.1 void flush(); obsolete since gecko 1.8 nsidownload getdownload(in unsigned long aid); void onclose(); obsolete since gecko 1.9.1 void open(in nsidomwindow aparent, in nsidownload adownload); obsolete since...
... gecko 1.9.1 void openprogressdialogfor(in nsidownload adownload, in nsidomwindow aparent, in boolean acanceldownloadonclose); obsolete since gecko 1.9.1 void pausedownload(in unsigned long aid); void removedownload(in unsigned long aid); void removedownloadsbytimeframe(in long long abegintime, in long long aendtime); void removelistener(in nsidownloadprogresslistener alistener); 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 nsidownloadprogresslistener 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 showprogress() - 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 nsiwebprogressimplementation here } b.addprogresslistener(progresslistener); where b is the browser or tabbrowser you want to listen to events for.
... there are code snippets available that give more detail on using web progress listeners.
...And 10 more matches
Intercepting Page Loads - Archive of obsolete content
webprogresslisteners when used in the chrome, this is a more sophisticated way of intercepting and modifying the various stages in page loads.
... but of course, there's always a price to pay: web progress listeners in the chrome are attached to specific instances of the browser element.
...here's a code sample that keeps track of your progress listeners for all tabs: init : function() { gbrowser.browsers.foreach(function (browser) { this._toggleprogresslistener(browser.webprogress, true); }, this); gbrowser.tabcontainer.addeventlistener("tabopen", this, false); gbrowser.tabcontainer.addeventlistener("tabclose", this, false); }, uninit : function() { gbrowser.browsers.foreach(function (browser) { this ._toggleprogresslistener(browser.webprogress, false); }, this); gbrowser.tabcontainer.removeeventlistener("tabopen", this, false); gbrowser.tabcontainer.removeeventlistener("tabclose", this, false); }, handleevent : function(aevent...
...And 10 more matches
Index - Archive of obsolete content
ArchiveMozillaXULIndex
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 onprogress the onprogress 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, webprogress methods addprogresslistener, addtab, addtabsprogresslistener,appendgroup, getbrowseratindex, getbrowserindexfordocument, getbrowserfordocument, getbrowserfortab, geticon, getnotificationbox, gettabforbrowser, gettabmodalpromptbox, goback, gobackgroup, goforward, goforwardgroup, gohome, gotoindex, loadgroup, loadonetab, loadtabs, loaduri, loaduriwithflags, movetabto, pintab, reload, reloadalltab...
...s, reloadtab, reloadwithflags, removealltabsbut, removecurrenttab, removeprogresslistener, removetab, removetabsprogresslistener,replacegroup, selecttabatindex, seticon, showonlythesetabs, stop, unpintab attributes autocompleteenabled type: boolean set to true to enable autocomplete of fields.
... webprogress type: nsiwebprogress this read-only property contains an nsiwebprogress 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 hasprogress.
... 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 = { onprogresschange: function(awebprogress, arequest, acurselfprogress, amaxselfprogress, acurtotalprogress, amaxtotalprogress) { var percentcomplete = math.round((acurtotalprogress / amaxtotalprogress) * 100); progresselement.textcontent = percentcomplete +"%"; }, onstatechange: function(awebprogress, 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); mozistorageprogresshandler removeprogresshandler(); void rollbacktransaction(); void setgrowthincrement(in print32 aincrement, in autf8string adatabasename); mozistorageprogresshandler setprogresshandler(in print32 agranularity, in mozistorageprogresshandler ahandler); boolean tableexists(in autf8string atablename); attributes attribute type description ...
... transactioninprogress 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", "myprogress", "chrome,centerscreen", {status: "reading remote data", maxprogress: 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, gprogressmeter; var maxprogress = 100; function onload() { gstatus = document.getelementbyid("status"); gprogressmeter = document.getelementbyid("progressmeter"); if("arguments" in window && windo...
...And 5 more matches
Embedding Tips
implement the nsiwebprogresslistener interface and register it with the appropriate web browser object via the nsiwebbrowser::addwebbrowserlistener() method.
...register your own nsiwebprogresslistener 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
ynchistorymozicoloranalyzermozijssubscriptloadermozipersonaldictionarymoziplaceinfomoziplacesautocompletemoziregistrymozirepresentativecolorcallbackmozispellcheckingenginemozistorageaggregatefunctionmozistorageasyncstatementmozistoragebindingparamsmozistoragebindingparamsarraymozistoragecompletioncallbackmozistorageconnectionmozistorageerrormozistoragefunctionmozistoragependingstatementmozistorageprogresshandlermozistorageresultsetmozistoragerowmozistorageservicemozistoragestatementmozistoragestatementcallbackmozistoragestatementparamsmozistoragestatementrowmozistoragestatementwrappermozistoragevacuumparticipantmozistoragevaluearraymozitxttohtmlconvmozithirdpartyutilmozivisitinfomozivisitinfocallbackmozivisitstatuscallbacknsiabcardnsiaboutmodulensiabstractworkernsiaccelerometerupdatensiaccessnoden...
...onsnsidomglobalpropertyinitializernsidomhtmlaudioelementnsidomhtmlformelementnsidomhtmlmediaelementnsidomhtmlsourceelementnsidomhtmltimerangesnsidomjswindownsidommousescrolleventnsidommoznetworkstatsnsidommoznetworkstatsdatansidommoznetworkstatsmanagernsidommoztoucheventnsidomnshtmldocumentnsidomnavigatordesktopnotificationnsidomnodensidomofflineresourcelistnsidomorientationeventnsidomparsernsidomprogresseventnsidomserializernsidomsimplegestureeventnsidomstoragensidomstorage2nsidomstorageeventobsoletensidomstorageitemnsidomstoragelistnsidomstoragemanagernsidomstoragewindownsidomuserdatahandlernsidomwindownsidomwindow2nsidomwindowinternalnsidomwindowutilsnsidomxpathevaluatornsidomxpathexceptionnsidomxpathexpressionnsidomxpathresultnsidomxulcontrolelementnsidomxulelementnsidomxullabeledcontrolelemen...
...devicemotionlistenernsidialogcreatornsidialogparamblocknsidictionarynsidirindexnsidirindexlistenernsidirindexparsernsidirectoryenumeratornsidirectoryiteratornsidirectoryservicensidirectoryserviceprovidernsidirectoryserviceprovider2nsidiskcachestreaminternalnsidispatchsupportnsidocshellnsidocumentloadernsidownloadnsidownloadhistorynsidownloadmanagernsidownloadmanageruinsidownloadobservernsidownloadprogresslistenernsidownloadernsidragdrophandlernsidragservicensidragsessionnsidroppedlinkhandlernsidroppedlinkitemnsidynamiccontainernsieditornsieditorboxobjectnsieditordocshellnsieditorimesupportnsieditorloggingnsieditormailsupportnsieditorobservernsieditorspellchecknsieffectivetldservicensienumeratornsienvironmentnsierrorservicensieventlistenerinfonsieventlistenerservicensieventsourcensieventtargetnsiex...
...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 ondownloadprogress(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 getprogressmode(in long row, in nsitreecolumn col); astring getrowproperties(in long index, in nsisupportsarray properties obsolete since gecko 22); boolean hasnextsibling(in long rowindex, in long afterindex); boolean iscontainer(in long index); boolean iscontainerempty(in long index); boolean iscontaineropen(in long index); boolean iseditable(in long ro...
... 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 ...
... getprogressmode() 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); nsitaskbarprogress gettaskbarprogress(in nsidocshell shell); nsitaskbarwindowpreview gettaskbarwindowpreview(in nsidocshell shell); void setgroupidforwindow(in nsidomwindow aparent, in astring aidentifier); attributes attribute type description available boolean returns true if the operating system supports windows 7 or later taskbar features; you can use this instead of in-place operating system 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, {}); gettaskbarprogress() 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, webprogress methods addprogresslistener, goback, goforward, gohome, gotoindex, loaduri, loaduriwithflags, reload, reloadwithflags, removeprogresslistener, stop, swapdocshells examples <!-- shows mozilla homepage inside a groupbox --> <groupbox flex="1"> <caption label="mozilla homepage"/> <browser type="content" src="http://www.mozilla.org" flex="1"/> </groupbox> attributes autocomple...
... webprogress type: nsiwebprogress this read-only property contains an nsiwebprogress 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 addprogresslistener( 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 (webprogress) eventually, this service will be replaced by thewebprogress service...
... contract-id: ns_document_loader_service_contractid implemented interfaces: nsiwebprogress nsidocumentloader related interfaces: nsiwebprogresslistener public components nswebbrowser the nswebbrowser is the main embedding component which gecko exposes.
...contract-id: ns_webbrowser_contractid implemented interfaces: nsiwebbrowser nsiwebnavigation nsiwebbrowsersetup nsiwebbrowserpersist nsiwebbrowserfind nsiwebbrowserprint nsiwebbrowserfocus nsibasewindow requestor interfaces: nsidomwindow nsidomdocument nsiwebprogress nsiclipboardcommands nsiprompt related interfaces: nsiprompt nsiwebbrowserchrome nsiwebbrowsersitewindow nsiwebprogresslistener nsicontextmenulistener nsiprintoptions overview: most of gecko's functionality is exposed through the nswebbrowser component.
...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 aprogress, in unsigned long long aprogressmax); methods ontransportstatus() transport status notification.
... void ontransportstatus( in nsitransport atransport, in nsresult astatus, in unsigned long long aprogress, in unsigned long long aprogressmax ); parameters atransport the transport sending this status notification.
...aprogress 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, onprogress, 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 nsiwebprogresslistener 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 nsiprogresseventsink 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 nsiwebprogresslistener 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 nsiwebprogress awebprogress, in nsirequest arequest, in nsiuri auri); obsolete since gecko 1.8 void fireonstatuschange(in nsiwebprogress awebprogress, 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 nsiwebprogress awebprogress, in nsirequest arequest, in nsiuri auri ); parameters awebprogress arequest auri fireonstatuschange() obsolete since gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) void fireonstatuschange( in nsiwebprogress awebprogress, in nsirequest arequest, in nsresult astatus, in wstring amessage ); parameters ...
... awebprogress 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 onprogress(in nsixmlhttprequest request, in unsigned long position, in unsigned long totalsize); methods oncheckcomplete() called when the update check is completed.
... onprogress() called every time there is a progress notification loading the update service file.
... void onprogress( in nsixmlhttprequest request, in unsigned long position, in unsigned long totalsize ); parameters request the nsixmlhttprequest object handling the update check.
XPCOM Interface Reference by grouping
swindow nsidomnode nsidomnshtmldocument nsidomstorageitem nsidomstoragemanager nsidomwindow nsidomwindow2 nsidomwindowinternal nsidomwindowutils nsidynamiccontainer nsieditor event nsidomevent nsidomeventgroup nsidomeventlistener nsidomeventtarget nsidommousescrollevent nsidommoztouchevent nsidomorientationevent nsidomprogressevent nsidomsimplegestureevent nsidragdrophandler nsidragservice nsidragsession html nsiaccessibilityservice nsiaccessiblecoordinatetype nsiaccessibledocument nsiaccessibleeditabletext nsiaccessibleevent nsiaccessiblehyperlink nsiaccessiblehypertext nsiaccessibleimage nsiaccessibleprovider nsiaccessibleretrieval nsiaccessiblerole...
...riptableunicodeconverter nsiscripterror nsiscripterror2 stylesheet nsistylesheetservice url nsiuri nsiurl util nsidomserializer nsidomxpathevaluator nsidomxpathexception nsidomxpathexpression nsidomxpathresult xslt nsixsltexception nsixsltprocessor download nsidownload nsidownloadmanager nsidownloadprogresslistener element internal nsiworker nsiworkerglobalscope nsiworkermessageevent nsiworkermessageport nsiworkerscope tree nsitreeboxobject nsitreecolumn nsitreecolumns nsitreecontentview nsitreeselection nsitreeview xform nsixformsmodelelement nsixformsnsinstanceelement nsixformsnsmodelelement xmlhttprequest ...
... nsijetpackservice offlinestorage nsiapplicationcache nsiapplicationcachechannel nsiapplicationcachecontainer nsiapplicationcachenamespace nsiapplicationcacheservice places nsiannotationobserver rss feed nsifeed nsifeedcontainer nsifeedelementbase nsifeedentry nsifeedgenerator nsifeedperson nsifeedprocessor nsifeedprogresslistener nsifeedresult nsifeedresultlistener nsifeedtextconstruct script mozijssubscriptloader storage mozistoragevacuumparticipant util nsieffectivetldservice worker nsiabstractworker data nsiarray nsicategorymanager nsicollection nsidictionary nsimutablearray nsisimpleenumerator nsisupportschar ns...
... nsipipe nsitraceablechannel nsitransport nsitransporteventsink nsitransportsecurityinfo timer nsitimer nsitimercallback ui windows nsitaskbarpreview nsitaskbarpreviewbutton nsitaskbarpreviewcontroller nsitaskbarprogress nsitaskbartabpreview nsitaskbarwindowpreview nsiwintaskbar nsialertsservice nsiwebprogress nsiwebprogresslistener nsiwebprogresslistener2 update nsiupdate nsiupdatechecker nsiupdatechecklistener nsiupdateitem nsiupdatemanager nsiupdatepatch ...
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.onprogress event handler.
... var progress = document.queryselector('progress'); var myfile = myfilehandle.open('readonly'); // let's read a 1gb file var action = myfile.readasarraybuffer(1000000000); action.onprogress = 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
WebCSScursor
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
WebCSSgradient
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.
... nsidownloadprogresslistener 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 addprogresslistener?
... an example of this is this: // associate the progress listener for a "browser" to a listener object browserobject.addprogresslistener( listobj, components.interfaces.nsiwebprogress.notify_state_window ); // remember to define the object, something like this: listobj = new object(); listobj.wpl = components.interfaces.nsiwebprogresslistener; 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(aprogress, 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(aprogress, arequest, auri) { // do whatever you want to do return 0; } // for definitions of the remaining functions see xulplanet.com listobj.onprogresschange = 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
nsiwebprogresslistener this api will work in the chrome process.
... there is a shim that gives you access to the domwindow property of the nsiwebprogress object passed into onstatechange.
... alternatively, you can use nsiwebprogresslistener 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.
... transactioninprogress 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 inprogress; prstatus status; } prcalloncetype; fields the structure has these fields: initialized if not zero, the initialization process has been completed.
... inprogress if not zero, the initialization process is currently being executed.
... calling threads that observe this status block until inprogress 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.
... mozistorageprogresshandler 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: nsiprogresseventsink, 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 nsifeedprogresslistener nsisupports interwiki link ...
nsIWebBrowser
the chrome object may optionally implement nsiwebprogresslistener 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 nsiwebprogresslistener 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 nsiwebprogresslistener ...
nsIXMLHttpRequestEventTarget
onprogress nsidomeventlistener a javascript function object that gets invoked zero or more times, after the loadstart event, but before any abort, error, or load events occur.
... handling the events when the handler functions for these events are called, they receive as a parameter a progressevent, which implements the nsidomprogressevent interface.
... see also using xmlhttprequest xmlhttprequest nsixmlhttprequest nsidomprogressevent ...
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.onprogress a handler for the progress event.
... progress fired periodically as data is read.
... also available via the onprogress property.
XDomainRequest - Web APIs
event handlers xdomainrequest.onprogress 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.onprogress = 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.onprogress 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
WebCSS@mediascan
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
WebHTMLAttributesmax
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
WebHTTPIndex
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.addprogresslistener(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...
Monitoring downloads - Archive of obsolete content
this is part of the nsidownloadprogresslistener interface.
... see also storage, nsidownloadmanager, nsidownload, nsidownloadprogresslistener ...
The Download Manager schema - Archive of obsolete content
the download manager uses an sqlite table to keep track of downloads in progress as well as queued and past downloads.
... see also nsidownloadmanager nsidownloadmanagerui nsidownloadprogresslistener ...
Methods - Archive of obsolete content
« xul reference home acceptdialog additemtoselection addpane addprogresslistener addsession addtab addtabsprogresslistener advance advanceselectedtab appendcustomtoolbar appendgroup appenditem appendnotification blur cancel canceldialog centerwindowonscreen checkadjacentelement clearresults clearselection click close collapsetoolbar contains decrease decreasepage docommand ensureelementisvisible ensureindexisvisible ensureselectedelementisvisible expandtoolbar extra1 extra2 focus getbrowseratindex getbrowserfordocument getbrowserfortab getbrowserindexfordocument getbutton getdefaultsession geteditor getelementsbyattribute getelementsbyattributens getformattedstring gethtmleditor getindexoffirstvis...
... moveto movetoalertposition onsearchcomplete ontextentered ontextreverted openpopup openpopupatscreen opensubdialog openwindow preferenceforelement reload reloadalltabs reloadtab reloadwithflags removeallitems removeallnotifications removealltabsbut removecurrentnotification removecurrenttab removeitemat removeitemfromselection removenotification removeprogresslistener removesession removetab removetabsprogresslistener removetransientnotifications replacegroup reset rewind scrollbyindex scrollbypixels scrolltoindex select selectall selectitem selectitemrange selecttabatindex setselectionrange showpane showpopup sizeto startediting stop stopediting swapdocshells syncsessions timedselect toggleitemselect...
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
ArchiveWebCSS
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; } }, // nsiprogresseventsink (not implementing will cause annoying exceptions) onprogress : function (arequest, acontext, aprogress, aprogressmax) { }, onstatus : function (arequest, acontext, astatus, astatusarg) { }, // nsihttpeventsink (not implementing will cause annoying exceptions) onredirect : function (aoldchannel, anewchannel) { }, // we are faking an xpcom interface, so we need to implement qi ...
... queryinterface : function(aiid) { if (aiid.equals(components.interfaces.nsisupports) || aiid.equals(components.interfaces.nsiinterfacerequestor) || aiid.equals(components.interfaces.nsichanneleventsink) || aiid.equals(components.interfaces.nsiprogresseventsink) || 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.
... maxprogress 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,) _senddownloadprogressevent: function(anewapp, aprogress) _getpackage: function(arequestchannel, aid, aoldapp, anewapp) _computefilehash: function(afilepath) _sendappliedevent: function(aapp) _openandreadpackage: function(azipfile, aoldapp, anewapp, aislocalfileinstall,) _openpackage: function(azipfile, aapp, aislocalfileinstall) _opensignedpackage: function(ainstallorigin, amanifesturl, azipfile, acertdb) _read...
...id: function(alocalid) getapplocalidbymanifesturl: function(amanifesturl) getcoreappsbasepath: function() getwebappsbasepath: function() _islaunchable: function(aapp) _notifycategoryandobservers: function(subject, topic, data, msg) registerbrowserelementparentforapp: function(amsg, amn) receiveappmessage: function(appid, message) _clearprivatedata: function(appid, browseronly, msg) _sendprogressevent: function() updatestatechanged: function appobs_update(aupdate, astate) applicationcacheavailable: function appobs_cacheavail(aapplicationcache) ...
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.
Accessibility API Implementation Details
this article (from 2007) reviews the progress and technology as it has developed.
...it is much 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 webprogresslistener notifications for restoring a page presentation.
...finishrestore() finish firing webprogresslistener 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.
... mozistorageprogresshandler 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
WebAPIDocument
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.onprogress 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
WebAPIEvent
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.onprogress 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
WebAPIWindow
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.nsiwebprogresslistener.state_is_secure) == ci.nsiwebprogresslistener.state_is_secure) { dump("secure connection\n"); } else if ((secinfo.securitystate & ci.nsiwebprogresslistener.state_is_insecure) == ci.nsiwebprogresslistener.state_is_insecure) { dump("insecure connection\n"); } else if ((secinfo.securitystate & ci.nsiwebprogresslistener.state_is_broken)...
... == ci.nsiwebprogresslistener.state_is_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 onprogress 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
WebAPI
labelelement htmllegendelement htmllinkelement htmlmapelement htmlmarqueeelement htmlmediaelement htmlmenuelement htmlmenuitemelement htmlmetaelement htmlmeterelement htmlmodelement htmlolistelement htmlobjectelement htmloptgroupelement htmloptionelement htmloptionscollection htmlorforeignelement htmloutputelement htmlparagraphelement htmlparamelement htmlpictureelement htmlpreelement htmlprogresselement htmlquoteelement htmlscriptelement htmlselectelement htmlshadowelement htmlslotelement htmlsourceelement htmlspanelement htmlstyleelement htmltablecaptionelement htmltablecellelement htmltablecolelement htmltableelement htmltablerowelement htmltablesectionelement htmltemplateelement htmltextareaelement htmltimeelement htmltitleelement htmltrackelement htmlulistelement htmlunknownelement ...
...tasktiming performancemark performancemeasure performancenavigation performancenavigationtiming performanceobserver performanceobserverentrylist performancepainttiming performanceresourcetiming performanceservertiming performancetiming periodicwave permissionstatus permissions photocapabilities plugin pluginarray point pointerevent popstateevent positionoptions processinginstruction progressevent promiserejectionevent publickeycredential publickeycredentialcreationoptions publickeycredentialrequestoptions pushevent pushmanager pushmessagedata pushregistrationmanager pushsubscription r rtcansweroptions rtccertificate rtcconfiguration rtcdtmfsender rtcdtmftonechangeevent rtcdatachannel rtcdatachannelevent rtcdtlstransport rtcerror rtcerrorevent rtcicecandidate rtciceca...
Using the aria-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-scrollbar - CSS: Cascading Style Sheets
::-webkit-scrollbar-track — the track (progress bar) of the scrollbar.
... ::-webkit-scrollbar-track-piece — the part of the track (progress bar) not covered by the handle.
WebKit 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.
<video>: The Video Embed element - HTML: Hypertext Markup Language
WebHTMLElementvideo
progress fired periodically as the browser loads a resource.
...in addition to providing controllability, these events let you monitor the progress of both download and playback of the media, as well as the playback state and position.
Link prefetching FAQ - HTTP
in the current implementation (mozilla 1.2), idle time is determined using the nsiwebprogresslistener api.
... we attach a listener to the toplevel nsiwebprogress object ("@mozilla.org/docloaderservice;1").
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
WebSVGIndex
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...
Enhanced Extension Installation - Archive of obsolete content
the install operation finalization process loops continuously installing, upgrading and uninstalling items at progressively lower locations until the size of the pending operations list is finally zero.
Chapter 2: Technologies used in developing extensions - Archive of obsolete content
there are three css specifications (level 1 through level 3), with progressively powerful features.
Appendix F: Monitoring DOM changes - Archive of obsolete content
these requests can be tracked from chrome code using a variety of methods, including web progress listeners, http observers, and content policies.
The Essentials of an Extension - Archive of obsolete content
toolbars, menu bars, progress bars, and window title bars are all examples of elements that are typically part of the chrome.
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.
cached - Archive of obsolete content
related events checking noupdate downloading progress cached updateready obsolete error ...
checking - Archive of obsolete content
related events checking noupdate downloading progress cached updateready obsolete error ...
downloading - Archive of obsolete content
related events checking noupdate progress cached updateready obsolete error ...
error - Archive of obsolete content
related events checking noupdate downloading progress cached updateready obsolete error ...
noupdate - Archive of obsolete content
related events checking noupdate downloading progress cached updateready obsolete error ...
obsolete - Archive of obsolete content
related events checking noupdate downloading progress cached updateready obsolete error ...
updateready - Archive of obsolete content
related events checking noupdate downloading progress cached updateready obsolete error ...
Events - Archive of obsolete content
archived event pages domsubtreemodifiedmozaudioavailablemozbeforeresizemozorientationcachedchargingchangechargingtimechangecheckingdischargingtimechangedownloadingerrorlevelchangenoupdateobsoleteprogressupdateready ...
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...
Download Manager preferences - Archive of obsolete content
browser.download.manager.quitbehavior indicates what should happen to in-progress downloads if the application is quit while they're ongoing.
Block and Line Layout Cheat Sheet - Archive of obsolete content
it's a work-in-progress, with questions in red highlight.
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".
Mozilla Application Framework - Archive of obsolete content
bugzilla the mozilla bug tracking webtool to help you track progress in fixing bugs and implementing features that affect your applications.
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.
Rsyncing the CVS Repository - Archive of obsolete content
optionally, the --progress option will show the progress for each file, and a percentage of the total files that are transferred.
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.
XBL 1.0 Reference - Archive of obsolete content
the documentation process is still in progress: please keep it in your mind while using the provided information.
max - Archive of obsolete content
ArchiveMozillaXULAttributemax
see also progressmeter.ma ...
mode - Archive of obsolete content
ArchiveMozillaXULAttributemode
see progressmeter.mode toolbar.mode treecell.mode ...
treecol.type - Archive of obsolete content
progressmeter the content of the columns are a progress meters.
value - Archive of obsolete content
see also datepicker.value label.value progressmeter.value textbox.value textnode.value timepicker.value where.value ...
ValueChange - Archive of obsolete content
the valuechange event is executed when the value of an element, <progress> for example, has changed.
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 xulprogressmeter 1012 xulscale 1013 xulstatusbar 1014 xulradiobutton 1015 xulradiogroup 1016 xultab 1017 xultabbox 1018 xultabs 1019 xultext 101a ...
Property - Archive of obsolete content
thscroll spinbuttons src state statusbar statustext stringbundle strings style subject suppressonselect tabcontainer tabindex tabs tabscrolling tabpanels tag textlength textvalue timeout title toolbarname toolbarset tooltip tooltiptext top treeboxobject type uri useraction value valuenumber view webbrowserefind webnavigation webprogress width wizardpages wraparound year yearleadingzero related dom element properties dom:element.attributes dom:element.baseuri dom:element.childelementcount dom:element.childnodes dom:element.children dom:element.clientheight dom:element.clientleft dom:element.clienttop dom:element.clientwidth dom:element.clonenode dom:element.firstchild dom:element.firstelementch...
The Joy of XUL - Archive of obsolete content
by using xbl, developers can easily build custom user interface widgets such as progress meters, fancy pop-up menus, and even toolbars and search forms.
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.
Creating an Installer - Archive of obsolete content
a progress bar is displayed to the user during this process.
List Controls - Archive of obsolete content
in the next section, we'll learn about creating progress meters.
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.
Skinning XUL Files by Hand - Archive of obsolete content
the syntax for creating all this information with text -- added to the distributed nature and the sheer volume of text required to define a single chrome -- can sometimes make the progress seem slow.
Stacks and Decks - Archive of obsolete content
for example, a progress bar might be created using a bar and a label overlaid on top of it.
Tabboxes - Archive of obsolete content
the progress bar and the buttons can stay on the main dialog, outside of the tabs.
Tree View Details - Archive of obsolete content
{ item[2] = true; var label = this.visibledata[idx][0]; var toinsert = this.childdata[label]; for (var i = 0; i < toinsert.length; i++) { this.visibledata.splice(idx + i + 1, 0, [toinsert[i], false]); } this.treebox.rowcountchanged(idx + 1, toinsert.length); } this.treebox.invalidaterow(idx); }, getimagesrc: function(idx, column) {}, getprogressmode : function(idx,column) {}, getcellvalue: function(idx, column) {}, cycleheader: function(col, elem) {}, selectionchanged: function() {}, cyclecell: function(idx, column) {}, performaction: function(action) {}, performactiononcell: function(action, index, column) {}, getrowproperties: function(idx, prop) {}, getcellproperties: function(idx, column, prop) {}, getcolumnproperti...
Trees - Archive of obsolete content
ArchiveMozillaXULTutorialTrees
(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...
Using the Editor from XUL - Archive of obsolete content
it thus gets callbacks for the start, progress, and end of the document load.
XULBrowserWindow - Archive of obsolete content
in order to do so it implements the following interfaces: nsisupports nsixulbrowserwindow nsiwebprogresslistener nsiwebprogresslistener2 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 ...
The Implementation of the Application Object Model - Archive of obsolete content
xul has language constructs for all of the typical dialog controls, as well as for widgets like toolbars, trees, progress bars, and menus.
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.
treecol - Archive of obsolete content
progressmeter the content of the columns are a progress meters.
Gecko Compatibility Handbook - Archive of obsolete content
as time progresses and the older browsers drop in market share, web page authors can transition to standards-based layout by using the appropriate doctype.
Mozilla release FAQ - Archive of obsolete content
also, progressive display of the webpage would be completely gone with this idea.
Mozilla.dev.apps.firefox-2006-10-06 - Archive of obsolete content
a wiki and irc channel have been created to track their progress.
2006-10-06 - Archive of obsolete content
a wiki and irc channel have been created to track their progress.
2006-11-17 - Archive of obsolete content
how to get review for work-in-progress patch?
Extentsions FAQ - Archive of obsolete content
can "partial" data be read from the cache while the request is still in progress?how difficult is to write a firefox extensions that does intercetp, process and redirect http request?
NPP_NewStream - Archive of obsolete content
the plug-in can process the data progressively as it arrives from the network or file system.
NPP_Write - Archive of obsolete content
can be used to check stream progress or by range requests from npn_requestread.
Common Firefox theme issues and solutions - Archive of obsolete content
this is document is a work in progress so feedback and/or suggestions is appreciated.
Using IO Timeout And Interrupt On NT - Archive of obsolete content
these two errors are generated by the nspr layer, so the os is oblivious of what is going on and the overlapped io request is still in progress.
::-ms-fill-upper - Archive of obsolete content
see also ::-ms-fill-lower ::-ms-track ::-ms-thumb ::-moz-range-progress css-tricks: styling cross-browser compatible range inputs with css quirksmode: styling and scripting sliders ...
XForms Custom Controls - Archive of obsolete content
implementation status the framework we use in the mozilla xforms processor is very much a "work in progress".
Implementation Status - Archive of obsolete content
the sections are marked with their current status: supported, partial support, in progress, and not currently supported.
Choosing Standards Compliance Over Proprietary Practices - Archive of obsolete content
lastly, by following a series of standards, organizations can more easily measure progress, performance, and results across the organization.
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.
Decryption - MDN Web Docs Glossary: Definitions of Web-related terms
how hard depends on the security of the cryptographic algorithm chosen and evolves with the progress of cryptanalysis.
Encryption - MDN Web Docs Glossary: Definitions of Web-related terms
how hard depends on the security of the cryptographic algorithm chosen and evolves with the progress of cryptanalysis.
Graceful degradation - MDN Web Docs Glossary: Definitions of Web-related terms
progressive enhancement is related but different — often seen as going in the opposite direction to graceful degredation.
Mobile First - MDN Web Docs Glossary: Definitions of Web-related terms
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.
Modern web apps - MDN Web Docs Glossary: Definitions of Web-related terms
see progressive web apps ...
Time to interactive - MDN Web Docs Glossary: Definitions of Web-related terms
time to interactive (tti) is a non-standardized web performance 'progress' metric defined as the point in time when the last long task finished and was followed by 5 seconds of network and main thread inactivity.
MDN Web Docs Glossary: Definitions of Web-related terms
parse parser pdf perceived performance percent-encoding php pixel placeholder names plaintext png polyfill polymorphism pop3 port prefetch preflight request prerender presto primitive privileged privileged code progressive enhancement progressive web apps promise property property (css) property (javascript) protocol prototype prototype-based programming proxy server pseudo-class pseudo-element pseudocode public-key cryptography python q quality values qu...
HTML: A good basis for accessibility - Learn web development
if you try navigating through this, you'll see that this is pretty easy to navigate: the screen reader reads each header out as you progress through the content, notifying you what a heading is, what is a paragraph, etc.
HTML: A good basis for accessibility - Learn web development
if you try navigating through this, you'll see that this is pretty easy to navigate: the screen reader reads each header out as you progress through the content, notifying you what a heading is, what is a paragraph, etc.
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.
Handling different text directions - 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 now.
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.
What is a web server? - Learn web development
for example, relying on http alone, a server can't remember a password you typed or remember your progress on an incomplete transaction.
HTML forms in legacy browsers - Learn web development
graceful degradation is web developer's best friend graceful degradation and progressive enhancement are development patterns that allow you to build great stuff by supporting a wide range of browsers at the same time.
CSS property compatibility table for form controls - Learn web development
border-radius no[1] no[1] box-shadow no[1] no[1] meters and progress see the <meter> and <progress> elements: property n t note css box model width yes yes height yes yes border partial yes margin yes yes padding yes partial[1] chrome hides the <progress> and <meter> element when the padding property is applied on a tweaked elem...
Sending forms through JavaScript - Learn web development
a form is not always a form with progressive web apps, single page apps, and framework based apps, it's common to use html forms to send data without loading a new document when response data is received.
Styling web forms - Learn web development
<progress> and <meter> again, we'll describe what can be done in terms of styling these elements in advanced form styling.
UI pseudo-classes - Learn web development
elements that are indeterminate include: <input/radio> inputs, when all radio buttons in a same-named group are unchecked <input/checkbox> inputs whose indeterminate property is set to true via javascript <progress> elements that have no value.
Web forms — Working with user data - Learn web development
other form controls next we take a look at all the non-<input> form controls and associated tools, such as <select>, <textarea>, <meter>, and <progress>.
CSS basics - Learn web development
your work-in-progress should look similar to this: css: all about boxes something you'll notice about writing css: a lot of it is about boxes.
JavaScript basics - Learn web development
you may have to start small, and progress gradually.
The web and web standards - Learn web development
this includes using technologies that all the browsers support, delivering better experiences to browsers that can handle them (progressive enhancement), and/or writing code so that it falls back to a simpler but still usable experience in older browsers (graceful degradation).
Tips for authoring fast-loading HTML pages - Learn web development
reduce the number of inline scripts inline scripts can be expensive for page loading since the parser must assume that an inline script could modify the page structure while parsing is in progress.
Use JavaScript within a webpage - Learn web development
for example, if you've implemented a nice javascript progress bar, make sure to supplement it with matching text percentages inside the html.
Introducing asynchronous JavaScript - Learn web development
conclusion in its most basic form, javascript is a synchronous, blocking, single-threaded language, in which only one operation can be in progress at a time.
Cooperative asynchronous JavaScript: Timeouts and intervals - Learn web development
(in other words, when the stack is empty.) you will learn more on this matter as you progress through this article.
Fetching data from the server - Learn web development
if however you are working on a more progressive project and aren't as worried about older browsers, then fetch could be a good choice.
What went wrong? Troubleshooting JavaScript - Learn web development
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.
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.
Ember interactivity: Events, classes and state - Learn web development
you should find that now the text submitted in the <input> is properly reflected in the ui: summary ok, so that's great progress for now.
Deployment and next steps - Learn web development
you can also check the progress of the current and previous jobs from the ci / cd > jobs menu option of your gitlab project.
Dynamic behavior in Svelte: working with variables and props - Learn web development
again, this is good progress — at this point, we can now delete tasks.
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.
Introducing a complete toolchain - Learn web development
it offers a way to "commit" blocks of work as you progress, along with comments such as "x new feature implemented", or "bug z now fixed due to y changes".
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() nsiwebprogresslistener 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.
Application cache implementation overview
when found, channel is open for it (+onprogress event is invoked).
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
MozillaGeckoChromeCSS
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 nsiprogresseventsink and set an interface requester as the notificationcallbacks of the channel that gives out such an event sink (this needs to be done before calling asyncopen).
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.
Following the Android Toasts Tutorial from a JNI Perspective
this article is a work in progress and is based on githubgist :: _ff-addon-tutorial-jniandroidtoast.js this article will follow the android developers :: api guides - toasts tutorial.
Log.jsm
progress is tracked in bugzilla using dependencies of bug 451283.
Using the Source Editor API
obviously a work in progress.
Localization content best practices
when you have to change a key id, adding a progressive number to the existing key should always be used as a last resort.
Localizing with Mozilla Translator
you can save your work in progress and reopen it to continue working by selecting view fuzzy from the edit menu.
Localizing with Pontoon
progress indicator displays your progress on the resource being localized.
Localizing without a specialized tool
repeating the process allows a localizer to create a testable package to see his or her work as they progress to a final version.
QA phase
after you test your localization, you should send it to a remote repository, which will serve as a backup for your work and will let others follow your progress.
Release phase
commit, outgoing, and push you should try to commit your work regularly as you progress through the localization files.
Translation phase
if your locale has an hg repository hosted on the mozilla servers, you can track your localization's current progress by visiting the l10n dashboards.
Mozilla MathML Status
the sections are marked with their current status: supported, in progress, and not currently supported.
Mozilla Development Tools
it is our home-grown web-based tool for watching the progress of the continuous builds that we run on multiple platforms.
Investigating leaks using DMD heap scan mode
the output will look something like this, after a message about loading progress: 0x7f0882fe3230 [fragmentorelement (xhtml) script https://www.example.com] --[[via hash] mlistenermanager]--> 0x7f0899b4e550 [eventlistenermanager] --[mlisteners event=onload listenertype=3 [i]]--> 0x7f0882ff8f80 [callbackobject] --[mincumbentglobal]--> 0x7f0897082c00 [nsglobalwindowinner # 2147483662 inner https://www.example.com] root 0x7f0882fe3230 is a ref counted object ...
Profiling with the Firefox Profiler
as we progress into a more specific part of the tree, you'll notice that the 'running time' decreases.
Preferences
mozilla preference reference a reference guide to all mozilla preferences; currently a work in progress.
Installing JSHydra
converting html, xul, or xbl files into a readable js equivalent is a work in progress, as is accounting for the preprocessing that mozilla files sometimes use.
NSPR Poll Method
the prototype of the poll method is print16 poll_method(prfiledesc *fd, print16 in_flags, print16 *out_flags); the purpose of the poll method is to allow a layer to modify that flags that will ultimately be used in the call to the underlying network transport's select (or equivalent) function, and to indicate that a layer is already able to make progress in the manner suggested by the polling flags.
NSPR Error Handling
pr_in_progress_error the operation is still in progress (probably a nonblocking connect).
PRErrorCode
nspr assumes error numbers starting at -6000 (decimal) and progressing towards zero.
Index
302 nss tools man pages - work in progress certutil certutil 303 nss cryptographic module nss no summary!
JSS
MozillaProjectsNSSJSS
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] ...
New NSS Samples
these new examples are a work in progress.
Python binding for NSS
this allows other python threads to execute during the time a nss/nspr function is progress in another thread.
NSS environment variables
note: this section is a work in progress and is not yet complete.
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...
GCIntegration - SpiderMonkey Redirect 1
this only happens if an incremental gc is in progress.
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.
XUL Accessibility
it is much in progress.
Feed content access API
nsifeedprogresslistener 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
MozillaTechXPCOMGuide
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 copyinprogress = false; function copybufferedstream(instream, outstream) { var copyobserver = { onstartrequest: function(request, context) { copyinprogress = true; }, onstoprequest: function(request, context, statuscode) { copyinprogress = false; // did the copy fail?
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
mozistorageprogresshandler monitor progress during the execution of a statement.
mozIStorageValueArray
mozistorageprogresshandler monitor progress during the execution of a statement.
nsIAccessibleProvider
mbobox 0x00001006 xuldropmarker 0x00001007 xulgroupbox 0x00001008 xulimage 0x00001009 xullink 0x0000100a xullistbox 0x0000100b xullistcell 0x00001026 xullisthead 0x00001024 xullistheader 0x00001025 xullistitem 0x0000100c xulmenubar 0x0000100d xulmenuitem 0x0000100e xulmenupopup 0x0000100f xulmenuseparator 0x00001010 xulpane 0x00001011 xulprogressmeter 0x00001012 xulscale 0x00001013 xulstatusbar 0x00001014 xulradiobutton 0x00001015 xulradiogroup 0x00001016 xultab 0x00001017 the single tab in a dialog or tabbrowser/editor interface.
nsIAsyncStreamCopier
aobservercontext the object to receive notifications with information about the progress of the copy operation.
nsIAutoCompleteSearch
stopsearch() stop all searches that are in progress.
nsIBrowserBoxObject
the browser.xml binding uses this property to gain access to the webnavigation, contentdocument, contentwindow, webbrowserfind, webprogress and sessionhistory properties.
nsICancelable
netwerk/base/public/nsicancelable.idlscriptable this interface provides a means to cancel an operation that is in progress.
nsIDOMOfflineResourceList
onprogress nsidomeventlistener an event listener to be called periodically throughout the download process.
nsIDOMOrientationEvent
void initprogressevent( in domstring eventtypearg, in boolean canbubblearg, in boolean cancelablearg, in double x, in double y, in double z ); parameters eventtypearg the type of event.
nsIDownload
see also nsidownloadmanager nsidownloadprogresslistener nsixpinstallmanagerui ...
nsIMessenger
sendingunsentmsgs boolean indicates if sending messages is in progress.
nsIRequest
load_background 1 << 0 do not deliver status notifications to the nsiprogresseventsink, or keep this load from completing the nsiloadgroup it may belong to.
nsIStringBundleService
typically used to format a message received by a nsiprogresseventsink's onstatus method.
nsISupports proxies
now xpinstall can do its installations while the product renders, but now xpinstall can not access ui elements such as a progress meter or a confirmation dialog.
nsITransportSecurityInfo
the possible values are defined in nsiwebprogresslistener.
nsITreeColumn
type_progressmeter 3 progress meter column type.
nsIWebBrowserPersist
progresslistener nsiwebprogresslistener 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 onprogress 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 inprogress readonly boolean whether or not a call is in progress fault readonly nsixmlrpcfault the most recent xml-rpc fault from returned from this server.
Using the Gecko SDK
work in progress...
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 onprogress(in print32 atransactionid, in pruint32 aprogress, in pruint32 aprogressmax); /** * notify the observer with a status message for sync operation */ void onstatus(in print32 atransactionid, in wstring amsg); /** * notify the observer that the ab sync operation has been completed.
nsIMsgCloudFileProvider
cancelfileupload() cancels an upload currently in progress for some nsilocalfile.
Mail client architecture overview
mail window management - each mail window maintains a certain amount of state to aid in view navigation, progress display, etc.
Activity Manager examples
ation is omitted, initiator is not provided process.init("processing folder: " + folder.prettiestname, null); // note that we don't define a custom icon, default process icon // will be used process.contexttype = "account"; // group this activity by account process.contextobj = folder.server; // account in question gactivitymanager.addactivity(process); // step 2: showing some progress let percent = 50; process.setprogress(percent, "junk processing 25 of 50 messages", 25, 50); // step 3: removing the process and adding an event using process' attributes process.state = components.interfaces.nsiactivityprocess.state_completed; gactivitymanager.removeactivity(process.id); let event = components.classes["@mozilla.org/activity-event;1"].createinstance(nsiae); // localization is...
js-ctypes reference
this doc is a work in progress.
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.
Application - Firefox Developer Tools
the application panel provides tools for inspecting and debugging modern web apps (also known as progressive web apps).
Access debugging in add-ons - Firefox Developer Tools
(currently a work in progress, see bug 653545.) ...
DevTools API - Firefox Developer Tools
while this api is currently a work-in-progress, there are usable portions of page inspector and debugger that may be used currently.
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).
AnimationEffect.getComputedTiming() - Web APIs
progress indicates how far along the animation is through its current iteration with values between 0 and 1.
AnimationEvent.initAnimationEvent() - Web APIs
it has been deprecated and is in the progress of being removed from most implementations.
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.
AudioParam.setTargetAtTime() - Web APIs
for more details, check the following table on how the value changes from 0% to 100% as the time progresses.
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
WebAPIFileReaderabort
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.onprogress 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.onloadstart - Web APIs
the loadstart event is fired when progress has begun.
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.
HTMLImageElement.lowSrc - Web APIs
instead, you should use an image format which loads progressively (such as progressive jpeg).
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 htmlprogresselement htmlquoteelement htmlscriptelement htmlselectelement htmlslotelement htmlsourceelement htmlspanelement htmlstyleelement htmltablecaptionelement htmltablecellelement htmltablecolelement htmltableelement htmltablerowelement htmltablesectionelement htmltemplateelement htmltextareaelement htmltimeelement htmltitleelement htmltrackelement htmlulistelement htmlunknownelement ...
IDBRequest.error - Web APIs
WebAPIIDBRequesterror
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.
Using the MediaStream Recording API - Web APIs
as recording progresses, we need to collect the audio data.
Navigator.vibrate() - Web APIs
WebAPINavigatorvibrate
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.resume() - Web APIs
the resume() method of the offlineaudiocontext interface resumes the progression of time in an audio context that has been suspended.
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.
Using Performance Timeline - Web APIs
specifications the interfaces described in this document are defined in the performance timeline standard which has two levels: performance timeline level 2; editors draft; work in progress.
Using the Permissions API - Web APIs
more features will be added as time progresses.
Using Pointer Events - Web APIs
tracking new touches we'll keep track of the touches in-progress.
RTCIceCandidatePairStats.state - Web APIs
each time a candidate pair is done being checked, the next-highest priority candidate pair remaining on the check list moves from the waiting state to the in-progress state, and its check begins.
RTCIceTransport: selectedcandidatepairchange event - Web APIs
bubbles no cancelable no interface event event handler property onselectedcandidatepairchange examples this example creates an event handler for selectedcandidatepairchange that updates a display providing the user information about the progress of the ice negotiation for an rtcpeerconnection called pc.
RTCPeerConnection.onnegotiationneeded - Web APIs
if the session is modified in a manner that requires negotiation while a negotiation is already in progress, no negotiationneeded event will fire until negotiation completes, and only then if negotiation is still needed.
RTCPeerConnection.pendingLocalDescription - Web APIs
syntax sessiondescription = rtcpeerconnection.pendinglocaldescription; return value if a local description change is in progress, this is an rtcsessiondescription describing the proposed configuration.
RTCPeerConnection.pendingRemoteDescription - Web APIs
syntax sessiondescription = rtcpeerconnection.pendingremotedescription; return value if a remote description change is in progress, this is an rtcsessiondescription describing the proposed configuration.
RTCStatsIceCandidatePairState - Web APIs
in-progress a check has been initiated for this pair, but the check's transaction is still in progress.
ServiceWorkerGlobalScope.skipWaiting() - Web APIs
the following example causes a newly installed service worker to progress into the activating state, regardless of whether there is already an active service worker.
ServiceWorkerGlobalScope - Web APIs
methods serviceworkerglobalscope.skipwaiting() allows the current service worker registration to progress from waiting to active state while service worker clients are using it.
SourceBuffer.updating - Web APIs
whether an sourcebuffer.appendbuffer(), sourcebuffer.appendstream(), or sourcebuffer.remove() operation is currently in progress.
SourceBuffer - Web APIs
whether an sourcebuffer.appendbuffer(), sourcebuffer.appendstream(), or sourcebuffer.remove() operation is currently in progress.
Streams API - Web APIs
examples from other developers: progress indicators with streams, service workers, & fetch.
TextEncoder.prototype.encodeInto() - Web APIs
the textencoder.prototype.encodeinto() method takes a usvstring to encode and a destination uint8array to put resulting utf-8 encoded text into, and returns a dictionary object indicating the progress of the encoding.
TextEncoder - Web APIs
textencoder.prototype.encodeinto() takes a usvstring to encode and a destination uint8array to put resulting utf-8 encoded text into, and returns a dictionary object indicating the progress of the encoding.
Using Touch Events - Web APIs
implementation and deployment status the touch events browser compatibility data indicates touch event support among mobile browsers is relatively broad, with desktop browser support lagging although additional implementations are in progress.
Touch events - Web APIs
tracking new touches we'll keep track of the touches in-progress.
TransformStream - Web APIs
examples include building a pwa with progressive loading and progressive streaming.
TransitionEvent.initTransitionEvent() - Web APIs
it has been deprecated and is in the progress of been removed from most implementation.
Geometry and reference spaces in WebXR - Web APIs
to support progressive enhancement—and thus broaden the availability of your app or site—you should choose a reference space that offers the lowest amount of functionality needed, or provide a fallback mechanism that detects failed attempts to obtain reference spaces and tries again with a less powerful alternative.
Starting up and shutting down a WebXR session - Web APIs
presumably the renderer uses this value to compute how often to render new frames as the animation loop progresses, thus rendering less frequently the more "blurred" the scene becomes.
Web Animations API Concepts - Web APIs
in fact, group effects and sequence effects have already been outlined in the currently-in-progress level 2 spec of the web animations api.
Advanced techniques: Creating and sequencing audio - Web APIs
while (nextnotetime < audioctx.currenttime + scheduleaheadtime ) { schedulenote(currentnote, nextnotetime); nextnote(); } timerid = window.settimeout(scheduler, lookahead); } we also need a draw function to update the ui, so we can see when the beat progresses.
Web Locks API - Web APIs
}); deadlocks a deadlock occurs when a process can no longer make progress because each part is waiting on a request that cannot be satisfied.
window.cancelAnimationFrame() - Web APIs
var myreq; function step(timestamp) { var progress = timestamp - start; d.style.left = math.min(progress / 10, 200) + 'px'; if (progress < 2000) { // it's important to update the requestid each time you're calling requestanimationframe myreq = requestanimationframe(step); } } myreq = requestanimationframe(step); // the cancelation uses the last requestid cancelanimationframe(myreq); specifications specification status...
Window.onappinstalled - Web APIs
the onappinstalled attribute of the window object serves as an event handler for the appinstalled event, which is dispatched once the web application is successfully installed as a progressive web app.
Window.requestAnimationFrame() - Web APIs
be sure to always use the first argument (or some other method for getting the current time) to calculate how much the animation will progress in a frame, otherwise the animation will run faster on high refresh rate screens.
XDomainRequest.responseText - Web APIs
note: this property is valid during the xdomainrequest.onprogress and xdomainrequest.onload events.
XMLHttpRequest.multipart - Web APIs
please use server-sent events, web sockets, or responsetext from progress events instead.
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.onprogress = 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.onprogress = 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.onprogress = 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.onload - Web APIs
it receives a progressevent object as its first argument.
XMLHttpRequestEventTarget - Web APIs
xmlhttprequesteventtarget.onprogress contains the function that is called periodically with information about the progress of the request and the progress event is received by this object.
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.
XRSystem: requestSession() - Web APIs
while only one immersive vr session can be active at a time, multiple inline sessions can be in progress at once.
XRView.eye - Web APIs
WebAPIXRVieweye
; 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
WebAPIXRViewporty
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.
ARIA live regions - Accessibility
progressbar a hybrid between a widget and a live region.
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 ...
An overview of accessible web applications and widgets - Accessibility
stock tickers, live twitter feed updates, progress indicators, and similar content modify the dom in ways that an assistive technology (at) may not be aware of.
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-ui-invalid - CSS: Cascading Style Sheets
the specification for :user-invalid is still in progress.
::-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.
Using CSS animations - CSS: Cascading Style Sheets
this lets you configure the timing, duration, and other details of how the animation sequence should progress.
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...
Recipe: Media objects - CSS: Cascading Style Sheets
relevant resources on mdn css grid layout progressive enhancement and grid layout using grid template areas fit-content grid-template-areas ...
Microsoft CSS extensions - CSS: Cascading Style Sheets
-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 ...
animation-timing-function - CSS: Cascading Style Sheets
the animation-timing-function css property sets how an animation progresses through the duration of each cycle.
conic-gradient() - CSS: Cascading Style Sheets
<color-hint> th color-hint is an interpolation hint defining how the gradient progresses between adjacent color stops.
display - CSS: Cascading Style Sheets
WebCSSdisplay
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.
repeating-conic-gradient() - CSS: Cascading Style Sheets
<color-hint> th color-hint is an interpolation hint defining how the gradient progresses between adjacent color stops.
repeating-linear-gradient() - CSS: Cascading Style Sheets
<color-hint> th color-hint is an interpolation hint defining how the gradient progresses between adjacent color stops.
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).
writing-mode - CSS: Cascading Style Sheets
the writing-mode css property sets whether lines of text are laid out horizontally or vertically, as well as the direction in which blocks progress.
CSS: Cascading Style Sheets
WebCSS
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
WebGuideAJAX
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.onprogress = function() { … }; html onevent attributes html elements have attributes named onevent which can be used to register a handler for an event directly within the html code.
Media events - Developer guides
progress sent periodically to inform interested parties of progress downloading the media.
HTML5 - Developer guides
WebGuideHTMLHTML5
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
WebGuideIndex
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.
A hybrid approach - Developer guides
subscribe to the mozilla webdev blog for updates about our progress.
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
WebHTMLElementimg
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 type="range"> - HTML: Hypertext Markup Language
WebHTMLElementinputrange
orient similar to the -moz-orient non-standard css property impacting the <progress> and <meter> elements, the orient attribute defines the orientation of the range slider.
<input>: The Input (Form Input) element - HTML: Hypertext Markup Language
WebHTMLElementinput
: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.
HTML elements reference - HTML: Hypertext Markup Language
WebHTMLElement
<progress> the html <progress> element displays an indicator showing the completion progress of a task, typically displayed as a progress bar.
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, onprogress, onratechange, onreset, onresize, onscroll, onseeked, onseeking, onselect, onshow, onsort, onstalled, onsubmit, onsuspend, ontimeupdate, ontoggle, onvolumechange, onwaiting.
HTML documentation index - HTML: Hypertext Markup Language
WebHTMLIndex
178 <progress>: the progress indicator element element, html, html forms, html5, reference, web the html <progress> element displays an indicator showing the completion progress of a task, typically displayed as a progress bar.
Inline elements - HTML: Hypertext Markup Language
gh block and inline elements are no longer defined in html 5, use content categories instead): <a> <abbr> <acronym> <audio> (if it has visible controls) <b> <bdi> <bdo> <big> <br> <button> <canvas> <cite> <code> <data> <datalist> <del> <dfn> <em> <embed> <i> <iframe> <img> <input> <ins> <kbd> <label> <map> <mark> <meter> <noscript> <object> <output> <picture> <progress> <q> <ruby> <s> <samp> <script> <select> <slot> <small> <span> <strong> <sub> <sup> <svg> <template> <textarea> <time> <u> <tt> <var> <video> <wbr> see also block-level elements html element reference display content categories block and inline layout in normal flow ...
Preloading content with rel="preload" - HTML: Hypertext Markup Language
this shows how preloading content can be combined with the philosophy of progressive enhancement.
Using the application cache - HTML: Hypertext Markup Language
for each file fetched into this temporary cache, the browser sends a progress event to the applicationcache object.
HTML: Hypertext Markup Language
WebHTML
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.
HTTP headers - HTTP
WebHTTPHeaders
client hints http client hints are a work in progress.
An overview of HTTP - HTTP
WebHTTPOverview
experiments are in progress to design a better transport protocol more suited to http.
303 See Other - HTTP
WebHTTPStatus303
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).
Regular expressions - JavaScript
the g flag is used with the .exec() method to get iterative progression.
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.
screenshots - Web app manifests
these images are intended to be used by progressive web app stores.
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.
Image file type and format guide - Web media technologies
apng is ideal for basic animations that do not need to synchronize to other activities or to a sound track, such as progress indicators, activity throbbers, and other animated sequences.
Web video codec guide - Web media technologies
profile color depths chroma subsampling constrained baseline (cbp) 8 4:2:0 baseline (bp) 8 4:2:0 extended (xp) 8 4:2:0 main (mp) 8 4:2:0 high (hip) 8 4:0:0 (greyscale) and 4:2:0 progressive high (prohip) 8 4:0:0 (greyscale) and 4:2:0 high 10 (hi10p) 8 to 10 4:0:0 (greyscale) and 4:2:0 high 4:2:2 (hi422p) 8 to 10 4:0:0 (greyscale), 4:2:0, and 4:2:2 high 4:4:4 predictive 8 to 14 4:0:0 (greyscale), 4:2:0, 4:2:2, and 4:4:4 hdr support ...
The "codecs" parameter in common media types - Web media technologies
64 00 progressive high profile (phip) essentially high profile without support for field coding.
Recommended Web Performance Timings: How long is too long? - Web Performance
if you wait three or four seconds without communicating to the user that a load is happening and showing some progress, the typical site will lose potential visitors, and those visitors will take a long time to come back if they ever do.
SVG Event Attributes - SVG: Scalable Vector Graphics
WebSVGAttributeEvents
e, ondblclick, ondrag, ondragend, ondragenter, ondragexit, ondragleave, ondragover, ondragstart, ondrop, ondurationchange, onemptied, onended, onerror, onfocus, oninput, oninvalid, onkeydown, onkeypress, onkeyup, onload, onloadeddata, onloadedmetadata, onloadstart, onmousedown, onmouseenter, onmouseleave, onmousemove, onmouseout, onmouseover, onmouseup, onmousewheel, onpause, onplay, onplaying, onprogress, onratechange, onreset, onresize, onscroll, onseeked, onseeking, onselect, onshow, onstalled, onsubmit, onsuspend, ontimeupdate, ontoggle, onvolumechange, onwaiting graphical event attributes onactivate, onfocusin, onfocusout ...
glyph-orientation-vertical - SVG: Scalable Vector Graphics
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.
keyPoints - SVG: Scalable Vector Graphics
each progress value in the list corresponds to a value in the keytimes attribute list.
SVG Attribute reference - SVG: Scalable Vector Graphics
WebSVGAttribute
e, ondblclick, ondrag, ondragend, ondragenter, ondragexit, ondragleave, ondragover, ondragstart, ondrop, ondurationchange, onemptied, onended, onerror, onfocus, oninput, oninvalid, onkeydown, onkeypress, onkeyup, onload, onloadeddata, onloadedmetadata, onloadstart, onmousedown, onmouseenter, onmouseleave, onmousemove, onmouseout, onmouseover, onmouseup, onmousewheel, onpause, onplay, onplaying, onprogress, onratechange, onreset, onresize, onscroll, onseeked, onseeking, onselect, onshow, onstalled, onsubmit, onsuspend, ontimeupdate, ontoggle, onvolumechange, onwaiting graphical event attributes onactivate, onfocusin, onfocusout ...
Securing your site - Web security
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 securityprogressive web apps (pwas)svg: scalable vector graphicstutorialsweb apisweb componentsweb performanceweb app manifestsweb media technologiesweb securityweb technology referencexml: extensible markup languagexpathxslt: extensible stylesheet language transformations ...
Understanding WebAssembly text format - WebAssembly
for a useful write up of progress so far and how this works, see multi-value all the wasm!