Search completed in 1.36 seconds.
1742 results for "next":
Your results are loading. Please wait...
<nextid>: The NeXT ID element (Obsolete) - HTML: Hypertext Markup Language
WebHTMLElementnextid
<nextid> is an obsolete html element that served to enable the next web designing tool to generate automatic name labels for its anchors.
... html "0.c" - from january 23, 1991 though november 23, 1992 this early version of html introduced <nextid> in a non-sgml compliant form that simply used the numeric value alone as an "attribute." html "0.d" - from november 26, 1992 through may 24, 1993 during this span, next and the oldest surviving dtd's show <nextid> to take only a number for a value of its newly-introduced attribute n.
... html "1.k" - version 1 (first release) in this first published draft of html, <nextid> is the same as it would take in html 2, finally allowing the use of a name instead of only a number for its attribute value.
...And 11 more matches
Node.nextSibling - Web APIs
WebAPINodenextSibling
the node.nextsibling read-only property returns the node immediately following the specified one in their parent's childnodes, or returns null if the specified node is the last child in the parent element.
... syntax nextnode = node.nextsibling notes gecko-based browsers insert text nodes into a document to represent whitespace in the source markup.
... element.nextelementsibling may be used to obtain the next element skipping any whitespace nodes, other between-element text, or comments.
...And 7 more matches
Generator.prototype.next() - JavaScript
the next() method returns an object with two properties done and value.
... you can also provide a parameter to the next method to send a value to the generator.
... syntax gen.next(value) parameters value the value to send to the generator.
...And 5 more matches
Deployment and next steps - Learn web development
objective: learn how to prepare our svelte app for production, and what learning resources you should visit next.
...if you are not interested at all in typescript, you can skip to the next chapter, where we will look at different options for deploying our svelte applications, further resources, and more.
... code along with us git clone the github repo (if you haven't already done it) with: git clone https://github.com/opensas/mdn-svelte-tutorial.git then to get to the current app state, run cd mdn-svelte-tutorial/08-next-steps or directly download the folder's content: npx degit opensas/mdn-svelte-tutorial/08-next-steps remember to run npm install && npm run dev to start your app in development mode.
...And 4 more matches
NonDocumentTypeChildNode.nextElementSibling - Web APIs
the nondocumenttypechildnode.nextelementsibling read-only property returns the element immediately following the specified one in its parent's children list, or null if the specified element is the last one in the list.
... syntax var nextnode = elementnodereference.nextelementsibling; example <div id="div-01">here is div-01</div> <div id="div-02">here is div-02</div> <script type="text/javascript"> var el = document.getelementbyid('div-01').nextelementsibling; console.log('siblings of div-01:'); while (el) { console.log(el.nodename); el = el.nextelementsibling; } </script> this example outputs the following into the console when it loads: siblings of div-01: div script polyfill for internet explorer 8 this property is unsupported prior to ie9, so the following snippet can be used to add support to ie8: // source: https://github.com/alhadis/snippets/blob/master/js/polyfills/ie8-child-elements.js if(!("nextelementsibling" in document.documentelement)){ object.defineproperty(element...
....prototype, "nextelementsibling", { get: function(){ var e = this.nextsibling; while(e && 1 !== e.nodetype) e = e.nextsibling; return e; } }); } polyfill for internet explorer 9+ and safari // source: https://github.com/jserz/js_piece/blob/master/dom/nondocumenttypechildnode/nextelementsibling/nextelementsibling.md (function (arr) { arr.foreach(function (item) { if (item.hasownproperty('nextelementsibling')) { return; } object.defineproperty(item, 'nextelementsibling', { configurable: true, enumerable: true, get: function () { var el = this; while (el = el.nextsibling) { if (el.nodetype === 1) { return el; } } return n...
...And 3 more matches
Enumerator.moveNext - Archive of obsolete content
the enumerator.movenext method moves the current item to the next item in the collection.
... syntax enumobj.movenext( ) remarks the required enumobj reference is any enumerator object.
... example in following example, the movenext method is used to move to the next drive in the drives collection: function showdrives() { var s = ""; var bytespergb = 1024 * 1024 * 1024; var fso = new activexobject("scripting.filesystemobject"); var e = new enumerator(fso.drives); e.movefirst(); while (e.atend() == false) { var drv = e.item(); s += drv.path + " - "; if (drv.isready) { var freegb = drv.freespace / bytespergb; var totalgb = drv.totalsize / bytespergb; s += freegb.tofixed(3) + " gb free of "; s += totalgb.tofixed(3) + " gb"; } else ...
... { s += "not ready"; } s += "<br />"; e.movenext(); } return(s); } requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer 8 standards, internet explorer 9 standards, and internet explorer 10 standards.
HTMLIframeElement.removeNextPaintListener()
the removenextpaintlistener() method of the htmliframeelement interface is used to remove a handler previously set with the addnextpaintlistener method.
... syntax instanceofhtmliframeelement.removenextpaintlistener(listener); returns void.
... parameters listener a function handler previously set with addnextpaintlistener.
... examples var browser = document.queryselector('iframe'); function onnextpaint() { console.log("paint has occured"); } browser.addnextpaintlistener(onnextpaint); browser.removenextpaintlistener(onnextpaint); specification not part of any specification.
JS_NextProperty
get the next property id from an iterator object produced by js_newpropertyiterator.
... syntax bool js_nextproperty(jscontext *cx, js::handleobject iterobj, js::mutablehandleid idp); name type description cx jscontext * the js context in which to enumerate properties.
...on success, *idp receives the name or index of the next property name; or jsid_void if there are no more enumerable properties to visit.
... description on success, js_nextproperty returns true, with *idp containing the id of the next enumerable own property to visit using iterobj, or jsid_void if there is no such property left to visit.
NodeIterator.nextNode() - Web APIs
the nodeiterator.nextnode() method returns the next node in the set represented by the nodeiterator and advances the position of the iterator within the set.
... the first call to nextnode() returns the first node in the set.
... syntax node = nodeiterator.nextnode(); example var nodeiterator = document.createnodeiterator( document.body, nodefilter.show_element, { acceptnode: function(node) { return nodefilter.filter_accept; } }, false // this optional argument is not used any more ); currentnode = nodeiterator.nextnode(); // returns the next node specifications specification status comment domthe definition of 'nodeiterator.nextnode' in that specification.
... document object model (dom) level 2 traversal and range specificationthe definition of 'nodeiterator.nextnode' in that specification.
PerformanceResourceTiming.nextHopProtocol - Web APIs
the nexthopprotocol read-only property is a string representing the network protocol used to fetch the resource, as identified by the alpn protocol id (rfc7301).
... syntax resource.nexthopprotocol; return value a string representing the network protocol used to fetch the resource, as identified by the alpn protocol id (rfc7301).
... example the following example uses the nexthopprotocol property.
... function print_performanceentries() { // use getentriesbytype() to just get the "resource" events var p = performance.getentriesbytype("resource"); for (var i=0; i < p.length; i++) { print_nexthopprotocol(p[i]); } } function print_nexthopprotocol(perfentry) { var value = "nexthopprotocol" in perfentry; if (value) console.log("nexthopprotocol = " + perfentry.nexthopprotocol); else console.log("nexthopprotocol = not supported"); } specifications specification status comment resource timing level 2the definition of 'nexthopprotocol' in that specification.
XPathResult.iterateNext() - Web APIs
the iteratenext() method of the xpathresult interface iterates over a node set result and returns the next node from it or null if there are no more nodes.
... syntax var node = result.iteratenext(); return value the next node within the node set of the xpathresult.
... example the following example shows the use of the iteratenext() method.
... html <div>xpath example</div> <div>tag names of the matched nodes: <output></output></div> javascript var xpath = "//div"; var result = document.evaluate(xpath, document, null, xpathresult.any_type, null); var node = null; var tagnames = []; while(node = result.iteratenext()) { tagnames.push(node.localname); } document.queryselector("output").textcontent = tagnames.join(", "); result specifications specification status comment document object model (dom) level 3 xpath specificationthe definition of 'xpathresult.iteratenext()' in that specification.
next - Archive of obsolete content
ArchiveMozillaXULAttributenext
« xul reference home next type: id set to the pageid of the next wizardpage after this one.
... when set, the page with this pageid is displayed when the next button is pressed.
...if one of the pages has a next attribute, all of the pages should have one, except that last page.
next - Archive of obsolete content
ArchiveMozillaXULPropertynext
« xul reference next type: string wizardpage id set to the pageid of the next page after this one.
... when set, the page with this pageid is displayed when the next button is pressed.
...if one of the pages has a next attribute, all of the pages should have one, except that last page.
ECMAScript 2016 to ES.Next support in Mozilla - Archive of obsolete content
(may 2019) ecmascript next refers to new features of the ecma-262 standard (commonly referred to as javascript) introduced after ecmascript 2015.
...yet implemented; in other browsers) ecmascript 2019 array.flat() (firefox 62) array.flatmap() (firefox 62) object.fromentries() (firefox 63) string.trimstart() and string.trimend() (firefox 61) optional catch binding (firefox 58) function.tostring() revision (firefox 54) symbol.description (firefox 63) well-formed json.stringify() (firefox 64) ecmascript 2020 this is the current es.next version.
... implemented proposals not in es.next this section needs to be updated to reflect current changes.
HTMLIFrameElement.addNextPaintListener()
the addnextpaintlistener() method of the htmliframeelement is used to define a handler to listen for the next mozafterpaint event coming from the browser <iframe>.
... syntax instanceofhtmliframeelement.addnextpaintlistener(listener); returns void.
... examples var browser = document.queryselector('iframe'); function onnextpaint() { console.log("paint has occured"); } browser.addnextpaintlistener(onnextpaint); specification not part of any specification.
HTMLIFrameElement.findNext()
the findnext() method of the htmliframeelement highlights the next or previous instance of a search result after a findall() search has been carried out.
... syntax instanceofhtmliframeelement.findnext(direction); return value void.
... prev.addeventlistener('touchend',function() { browser.findnext('backward'); }); next.addeventlistener('touchend',function() { browser.findnext('forward'); }); specification not part of any specification.
PR_NEXT_LINK
returns the next element in a list.
... syntax #include <prclist.h> prclist *pr_next_link (prclist *elemp); parameter elemp a pointer to the element.
... description pr_next_link returns a pointer to the element following the specified element.
TreeWalker.nextNode() - Web APIs
the treewalker.nextnode() method moves the current node to the next visible node in the document order, and returns the found node.
... syntax node = treewalker.nextnode(); example var treewalker = document.createtreewalker( document.body, nodefilter.show_element, { acceptnode: function(node) { return nodefilter.filter_accept; } }, false ); var node = treewalker.nextnode(); // returns the first child of root, as it is the next node in document order specifications specification status comment domthe definition of 'treewalker.nextnode' in that specification.
... living standard no change from document object model (dom) level 2 traversal and range specification document object model (dom) level 2 traversal and range specificationthe definition of 'treewalker.nextnode' in that specification.
TreeWalker.nextSibling() - Web APIs
the treewalker.nextsibling() method moves the current node to its next sibling, if any, and returns the found sibling.
... syntax node = treewalker.nextsibling(); example var treewalker = document.createtreewalker( document.body, nodefilter.show_element, { acceptnode: function(node) { return nodefilter.filter_accept; } }, false ); treewalker.firstchild(); var node = treewalker.nextsibling(); // returns null if the first child of the root element has no sibling specifications specification status comment domthe definition of 'treewalker.nextsibling' in that specification.
... living standard no change from document object model (dom) level 2 traversal and range specification document object model (dom) level 2 traversal and range specificationthe definition of 'treewalker.nextsibling' in that specification.
getNextItem - Archive of obsolete content
« xul reference home getnextitem( startitem, delta ) return type: element this method returns the item a given distance (delta) after the specified startitem, or null if no such item exists.
... this example will return the item two rows after someitem: getnextitem ( someitem, 2 ); ...
NextSibling
« nsiaccessible page summary returns next sibling in accessible tree.
... attribute nsiaccessible nextsibling; exceptions thrown ns_error_failure indicates that the accessible is unattached from the accessible tree.
HTMLMediaElement.seekToNextFrame() - Web APIs
the htmlmediaelement.seektonextframe() method asynchronously advances the the current play position to the next frame in the media.
... syntax var seekcompletepromise = htmlmediaelement.seektonextframe(); htmlmediaelement.seektonextframe(); return value a promise which is fulfilled once the seek operation has completed.
findnextaccesskey - Archive of obsolete content
« xul reference home findnextaccesskey type: string the access key for the "find next" toolbar button in the findbar.
getNext
documentation is now located at nsisimpleenumerator.getnext().
Index - Learn web development
next up we'll explore css and javascript, and how accessibility is affected by their good or bad use.
...you should now also have a thirst to learn about the implementation details that can make sites accessible, and we'll start on that in the next section, looking at why html is a good basis for accessibility.
... 55 making asynchronous programming easier with async and await beginner, codingscripting, guide, javascript, learn, promises, async, asynchronous, await more recent additions to the javascript language are async functions and the await keyword, part of the so-called ecmascript 2017 javascript edition (see ecmascript next support in mozilla).
...And 42 more matches
Starting WebLock
« previousnext » in this chapter, we begin to design and implement the web locking functionality itself.
...you will see the code which does this in the next section.
...the next parameter is a nifty macro that returns the iid for the interface name that you pass in.
...And 32 more matches
Key Values - Web APIs
scrolls down or displays the next page of content.
... vk_next (0x22) kvk_pagedown (0x79) gdk_key_page_down (0xff56) gdk_key_kp_page_down (0xff9b) qt::key_pagedown (0x01000017) keycode_page_down (93) "pageup" the page up (or pgup) key.
... gdk_key_iso_last_group (0xfe0e) "groupnext" [4] switches to the next character group on an iso/iec 9995 keyboard.
...And 24 more matches
Index - Web APIs
WebAPIIndex
657 constantsourcenode.offset api, audio, constantsourcenode, media, property, read-only, web audio api the read-only offset property of the constantsourcenode interface returns a audioparam object indicating the numeric a-rate value which is always returned by the source when asked for the next sample.
... 1800 htmlmediaelement.seektonextframe() api, experimental, htmlmediaelement, method, non-standard, reference, web, seektonextframe the htmlmediaelement.seektonextframe() method asynchronously advances the the current play position to the next frame in the media.
... 1998 idbcursor.continue() api, database, idbcursor, indexeddb, method, reference, storage, continue the continue() method of the idbcursor interface advances the cursor to the next position along its direction, to the item whose key matches the optional key parameter.
...And 21 more matches
Drawing graphics - Learn web development
previous overview: client-side web apis next the browser contains some very powerful graphics programming tools, from the scalable vector graphics (svg) language, to apis for drawing on html <canvas> elements, (see the canvas api and webgl).
... next, add the following lines to the bottom of your javascript: ctx.fillstyle = 'rgb(255, 0, 0)'; ctx.fillrect(50, 50, 100, 150); if you save and refresh, you should see a red rectangle has appeared on your canvas.
... function degtorad(degrees) { return degrees * math.pi / 180; }; next, start off your path by adding the following below your previous addition; here we set a color for our triangle, start drawing a path, and then move the pen to (50, 50) without drawing anything.
...And 20 more matches
Bytecode Descriptions
(the spec refers to an "iterator object" with a next method, but notes that it "is never directly accessible" to scripts.
...exactly those instructions that begin executing with iter on the stack, starting with the next instruction (always jsop::loophead).
...format: jof_ic moreiter stack: iter ⇒ iter, name get the next property name for a for-in loop.
...And 20 more matches
Tree View Details - Archive of obsolete content
« previousnext » this section will describe some more features of tree views.
...next, let's look at some additional functions that views may implement.
... in addition to the getlevel method, there is a hasnextsibling function which, given a row, should return true if there is another row afterwards at the same level.
...And 16 more matches
Index - Archive of obsolete content
312 adding preferences to an extension add-ons, extensions, preferences system, xul this article takes the creating a dynamic status bar extension sample to the next level, adding a popup menu that lets you quickly switch between multiple stocks to watch.
... 603 plug-n-hack phase2 security, plugnhack the next phase of plug-n-hack (pnh) is still being planned but is intended to allow browsers to advertise their capabilities to security tools.
...when those elements have reached their maximum sizes, the elements with the next higher flexgroup are flexed.
...And 13 more matches
Handling common accessibility problems - Learn web development
previous overview: cross browser testing next next we turn our attention to accessibility, providing information on common problems, how to do simple testing, and how to make use of auditing/automation tools for finding accessibility issues.
...next, you have to open your mac's system preferences app, then go to keyboard > shortcuts, then select the all controls radio button.
... next on our list, the form <label> element is one of the central features that allows us to make forms accessible.
...And 13 more matches
Rendering and the WebXR frame animation callback - Web APIs
once that's in hand, you request that the browser call your rendering function the next time it needs a framebuffer to render your scene.
...the next frame drawn will be frame 4 instead.
...tearing occurs when the the display hardware starts the next refresh cycle while the previous frame is still being drawn to the screen.
...And 13 more matches
Index - Archive of obsolete content
ArchiveMozillaXULIndex
when those elements have reached their maximum sizes, the elements with the next higher flexgroup are flexed.
... 120 findnextaccesskey xul, xul attributes no summary!
... 207 next xul attributes, xul reference no summary!
...And 12 more matches
Index
MozillaTechXPCOMIndex
when the component starts up, it populates a list of urls read in from a file stored next to the gecko binary on the local system.
... 242 nextsiblingnode no summary!
... 279 nextsibling returns next sibling in accessible tree.
...And 12 more matches
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 next iteration of this specification is in the work, allowing to tailor a web site regarding the input methods available on the user agent, with new media features like hover or pointer.
... at risk: due to insufficient browser support, standardization of the padding-box value may be postponed to the next iteration of this module.
...And 11 more matches
More Wizards - Archive of obsolete content
« previousnext » this section describes some additional features of wizards.
...then, to navigate to a page, use one of two methods: set the next attribute on each page to the page id of the next page to go to.
...you might call this method in the onpageadvanced or onwizardnext handlers.
...And 11 more matches
Focus management with Vue refs - Learn web development
previous overview: client-side javascript frameworks next we are nearly done with vue.
... vue's $nexttick() method we want to set focus on the "edit" button when a user saves or cancels their edit.
... focusoneditbutton() { const editbuttonref = this.$refs.editbutton; editbuttonref.focus(); } next, add a call to this.focusoneditbutton() at the end of the itemedited() and editcancelled() methods: itemedited(newitemname) { this.$emit("item-edited", newitemname); this.isediting = false; this.focusoneditbutton(); }, editcancelled() { this.isediting = false; this.focusoneditbutton(); }, try editing and then saving/cancelling a to-do item via your keyboard.
...And 11 more matches
Iterators and generators - JavaScript
« previousnext » processing each of the items in a collection is a very common operation.
... specifically, an iterator is any object which implements the iterator protocol by having a next() method that returns an object with two properties: value the next value in the iteration sequence.
... once created, an iterator object can be iterated explicitly by repeatedly calling next().
...And 11 more matches
Cooperative asynchronous JavaScript: Timeouts and intervals - Learn web development
previous overview: asynchronous next this tutorial looks at the traditional methods javascript has available for running code asychronously after a set time period has elapsed, or at a regular interval (e.g.
...executes a specified block of code before the browser next repaints the display, allowing an animation to be run at a suitable framerate regardless of the environment it is being run in.
... when using settimeout() recursively, each iteration can calculate a different delay before running the next iteration.
...And 10 more matches
Client-side storage - Learn web development
next, note how our html references a javascript file called index.js (see line 40).
....remember'); const forgetdiv = document.queryselector('.forget'); const form = document.queryselector('form'); const nameinput = document.queryselector('#entername'); const submitbtn = document.queryselector('#submitname'); const forgetbtn = document.queryselector('#forgetname'); const h1 = document.queryselector('h1'); const personalgreeting = document.queryselector('.personal-greeting'); next up, we need to include a small event listener to stop the form from actually submitting itself when the submit button is pressed, as this is not the behavior we want.
... next, add the following to the bottom of your code: window.onload = function() { }; we will write all of our subsequent code inside this window.onload event handler function, called when the window's load event fires, to make sure we don't try to use indexeddb functionality before the app has completely finished loading (it could fail if we don't).
...And 10 more matches
A first splash into JavaScript - Learn web development
previous overview: first steps next now you've learned something about the theory of javascript, and what you can do with it, we are going to give you a crash course in the basic features of javascript via a completely practical tutorial.
... next, check whether it is the correct number.
...each made to store a reference to the results paragraphs in our html, and are used to insert values into the paragraphs later on in the code (note how they are inside a <div> element, which is itself used to select all three later on for resetting, when we restart the game): <div class="resultparas"> <p class="guesses"></p> <p class="lastresult"></p> <p class="loworhi"></p> </div> the next two constants store references to the form text input and submit button and are used to control submitting the guess later on.
...And 10 more matches
XBL Example - Archive of obsolete content
« previousnext » this section will describe an example xbl element.
...along the bottom, we'll need a button to go the previous page, a label to display the current page number, and a button to go to the next page.
... example 1 : source <binding id="slideshow"> <content> <xul:vbox flex="1"> <xul:deck xbl:inherits="selectedindex" selectedindex="0" flex="1"> <children/> </xul:deck> <xul:hbox> <xul:button xbl:inherits="label=previoustext"/> <xul:label flex="1"/> <xul:button xbl:inherits="label=nexttext"/> </xul:hbox> </xul:vbox> </content> </binding> this binding creates the slideshow structure that we want.
...And 9 more matches
TypeScript support in Svelte - Learn web development
previous overview: client-side javascript frameworks next in the last article we learned about svelte stores and even implemented our own custom store to persist the app's information to web storage.
...if you are not interested at all in typescript, you can skip to the next chapter, where we will look at different options for deploying our svelte applications, further resources, and more.
... next, import the filter enum — add the following import statement below your existing ones: import { filter } from '../types/filter.enum' now we will use it whenever we reference the current filter.
...And 9 more matches
Introduction to automated testing - Learn web development
previous overview: cross browser testing next manually running tests on several browsers and devices, several times per day, can get tedious, and time-consuming.
... we will look at how to set up your own selenium-based testing system in the next article.
... next, you'll need some sample html, css and javascript content to test your system on — make copies of our sample index.html, main.js, and style.css files in a subfolder with the name src inside your project folder.
...And 9 more matches
Iteration protocols - JavaScript
an object is an iterator when it implements a next() method with the following semantics: property value next() a zero-argument function that returns an object with at least the following two properties: done (boolean) has the value false if the iterator was able to produce the next value in the sequence.
... the next() method must always return an object with appropriate properties including done and value.
... if a non-object value gets returned (such as false or undefined), a typeerror ("iterator.next() returned a non-object value") will be thrown.
...And 9 more matches
Anatomy of a video game - Game development
modern javascript — as described in the next sections — thankfully makes it easy to develop an efficient, execute-once-per-frame main loop.
...that callback function will be executed at a suitable time before the next repaint.
...calling the next requestanimationframe early ensures the browser receives it on time to plan accordingly even if your current frame misses its vsync window.
...And 8 more matches
Build your own function - Learn web development
previous overview: building blocks next with most of the essential theory dealt with in the previous article, this article provides practical experience.
... next, add the following inside the <script> element: function displaymessage() { } we start off with the keyword function, which means we are defining a function.
... the first line uses a dom api function called document.queryselector() to select the <html> element and store a reference to it in a constant called html, so we can do things to it later on: const html = document.queryselector('html'); the next section uses another dom api function called document.createelement() to create a <div> element and store a reference to it in a constant called panel.
...And 8 more matches
Third-party APIs - Learn web development
previous overview: client-side web apis next the apis we've covered so far are built into the browser, but not all apis are.
... next, you need to go to the mapquest developer site, create an account, and then create a developer key to use with your example.
...next, we use some string manipulation to assemble the full url that we will make the request to.
...And 8 more matches
Advanced Svelte: Reactivity, lifecycle, accessibility - Learn web development
previous overview: client-side javascript frameworks next in the last article we added more features to our to-do list and started to organize our app into components.
... autofocusing our input the next feature will add to our newtodo component will be an autofocus prop, which will allow us to specify that we want the <input> field to be focused on page load.
...instead, it waits until the next microtask to see if there are any other changes that need to be applied, including in other components.
...And 8 more matches
Introducing a complete toolchain - Learn web development
previous overview: understanding client-side tools next in the final couple of articles in the series we will solidify your tooling knowledge by walking you through the process of building up a sample case study toolchain.
... there really are unlimited combinations of tools and ways to use them, what you see in this article and the next is only one way that the featured tools can be used for a project.
...in the next chapter we will push to a github code repository, which will cause a cascade effect that (should) deploy all the software to a home on the web.
...And 8 more matches
Reference Manual
p = p->next; } one often sees this pattern expressed as a for loop, as well.
... p->getnext(&p); // trouble!
... ns_release(p); p->getnext(&p); // trouble!
...And 8 more matches
Timing element visibility with the Intersection Observer API - Web APIs
let's start with the global variables: let contentbox; let nextarticleid = 1; let visibleads = new set(); let previouslyvisibleads = null; let adobserver; let refreshintervalid = 0; these are used as follows: contentbox a reference to the <main> element's htmlelement object in the dom.
... nextarticleid each article is given a unique id number; this variable tracks the next id to use, starting with 1.
... next we set up the options for the intersectionobserver which will monitor target elements (ads, in our case) for intersection changes relative to the document.
...And 8 more matches
Chapter 5: Let's build a Firefox extension - Archive of obsolete content
« previousnext » this document was authored by taiga (gomita) gomibuchi and was originally published in japanese for the firefox developers conference summer 2007.
...if you keep in mind the following three points at the very least, the next section, developing a simple extension, should help flesh out your understanding.
... finding overlay merge points the next step is to find the “merge points” where the overlay document will insert its content into the base document.
...And 7 more matches
Space Manager Detailed Design - Archive of obsolete content
* * dump the state of the spacemanager out to a file */ nsresult list(file* out); void sizeof(nsisizeofhandler* ahandler, pruint32* aresult) const; #endif private: // structure that maintains information about the region associated // with a particular frame struct frameinfo { nsiframe* const mframe; nsrect mrect; // rectangular region frameinfo* mnext; frameinfo(nsiframe* aframe, const nsrect& arect); #ifdef ns_build_refcnt_logging ~frameinfo(); #endif }; // doubly linked list of band rects struct bandrect : prcliststr { nscoord mleft, mtop; nscoord mright, mbottom; printn mnumframes; // number of frames occupying this rect union { nsiframe* mframe; // single frame occupying the space ...
...nsvoidarray* mframes; // list of frames occupying the space }; bandrect(nscoord aleft, nscoord atop, nscoord aright, nscoord abottom, nsiframe*); bandrect(nscoord aleft, nscoord atop, nscoord aright, nscoord abottom, nsvoidarray*); ~bandrect(); // list operations bandrect* next() const {return (bandrect*)pr_next_link(this);} bandrect* prev() const {return (bandrect*)pr_prev_link(this);} void insertbefore(bandrect* abandrect) {pr_insert_before(abandrect, this);} void insertafter(bandrect* abandrect) {pr_insert_after(abandrect, this);} void remove() {pr_remove_link(this);} // split the band rect into two vertically, with this band rect becoming // the top part, and a new band re...
...void append(bandrect* abandrect) {pr_append_link(abandrect, this);} // remove and delete all the band rects in the list void clear(); }; frameinfo* getframeinfofor(nsiframe* aframe); frameinfo* createframeinfo(nsiframe* aframe, const nsrect& arect); void destroyframeinfo(frameinfo*); void clearframeinfo(); void clearbandrects(); bandrect* getnextband(const bandrect* abandrect) const; void divideband(bandrect* aband, nscoord abottom); prbool canjoinbands(bandrect* aband, bandrect* aprevband); prbool joinbands(bandrect* aband, bandrect* aprevband); void addrecttoband(bandrect* aband, bandrect* abandrect); void insertbandrect(bandrect* abandrect); nsresult getbandavailablespace(const bandrect* aband, ...
...And 7 more matches
Modifying a XUL Interface - Archive of obsolete content
« previousnext » the dom provides various functions to modify the document.
...here is an example: example 2 : source view <hbox height="400"> <button label="copy" oncommand="this.parentnode.appendchild(this.nextsibling.clonenode(true));"/> <vbox> <button label="first"/> <button label="second"/> </vbox> </hbox> when the copy button is pressed..
... we retrieve the nextsibling of the button, which will be the vbox element.
...And 7 more matches
Ember Interactivity: Footer functionality, conditional rendering - Learn web development
previous overview: client-side javascript frameworks next now it's time to start tackling the footer functionality in our app.
...enter the following terminal command to do so: ember generate component-class footer next, go and find the newly-created todomvc/app/components/footer.js file and update it to the following: import component from '@glimmer/component'; import { inject as service } from '@ember/service'; export default class footercomponent extends component { @service('todo-data') todos; } now we need to go back to our todo-data.js file and add some functionality that will allow us to retur...
... next, add the following action underneath the existing add(text) action: @action clearcompleted() { this.todos = this.incomplete; } this is rather nice for clearing the todos — we just need to set the todos array to equal the list of incomplete todos.
...And 7 more matches
React interactivity: Events and state - Learn web development
previous overview: client-side javascript frameworks next with our component plan worked out, it's now time to start updating our app from a completely static ui to one that actually allows us to interact and change things.
... handling form submission via callbacks inside the top of our app() component function, create a function named addtask() which has a single parameter of name: function addtask(name) { alert(name); } next, we'll pass addtask() into <form /> as a prop.
...this is what we'll do next.
...And 7 more matches
Adding a new todo form: Vue events, methods, and models - Learn web development
previous overview: client-side javascript frameworks next we now have sample data in place, and a loop that takes each bit of data and renders it inside a todoitem in our app.
... what we really need next is the ability to allow our users to enter their own todo items into the app, and for that we'll need a text <input>, an event to fire when the data is submitted, a method to fire upon submission to add the data and rerender the list, and a model to control the data.
... add this like so: export default { methods: { onsubmit() { console.log('form submitted') } } } next we need to bind the method to our <form> element's submit event handler.
...And 7 more matches
Command line crash course - Learn web development
previous overview: understanding client-side tools next in your development process you'll undoubtedly be required to run some command in the terminal (or on the "command line" — these are effectively the same thing).
...we’ll see how to install some tools later on in this chapter, and we’ll learn more about package registries in the next chapter.
... the next images show the command prompts available in windows — there’s a good range of options from the "cmd" program to "powershell" — which can be run from the start menu by typing the program name.
...And 7 more matches
Background Tasks API - Web APIs
while the browser, your code, and the web in general will continue to run normally if you go over the specified time limit (even if you go way over it), the time restriction is intended to ensure that you leave the system enough time to finish the current pass through the event loop and get on to the next one without causing other code to stutter or animation effects to lag.
... let totaltaskcountelem = document.getelementbyid("totaltaskcount"); let currenttasknumberelem = document.getelementbyid("currenttasknumber"); let progressbarelem = document.getelementbyid("progress"); let startbuttonelem = document.getelementbyid("startbutton"); let logelem = document.getelementbyid("log"); next we have variables which reference the dom elements we need to interact with.
... let logfragment = null; let statusrefreshscheduled = false; finally, we set up a couple of variables for other items: logfragment will be used to store a documentfragment that's generated by our logging functions to create content to append to the log when the next animation frame is rendered.
...And 7 more matches
Linear-gradient Generator - CSS: Cascading Style Sheets
able : makeresizable }; })(); /** * gradient point */ var gradientpoint = function gradientpoint(axis) { var point = document.createelement('div'); point.classname = 'gradient-point'; this.position = 0; this.node = point; this.axis = axis; this.color = new hsvcolor(0, 0, 100); this.csscolor = this.color.getcolor(); this.cssposition = 0; this.prevpoint = null; this.nextpoint = null; this.axis.num_points++; point.addeventlistener('click', this.activate.bind(this)); trackmouse(point, this.updatepositionm.bind(this), this.startmove.bind(this), this.endmove.bind(this)); axis.line.appendchild(point); return this; }; gradientpoint.prototype.deletepoint = function deletepoint() { this.axis.line.removechild(this.node); }; gradientpoint.prototype.
...position = parsefloat((100 * this.position / (2 * this.axis.lsize)).tofixed(1)); this.node.style.left = this.cssposition + this.axis.unit; this.updatecssvalue(); }; gradientpoint.prototype.updatecssvalue = function updatecssvalue() { this.cssvalue = this.csscolor + ' ' + this.cssposition + this.axis.unit; }; gradientpoint.prototype.insertbefore = function insertbefore(point) { this.nextpoint = point; this.prevpoint = point.prevpoint; point.prevpoint = this; if (this.prevpoint) this.prevpoint.nextpoint = this; }; gradientpoint.prototype.insertafter = function insertafter(point) { this.nextpoint = point.nextpoint; this.prevpoint = point; point.nextpoint = this; if (this.nextpoint) this.nextpoint.prevpoint = this; }; /** * gradient axis */ function g...
...oint(pos) { var point = new gradientpoint(this); point.setposition(pos); point.activate(); this.attachpoint(point); this.updategradient(); }; gradientaxis.prototype.attachpoint = function attachpoint(point) { // add the first point if (this.firstpoint === null) { this.firstpoint = point; return; } // insert the point into the list var p = this.firstpoint; while (p.nextpoint) { if (point.cssposition < p.cssposition) { point.insertbefore(p); if (point.prevpoint === null) this.firstpoint = point; return; } p = p.nextpoint; }; // test the last point if (point.cssposition < p.cssposition) point.insertbefore(p); else point.insertafter(p); if (point.prevpoint === null) this.firstpoint = point; return; }; gradientaxi...
...And 7 more matches
yield - JavaScript
rv optional retrieves the optional value passed to the generator's next() method to resume its execution.
... the yield keyword causes the call to the generator's next() method to return an iteratorresult object with two properties: value and done.
... once paused on a yield expression, the generator's code execution remains paused until the generator's next() method is called.
...And 7 more matches
Box Objects - Archive of obsolete content
« previousnext » this section describes the box object, which holds display and layout related information about a xul box as well as some details about xul layout.
...recall that dom properties such as childnodes, firstchild, and nextsibling may be used to navigate the document tree.
...the box object provides several properties, firstchild, lastchild, nextsibling, previoussibling, and parentbox.
...And 6 more matches
wizard - Archive of obsolete content
the pages are displayed in the order that they are placed in the wizard, unless you use the next and pageid attributes on the pages to change the sequence.
... values for window type as found on mxr: http://mxr.mozilla.org/mozilla-release/search?string=windowtype navigator:browser - looks like if window has gbrowser it has this window type devtools:scratchpad - scratchpad windows navigator:view-source - the view source windows properties canadvance type: boolean this property is set to true if the user can press the next button to go to the next page.
... if this property is false, the user cannot navigate to the next page.
...And 6 more matches
wizardpage - Archive of obsolete content
attributes description, label, next, pageid properties next, pageid attributes description type: string descriptive text to appear in addition to the dialog title.
... next type: id set to the pageid of the next wizardpage after this one.
... when set, the page with this pageid is displayed when the next button is pressed.
...And 6 more matches
Legacy layout methods - Learn web development
previous overview: css layout next grid systems are a very common feature used in css layouts, and before css grid layout they tended to be implemented using floats or other layout features.
... creating simple legacy grid frameworks the majority of legacy frameworks use the behavior of the float property to float one column up next to another in order to create something that looks like a grid.
... in the next sections we will look at how to create both.
...And 6 more matches
Styling links - Learn web development
previous overview: styling text next when styling links, it is important to understand how to make use of pseudo-classes to style link states effectively, and how to style links for use in common varied interface features such as navigation menus and tabs.
... next, we use the a:link and a:visited selectors to set a couple of color variations on unvisited and visited links, so they are distinct.
... the next two rules use a:focus and a:hover to set focused and hovered links to have different background colors, plus an underline to make the link stand out even more.
...And 6 more matches
Working with Svelte stores - Learn web development
previous overview: client-side javascript frameworks next in the last article we completed the development of our app, finished organizing it into components, and discussed some advanced techniques for dealing with reactivity, working with dom nodes, and exposing component functionality.
... next we import the ondestroy() lifecycle function, which lets us execute a callback after the component has been unmounted.
... first of all, add the following line below your todos array: $: console.log('todos', todos) next, update your todos component call as follows: <todos bind:todos /> remember: <todos bind:todos /> is just a shortcut for <todos bind:todos={todos} />.
...And 6 more matches
Component Internals
« previousnext » where the previous chapter described components from the perspective of a client of xpcom components, this chapter discusses components from the perspective of the software developer.
... read on to see how components are generally implemented in xpcom, or you can skip to the next chapter, where the weblock component tutorial takes you step by step through the component creation process.
... as a component in the xpcom framework illustrates, in addition to the nsgetmodule entry point, there are nsimodule and nsifactory interfaces that control the actual creation of the component, and also the string and xpcom glue parts, which we'll discuss in some detail in the next section (see xpcom glue).
...And 6 more matches
Architecture - Accessibility
in firefox, the results of getendindex will always be the startindex + 1, because links are always just represented by a single embedded object character (c) to get the next char fom a given offset in an accessible text: if current char is 0 (end of string), then we are on a hard line break: get next node (typical depth first search), and set the current offset = 0 iatext::ch = getcharacteratoffset(++offset); if ch == embedded object char (0xfffc) then get object for that offset (see a above), then set the current offset to -1, and go to step 2 if ch == 0 th...
...en we must determine whether we're on a hard line break: if the current accessible's ia2 role is section, heading or paragraph then we are on a hard line break, so stop get the offset in the parent text for this object (see b above), and then repeat step (c)2 above done (d) to get the next word or line: look one character ahead.
... if the next character does not exist, proceed to the next accessible in depth first search order and recurse on the first character until a non-embed is found.
...And 6 more matches
Basic Concepts of grid layout - CSS: Cascading Style Sheets
if you view this example in firefox and inspect the grid, you will see a small icon next to the value grid.
...the next grid definition would create three equal width tracks that grow and shrink according to the available space.
...>three</div> <div>four</div> <div>five</div> </div> .wrapper { display: grid; grid-template-columns: 1fr 1fr 1fr; } * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } in this next example, we create a definition with a 2fr track then two 1fr tracks.
...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.
...that way, the next time someone visits the app from the device, the ui loads from the cache immediately and any new content is requested from the server (if it isn’t available in the cache already).
... we can control what is requested from the server and what is retrieved from the cache with a service worker, which will be explained in detail in the next article — for now let's focus on the structure itself.
...And 6 more matches
How to convert an overlay extension to restartless - Archive of obsolete content
next, what's the minimum version of firefox we should require (preferably an esr)?
... step 2b: audit any remaining resource:// uri usage internal to your extension if you don't need resource:// uris for anything else, then you may be able to skip the next step.
...in current versions it stays unextracted as an xpi.
...And 5 more matches
Building accessible custom components in XUL - Archive of obsolete content
this is not an accessibility requirement; as we'll see in the next section, the actual xul elements are irrelevant because we will define the role of each element in a separate attribute.
...further reading table of supported roles and states in firefox focus issues download stage-3.zip install stage-3.xpi the next step on the road to an accessible spreadsheet is the focus problem.
...(in the next section we'll add support for the arrow keys to move between cells.) that means that we don't want to make every label and description element focusable.
...And 5 more matches
Focus and Selection - Archive of obsolete content
« previousnext » the section will describe how to handle the focus and selection of elements.
...when the tab key is pressed, the next element is given the focus.
...when the user presses tab, the focus will shift to the element with the next highest tab index.
...And 5 more matches
XPCOM Examples - Archive of obsolete content
« previousnext » this section provides some examples of using xpcom along with some additional interfaces.
... next, we get the id attribute for the element.
... cookies next, we will get a list of cookies that have been saved in the browser.
...And 5 more matches
How CSS is structured - Learn web development
previous overview: first steps next now that you are beginning to understanding the purpose and use of css, let's examine the structure of css.
... note: you will learn more about selectors in the next module: css selectors.
...next, change the first p selector to .special to see how it changes the styling.
...And 5 more matches
How CSS works - Learn web development
previous overview: first steps next we have learned the basics of css, what it is for and how to write simple stylesheets.
...the dom is explained in a bit more detail in the next section.
... the updated output is as follows: in our debugging css article in the next module we will be using browser devtools to debug css problems, and will learn more about how the browser interprets css.
...And 5 more matches
Introduction to web APIs - Learn web development
overview: client-side web apis next first up, we'll start by looking at apis from a high level — what are they, how do they work, how to use them in your code, and how are they structured?
... javascript frameworks — the next step up from libraries, javascript frameworks (e.g.
...next, we include a <button> that we'll use to play and stop the music, and an <input> element of type range, which we'll use to adjust the volume of the track while it's playing.
...And 5 more matches
Ember app structure and componentization - Learn web development
previous overview: client-side javascript frameworks next in this article we'll get right on with planning out the structure of our todomvc ember app, adding in the html for it, and then breaking that html structure into components.
... looking at the code next to the rendered todo app, there are a number of ways we could decide how to break up the ui, but let's plan on splitting the html out into the following components: the component groupings are as follows: the main input / "new-todo" (red in the image) the containing body of the todo list + the mark-all-complete button (purple in the image) the mark-all-complete button, explicitly hig...
...hlighted for reasons given below (yellow in the image) each todo is an individual component (green in the image) the footer (blue in the image) something odd to note is that the mark-all-complete checkbox (marked in yellow), while in the "main" section, is rendered next to the "new-todo" input.
...And 5 more matches
React interactivity: Editing, filtering, conditional rendering - Learn web development
previous overview: client-side javascript frameworks next as we near the end of our react journey (for now at least), we'll add the finishing touches to the main areas of functionality in our todo list app.
...add the following line just inside the top of your todo(props) { … } component definition: const [isediting, setediting] = usestate(false); next, we're going to rethink the <todo /> component — from now on, we want it to display one of two possible “templates", rather than the single template it's used so far: the "view" template, when we are just viewing a todo; this is what we’ve used in rest of the tutorial so far.
...to see the editing template, you will have to change the default isediting state from false to true in your code for now; we will look at making the edit button toggle this in the next section!
...And 5 more matches
Creating our first Vue component - Learn web development
previous overview: client-side javascript frameworks next now it's time to dive deeper into vue, and create our own custom component — we'll start by creating a component to represent each item in the todo list.
... next add a type field with a value of boolean.
...next we'll move on to how vue persists data state.
...And 5 more matches
Setting up your own test automation environment - Learn web development
next, we need to install a framework to allow us to work with selenium from inside node.
... next, you need to download the relevant drivers to allow webdriver to control the browsers you want to test.
... starting a new test to start up a new test, you need to include the selenium-webdriver module like this: const webdriver = require('selenium-webdriver'), by = webdriver.by, until = webdriver.until; next, you need to create a new instance of a driver, using the new webdriver.builder() constructor.
...And 5 more matches
Mozilla accessibility architecture
this tree traversal is accomplished via toolkit-specific calls which end up as calls into nsiaccessible methods getaccparent(), getaccnextsibling(), getaccprevioussibling(), getaccfirstchild(), getacclastchild(), getaccchildcount() and getchildat(childnum).
...if nsnull is returned than the tree walker checks the next node, in depth first order.
...in that case we also override ::getaccnextsibling(), ::getaccprevioussibling() for the dom-less children; otherwise they do not know how to find each other.
...And 5 more matches
Application cache implementation overview
if so, the update switches to downloading state and fetches in parallel items listed in the manifest by call to nsofflinecacheupdate::processnexturi().
... the parallel load is implemented by asynchronous recursive calls to processnexturi(), a method searching always a single entry that is scheduled to load.
...processnexturi then invokes it self asynchronously via dispatch to a main thread when not already on the concurrency limit of 15 loads.
...And 5 more matches
source-editor.jsm
method overview initialization and destruction void destroy(); void init(element aelement, object aconfig, function acallback); search operations number find(string astring, [optional] object options); number findnext(boolean awrap); number findprevious(boolean awrap); event management void addeventlistener(string aeventtype, function acallback); void removeeventlistener(string aeventtype, function acallback); undo stack operations boolean canredo(); boolean canundo(); void endcompoundchange(); boolean redo(); void resetu...
... lastfind object an object describing the result of the last find operation performed using the find(), findnext(), or findprevious() method.
... lastfound number the index of the previous location at which str was found, for multiple find operations (such as find() followed by findnext()).
...And 5 more matches
nsIDNSRecord
inherits from: nsisupports last changed in gecko 1.7 method overview prnetaddr getnextaddr(in pruint16 aport); native code only!
... acstring getnextaddrasstring(); boolean hasmore(); void rewind(); attributes attribute type description canonicalname acstring for example, www.mozilla.org --> rheet.mozilla.org.
... methods native code only!getnextaddr this function copies the value of the next ip address into the given prnetaddr struct and increments the internal address iterator.
...And 5 more matches
Examine and edit CSS - Firefox Developer Tools
a warning icon appears next to unsupported css properties or rules that have invalid values.
... highlight matched elements: next to the selector is a target icon: click this to highlight all nodes in the page that match this selector.
... filter rules containing this property: next to overridden declarations is an icon you can click to filter the rules list to show only those rules that include that property.
...And 5 more matches
about:debugging - Firefox Developer Tools
next, disable every debugging setting already activated and repeat the steps described before.
... to start a debugging session, first open the page that you wish to debug and then click connect next to the device name to open a connection to it.
...to debug the contents of one of these tabs, click the inspect button next to its title.
...And 5 more matches
Using readable streams - Web APIs
for example, our simple stream pump example goes on to enqueue each chunk in a new, custom readablestream (we will find more about this in the next section), then create a new response out of it, consume it as a blob, create an object url out of that blob using url.createobjecturl(), and then display it on screen in an <img> element, effectively creating a copy of the image we originally fetched.
... return new readablestream({ start(controller) { return pump(); function pump() { return reader.read().then(({ done, value }) => { // when no more data needs to be consumed, close the stream if (done) { controller.close(); return; } // enqueue the next data chunk into our target stream controller.enqueue(value); return pump(); }); } } }) }) .then(stream => new response(stream)) .then(response => response.blob()) .then(blob => url.createobjecturl(blob)) .then(url => console.log(image.src = url)) .catch(err => console.error(err)); let’s look in detail at how read() is used.
... next, we check whether done is true.
...And 5 more matches
A basic 2D WebGL animation example - Web APIs
fragment shader next comes the fragment shader.
... we'll look at how this works next.
... the array of vertices is created next, as a float32array with six coordinates (three 2d vertices) per triangle to be drawn, for a total of 12 values.
...And 5 more matches
function* - JavaScript
when the iterator's next() method is called, the generator function's body is executed until the first yield expression, which specifies the value to be returned from the iterator or, with yield*, delegates to another generator function.
... the next() method returns an object with a value property containing the yielded value and a done property which indicates whether the generator has yielded its last value, as a boolean.
... calling the next() method with an argument will resume the generator function execution, replacing the yield expression where an execution was paused with the argument from next().
...And 5 more matches
Enhanced Extension Installation - Archive of obsolete content
if it is, a small set of metadata about it is written to the appropriate datasource (name, version, a flag to tell the system to properly install it on the next startup), and it is added to the appropriate type container.
... the system also writes a .autoreg file to the profile folder which tells the startup system that something has changed on the next restart.
... finalization for themes, the item is immediately installed fully, rather than awaiting the next restart, since themes do not supply xpcom components, preferences defaults etc.
...And 4 more matches
Editor Embedding Guide - Archive of obsolete content
cmd_selectlinenext scrolls relative to the current selection end point.
... cmd_selectcharnext scrolls relative to the current selection end point.
... cmd_selectwordnext scrolls relative to the current selection end point.
...And 4 more matches
Venkman Introduction - Archive of obsolete content
venkman's keyboard shortcuts are the same as leading visual debugging environments, and gdb users should be familiar with venkman's /break, /step, /next, /finish, /frame, and /where commands.
...these commands should be self explanatory, with the possible exception of stop, which causes the debugger to stop when the next line of javascript is executed, and the profile button, which can be used to measure execution times for your scripts.
... when you enable profiling by clicking this button, a green checkmark appears next to the button and profile data for every function is collected, and can be saved by choosing save profile data as...
...And 4 more matches
Creating a Wizard - Archive of obsolete content
« previousnext » many applications use wizards to help the user through complex tasks.
...the user can navigate between the pages of the wizard with the back and next buttons.
... there are also related onwizardback, onwizardnext and onwizardcancel attributes, which are called when the back, next and cancel buttons are pressed respectively.
...And 4 more matches
Install Scripts - Archive of obsolete content
« previousnext » this section describes the install script.
... next, we need to set the directory where the files will be installed.
...setting install files next, you need to specify which files should be installed.
...And 4 more matches
Using Spacers - Archive of obsolete content
« previousnext » in this section, we will find out how to add some spacing in between the elements we have created.
...we'll talk more about this in the next section but it essentially allows you to divide a window into a series of boxes that hold elements.
...if one element has a flex of 1 and the next one has a flex of 2, the second one will grow at twice the rate of the first one.
...And 4 more matches
Flexbox - Learn web development
previous overview: css layout next flexbox is a one-dimensional layout method for laying out items in rows or columns.
...the element we've given a display value of flex to is acting like a block-level element in terms of how it interacts with the rest of the page, but its children are being laid out as flex items — the next section will explain in more detail what this means.
...e way in which you can fix this is to add the following declaration to your <section> rule: flex-wrap: wrap; also, add the following declaration to your <article> rule: flex: 200px; try this now; you'll see that the layout looks much better with this included: we now have multiple rows — as many flexbox children are fitted onto each row as makes sense, and any overflow is moved down to the next line.
...And 4 more matches
Practical positioning examples - Learn web development
next, add the following just below your previous css: .info-box { width: 450px; height: 400px; margin: 0 auto; } this sets a specific width and height on the content, and centers it on the screen using the old margin: 0 auto trick.
... next, we'll style the horizontal tabs — the list items are all floated left to make them sit in a line together, their list-style-type is set to none to get rid of the bullets, and their width is set to 150px so they will comfortably fit across the info-box.
...place the following css below your other styles: .info-box li a:focus, .info-box li a:hover { background-color: #a60000; color: white; } .info-box li a.active { background-color: #a60000; color: white; } styling the panels the next job is to style our panels.
...And 4 more matches
Basic native form controls - Learn web development
previous overview: forms next in the previous article, we marked up a functional web form example, introducing some form controls and common structural elements, and focusing on accessibility best practices.
... next we will look at the functionality of the different form controls, or widgets, in detail — studying all the different options available to collect different types of data.
...we cover newer form controls added in html5 in the next two articles.
...And 4 more matches
Graceful asynchronous programming with Promises - Learn web development
previous overview: asynchronous next promises are a comparatively new feature of the javascript language that allow you to defer further actions until after a previous action has completed, or respond to its failure.
...the application has a window with a list of the user's friends, and clicking on a button next to a user starts a video call to that user.
... note: you can make further improvements with async/await syntax, which we'll dig into in the next article.
...And 4 more matches
Fetching data from the server - Learn web development
previous overview: client-side web apis next another very common task in modern websites and applications is retrieving individual data items from the server to update sections of a webpage without having to load an entire new page.
...add the following below your previous lines inside your updatedisplay() function: let request = new xmlhttprequest(); next, you need to use the open() method to specify what http request method to use to request the resource from the network, and what its url is.
...add this below your previous line: request.open('get', url); next, we'll set the type of response we are expecting — which is defined by the request's responsetype property — as text.
...And 4 more matches
Video and Audio APIs - Learn web development
previous overview: client-side web apis next html5 comes with elements for embedding rich media in documents — <video> and <audio> — which in turn come with their own apis for controlling playback, seeking, etc.
...in the next section we'll look at the basic tools we have available to do this.
... next, let's look at our button icons: @font-face { font-family: 'heydingscontrolsregular'; src: url('fonts/heydings_controls-webfont.eot'); src: url('fonts/heydings_controls-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/heydings_controls-webfont.woff') format('woff'), url('fonts/heydings_controls-webfont.ttf') format('truetype'); font-weight: normal; font...
...And 4 more matches
Componentizing our Svelte app - Learn web development
previous overview: client-side javascript frameworks next in the last article we started developing our todo list app.
...go to this file now, and add the following import statement below your previous one: import todo from './todo.svelte' next, we need to update our {#each} block to include a <todo> component for each todo, rather than the code that has been moved out to todo.svelte.
... next we'll create different functions to handle each user action.
...And 4 more matches
Dynamic behavior in Svelte: working with variables and props - Learn web development
previous overview: client-side javascript frameworks next now that we have our markup and styles ready we can start developing the required features for our svelte to-do list app.
... update the <input type="checkbox"> element inside src/components/todos.svelte as follows: <input type="checkbox" id="todo-{todo.id}" on:click={() => todo.completed = !todo.completed} checked={todo.completed} /> next we'll add a function to remove a todo from our todos array.
... adding new todos now onto the next major task for this article — let's add some functionality for adding new todos.
...And 4 more matches
Handling common JavaScript problems - Learn web development
previous overview: cross browser testing next now we'll look at common cross-browser javascript problems and how to fix them.
... when developers make use of new/nascent javascript features (for example ecmascript 6 / ecmascript next features, modern web apis...) in their code, and find that such features don't work in older browsers.
... after the packages have finished installing, try loading up a javascript file: you'll see any issues highlighted with green (for warnings) and red (for errors) circles next to the line numbers, and a separate panel at the bottom provides line numbers, error messages, and sometimes suggested values or other fixes.
...And 4 more matches
Using XPCOM Components
« previousnext » one of the best ways to begin working with xpcom - especially when you are designing the interface to a component that will be used by others, as we do in starting weblock - is to look at how clients are already using xpcom components.
... the webbrowserfind component components are used all over - in high-level browser-like functionality such as nswebbrowserfind, which provides find() and findnext() methods for finding content in web pages, and in low-level tasks such as the manipulation of data.
... the nsiwebbrowserfind interface findnext find the next occurrence of the search string.
...And 4 more matches
IAccessibleTable
method overview [propget] hresult accessibleat([in] long row, [in] long column, [out] iunknown accessible ); [propget] hresult caption([out] iunknown accessible ); [propget] hresult childindex([in] long rowindex, [in] long columnindex, [out] long cellindex ); [propget] hresult columndescription([in] long column, [out] bstr description ); [propget] hresult columnextentat([in] long row, [in] long column, [out] long ncolumnsspanned ); [propget] hresult columnheader([out] iaccessibletable accessibletable, [out] long startingrowindex ); [propget] hresult columnindex([in] long cellindex, [out] long columnindex ); [propget] hresult iscolumnselected([in] long column, [out] boolean isselected ); [propget] hresult isrowselected([in] long row, [out] boolean is...
...sselected ); [propget] hresult modelchange([out] ia2tablemodelchange modelchange ); [propget] hresult ncolumns([out] long columncount ); [propget] hresult nrows([out] long rowcount ); [propget] hresult nselectedchildren([out] long cellcount ); [propget] hresult nselectedcolumns([out] long columncount ); [propget] hresult nselectedrows([out] long rowcount ); [propget] hresult rowcolumnextentsatindex([in] long index, [out] long row, [out] long column, [out] long rowextents, [out] long columnextents, [out] boolean isselected ); [propget] hresult rowdescription([in] long row, [out] bstr description ); [propget] hresult rowextentat([in] long row, [in] long column, [out] long nrowsspanned ); [propget] hresult rowheader([out] iaccessibletable accessibletable, [out] long startingco...
...columnextentat() returns the number of columns occupied by the accessible object at the specified row and column in the table.
...And 4 more matches
nsIEditorSpellCheck
tionary(in wstring word); boolean canspellcheck(); void checkcurrentdictionary(); boolean checkcurrentword(in wstring suggestedword); boolean checkcurrentwordnosuggest(in wstring suggestedword); astring getcurrentdictionary(); void getdictionarylist([array, size_is(count)] out wstring dictionarylist, out pruint32 count); wstring getnextmisspelledword(); void getpersonaldictionary(); wstring getpersonaldictionaryword(); wstring getsuggestedword(); void ignorewordalloccurrences(in wstring word); void initspellchecker(in nsieditor editor, in boolean enableselectionchecking); void removewordfromdictionary(in wstring word); void replaceword(in wstring misspelledword, in w...
... getnextmisspelledword() when interactively spell checking the document, this will return the value of the next word that is misspelled.
...wstring getnextmisspelledword(); parameters none.
...And 4 more matches
nsIThreadObserver
last changed in gecko 1.9 (firefox 3) inherits from: nsisupports method overview void afterprocessnextevent(in nsithreadinternal thread, in unsigned long recursiondepth); void ondispatchedevent(in nsithreadinternal thread); void onprocessnextevent(in nsithreadinternal thread, in boolean maywait, in unsigned long recursiondepth); methods afterprocessnextevent() called by the nsithread method nsithread.processnextevent() after an event is processed.
... void afterprocessnextevent( in nsithreadinternal thread, in unsigned long recursiondepth ); parameters thread the nsithread on which the event was processed.
... recursiondepth the number of calls to nsithread.processnextevent() on the call stack in addition to the current call.
...And 4 more matches
Network request list - Firefox Developer Tools
if the request used ssl/tls and the connection had security weaknesses such as weak ciphers, you'll see a warning triangle next to the domain.
... there's an icon next to the domain that gives you extra information about the security status of that request.
... other actions you can take with request blocking: to turn all request blocking off or on: toggle the checkbox next to enable request blocking.
...And 4 more matches
about:debugging (before Firefox 68) - Firefox Developer Tools
next to each entry is a button labeled "debug".
... before firefox 48 if you change files that are loaded on demand, like content scripts or popups, then changes you make are picked up automatically, and you'll see them the next time the content script is loaded or the popup is shown.
... firefox 48 onwards from firefox 48 onwards: as before: if you change files that are loaded on demand, like content scripts or popups, then changes you make are picked up automatically, and you'll see them the next time the content script is loaded or the popup is shown.
...And 4 more matches
Using IndexedDB - Web APIs
now, assuming that the user allowed your request to create a database, and you've received a success event to trigger the success callback; what's next?
...next, you need to decide if you're going to make changes to the database or if you just need to read from it.
...if you wish to filter out duplicates during cursor iteration over indexes, you can pass nextunique (or prevunique if you're going backwards) as the direction parameter.
...And 4 more matches
HTML attribute: rel - HTML: Hypertext Markup Language
WebHTMLAttributesrel
external resource not allowed not allowed next indicates that the current document is a part of a series, and that the next document in the series is the referenced document.
...if the most appropriate icon is later found to be inappropriate, for example because it uses an unsupported format, the browser proceeds to the next-most appropriate, and so on.
... note: the obsolete rev="made" is treated as rel="alternate" bookmark relevant as the rel attribute value for the <a> and <area> elements, the bookmark provides a permalink for ancestor section, which is the nearest ancestor <article> or <section>, if there is at least one, otherwise, the nearest heading sibling or ancestor descendant, to the next..
...And 4 more matches
Link prefetching FAQ - HTTP
the browser looks for either an html <link> or an http link: header with a relation type of either next or prefetch.
...for example, the next document might contain several large images.
... some more examples follow: <link rel="prefetch alternate stylesheet" title="designed for mozilla" href="mozspecific.css"> <link rel="next" href="2.html"> are anchor (<a>) tags prefetched?
...And 4 more matches
Details of the object model - JavaScript
« previousnext » javascript is an object-based language based on prototypes, rather than being class-based.
...next, you define the manager constructor function, calling the employee constructor and specifying the reports property.
...he following examples) class employee { constructor() { this.name = ''; this.dept = 'general'; } } javascript ** (use this instead) function employee() { this.name = ''; this.dept = 'general'; } java public class employee { public string name = ""; public string dept = "general"; } the manager and workerbee definitions show the difference in how to specify the next object higher in the inheritance chain.
...And 4 more matches
Introduction to using XPath in JavaScript - XPath
to be returned in 3 principal different types: iterators snapshots first nodes iterators when the specified result type in the resulttype parameter is either: unordered_node_iterator_type ordered_node_iterator_type the xpathresult object returned is a node-set of matched nodes which will behave as an iterator, allowing us to access the individual nodes contained by using the iteratenext() method of the xpathresult.
... once we have iterated over all of the individual matched nodes, iteratenext() will return null.
... iterator example var iterator = document.evaluate('//phonenumber', documentnode, null, xpathresult.unordered_node_iterator_type, null ); try { var thisnode = iterator.iteratenext(); while (thisnode) { alert( thisnode.textcontent ); thisnode = iterator.iteratenext(); } } catch (e) { alert( 'error: document tree modified during iteration ' + e ); } snapshots when the specified result type in the resulttype parameter is either: unordered_node_snapshot_type ordered_node_snapshot_type the xpathresult object returned is a static node-set of matched node...
...And 4 more matches
Compiling from Rust to WebAssembly - WebAssembly
next, cargo has generated some rust code for us in src/lib.rs: #[cfg(test)] mod tests { #[test] fn it_works() { assert_eq!(2 + 2, 4); } } we won't use this test code at all, so go ahead and delete it.
...we use these features in the next section.
... before we move on to the next section, we should talk a bit more about wasm-bindgen.
...And 4 more matches
Chapter 6: Firefox extensions and XUL applications - Archive of obsolete content
use step over to avoid a function, and step into to always call it; once you are done investigating a function, use step out, and then you can step into the next function.
... set breakpoints in locations of interest where you’re not sure what’s going on, and the next time you run it, use continue to shift to that location and start investigating again.
...next, click the edit button to set up the “2 1+” test case (listing 2).
...And 3 more matches
Tamarin Build System Documentation - Archive of obsolete content
tamarin-redux mercurial builds are displayed in the top 3 sections: compile, smoke, test sandbox builds are displayed in next 3 sections: sandbox compile, sandbox smoke, sandbox test tamarin-central is considered a "sandbox" and will appear under sandbox phase what are the build phases?
... the next phase is started when all slaves have completed the previous phase successfully.
... the phases run when slaves are available and the other phases do not wait for completion to start the next build.
...And 3 more matches
RDF Modifications - Archive of obsolete content
« previousnext » one of the most useful aspects of using templates with rdf datasources is that when the rdf datasource changes, for instance a new triple is added, or a triple is removed, the template updates accordingly, adding or removing result output as needed.
...the next statement is a triple involving the 'http://purl.org/dc/elements/1.1/title' predicate.
...the subject and object are variables so the builder accepts this as a possible change, and moves on to the next step.
...And 3 more matches
Content Panels - Archive of obsolete content
« previousnext » in this section, we'll look at how to add panels that can display html pages or other xul files.
...each time the user clicks the next button, the next screen of the wizard is displayed.
...second, the elements such the back and next buttons are the same throughout the interface.
...And 3 more matches
Creating a Window - Archive of obsolete content
« previousnext » we're going to be creating a simple find files utility throughout this tutorial.
...those will be added in the next section.
...we'll add some of these in the next set of sections.
...And 3 more matches
Document Object Model - Archive of obsolete content
« previousnext » the document object model (dom) can be used with xul elements to get information about them or modify them.
... next, let's add a function that is called when the find button is pressed.
...some common properties are listed below: firstchild reference to the first child node of an element lastchild reference to the last child node of an element childnodes holds a list of the children of an element parentnode reference to the parent of an node nextsibling reference to the next sibling in sequence previoussibling reference to the previous sibling in sequence these properties allow you to navigate through a document is various ways.
...And 3 more matches
XUL Structure - Archive of obsolete content
« previousnext » we'll begin by looking at how the xul is handled in mozilla.
...we'll look more at the syntax of a chrome url in the next section.
... the next few sections describe the basic structure of a chrome package which can be installed into mozilla.
...And 3 more matches
Back to the Server: Server-Side JavaScript On The Rise - Archive of obsolete content
in fact, the next javascript engine from mozilla, tracemonkey, is poised to boost javascript performance by factors of 20 to 40 times according to brendan eich, mozilla cto and the creator of javascript.
...onnection to the database var conn = drivermanager.getconnection( "jdbc:mysql://localhost/rhino", "urhino", "prhino" ); // create a statement handle var stmt = conn.createstatement(); // get a resultset var rs = stmt.executequery( "select * from employee" ); // get the metadata from the resultset var meta = rs.getmetadata(); // loop over the records, dump out column names and values while( rs.next() ) { for( var i = 1; i <= meta.getcolumncount(); i++ ) { print( meta.getcolumnname( i ) + ": " + rs.getobject( i ) + "\n" ); } print( "----------\n" ); } // cleanup rs.close(); stmt.close(); conn.close(); this code starts off by using a rhino function named importpackage which is just like using the import statement in java.
...next we’ll take a look at another powerful feature in rhino, e4x processing.
...And 3 more matches
Desktop gamepad controls - Game development
previous overview: control mechanisms next now we'll look at adding something extra — support for gamepad controls, via the gamepad api.
...next, we'll consider the gamepadbuttonpressedhandler() function: function gamepadbuttonpressedhandler(button) { var press = false; for(var i=0; i<buttonspressed.length; i++) { if(buttonspressed[i] == button) { press = true; } } return press; } the function takes a button as a parameter; in the loop it checks if the given button's number is among the curren...
... next, in the draw() function we do two things — execute the gamepadupdatehandler() function to get the current state of pressed buttons on every frame, and use the gamepadbuttonpressedhandler() function to check the buttons we are interested to see whether they are pressed, and do something if they are: function draw() { ctx.clearrect(0, 0, canvas.width, canvas.height); // ...
...And 3 more matches
Move the ball - Game development
« previousnext » this is the 2nd step out of 10 of the gamedev canvas tutorial.
... first, add the following two lines above your draw() function, to define x and y: var x = canvas.width/2; var y = canvas.height-30; next update the draw() function to use the x and y variables in the arc() method, as shown in the following highlighted line: function draw() { ctx.beginpath(); ctx.arc(x, y, 10, 0, math.pi*2); ctx.fillstyle = "#0095dd"; ctx.fill(); ctx.closepath(); } now comes the important part: we want to add a small value to x and y after every frame has been drawn to make it appear that the...
...every 10 milliseconds the canvas is cleared, the blue circle (our ball) will be drawn on a given position and the x and y values will be updated for the next frame.
...And 3 more matches
Accessible multimedia - Learn web development
previous overview: accessibility next another category of content that can create accessibility problems is multimedia — video, audio, and image content need to be given proper textual alternatives so they can be understood by assistive technologies and their users.
... we will first need to store references to each of the controls — add the following to the top of your javascript file: const playpausebtn = document.queryselector('.playpause'); const stopbtn = document.queryselector('.stop'); const rwdbtn = document.queryselector('.rwd'); const fwdbtn = document.queryselector('.fwd'); const timelabel = document.queryselector('.time'); next, we need to grab a reference to the video/audio player itself — add this line below the previous lines: const player = document.queryselector('video'); this holds a reference to a htmlmediaelement object, which has several useful properties and methods available on it that can be used to wire up functionality to our buttons.
...add it to your code, at the bottom: playpausebtn.onclick = function() { if(player.paused) { player.play(); playpausebtn.textcontent = 'pause'; } else { player.pause(); playpausebtn.textcontent = 'play'; } }; next, add this code to the bottom, which controls the stop button: stopbtn.onclick = function() { player.pause(); player.currenttime = 0; playpausebtn.textcontent = 'play'; }; there is no stop() function available on htmlmediaelements, so instead we pause() it, and at the same time set the currenttime to 0.
...And 3 more matches
CSS basics - Learn web development
previous overview: getting started with the web next css (cascading style sheets) is the code that styles web content.
... within each ruleset, you must use a semicolon (;) to separate each declaration from the next one.
... next, delete the existing rule you have in your style.css file.
...And 3 more matches
Document and website structure - Learn web development
previous overview: introduction to html next in addition to defining individual parts of your page (such as "a paragraph" or "an image"), html also boasts a number of block level elements used to define areas of your website (such as "the header", "the navigation menu", "the main content column").
...scared, but determined to protect his friends, he raised his wand and prepared to do battle, hoping that his distress call had made it through.</p> <hr> <p>meanwhile, harry was sitting at home, staring at his royalty statement and pondering when the next spin off series would come out, when an enchanted distress letter flew through his window and landed in his lap.
... he read it hazily and sighed; "better get back to work then", he mused.</p> would render like this: planning a simple website once you've planned out the structure of a simple webpage, the next logical step is to try to work out what content you want to put on a whole website, what pages you need, and how they should be arranged and link to one another for the best possible user experience.
...And 3 more matches
HTML table basics - Learn web development
LearnHTMLTablesBasics
overview: tables next this article gets you started with html tables, covering the very basics such as rows and cells, headings, making cells span multiple columns and rows, and how to group together all the cells in a column for styling purposes.
... tables headers also have an added benefit — along with the scope attribute (which we'll learn about in the next article), they allow you to make tables more accessible by associating each header with all the data in the same row or column.
...in some cases, we want to show the names of the males and females next to the animal name.
...And 3 more matches
Looping code - Learn web development
previous overview: building blocks next programming languages are very useful for rapidly completing repetitive tasks, from multiple basic calculations to just about any other situation where you've got a lot of similar items of work to complete.
... when i becomes equal to cats.length (in this case, 5), the loop will stop, and the browser will move on to the next bit of code below the loop.
... next, we attach an event listener to the button (btn), so that when it is pressed, some code is run to perform the search and return the results.
...And 3 more matches
Object building practice - Learn web development
previous overview: objects next in previous articles we looked at all the essential javascript object theory and syntax details, giving you a solid base to start from.
... next, we set constants called width and height, and the width and height of the canvas element (represented by the canvas.width and canvas.height properties) to equal the width and height of the browser viewport (the area that the webpage appears on — this can be gotten from the window.innerwidth and window.innerheight properties).
... next, we use fillstyle to define what color we want the shape to be — we set it to our ball's color property.
...And 3 more matches
Object prototypes - Learn web development
previous overview: objects next prototypes are the mechanism by which javascript objects inherit features from one another.
...in the next article, we talk about the modern way of doing things, which provides easier syntax to achieve the same things — see ecmascript 2015 classes.
... as you will see in the next section, properties defined on the person.prototype property (or in general on a constructor function's prototype property, which is an object, as mentioned in the above section) become available to all the instance objects created using the person() constructor.
...And 3 more matches
Introduction to client-side frameworks - Learn web development
overview: client-side javascript frameworks next we begin our look at frameworks with a general overview of the area, looking at a brief history of javascript and frameworks, why frameworks exist and what they give us, how to start thinking about choosing a framework to learn, and what alternatives there are to client-side frameworks.
...angular uses typescript, a superset of javascript that we’ll look at in a little more detail in the next chapter.
...check out next.js for react, nuxt.js for vue (yes it is confusing, and no, these projects are not related!), fastboot for ember, and angular universal for angular.
...And 3 more matches
Vue conditional rendering: editing existing todos - Learn web development
previous overview: client-side javascript frameworks next now it is time to add one of the major parts of functionality that we're still missing — the ability to edit existing todo items.
... first of all add v-if="!isediting" to the root <div> in your todoitem component, <div class="stack-small" v-if="!isediting"> next, below that <div>'s closing tag add the following line: <to-do-item-edit-form v-else :id="id" :label="label"></to-do-item-edit-form> we also need to import and register the todoitemeditform component, so we can use it inside this template.
... add it now, below your existing methods: itemedited(newlabel) { this.$emit('item-edited', newlabel); this.isediting = false; } next, we'll need an editcancelled() method.
...And 3 more matches
Getting started with Vue - Learn web development
previous overview: client-side javascript frameworks next now let's introduce vue, the third of our frameworks.
... next you’ll select a config for the linter / formatter.
... next you are asked to configure what kind of automated linting we want.
...And 3 more matches
Rendering a list of Vue components - Learn web development
previous overview: client-side javascript frameworks next at this point we've got a fully working component; we're now ready to add multiple todoitem components to our app.
... import lodash.uniqueid into your app component in the same way you did with your todoitem component, using import uniqueid from 'lodash.uniqueid'; next, add an id field to each element in your todoitems array, and assign each of them a value of uniqueid('todo-').
... what we really need next is the ability to allow our users to enter their own todo items into the app, and for that we'll need a text <input>, an event to fire when the data is submitted, a method to fire upon submission to add the data and rerender the list, and a model to control the data.
...And 3 more matches
Styling Vue components with CSS - Learn web development
previous overview: client-side javascript frameworks next the time has finally come to make our app look a bit nicer.
..."] { border-radius: 0; } body { width: 100%; max-width: 68rem; margin: 0 auto; font: 1.6rem/1.25 "helvetica neue", helvetica, arial, sans-serif; background-color: #f5f5f5; color: #4d4d4d; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } @media screen and (min-width: 620px) { body { font-size: 1.9rem; line-height: 1.31579; } } /*end resets*/ next, in your src/main.js file, import the reset.css file like so: import './assets/reset.css'; this will cause the file to get picked up during the build step and automatically added to our site.
... to use the scoped modifier, create a <style> element inside todoitem.vue, at the bottom of the file, and give it a scoped attribute: <style scoped> </style> next, copy the following css into the newly created <style> element: .custom-checkbox > .checkbox-label { font-family: arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-weight: 400; font-size: 16px; font-size: 1rem; line-height: 1.25; color: #0b0c0c; display: block; margin-bottom: 5px; } .custom-checkbox > .checkbox { font-family: a...
...And 3 more matches
Browser API
htmliframeelement.goforward() changes the location of the <iframe> for the next location in its browsing history.
... management methods the next set of methods manage the resources used by a browser <iframe>.
... the methods removed in firefox 65 are: htmliframeelement.addnextpaintlistener() defines a handler to listen for the next mozafterpaint event in the browser <iframe>.
...And 3 more matches
Application Translation with Mercurial
next check what is still untranslated by going to localization status page and click on the page for your language.
... read the text next to it.
...either translate a different product now or contact the person responsible for localization from the team's page (see above) so he can notify you by mail when the next strings for translation become available.
...And 3 more matches
Bootstrapping a new locale
install the compare-locales utility the next step is to install compare-locales.
... clone the source code the next step is to download a copy of the source code to your local system, using mercurial.
... create a bare-bones localization next, create a base localization.
...And 3 more matches
Localization technical reviews
the merge date for migrating from one product release channel to the next (e.g., aurora to beta, or beta to release) is rapidly approaching.
... you need to make sure that your work can effectively be compiled into a build for the next release channel.
...from the dropdown menu next to the review flag.
...And 3 more matches
Setting up the Gecko SDK
« previousnext » this chapter provides basic setup information for the gecko software development kit (sdk) used to build the weblock component in this tutorial.
... ispecialthing.idl #include "nsisupports.idl" [scriptable, uuid(263ed1ba-5cc1-11db-9673-00e08161165f)] interface ispecialthing : nsisupports { attribute astring name; long add(in long a, in long b); }; next is to build the .h file to compile against and the .xpt for gecko to understand your new interface.
... next is the module code, this code is the entry point into your dll/component.
...And 3 more matches
Using XPCOM Utilities to Make Things Easier
« previousnext » this chapter goes back over the code you've already created in the first part of the tutorial (see weblock1.cpp in the previous chapter) and uses xpcom tools that make coding a lot easier and more efficient.
...many cids take the following form: #define ns_ioservice_cid \ { /* 9ac9e770-18bc-11d3-9337-00104ba0fd40 */ \ 0x9ac9e770, \ 0x18bc, \ 0x11d3, \ {0x93, 0x37, 0x00, 0x10, 0x4b, 0xa0, 0xfd, 0x40} \ } the next entry is the contract id string, which is also usually defined in a #define in a header file.
... // in idl: method(in acstring thing); char* str = "how now brown cow?"; nsembedcstring data(str); rv = object->method(data); in this next example, the method is going to set the value of the string - as it might need to do when it returns the name of the current user or the last viewed url.
...And 3 more matches
Introduction to XPCOM for the DOM
an usual pointer to an interface nsifoo is declared as follows: nsifoo *fooptr; an nscomptr to the same nsifoo interface is declared as follows: nscomptr<nsifoo> fooptr; the rest of the use of nscomptr's is described in the next section.
... the next section is a tutorial on how to add a new interface to the mozilla dom, with build instructions et al, and the last section is a discussion of the more advanced topics of object-oriented c++ , interface inheritance, and other fun stuff.
...next we will describe the build system, makefiles, etc...
...And 3 more matches
IAccessible2
1.0 66 introduced gecko 1.9 inherits from: iaccessible last changed in gecko 1.9 (firefox 3) method overview [propget] hresult attributes([out] bstr attributes ); [propget] hresult extendedrole([out] bstr extendedrole ); [propget] hresult extendedstates([in] long maxextendedstates, [out, size_is(,maxextendedstates), length_is(, nextendedstates)] bstr extendedstates, [out] long nextendedstates ); [propget] hresult groupposition([out] long grouplevel, [out] long similaritemsingroup, [out] long positioningroup ); [propget] hresult indexinparent([out] long indexinparent ); [propget] hresult locale([out] ia2locale locale ); [propget] hresult localizedextendedrole([out] bstr localizedextendedrole ); [propget] hresult loc...
...alizedextendedstates([in] long maxlocalizedextendedstates, [out, size_is(,maxlocalizedextendedstates), length_is(, nlocalizedextendedstates)] bstr localizedextendedstates, [out] long nlocalizedextendedstates ); [propget] hresult nextendedstates([out] long nextendedstates ); [propget] hresult nrelations([out] long nrelations ); [propget] hresult relation([in] long relationindex, [out] iaccessiblerelation relation ); [propget] hresult relations([in] long maxrelations, [out, size_is(maxrelations), length_is( nrelations)] iaccessiblerelation relations, [out] long nrelations ); hresult role([out] long role ); hresult scrollto([in] enum ia2scrolltype scrolltype ); hresult scrolltopoint([in] enum ia2coordinatetype coordinatetype, [in] long x, [in] long y ); [propget] hresult states([o...
...[propget] hresult extendedstates( [in] long maxextendedstates, [out, size_is(,maxextendedstates), length_is(, nextendedstates)] bstr extendedstates, [out] long nextendedstates ); parameters maxextendedstates this parameter is ignored.
...And 3 more matches
IAccessibleTableCell
1.0 66 introduced gecko 1.9.2 inherits from: iunknown last changed in gecko 1.9.2 (firefox 3.6 / thunderbird 3.1 / fennec 1.0) method overview [propget] hresult columnextent([out] long ncolumnsspanned ); [propget] hresult columnheadercells([out, size_is(, ncolumnheadercells,)] iunknown cellaccessibles, [out] long ncolumnheadercells ); [propget] hresult columnindex([out] long columnindex ); [propget] hresult isselected([out] boolean isselected ); [propget] hresult rowcolumnextents([out] long row, [out] long column, [out] long rowextents, [out] long columnextents, [out] boolean isselected ); [propget] hresult rowextent([out] ...
...long nrowsspanned ); [propget] hresult rowheadercells([out, size_is(, nrowheadercells,)] iunknown cellaccessibles, [out] long nrowheadercells ); [propget] hresult rowindex([out] long rowindex ); [propget] hresult table([out] iunknown table ); methods columnextent() returns the number of columns occupied by this cell accessible.
...[propget] hresult columnextent( [out] long ncolumnsspanned ); parameters ncolumnsspanned returns the 1 based column extent of the specified cell.
...And 3 more matches
nsIAuthModule
inherits from: nsisupports last changed in gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) method overview void getnexttoken([const] in voidptr aintoken, in unsigned long aintokenlength, out voidptr aouttoken, out unsigned long aouttokenlength); void init(in string aservicename, in unsigned long aserviceflags, in wstring adomain, in wstring ausername, in wstring apassword); void unwrap([const] in voidptr aintoken, in unsigned long aintokenlength, out voidptr aouttoken, out unsigned long aouttokenlength); void wrap([const] in voidptr aintoken, in unsigned long aintokenlength, in boolean confidential, out voidptr aouttoken, out unsi...
... methods getnexttoken() this method is called to get the next token in a sequence of authentication steps.
... void getnexttoken( [const] in voidptr aintoken, in unsigned long aintokenlength, out voidptr aouttoken, out unsigned long aouttokenlength ); parameters aintoken a buffer containing the input token (for example a challenge from a server).
...And 3 more matches
nsIStringEnumerator
inherits from: nsisupports last changed in gecko 1.7 method overview astring getnext(); boolean hasmore(); methods getnext() called to retrieve the next string in the enumerator.
... the "next" element is the first string upon the first call.
...astring getnext(); parameters none.
...And 3 more matches
nsIUTF8StringEnumerator
inherits from: nsisupports last changed in gecko 1.7 method overview autf8string getnext(); boolean hasmore(); methods getnext() returns the next string in the enumerator.
... the "next" element is the first string upon the first call.
...autf8string getnext(); parameters none.
...And 3 more matches
Applying styles and colors - Web APIs
« previousnext » in the chapter about drawing shapes, we used only the default line and fill styles.
... note also that only start and final endpoints of a path are affected: if a path is closed with closepath(), there's no start and final endpoint; instead, all endpoints in the path are connected to their attached previous and next segment using the current setting of the linejoin style, whose default value is miter, with the effect of automatically extending the outer borders of the connected segments to their intersection point, so that the rendered stroke will exactly cover full pixels centered at each endpoint if those connected segments are horizontal and/or vertical).
... see the next two sections for demonstrations of these additional line styles.
...And 3 more matches
Movement, orientation, and motion: A WebXR example - Web APIs
setup and utility functions next, we declare the variables and constants used throughout the application, starting with those used to store webgl and webxr specific information: let polyfill = null; let xrsession = null; let xrinputsources = null; let xrreferencespace = null; let xrbutton = null; let gl = null; let animationframerequestid = 0; let shaderprogram = null; let programinfo = null; let buffers = null; let texture = n...
... next, we add event handlers for the mousemove and element.contextmenu_event, but only if the allowmouserotation constant is true.
... next, we compile the shader programs; get references to its variables; initialize the buffers that store the array of each position; the indexes into the position table for each vertex; the vertex normals; and the texture coordinates for each vertex.
...And 3 more matches
Advanced techniques: Creating and sequencing audio - Web APIs
ables to define how far ahead we want to look, and how far ahead we want to schedule: let lookahead = 25.0; // how frequently to call scheduling function (in milliseconds) let scheduleaheadtime = 0.1; // how far ahead to schedule audio (sec) let's create a function that moves the note forwards by one beat, and loops back to the first when it reaches the 4th (last) one: let currentnote = 0; let nextnotetime = 0.0; // when the next note is due.
... function nextnote() { const secondsperbeat = 60.0 / tempo; nextnotetime += secondsperbeat; // add beat length to last beat time // advance the beat number, wrap to zero currentnote++; if (currentnote === 4) { currentnote = 0; } } we want to create a reference queue for the notes that are to be played, and the functionality to play them using the functions we've previously created: const notesinqueue = []; function schedulenote(beatnumber, time) { // push the note on the queue, even if we're not playing.
...('aria-checked') === 'true') { playpulse() } if (pads[2].queryselectorall('button')[currentnote].getattribute('aria-checked') === 'true') { playnoise() } if (pads[3].queryselectorall('button')[currentnote].getattribute('aria-checked') === 'true') { playsourcenode(audioctx, sample); } } here we look at the current time and compare it to the time for the next note; when the two match it will call the previous two functions.
...And 3 more matches
Auto-placement in CSS Grid Layout - CSS: Cascading Style Sheets
when it fills up a column it will move onto the next explicit column, or create a new column track in the implicit grid.
... in this next example i have created a grid with three row tracks of 200 pixels height.
...in this next example i have added to the layout by setting odd items to span two tracks both for rows and columns.
...And 3 more matches
Link types - HTML: Hypertext Markup Language
note: other link types related to linking resources in the same sequence are last, prev, next.
...if the most appropriate icon is later found to be inappropriate, for example because it uses an unsupported format, the browser proceeds to the next-most appropriate, and so on.
... note: other link types related to linking resources in the same sequence are first, prev, next.
...And 3 more matches
Promise - JavaScript
the termination condition of these functions determines the "settled" state of the next promise in the chain.
... handlefulfilled(value) { /*...*/; return nextvalue; } handlerejection(reason) { /*...*/; throw nextreason; } handlerejection(reason) { /*...*/; return nextvalue; } the returned nextvalue can be another promise object, in which case the promise gets dynamically inserted into the chain.
... when a .then() lacks the appropriate function that return a promise object, processing simply continues to the next link of the chain.
...And 3 more matches
Chapter 4: Using XPCOM—Implementing advanced processes - Archive of obsolete content
« previousnext » fixme: we should include a link to the mdc list of snippets fixme: we need to add a part about 'why and how to create your own component' c++/js this document was authored by hiroshi shimoda of clear code inc.
... listing 5: closing all browser windows var browsers = windowmediator.getenumerator('navigator:browser'); var browser; while (browsers.hasmoreelements()) { browser = browsers.getnext().queryinterface(components.interfaces.nsidomwindowinternal); browser.browsertrytoclosewindow(); } this method returns an overview of the specified window type in the form of an iterator pattern object called nsisimpleenumerator.
... after getting an element with the nsisimpleenumerator.getnext() method, use the queryinterface method to get the interface, which allows you to handle each element as a window object.
...And 2 more matches
Adding preferences to an extension - Archive of obsolete content
« previousnext » this article takes the creating a dynamic status bar extension sample to the next level, adding a popup menu that lets you quickly switch between multiple stocks to watch.
... the next step is to register a preference observer by calling the addobserver() method to establish that whenever any events occur on the preferences, our object (this) receives notification.
... next, we call our own refreshinformation() method to immediately fetch and display the current information about the stock the extension is configured to monitor.
...And 2 more matches
Inner-browsing extending the browser navigation paradigm - Archive of obsolete content
in the next section we will introduce inner-browsing as an extension to the traditional model.
...in general, when a webmail account has more than a few messages, clicking 'next page' sends a request to the server.
... you receive a new page with the next block of message headers.
...And 2 more matches
jspage - Archive of obsolete content
","noresize","defer"];var k=["value","type","defaultvalue","accesskey","cellpadding","cellspacing","colspan","frameborder","maxlength","readonly","rowspan","tabindex","usemap"]; b=b.associate(b);hash.extend(e,b);hash.extend(e,k.associate(k.map(string.tolowercase)));var a={before:function(m,l){if(l.parentnode){l.parentnode.insertbefore(m,l); }},after:function(m,l){if(!l.parentnode){return;}var n=l.nextsibling;(n)?l.parentnode.insertbefore(m,n):l.parentnode.appendchild(m);},bottom:function(m,l){l.appendchild(m); },top:function(m,l){var n=l.firstchild;(n)?l.insertbefore(m,n):l.appendchild(m);}};a.inside=a.bottom;hash.each(a,function(l,m){m=m.capitalize();element.implement("inject"+m,function(n){l(this,document.id(n,true)); return this;});element.implement("grab"+m,function(n){l(document.id(n,true...
...ct:function(m,l){a[l||"bottom"](this,document.id(m,true));return this;},replaces:function(l){l=document.id(l,true); l.parentnode.replacechild(this,l);return this;},wraps:function(m,l){m=document.id(m,true);return this.replaces(m).grab(m,l);},getprevious:function(l,m){return j(this,"previoussibling",null,l,false,m); },getallprevious:function(l,m){return j(this,"previoussibling",null,l,true,m);},getnext:function(l,m){return j(this,"nextsibling",null,l,false,m);},getallnext:function(l,m){return j(this,"nextsibling",null,l,true,m); },getfirst:function(l,m){return j(this,"nextsibling","firstchild",l,false,m);},getlast:function(l,m){return j(this,"previoussibling","lastchild",l,false,m); },getparent:function(l,m){return j(this,"parentnode",null,l,false,m);},getparents:function(l,m){return j(this,"pa...
...rentnode",null,l,true,m);},getsiblings:function(l,m){return this.getparent().getchildren(l,m).erase(this); },getchildren:function(l,m){return j(this,"nextsibling","firstchild",l,true,m);},getwindow:function(){return this.ownerdocument.window;},getdocument:function(){return this.ownerdocument; },getelementbyid:function(o,n){var m=this.ownerdocument.getelementbyid(o);if(!m){return null;}for(var l=m.parentnode;l!=this;l=l.parentnode){if(!l){return null; }}return document.id(m,n);},getselected:function(){return new elements($a(this.options).filter(function(l){return l.selected;}));},getcomputedstyle:function(m){if(this.currentstyle){return this.currentstyle[m.camelcase()]; }var l=this.getdocument().defaultview.getcomputedstyle(this,null);return(l)?l.getpropertyvalue([m.hyphenate()]):null;},toquery...
...And 2 more matches
canAdvance - Archive of obsolete content
« xul reference canadvance type: boolean this property is set to true if the user can press the next button to go to the next page.
... if this property is false, the user cannot navigate to the next page.
... set this property to true to indicate that the user can go to the next page.
...And 2 more matches
Building Hierarchical Trees - Archive of obsolete content
« previousnext » a template may be used to generate hierarchical trees.
...when the user opens the tree row, the next level of rows are generated from the template and displayed in the tree.
... similarly, when the user closes a tree row, the rows inside it are removed, such that they will have to be generated again the next time the row is opened.
...And 2 more matches
Adding Event Handlers - Archive of obsolete content
« previousnext » the find files dialog so far looks quite good.
...next, we will show how to add scripts to it.
...next, the 'mousemove' event is sent to the button.
...And 2 more matches
Advanced Rules - Archive of obsolete content
« previousnext » this section describes the more advanced rule syntax.
...member element the next element is the member element, which is used to iterate through a set of child resources.
...triple element the next element is the triple element.
...And 2 more matches
Creating a Skin - Archive of obsolete content
« previousnext » this documentation has not updated for firefox quantum.
... css: .findfilesbox { background-color: #0088cc; } xul: <vbox class="findfilesbox" orient="vertical" flex="100%"> <toolbox> rounding on the tabs next, let's modify the tabs.
... other changes next, we'll make a couple of changes to the buttons along the bottom, again reusing some icons from mozilla to save time.
...And 2 more matches
Introduction to RDF - Archive of obsolete content
« previousnext » in this section, we'll look at rdf (resource description framework).
...we'll see this in the next section.
...in the next section, we'll look at how we can use these to fill in the field values automatically.
...And 2 more matches
Manipulating Lists - Archive of obsolete content
« previousnext » the xul listbox provides a number of specialized methods.
...in the next example, the selectedindex property of a radiogroup element is changed based on the value entered in a textbox.
... next, we remove the item using the removeitemat() function.
...And 2 more matches
More Tree Features - Archive of obsolete content
« previousnext » here, we'll see more features of trees.
...as can be seen in the image, a small plus or minus sign (often called a twisty) has appeared next to the first row, indicating that it contains child rows.
...thus, once the user has decided on a column layout they like, it will automatically be saved for next time.
...And 2 more matches
Property Files - Archive of obsolete content
« previousnext » in a script, entities cannot be used.
... text formatting the next method is getformattedstring().
...in case you need to format a string that already contains the percentage character in it (to get something like "50% off" returned), escape the percentage character with another percentage character, like this: my.percentage.string = %s%% off not escaping the percentage character will generate an incorrect string that strips the space character between the percentage character and the next word of the string ("50%off").
...And 2 more matches
Simple Menu Bars - Archive of obsolete content
« previousnext » in this section, we'll see how to create a menu bar with menus on it.
... acceltext this specifies the shortcut key text to appear next to the menu command text.
...it just creates a horizontal bar between the menuitems next to it.
...And 2 more matches
Stacks and Decks - Archive of obsolete content
« previousnext » there may be need to display elements as a set of overlapping cards.
... in the next few sections, we'll introduce some elements that are designed for holding other elements.
...the first child of the stack is drawn underneath, the second child is drawn next, followed by the third and so on.
...And 2 more matches
XPCOM Interfaces - Archive of obsolete content
« previousnext » in this section, we'll take a brief look at xpcom (cross-platform component object model), which is the object system that mozilla uses.
...next, we call the remove() function.
...stdir) { // get a component for the file to copy var afile = components.classes["@mozilla.org/file/local;1"] .createinstance(components.interfaces.nsilocalfile); if (!afile) return false; // get a component for the directory to copy to var adir = components.classes["@mozilla.org/file/local;1"] .createinstance(components.interfaces.nsilocalfile); if (!adir) return false; // next, assign urls to the file components afile.initwithpath(sourcefile); adir.initwithpath(destdir); // finally, copy the file, without renaming it afile.copyto(adir,null); } copyfile("/mozilla/testfile.txt","/etc"); xpcom services some xpcom components are special components called services.
...And 2 more matches
Building up a basic demo with PlayCanvas editor - Game development
next you'll see your project's page — there's not much yet.
...to add an entity to the scene you have to click on the big plus button located in the top left area of the editor, next to the hierarchy text.
...click diffuse, then select the colored box next to the color label — it will open a color wheel.
...And 2 more matches
Audio for Web games - Game development
let's look at this next.
...let's look at this next.
... note: this example does not wait for the beat to end before introducing the next piece; we could do this if we knew the bpm (beats per minute) of the tracks.
...And 2 more matches
Animations and tweens - Game development
« previousnext » this is the 14th step out of 16 of the gamedev phaser tutorial.
... next, we will load the spritesheet — put the following line at the bottom of your preload() function: game.load.spritesheet('ball', 'img/wobble.png', 20, 20); instead of loading a single image of the ball we can load the whole spritesheet — a collection of different images.
... loading the animation next up, go into your create() function, find the line that loads the ball sprite, and below it put the call to animations.add() seen below: ball = game.add.sprite(50, 250, 'ball'); ball.animations.add('wobble', [0,1,0,2,0,1,0,2,0], 24); to add an animation to the object we use the animations.add() method, which contains the following parameters the name we chose for the animation an array defining the order in which to display the frames during the animation.
...And 2 more matches
Physics - Game development
« previousnext » this is the 5th step out of 16 of the gamedev phaser tutorial.
...add the physics.startsystem() method at the beginning of the create function (make it the first line inside the function), as shown below: game.physics.startsystem(phaser.physics.arcade); next, we need to enable our ball for the physics system — phaser object physics is not enabled by default.
... add the following line at the bottom of the create() function: game.physics.enable(ball, phaser.physics.arcade); next, if we want to move our ball on the screen, we can set velocity on its body.
...And 2 more matches
Player paddle and controls - Game development
« previousnext » this is the 7th step out of 16 of the gamedev phaser tutorial.
... rendering the paddle, with physics next up, we will init our paddle by adding the following add.sprite() call inside the create() function — add it right at the bottom: paddle = game.add.sprite(game.world.width*0.5, game.world.height-5, 'paddle'); we can use the world.width and world.height values to position the paddle exactly where we want it: game.world.width*0.5 will be right in the middle of the screen.
... controlling the paddle the next problem is that we can't move the paddle.
...And 2 more matches
CSS and JavaScript accessibility best practices - Learn web development
previous overview: accessibility next css and javascript, when used properly, also have the potential to allow for accessible web experiences ...
...the next article will also cover this in detail.
... as a final note, we have used some wai-aria attributes in our demo to help solve accessibility problems caused by areas of content constantly updating without a page reload (screen readers won't pick this up or alert users to it by default): <div class="errors" role="alert" aria-relevant="all"> <ul> </ul> </div> we will explain these attributes in our next article, which covers wai-aria in much more detail.
...And 2 more matches
HTML: A good basis for accessibility - Learn web development
previous overview: accessibility next a great deal of web content can be made accessible just by making sure the correct hypertext markup language elements are used for the correct purpose at all times.
... you can jump to the next/previous heading in many screen readers.
...that said, the element structure is useful for css styling, plus it provides a way to place a description of the image next to it in the source.
...And 2 more matches
HTML: A good basis for accessibility - Learn web development
previous overview: accessibility next a great deal of web content can be made accessible just by making sure the correct hypertext markup language elements are used for the correct purpose at all times.
... you can jump to the next/previous heading in many screen readers.
...that said, the element structure is useful for css styling, plus it provides a way to place a description of the image next to it in the source.
...And 2 more matches
Backgrounds and borders - Learn web development
previous overview: building blocks next in this lesson, we will take a look at some of the creative things you can do with css backgrounds and borders.
... if using multiple backgrounds, you need to specify all of the properties for the first background, then add your next background after a comma.
...we'll be exploring these in the next lesson, which covers handling different text directions.
...And 2 more matches
Cascade and inheritance - Learn web development
overview: building blocks next the aim of this lesson is to develop your understanding of some of the most fundamental concepts of css — the cascade, specificity, and inheritance — which control how css is applied to html and how conflicts are resolved.
...only when there is a tie between selector scores within a specificity level do you need to evaluate the next level down; otherwise, you can disregard the lower specificity level selectors since they can never overwrite the higher specificity levels.
... what's next if you understood most of this article, then well done — you've started getting familiar with the fundamental mechanics of css.
...And 2 more matches
Combinators - Learn web development
previous overview: building blocks next the final selectors we will look at are called combinators, because they combine other selectors in a way that gives them a useful relationship to each other and the location of content in the document.
...for example, to select only <p> elements that are direct children of <article> elements: article > p in this next example, we have an unordered list, nested inside of which is an ordered list.
... adjacent sibling combinator the adjacent sibling selector (+) is used to select something if it is right next to another element at the same level of the hierarchy.
...And 2 more matches
The box model - Learn web development
previous overview: building blocks next everything in css has a box around it, and understanding these boxes is key to being able to create layouts with css, or to align items with other items.
... we can see how inline elements behave in this next example.
... in this next example, we have added display: inline-block to our <span> element.
...And 2 more matches
Fundamental text and font styling - Learn web development
overview: styling text next in this article we'll start you on your journey towards mastering text styling with css.
...once it reaches the end, it goes down to the next line and continues, then the next line, until all the content has been placed in the box.
...if not, it moves on to the next font, and so on.
...And 2 more matches
Advanced form styling - Learn web development
previous overview: forms next in this article, we will see what can be done with css to style the types of form control that are more difficult to style — the "bad" and "ugly" categories.
...; position: absolute; font-size: 1.2em; right: -1px; top: -0.3em; visibility: hidden; } input[type="checkbox"]:checked::before { /* use `visibility` instead of `display` to avoid recalculating layout */ visibility: visible; } input[type="checkbox"]:disabled { border-color: black; background: #ddd; color: gray; } you'll find more out about such pseudo-classes and more in the next article; the above ones do the following: :checked — the checkbox (or radio button) is in a checked state — the user has clicked/activated it.
...bear in mind that some questions in this assessment series assume knowledge of the next article too, so you might want to work through that article first before attempting it.
...And 2 more matches
Client-side form validation - Learn web development
previous overview: forms next before submitting data to the server, it is important to ensure all required form controls are filled out, in the correct format.
... // there are fewer ways to pick a dom node with legacy browsers const form = document.getelementsbytagname('form')[0]; const email = document.getelementbyid('mail'); // the following is a trick to reach the next sibling element node in the dom // this is dangerous because you can easily build an infinite loop.
... // in modern browsers, you should prefer using element.nextelementsibling let error = email; while ((error = error.nextsibling).nodetype != 1); // as per the html5 specification const emailregexp = /^[a-za-z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-za-z0-9-]+(?:\.[a-za-z0-9-]+)*$/; // many legacy browsers do not support the addeventlistener method.
...And 2 more matches
How to build custom form controls - Learn web development
set a charset meta tag */ position: absolute; z-index : 1; /* this will be important to keep the arrow from overlapping the list of options */ top : 0; right : 0; box-sizing : border-box; height : 100%; width : 2em; padding-top : .1em; border-left : .2em solid #000; border-radius: 0 .1em .1em 0; background-color : #000; color : #fff; text-align : center; } next, let's style the list of options: .select .optlist { z-index : 2; /* we explicitly said the list of options will always be on top of the down arrow */ /* this will reset the default style of the ul element */ list-style: none; margin : 0; padding: 0; box-sizing : border-box; /* if the values are smaller than the control, the list of options will be as wide as the control it...
... next, we bind these functions to the appropriate events: // we handle the event binding when the document is loaded.
...we'll handle that next.
...And 2 more matches
How to structure a web form - Learn web development
previous overview: forms next with the basics out of the way, we'll now look in more detail at the elements used to provide structure and meaning to the different parts of a form.
...don't worry about this for now; you'll find out how they work in the next article (basic native form controls).
... apply the css to the html by adding the following line inside the html <head>: <link href="payment-form.css" rel="stylesheet"> next, create your form by adding the outer <form> element: <form> </form> inside the <form> tags, add a heading and paragraph to inform users how required fields are marked: <h1>payment form</h1> <p>required fields are followed by <strong><abbr title="required">*</abbr></strong>.</p> next we'll add a larger section of code into the form, below our previous entry.
...And 2 more matches
UI pseudo-classes - Learn web development
previous overview: forms next in the previous articles, we covered the styling of various form controls, in a general manner.
... note: a number of the pseudo-classes discussed here are concerned with styling form controls based on their validation state (is their data valid, or not?) you'll learn much more about setting and controlling validation constraints in our next article — client-side form validation — but for now we'll keep things simple with regards to form validation, so it doesn't confuse things.
... in the next section, we'll look at a better example of indicating required fields using :required, which also digs into using generated content.
...And 2 more matches
Front-end web developer - Learn web development
completing the assessments confirms that you are ready to move on to the next module.
... completing the assessments confirms that you are ready to move on to the next module.
... completing the assessments confirms that you are ready to move on to the next module.
...And 2 more matches
JavaScript basics - Learn web development
previous overview: getting started with the web next javascript is a programming language that adds interactivity to your website.
...in the next example, we create a simple function which takes two numbers as arguments and multiplies them: function multiply(num1,num2) { let result = num1 * num2; return result; } try running this in the console; then test with several arguments.
...next, you made this variable's onclick event handler property equal to a function with no name (an "anonymous" function).
...And 2 more matches
HTML text fundamentals - Learn web development
previous overview: introduction to html next one of html's main jobs is to give text structure and meaning (also known as semantics) so that a browser can display it correctly.
...this document's body currently contains multiple pieces of content—they aren't marked up in any way, but they are separated with linebreaks (enter/return pressed to go onto the next line).
...doing it locally will probably be better, as then you'll get to save the work you are doing, whereas if you fill it in to the editable example, it will be lost the next time you open the page.
...And 2 more matches
What’s in the head? Metadata in HTML - Learn web development
previous overview: introduction to html next the head of an html document is the part that is not displayed in the web browser when the page is loaded.
...next, choose your browser's file > save page as...
...you may see (depending on the browser) favicons displayed in the browser tab containing each open page, and next to bookmarked pages in the bookmarks panel.
...And 2 more matches
Video and audio content - Learn web development
previous overview: multimedia and embedding next now that we are comfortable with adding simple images to a webpage, the next step is to start adding video and audio players to your html documents!
...we'll be discussing this kind of service a bit more in the next article.
...take a look at our next example: <video controls width="400" height="400" autoplay loop muted preload="auto" poster="poster.png"> <source src="rabbit320.mp4" type="video/mp4"> <source src="rabbit320.webm" type="video/webm"> <p>your browser doesn't support html video.
...And 2 more matches
Making asynchronous programming easier with async and await - Learn web development
previous overview: asynchronous next more recent additions to the javascript language are async functions and the await keyword, part of the so-called ecmascript 2017 javascript edition (see ecmascript next support in mozilla).
...once that's complete, your code continues to execute starting on the next line.
...once the response is available, the parser moves to the next line, which creates a blob out of it.
...And 2 more matches
Manipulating documents - Learn web development
previous overview: client-side web apis next when writing web pages and apps, one of the most common things you'll want to do is manipulate the document structure in some way.
... in the next couple of sections we will look at a couple of more practical uses of dom apis.
...add the following lines inside the existing <script> element: const div = document.queryselector('div'); let winwidth = window.innerwidth; let winheight = window.innerheight; next, we'll dynamically alter the width and height of the div to equal that of the viewport.
...And 2 more matches
Handling text — strings in JavaScript - Learn web development
previous overview: first steps next next, we'll turn our attention to strings — this is what pieces of text are called in programming.
...the following will error, as it confuses the browser as to where the string ends: let bigmouth = 'i've got no right to take my place...'; this leads us very nicely into our next subject.
...note that this also requires knowledge from the next article, so you might want to read that first.
...And 2 more matches
What is JavaScript? - Learn web development
overview: first steps next welcome to the mdn beginner's javascript course!
...you won't be able to build the next facebook, google maps, or instagram after studying javascript for 24 hours — there are a lot of basics to cover first.
... next, go to your text editor and add the following in your head — just before your closing </head> tag: <script> // javascript goes here </script> now we'll add some javascript inside our <script> element to make the page do something more interesting — add the following code just below the "// javascript goes here" line: document.addeventlistener("domcontentloaded", function() { func...
...And 2 more matches
Working with JSON - Learn web development
previous overview: objects next javascript object notation (json) is a standard text-based format for representing structured data based on javascript object syntax.
... next, add the following two lines — here we are setting the responsetype to json, so that xhr knows that the server will be returning json, and that this should be converted behind the scenes into a javascript object.
... creating the hero information cards next, add the following function at the bottom of the code, which creates and displays the superhero cards: function showheroes(jsonobj) { const heroes = jsonobj['members']; for (let i = 0; i < heroes.length; i++) { const myarticle = document.createelement('article'); const myh2 = document.createelement('h2'); const mypara1 = document.createelement('p'); const mypara2 = document.
...And 2 more matches
Server-side web frameworks - Learn web development
previous overview: first steps next the previous article showed you what the communication between web clients and servers looks like, the nature of http requests and responses, and what a server-side web application needs to do in order to respond to requests from a web browser.
... the next section provides a bit more detail about how web frameworks can ease web application development.
... mojolicious (perl) mojolicious is a next-generation web framework for the perl programming language.
...And 2 more matches
Getting started with Ember - Learn web development
previous overview: client-side javascript frameworks next in our first ember article we will look at how ember works and what it's useful for, install the ember toolchain locally, create a sample app, and then do some initial setup to get it ready for development.
... now run the following command to place the common todomvc css inside your app: npm install --save-dev todomvc-app-css todomvc-common next, find the ember-cli-build.js file inside the todomvc directory (it's right there inside the root) and open it in your chosen code editor.
...in the next article we'll look at building up the markup structure of our app, as a group of logical components.
...And 2 more matches
Routing in Ember - Learn web development
previous overview: client-side javascript frameworks next in this article we learn about routing, or url-based filtering as it is sometimes referred to.
... go to the todomvc/app/templates/application.hbs file and replace <todolist /> with {{outlet}} next, in our index.hbs, completed.hbs, and active.hbs templates (also found in the templates directory) we can for now just enter the todolist component invocation.
...study the code to learn more about ember, and also check out the next article, which provides links to more resources and some troubleshooting advice.
...And 2 more matches
Componentizing our React app - Learn web development
previous overview: client-side javascript frameworks next at this point, our app is a monolith.
...next we'll look at how we can make different component calls render unique content.
... in src/index.js, make a new const beneath the final import, but above reactdom.render(): const data = [ { id: "todo-0", name: "eat", completed: true }, { id: "todo-1", name: "sleep", completed: false }, { id: "todo-2", name: "repeat", completed: false } ]; next, we'll pass data to <app /> as a prop, called tasks.
...And 2 more matches
Getting started with React - Learn web development
previous overview: client-side javascript frameworks next in this article we will say hello to react.
... your final index.js file should look like this: import react from 'react'; import reactdom from 'react-dom'; import './index.css'; import app from './app'; reactdom.render(<app />, document.getelementbyid('root')); variables and props next, we'll use a few of our javascript skills to get a bit more comfortable editing components and working with data in react.
...in the next article, we'll start building our first proper application — a todo list.
...And 2 more matches
Implementing feature detection - Learn web development
previous overview: cross browser testing next feature detection involves working out whether a browser supports a certain block of code, and running different code depending on whether it does (or doesn't), so that the browser can always provide a working experience rather than crashing/erroring in some browsers.
... next, add a <script></script> element at the bottom of your body (just before the closing </body> tag).
... next, fill in the your-api-key placeholder text in the second <script> element (as it is now) with a valid google maps api key.
...And 2 more matches
Package management basics - Learn web development
previous overview: understanding client-side tools next in this article we'll look at package managers in some detail to understand how we can use them in our own projects — to install project tool dependencies, keep them up-to-date, and more.
...we’ll call it parcel-experiment, but you can call it whatever you like: mkdir parcel-experiment cd parcel-experiment next, let's initialise our app as an npm package, which creates a config file — package.json — that allows us to save our configuration details in case we want to recreate this environment later on, or even publish the package to the npm registry (although this is somewhat beyond the scope of this article).
...create index.html in your test directory, and give it the following contents: <!doctype html> <html lang="en-us"> <head> <meta charset="utf-8"> <title>my test page</title> </head> <body> <script src="./index.js"></script> </body> </html> next, we need to add an index.js file in the same directory as index.html.
...And 2 more matches
Gecko info for Windows accessibility vendors
these relations can affect the calculation for the next next or previous item of a certain type.
... here is an algorithm for iterating through the nodes, looking for an item of a particular type: store a pointer to the start_item if the current item has a flows_to relation, follow that relation otherwise, go to the next item in depth first search order if the current item matches your criteria, then return current_item if the current_item == start_item, return null (no item found) if the end has been reached, go back to the start if wrapping is desired, otherwise return null (no item found) go to step 2 checkable, required and invalid states are supported gecko defines three state constants using previously unused states: const unsigned long state_checkable = state_marqueed; // useful on menuitem, listitem // and treeitem.
...next, another event_state_change is fired for the new root role_document object for the window, with its state_busy flag cleared.
...And 2 more matches
Using the Browser API
MozillaGeckoChromeAPIBrowser APIUsing
zoomin.addeventlistener('touchend',function() { zoomfactor += 0.1; browser.zoom(zoomfactor); }); zoomout.addeventlistener('touchend',function() { zoomfactor -= 0.1; browser.zoom(zoomfactor); }); controlling the stop/reload button next, let's talk about the stop/reload button.
...then, we disable the "previous" and "next" search item buttons so that they don't run anything unless there are search items to cycle between.
... var searchactive = false; prev.disabled = true; next.disabled = true; next, we add an event listener to the searchform so that when it is submitted, the htmliframeelement.findall() method is used to do a search for the string entered into the search input element (searchbar) within the text of the current page (the second parameter can be changed to 'case-insensitive' if you want a case-insensitive search.) we then enable the previous and next buttons, set searchactive to true, and blur() the search bar to make the keyboard disappear and stop taking up our screen once the search is submitted.
...And 2 more matches
IME handling guide
mselection::manchorcharrect, mselection::mfocuscharrect next character rect of mselection::manchor and mselection::mfocus.
...the callers of notifyime(request_tocommit_composition) may expect that composition string is committed immediately for their next job.
... next, imestatemanager initializes inputcontext (defined in imedata.h) with the desired ime state and node information.
...And 2 more matches
Release phase
next, try issuing the following command: $ ssh hg.mozilla.org if ssh is working fine, you should see the following message: no interactive shells allowed here!
...the merge date for migrating from one product release channel to the next is rapidly approaching.
... you need to make sure that your work can effectively be compiled into a build for the next release channel.
...And 2 more matches
Mozilla DOM Hacking Guide
instead, in the helper class for the window object (nswindowsh, see the next section), we define the getproperty() member function.
...on the next line, there is a call to data.mconstructorfptr(aid), which, if you remember the introduction to class info, maps to the docreate static member function of the relevant helper class.
... for domimplementation, this is around line 1220 (at the time of writing this document): 1224 dom_classinfo_map_begin(domimplementation, nsidomdomimplementation) the next line specifies that the domimplementation object implements the nsidomdomimplementation interface.
...And 2 more matches
Index
a void jsid is not a valid id and only arises as an exceptional api return value, such as in js_nextproperty.
...each call to js_contextiterator returns the next context in the cycle.
... 417 js_nextproperty jsapi reference, obsolete, spidermonkey on success, js_nextproperty returns true, with *idp containing the id of the next enumerable own property to visit using iterobj, or jsid_void if there is no such property left to visit.
...And 2 more matches
JS_ScheduleGC
this article covers features introduced in spidermonkey 17 set nextscheduled parameter of gc.
... frequency uint32_t the value of nextscheduled parameter of gc.
... description js_schedulegc sets the nextscheduled parameter of gc.
...And 2 more matches
TPS Tests
phase implementation (mandatory) it's worth noting that some parts of tps assume that it can read the number off the end of the phase or profile to get to the next one, so try to stick to the convention established in the other tests.
... determines if the phase passed or failed; if it passed, it continues to the next phase block and repeats the process.
...next, the changes are synced to the sync server.
...And 2 more matches
Animated PNG graphics
MozillaTechAPNG
if the the value of the numerator is 0 the decoder should render the next frame as quickly as possible, though viewers may impose a reasonable lower bound.
... dispose_op specifies how the output buffer should be changed at the end of the delay (before rendering the next frame).
... valid values for dispose_op are: value constant description 0 apng_dispose_op_none no disposal is done on this frame before rendering the next; the contents of the output buffer are left as is.
...And 2 more matches
Mork
MozillaTechMork
hex = [0-9a-fa-f]+ name = [a-za-z_?:] [a-za-z_?:+-]* value is a string terminated by ')' (not consumed) where '\' quotes the next metacharacter and '$' quotes the next two hexadecimal digits as a value (e.g., $20 is a space) the first line in the file is the header.
...next is the status column (s), which is defined as a single digit that is the priority (which appears to be unused), a 'u' if it is unique (i.e., the only table of its kind), and a 'v' if it is verbose (which also appears to be unused).
...a minus after the mid indicates that the next cell should be deleted.
...And 2 more matches
Building the WebLock UI
« previousnext » up until now, we've been building a component that can be installed in any gecko application.
... the locking ui once you have the basic xul wrapper set up for your interface, the next step is to define that part of the interface that locks and unlocks the browser.
... site adding ui the next step is to create that part of the user interface that lets you add a new site to the white list.
...And 2 more matches
Creating the Component Code
« previousnext » this chapter goes over the basic code required to handle the relationship between your component and xpcom.
...applications typically use regxpcom, described in the next section.
... the next two parameters are usually passed into the nsicomponentregistrar methods and used by xpcom to determine how to handle the component's registration.
...And 2 more matches
Finishing the Component
« previousnext » at this point you have created most of the infrastructure of the component.
...when the component starts up, it populates a list of urls read in from a file stored next to the gecko binary on the local system.
... allow this nsiuri to load *_retval = pr_true; return ns_ok; } node = node->next; } return ns_ok; } at this point, all of the backend work is complete.
...And 2 more matches
nsISimpleEnumerator
inherits from: nsisupports last changed in gecko 0.9.6 method overview nsisupports getnext(); boolean hasmoreelements(); methods getnext() called to retrieve the next element in the enumerator.
... the "next" element is the first element upon the first call.
...nsisupports getnext(); parameters none.
...And 2 more matches
Index - Firefox Developer Tools
58 edit css filters css, devtools, filters, page inspector, tools css filter properties in the rules view have a circular gray and white swatch next to them: 59 edit shape paths in css css, devtools, page inspector, rules view, tools, highlighter, shapes the shape path editor is a tool that helps you see and edit shapes created using clip-path and also the css shape-outside property and <basic-shape> values.
... 61 examine event listeners guide, inspector, tools the inspector shows the word "event" next to elements in the html pane, that have event listeners bound to them: 62 examine and edit css guide, inspector, tools you can examine and edit css in the inspector's css pane.
... 64 examine and edit the box model guide, tools with the select element button pressed, if you hover over an element in the page, the box model for the element is shown overlaid on the page: 65 inspect and select colors guide, inspector, tools in the css pane's rules view, if a rule contains a color value, you'll see a sample of the color next to the value: 66 open the inspector guide, inspector, tools there are two main ways to open the inspector: 67 reposition elements in the page starting in firefox 48 you can move absolutely positioned elements by dragging them around the page.
...And 2 more matches
All keyboard shortcuts - Firefox Developer Tools
command windows macos linux delete the selected node delete delete delete undo delete of a node ctrl + z cmd + z ctrl + z redo delete of a node ctrl + shift + z / ctrl + y cmd + shift + z / cmd + y ctrl + shift + z / ctrl + y move to next node (expanded nodes only) down arrow down arrow down arrow move to previous node up arrow up arrow up arrow move to first node in the tree.
...selected node h h h focus on the search box in the html pane ctrl + f cmd + f ctrl + f edit as html f2 f2 f2 stop editing html f2 / ctrl +enter f2 / cmd + return f2 / ctrl + enter copy the selected node's outer html ctrl + c cmd + c ctrl + c scroll the selected node into view s s s find the next match in the markup, when searching is active enter return enter find the previous match in the markup, when searching is active shift + enter shift + return shift + enter breadcrumbs bar these shortcuts work when the breadcrumbs bar is focused.
... command windows macos linux move to the previous element in the breadcrumbs bar left arrow left arrow left arrow move to the next element in the breadcrumbs bar right arrow right arrow right arrow focus the html pane shift + tab shift + tab shift + tab focus the css pane tab tab tab css pane these shortcuts work when you're in the inspector's css pane.
...And 2 more matches
Drawing shapes with canvas - Web APIs
« previousnext » now that we have set up our canvas environment, we can get into the details of how to draw on the canvas.
... unlike the path functions we'll see in the next section, all three rectangle functions draw immediately to the canvas.
...you can probably best think of this as lifting a pen or pencil from one spot on a piece of paper and placing it on the next.
...And 2 more matches
Transformations - Web APIs
« previousnext » earlier in this tutorial we've learned about the canvas grid and the coordinate space.
... the current clipping path, which we'll see in the next section.
...next we save this state and make changes to the fill color.
...And 2 more matches
How whitespace is handled by HTML, CSS, and in the DOM - Web APIs
inside this context, whitespace character processing can be summarized as follows: first, all spaces and tabs immediately before and after a line break are ignored so, if we take our example markup from before and apply this first rule, we get: <h1>◦◦◦hello⏎ <span>◦world!</span>⇥◦◦</h1> next, all tab characters are handled as space characters, so the example becomes: <h1>◦◦◦hello⏎ <span>◦world!</span>◦◦◦</h1> next, line breaks are converted to spaces: <h1>◦◦◦hello◦<span>◦world!</span>◦◦◦</h1> after that, any space immediately following another space (even across two separate inline elements) is ignored, so we end up with: <h1>◦he...
... */ function node_before( sib ) { while ((sib = sib.previoussibling)) { if (!is_ignorable(sib)) return sib; } return null; } /** * version of |nextsibling| that skips nodes that are entirely * whitespace or comments.
... * @return either: * 1) the closest next sibling to |sib| that is not * ignorable according to |is_ignorable|, or * 2) null if no such node exists.
...And 2 more matches
GlobalEventHandlers.onanimationiteration - Web APIs
example let's create an animation which automatically pauses at the end of each iteration, allowing the user to choose whether or not to start the next iteration.
... #box { width: var(--boxwidth); height: var(--boxwidth); left: 0; top: 0; border: 1px solid #7788ff; margin: 0; position: relative; background-color: #2233ff; display: flex; justify-content: center; animation: 2s ease-in-out 0s infinite alternate both paused slidebox; } the animation's keyframes are defined next; they describe an animation which causes the box to migrate from the top-left corner of the container to the bottom-right corner.
... @keyframes slidebox { from { left:0; top:0; } to { left:calc(100% - var(--boxwidth)); top:calc(100% - var(--boxwidth)) } } javascript some javascript code will need to be written to handle the click on the button to start the next iteration.
...And 2 more matches
In depth: Microtasks and the JavaScript runtime environment - Web APIs
program execution resumes with the next context found on the stack, which is greetuser(); this function resumes execution where it left off.
...each context additionally tracks the next line in the program that should be run and other information critical to that context's operation.
...tasks added to the queue after the iteration begins will not run until the next iteration.
...And 2 more matches
Checking when a deadline is due - Web APIs
the next few lines open the database transaction and provide messages to notify the user if this was successful or failed.then an objectstore is created into which the new item is added.
... request.onsuccess = function(event) { note.innerhtml += '<li>new item added to database.</li>'; title.value = ''; hours.value = null; minutes.value = null; day.value = 01; month.value = 'january'; year.value = 2020; }; } this next section creates a log message to say the new item addition is successful, and resets the form so it's ready for the next task to be entered.
...ns the day of the week, 1-7), month (returns a number from 0-11, see below), and year (getfullyear() is needed; getyear() is deprecated, and returns a weird value that is not much use to anyone!) var objectstore = db.transaction(['todolist'], "readwrite").objectstore('todolist'); objectstore.opencursor().onsuccess = function(event) { var cursor = event.target.result; if(cursor) { next we create another indexeddb objectstore, and use the opencursor() method to open a cursor, which is basically a way in indexeddb to iterate through all the items in the store.
...And 2 more matches
Navigator.sendBeacon() - Web APIs
all of these methods block unloading the document, which slows down the next navigation.
... there is nothing the next page can do to avoid this, so the new page seems slow, even though it's the previous page's fault.
...this results in the next page load to be delayed.
...And 2 more matches
WebGL model view projection - Web APIs
first take a look at the vertex shader that will move the vertices on the screen: // the individual position vertex attribute vec3 position; void main() { // the gl_position is the final position in clip space after the vertex shader modifies it gl_position = vec4(position, 1.0); } next, to actually rasterize the data into pixels, the fragment shader evaluates everything on a per pixel basis, setting a single color.
... box.draw({ top : 0.5, // x bottom : -0.5, // x left : -0.5, // y right : 0.5, // y depth : 0, // z color : [1, 0.4, 0.4, 1] // red }); next, draw a green box up top and behind the red box.
...the next section will take this setup and modify the w values to provide some perspective.
...And 2 more matches
Establishing a connection: The WebRTC perfect negotiation pattern - Web APIs
handling incoming tracks we next need to set up a handler for track events to handle inbound video and audio tracks that have been negotiatied to be received by this peer connection.
... handling incoming ice candidates next, we need to handle the rtcpeerconnection event icecandidate, which is how the local ice layer passes candidates to us for delivery to the remote peer over the signaling channel.
... if we're the polite peer, and we're receiving a colliding offer, we don't need to do anything special, because our existing offer will automatically be rolled back in the next step.
...And 2 more matches
ARIA: listbox role - Accessibility
if an option or item is focused within the list, it gets announced next, followed by an indication of the item's position with the list if the screen reader supports this.
... down arrow: moves focus to the next option.
... type-ahead is recommended for all listboxes, especially those with more than seven options: type a character: focus moves to the next item with a name that starts with the typed character.
...And 2 more matches
CSS grids, logical values, and writing modes - CSS: Cascading Style Sheets
the grid in my next example has three columns and two row tracks.
...it then moves onto the next line, creating a new row track, and fills in more items: * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } .wrapper { display: grid; grid-template-columns: repeat(3, 100px); grid-template-rows: repeat(2, 100px); grid-gap: 10px; } <div class="wrapper"> <div class="item1">item 1</div> <div class="item2">item 2</div> <div...
... in this next example, i am using alignment to align items inside a grid that is set to writing-mode: vertical-lr.
...And 2 more matches
break-after - CSS: Cascading Style Sheets
eak values */ break-after: avoid-column; break-after: column; /* region break values */ break-after: avoid-region; break-after: region; /* global values */ break-after: inherit; break-after: initial; break-after: unset; each possible break point (in other words, each element boundary) is affected by three properties: the break-after value of the previous element, the break-before value of the next element, and the break-inside value of the containing element.
... left forces one or two page breaks right after the principal box, whichever will make the next page into a left page.
... right forces one or two page breaks right after the principal box, whichever will make the next page into a right page.
...And 2 more matches
break-before - CSS: Cascading Style Sheets
ues */ break-before: avoid-column; break-before: column; /* region break values */ break-before: avoid-region; break-before: region; /* global values */ break-before: inherit; break-before: initial; break-before: unset; each possible break point (in other words, each element boundary) is affected by three properties: the break-after value of the previous element, the break-before value of the next element, and the break-inside value of the containing element.
... left forces one or two page breaks right before the principal box, whichever will make the next page into a left page.
... right forces one or two page breaks right before the principal box, whichever will make the next page into a right page.
...And 2 more matches
writing-mode - CSS: Cascading Style Sheets
the next horizontal line is positioned below the previous line.
... vertical-rl for ltr scripts, content flows vertically from top to bottom, and the next vertical line is positioned to the left of the previous line.
... for rtl scripts, content flows vertically from bottom to top, and the next vertical line is positioned to the right of the previous line.
...And 2 more matches
Array.prototype.toLocaleString() - JavaScript
let nextelement be ?
... var nextelement = a[k]; // c.
... if nextelement is undefined or null, then // i.
...And 2 more matches
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.
...s/js13kpwa/img/bg.png', '/pwa-examples/js13kpwa/icons/icon-32.png', '/pwa-examples/js13kpwa/icons/icon-64.png', '/pwa-examples/js13kpwa/icons/icon-96.png', '/pwa-examples/js13kpwa/icons/icon-128.png', '/pwa-examples/js13kpwa/icons/icon-168.png', '/pwa-examples/js13kpwa/icons/icon-192.png', '/pwa-examples/js13kpwa/icons/icon-256.png', '/pwa-examples/js13kpwa/icons/icon-512.png' ]; next, the links to images to be loaded along with the content from the data/games.js file are generated in the second array.
... here, we open a cache with a given name, then add all the files our app uses to the cache, so they are available next time it loads (identified by request url).
...And 2 more matches
d - SVG: Scalable Vector Graphics
WebSVGAttributed
the end point (pn) then becomes the current point for the next command (po′).
...ve cubic bézier curves are smooth curve definitions using four points: starting point (current point) (po = {xo, yo}) end point (pn = {xn, yn}) start control point (pcs = {xcs, ycs}) (controls curvature near the start of the curve) end control point (pce = {xce, yce}) (controls curvature near the end of the curve) after drawing, the end point (pn) becomes the current point for the next command (po′).
.../> <circle cx="90" cy="90" r="1.5"/> </g> <use xlink:href="#controlpoints" x="100" /> </svg> quadratic bézier curve quadratic bézier curves are smooth curve definitions using three points: starting point (current point) po = {xo, yo} end point pn = {xn, yn} control point pc = {xc, yc} (controls curvature) after drawing, the end point (pn) becomes the current point for the next command (po′).
...And 2 more matches
Chapter 3: Introduction to XUL—How to build a more intuitive UI - Archive of obsolete content
« previousnext » this document was authored by hiroshi shimoda of clear code inc.
... fixme: explain how setting this option and use next listings if we want to run firefox displaying none of its gui and only the contents of a certain xul file, we can launch firefox and set the option: -chrome file_url.xul another way, as shown in listing 1, is to use the window.opendialog() method, which can be used only within a xul window.
...enter the names of the other attributes whose values you want to store as a space-delimited ascii string into the value for persist; the next time that xul document is opened, the saved values will automatically be restored4.
... <hbox> <scale orient="horizontal" min="-100" max="100" value="0"/> <scale orient="vertical" min="0" max="100" value="50"/> </hbox> listing 29: the scale element figure 22: output from listing 29 « previousnext » ...
The Box Model - Archive of obsolete content
« previousnext » in order to master xul, you'll need to have a fairly good understanding of its box model.
...an hbox is oriented horizontally by default, meaning that its child nodes are displayed next to each other from left to right.
...here's a typical usage of the label element: <label control="xulschoolhello-greeting-textbox" value="&xulschoolhello.typegreeting.label;" /> <textbox id="xulschoolhello-greeting-textbox" /> the label says something like "type a greeting message", and the textbox next to it allows the user to type the message.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
Tabbed browser - Archive of obsolete content
onetabperurl(url) { var wm = components.classes["@mozilla.org/appshell/window-mediator;1"] .getservice(components.interfaces.nsiwindowmediator); var browserenumerator = wm.getenumerator("navigator:browser"); // check each browser instance for our url var found = false; while (!found && browserenumerator.hasmoreelements()) { var browserwin = browserenumerator.getnext(); var tabbrowser = browserwin.gbrowser; // check each tab of this browser instance var numtabs = tabbrowser.browsers.length; for (var index = 0; index < numtabs; index++) { var currentbrowser = tabbrowser.getbrowseratindex(index); if (url == currentbrowser.currenturi.spec) { // the url is already opened.
... function openandreuseonetabperattribute(attrname, url) { var wm = components.classes["@mozilla.org/appshell/window-mediator;1"] .getservice(components.interfaces.nsiwindowmediator); for (var found = false, index = 0, tabbrowser = wm.getenumerator('navigator:browser').getnext().gbrowser; index < tabbrowser.tabcontainer.childnodes.length && !found; index++) { // get the next tab var currenttab = tabbrowser.tabcontainer.childnodes[index]; // does this tab contain our custom attribute?
... var browserenumerator = wm.getenumerator("navigator:browser"); var tabbrowser = browserenumerator.getnext().gbrowser; // create tab var newtab = tabbrowser.addtab(url); newtab.setattribute(attrname, "xyz"); // focus tab tabbrowser.selectedtab = newtab; // focus *this* browser window in case another one is currently focused tabbrowser.ownerdocument.defaultview.focus(); } } the function can be called like so: openandreuseonetabperattribute("myextension-myattribute", ...
... next, get the <tabbrowser/> element.
findbar - Archive of obsolete content
attributes browserid, findnextaccesskey, findpreviousaccesskey, highlightaccesskey, matchcaseaccesskey properties browser, findmode methods close, onfindagaincommand, open, startfind, togglehighlight example <browser type="content-primary" flex="1" id="content" src="about:blank"/> <findbar id="findtoolbar" browserid="content"/> attributes browserid type: string the id of the browser elem...
... findnextaccesskey type: string the access key for the "find next" toolbar button in the findbar.
... onfindagaincommand( findprevious ) return type: no return value call this method to handle your application's "find next" and "find previous" commands.
... you should specify true as the input parameter to perform a "find previous" operation, or false to perform a "find next." startfind( mode ) return type: no return value call this method to handle your application's "find" command.
advance - Archive of obsolete content
ArchiveMozillaXULMethodadvance
« xul reference home advance( pageid ) return type: no return value call this method to go to the next page.
... this is equivalent to pressing the next button.
...the code in the onwizardnext attribute is called before the page is changed.
...supply null as the argument to go to the next page in the sequence.
OpenClose - Archive of obsolete content
on windows, the context menu can also be opened by pressing the menu key on the keyboard (the key on many keyboards next to control with a menu image) or by pressing shift+f10.
... the anchor of a popup is the element node that the popup is displayed next to.
... for instance, to have a popup appear next to a button, pass a reference to this button as the first argument to the openpopup method.
... in this next example, the popup is opened relative to the document element.
Filtering - Archive of obsolete content
« previousnext » adjusting the query sometimes you may wish to change the query at a later time.
...next, we'll look at also generating this list using a template.
...next, we will look at how to add the all choice to the menu, which won't be generated from the datasource.
... « previousnext » ...
Recursive Generation - Archive of obsolete content
« previousnext » in the previous example, the template builder generated an extra set of two buttons for the second row.
... <button label="http://www.xulplanet.com/rdf/b"/> </hbox> <hbox id="http://www.xulplanet.com/rdf/c"> <button label="http://www.xulplanet.com/rdf/a"/> <button label="http://www.xulplanet.com/rdf/c"/> </hbox> <hbox id="http://www.xulplanet.com/rdf/d"> <button label="http://www.xulplanet.com/rdf/a"/> <button label="http://www.xulplanet.com/rdf/d"/> </hbox> </vbox> for the next iteration, the insertion point will be the three <hbox> elements.
...we'll look more at recursive templates later, but next, let's look at a more practical example.
... « previousnext » ...
Result Generation - Archive of obsolete content
« previousnext » rdf in this section, we'll look at generating template output using rdf datasources.
...once you have selected a starting point, you use a number of statements which indicate where to go next when navigating the graph.
...once all results have been examined, the builder moves on to the next statement in the query.
... « previousnext » ...
Simple Example - Archive of obsolete content
« previousnext » let's look a more useful example, this time for a template that will show a list of photos.
... network will now look like this: (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/palace.jpg) (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/canal.jpg) (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/obselisk.jpg) the triple is evaluated next, and it will be examined for each potential result found so far.
...for the first result, the value of the ?photo variable is known, so the triple will be evaluated like so: <triple subject="http://www.xulplanet.com/ndeakin/images/t/palace.jpg" predicate="http://purl.org/dc/elements/1.1/title" object="?title"/> the builder next calculates the value for ?title using the predicate 'http://purl.org/dc/elements/1.1/title'.
... « previousnext » ...
Special Condition Tests - Archive of obsolete content
« previousnext » there are several additional types of conditional tests that may be performed.
...however, for the next iteration, that is, the next level of children, the content would instead be inserted into the groupbox generated from the previous iteration.
...on the next pass, the parent container will be the element with the uri attribute from the previous pass, in this case, the <groupbox> the first rule will not match in this case, but the second rule will match and a label will be created.
... « previousnext » ...
Static Content - Archive of obsolete content
« previousnext » creating a menuitem in the filter list to show all items is fairly easy.
...next, the template is examined and two results are generated.
...the builder then switches where generated content would be generated to inside to existing menupopup and moves onto the next part of the action, the menuitem.
... « previousnext » ...
Using Recursive Templates - Archive of obsolete content
« previousnext » you may recall that templates generate content recursively.
...in this next example, an assign element is used to assign the local name of the node is to the variable ?type.
...however, in most cases, there either aren't any children or the next iteration of the query doesn't return any results, so no output is generated.
... « previousnext » ...
Adding Methods to XBL-defined Elements - Archive of obsolete content
« previousnext » next, we'll find out how to add custom methods to xbl-defined elements.
... the next example can be used to create text with a label.
...here are some examples: <constructor> if (this.childnodes[0].getattribute("open") == "true"){ this.loadchildren(); } </constructor> <destructor action="savemyself(this);"/> the next section shows how to add event handlers to xbl-defined elements.
... « previousnext » ...
Anonymous Content - Archive of obsolete content
« previousnext » in this section we'll look at creating content with xbl.
...there are two images, so both will be added next to each other.
...in the next section, we'll look at how attributes can be inherited into the anonymous content.
... « previousnext » ...
Box Model Details - Archive of obsolete content
« previousnext » we've seen a lot of features of the box model.
...the following is an outline of both types of boxes: horizontal boxes lay out their elements next to each other horizontally.
...next, we will learn about a more specialized type of box, the groupbox.
... « previousnext » ...
Broadcasters and Observers - Archive of obsolete content
« previousnext » there may be times when you want several elements to respond to events or changes of state easily.
... next, because the broadcast occured, the event handler onbroadcast is called.
... next, we'll look at using the document object model with xul elements.
... « previousnext » ...
Commands - Archive of obsolete content
« previousnext » a command is an operation which may be invoked.
... if the currently focused element does not have a suitable controller, the window is checked next.
... next, we'll find out how to update commands.
... « previousnext » ...
Creating an Installer - Archive of obsolete content
« previousnext » this section will describe packaging a xul application into an installer.
... next, we create an array xpi which will hold the name (calendar) and url (calendar.xpi) of the installer.
... next, we'll look further at the install script.
... « previousnext » ...
Cross Package Overlays - Archive of obsolete content
« previousnext » this section describes how to apply overlays to files that don't import them.
... next, we add a node for each overlay to apply to the window.
...the following example shows how: <rdf:seq about="urn:mozilla:stylesheets"> <rdf:li resource="chrome://messenger/content/messenger.xul"/> </rdf:seq> <rdf:seq about="chrome://messenger/content/messenger.xul"> <rdf:li>chrome://blueswayedshoes/skin/myskinfile.css</rdf:li> </rdf:seq> next, we'll see how to create an installer for a xul application.
... « previousnext » ...
Custom Tree Views - Archive of obsolete content
« previousnext » the tree view holds the data to be displayed in the tree.
...we'll look at more of these in the next section.
... next, we'll look at more features of tree views.
... « previousnext » ...
Element Positioning - Archive of obsolete content
« previousnext » here we'll look at controlling the position and size of an element.
...the text inside will wrap to the next line, after fifty pixels.
... find files example so far: source view next, a summary and some additional details of the box model are described.
... « previousnext » ...
Features of a Window - Archive of obsolete content
« previousnext » we've already seen some features of windows.
...that means the next time the window is opened, it will still open in the saved location.
...if the name doesn't exist, then a new window is opened and the specified resource is loaded into its browsing context.">window.open() next, we'll look at how to open secondary dialogs.
... « previousnext » ...
Grids - Archive of obsolete content
ArchiveMozillaXULTutorialGrids
« previousnext » xul has a set of elements for creating tabular grids.
...the next cell, (lemon) will only be flexible vertically.
... next, we'll look at adding content panels.
... « previousnext » ...
Groupboxes - Archive of obsolete content
« previousnext » this section describes a way to include elements into groups groupboxes the groupbox element is used to group related xul elements together, much like the html fieldset element is used to group html elements.
...we'll add a groupbox to the find files dialog in the next section.
...next, we'll use what we've learned so far and add some additional elements to the find files dialog.
... « previousnext » ...
Introduction to XBL - Archive of obsolete content
« previousnext » xul has a sister language, xbl (extensible bindings language).
...we'll look more at the details of the xbl part in the next section.
...in the next section, we will look at creating content with xbl.
... « previousnext » ...
Keyboard Shortcuts - Archive of obsolete content
« previousnext » you could use keyboard event handlers to respond to the keyboard.
... you'll also notice in the image that text has been placed next to the paste menu command to indicate that ctrl and the v key can be pressed to invoke the menu command.
... our find files example so far : source view next, we'll find out how to handle focus and the selection.
... « previousnext » ...
List Controls - Archive of obsolete content
« previousnext » xul has a number of types of elements for creating list boxes.
...the user can see a single choice in a textbox and may click the arrow or some similar such button next to the textbox to make a different selection.
... in the next section, we'll learn about creating progress meters.
... « previousnext » ...
Manifest Files - Archive of obsolete content
« previousnext » in this section, we'll see how to put chrome and xul files into a package and create the manifest files for them.
... next, you are going to register the new application with mozilla so it will know where to find it.
...in the next section, we will start looking into the xul language.
... « previousnext » ...
More Event Handlers - Archive of obsolete content
« previousnext » in this section, the event object is examined and additional events are described.
...this is because the mousemove events occur at intervals depending on the speed at which the mouse moves and the mouse is usually moved some distance past the border by the time the next event fires.
... next, we'll find out how to add keyboard shortcuts.
... « previousnext » ...
More Menu Features - Archive of obsolete content
« previousnext » in this section, we'll look at creating submenus and checked menus creating submenus you can create submenus inside other menus (nested menus) using the existing elements.
...they don't have to be placed next to each other in the menu, although it doesn't make as much sense if they aren't.
... next, we'll find out how to create popup menus.
... « previousnext » ...
Popup Menus - Archive of obsolete content
« previousnext » in the last section, we looked at creating a menu on a menu bar.
...a good example is the drop down menu that appears when you click on the little down arrows next to the back and forward buttons in a browser window.
... our find files example so far : source view next, we'll look at how to create scrolling menus.
... « previousnext » ...
Splitters - Archive of obsolete content
« previousnext » we'll now look at how to add splitters to a window.
... the width and height attributes of the elements next the splitter are adjusted when the splitter is dragged.
... normal state: collapsed state: find files example so far : source view next, we'll find out how to create toolbars.
... « previousnext » ...
Stack Positioning - Archive of obsolete content
« previousnext » this section will describe how to position items in a stack.
...that is, the first child of the stack appears at the back, the next child appears next and so on.
... the next section describes tabboxes which are like decks but provide their own navigation.
... « previousnext » ...
Tabboxes - Archive of obsolete content
« previousnext » it is common in preference dialogs for tabbed pages to appear.
...next, adjust the tabbox so it has horizontal orientation.
... find files example so far : source view next, we'll look at how to create grids of content.
... « previousnext » ...
Toolbars - Archive of obsolete content
« previousnext » a toolbar is usually placed along the top of a window and contains a number of buttons that perform common functions.
...when more than one toolbar is placed next to each other, they are typically grouped together in something called a 'toolbox'.
... the find files example so far: source view next, we'll find out how to add a menu bar to a window.
... « previousnext » ...
Tree Selection - Archive of obsolete content
« previousnext » the section will describe how to get and set the selected items in a tree.
...the next item at index 1 will be its first child.
...tree.view.selection.clearrange(2,7); next, we'll find out how to create a custom view for a tree.
... « previousnext » ...
Trees - Archive of obsolete content
ArchiveMozillaXULTutorialTrees
« previousnext » xul provides a way to create tabular or hierarchical lists using a tree.
...trees with nested rows are described in the next section.
... find files example so far : source view next, we'll learn how to create more advanced trees.
... « previousnext » ...
XBL Attribute Inheritance - Archive of obsolete content
« previousnext » in this section we'll see how attributes can be inherited.
...the next example demonstrates this.
...if you need to map an attribute to the text content of the node, use "xbl:text" as the inner attribute, eg: <xul:description xbl:inherits="xbl:text=value"/> in the next section, we look at adding properties, methods and events to a binding.
... « previousnext » ...
Introduction to Public-Key Cryptography - Archive of obsolete content
as shown in the next section, one of the advantages of certificate-based authentication is that it can be used to replace the first three steps in figure 4 with a mechanism that allows the user to supply just one password (which is not sent across the network) and allows the administrator to control user authentication centrally.
... each certificate contains the name (dn) of that certificate's issuer, which is the same as the subject name of the next certificate in the chain.
...usa ca's dn is also the subject name of the next certificate in the chain.
...the signature can be verified with the public key in the issuer's certificate, which is the next certificate in the chain.
Collision detection - Game development
« previousnext » this is the 7th step out of 10 of the gamedev canvas tutorial.
...update the following part of the code as indicated by the highlighted line: var bricks = []; for(var c=0; c<brickcolumncount; c++) { bricks[c] = []; for(var r=0; r<brickrowcount; r++) { bricks[c][r] = { x: 0, y: 0, status: 1 }; } } next we'll check the value of each brick's status property in the drawbricks() function before drawing it — if status is 1, then draw it, but if it's 0, then it was hit by the ball and we don't want it on the screen anymore.
... next steps we are definitely getting there now; let's move on!
... « previousnext » ...
Paddle and keyboard controls - Game development
« previousnext » this is the 4th step out of 10 of the gamedev canvas tutorial.
...next we'll get into the code to use all of the things we just set up and to move the paddle on the screen.
... next steps now we have something resembling a game.
... « previousnext » ...
Track the score and win - Game development
« previousnext » this is the 8th step out of 10 of the gamedev canvas tutorial.
... next steps the game looks pretty good at this point.
... in the next lesson you will broaden the game's appeal by adding mouse controls.
... « previousnext » ...
Build the brick field - Game development
« previousnext » this is the 9th step out of 16 of the gamedev phaser tutorial.
... rendering the brick image next, let's load the image of the brick — add the following load.image() call just below the others: function preload() { // ...
... compare your code you can check the finished code for this lesson in the live demo below, and play with it to understand better how it works: next steps something is missing though.
... « previousnext » ...
Collision detection - Game development
« previousnext » this is the 10th step out of 16 of the gamedev phaser tutorial.
... now onto the next challenge — the collision detection between the ball and the bricks.
... compare your code you can check the finished code for this lesson in the live demo below, and play with it to understand better how it works: next steps we can hit the bricks and remove them, which is a nice addition to the gameplay already.
... « previousnext » ...
Extra lives - Game development
« previousnext » this is the 13th step out of 16 of the gamedev phaser tutorial.
...if yes, then the player still has some lives left and can continue to play — they will see the life lost message, the ball and paddle positions will be reset on screen and on the next input (click or touch) the message will be hidden and the ball will start to move again.
... compare your code you can check the finished code for this lesson in the live demo below, and play with it to understand better how it works: next steps lives made the game more forgiving — if you lose one life, you still have two more left and can continue to play.
... « previousnext » ...
Initialize the framework - Game development
« previousnext » this is the first of 16 tutorials to learn how to use gamedev phaser.
... the framework</title> <style>* { padding: 0; margin: 0; }</style> <script src="js/phaser.min.js"></script> </head> <body> <script> var game = new phaser.game(480, 320, phaser.canvas, null, { preload: preload, create: create, update: update }); function preload() {} function create() {} function update() {} </script> </body> </html> downloading the phaser code next, we need to go through the process of downloading the phaser source code and applying it to our html document.
... compare your code here's the full source code of the first lesson, running live in a jsfiddle: next steps now we've set up the basic html and learned a bit about phaser initialization, let's continue to the second lesson and learn about scaling.
... « previousnext » ...
What is accessibility? - Learn web development
overview: accessibility next this article starts the module off with a good look at what accessibility is — this overview includes what groups of people we need to consider and why, what tools different people use to interact with the web, and how we can make accessibility part of our web development workflow.
...text content (as you'll see in the next article) is easy, but what about your multimedia content, and your whizzy 3d graphics?
...you should now also have a thirst to learn about the implementation details that can make sites accessible, and we'll start on that in the next section, looking at why html is a good basis for accessibility.
... overview: accessibility next in this module what is accessibility?
Handling different text directions - Learn web development
previous overview: building blocks next many of the properties and values that we have encountered so far in our css learning have been tied to the physical dimensions of our screen.
...in this next example i have two boxes that contain a heading and a paragraph.
... in the next module we will take a good look at overflow in css.
... previous overview: building blocks next in this module cascade and inheritance css selectors type, class, and id selectors attribute selectors pseudo-classes and pseudo-elements combinators the box model backgrounds and borders handling different text directions overflowing content values and units sizing items in css images, media, and form elements styling tables debugging css organizing your css ...
Attribute selectors - Learn web development
previous overview: building blocks next as you know from your study of html, elements can have attributes that give further detail about the element being marked up.
... (aside: it may help to note that ^ and $ have long been used as anchors in so-called regular expressions to mean begins with and ends with.) the next example shows usage of these selectors: li[class^="a"] matches any attribute value which starts with a, so matches the first two list items.
... next steps now we are done with attribute selectors, you can continue on to the next article and read about pseudo-class and pseudo-element selectors.
... previous overview: building blocks next in this module cascade and inheritance css selectors type, class, and id selectors attribute selectors pseudo-classes and pseudo-elements combinators the box model backgrounds and borders handling different text directions overflowing content values and units sizing items in css images, media, and form elements styling tables debugging css organizing your css ...
Type, class, and ID selectors - Learn web development
previous overview: building blocks next in this lesson we will take a look at the simplest selectors that are available, which you will probably use the most in your work.
...in this next example we will highlight a <span> with a class of highlight differently to an <h1> heading with a class of highlight.
... in the next article we'll continue exploring selectors by looking at attribute selectors.
... previous overview: building blocks next in this module cascade and inheritance css selectors type, class, and id selectors attribute selectors pseudo-classes and pseudo-elements combinators the box model backgrounds and borders handling different text directions overflowing content values and units sizing items in css images, media, and form elements styling tables debugging css organizing your css ...
Styling tables - Learn web development
previous overview: building blocks next styling an html table isn't the most glamorous job in the world, but sometimes we all have to do it.
... next, create a new file called style.css and save it in the same directory as your other files.
...the next article explores debugging css — how to solve problems such as layouts not looking like they should, or properties not applying when you think they should.
... previous overview: building blocks next in this module cascade and inheritance css selectors type, class, and id selectors attribute selectors pseudo-classes and pseudo-elements combinators the box model backgrounds and borders handling different text directions overflowing content values and units sizing items in css images, media, and form elements styling tables debugging css organizing your css ...
CSS values and units - Learn web development
previous overview: building blocks next every property used in css has a value or set of values that are allowed for that property, and taking a look at any property page on mdn will help you understand the values that are valid for any particular property.
... the next example has font sizes set in percentages.
... hexadecimal rgb values the next type of color value you are likely to encounter is hexadecimal codes.
... previous overview: building blocks next in this module cascade and inheritance css selectors type, class, and id selectors attribute selectors pseudo-classes and pseudo-elements combinators the box model backgrounds and borders handling different text directions overflowing content values and units sizing items in css images, media, and form elements styling tables debugging css organizing your css...
Getting started with CSS - Learn web development
previous overview: first steps next in this article we will take a simple html document and apply css to it, learning some practical things about the language along the way.
... a:link { color: pink; } a:visited { color: green; } you can change the way the link looks when the user hovers over it, for example removing the underline, which is achieved by in the next rule: a:hover { text-decoration: none; } in the live example below, you can play with different values for the various states of a link.
... in the next lesson we will be taking a look at how css is structured.
... previous overview: first steps next in this module what is css?
What are browser developer tools? - Learn web development
click the checkboxes next to each declaration to see what would happen if you removed the declaration.
... click the little arrow next to each shorthand property to show the property's longhand equivalents.
... next to each rule is the file name and line number the rule is defined in.
... the next section, breakpoints, lists the breakpoints set on the page.
The HTML5 input types - Learn web development
previous overview: forms next in the previous article we looked at the <input> element, covering the original values of the type attribute available since the early days of html.
...this is why we've included an <output> element — to contain the current value (we'll also look at this element in the next article).
...we cover those in the next article.
... previous overview: forms next in this module your first form how to structure a web form basic native form controls the html5 input types other form controls styling web forms advanced form styling ui pseudo-classes client-side form validation sending form data advanced topics how to build custom form controls sending forms through javascript property compatibility table for form widgets ...
Styling web forms - Learn web development
previous overview: forms next in the previous few articles we looked at all the html you'll need to create and structure your web forms.
...we cover these in detail in the next article, ui pseudo-classes.
...in the next article, we will see how to handle form widgets which fall into the "bad" and "ugly" categories.
... previous overview: forms next in this module your first form how to structure a web form basic native form controls the html5 input types other form controls styling web forms advanced form styling ui pseudo-classes client-side form validation sending form data advanced topics how to build custom form controls sending forms through javascript property compatibility table for form widgets ...
What will your website look like? - Learn web development
previous overview: getting started with the web next what will your website look like?
... sketching out your design next, grab pen and paper and sketch out roughly how you want your site to look.
... click the "plus" (add to) icon next to the font you want.
... previous overview: getting started with the web next in this module installing basic software what will your website look like?
Advanced text formatting - Learn web development
previous overview: introduction to html next there are many other elements in html for formatting text, which we didn't get to in the html text fundamentals article.
...the above date could be written as: 20 january 2016 20th january 2016 jan 20 2016 20/01/16 01/20/16 the 20th of next month 20e janvier 2016 2016年1月20日 and so on but these different forms cannot be easily recognised by computers — what if you wanted to automatically grab the dates of all events in a page and insert them into a calendar?
...to find way more html elements, you can take a look at our html element reference (the inline text semantics section would be a great place to start.) in the next article we will look at the html elements you'd use to structure the different parts of an html document.
... previous overview: introduction to html next in this module getting started with html what’s in the head?
Images in HTML - Learn web development
overview: multimedia and embedding next in the beginning, the web was just text, and it was really quite boring.
... note: you can find the finished example from this section running on github (see the source code too.) alternative text the next attribute we'll look at is alt.
...in the next article we'll move it up a gear, looking at how to use html to embed video and audio in web pages.
... overview: multimedia and embedding next in this module images in html video and audio content from <object> to <iframe> — other embedding technologies adding vector graphics to the web responsive images mozilla splash page ...
From object to iframe — other embedding technologies - Learn web development
previous overview: multimedia and embedding next by now you should really be getting the hang of embedding things into your web pages, including images, video and audio.
...ie 10 and above) requests heightened security settings; we'll say more about this in the next section.
...we'll look at svg in the next article of the module.
... previous overview: multimedia and embedding next in this module images in html video and audio content from <object> to <iframe> — other embedding technologies adding vector graphics to the web responsive images mozilla splash page ...
Introducing asynchronous JavaScript - Learn web development
previous overview: asynchronous next in this article we briefly recap the problems associated with synchronous javascript, and take a first look at some of the different asynchronous techniques you'll encounter, showing how they can help us solve such problems.
... however, promises are specifically made for handling async operations, and have many advantages over old-style callbacks: you can chain multiple async operations together using multiple .then() operations, passing the result of one into the next one as an input.
... it will then move to the next line and begin executing the fetch() block but, because fetch() executes asynchronously without blocking, code execution continues after the promise-related code, thereby reaching the final console.log() statement (all done!) and outputting it to the console.
... previous overview: asynchronous next in this module general asynchronous programming concepts introducing asynchronous javascript cooperative asynchronous javascript: timeouts and intervals graceful asynchronous programming with promises making asynchronous programming easier with async and await choosing the right approach ...
Functions — reusable blocks of code - Learn web development
previous overview: building blocks next another essential concept in coding is functions, which allow you to store a piece of code that does a single task inside a defined block, and then call that code whenever you need it using a single short command — rather than having to type out the same code multiple times.
...you've already seen this structure a few times throughout the course, and you'll learn more about and see it in use in the next article.
...these tests require skills that are covered in the next two articles, so you might want to read those first before trying it.
... conclusion this article has explored the fundamental concepts behind functions, paving the way for the next one in which we get practical and take you through the steps to building up your own custom function.
Function return values - Learn web development
previous overview: building blocks next there's one last essential concept about functions for us to discuss — return values.
...after the function calculates the value, it can return the result so it can be stored in a variable; and you can use this variable in the next stage of the calculation.
... next, we're going to include a way to print out information about the number entered into the text input.
... next, we do a conditional test.
Basic math in JavaScript — numbers and operators - Learn web development
previous overview: first steps next at this point in the course we discuss math in javascript — how we can use operators and other features to successfully manipulate numbers to do our bidding.
...the incrementor is used to move to the next value when needed.
... in the next article, we'll explore text and how javascript allows us to manipulate it.
... previous overview: first steps next in this module what is javascript?
JavaScript object basics - Learn web development
overview: objects next in this article, we'll look at fundamental javascript object syntax, and revisit some javascript features that we've already seen earlier in the course, reiterating the fact that many of the features you've already dealt with are objects.
...next you write a dot, then the item you want to access — this can be the name of a simple property, an item of an array property, or a call to one of the object's methods, for example: person.age person.interests[1] person.bio() sub-namespaces it is even possible to make the value of an object member another object.
... in the next article we'll start to look at object-oriented programming (oop) theory, and how such techniques can be used in javascript.
... overview: objects next in this module object basics object-oriented javascript for beginners object prototypes inheritance in javascript working with json data object building practice adding features to our bouncing balls demo ...
Object-oriented JavaScript for beginners - Learn web development
previous overview: objects next with the basics out of the way, we'll now focus on object-oriented javascript (oojs) — this article presents a basic view of object-oriented programming (oop) theory, then explores how javascript emulates object classes via constructor functions, and how to create object instances.
... note that this set of tests relies on some of the knowledge taught in the next two articles, so you might want to read them first before you try the tests.
... in the next article, we'll explore javascript object prototypes.
... previous overview: objects next in this module object basics object-oriented javascript for beginners object prototypes inheritance in javascript working with json data object building practice adding features to our bouncing balls demo ...
Multimedia: Images - Learn web development
previous overview: performance next media, namely images and video, account for over 70% of the bytes downloaded for the average website.
... beyond loading a subset of images, next you should look into the format of the images themselves: are you loading the most optimal file formats?
...let's take a look at video optimization, tackling the next 20% of bandwidth consumption.
... previous overview: performance next in this module the "why" of web performance what is web performance?
What is web performance? - Learn web development
previous overview: performance next web performance is all about making web sites fast, including making slow processes seem fast.
... * versus subjective, perceived performance, covered in the next article what is web performance?
...next up we'll look at perceived performance, and how you can use some clever techniques to make some unavoidable performance hits appear less severe to the user, or disguise them completely.
... previous overview: performance next in this module the "why" of web performance what is web performance?
Client-Server Overview - Learn web development
previous overview: first steps next now that you know the purpose and potential benefits of server-side programming we're going to examine in detail what happens when a server receives a "dynamic request" from a browser.
...in order to "keep things real" we'll use the context of a sports-team manager website where a coach can select their team name and team size in an html form and get back a suggested "best lineup" for their next game.
...we discuss a lot more benefits and some popular web framework choices in the next article.
... previous overview: first steps next in this module introduction to the server side client-server overview server-side web frameworks website security ...
Ember interactivity: Events, classes and state - Learn web development
previous overview: client-side javascript frameworks next at this point we'll start adding some interactivity to our app, providing the ability to add and display new todo items.
...next we'll move on to getting our footer functionality working, including the todo counter, and look at conditional rendering, including correctly styling todos when they've been checked.
... previous overview: client-side javascript frameworks next in this module introduction to client-side frameworks framework main features react getting started with react beginning our react todo list componentizing our react app react interactivity: events and state react interactivity: editing, filtering, conditional rendering accessibility in react react resources ember getting started with ember ember app structure and componentization ember interactivity: events, classes and state ember interactivity: footer functionality, conditional rendering routing in ember ember resources and troubleshooting vue getting started with vue creating our first vue component ...
...dering: editing existing todos focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
Framework main features - Learn web development
previous overview: client-side javascript frameworks next each major javascript framework has a different approach to updating the dom, handling browser events, and providing an enjoyable developer experience.
...i'm sure you’re enthusiastic to get going and actually do some coding, and that's what you are going to do next!
... previous overview: client-side javascript frameworks next in this module introduction to client-side frameworks framework main features react getting started with react beginning our react todo list componentizing our react app react interactivity: events and state react interactivity: editing, filtering, conditional rendering accessibility in react react resources ember getting started with ember ember app structure and componentization ember interactivity: events, classes and state ember interactivity: footer func...
...dering: editing existing todos focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
Accessibility in React - Learn web development
previous overview: client-side javascript frameworks next in our final tutorial article, we'll focus on (pun intended) accessibility, including focus management in react, which can improve usability and reduce confusion for both keyboard-only and screenreader users.
...the next best thing is an intuitive location somewhere nearby.
... previous overview: client-side javascript frameworks next in this module introduction to client-side frameworks framework main features react getting started with react beginning our react todo list componentizing our react app react interactivity: events and state react interactivity: editing, filtering, conditional rendering accessibility in react react resources ember getting started with ember ember ap...
...dering: editing existing todos focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
Beginning our React todo list - Learn web development
previous overview: client-side javascript frameworks next let's say that we’ve been tasked with creating a proof-of-concept in react – an app that allows users to add, edit, and delete tasks they want to work on, and also mark tasks as complete without deleting them.
...we’ll start fixing that in the next chapter!
... previous overview: client-side javascript frameworks next in this module introduction to client-side frameworks framework main features react getting started with react beginning our react todo list componentizing our react app react interactivity: events and state react interactivity: editing, filtering, conditional rendering accessibility in react react resources ember getting started with ember ember app structure and componentization ember interactivity: events, classes and state ember interactivity: footer functionality, conditional rendering routing in ember ember resources and troubleshooting vue getting started with vue creating our first vue component rendering a list of vue components adding a new...
...dering: editing existing todos focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
Starting our Svelte Todo list app - Learn web development
previous overview: client-side javascript frameworks next now that we have a basic understanding of how things work in svelte, we can start building our example app: a todo list.
... moreover, our editor can display this warning even before calling the compiler: you can tell svelte to ignore this warning for the next block of markup with a comment beginning with svelte-ignore, like this: <!-- svelte-ignore a11y-missing-attribute --> <img height="32" width="88" src="https://udn.realityripple.com/samples/b0/98dase3c7d.png"> note: with vscode you can automatically add this ignore comment by clicking on the quick fix...
... previous overview: client-side javascript frameworks next in this module introduction to client-side frameworks framework main features react getting started with react beginning our react todo list componentizing our react app react interactivity: events and state react interactivity: editing, filtering, conditional rendering accessibility in react react resources ember getting started with ember ember ap...
...dering: editing existing todos focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
Getting started with Svelte - Learn web development
previous overview: client-side javascript frameworks next in this article we'll provide a quick introduction to the svelte framework.
...in the next article we'll start building our first proper application — a todo list.
... previous overview: client-side javascript frameworks next in this module introduction to client-side frameworks framework main features react getting started with react beginning our react todo list componentizing our react app react interactivity: events and state react interactivity: editing, filtering, conditional rendering accessibility in react react resources ember getting started with ember ember ap...
...dering: editing existing todos focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
Using Vue computed properties - Learn web development
previous overview: client-side javascript frameworks next in this article we'll add a counter that displays the number of completed todo items, using a feature of vue called computed properties.
...we do however have bigger fish to fry — in the next article we will look at conditional rendering, and how we can use it to show an edit form when we want to edit existing todo items.
... previous overview: client-side javascript frameworks next in this module introduction to client-side frameworks framework main features react getting started with react beginning our react todo list componentizing our react app react interactivity: events and state react interactivity: editing, filtering, conditional rendering accessibility in react react resources ember getting started with ember ember app structure and componentization ember interactivity: events, classes and state ember interactivity: footer functionality, conditional rendering routing in ember ember resources and troubleshooting vue getting started with vue creating our first vue component rendering a list of vue components adding a new...
...dering: editing existing todos focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
Vue resources - Learn web development
previous overview: client-side javascript frameworks next now we'll round off our study of vue by giving you a list of resources that you can use to go further in your learning, plus some other useful tips.
... next, run the npm run build (or yarn build) in the console.
... previous overview: client-side javascript frameworks next in this module introduction to client-side frameworks framework main features react getting started with react beginning our react todo list componentizing our react app react interactivity: events and state react interactivity: editing, filtering, conditional rendering accessibility in react react resources ember getting started with ember ember ap...
...dering: editing existing todos focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
Strategies for carrying out testing - Learn web development
previous overview: cross browser testing next this article starts the module off by providing an overview of the topic of (cross) browser testing, answering questions such as "what is cross-browser testing?", "what are the most common types of problems you'll encounter?", and "what are the main approaches for testing, identifying, and fixing problems?" prerequisites: familiarity with the core html, css, and javascript languages; an idea of the high level principles of cross-browser testing.
... the next page provides you with some code snippets and other instructions.
... next we'll turn our attention to the actual code issues your testing might uncover, starting with html and css.
... previous overview: cross browser testing next in this module introduction to cross-browser testing strategies for carrying out testing handling common html and css problems handling common javascript problems handling common accessibility problems implementing feature detection introduction to automated testing setting up your own test automation environment ...
Debugging on Mac OS X
the click next.
... name the project and click next.
...# breakpoint set --name nsthread::processnextevent --thread-index 1 --auto-continue true --one-shot true breakpoint command add -s python # this script that we run does not work if we try to use the global 'lldb' # object, since it is out of date at the time that the script runs (for # example, `lldb.target.executable.fullpath` is empty).
...:-( dummy_bp_list = lldb.sbbreakpointlist(target) debugger.getdummytarget().findbreakpointsbyname("nsthread::processnextevent", dummy_bp_list) dummy_bp_id = dummy_bp_list.getbreakpointatindex(0).getid() + 1 debugger.getdummytarget().breakpointdelete(dummy_bp_id) # "source" the mozilla project .lldbinit: os.chdir(target.executable.fullpath.split("/dist/")[0]) debugger.handlecommand("command source -s true " + os.path.join(os.getcwd(), ".lldbinit")) done see debugging mozilla with lldb for more...
Multiple Firefox profiles
the beta channel contains the features that are expected to be in the next release of firefox and are in final stages of testing.
... press the “launch profile in new browser” button next to it.
... click next and enter the name of the profile.
... type about:profiles into the browser url search bar on the page, click create a new profile button read the introduction, and click next enter a profile name for your new profile.
nss tech note1
this information is stored in the next lowest tag bit (number 5).
...if the component in the input data does not match this template, the decoder will continue processing the input data using the next available template.
...sec_quickderdecodeitem supports skipping the decoding of optional components if you define the tag of the component in the template sec_asn1_inner: recurse into the component and saves its content, without the surrounding asn.1 tag and length sec_asn1_save: saves the component data, but does not proceed to the next component if within a sequence template array.
... this means the next template will reprocess the same component.
NSS functions
later cert_encodepolicyconstraintsextension mxr 3.12 and later cert_encodepolicymappingextension mxr 3.12 and later cert_encodesubjectkeyid mxr 3.12 and later cert_encodeusernotice mxr 3.12 and later cert_extractpublickey mxr 3.2 and later cert_findcertbyname mxr 3.2 and later cert_findcrlentryreasonexten mxr 3.12 and later cert_findcrlnumberexten mxr 3.12 and later cert_findnameconstraintsexten mxr 3.12 and later cert_filtercertlistbycanames mxr 3.4 and later cert_filtercertlistbyusage mxr 3.4 and later cert_filtercertlistforusercerts mxr 3.6 and later cert_findcertbydercert mxr 3.2 and later ...
...cert_getcommonname mxr 3.2 and later cert_getcountryname mxr 3.2 and later cert_getdbcontentversion mxr 3.2 and later cert_getdefaultcertdb mxr 3.2 and later cert_getdomaincomponentname mxr 3.2 and later cert_getfirstemailaddress mxr 3.7 and later cert_getlocalityname mxr 3.2 and later cert_getnextemailaddress mxr 3.7 and later cert_getnextgeneralname mxr 3.10 and later cert_getnextnameconstraint mxr 3.10 and later cert_getocspresponsestatus mxr 3.6 and later cert_getocspstatusforcertid mxr 3.6 and later cert_getoidstring mxr 3.9 and later cert_getorgname mxr 3.2 and later cert_getorguni...
... pk11_getkeystrength mxr 3.2 and later pk11_getmechanism mxr 3.2 and later pk11_getminimumpwdlength mxr 3.4 and later pk11_getmodinfo mxr 3.6 and later pk11_getmodule mxr 3.3 and later pk11_getmoduleid mxr 3.2 and later pk11_getnextgenericobject mxr 3.9.2 and later pk11_getnextsafe mxr 3.4 and later pk11_getnextsymkey mxr 3.4 and later pk11_getpadmechanism mxr 3.4 and later pk11_getpbecryptomechanism mxr 3.12 and later pk11_getpbeiv mxr 3.6 and later pk11_get...
... sec_pkcs12createunencryptedsafe mxr 3.2 and later sec_pkcs12decoderfinish mxr 3.2 and later sec_pkcs12decodergetcerts mxr 3.4 and later sec_pkcs12decoderimportbags mxr 3.2 and later sec_pkcs12decoderiterateinit mxr 3.10 and later sec_pkcs12decoderiteratenext mxr 3.10 and later sec_pkcs12decodersettargettokencas mxr 3.8 and later sec_pkcs12decoderstart mxr 3.2 and later sec_pkcs12decoderupdate mxr 3.2 and later sec_pkcs12decodervalidatebags mxr 3.2 and later sec_pkcs12decoderverify mxr 3.2 and later ...
A Web PKI x509 certificate primer
generate the key using the following command: openssl genpkey -algorithm rsa -out key.pem -pkeyopt rsa_keygen_bits:2048 2048 is considered secure for the next 4 years.
... steps to generate your ca root certificate: generate key "openssl genpkey -algorithm rsa -out rootkey.pem -pkeyopt rsa_keygen_bits:4096" 4096 is considered secure for the next 15 years.
... generate key "openssl genpkey -algorithm rsa -out r=intkey.pem -pkeyopt rsa_keygen_bits: 3072" a 3072 bit key is considered secure for the next 8 years.
... generate key "openssl genpkey -algorithm rsa -out eekey.pem -pkeyopt rsa_keygen_bits: 2048" 2048 is considered secure for the next 4 years.
nsIMessenger
getundotransactiontype() gets the type of the next undo transaction.
... getredotransactiontype() gets the type of the next redo transaction.
... undo() performs the next undo transaction.
... redo() performs the next redo transaction.
nsITextInputProcessor
createinstance(components.interfaces.nsitextinputprocessor); next, you need to get the rights to create composition or dispatch keyboard events with begininputtransaction() or begininputtransactionfortests(): if (!tip.begininputtransaction(window, callback)) { return; } if begininputtransaction() or begininputtransactionfortests() returns false, it means that another instance of nsitextinputprocessor has composition on the window or is dispatching an event...
... next, you can set the composition string or dispatch keyboard events.
...tip.setpendingcompositionstring("foo-bar-buzz"); // next, append clauses.
...var akeyevent = new keyboardevent("", { key: "a", code: "keya", keycode: keyboardevent.dom_vk_a }); tip.flushpendingcomposition(akeyevent); // pressing shift key for next input.
nsIThread
last changed in gecko 1.9 (firefox 3) inherits from: nsieventtarget method overview void shutdown() boolean haspendingevents() boolean processnextevent(in boolean maywait) attributes attribute type description prthread prthread the nspr thread object corresponding to the nsithread.
... processnextevent() processes the next pending event.
... warning: calling nsithread.processnextevent allows network and ui events to run which can modify data structures that your code isn't expecting to be modified during a synchronous method call.
... boolean processnextevent( in boolean maywait ); parameters maywait if true, this method blocks until an event is available to process if the event queue is empty.
nsITreeColumn
nsitreecolumn getnext(); nsitreecolumn getprevious(); void invalidate(); attributes attribute type description atom nsiatom the atom attribute of nsitreecolumn which returns an nsiatom for the column, making it fast to do comparisons.
... methods native code only!getidconst void getidconst( [shared] out wstring idconst ); parameters idconst getnext() get the next column in the nsitreecolumns.
... nsitreecolumn getnext(); parameters none.
... return value the next nsitreecolumn in the nsitreecolumns.
nsITreeView
n 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 row, in nsitreecolumn col); boolean isselectable(in long row, in nsitreecolumn col); boolean isseparator(in long index); boolean issorted(); ...
... you must use the nsiatomservice to create an nsiatom string, which can then be appended to the array to alter the style (see also styling a tree) getrowproperties: function(index, properties) { var atomservice = components.classes["@mozilla.org/atom-service;1"].getservice(components.interfaces.nsiatomservice); var atom = atomservice.getatom("dummy"); properties.appendelement(atom); } hasnextsibling() used to determine if the row at rowindex has a nextsibling that occurs after the index specified by afterindex.
... boolean hasnextsibling( in long rowindex, in long afterindex ); parameters rowindex the index of the item.
... return value true if the row has a next sibling.
nsMsgNavigationType
for example to move forward a message, you would call: // assuming gdbview is a global nsimsgdbview var resultid = new object(); var resultindex = new object(); var threadindex = new object(); gdbview.viewnavigate(components.interfaces.nsmsgnavigationtype.nextmessage, resultid, resultindex, threadindex, true); the nsmsgnavigationtype interface is defined as a global variable in thunderbird: var nsmsgviewcommandtype = components.interfaces.nsmsgviewcommandtype; mailnews/base/public/nsimsgdbview.idlscriptable please add a summary to this article.
... nextmessage 2 go to the next message in the view.
... nextunreadmessage 7 go to the next unread message in the view.
... nextunreadthread 10 nextunreadfolder 11 nextfolder 12 readmore 13 back 15 go back to the previous visited message forward 16 go forward to the previous visited message firstflagged 17 nextflagged 18 previousflagged 19 firstnew 20 editundo 21 editredo 22 togglesubthreadkilled 23 ...
Using the clipboard
next we need to initialize it with a "privacy context", which will ensure that source data from inside private browsing mode will be cleared when the mode is exited.
... the next step is to tell the transferable what type of data we want to use.
...next, we need to get the data from the clipboard: services.clipboard.getdata(trans, services.clipboard.kglobalclipboard); var str = {}; var strlength = {}; trans.gettransferdata("text/unicode", str, strlength); the first line performs the opposite of setdata.
...next we create two javascript objects which will hold the return values from gettransferdata.
Initialization and Destruction - Plugins
« previousnext » this chapter describes the methods that provide the basic processes of initialization, instance creation and destruction, and shutdown.
... the next three parameters pass parameters from the embed element that called the plug-in.
... loop: <embed src="movie.avi" height="100" width="100" loop="true"> with the embed element in the example, the browser passes the values in argv to the plug-in instance: argc = 4 argn = { "src", "height", "width", "loop" } argv = { "movie.avi", "100", "100", "true" } the saved parameter allows an instance of a plug-in to save its data and, when the instance is destroyed, pass the data to the next instance of the plug-in at the same url.
...*/ if (useragent != null) npn_memfree(useragent); return nperr_no_error; } « previousnext » ...
Plug-in Basics - Plugins
next » how plug-ins are used plug-ins offer a rich variety of features that can increase the flexibility of gecko-based browsers.
...the next section, understanding the runtime model, describes these stages in more detail.
...the next section, how gecko finds plug-ins, describes these rules, and the following section, checking plug-ins by mime type, describes how you can use javascript to locate plug-ins yourself and establish which ones are to be registered for which mime types.
... plug-in references the mozilla plug-ins project page « previousnext » ...
Streams - Plugins
« previousnext » this chapter describes using plug-in api functions to receive and send streams.
...at the next npp_writeready call, only half of the data has been processed.
... writing the stream to the plug-in the next step is to write the data to a plug-in from a stream.
... « previousnext » ...
UI Tour - Firefox Developer Tools
when a file is ignored, it has a small eye icon next to it in place of its regular icon.
... step over (f10): steps to the next line of javascript code.
...next to each breakpoint is a checkbox which you can use to enable/disable it: watch expressions you can add watch expressions in the right pane.
... scopes in the right-hand pane you'll see a label "scopes" with a disclosure arrow next to it.
Debugger.Frame - Firefox Developer Tools
when a debugger calls an invocation function to run debuggee code, that code’s continuation is the debugger, not the next debuggee code frame.
... older the next-older visible frame, in which control will resume when this frame completes.
... 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.
...the resumption value each handler returns establishes the completion value reported to the next handler.
Tips - Firefox Developer Tools
in the rules view: click the inspector icon () next to any selector to highlight all elements that match it.
... click the inspector icon () next to the element{} rule to lock the highlighter on the current element.
... click on the filter icon () next to an overridden property to find which other property overrides it.
... in the console output: click on the inspector icon () next to an element in the output to select it within the inspector.
Basic animations - Web APIs
« previousnext » since we're using javascript to control <canvas> elements, it's also very easy to make (interactive) animations.
... requestanimationframe(callback) tells the browser that you wish to perform an animation and requests that the browser call a specified function to update an animation before the next repaint.
... advanced animations we will have a look at some advanced animation techniques and physics in the next chapter.
... « previousnext » ...
Compositing and clipping - Web APIs
« previousnext » in all of our previous examples, shapes were always drawn one on top of the other.
...next, we create the circular clipping path by drawing an arc and calling clip().
...you can see this clearly in the linear gradient that's drawn next.
... screenshotlive sample « previousnext » ...
Traversing an HTML table with JavaScript and DOM Interfaces - Web APIs
next, we created the <tbody> element, which is a child of the <table> element.
... next, we used a loop to create the <tr> elements, which are children of the <tbody> element.
... once we have created the <table>, <tbody>, <tr>, and <td> elements, and then the text node, we then append each object to its parent in the opposite order: first, we attach each text node to its parent <td> element using cell.appendchild(celltext); next, we attach each <td> element to its parent <tr> element using row.appendchild(cell); next, we attach each <tr> element to the parent <tbody> element using tblbody.appendchild(row); next, we attach the <tbody> element to its parent <table> element using tbl.appendchild(tblbody); next, we attach the <table> element to its parent <body> element using body.appendchild(tbl); remem...
... next, we get all the p elements that are descendants of the body: mybodyelements = mybody.getelementsbytagname("p"); finally, we get the second item from the list of p elements via myp = mybodyelements[1]; once you have gotten the dom object for an html element, you can set its properties.
Element.classList - Web APIs
WebAPIElementclassList
e; }; if (!domtokenlistproto.foreach) domtokenlistproto.foreach = function(f){ if (arguments.length === 1) for (var i = 0, len = this.length; i !== len; ++i) f( this[i], i, this); else for (var i=0,len=this.length,targ=arguments[1]; i !== len; ++i) f.call(targ, this[i], i, this); }; if (!domtokenlistproto.entries) domtokenlistproto.entries = function(){ var nextindex = 0, that = this; return {next: function() { return nextindex<that.length ?
... {value: [nextindex, that[nextindex++]], done: false} : {done: true}; }}; }; if (!domtokenlistproto.values) domtokenlistproto.values = function(){ var nextindex = 0, that = this; return {next: function() { return nextindex<that.length ?
... {value: that[nextindex++], done: false} : {done: true}; }}; }; if (!domtokenlistproto.keys) domtokenlistproto.keys = function(){ var nextindex = 0, that = this; return {next: function() { return nextindex<that.length ?
... {value: nextindex++, done: false} : {done: true}; }}; }; })(window.domtokenlist.prototype, window.document.createelement("div").classlist); })(window); caveats the polyfill is limited in functionality.
IDBCursorSync - Web APIs
constants constant value description next 0 this cursor includes duplicates, and its direction is monotonically increasing in the order of keys.
... next_no_duplicate 1 this cursor does not include duplicates, and its direction is monotonically increasing in the order of keys.
... methods continue() advances the cursor to the next position along its direction, to the item whose key matches the optional key parameter.
... if no key is specified, advance to the immediate next position.
Hello GLSL - Web APIs
« previousnext » this webgl example demonstrates a very basic glsl shader program that draws a solid color square.
...if the canvas remains blank, you can check the output of the next example, which draws exactly the same thing.
... but remember to read through the explanations and code on this page, before moving on to the next.
... « previousnext » ...
Adding 2D content to a WebGL context - Web APIs
« previousnext » once you've successfully created a webgl context, you can start rendering into it.
...each iteration of the vertex shader receives the next value from the buffer assigned to that attribute.
... { const numcomponents = 2; // pull out 2 values per iteration const type = gl.float; // the data in the buffer is 32bit floats const normalize = false; // don't normalize const stride = 0; // how many bytes to get from one set of values to the next // 0 = use type and numcomponents above const offset = 0; // how many bytes inside the buffer to start from gl.bindbuffer(gl.array_buffer, buffers.position); gl.vertexattribpointer( programinfo.attriblocations.vertexposition, numcomponents, type, normalize, stride, offset); gl.enablevertexattriba...
... see also matrices on webglfundamentals matrices on wolfram mathworld matrix on wikipedia « previousnext » ...
A simple RTCDataChannel sample - Web APIs
the next step is to create the rtcdatachannel by calling rtcpeerconnection.createdatachannel() and set up event listeners to monitor the channel so that we know when it's opened and closed (that is, when the channel is connected or disconnected within that peer connection).
... set up the ice candidates the next step is to set up each connection with ice candidate listeners; these will be called when there's a new ice candidate to tell the other side about.
... the next step is to connect the local peer to the remote by telling the remote peer about it.
... next steps you should try out this example and take a look at the webrtc-simple-datachannel source code, available on github.
Writing WebSocket servers - Web APIs
let's look at that next.
... read the next 16 bits and interpret those as an unsigned integer.
... read the next 64 bits and interpret those as an unsigned integer.
... reading and unmasking the data if the mask bit was set (and it should be, for client-to-server messages), read the next 4 octets (32 bits); this is the masking key.
Viewpoints and viewers: Simulating cameras in WebXR - Web APIs
in single-screen 2d games, the camera is not associated directly with the player or any other character in the game, but is instead either fixed above or next to the game play area, or follows the action as the action moves around a scrolling game world.
...this is because each transform affects the position of the object and possibly the very coordinate system itself, which can dramatically change the results of the next operation performed.
...here's what that looks like conceptually: your code tells the webxr engine that you want to provide the next animation frame by calling the xrsession method requestanimationframe(), providing a callback function that renders a frame of animation.
... next, we go ahead and queue up the request to render the next frame of video, so we don't have to worry about doing it later, by simply calling requestanimationframe() again.
Visualizations with Web Audio API - Web APIs
creating a waveform/oscilloscope to create the oscilloscope visualisation (hat tip to soledad penadés for the original code in voice-change-o-matic), we first follow the standard pattern described in the previous section to set up the buffer: analyser.fftsize = 2048; var bufferlength = analyser.frequencybincount; var dataarray = new uint8array(bufferlength); next, we clear the canvas of what had been drawn on it before to get ready for the new visualization display: canvasctx.clearrect(0, 0, width, height); we now define the draw() function: function draw() { in here, we use requestanimationframe() to keep looping the drawing function once it has been started: var drawvisual = requestanimationframe(draw); next, we grab the time domain data and copy ...
...it into our array analyser.getbytetimedomaindata(dataarray); next, fill the canvas with a solid colour to start canvasctx.fillstyle = 'rgb(200, 200, 200)'; canvasctx.fillrect(0, 0, width, height); set a line width and stroke colour for the wave we will draw, then begin drawing a path canvasctx.linewidth = 2; canvasctx.strokestyle = 'rgb(0, 0, 0)'; canvasctx.beginpath(); determine the width of each segment of the line to be drawn by dividing the canvas width by the array length (equal to the frequencybincount, as defined earlier on), then define an x variable to define the position to move to for drawing each segment of the line.
... var slicewidth = width * 1.0 / bufferlength; var x = 0; now we run through a loop, defining the position of a small segment of the wave for each point in the buffer at a certain height based on the data point value form the array, then moving the line across to the place where the next wave segment should be drawn: for(var i = 0; i < bufferlength; i++) { var v = dataarray[i] / 128.0; var y = v * height/2; if(i === 0) { canvasctx.moveto(x, y); } else { canvasctx.lineto(x, y); } x += slicewidth; } finally, we finish the line in the middle of the right hand side of the canvas, then draw the stroke we've defined: canvasctx.lineto(canvas.width, canvas.height/2); canvasctx.stroke(); }; at the en...
... analyser.fftsize = 256; var bufferlength = analyser.frequencybincount; console.log(bufferlength); var dataarray = new uint8array(bufferlength); canvasctx.clearrect(0, 0, width, height); next, we start our draw() function off, again setting up a loop with requestanimationframe() so that the displayed data keeps updating, and clearing the display with each animation frame.
Using the Web Speech API - Web APIs
start of our code we include these lines to feed the right objects to chrome, and any future implementations that might support the features without a prefix: var speechrecognition = speechrecognition || webkitspeechrecognition var speechgrammarlist = speechgrammarlist || webkitspeechgrammarlist var speechrecognitionevent = speechrecognitionevent || webkitspeechrecognitionevent the grammar the next part of our code defines the grammar we want our app to recognise.
... plugging the grammar into our speech recognition the next thing to do is define a speech recogntion instance to control the recognition for our application.
... populatevoicelist(); if (speechsynthesis.onvoiceschanged !== undefined) { speechsynthesis.onvoiceschanged = populatevoicelist; } speaking the entered text next, we create an event handler to start speaking the text entered into the text field.
... next, we need to figure out which voice to use.
Window.requestAnimationFrame() - Web APIs
the window.requestanimationframe() method tells the browser that you wish to perform an animation and requests that the browser calls a specified function to update an animation before the next repaint.
... note: your callback routine must itself call requestanimationframe() if you want to animate another frame at the next repaint.
...this will request that your animation function be called before the browser performs the next repaint.
... syntax window.requestanimationframe(callback); parameters callback the function to call when it's time to update your animation for the next repaint.
CSS Animations tips and tricks - CSS: Cascading Style Sheets
javascript content next we'll look at the javascript that does the work.
...our callback gets executed just before the next repaint of the document.
...this time, the callback is run before the next repaint, which is after the style recomputation has occurred.
... of course, we also need to add an event handler to our "run" button so it'll actually do something: document.queryselector(".runbutton").addeventlistener("click", play, false); result stopping an animation simply removing the animation-name applied to an element will make it jump or cut to its next state.
Layout using named grid lines - CSS: Cascading Style Sheets
in this next example i am creating a grid with twelve equal width columns.
...my next item will be placed from the 7th line named col-start and span 3 lines.
... .wrapper { grid-template-columns: repeat(4, [col1-start] 1fr [col2-start] 3fr); } if your repeating syntax puts two lines next to each other then they will be merged, and create the same result as giving a line multiple names in a non-repeating track definition.
...then, in the next guide we will look at how grid can position items for us - without us needing to use placement properties at all!
Realizing common layouts using CSS Grid Layout - CSS: Cascading Style Sheets
in the fourth row track i have chosen to place my ad content – so it appears under the sidebar, then the footer next to it under the content.
... .wrapper > * { grid-column: col-start / span 12; } at the next breakpoint we want to move to a two-column layout.
...the header continues to span right across the grid, but now the navigation moves down to become the first sidebar, with the content and then the sidebar next to it.
...in this next example i’m combining css grid and flexbox layouts to make a simple product listing layout.
Loops and iteration - JavaScript
« previousnext » loops offer a quick and easy way to do something repeatedly.
... when you use continue without a label, it terminates the current iteration of the innermost enclosing while, do-while, or for statement and continues execution of the loop with the next iteration.
...if continue is encountered, the program terminates the current iteration of checkj and begins the next iteration.
...while for...in iterates over property names, for...of iterates over property values: const arr = [3, 5, 7]; arr.foo = 'hello'; for (let i in arr) { console.log(i); // logs "0", "1", "2", "foo" } for (let i of arr) { console.log(i); // logs 3, 5, 7 } « previousnext » ...
Numbers and dates - JavaScript
« previousnext » this chapter introduces the concepts, objects and functions used to work with and perform calculations using numbers and dates in javascript.
... the next four statements build a string value based on the time.
... the next statement appends a minute value to temp.
... « previousnext » ...
The legacy Iterator protocol - JavaScript
an object is an legacy iterator when it implements a next() method with the following semantics, and throws stopiteration at the end of iteration.
... property value next a zero arguments function that returns an value.
... difference between legacy and es2015 iterator protocols the value was returned directly as a return value of calls to next, instead of the value property of a placeholder object iteration termination was expressed by throwing a stopiteration object.
... simple example with the old protocol function makeiterator(array){ var nextindex = 0; return { next: function(){ if(nextindex < array.length){ return array[nextindex++]; else throw new stopiteration(); } } } var it = makeiterator(['yo', 'ya']); console.log(it.next()); // 'yo' console.log(it.next()); // 'ya' try{ console.log(it.next()); } catch(e){ if(e instanceof stopiteration){ // iteration over } } ...
Promise.prototype.then() - JavaScript
receive "foo", concatenate "bar" to it, and resolve that to the next then .then(function(string) { return new promise(function(resolve, reject) { settimeout(function() { string += 'bar'; resolve(string); }, 1); }); }) // 2.
... receive "foobar", register a callback function to work on that string // and print it to the console, but not before returning the unworked on // string to the next then .then(function(string) { settimeout(function() { string += 'baz'; console.log(string); // foobarbaz }, 1) return string; }) // 3.
... const nexttick = (() => { const noop = () => {}; // literally const nexttickpromise = () => promise.resolve().then(noop); const rfab = reflect.apply.bind; // (thisarg, fn, thisarg, [...args]) const nexttick = (fn, ...args) => ( fn !== undefined ?
... promise.resolve(args).then(rfab(null, fn, null)) : nexttickpromise(), undefined ); nexttick.ntp = nexttickpromise; return nexttick; })(); specifications specification ecmascript (ecma-262)the definition of 'promise.prototype.then' in that specification.
RegExp.prototype.exec() - JavaScript
"the quick brown fox jumps over the lazy dog" re lastindex the index at which to start the next match.
...'; msg += 'next match starts at ' + myre.lastindex; console.log(msg); } this script displays the following text: found abb.
... next match starts at 3 found ab.
... next match starts at 9 warning: do not place the regular expression literal (or regexp constructor) within the while condition!
yield* - JavaScript
examples delegating to another generator in following code, values yielded by g1() are returned from next() calls just like those which are yielded by g2().
... function* g1() { yield 2; yield 3; yield 4; } function* g2() { yield 1; yield* g1(); yield 5; } const iterator = g2(); console.log(iterator.next()); // {value: 1, done: false} console.log(iterator.next()); // {value: 2, done: false} console.log(iterator.next()); // {value: 3, done: false} console.log(iterator.next()); // {value: 4, done: false} console.log(iterator.next()); // {value: 5, done: false} console.log(iterator.next()); // {value: undefined, done: true} other iterable objects besides generator objects, yield* can also yield other kinds of iterables (e.g., arrays, strings, or arguments objects).
... function* g3() { yield* [1, 2]; yield* '34'; yield* array.from(arguments); } const iterator = g3(5, 6); console.log(iterator.next()); // {value: 1, done: false} console.log(iterator.next()); // {value: 2, done: false} console.log(iterator.next()); // {value: "3", done: false} console.log(iterator.next()); // {value: "4", done: false} console.log(iterator.next()); // {value: 5, done: false} console.log(iterator.next()); // {value: 6, done: false} console.log(iterator.next()); // {value: undefined, done: true} the value of yield* expression itself yield* is an expression, not a statement—so it evaluates to a value.
... function* g4() { yield* [1, 2, 3]; return 'foo'; } function* g5() { const g4returnvalue = yield* g4(); console.log(g4returnvalue) // 'foo' return g4returnvalue; } const iterator = g5(); console.log(iterator.next()); // {value: 1, done: false} console.log(iterator.next()); // {value: 2, done: false} console.log(iterator.next()); // {value: 3, done: false} done is false because g5 generator isn't finished, only g4 console.log(iterator.next()); // {value: 'foo', done: true} specifications specification ecmascript (ecma-262)the definition of 'yield' 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.
... now, onto the next javascript file.
...you can use the following ones:"); console.log(webpush.generatevapidkeys()); return; } webpush.setvapiddetails( 'https://serviceworke.rs/', process.env.vapid_public_key, process.env.vapid_private_key ); next, a module defines and exports all the routes an app needs to handle: getting the vapid public key, registering, and then sending notifications.
... previous overview: progressive next ...
Getting started - SVG: Scalable Vector Graphics
« previousnext » a simple example let us dive straight in with a simple example.
... how svg handles sizes and units will be explained on the next page.
... a word on webservers now that you have an idea of how to create basic svg files, the next stage is to upload them to a webserver.
... « previousnext » ...
Paths - SVG: Scalable Vector Graphics
WebSVGTutorialPaths
« previousnext » the <path> element is the most powerful element in the svg library of basic shapes.
...after that, the parser begins reading for the next command.
... the four different paths mentioned above are determined by the next two parameter flags.
...this interactive demo might help understand the concepts behind svg arcs: http://codepen.io/lingtalfi/pen/yalwjg (tested in chrome and firefox only, might not work in your browser) « previousnext » ...
event/target - Archive of obsolete content
such listeners are called only once next time event of the specified type is emitted: target.once('ready', function onready() { // do the thing once ready!
... more details listeners registered during the event propagation (by one of the listeners) won't be triggered until next emit of the matching type: let { emit } = require('sdk/event/core'); target.on('message', function onmessage(message) { console.log('listener triggered'); target.on('message', function() { console.log('nested listener triggered'); }); }); emit(target, 'message'); // info: 'listener triggered' emit(target, 'message'); // info: 'listener triggered' // info: 'ne...
... returns eventtarget : returns the eventtarget instance once(type, listener) registers an event listener that is called only once: the next time an event of the specified type is emitted.
Appendix: What you should know about open-source software licenses - Archive of obsolete content
these conditions will vary from one license to the next, but the open source definition stipulates the following minimum conditions: the integrity of the author’s source code must be preserved; no discrimination may be made against individuals or organizations; no discrimination may be made based on field of endeavor; no additional licensing can be required when redistributing; license must not be specific to a product; license must not inte...
... types of oss licenses and their characteristics the details of oss licenses vary from one license to the next.
... applying a license to original works if you want to release your own code as open-source, here’s what you do next.
Adding windows and dialogs - Archive of obsolete content
« previousnext » opening windows and dialogs to open a new window, use the javascript window.open function just like with html windows.
...each tab key press moves you to the next control in the window, giving it focus.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
Connecting to Remote Content - Archive of obsolete content
« previousnext » using xmlhttprequest xmlhttprequest is an api for transferring xml between a local script and a remote server via http.
...name"> <xul:hbox> <xul:label value="name:" /> <xul:label> <xsl:value-of select="." /> </xul:label> </xul:hbox> </xsl:for-each> <xul:hbox> <xul:label value="total:" /> <xul:label> <xsl:value-of select="total" /> </xul:label> </xul:hbox> </xul:vbox> </xsl:template> </xsl:stylesheet> next you need to read the xslt stylesheet as a file stream and parse it into a document object.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
Getting Started with Firefox Extensions - Archive of obsolete content
« previousnext » what's a firefox extension?
...in the next section, we'll inspect these files and see what they do.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
Local Storage - Archive of obsolete content
« previousnext » note: you may rather be looking for dom storage (localstorage, etc.), unless you really are doing xul development.
...adding or removing columns, or making other changes to your db structure from one version of your extension to the next will probably cause breakage of user data in older versions.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
Setting Up a Development Environment - Archive of obsolete content
« previousnext » getting the right tools there are 3 tools that we think are essential for effective add-on development (or any kind of development, really): a source code editor, a source control system, and a build system.
...it isn't necessary to add this, but it's better so that it is consistent with the make command we'll see next.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
Firefox addons developer guide - Archive of obsolete content
these should use the previous, next, and prevnext templates to add quick routes to get from chapter to chapter.
...nsi; talk about fuel; titles of chapters and sub-headings should have caps for first letter of each word; we should add a part about bad and good practices (leaks, global scopes, ...); add external resources (mozdev.org/community/books.html); add to chapter 3 or 5 more informations about overlay (how to overlay some interesting part of firefox like status bar, menus or toolbar) add previous/next at the end of each chapter questions: opensource appendix.
...an alternative idea: writing a "next step" guide for interested people such as adding statusbar buttons, sidebar panels, and so on.
XUL user interfaces - Archive of obsolete content
= d.split("/") var thedate = new date(a[2], a[0] - 1, a[1]) showstatus(thedate) } catch (ex) {} } setday(thedate) } // internal function setday(adate) { if (currentday) currentday.setattribute("disabled", "true") if (adate == null) currentday = null else { var d = adate.getday() currentday = daybox.firstchild while (d-- > 0) currentday = currentday.nextsibling currentday.removeattribute("disabled") } datebox.focus(); } function showstatus(adate) { if (adate == null) { status.removeattribute("warning") status.setattribute("label", "") } else if (adate === false || isnan(adate.gettime())) { status.setattribute("warning", "true") status.setattribute("label", "date is not valid") } else { status.removea...
... what next?
...the next page demonstrates this: svg and css.
Localizing an extension - Archive of obsolete content
« previousnext » this article expands upon the previous samples on extension writing by adding localization support to our stock watcher extension.
...create the string bundle the next step is to modify the stockwatcher2.xul file to reference this property file.
... « previousnext » see also how to localize html pages, xul files, and js/jsm files from bootstrapped add-ons: bootstrapped extensions :: localization (l10n) xul school localization tutorial: dtd/entities method and properties method ...
Getting Started - Archive of obsolete content
the next directory is the \communicator directory.
...for this next part, let's modify the standard button.
...then scroll down to the next section.
Drag and Drop Example - Archive of obsolete content
next, a palette will be added to the right side of the window.
...next, we'll define the two listener objects.
...next, appendchild is called to add the new element to the stack, which is the target of the event.
Drag and Drop JavaScript Wrapper - Archive of obsolete content
« previousnext » gecko 1.9.1 (firefox 3.5) and later supports a newer and simpler api.
...next, the ondrop function should be created.
... « previousnext » original document information author(s): neil deakin original document: http://xulplanet.com/tutorials/mozsdk/dragwrap.php copyright information: copyright (c) neil deakin ...
Creating a Help Content Pack - Archive of obsolete content
next, you'll need to insert a rdf:description element into the file, inside the rdf:rdf element just created: <rdf:description rdf:about="urn:root" nc:title="" nc:defaulttopic="" nc:base=""> </rdf:description> fill in the attributes as follows: rdf:about must be urn:root or your pack won't work.
... next, we need to describe where to find the glossary, index, and table of contents.
... <rdf:li><rdf:description rdf:id="foo" nc:link="foo.html" nc:title="foo"/></rdf:li> next, add the following to your file just after the existing rdf:description element: <rdf:description rdf:about="#foo"> <nc:subheadings> <rdf:seq> <rdf:li><rdf:description rdf:id="bar" nc:link="bar.html" nc:title="bar"/></rdf:li> </rdf:seq> </nc:subheadings> </rdf:description> except for the different value for rdf:about, this looks exactly like a top-level entry de...
JavaScript crypto - Archive of obsolete content
the next private operation on any token will require the user password again.
... this means the master password will be requested the next time a saved password will be accessed after this function is called.
... this also means the ssl client authentication state will be erased for ssl sites with client authentication, and a client certificate prompt will appear again the next time the user connects to the site.
Migrate apps from Internet Explorer to Mozilla - Archive of obsolete content
nextsibling returns the node immediately following the current one.
...i'll discuss more about doctypes in the next section.
...instead of forming one image to the user, each small image ends up with a gap next to it.
Anonymous Content - Archive of obsolete content
the anonymous content is not accessible via the childnodes list for the bound element, nor is it accessible using firstchild/nextsibling to iterate over the children of the bound element.
... inherited insertion points are used to place the anonymous content generated by the next binding in the chain that contributes anonymous content.
...either the event is retargeted so that the bound element becomes the target, or the event is stopped and flow proceeds to the next phase.
Working With Directories - Archive of obsolete content
function getlatestfile() { var lastmod = 0; var homedir = io.getfile("home", ""); var items = homedir.directoryentries; while (items.hasmoreelements()) { var item = items.getnext().queryinterface(components.interfaces.nsifile); if (item.isfile() && item.lastmodifiedtime > lastmod.lastmodifiedtime) lastmod = item; } return lastmod; } this example iterates through the files in the home directory and looks for the file with the latest modification time (the last file in that directory that was written to).
... as the directoryentries (nsifile.attributes) property is an enumeration, you can iterate over the items by using nsisimpleenumerator.hasmoreelements() and nsisimpleenumerator.getnext().
...the following example returns an array of all of a directory's subdirectories: function getsubdirs() { var arr = []; var items = io.getfile("home", "").directoryentries; while (items.hasmoreelements()) { var item = items.getnext(); if (item.isdirectory()) arr.push(item); } return arr; } ...
MenuItems - Archive of obsolete content
in reality, the keyboard shortcut is handled by the key element, however, the menu item will display the shortcut next to its label.
...the result is that the items will display the shortcut key next to their labels.
...to indicate the current state of the toolbar, a checkbox would be displayed next to the menu item label.
Actions - Archive of obsolete content
« previousnext » the content to generate in a template is specified using the <xul:action> element which should either be the next sibling of the <xul:query> element (if no rules need be specified) or be a direct child of a <xul:rule> element.
...processing is now complete for the first result, so the builder moves on to the next result.
...here is an image of [this example] (note: see the next section for an explanation of why there are extra buttons here.) « previousnext » ...
Attribute Substitution - Archive of obsolete content
« previousnext » so far, attribute replacement in an action body has been used to replace an entire attribute with the value of a variable.
...this can be done simply by putting two variables next to each other in an attribute value separated by a caret (^).
... « previousnext » ...
Containment Properties - Archive of obsolete content
« previousnext » so far, we've seen how the simple query syntax can generate results from the children of an rdf container.
...this next example demonstrates this.
... « previousnext » ...
Multiple Rule Example - Archive of obsolete content
« previousnext » the most common use of multiple rules is to apply different action bodies to different results.
...the next example shows how we can do this.
... « previousnext » ...
RDF Query Syntax - Archive of obsolete content
« previousnext » let's look at a simple query with two statements.
...the content tag doesn't do anything else at this point, meaning it doesn't add anything else to the network of potential results, so processing continues on to the next statement, the triple, which looks like this: <triple subject="?start" predicate="http://www.xulplanet.com/rdf/relateditem" object="?relateditem"/> the triple statement is used to follow arcs or arrows in the rdf graph.
... « previousnext » ...
Textbox (XPFE autocomplete) - Archive of obsolete content
if false, the default, the tab key moves the focus to the next element.as of gecko 1.9.1, this attribute is now always specified in lower case.
...if false, the default, the tab key moves the focus to the next element.
...in addition, arrow buttons appear next to the textbox to let the user step through values.
SeaMonkey - making custom toolbar (SM ver. 1.x) - Archive of obsolete content
delete these two files: chrome.rdf overlays.rdf explanation: seamonkey automatically rebuilds these files the next time it starts.
... the next section in this tutorial contains examples of code that you can use to make your button do something useful.
...after changing contents.rdf, delete the files chrome.rdf and overlays.rdf so that seamonkey registers the change the next time it starts.
Adding Buttons - Archive of obsolete content
« previousnext » in this section, we will look at how to add some simple buttons to a window.
... in the next section, we will find out how to add labels and images to a xul window.
... see also more button features « previousnext » ...
Adding Event Handlers to XBL-defined Elements - Archive of obsolete content
« previousnext » next, we'll find out how to add event handlers to xbl-defined elements.
...in the next section, we'll see how to extend existing xbl definitions.
... « previousnext » ...
Adding HTML Elements - Archive of obsolete content
« previousnext » now that we've added some buttons, let's add some other elements.
... next, we will learn how to adding spacing between elements.
... « previousnext » ...
Adding Labels and Images - Archive of obsolete content
« previousnext » this section describes a way to add labels and images to a window.
...in the next section, we will learn how to add some input controls to a window.
... « previousnext » ...
Adding more elements - Archive of obsolete content
« previousnext » we will conclude the discussion of boxes by adding some boxes to the find files dialog.
...find files example so far source view next, we will look at how to create stacks.
... « previousnext » ...
Adding Properties to XBL-defined Elements - Archive of obsolete content
« previousnext » next, we'll find out how to add custom properties to xbl-defined elements.
... the next section shows how to add methods to xbl-defined elements.
... « previousnext » ...
Adding Style Sheets - Archive of obsolete content
« previousnext » we have hardly modified the look of the elements we have created so far.
... find files example so far : source view in the next section, we will look at how to apply styles to trees.
... « previousnext » ...
Creating Dialogs - Archive of obsolete content
« previousnext » a xul application will often require dialogs to be displayed.
... next, we'll see how to open file dialogs.
... « previousnext » ...
Input Controls - Archive of obsolete content
« previousnext » xul has elements that are similar to the html form controls.
...seamonkey or waterfox and remote-xul-manager from https://github.com/jvillalobos/remote-xul-manager find files example so far : source view in the next section, we will look at some elements for entering and selecting numbers.
... « previousnext » looking for a guide to using input controls and forms on the web?
Localization - Archive of obsolete content
next, the dtd file - findfile.dtd: <!entity findwindow.title "find files"> <!entity filemenu.label "file"> <!entity editmenu.label "edit"> <!entity filemenu.accesskey "f"> <!entity editmenu.accesskey "e"> <!entity opencmd.label "open search..."> <!entity savecmd.label "save search..."> <!entity closecmd.label "close"> <!entity opencmd.accesskey "o"> <!entity savecmd.accesskey "s"> <!entity closecmd.a...
... find files example so far: source next, we'll look at property files.
... « previousnext » see also how to localize html pages, xul files, and js/jsm files from bootstrapped add-ons: bootstrapped extensions :: localization (l10n) ...
Modifying the Default Skin - Archive of obsolete content
« previousnext » as of firefox 69, you must set the toolkit.legacyuserprofilecustomizations.stylesheets preference to true in about:config in order to load userchrome.css or usercontent.css files.
... see also : creating a skin for firefox and css getting started in the next section, we will look at creating a new skin.
... « previousnext » ...
More Button Features - Archive of obsolete content
« previousnext » in this section, we will look at some additional features of buttons.
...next, we will learn more details about how xul elements are positioned in a window.
... « previousnext » ...
Open and Save Dialogs - Archive of obsolete content
« previousnext » a common type of dialog is one where the user can select a file to open or save.
... var res = fp.show(); if (res != nsifilepicker.returncancel){ var thefile = fp.file; // --- do something with the file here --- } next, we'll see how to create a wizard.
... « previousnext » ...
Persistent Data - Archive of obsolete content
« previousnext » this section describes how to save the state of a xul window.
... find files example so far : source view next, we'll look at using style sheets with xul files.
... « previousnext » ...
Progress Meters - Archive of obsolete content
« previousnext » in this section, we'll look at creating progress meters.
...source view in the next section, we will learn how to add additional elements to the window using html.
... « previousnext » ...
RDF Datasources - Archive of obsolete content
« previousnext » here, we'll look at additional datasources and how to use your own rdf files as datasources.
...next, we'll look at the full rule syntax.
... « previousnext » ...
Scroll Bars - Archive of obsolete content
« previousnext » now, let's find out to add scroll bars to a window.
...next, we'll find out how to create toolbars.
... « previousnext » ...
Scrolling Menus - Archive of obsolete content
« previousnext » this section will describe scrolling menus and how to use the mechanism with other elements.
...next, we'll see how to add some event handlers to xul elements.
... « previousnext » ...
Styling a Tree - Archive of obsolete content
« previousnext » the following describes how to style a tree.
... next, we'll look at how to modify the default skin.
... « previousnext » ...
Templates - Archive of obsolete content
« previousnext » in this section, we'll find out how to populate elements with data.
... next, we'll look at using templates with trees.
... « previousnext » ...
The Box Model - Archive of obsolete content
« previousnext » in this section, we'll look at how xul handles layout.
... example so far: source view in the next section, we will look at specifying the sizes of individual elements and how to constrain their sizes.
... « previousnext » ...
The Chrome URL - Archive of obsolete content
« previousnext » the following section will describe how to refer to xul documents and other chrome files.
...in the next section, we will look at how to create .manifest files and packages.
... « previousnext » ...
Tree Box Objects - Archive of obsolete content
« previousnext » this section will describe the tree box object used to handle how a tree is displayed.
... next, we'll look at rdf which can be used to automatically populate trees and other elements.
... « previousnext » ...
Trees and Templates - Archive of obsolete content
« previousnext » the following describes how to use a template with a tree.
...next, we'll look at some of the datasources provided by mozilla.
... « previousnext » ...
Updating Commands - Archive of obsolete content
« previousnext » in this section, we will look at how to update commands.
... events="select" oncommandupdate="goupdateselecteditmenuitems()"/> <commandset id="undoeditmenuitems" commandupdater="true" events="undo" oncommandupdate="goupdateundoeditmenuitems()"/> <commandset id="clipboardeditmenuitems" commandupdater="true" events="clipboard" oncommandupdate="goupdatepastemenuitems()"/> next, we'll find out how to use observers.
... « previousnext » ...
XBL Inheritance - Archive of obsolete content
« previousnext » in this section, we'll look at how to extend existing xbl definitions.
...(you can also use the value addrbook to look up addresses in the address book.) firefox uses a different autocomplete mechanism than the mozilla suite, see xul:textbox (firefox autocomplete) in the next section, we'll see an example xbl-defined widget.
... « previousnext » ...
XUL Accesskey FAQ and Policies - Archive of obsolete content
if methods like confirm(), confirmex() or prompt() are being used to create a dialog, use an & before the button or checkbox text to make the next character an accesskey.
... letters next to a letter with a descender.
... next, try the first letter of another word in the prompt.
XUL accessibility guidelines - Archive of obsolete content
to prevent this, move the focus to the next element before disabling, hiding, or destroying the focus element.
...this behavior is then repeated for the next form field.
...if the user were to tab to the "exceptions..." button they would hear "cookies {pause} exceptions {pause} button." the next tab would read "cookies {pause} keep until {pause} they expire {pause} one of three {pause} combobox." if the screen reader only read the label, then the user would have to guess what the "exceptions" button or the "keep until" combobox was referring to.
Getting started with XULRunner - Archive of obsolete content
next » this article explores the mozilla platform by building a basic desktop application using xulrunner.
... for now, click the "next" link to learn about windows and menus in xulrunner!
... next » original document information author: mark finkle, october 2, 2006 ...
Windows and menus in XULRunner - Archive of obsolete content
« previousnext » our quest to build a basic desktop application using xulrunner continues.
...more than i can fit into a single article, so we will continue looking at building ui in xulrunner in the next article.
... see also xul:windows xul tutorial:creating a window commandset command xul tutorial:commands xul tutorial:simple menu bars xul tutorial:toolbars « previousnext » original document information author: mark finkle last updated date: october 2, 2006 ...
Table Reflow Internals - Archive of obsolete content
nd sets a bit in the reflow state gives its block a computed height during 3rd pass could also be inside a cell which is an observer special height reflow optimizations only frames needing 3rd pass actually get it frames gettting a 3rd pass only get it once intro to paginated reflow when a reflowee's available height is constrained, it may not fit and need to either split/continue on the next page, or start on the next page.
... a continuation may also need to be continued continuations are linked together by previnflow and nextinflow pointers pagination illustration nssimplepagesequence nspageframe nspagecontentframe areaframe (html) blockframe (body) nstableouterframe nstableouterframe blockframe (body) areaframe (html) nspagecontentframe continued nspageframe continued intro to paginated reflow the page sequence starts with one page and reflows it.
... if the page is incomplete then the page sequence creates a continuation for the page and sets it as the page's next sibling (it is also the page's nextinflow).
Using the W3C DOM - Archive of obsolete content
« previousnext » the document object has properties for accessing collections of elements, such as document.images and document.forms.
...instead, use the w3c dom properties and methods (examples in the next section).
...ron element.innerhtml speed and performance comparison between innerhtml attribute and dom's nodevalue when modifying the text data of a text node by gérard talbot interactive dom level 2 characterdata interface attributes and methods tests: other ways to modify (replace, delete, manipulate) efficiently text nodes in the dom by gérard talbot <- previous section: using web standards: how next section: developing cross-browser pages -> ...
Namespaces - Archive of obsolete content
« previousnext » e4x and namespaces oftentimes, xml documents will contain elements from a variety of namespaces.
...next is the global xml object.
... « previousnext » ...
Iterator - Archive of obsolete content
keyonly if keyonly is truthy value, iterator.prototype.next returns property_name only.
... methods iterator.prototype.next returns next item in the [property_name, property_value] format or property_name only.
... examples iterating over properties of an object var a = { x: 10, y: 20, }; var iter = iterator(a); console.log(iter.next()); // ["x", 10] console.log(iter.next()); // ["y", 20] console.log(iter.next()); // throws stopiteration iterating over properties of an object with legacy destructuring for-in statement var a = { x: 10, y: 20, }; for (var [name, value] in iterator(a)) { console.log(name, value); // x 10 // y 20 } iterating with for-of var a = { x: 10, y: 20, }; for (var [name, value] of iterator(a)) { // @@iterator is used console.log(name, value); // x 10 // y 20 } iterates over property name var a = { x: 10, y: 20, }; for (var name in i...
Enumerator - Archive of obsolete content
instead of using indexes, as you would with arrays, you can move the current item pointer only to the first or next element of a collection.
...e) { var drv = e.item(); drivestring += drv.path + " - "; if (drv.isready){ var freegb = drv.freespace / bytespergb; var totalgb = drv.totalsize / bytespergb; drivestring += freegb.tofixed(3) + " gb free of "; drivestring += totalgb.tofixed(3) + " gb"; } else{ drivestring += "not ready"; } drivestring += "<br />";; e.movenext(); } document.write(drivestring); // output: <drive information properties the enumerator object has no properties.
... enumerator.movenext moves the current item to the next item in the collection.
Choosing Standards Compliance Over Proprietary Practices - Archive of obsolete content
consistent standards significantly reduce development re-work, and ensure consistent and predictable behavior from one application to the next.
...users could quickly and easily shift from one version to the next.
...by instilling a set of global goals and standards into an organizational infrastructure, an organization is ensuring its end users the ability to interact, function, view, and process information consistently as they transition from one device to the next.
Desktop mouse and keyboard controls - Game development
previous overview: control mechanisms next now when we have our mobile controls in place and the game is playable on touch-enabled devices, it would be good to add mouse and keyboard support, so the game can be playable also on desktop.
...then the player's ship is drawn on the screen and the next draw is called from within the requestanimationframe.
... previous overview: control mechanisms next ...
Mobile touch controls - Game development
overview: control mechanisms next the future of mobile gaming is definitely web, and many developers choose the mobile first approach in their game development process — in the modern world, this generally also involves implementing touch controls.
... summary that covers adding touch controls for mobile; in the next article we'll see how to add keyboard and mouse support.
... overview: control mechanisms next ...
Bounce off the walls - Game development
« previousnext » this is the 3rd step out of 10 of the gamedev canvas tutorial.
... next steps we've now got to the stage where our ball is both moving and staying on the game board.
... « previousnext » ...
Build the brick field - Game development
« previousnext » this is the 6th step out of 10 of the gamedev canvas tutorial.
... next steps so now we have bricks!
... « previousnext » ...
Create the Canvas and draw on it - Game development
« previousnext » this is the 1st step out of 10 of the gamedev canvas tutorial.
... next steps now we've set up the basic html and learned a bit about canvas, lets continue to the second chapter and work out how to move the ball in our game.
... « previousnext » ...
Game over - Game development
« previousnext » this is the 5th step out of 10 of the gamedev canvas tutorial.
... next steps we're doing quite well so far and our game is starting to feel a lot more worth playing now you can lose!
... « previousnext » ...
Mouse controls - Game development
« previousnext » this is the 9th step out of 10 of the gamedev canvas tutorial.
... next steps now we've got a complete game we'll finish our series of lessons with some more small tweaks — finishing up.
... « previousnext » ...
2D breakout game using pure JavaScript - Game development
next » in this step-by-step tutorial we create a simple mdn breakout game written entirely in pure javascript and rendered on html5 <canvas>.
... next steps ok, let's get started!
... next » ...
Bounce off the walls - Game development
« previousnext » this is the 6th step out of 16 of the gamedev phaser tutorial.
... compare your code you can check the finished code for this lesson in the live demo below, and play with it to understand better how it works: next steps this is starting to look more like a game now, but we can't control it in any way — it's high time we introduced the player paddle and controls.
... « previousnext » ...
Buttons - Game development
« previousnext » this is the 15th step out of 16 of the gamedev phaser tutorial.
... compare your code you can check the finished code for this lesson in the live demo below, and play with it to understand better how it works: next steps the last thing we will do in this article series is make the gameplay even more interesting by adding some randomization to the way the ball bounces off the paddle.
... « previousnext » ...
Game over - Game development
« previousnext » this is the 8th step out of 16 of the gamedev phaser tutorial.
... compare your code you can check the finished code for this lesson in the live demo below, and play with it to understand better how it works: next steps now the basic gameplay is in place let's make it more interesting by introducing bricks to smash — it's time to build the brick field.
... « previousnext » ...
Load the assets and print them on screen - Game development
« previousnext » this is the 3rd step out of 16 in the gamedev phaser tutorial.
... compare your code you can check the finished code for this lesson for yourself in the live demo below, and play with it to better understand how it works: next steps printing out the ball was easy; next, we'll try moving the ball on screen.
... « previousnext » ...
Move the ball - Game development
« previousnext » this is the 4th step out of 16 of the gamedev phaser tutorial.
... compare your code you can check the finished code for this lesson in the live demo below, and play with it to understand better how it works: next steps the next step is to add some basic collision detection, so our ball can bounce off the walls.
... « previousnext » ...
Scaling - Game development
« previousnext » this is the 2nd step out of 16 of the gamedev phaser tutorial.
...add the following line below the other three you added earlier: game.stage.backgroundcolor = '#eee'; compare your code you can check the finished code for this lesson in the live demo below, and play with it to understand better how it works: next steps now we've set up the scaling for our game, let's continue to the third lesson and work out how to load the assets and print them on screen.
... « previousnext » ...
The score - Game development
« previousnext » this is the 11th step out of 16 of the gamedev phaser tutorial.
... compare your code you can check the finished code for this lesson in the live demo below, and play with it to understand better how it works: next steps we now have a scoring system, but what's the point of playing and keeping score if you can't win?
... « previousnext » ...
Win the game - Game development
« previousnext » this is the 12th step out of 16 of the gamedev phaser tutorial.
... compare your code you can check the finished code for this lesson in the live demo below, and play with it to understand better how it works: next steps both losing and winning are implemented, so the core gameplay of our game is finished.
... « previousnext » ...
2D breakout game using Phaser - Game development
next » in this step-by-step tutorial, we create a simple mobile mdn breakout game written in javascript, using the phaser framework.
... next steps ok, let us get started!
... next » ...
CRLF - MDN Web Docs Glossary: Definitions of Web-related terms
cr = carriage return (\r, 0x0d in hexadecimal, 13 in decimal) — moves the cursor to the beginning of the line without advancing to the next line.
... lf = line feed (\n, 0x0a in hexadecimal, 10 in decimal) — moves the cursor down to the next line without returning to the beginning of the line.
... a cr immediately followed by a lf (crlf, \r\n, or 0x0d0a) moves the cursor down to the next line and then to the beginning of the line.
WAI-ARIA basics - Learn web development
previous overview: accessibility next following on from the previous article, sometimes making complex ui controls that involve unsemantic html and dynamic javascript-updated content can be difficult.
... next, you need to worry about whether the browsers in question support aria features and expose them via their apis, but also whether screenreaders recognise that information and present it to their users in a useful way.
... practical wai-aria implementations in the next section we'll look at the four areas in more detail, along with practical examples.
Images, media, and form elements - Learn web development
previous overview: building blocks next in this lesson we will take a look at how certain special elements are treated in css.
...in the next article we'll look over a few tips you'll find useful when you have to style html tables.
... previous overview: building blocks next in this module cascade and inheritance css selectors type, class, and id selectors attribute selectors pseudo-classes and pseudo-elements combinators the box model backgrounds and borders handling different text directions overflowing content values and units sizing items in css images, media, and form elements styling tables debugging css organizing your css ...
Overflowing content - Learn web development
previous overview: building blocks next overflow is what happens when there is too much content to fit in a container.
...(for example, if the user has increased their font size) the next two lessons explain different approaches to control sizing in ways that are less prone to overflow.
... previous overview: building blocks next in this module cascade and inheritance css selectors type, class, and id selectors attribute selectors pseudo-classes and pseudo-elements combinators the box model backgrounds and borders handling different text directions overflowing content values and units sizing items in css images, media, and form elements styling tables debugging css organizing your css...
Pseudo-classes and pseudo-elements - Learn web development
previous overview: building blocks next the next set of selectors we will look at are referred to as pseudo-classes and pseudo-elements.
... in this next example, we have added an empty string using the ::before pseudo-element.
... previous overview: building blocks next in this module cascade and inheritance css selectors type, class, and id selectors attribute selectors pseudo-classes and pseudo-elements combinators the box model backgrounds and borders handling different text directions overflowing content values and units sizing items in css images, media, and form elements styling tables debugging css organizing your css...
CSS selectors - Learn web development
previous overview: building blocks next in css, selectors are used to target the html elements on our web pages that we want to style.
...the following for example selects paragraphs that are direct children of <article> elements using the child combinator (>): article > p { } next steps you can take a look at the reference table of selectors below for direct links to the various types of selectors in this learn section or on mdn in general, or continue on to start your journey by finding out about type, class, and id selectors.
... previous overview: building blocks next reference table of selectors the below table gives you an overview of the selectors you have available to use, along with links to the pages in this guide which will show you how to use each type of selector.
Introduction to CSS layout - Learn web development
overview: css layout next this article will recap some of the css layout features we've already touched upon in previous modules — such as different display values — and introduce some of the concepts we'll be covering throughout this module.
...if we change the display value to inline they now display next to each other, as words would do in a sentence.
... overview: css layout next in this module introduction to css layout normal flow flexbox grid floats positioning multiple-column layout responsive design beginner's guide to media queries legacy layout methods supporting older browsers fundamental layout comprehension assessment ...
Beginner's guide to media queries - Learn web development
previous overview: css layout next the css media query gives you a way to apply css only when the browser and device environment matches a rule that you specify, for example "viewport is wider than 480 pixels".
...therefore in this next example the text will only be blue if the orientation is portrait.
... previous overview: css layout next in this module introduction to css layout normal flow flexbox grid floats positioning multiple-column layout responsive design beginner's guide to media queries legacy layout methods supporting older browsers fundamental layout comprehension assessment ...
Positioning - Learn web development
previous overview: css layout next positioning allows you to take elements out of the normal document layout flow, and make them behave differently; for example sitting on top of one another, or always remaining in the same place inside the browser viewport.
...you need to use the top, bottom, left, and right properties, which we'll explain in the next section.
... previous overview: css layout next ...
Responsive design - Learn web development
previous overview: css layout next in the early days of web design, pages were built to target a particular screen size.
...the next example creates a grid container with three tracks sized at 1fr.
... previous overview: css layout next in this module introduction to css layout normal flow flexbox grid floats positioning multiple-column layout responsive design beginner's guide to media queries legacy layout methods supporting older browsers fundamental layout comprehension assessment ...
What is CSS? - Learn web development
overview: first steps next css (cascading style sheets) allows you to create great-looking web pages, but how does it work under the hood?
... what's next now that you have some understanding of what css is, let's move on to getting started with css, where you can start to write some css yourself.
... overview: first steps next in this module what is css?
How do I use GitHub Pages? - Learn web development
next, sign up for a github account.
... creating a repo for your code next, you need to create a new repo for your files to go in.
...the command should look something like this: git remote add origin https://github.com/chrisdavidmills/my-repository.git next, type the following two commands, pressing enter after each one.
Dealing with files - Learn web development
previous overview: getting started with the web next a website consists of many files: text content, code, stylesheets, media content, and so on.
... next, let's look at what structure our test site should have.
...your folder structure should look something like this: previous overview: getting started with the web next in this module installing basic software what will your website look like?
Publishing your website - Learn web development
previous overview: getting started with the web next once you finish writing the code and organizing the files that make up your website, you need to put it all online so people can find it.
... next, you need to create a repository to store files.
... previous overview: getting started with the web next in this module installing basic software what will your website look like?
Creating hyperlinks - Learn web development
previous overview: introduction to html next hyperlinks are really important — they are what makes the web a web.
...next up for html, we'll return to text semantics and look at some more advanced/unusual features that you'll find useful — advanced text formatting is your next stop.
... previous overview: introduction to html next in this module getting started with html what’s in the head?
Debugging HTML - Learn web development
previous overview: introduction to html next writing html is fine, but what if something goes wrong, and you can't work out where the error in the code is?
... next, open it in a browser.
... previous overview: introduction to html next in this module getting started with html what’s in the head?
Getting started with HTML - Learn web development
overview: introduction to html next in this article we cover the absolute basics of html.
...next, let's examine how individual elements combine to form an entire html page: <!doctype html> <html> <head> <meta charset="utf-8"> <title>my test page</title> </head> <body> <p>this is my page</p> </body> </html> here we have: <!doctype html>: the doctype.
...you'll learn more about this in the next article of the series.
HTML table advanced features and accessibility - Learn web development
previous overview: tables next in the second article in this module, we look at some more advanced features of html tables — such as captions/summaries and grouping your rows into table head, body and footer sections — as well as looking at the accessibility of tables for visually impaired users.
... next, add a colspan attribute to make the "sum" cell span across the first four columns, so the actual number appears at the bottom of the "cost" column.
... previous overview: tables next in this module html table basics html table advanced features and accessibility structuring planet data ...
General asynchronous programming concepts - Learn web development
overview: asynchronous next in this article, we'll run through a number of important concepts relating to asynchronous programming, and how this looks in web browsers and javascript.
...each thread can only do a single task at once: task a --> task b --> task c each task will be run sequentially; a task has to complete before the next one can be started.
... we'll start to look at how we can write asynchronous code in the next article.
Introduction to events - Learn web development
previous overview: building blocks next events are actions or occurrences that happen in the system you are programming, which the system tells you about so you can respond to them in some way if desired.
... then it moves on to the next element inside <html> and does the same thing, then the next one, and so on until it reaches the element that was actually selected.
... then it moves on to the next immediate ancestor element and does the same thing, then the next one, and so on until it reaches the <html> element.
Arrays - Learn web development
previous overview: first steps next in the final article of this module, we'll look at arrays — a neat way of storing a list of data items under a single variable name.
... for (let i = 0; i < myhistory.length; i++) { itemtext = myhistory[i]; const listitem = document.createelement('li'); listitem.textcontent = itemtext; list.appendchild(listitem); } // if the array length is 5 or more, remove the oldest search term if (myhistory.length >= 5) { // number 2 } // empty the search input and focus it, ready for the next term to be entered searchinput.value = ''; searchinput.focus(); } } </textarea> <div class="playable-buttons"> <input id="reset" type="button" value="reset"> <input id="solution" type="button" value="show solution"> </div> html { font-family: sans-serif; } h2 { font-size: 16px; } .a11y-label { margin: 0; text-align: right; font-size: 0.7rem; width: 98%; } body { m...
...we'll be teaching you all the useful basics there are to know about loops in the next module, but for now you should give yourself a clap and take a well-deserved break; you've worked through all the articles in this module!
Useful string methods - Learn web development
previous overview: first steps next now that we've looked at the very basics of strings, let's move up a gear and start thinking about what useful operations we can do on strings with built-in methods, such as finding the length of a text string, joining and splitting strings, substituting one character in a string for another, and more.
...next, we're going to look at the last major type of data we need to focus on in the short term — arrays.
... previous overview: first steps next in this module what is javascript?
Storing the information you need — Variables - Learn web development
previous overview: first steps next after reading the last couple of articles you should now know what javascript is, what it can do for you, how you use it alongside other web technologies, and what its main features look like from a high level.
...in the next article, we'll focus on numbers in more detail, looking at how to do basic math in javascript.
... previous overview: first steps next in this module what is javascript?
Measuring performance - Learn web development
previous overview: performance next meauring performance provides an important metric to help you asses the success of your app, site, or web service.
...next up, you'll look at perceived performance and some techniques to make unavoidable performance hits appear less severe to the user, or disguise them completely.
... previous overview: performance next in this module the "why" of web performance what is web performance?
JavaScript performance - Learn web development
previous overview: performance next while images and video account for over 70% of the bytes downloaded for the average website, byte per byte, javascript has a greater negative impact on performance.
...in the next article we take a look at some html features that can impact performance, including some attributes specifically created to improve performance.
... previous overview: performance next in this module the "why" of web performance what is web performance?
Ember resources and troubleshooting - Learn web development
previous overview: client-side javascript frameworks next our final ember article provides you with a list of resources that you can use to go further in your learning, plus some useful troubleshooting and other information.
... previous overview: client-side javascript frameworks next in this module introduction to client-side frameworks framework main features react getting started with react beginning our react todo list componentizing our react app react interactivity: events and state react interactivity: editing, filtering, conditional rendering accessibility in react react resources ember getting started with ember ember ap...
...dering: editing existing todos focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
React resources - Learn web development
previous overview: client-side javascript frameworks next our final article provides you with a list of react resources that you can use to go further in your learning.
... previous overview: client-side javascript frameworks next in this module introduction to client-side frameworks framework main features react getting started with react beginning our react todo list componentizing our react app react interactivity: events and state react interactivity: editing, filtering, conditional rendering accessibility in react react resources ember getting started with ember ember ap...
...dering: editing existing todos focus management with vue refs vue resources svelte getting started with svelte starting our svelte todo list app dynamic behavior in svelte: working with variables and props componentizing our svelte app advanced svelte: reactivity, lifecycle, accessibility working with svelte stores typescript support in svelte deployment and next steps ...
Understanding client-side JavaScript frameworks - Learn web development
what we really need next is the ability to allow our users to enter their own todo items into the app, and for that, we'll need a text <input>, an event to fire when the data is submitted, a method to fire upon submission to add the data and rerender the list, and a model to control the data.
...deployment and next steps in this final article we will look at how to deploy your application and get it online, and also share some of the resources that you should go on to, to continue your svelte learning journey.
... there is a variety of reasons for this: they are popular choices that will be around for a while — like with any software tool, it is good to stick with actively-developed choices that are likely to not be discontinued next week, and which will be desirable additions to your skill set when looking for a job.
Handling common HTML and CSS problems - Learn web development
previous overview: cross browser testing next with the scene set, we'll now look specifically at the common cross-browser problems you will come across in html and css code, and what tools can be used to prevent problems from happening, or fix problems that occur.
... after the packages have finished installing, try loading up an html file and a css file: you'll see any issues highlighted with green (for warnings) and red (for errors) circles next to the line numbers, and a separate panel at the bottom provides line numbers, error messages, and sometimes suggested values or other fixes.
... previous overview: cross browser testing next in this module introduction to cross browser testing strategies for carrying out testing handling common html and css problems handling common javascript problems handling common accessibility problems implementing feature detection introduction to automated testing setting up your own test automation environment ...
Introduction to cross browser testing - Learn web development
overview: cross browser testing next this article starts the module off by providing an overview of the topic of (cross) browser testing, answering questions such as "what is cross browser testing?", "what are the most common types of problems you'll encounter?", and "what are the main approaches for testing, identifying, and fixing problems?" prerequisites: familiarity with the core html, css, and javascript languages.
... next, you should try expanding your list of test browsers to a full list of target audience browsers and start concentrating on weeding out cross browser issues (see the next article for more information on determining your target browsers).
... overview: cross browser testing next in this module introduction to cross browser testing strategies for carrying out testing handling common html and css problems handling common javascript problems handling common accessibility problems implementing feature detection introduction to automated testing setting up your own test automation environment ...
Deploying our app - Learn web development
our next step is to push the project to github.
... so with our project committed in git and pushed to our github repository, the next step in the toolchain is to connect github to netlify so our project can be deployed live on the web!
...select your project repository and proceed to the next step.
Client-side tooling overview - Learn web development
overview: understanding client-side tools next in this article we provide an overview of modern web tooling, what kinds of tools are available and where you’ll meet them in the lifecycle of web app development, and how to find help with individual tools.
...next up we provide you with a crash course on the command line, which is where a lot of tooling is invoked from.
... overview: understanding client-side tools next in this module client-side tooling overview command line crash course package management basics introducing a complete toolchain deploying our app ...
Creating reftest-based unit tests
another part is testing invalidation - testing that when a document is changed after it has finished loading and displaying, that the browser correctly "invalidates" the parts of the screen that should change so that the screen displays the correct output the next time it is repainted.
...first you need to add class="reftest-wait" to the root element in the test to tell the reftest framework not to check the rendering as soon as the test finishes loading and moving on to the next test.
... next you need to add a listener for the 'mozreftestinvalidate' event, and only make the changes you want to test invalidation for after that event has fired.
Creating Sandboxed HTTP Connections
since nsistreamlistener does not cover cookies, the current channel being used will need to be stored as a global, since another listener will be used for cookie notifications (covered in the next section).
...like before, the nsiioservice is used: var referreruri = ioservice.newuri(referrerurl, null, null); next, the nsichannel is qied to nsihttpchannel and the referrer property is set to the generated nsiuri: var httpchannel = channel.queryinterface(components.interfaces.nsihttpchannel); httpchannel.referrer = referreruri; creating http posts to create an http post, a few additional steps are required after the nsichannel is created.
... var inputstream = components.classes["@mozilla.org/io/string-input-stream;1"] .createinstance(components.interfaces.nsistringinputstream); inputstream.setdata(postdata, postdata.length); next, the nsichannel is qied to an nsiuploadchannel.
Eclipse CDT
for example, changing the find next command to cmd-g/ctrl-g is not sufficient.
...if you want to change this awkward key binding, the command you need to rebind is "next editor".
...tick this (all of its sub-options should then be ticked), click "next" twice, accept the license agreement, and then click "finish".
Performance best practices for Firefox front-end engineers
if that happens, some of them will be postponed until the next frame (or possibly multiple frames, if necessary), this skipping of frames is called jank.
... if you want to queue up some javascript to run after the next "natural" style and layout flush, try: // suppose we want to get the computed "display" style of some node without // causing a style flush.
...despite not actually being interuptible when laying out chrome ui, striving for interruptible layout is always good practice because uninterruptible layout has the potential to be much worse (see next section).
InstallListener
ended(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.
... void oninstallfailed( in addoninstall install ) parameters install the addoninstall representing the install onexternalinstall() called when an add-on is installed through some system other than an addoninstall.
... void onexternalinstall( in addon addon, in addon existingaddon, in boolean needsrestart ) parameters addon the newly installed addon existingaddon an addon that will be replaced by this install or null if no add-on is being replaced needsrestart true if the installation requires a restart ...
CustomizableUI.jsm
onwidgetbeforedomchange(anode, anextnode, acontainer, aisremoval) fired before a widget's dom node is acted upon by customizableui (to add, move or remove it).
... anode is the dom node changed, anextnode the dom node (if any) before which a widget will be inserted, acontainer the actual dom container (could be an overflow panel in case of an overflowable toolbar), and awasremoval is true iff the action about to happen is the removal of the dom node.
... onwidgetafterdomchange(anode, anextnode, acontainer, awasremoval) like onwidgetbeforedomchange, but fired after the change to the dom node of the widget.
Localizing with Koala
the search bar is next to the right of the location bar, and by default points to the google search.
...switch to "koala file view" in the sidebar (choose it from the list that appears when you click on the arrow pointing down situated next to the sidebar's [x] button).
...if you switch to the command line and issue "hg status" again, you should now see that the files are scheduled for addition on the next commit (which is indicated by the letter "a" standing in front of each new file): c:\mozilla\l10n\locale\x-testing\3.6> hg status a browser\chrome\browser\search.properties a browser\chrome\browser\searchbar.dtd you now have to commit the new files to the repository.
Localizing without a specialized tool
the search bar is next to the right of the location bar, and by default points to the google search.
...next, again in your working dir, create a directory that will serve as localization base: $ mkdir l10n-mozilla-1.9.2 $ cd l10n-mozilla-1.9.2 inside this directory you will put all the localization files in a folder named after your locale, e.g.
...untrusted connection in the example above), like so (example for polish): <!entity certerror.pagetitle "niezaufane połączenie"> once you have translated all the <!entity> strings in this file, you should save your work and open the next .dtd or .properties file.
QA phase
feel free to skip ahead to the next section by clicking on the next link at the bottom of the page.
...you can either: create a langpack, which is installed on top of your mozilla application, or repack the application's binary (aka, a l10n repack), which allows you to install next to your existing mozilla application installation and use separately.
... « previousnext » ...
Localization sign-off reviews
the merge date for migrating from one product release channel to the next is rapidly approaching.
... you need to make sure that your work can effectively be compiled into a build for the next release channel.
...from the dropdown menu next to the appropriate approval flags (see image).
What every Mozilla translator should know
some branch/release names identified: mozilla source + en-us localization files for [ab-cd] locale corresponding firefox version branches in hg mozilla-central l10n-central firefox.next (trunk) mozilla-1.9.2 l10n-mozilla-1.9.2 firefox 3.6 mozilla-1.9.1 l10n-mozilla-1.9.1 firefox 3.5 and, on the former revision control system, cvs: cvs trunk (the default branch) -> firefox/thunderbird 3.0.x branch mozilla_1_8_branch -> firefox/thunderbird 2.0 branch mozilla cross-reference mozilla cross-reference is a web site mirroring the content of t...
...for example: bug 12345, fix typos and resize prefwindow, a=l10n as soon as you have committed, put the bug in fixed state and write fixed1.8.xxx in the keyword field you have to verify in the next build that the changes have been successful.
...once you have made some changes in mercurial, as soon as the next build is done you can check the tinderbox and see if something was wrong.
Investigating leaks using DMD heap scan mode
generating logs the next step is to generate a number of log files.
... next, exit the browser.
... identifying the root in the cycle collector log the next step is to figure out why the cycle collector could not collect the window, using the find_roots.py script from the heapgraph repository.
Gecko Profiler FAQ
[ehsan] i don’t think this is very interesting in the general situation, since oses can basically decide to swap out part of your virtual address space and you’d page fault when you access that page next and there is very little that the program can do about that.
... sleep until the next sample is due.
... nothing stands out in the profile, how can i accurately find the next bottleneck?
PR_ReadDir
gets a pointer to the next entry in the directory.
... returns a pointer to the next entry in the directory.
...moreover, the prdirentry structure returned by each pr_readdir call is valid only until the next pr_readdir or pr_closedir call on the same prdir object.
Rhino Debugger
otherwise control will return to the debugger at the next line in the current function.
... step over to single step to the next line in the current function, you may do any of the following: select the debug->step over menu item on the menu bar press the step over button on the toolbar press the f7 key on the keyboard execution will resume but control will return to the debugger at the next line in the current function or top-level script.
... if the selected line contains executable code a red dot will appear next to the line number and a breakpoint will be set at that location.
Hacking Tips
therefore, the jit frames do not appear until you settle on the next breakpoint.
... step next a few times, so that the "code" variable gets generated print code->code_, which is the address of the code disassembly code read at this address (using x/ni address, where n is the number of instructions you would like to see) here is an example.
... do next in gdb until you reach the definition of the funcptr: // call the per-exported-function trampoline created by generateentry.
Garbage collection
the chunkinfo contains a list of unallocated arenas, starting at chunkinfo::freearenashead and linked through arenaheader::next.
...the last cell in each free span (except the last one) holds a freespan for the next free span.
...(this means if an object has all references to it dropped during this incremental gc, it will be collected on the next incremental gc.) this is called snapshot-at-the-beginning because it is conceptually equivalent to taking a snapshot of live objects at the beginning of the incremental gc and marking all those objects.
Shell global objects
returns the number of allocations before the next trigger.
... selectforgc(obj1, obj2, ...) schedule the given objects to be marked in the next gc slice.
... oomatallocation(count [,threadtype]) after count js_malloc memory allocations, fail the next allocation (return nullptr).
Web Replay
when a thread tries to acquire a lock, it first waits until it is next in line to do so.
... when the next snapshot is taken, only the dirty memory is examined for any changes vs.
... the replayresumebackward() and replayresumeforward() members may be called to resume execution, and the replaypause() member may be called to pause execution at the next opportunity.
Packaging WebLock
« previousnext » in this final part of the tutorial, we'll put all of the pieces of the web locking component - the library itself, the type library, the header file, and the user interface resources - into a package that can be installed on other systems.
... the next section shows how this process of downloading, copying and registering the necessary files from the xpi can be achieved with an xpinstall installation script.
... « previousnext » copyright (c) 2003 by doug turner and ian oeschger.
Creating XPCOM components
next » this guide is about gecko, and about creating xpcom components for gecko-based applications.
...acros representing return values in xpcom xpidl code generation getting the weblock service from a client implementing the iweblock interface the directory service modifying paths with nsifile manipulating files with nsifile using nsilocalfile for reading data processing the white list data iweblock method by method lock and unlock addsite removesite setsites getnext getsites hasmoreelements finishing the component using frozen interfaces copying interfaces into your build environment implementing the nsicontentpolicy interface receiving notifications implementing the nsicontentpolicy uniform resource locators checking the white list creating nsiuri objects building the weblock ui user interface package list client...
...er script distributing your component appendix a - setting up the gecko sdk downloading and setting the sdk building a microsoft visual cpp project creating a new project adding the gecko sdk to the project settings building a windows project a makefile for unix appendix b - resources weblock resources gecko resources xpcom resources general development resources next » copyright (c) 2003 by doug turner and ian oeschger.
mozIStorageResultSet
last changed in gecko 1.9.1 (firefox 3.5 / thunderbird 3.0 / seamonkey 2.0) inherits from: nsisupports method overview mozistoragerow getnextrow(); methods getnextrow() returns the next row from the result set.
... mozistoragerow getnextrow(); parameters none.
... return value a mozistoragerow object containing the next row from the result set, or null if there are no more results.
nsIAccessibleTable
changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) method overview nsiaccessible getcellat(in long rowindex, in long columnindex); note: renamed from cellrefat in gecko 1.9.2 long getcellindexat(in long rowindex, in long columnindex); note: renamed from getindexat in gecko 1.9.2 astring getcolumndescription(in long columnindex); long getcolumnextentat(in long row, in long column); long getcolumnindexat(in long cellindex); note: renamed from getcolumnatindex in gecko 1.9.2 void getrowandcolumnindicesat(in long cellindex, out long rowindex, out long columnindex); astring getrowdescription(in long rowindex); long getrowextentat(in long row, in long column); long getrowindexat(in long cellindex); ...
... getcolumnextentat() return the number of columns occupied by the accessible cell at the specified row and column in the table.
... long getcolumnextentat( in long row, in long column ); parameters row the row index of the cell.
nsICategoryManager
s_get_iid(nsicategorymanager), getter_addrefs(catmgr)); if (ns_failed(rv)) return rv; nscomptr<nsisimpleenumerator> cats; rv = catmgr->enumeratecategories(getter_addrefs(cats)); if (ns_failed(rv)) return rv; prbool hasmore; while (ns_succeeded(cats->hasmoreelements(&hasmore) && hasmore) { nscomptr<nsisupports> elem; cats->getnext(getter_addrefs(elem)); nscomptr<nsisupportscstring> category = do_queryinterface(elem, &rv); if (ns_failed(rv)) break; nsembedcstring categoryname; rv = category->getdata(categoryname); if (ns_failed(rv)) break; printf("%s\n", categoryname.get()); } return ns_ok; } this snippet shows how to print out a list of all categories in javascript.
... var categorymanager = components.classes["@mozilla.org/categorymanager;1"] .getservice(components.interfaces.nsicategorymanager); var enumerator = categorymanager.enumeratecategories(); var categories = []; while (enumerator.hasmoreelements()) { var item = enumerator.getnext(); var category = item.queryinterface(components.interfaces.nsisupportscstring) categories.push(category.tostring()); } categories.sort(); var categoriesstring = categories.join("\n"); dump(categoriesstring + "\n"); print out a list of app-startup entries this example prints out a list of entries of "app-startup" category.
... var categorymanager = components.classes["@mozilla.org/categorymanager;1"] .getservice(components.interfaces.nsicategorymanager); var enumerator = categorymanager.enumeratecategory("app-startup"); var entries = []; while (enumerator.hasmoreelements()) { var item = enumerator.getnext(); var entry = item.queryinterface(components.interfaces.nsisupportscstring) entries.push(entry.tostring()); } entries.sort(); var entriesstring = entries.join("\n"); dump(entriesstring + "\n"); disable currently loaded plugins by type this snippet here shows how to disable plugins that are currently loaded for the file type of pdf.
nsIDOMXPathResult
dom/interfaces/xpath/nsidomxpathresult.idlscriptable this interface describes an xpath result returned by nsidomxpathevaluator or document.evaluate inherits from: nsisupports last changed in gecko 1.7 method overview nsidomnode iteratenext(); nsidomnode snapshotitem(in unsigned long index); attributes attribute type description booleanvalue boolean if resulttype is boolean_type, the boolean value.
... methods iteratenext() iterates through the available nodes of an unordered_node_iterator_type or ordered_node_iterator_type result.
... nsidomnode iteratenext(); parameters none.
nsIDirectoryEnumerator
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 close(); attributes attribute type description nextfile nsifile the next file in the sequence.
... the nextfile attribute is the first element upon the first call.
... this attribute is null if there is no next element.
nsIINIParser
ini sections are * defined by square brakets and look like this: [settings] * all entries below such a section definition belong to that * section (until the next section).
...// get all sections in the ini file var sectenum = iniparser.getsections(); // save the sections in an array var sections = []; while (sectenum && sectenum.hasmore()) { var section = sectenum.getnext(); // add an array entry for each section sections.push(section); } enumerating keys this example shows how to fetch the values for all the keys in the section named "setting".
... // get all keys for the "setting" section var keysenum = iniparser.getkeys("setting"); // save the keys and values in an object var keys = {}; while (keysenum && keysenum.hasmore()) { var key = keysenum.getnext(); // create a property for each key and assing the ini value.
nsISmsDatabaseService
omstring abody, in unsigned long long adate); void getmessage(in long messageid, in long requestid, [optional] in unsigned long long processid); void deletemessage(in long messageid, in long requestid, [optional] in unsigned long long processid); void createmessagelist(in nsidommozsmsfilter filter, in boolean reverse, in long requestid, [optional] in unsigned long long processid); void getnextmessageinlist(in long listid, in long requestid, [optional] in unsigned long long processid); void clearmessagelist(in long listid); void markmessageread(in long messageid, in boolean value, in long requestid, [optional] in unsigned long long processid) methods savereceivedmessage() void savereceivedmessage( in domstring asender, in domstring abody, in unsigned long long adate ); pa...
... getnextmessageinlist() void getnextmessageinlist( in long listid, in long requestid, [optional] in unsigned long long processid ); parameters listid a number representing the id of the message list.
... clearmessagelist() void getnextmessageinlist( in long listid, ); parameters listid a number representing the id of the message list.
nsIWebBrowserFind
method overview boolean findnext(); attributes attribute type description entireword boolean whether to match entire words only.
... methods findnext() finds, highlights, and scrolls into view the next occurrence of the search string, using the current search settings.
...boolean findnext(); parameters none.
CSS Flexbox Inspector: Examine Flexbox layouts - Firefox Developer Tools
in the html pane in the html pane, an element laid out with flexbox has the word flex next to it as shown in the following image: click the word flex in the html pane to keep the overlay visible when you move the mouse away from the container.
... this header is a flex container: each navbar link is a flex item: the nav element within the header is both a flex item and a flex container which holds the navigation links: in the css pane in the css pane's rules view, any instance of a display: flex declaration gets a small flexbox icon next to the word flex.
... flex container options the flex container section of the layout view looks like this: there are two settings you can change in the flex container section: you can control the color of the overlay by clicking on the small circle next to the selector.
Page inspector keyboard shortcuts - Firefox Developer Tools
command windows macos linux delete the selected node delete delete delete undo delete of a node ctrl + z cmd + z ctrl + z redo delete of a node ctrl + shift + z / ctrl + y cmd + shift + z / cmd + y ctrl + shift + z / ctrl + y move to next node (expanded nodes only) down arrow down arrow down arrow move to previous node up arrow up arrow up arrow move to first node in the tree.
...selected node h h h focus on the search box in the html pane ctrl + f cmd + f ctrl + f edit as html f2 f2 f2 stop editing html f2 / ctrl +enter f2 / cmd + return f2 / ctrl + enter copy the selected node's outer html ctrl + c cmd + c ctrl + c scroll the selected node into view s s s find the next match in the markup, when searching is active enter return enter find the previous match in the markup, when searching is active shift + enter shift + return shift + enter breadcrumbs bar these shortcuts work when the breadcrumbs bar is focused.
... command windows macos linux move to the previous element in the breadcrumbs bar left arrow left arrow left arrow move to the next element in the breadcrumbs bar right arrow right arrow right arrow focus the html pane shift + tab shift + tab shift + tab focus the css pane tab tab tab css pane these shortcuts work when you're in the inspector's css pane.
Animating CSS properties - Firefox Developer Tools
the browser creates the animation as a transition from each keyframe to the next.
... layout: next, the browser uses the computed styles to figure out the position and geometry for the elements.
...but next, we'll see how using transform instead of margin eliminates those expensive paints entirely.
Rich output - Firefox Developer Tools
fic rich output the web console provides rich output for many object types, including the following: object array date promise regexp window document element event examining object properties when an object is logged to the console it has a right-pointing triangle next to it, indicating that it can be expanded.
...click on the arrow next to the request and a details panel will open that is equivalent to the headers panel in the network monitor tool.
...rm", 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 any dom element in the console output, it's highlighted on the page: in the screenshot above you'll also see a blue "target" icon next to the node in the console output: click it to switch to the inspector with that node selected.
Beacon API - Web APIs
the synchronous xmlhttprequest forces the browser to delay unloading the document, and makes the next navigation appear to be slower.
... there is nothing the next page can do to avoid this perception of poor page load performance.
... not only do these techniques represent poor coding patterns, some of them are unreliable and result in the perception of poor page load performance for the next navigation.
Using the Gamepad API - Web APIs
the next time an event fires.
... var gamepadinfo = document.getelementbyid("gamepad-info"); var ball = document.getelementbyid("ball"); var start; var a = 0; var b = 0; next we use the gamepadconnected event to check for a gamepad being connected.
... after all this is done, we use our requestanimationframe() to request the next animation frame, running gameloop() again.
IDBCursor.continue() - Web APIs
the continue() method of the idbcursor interface advances the cursor to the next position along its direction, to the item whose key matches the optional key parameter.
... if no key is specified, the cursor advances to the immediate next position, based on its direction.
... the key is less than or equal to this cursor's position and the cursor's direction is next or nextunique.
IDBCursor - Web APIs
WebAPIIDBCursor
idbcursor.continue() advances the cursor to the next position along its direction, to the item whose key matches the optional key parameter.
...(bug 891944) next : "next" : the cursor shows all records, including duplicates.
... nextunique : "nextunique" : the cursor shows all records, excluding duplicates.
KeyboardEvent: code values - Web APIs
008 "unidentified" "undo" 0xe009 "unidentified" "" 0xe00a "" "paste" 0xe00b ~ 0xe00f "" "" 0xe010 "mediatrackprevious" "mediatrackprevious" 0xe011 ~ 0xe016 "" "" 0xe017 "unidentified" "cut" 0xe018 "unidentified" "copy" 0xe019 "mediatracknext" "mediatracknext" 0xe01a, 0xe01b "unidentified" "" 0xe01c "numpadenter" "numpadenter" 0xe01d "controlright" "controlright" 0xe01e "unidentified" "launchmail" 0xe01f "unidentified" "" 0xe020 "audiovolumemute" "audiovolumemute" 0xe021 "launchapp2" "" 0xe022...
...00a2 "unidentified" "" 0x00a3 "launchmail" "" 0x00a4 "browserfavorites" "" 0x00a5 "unidentified" "" 0x00a6 "browserback" "browserback" 0x00a7 "browserforward" "browserforward" 0x00a8 "unidentified" "" 0x00a9 "eject" "" 0x00aa "unidentified" "" 0x00ab "mediatracknext" "" 0x00ac "mediaplaypause" "" 0x00ad "mediatrackprevious" "" 0x00ae "mediastop" "" 0x00af ~ 0x00b2 "unidentified" "" 0x00b3 "launchmediaplayer" "" 0x00b4 "browserhome" "" 0x00b5 "browserrefresh" "browserrefresh" 0x00b6 ~ 0x00ba "unidentified" "" 0x00bb "...
... 0x008f "wakeup" 0x0090 "launchapp1" 0x0091 ~ 0x009b "unidentified" 0x009c "browserfavorites" 0x009d "unidentified" 0x009e "browserback" 0x009f "browserforward" 0x00a0 "unidentified" 0x00a1 "eject" 0x00a2 "unidentified" 0x00a3 "mediatracknext" 0x00a4 "mediaplaypause" 0x00a5 "mediatrackprevious" 0x00a6 "mediastop" 0x00a7 ~ 0x00ac "unidentified" 0x00ad "browserrefresh" 0x00ae ~ 0x00b6 "unidentified" 0x00b7 "f13" 0x00b8 "f14" 0x00b9 "f15" 0x00ba "f16" 0x00bb "f17" 0x00bc "f18" ...
KeyboardEvent.key - Web APIs
WebAPIKeyboardEventkey
next, release the shift key.
...the beforeinput and input events are fired next because a character key has been produced.
...the beforeinput and inputbeforeinput and input events are fired next because a character key has been produced.
Using the MediaStream Recording API - Web APIs
s enough z-index to always sit above the other elements and therefore be focusable/clickable: label { font-family: 'notocoloremoji'; font-size: 3rem; position: absolute; top: 2px; right: 3px; z-index: 5; cursor: pointer; } then we hide the actual checkbox, because we don't want it cluttering up our ui: input[type=checkbox] { position: absolute; top: -100px; } next, we style the information screen (wrapped in an <aside> element) how we want it, give it fixed position so that it doesn't appear in the layout flow and affect the main ui, transform it to the position we want it to sit in by default, and give it a transition for smooth showing/hiding: aside { position: fixed; top: 0; left: 0; text-shadow: 1px 1px 1px black; width: 100%; height...
...next, we call getusermedia() and inside it define: the constraints: only audio is to be captured for our dictaphone.
... next, we create an html structure like the following, inserting it into our clip container, which is an <article> element.
RTCPeerConnection.restartIce() - Web APIs
after restartice() returns, the offer returned by the next call to createoffer() is automatically configured to trigger ice restart on both the local peer (once the local peer has been set) and on the remote peer, once the offer is sent across your signaling mechanism and the remote peer has set its description as well.
...the next time the connection's signalingstate changes to stable, the connection will fire the negotiationneeded event.
... usage notes after calling restartice(), the next offer created using createoffer() will initiate ice restart once sent to the remote peer over your signaling mechanism.
Using Service Workers - Web APIs
next is activation.
... next, we use the serviceworkercontainer.register() function to register the service worker for this site, which is just a javascript file residing inside our app (note this is the file's url relative to the origin, not the js file that references it.) the scope parameter is optional, and can be used to specify the subset of your content that you want the service worker to control.
...this is ok, as you can fix your code and then try again the next time registration occurs.
TextEncoder.prototype.encodeInto() - Web APIs
for example, if your wasm allocator is known to use power-of-two buckets, rounduptobucketsize() should return the argument if it is a power-of-two or the next power-of-two otherwise.
...see the next section about c strings.
...ncoder"]; var globaltextencoderprototype; var globaltextencoderinstance; ////////////////////////////////////////////////////////////////////////////////////// function encoderreplacer(nonasciichars){ // make the utf string into a binary utf-8 encoded string var point = nonasciichars.charcodeat(0)|0; if (0xd800 <= point && point <= 0xdbff) { var nextcode = nonasciichars.charcodeat(1)|0; // defaults to 0 when nan, causing null replacement character if (0xdc00 <= nextcode && nextcode <= 0xdfff) { //point = ((point - 0xd800)<<10) + nextcode - 0xdc00 + 0x10000|0; point = (point<<10) + nextcode - 0x35fdc00|0; if (point > 0xffff) return fromcharcode( ...
Clearing with colors - Web APIs
« previousnext » an example showing how to clear a webgl rendering context to a solid color.
...next, we actually do the drawing by calling the clear() method.
... « previousnext » ...
Color masking - Web APIs
« previousnext » this webgl example modifies random colors by applying color masking to limit the range of displayed colors to specific shades.
...this means that graphics operations in webgl are done in a certain order, where the output of each operation serves as the input of the next.
... « previousnext » ...
Creating 3D objects using WebGL - Web APIs
« previousnext » let's take our square plane into three dimensions by adding five more faces to create a cube.
... drawing the cube next we need to add code to our drawscene() function to draw using the cube's index buffer, adding new gl.bindbuffer() and gl.drawelements() calls: // tell webgl which indices to use to index the vertices gl.bindbuffer(gl.element_array_buffer, buffers.indices); ...
... view the complete code | open this demo on a new page « previousnext » ...
Using shaders to apply color in WebGL - Web APIs
« previousnext » having created a square plane in the previous demonstration, the next obvious step is to add a splash of color to it.
... drawing using the colors next, it's necessary to add code to look up the attribute location for the colors and setup that attribute for the shader program: const programinfo = { program: shaderprogram, attriblocations: { vertexposition: gl.getattriblocation(shaderprogram, 'avertexposition'), vertexcolor: gl.getattriblocation(shaderprogram, 'avertexcolor'), }, ...
... const offset = 0; gl.bindbuffer(gl.array_buffer, buffers.color); gl.vertexattribpointer( programinfo.attriblocations.vertexcolor, numcomponents, type, normalize, stride, offset); gl.enablevertexattribarray( programinfo.attriblocations.vertexcolor); } view the complete code | open this demo on a new page « previousnext » ...
Using textures in WebGL - Web APIs
« previousnext » now that our sample program has a rotating 3d cube, let's map a texture onto it instead of having its faces be solid colors.
... first, the code to specify the colors buffer is gone, replaced with this: // tell webgl how to pull out the texture coordinates from buffer { const num = 2; // every coordinate composed of 2 values const type = gl.float; // the data in the buffer is 32 bit float const normalize = false; // don't normalize const stride = 0; // how many bytes to get from one set to the next const offset = 0; // how many bytes inside the buffer to start from gl.bindbuffer(gl.array_buffer, buffers.texturecoord); gl.vertexattribpointer(programinfo.attriblocations.texturecoord, num, type, normalize, stride, offset); gl.enablevertexattribarray(programinfo.attriblocations.texturecoord); } then add code to specify the texture to map onto the faces, just before draw: //...
... « previousnext » ...
Signaling and video calling - Web APIs
the next task is to update the main websocket message handler to support doing so.
...next, we set a handler for the click event on the list item, that clicking on a user name calls our invite() method, which we'll look at in the next section.
...} next steps you can now try out this example on glitch to see it in action.
Taking still photos with WebRTC - Web APIs
next, we have a <canvas> element into which the captured frames are stored, potentially manipulated in some way, and then converted into an output image file.
... function startup() { video = document.getelementbyid('video'); canvas = document.getelementbyid('canvas'); photo = document.getelementbyid('photo'); startbutton = document.getelementbyid('startbutton'); get the media stream the next task is to get the media stream: navigator.mediadevices.getusermedia({ video: true, audio: false }) .then(function(stream) { video.srcobject = stream; video.play(); }) .catch(function(err) { console.log("an error occurred: " + err); }); here, we're calling mediadevices.getusermedia() and requesting a video stream (without audio).
... next we set the fillstyle to #aaa (a fairly light grey), and fill the entire canvas with that color by calling fillrect().
Using DTMF with WebRTC - Web APIs
note that this example is "cheating" by generating both peers in one code stream, rather than having each be a truly separate entity.</p> <audio id="audio" autoplay controls></audio><br/> <button name="dial" id="dial">dial</button> <div class="log"></div> javascript let's take a look at the javascript code next.
... next, the event handlers for the caller are established.
... next we look to see if the rtcpeerconnection.getsenders() method is implemented.
Starting up and shutting down a WebXR session - Web APIs
assuming you're already familiar with 3d graphics in general and webgl in particular, taking that next bold step into mixed reality—the idea of presenting artificial scenery or objects in addition to or in place of the real world—is not overly complicated.
... next, any data and setup needed for the webgl renderer is performed before then configuring webgl to use the framebuffer of the webgl context as its own framebuffer.
... with the new reference space in hand and stored into the worlddata object for safe-keeping, we call the session's requestanimationframe() method to schedule a callback to be executed when it's time to render the next frame of animation for the webxr session.
XRSession.requestAnimationFrame() - Web APIs
the xrsession method requestanimationframe(), much like the window method of the same name, schedules a callback to be executed the next time the browser is ready to paint the session's virtual environment to the xr display.
... the specified callback is executed once before the next repaint; if you wish for it to be executed for the following repaint, you must call requestanimationframe() again.
... syntax requestid = xrsession.requestanimationframe(animationframecallback); parameters animationframecallback a function which is called before the next repaint in order to allow you to update and render the xr scene based on elapsed time, animation, user input changes, and so forth.
ARIA Test Cases - Accessibility
if an item is focused within the list, this should be announced next, followed by an indication of this item's position within the list if the screen reader supports this in other lists as well.
...uicy studio -- real world example this site -- another real world example application with inner document -- the only landmark here is the document, since role="application" as at the root expected at behavior: screen readers should not include the root accessible object in a page in the list of landmarks screen readers should provide keys to allow users to traverse a list of landmarks or next/prev landmark keys screen readers should support nested landmarks, and multiple landmarks of the same time screen readers should announce the number of landmarks at page load, if they exist on the page screen readers should announce landmarks as users navigate into them (test in all screen reader modes) 8 (jg) are their any landmark role equivalents with html headers like role=main~h1??
... semicolon and shift+semicolon move to next landmark and move to previous landmark respectively.
ARIA annotations - Accessibility
you can learn more about this in the next section.
...as an example, let’s say you have a poll/voting ui widget that shows numbers of votes, but you want to summarize the purpose of the widget in a clear description because the ui does not make it clear: <section aria-description="choose your favourite fruit — the fruit with the highest number of votes will be added to the lunch options next week."> <p>pick your favourite fruit:</p> <form> <ul> <li><label>apple: <input type="radio" name="fruit" value="apple"></label></li> <li><label>orange: <input type="radio" name="fruit" value="orange"></label></li> <li><label>banana: <input type="radio" name="fruit" value="banana"></label></li> </ul> </form> </section> if the descriptive text does appear in the ui,...
... you can link the description to the widget using aria-describedby, like so: <p id="fruit-desc">choose your favourite fruit — the fruit with the highest number of votes will be added to the lunch options next week.</p> <section aria-describedby="fruit-desc"> <form> <ul> <li><label>apple: <input type="radio" name="fruit" value="apple"></label></li> <li><label>orange: <input type="radio" name="fruit" value="orange"></label></li> <li><label>banana: <input type="radio" name="fruit" value="banana"></label></li> </ul> </form> </section> insertions and deletions a common wish in online document systems like google docs is to be able to track changes, to see what reviewers or editors have suggested as changes to the text, before the managing editor or author accepts...
ARIA: feed role - Accessibility
providing reading mode keys that move dom focus to the next and previous articles.
... keyboard interaction supporting the following, or a similar, interface is recommended when focus is inside the feed: page down: move focus to next article.
...navigate between the nested feed and main feed with control + end , moving focus from the inner feed to the next article in the outer feed.
An overview of accessible web applications and widgets - Accessibility
for example, using the left and right arrow keys should move focus to the previous and next menu items.
...on windows, the next tab should automatically be activated when the user presses the arrow keys.
... on mac os x, the user can press either enter or the spacebar to activate the next tab.
Implementing a Microsoft Active Accessibility (MSAA) Server - Accessibility
[important] accnavigate: navigate to the first/last child, previous/next sibling, up, down, left or right from this iaccessible.
...there is always a belated new version due around corner, after which you will be promised to be the next priority.
...we also support ienumvariant::next() which allows for fast marshaling of all of an objects children to a client via com.
system - CSS: Cascading Style Sheets
the first counter symbol provided in the symbols descriptor is interpreted as 1, the next as 2, and so on.
...the main difference is that in the alphabetic system, the first counter symbol given in the symbols descriptor is interpreted as 1, the next as 2, and so on.
... however, in the numeric system, the first counter symbol is interpreted as 0, the next as 1, then 2, and so on.
Basic Concepts of Multicol - CSS: Cascading Style Sheets
in this next example we use column-width of 200px and column-count of 2.
... .container { columns: 2 200px; } next steps in this guide we've learned the basic use of multiple-column layout.
... in the next guide, we will look at how much we can style the columns themselves.
Styling Columns - CSS: Cascading Style Sheets
in this next example i have created a 5px dotted rule with a color of rebeccapurple, using the longhand values.
... in this next example we have a very wide rule of 40px and a 10px gap.
...in the next guide we will take a look at making elements inside a container span across all columns.
Box alignment in CSS Grid Layout - CSS: Cascading Style Sheets
in this next example, i am using the align-self property, to demonstrate the different alignment values.
... in this next example, i have given item 1 a left margin of auto.
...in the next guide, we will look further into this interaction between css grid layout, box alignment and writing modes.
Relationship of grid layout to other layout methods - CSS: Cascading Style Sheets
the same layout with css grids in this next example, i create the same layout using grid.
... in this next example, i have used the auto-fill keyword in place of an integer in the repeat notation and set the track listing to 200 pixels.
...in this next example, i create auto filled tracks with minmax.
Applying color to HTML elements using CSS - HTML: Hypertext Markup Language
our two colored boxes share a number of properties in common, so next we establish a class, .box, that defines those shared properties: .box { width: 290px; height: 100px; margin: 0; padding: 4px 6px; font: 28px "marker felt", "zapfino", cursive; display: flex; justify-content: center; align-items: center; } in brief, .box establishes the size of each box, as well as the configuration of the font used within.
...it's configured to float the box to the right so that it appears next to the previous box.
...upon opening paletton, we see: next, we enter our color's hex code (d79c7a) into the "base rgb" box at the bottom-left corner of the tool: we now see a monochromatic palette based on the color we picked from the mars photo.
<input type="date"> - HTML: Hypertext Markup Language
WebHTMLElementinputdate
we make use of the :valid and :invalid pseudo-elements to add an icon next to the input, based on whether or not the current value is valid.
... we had to put the icon on a <span> next to the input, not on the input itself, because in chrome at least the input's generated content is placed inside the form control, and can't be styled or shown effectively.
...picker.style.display = 'none'; fallbackpicker.style.display = 'block'; fallbacklabel.style.display = 'block'; // populate the days and years dynamically // (the months are always the same, therefore hardcoded) populatedays(monthselect.value); populateyears(); } function populatedays(month) { // delete the current set of <option> elements out of the // day <select>, ready for the next set to be injected while(dayselect.firstchild){ dayselect.removechild(dayselect.firstchild); } // create variable to hold new number of days to inject var daynum; // 31 or 30 days?
<input type="file"> - HTML: Hypertext Markup Language
WebHTMLElementinputfile
next, let's walk through the javascript.
...next, we hide the <input> element — we do this because file inputs tend to be ugly, difficult to style, and inconsistent in their design across browsers.
... next, we add an event listener to the input to listen for changes to its selected value changes (in this case, when files are selected).
<input type="time"> - HTML: Hypertext Markup Language
WebHTMLElementinputtime
for example, specifying a min of 14:00 and a max of 2:00 means that the permitted time values start at 2:00 pm, run through midnight to the next day, ending at 2:00 am.
... using step seems to cause validation to not work properly (as seen in the next section).
...we had to put the icons on a <span> next to the input, not on the input itself, because in chrome the generated content is placed inside the form control, and can't be styled or shown effectively.
Preloading content with rel="preload" - HTML: Hypertext Markup Language
other resource preloading mechanisms other preloading features exist, but none are quite as fit for purpose as <link rel="preload">: <link rel="prefetch"> has been supported in browsers for a long time, but it is intended for prefetching resources that will be used in the next navigation/page load (e.g.
... when you go to the next page).
...in addition, browsers will give prefetch resources a lower priority than preload ones — the current page is more important than the next.
Control flow and error handling - JavaScript
« previousnext » javascript supports a compact set of statements, specifically control flow statements, that you can use to incorporate a great deal of interactivity in your application.
...if break is omitted, the program continues execution inside the switch statement (and will evaluate the next case, and so on).
...ethingerrorprone() { if (ourcodemakesamistake()) { throw (new error('the message')); } else { dosomethingtogetajavascripterror(); } } ⋮ try { dosomethingerrorprone(); } catch (e) { // now, we actually use `console.error()` console.error(e.name); // logs 'error' console.error(e.message); // logs 'the message', or a javascript error message } « previousnext » ...
Grammar and types - JavaScript
« previousnext » this chapter discusses javascript's basic grammar, variable declarations, data types and literals.
...to learn more about javascript's language constructs, see also the following chapters in this guide: control flow and error handling loops and iteration functions expressions and operators in the next chapter, we will have a look at control flow constructs and error handling.
... « previousnext » ...
Indexed collections - JavaScript
« previousnext » this chapter introduces collections of data which are ordered by an index value.
... on every subsequent call, the first parameter's value will be whatever callback returned on the previous call, and the second parameter's value will be the next value in the array.
... « previousnext » ...
Regular expression syntax cheatsheet - JavaScript
for characters that are usually treated literally, indicates that the next character is special and not to be interpreted literally.
... for characters that are usually treated specially, indicates that the next character is not special and should be interpreted literally.
...this is a position where the previous and next character are of the same type: either both must be words, or both must be non-words, for example between two letters or between two spaces.
Text formatting - JavaScript
« previousnext » this chapter introduces how to work with strings and text in javascript.
...the first element is at index 0, the next at index 1, and so on.
... « previousnext » ...
JavaScript language resources - JavaScript
262 7th edition html june 2016 ecmascript 2016 language specification ecma-402 3rd edition html june 2016 ecmascript 2016 internationalization api specification ecma-262 8th edition html june 2017 ecmascript 2017 language specification ecma-402 4th edition html june 2017 ecmascript 2017 internationalization api specification es.next is a dynamic name that refers to whatever the next version is at the time of‍ writing.
... es.next features are more correctly called proposals, because, by definition, the specification has not been finalized yet.
... you can participate in or just track the work on the next revisions of the ecmascript language specification, code-named "harmony", and the ecmascript internationalization api specification via public wiki and the es-discuss mailing list linked from ecmascript.org.
Array.prototype.values() - JavaScript
array.prototype.values === array.prototype[symbol.iterator] //true iteration using .next() var arr = ['a', 'b', 'c', 'd', 'e']; var iterator = arr.values(); iterator.next(); // object { value: "a", done: false } iterator.next().value; // "b" iterator.next()["value"]; // "c" iterator.next(); // object { value: "d", done: false } iterator.next(); // object { value: "e", done: false } iterator.next(); // object { valu...
...e: undefined, done: true } iteraror.next().value; // undefined one-use: the array iterator object is one use or temporary object example: var arr = ['a', 'b', 'c', 'd', 'e']; var iterator = arr.values(); for (let letter of iterator) { console.log(letter); } //"a" "b" "c" "d" "e" for (let letter of iterator) { console.log(letter); } // undefined reason: when next().done=true or currentindex>length the for..of loop ends.
... var arr = ['a', 'b', 'c', 'd', 'e']; var iterator = arr.values(); console.log(iterator); // array iterator { } iterator.next().value; // "a" arr[1]='n'; iterator.next().value; // "n" if the values in the array changed the array iterator object values change too.
Generator.prototype.return() - JavaScript
function* gen() { yield 1; yield 2; yield 3; } const g = gen(); g.next(); // { value: 1, done: false } g.return('foo'); // { value: "foo", done: true } g.next(); // { value: undefined, done: true } if return(value) is called on a generator that is already in "completed" state, the generator will remain in "completed" state.
... if no argument is provided, the value property of returned object is the same as if .next().
... function* gen() { yield 1; yield 2; yield 3; } const g = gen(); g.next(); // { value: 1, done: false } g.next(); // { value: 2, done: false } g.next(); // { value: 3, done: false } g.next(); // { value: undefined, done: true } g.return(); // { value: undefined, done: true } g.return(1); // { value: 1, done: true } specifications specification ecmascript (ecma-262)the definition of 'generator.prototype.return' in that specification.
Math.round() - JavaScript
description if the fractional portion of the argument is greater than 0.5, the argument is rounded to the integer with the next higher absolute value.
... if the fractional portion is exactly 0.5, the argument is rounded to the next integer in the direction of +∞.
... note that this differs from many languages' round() functions, which often round this case to the next integer away from zero, instead giving a different result in the case of negative numbers with a fractional part of exactly 0.5.
String.prototype.charAt() - JavaScript
(number.isnan(code)) { return ''; // position not found } if (code < 0xd800 || code > 0xdfff) { return str.charat(i); } // high surrogate (could change last hex to 0xdb7f to treat high private // surrogates as single characters) if (0xd800 <= code && code <= 0xdbff) { if (str.length <= (i + 1)) { throw 'high surrogate without following low surrogate'; } var next = str.charcodeat(i + 1); if (0xdc00 > next || next > 0xdfff) { throw 'high surrogate without following low surrogate'; } return str.charat(i) + str.charat(i + 1); } // low surrogate (0xdc00 <= code && code <= 0xdfff) if (i === 0) { throw 'low surrogate without preceding high surrogate'; } var prev = str.charcodeat(i - 1); // (could change last hex to 0xd...
...tion not found } if (code < 0xd800 || code > 0xdfff) { return [str.charat(i), i] // normal character, keeping 'i' the same } // high surrogate (could change last hex to 0xdb7f to treat high private // surrogates as single characters) if (0xd800 <= code && code <= 0xdbff) { if (str.length <= (i + 1)) { throw 'high surrogate without following low surrogate' } let next = str.charcodeat(i + 1) if (0xdc00 > next || next > 0xdfff) { throw 'high surrogate without following low surrogate' } return [str.charat(i) + str.charat(i + 1), i + 1] } // low surrogate (0xdc00 <= code && code <= 0xdfff) if (i === 0) { throw 'low surrogate without preceding high surrogate' } let prev = str.charcodeat(i - 1) // (could change last hex ...
...to 0xdb7f to treat high private surrogates // as single characters) if (0xd800 > prev || prev > 0xdbff) { throw 'low surrogate without preceding high surrogate' } // return the next character instead (and increment) return [str.charat(i + 1), i + 1] } fixing charat() to support non-basic-multilingual-plane (bmp) characters while the previous example may be more useful for programs that must support non-bmp characters (since it does not require the caller to know where any non-bmp character might appear), in the event that one does wish, in choosing a character by index, to treat the surrogate pairs within a string as the single characters they represent, one can use the following: function fixedcharat(str, idx) { let ret = '' str += '' let end = str.length let surro...
Animation performance and frame rate - Web Performance
the browser creates the animation as a transition from each keyframe to the next.
... layout: next, the browser uses the computed styles to figure out the position and geometry for the elements.
...but next, we'll see how using transform instead of margin eliminates those expensive paints entirely.
Performance fundamentals - Web Performance
the next few subsections point out and discuss essential performance metrics.
...it tells the browser to render results even while the browser isn't actually drawing; that is, while the video hardware hasn't reached the next display cycle.
...this waits until the browser is actually ready to start building the next frame of your animation, and won't bother if the hardware isn't going to actually draw anything.
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.
...your web app can sit next to native applications as first class citizens.
... previous overview: progressive next ...
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.
... responsiveness responsive web apps use technologies like media queries and viewport to make sure that their uis will fit any form factor: desktop, mobile, tablet, or whatever comes next.
... overview: progressive web apps next ...
Basic shapes - SVG: Scalable Vector Graphics
« previousnext » there are several basic shapes used for most svg drawing.
... for this reason, the next section in this tutorial will be focused on paths.
... « previousnext » ...
Fills and Strokes - SVG: Scalable Vector Graphics
« previousnext » there are several ways to color shapes (including specifying attributes on the object) using inline css, an embedded css section, or an external css file.
...so in the above example, the second path fills 5 pixel units, with 5 blank units until the next dash of 5 units.
...external stylesheet for your css rules through normal xml-stylesheet syntax: <?xml version="1.0" standalone="no"?> <?xml-stylesheet type="text/css" href="style.css"?> <svg width="200" height="150" xmlns="http://www.w3.org/2000/svg" version="1.1"> <rect height="10" width="10" id="myrect"/> </svg> where style.css looks something like: #myrect { fill: red; stroke: black; } « previousnext » ...
Introduction - SVG: Scalable Vector Graphics
« previousnext » svg is an xml language, similar to xhtml, which can be used to draw vector graphics, such as the ones shown to the right.
..."full" svg 1.2 was meant to be the next major release of svg.
... « previousnext » ...
Caching compiled WebAssembly modules - WebAssembly
{ var db = request.result; if (db.objectstorenames.contains(storename)) { console.log(`clearing out version ${event.oldversion} wasm cache`); db.deleteobjectstore(storename); } console.log(`creating version ${event.newversion} wasm cache`); db.createobjectstore(storename) }; }); } looking up modules in the database our next function — lookupindatabase() — provides a simple promise-based operation for looking up the given url in the object store we created above.
... db.transaction([storename]).objectstore(storename); var request = store.get(url); request.onerror = reject.bind(null, `error getting wasm module ${url}`); request.onsuccess = event => { if (request.result) resolve(request.result); else reject(`module ${url} was not found in wasm cache`); } }); } storing and instantiating modules next, we define a function storeindatabase() that fires off an async operation to store a given wasm module in a given database.
...rl stored in the given db: return opendatabase().then(db => { return lookupindatabase(db).then(module => { if we do, we instantiate it with the given import object: console.log(`found ${url} in wasm cache`); return webassembly.instantiate(module, importobject); }, if not, we compile it from scratch and then store the compiled module in the database with a key of url, for next time we want to use it: errmsg => { console.log(errmsg); return webassembly.instantiatestreaming(fetch(url)).then(results => { storeindatabase(db, results.module); return results.instance; }); }) }, note: it is for this kind of usage that webassembly.instantiate() returns both a module and an instance: the module represents the compiled code and can ...
Reddit Example - Archive of obsolete content
if (t.nodename != "a") return; // don't intercept the click if it was on one of the links in the header // or next/previous footer, since those links should load in the panel itself.
... if ($(t).parents('#header').length || $(t).parents('.nextprev').length) return; // intercept the click, passing it to the addon, which will load it in a tab.
Content Processes - Archive of obsolete content
these are explained in the next section.
... in the next section, we will look at how content scripts interact with the dom in a content process.
widget - Archive of obsolete content
next, we write a content script that listens for click events on each icon and sends the corresponding message to the main add-on code: var play_button = document.getelementbyid("play-button"); play_button.onclick = function() { self.port.emit("play"); } var pause_button = document.getelementbyid("pause-button"); pause_button.onclick = function() { self.port.emit("pause"); } var stop_button = d...
... var play_button = document.getelementbyid("play-button"); play_button.onclick = function() { addon.port.emit("play"); } var pause_button = document.getelementbyid("pause-button"); pause_button.onclick = function() { addon.port.emit("pause"); } var stop_button = document.getelementbyid("stop-button"); stop_button.onclick = function() { addon.port.emit("stop"); } } next, add a script tag to reference "button-script.js", and call its init() function on load: <html> <head> <script src="button-script.js"></script> </head> <body onload="init()"> <img src="play.png" id="play-button"> <img src="pause.png" id="pause-button"> <img src="stop.png" id="stop-button"> </body> </html> finally, remove the line attaching the content script from "main.
lang/functional - Archive of obsolete content
calling the wrapped version will call the original function during the next event loop.
... let { defer } = require("sdk/lang/functional"); let fn = defer(function myevent (event, value) { console.log(event + " : " + value); }); fn("click", "#home"); console.log("done"); // this will print 'done' before 'click : #home' since // we deferred the execution of the wrapped `myevent` // function, making it non-blocking and executing on the // next event loop parameters fn : function the function to be deferred.
Creating annotations - Archive of obsolete content
next we will create the editor panel, which enables the user to enter an annotation associated with the selected element.
... that's a complete annotation, and in the next section we'll deal with storing it.
Getting Started (jpm) - Archive of obsolete content
next, create a directory called "data" in your add-on's root, mkdir data and save these three icon files to the "data" directory: icon-16.png icon-32.png icon-64.png back at the command prompt, type: jpm run this is the jpm command to run a new instance of firefox with your add-on installed.
... what's next?
Getting started (cfx) - Archive of obsolete content
next, save these three icon files to the "data" directory: icon-16.png icon-32.png icon-64.png back at the command prompt, type: cfx run this is the sdk command to run a new instance of firefox with your add-on installed.
... what's next?
File I/O - Archive of obsolete content
however, you can enumerate available drives using the following code: components.utils.import("resource://gre/modules/fileutils.jsm"); var root = new fileutils.file("\\\\."); var drivesenum = root.directoryentries, drives = []; while (drivesenum.hasmoreelements()) { drives.push(drivesenum.getnext().
... // file is the given directory (nsifile) var entries = file.directoryentries; var array = []; while(entries.hasmoreelements()) { var entry = entries.getnext(); entry.queryinterface(components.interfaces.nsifile); array.push(entry); } reading from a file read into a stream or a string this will allow you to read a file without locking up the ui thread while reading.
Finding window handles - Archive of obsolete content
finding the content window handle hwnd hcontent = 0; // first we need to find the main browser window hwnd hff = ::findwindowex(0, 0, "mozillauiwindowclass", 0); if (hff) { // next we step down through a fixed structure hwnd htemp; htemp = ::findwindowex(hff, 0, "mozillawindowclass", 0); htemp = ::findwindowex(htemp, 0, "mozillawindowclass", 0); // assume only 1 window at this level has children // and the 1 with children is the one we want hwnd hchild = ::getwindow(htemp, gw_child); while (htemp && !hchild) { htemp = ::getwindow(htemp, gw...
..._hwndnext); hchild = ::getwindow(htemp, gw_child); } // did we find a window with children?
JavaScript timers - Archive of obsolete content
the requestanimationframe() function tells the browser that you wish to perform an animation and requests that the browser schedule a repaint of the window for the next animation frame.
... requestanimationframe() requestanimationframe() tells the browser that you wish to perform an animation and requests that the browser schedule a repaint of the window for the next animation frame.
Toolbar - Archive of obsolete content
these elements have special behaviors when placed next to eachother, and will break if separated by another element.
... installbutton(toolbarid, id, afterid) { if (!document.getelementbyid(id)) { var toolbar = document.getelementbyid(toolbarid); // if no afterid is given, then append the item to the toolbar var before = null; if (afterid) { let elem = document.getelementbyid(afterid); if (elem && elem.parentnode == toolbar) before = elem.nextelementsibling; } toolbar.insertitem(id, before); toolbar.setattribute("currentset", toolbar.currentset); document.persist(toolbar.id, "currentset"); if (toolbarid == "addon-bar") toolbar.collapsed = false; } } if (firstrun) { installbutton("nav-bar", "my-extension-navbar-button"); // the "addon-bar" is available since firefox 4 ...
xml:base support in old browsers - Archive of obsolete content
// var ns = 'http://www.w3.org/xml/1998/namespace'; var att, protocolpos; var xmlbase = ''; var abs = false; // avoid loop if node is not present if (!thisitem || !thisitem.nodename) { return xmlbase; } // check present element and higher up for xml:base // now check for the next matching local name up in the hierarchy (until the document root) while (thisitem.nodename !== '#document' && thisitem.nodename !== '#document-fragment') { att = thisitem.getattribute('xml:base'); // xml: namespaces must use 'xml' prefix if (att) { protocolpos = att.indexof('//'); var protocolmatch = att.match(scheme); if (protocolmatch) { // if has protocol, can stop if (abs) ...
...ash, as the absolute path to be added already has one } } else if (!att.match(/\/$/)) { // if no trailing slash, add one, since it is being attached to a relative path att += '/'; } xmlbase = att + xmlbase; // if previous path was not absolute, resolve against the full uri here' break; } else if (att.indexof('/') === 0) { // if absolute (/), need to prepare for next time to strip out after slash xmlbase = att + xmlbase; abs = true; // once the protocol is found on the next round, make sure any extra path is ignored } else { // if relative, just add it xmlbase = att + xmlbase; } } thisitem = thisitem.parentnode; } //return (xmlbase === '') ?
Creating custom Firefox extensions with the Mozilla build system - Archive of obsolete content
the final file, myextension.cpp, contains the code necessary to register these components, as described in the next section.
...go back and flesh out the c++ implementation of your components so that the build can complete next time.
Chapter 1: Introduction to Extensions - Archive of obsolete content
« previousnext » note: if you want contribute to this document please following guidelines from the contribute page.
... « previousnext » ...
Chapter 2: Technologies used in developing extensions - Archive of obsolete content
« previousnext » this document was authored by hiroshi shimoda of clear code inc.
... listing 4: an example manipulation using the dom var bar = document.getelementbyid('toolbar'); bar.removechild(bar.childnodes[1]); bar.appendchild(document.createelement('button')); bar.lastchild.setattribute('label', 'hello!'); « previousnext » ...
Adding Events and Commands - Archive of obsolete content
« previousnext » event handlers just like with html, most javascript code execution is triggered by event handlers attached to dom elements.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
Adding Toolbars and Toolbar Buttons - Archive of obsolete content
« previousnext » adding a new toolbar adding new toolbars to firefox is easy, but adding them the wrong way is very easy as well.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
Adding menus and submenus - Archive of obsolete content
« previousnext » the hello world example in the previous sections shows the two most common ways to add menus.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
Adding sidebars - Archive of obsolete content
« previousnext » the sidebar in firefox is a relatively large and flexible space to add rich interfaces without requiring new windows or complicated overlays.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
Custom XUL Elements with XBL - Archive of obsolete content
« previousnext » xml binding language (xbl, sometimes also called extensible bindings language) is a language for describing bindings that can be attached to elements in other documents.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
Handling Preferences - Archive of obsolete content
« previousnext » preferences in firefox mozilla applications are highly customizable.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
Intercepting Page Loads - Archive of obsolete content
« previousnext » there are several ways to detect and intercept loading of web pages and their content, be it only to realize when it happens, modify their contents, or to block them and do something else instead.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
Introduction - Archive of obsolete content
next » welcome to the xul school tutorial!
... next » this tutorial was kindly donated to mozilla by appcoast.
JavaScript Object Management - Archive of obsolete content
« previousnext » chrome javascript in this section we'll look into how to handle javascript data effectively, beginning with chrome code, in ways which will prevent pollution of shared namespaces and conflicts with other add-ons resulting from such global namespace pollution.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
Mozilla Documentation Roadmap - Archive of obsolete content
« previousnext » mozilla documentation firefox extension development is still an immature discipline, with a developer base consisting mostly of hobbyists and just a few organized development groups.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
Observer Notifications - Archive of obsolete content
« previousnext » sometimes you need your code to send a message to other parts of your code.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
The Essentials of an Extension - Archive of obsolete content
« previousnext » the install.rdf file in the last section we looked at the contents of the hello world extension.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
User Notifications and Alerts - Archive of obsolete content
« previousnext » it is often the case that extensions need to notify users about important events, often requiring some response.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
XPCOM Objects - Archive of obsolete content
« previousnext » xpcom xpcom is a cross platform component object model, similar to microsoft com.
... « previousnext » this tutorial was kindly donated to mozilla by appcoast.
Creating reusable content with CSS and XBL - Archive of obsolete content
what next?
...the next page demonstrates it: xul user interfaces.
XML data - Archive of obsolete content
previous section: svg next section: xbl binding information: xml data xml (extensible markup language) is a general-purpose language for any kind of structured data.
... (see the tables chapter in the css specification for examples that you can adapt.) what next?
Creating a dynamic status bar extension - Archive of obsolete content
« previousnext » this article builds upon the article creating a status bar extension, which creates a static status bar panel in the firefox status bar, by dynamically updating its content with information fetched from the web every few minutes.
...you should see something that looks like this: in this screenshot, we also have the previous sample running, displaying the text "hello world." « previousnext » ...
Creating a status bar extension - Archive of obsolete content
next » this is the first in a series of articles that will demonstrate how to create increasingly intricate extensions for the firefox browser.
... next » ...
List of Mozilla-Based Applications - Archive of obsolete content
uses mozilla rhino babelgum internet tv service basilisk pre-servo xul-based web browser uses most of the firefox 55 source code batik java-based toolkit uses mozilla rhino bitbox security focused browser seemingly based on firefox blackbird browser for african american community bluegriffon wysiwyg editor next generation version of composer buzzbird twitter client built on xulrunner camino browser 2.5m downloads and ~400,000 active users ...
...s linux distro mozcards, jolistopwatch, jolitimer simple apps for maemo uses xulrunner moznet .net control embeddable gecko for .net applications wraps xulrunner for use in .net applications my internet browser localized browser uses gecko myna application server javascript application server for java uses mozilla rhino nextcms (fr) cms nightingale music player community run effort to continue songbird support for linux olpc web browser browser oneteam jabber client opendocument viewer viewer opengate's tools cd burner, file browser, and hardware diagnostic softwares opengate is the opensource side of the easyneuf project, “a free ...
Notes on HTML Reflow - Archive of obsolete content
specifically, it extracts the next frame along the path from the reflow command object, creates its own reflow state, also with an incremental reason, and invokes the reflow method of the next frame.
...each frame along the incremental reflow path (as specified in the reflow command object) extracts the next frame and dispatches the reflow downward.
Automated testing tips and tricks - Archive of obsolete content
vel/work/tests/ start app with command line flag -chrome chrome://tests/content/quit.xul how to create a new profile from the command line first, use the -createprofile command line flag to add a profile entry to profiles.ini and populate the new profile directory with a prefs.js file firefox-bin -createprofile "testprofile ${profile_dir}/testprofile" next, start firefox to populate the new profile directory with the rest of the default settings firefox-bin -p testprofile -chrome chrome://tests/content/quit.xul<code> the above process may exit before the profile is completely created.
... in test scripts, <code>sleep 5 after the above command should ensure the profile is created before the next command in the test script is run how to enable dump in a new profile add user_pref("browser.dom.window.dump.enabled", true); to profiledir/user.js how to execute test code with chrome privileges using a chrome doc - see sbtests.xul in http://people.mozilla.com/~davel/scripts/ for an example firefox-bin -p sbtestprofile -chrome chrome://sbtests/content/ above code calls the quit function in quit.js to exit after test is finished how to detect content onload event from chrome use the domcontentloaded event chromewindow.addeventlistener('domcontentloaded',callbackfunction,false); ...
Adding the structure - Archive of obsolete content
« previousnext » the ui for our extension is an icon in the status bar.
... « previousnext » ...
Finding the code to modify - Archive of obsolete content
click the plus sign next to the statusbar node in the dom inspector and select each statusbarpanel node in turn.
... « previousnext » ...
Making it into a static overlay - Archive of obsolete content
its next line is the stylesheet reference we previously added to navigator.xul.
... « previousnext » ...
Creating regular expressions for a microsummary generator - Archive of obsolete content
but urls can contain multiple named parameters separated by ampersands (&), and the parameters can appear in any order, so even though the "item" parameter seems to be necessary, it might not appear right next to "viewitem".
...ns in query parameters, we can insert a period followed by an asterisk (.*) between "viewitem&" and "item=" to match any characters that might appear between those two strings: ^http://cgi\.ebay\.com/ws/ebayisapi\.dll\?viewitem&.*item= the period followed by an asterisk matches any combination of characters, including no characters at all, so it works even if "viewitem&" and "item=" are right next to each other (as in our example url) as well as when there are some characters between them.
Download Manager preferences - Archive of obsolete content
0 indicates that the downloads should be paused and resumed automatically the next time firefox is run; 1 indicates that the downloads should be paused but will not automatically resume when the application is restarted; and 2 indicates that the downloads will be canceled on quit.
... default value is 0 (resume on next launch).
Drag and Drop - Archive of obsolete content
next » as of gecko 1.9.1 (firefox 3.5), these apis are officially deprecated the newer, simpler, portable api should be used in their place.
... next » original document information author(s): neil deakin original document: copyright information: copyright (c) neil deakin ...
Block and Line Layout Cheat Sheet - Archive of obsolete content
mnextrcframe during an incremental reflow, this member holds current frame in the reflow chain.
...mlastframe may also be directly manipulated if a line is split, or if frames are pushed from one line to the next.
Repackaging Firefox - Archive of obsolete content
check the boxes next to each one you want to generate.
...the names of the source installer packages for each platform that are included in your source directory will appear next to each checkbox.
Settings - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
... the user can open this interface from the "settings" button next to your jetpack on the "installed features" tab of the about:jetpack page.
How to Write and Land Nanojit Patches - Archive of obsolete content
whoever does the next tm/tr update (scenario 3 below) will deal with the other patches.
...if you do so, the next time you copy revisions from nanojit-central to your target repository, the script will re-copy the backed-out revisions, as well as those that occurred after.
Remotely debugging Firefox for Metro - Archive of obsolete content
if you are connecting to firefox for metro on a different computer or a different port, enter the appropriate hostname and port number and then press "connect." in the windows 8 (metro) browser next you'll see a dialog in firefox for metro asking you to confirm the connection.
... on the desktop next, the desktop shows you a dialog that looks something like this: this is asking whether you want to debug web content running in a browser tab, or to debug the browser code itself.
Merging TraceMonkey Repo - Archive of obsolete content
for each unresolved file (with a u next to it), open the file and find the conflict markers that look like <<<<<<.
...once you've resolved all the files, all the entries in hg resolve -l will have rs next to them.
Mac stub installer - Archive of obsolete content
build the mac installer (debug or non-debug target) using miw.mcp grab a nightly build, say from <http://ftp.mozilla.org/pub/mozilla/n...taller.sea.bin> drop in the installer binary next to the "mozilla installer" in the "mozilla installer" folder created by unstuffing the opt build.
... alternative to steps 3 and 4 copy the "installer modules" folder from the "mozilla installer" folder into the "macbuild" folder that contains the build debug or non-debug installer binary next to miw.mcp.
Learn XPI Installer Scripting by Example - Archive of obsolete content
nes 26-41: err = adddirectory("program", "6.0.0.2000110807", "bin", // jar source folder communicatorfolder, // target folder "", // target subdir true ); // force flag logcomment("adddirectory() returned: " + err); // create the plugins folder next to mozilla var pluginsfolder = getfolder("plugins"); if (!fileexists(pluginsfolder)) { var ignoreerr = dircreate(pluginsfolder); logcomment("dircreate() returned: " + ignoreerr); } else logcomment("plugins folder already exists"); in this case, the files are contained within a single directory, so calling the install object's adddirectory method is sufficient to queu...
...after putting these two files in a xpi (which, as described above, is simply a zip file with an install.js script at the top and a suffix of '.xpi'), the next step is to add an installation script to the xpi.
Attribute (XUL) - Archive of obsolete content
nt index inputtooltiptext insertafter insertbefore instantapply inverted iscontainer isempty key keycode keytext label lastpage lastselected last-tab left linkedpanel max maxheight maxlength maxpos maxrows maxwidth member menu menuactive min minheight minresultsforpopup minwidth mode modifiers mousethrough movetoclick multiline multiple name negate newlines next noautofocus noautohide noinitialfocus nomatch norestorefocus object observes onbeforeaccept onbookmarkgroup onchange onclick onclosetab oncommand oncommandupdate ondialogaccept ondialogcancel ondialogclosure ondialogextra1 ondialogextra2 ondialoghelp onerror onerrorcommand onextra1 onextra2 oninput onload onnewtab onpageadvanced onpagehide onpagerewound onpageshow ...
... onpaneload onpopuphidden onpopuphiding onpopupshowing onpopupshown onsearchcomplete onselect ontextcommand ontextentered ontextrevert ontextreverted onunload onwizardback onwizardcancel onwizardfinish onwizardnext open ordinal orient pack pageid pageincrement pagestep parent parsetype persist persistence phase pickertooltiptext placeholder popup position predicate preference preference-editable primary priority properties querytype readonly ref rel removeelement resizeafter resizebefore rows screenx screeny searchbutton searchsessions searchlabel selected selectedindex seltype setfocus showcaret showcommentcolumn showpopup size sizemode sizetopopup smoothscroll sort sortactive sortdirection sortresource sortresource2 spellche...
Reading from Files - Archive of obsolete content
next, nsiscriptableio.newinputstream() is called to create a new input stream for reading from the file.
... in this next example, the read32 method is used to read a 32-bit length from the file.
List of commands - Archive of obsolete content
py a selection to the clipboard cmd_cut - cut a selection into the clipboard cmd_paste - paste a selection from the clipboard cmd_selectall cmd_selectnone cmd_copylink cmd_copyimagelocation cmd_copyimagecontents cmd_scrolltop cmd_scrollbottom cmd_scrollpageup cmd_scrollpagedown cmd_scrolllineup cmd_scrolllinedown cmd_scrollleft cmd_scrollright cmd_selectcharprevious cmd_selectcharnext cmd_wordprevious cmd_wordnext cmd_selectwordprevious cmd_selectwordnext cmd_beginline cmd_endline cmd_selectbeginline cmd_selectendline cmd_selectlineprevious cmd_selectlinenext cmd_selectpageprevious cmd_selectpagenext cmd_selectmovetop cmd_selectmovebottom editor commands (legal when the focus is anywhere where you can type text): cmd_paste - paste a selection from the clipbo...
...ard cmd_pastequote cmd_delete cmd_deletecharbackward cmd_deletecharforward cmd_deletewordbackward cmd_deletewordforward cmd_deletetobeginningofline cmd_deletetoendofline cmd_scrolltop cmd_scrollbottom cmd_movetop cmd_movebottom cmd_selecttop cmd_selectbottom cmd_linenext cmd_lineprevious cmd_selectlinenext cmd_selectlineprevious cmd_charprevious cmd_charnext cmd_selectcharprevious cmd_selectcharnext cmd_beginline cmd_endline cmd_selectbeginline cmd_selectendline cmd_wordprevious cmd_wordnext cmd_selectwordprevious cmd_selectwordnext cmd_scrollpageup cmd_scrollpagedown cmd_scrolllineup cmd_scrolllinedown cmd_movepageup cmd_movepagedown cmd_selectpageup cmd_selectpagedown other commands the following list other commands (prefixed by cmd_ or browser:) whic...
onFindAgainCommand - Archive of obsolete content
« xul reference home onfindagaincommand( findprevious ) return type: no return value call this method to handle your application's "find next" and "find previous" commands.
... you should specify true as the input parameter to perform a "find previous" operation, or false to perform a "find next." example typically, you'll simply bind this method to your "find next" and "find previous" commands, like this: <command name="cmd_find_previous" oncommand="gfindbar.onfindagaincommand(true);"/> <command name="cmd_find_next" oncommand="gfindbar.onfindagaincommand(false);"/> ...
PopupEvents - Archive of obsolete content
next, the popupshown event listener is removed again.
...this process will then repeat for the next highest level of menu until all the menus are closed.
Property - Archive of obsolete content
ed is24hourclock ispm issearching iswaiting itemcount label labelelement lastpermanentchild lastselected left linkedpanel listboxobject locked markupdocumentviewer max maxheight maxlength maxrows maxwidth menu menuboxobject menupopup min minheight minresultsforpopup minwidth minute minuteleadingzero mode month monthleadingzero name next nomatch notificationshidden object observes onfirstpage onlastpage open ordinal orient pack pagecount pageid pageincrement pageindex pagestep parentcontainer palette persist persistence placeholder pmindicator popup popupboxobject popupopen position predicate preferenceelements preferencepanes preferences priority radiogroup readonl...
...: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.firstelementchild dom:element.lastchild dom:element.lastelementchild dom:element.localname dom:element.namespaceuri dom:element.nextelementsibling dom:element.nextsibling dom:element.nodename dom:element.nodetype dom:element.nodevalue dom:element.ownerdocument dom:element.parentnode dom:element.prefix dom:element.previouselementsibling dom:element.previoussibling dom:element.scrollheight dom:element.scrollleft dom:element.scrolltop dom:element.scrollwidth dom:element.tagname dom:element.textconten...
Additional Navigation - Archive of obsolete content
« previousnext » retrieving literals the triples used so far have all had variables in both the subject and object.
... « previousnext » ...
Additional Template Attributes - Archive of obsolete content
« previousnext » referencing templates all the templates used so far have had the template placed inside the root element with the datasources attribute.
... « previousnext » ...
Bindings - Archive of obsolete content
« previousnext » we can add more triples to the previous example to show more information.
... « previousnext » ...
Building Menus With Templates - Archive of obsolete content
« previousnext » menus may be generated using a template in the same manner as other elements.
...tp://www.xulplanet.com/rdf/garden/18" label="18"/> </menupopup> </menu> <menu uri="http://www.xulplanet.com/rdf/garden" label="garden avenue"> <menupopup> <menuitem uri="http://www.xulplanet.com/rdf/garden/25" label="25"/> <menuitem uri="http://www.xulplanet.com/rdf/garden/37" label="37"/> </menupopup> </menu> </menupopup> </button> « previousnext » ...
Building Trees - Archive of obsolete content
« previousnext » the most common element to use with a template is the tree.
... « previousnext » ...
Introduction - Archive of obsolete content
next » a xul template is a means of producing a block of content for each result from some query or query-like operation.
... next » ...
Multiple Queries - Archive of obsolete content
« previousnext » so far, every template has contained only a single query, even for recursive content.
... « previousnext » ...
Multiple Rules - Archive of obsolete content
« previousnext » all of the examples shown so far have used only a single rule.
... « previousnext » ...
Rule Compilation - Archive of obsolete content
« previousnext » query a xul template is made up of a query and a series of rules.
... « previousnext » ...
SQLite Templates - Archive of obsolete content
« previousnext » templates may use a datasource that is retrieved from an sqlite database, such as those used by the mozstorage api.
... « previousnext » ...
Simple Query Syntax - Archive of obsolete content
« previousnext » when iterating over the children of an rdf container, there is a simpler query syntax which may used.
... « previousnext » ...
Sorting Results - Archive of obsolete content
« previousnext » when results are generated from a query, content is generated in the same order as the results.
... « previousnext » ...
Template Builder Interface - Archive of obsolete content
« previousnext » when inserting an element into a xul document, the element is checked to see if it has a datasources attribute.
... « previousnext » ...
Template and Tree Listeners - Archive of obsolete content
« previousnext » there are several listeners (or observers) used during the template build process, each used for different purposes.
... « previousnext » ...
Using Multiple Queries to Generate More Results - Archive of obsolete content
« previousnext » combining results together one interesting technique is to use several queries to combine two sets of unrelated data together.
...ox datasources="people.xml" ref="*" querytype="xml"> <template> <queryset> <query expr="group[@name='male']/*"/> <action> <checkbox uri="?" label="?name"/> </action> </queryset> <queryset> <query expr="group[@name='female']/*"/> <action> <label uri="?" value="?name"/> </action> </queryset> </template> </vbox> « previousnext » ...
XML Assignments - Archive of obsolete content
« previousnext » sometimes, you will want to use a more complex substitution apart from just taking an attribute from the xml.
... « previousnext » ...
XML Templates - Archive of obsolete content
« previousnext » mozilla also supports the use of xml datasources.
... « previousnext » ...
textbox (Toolkit autocomplete) - Archive of obsolete content
if false, the default, the tab key moves the focus to the next element.
...in addition, arrow buttons appear next to the textbox to let the user step through values.
Custom toolbar button - Archive of obsolete content
the next section in this tutorial contains examples of code that you can use to make your button do something useful.
...the application deletes the directory the next time it starts.
Introduction - Archive of obsolete content
next » this tutorial is a guide to learning xul (xml user interface language) which is a cross-platform language for describing applications' user interfaces.
... next » ...
Numeric Controls - Archive of obsolete content
« previousnext » xul has two elements used for the entry of numeric values or ranges, and well as two elements for entering dates and times.
...<datepicker type="popup"/> « previousnext » ...
Skinning XUL Files by Hand - Archive of obsolete content
in the next few sections, you will be importing this style information into a custom stylesheet and extending it with new style rules for your xul.
...similarly, the next item uses the id selector to apply style information to a single xul element.
The Implementation of the Application Object Model - Archive of obsolete content
what content developers want from the next release of mozilla is a standards-compliant browser.
...of course you could always say that toolbars and dialogs just wouldn't be able to have backgrounds with different colors, but that leads into the next point.
prefwindow - Archive of obsolete content
it will be opened by default the next time the preferences dialog is opened.
...it will be opened by default the next time the preferences dialog is opened.
tabbrowser - Archive of obsolete content
it also adds the relatedtocurrent parameter; firefox uses this to decide whether the new tab should be inserted next to the current tab.
... goforwardgroup() not in firefox return type: no return value go forward to the next group of tabs.
textbox - Archive of obsolete content
hidespinbuttons type: boolean if true, the number box does not have arrow buttons next to it to allow the user to adjust the value.
...in addition, arrow buttons appear next to the textbox to let the user step through values.
Debugging a XULRunner Application - Archive of obsolete content
with the red stop icon next to it).
... jsdump(str) (function defined below) will output str as a "message" with a speech bubble icon next to it: function jsdump(str) { components.classes['@mozilla.org/consoleservice;1'] .getservice(components.interfaces.nsiconsoleservice) .logstringmessage(str); } for more information about the error console see the error console and browser console article.
How to enable locale switching in a XULRunner application - Archive of obsolete content
include a xul control for the locale selection the next step is to add a xul control to your application which lists the available locales in the package and makes it possible for the user to select one of them.
...reg.getlocalesforpackage("localeswitchdemo"); // render locale menulist by iterating through the query result from getlocalesforpackage() const xul_ns = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"; var localelistbox = document.getelementbyid("locale-listbox"); var selecteditem = null; while(availablelocales.hasmore()) { var locale = availablelocales.getnext(); var listitem = document.createelementns(xul_ns, "listitem"); listitem.setattribute("value", locale); listitem.setattribute("label", locale); if (locale == selectedlocale) { // is this the current locale?
2006-10-20 - Archive of obsolete content
how to create firefox extension (chrome) to add images next to urls ?
... question regarding how to make a firefox extension that would insert an image next to all links in the loaded web pages similar to the mcafee siteadvisor extension.
NPByteRange - Archive of obsolete content
syntax typedef struct _npbyterange { int32 offset; /* negative offset = from the end */ uint32 length; struct _npbyterange* next; } npbyterange; fields the data structure has the following fields: offset offset in bytes to the start of the requested range.
... next points to the next npbyterange request in the list of requests, or null if this is the last request.
Introduction to SSL - Archive of obsolete content
rc4 with 128-bit encryption and md5 message authentication because the rc4 and rc2 ciphers have 128-bit encryption, they are the second strongest next to triple des (data encryption standard), with 168-bit encryption.
... rc2 with 128-bit encryption and md5 message authentication because the rc4 and rc2 ciphers have 128-bit encryption, they are the second strongest next to triple des (data encryption standard), with 168-bit encryption.
Sunbird Theme Tutorial - Archive of obsolete content
change the next six lines to describe your theme.
...work with a recent test build so that your theme will be compatible with the next release.
Building a Theme - Archive of obsolete content
next, the contents of the following directories to their respective folders into the folder.
... chrome uris next, we have to tell firefox where to find the theme files for your theme.
Accessing XML children - Archive of obsolete content
« previousnext » accessing xml children warning: e4x is deprecated.
... var element = <foo bar="1"/> element.@bar = 2; which gives <foo bar="2"/> « previousnext » ...
Descendants and Filters - Archive of obsolete content
« previousnext » accessing descendants in many cases, the node that you're interested in is not the direct child of the top xml element.
... « previousnext » ...
Introduction - Archive of obsolete content
« previousnext » basic syntax with e4x enabled, basic xml elements are valid syntax for variables.
... « previousnext » ...
E4X Tutorial - Archive of obsolete content
next » warning: e4x is deprecated.
... subjects introduction accessing xml children descendants and filters namespaces the global xml object see also e4x processing xml with e4x next » ...
ECMAScript 2015 support in Mozilla - Archive of obsolete content
code-named "es.next", "harmony", or "ecmascript 6", the first working draft (based on ecmascript 5.1) was published on july 12, 2011 as "es.next".
...n calls (firefox 27) use symbol.iterator property (firefox 36) const (js 1.5, firefox 1.0) (es2015 compliance bug 950547 implemented in firefox 51) let (js 1.7, firefox 2) (es2015 compliance bug 950547 implemented in firefox 51) destructuring assignment (js 1.7, firefox 2) (es2015 compliance bug 1055984) statements for...of (firefox 13) works in terms of .iterator() and .next() (firefox 17) use "@@iterator" property (firefox 27) use symbol.iterator property (firefox 36) functions rest parameters (firefox 15) default parameters (firefox 15) parameters without defaults after default parameters (firefox 26) destructured parameters with default value assignment (firefox 41) arrow functions (firefox 22) generator function (firefox 26) ...
Sharp variables in JavaScript - Archive of obsolete content
var a = #1 = { val:1, next:{val:2, next:#1#} }; a.val; // 1 a.next.val; // 2 a.next.next.val; // 1 a.next.next == a; // true again, you can eliminate the need for sharp variables by using two lines instead of one for the declaration.
... var a = {val:1, next:{val:2, next:undefined} }; a.next.next = a; a.val; // 1 a.next.val; // 2 a.next.next.val; // 1 a.next.next == a; // true multiple sharp variables var a = #1 = { val:#2=[], next:{val:[], next:{val:#02#, next:#1#}} }; // leading 0s don't matter a.val.push(1); a.next.val.push(2); a.val[0]; // 1 a.next.val[0]; // 2 a.next.next.val[0]; // 1 a.next.next.next.val[0]; // 1 a == a.next.next; // false a == a.next.next.next; // true ...
Styling the Amazing Netscape Fish Cam Page - Archive of obsolete content
the layout wasn't bad if the fish weren't laid out next to each other, so i moved on.
... floating fish with the cards set up to float, the next step was to place the images appropriately.
Index - Game development
33 mobile touch controls controls, games, javascript, mobile, pointer, touch that covers adding touch controls for mobile; in the next article we'll see how to add keyboard and mouse support.
... 47 collision detection 2d, beginner, canvas, games, javascript, phaser, tutorial, collision detection now onto the next challenge — the collision detection between the ball and the bricks.
Building up a basic demo with the PlayCanvas engine - Game development
next, we'll set the canvas to fill the window, and automatically change its resolution to be the same as the canvas size.
...next, the camera object is added to the root of our application and positioned to be 7 units away from the center of the scene on the z axis.
Implementing controls using the Gamepad API - Game development
next, we set up two event listeners to get the data: window.addeventlistener("gamepadconnected", gamepadapi.connect); window.addeventlistener("gamepaddisconnected", gamepadapi.disconnect); due to security policy, you have to interact with the controller first while the page is visible for the event to fire.
...next, we loop through the array of pressed buttons — if the given button is the same as the one we're looking for, the newpress variable is set to true.
2D maze game with device orientation - Game development
next we will add the following code to the update() function, so it will be fired on every frame.
... if the current level is lower than 5, all the neccesary variables are reset and the next level is loaded.
Plug-in Development Overview - Gecko Plugin API Reference
« previousnext » writing plug-ins once you decide what you want your plug-in to do, creating it is a simple process.
...consider the following example, where a media player plug-in can be controlled with an advancetonextsong() method called inside the script element: <object id="myplugin" type="audio/wav" data="music.wav"> </object> <script type="application/javascript"> var theplugin = document.getelementbyid('myplugin'); if (theplugin && theplugin.advancetonextsong) theplugin.advancetonextsong(); else alert("plugin not installed correctly"); </script> in the past, liveconnect and late...
Index - MDN Web Docs Glossary: Definitions of Web-related terms
for example, <p> is by default a block-level element, whereas <a> is an inline element — you can put several links next to one another in your html source and they will sit on the same line as one another in the rendered output.
...the value finish at the next crlf or at the end of the message.
Screen reader - MDN Web Docs Glossary: Definitions of Web-related terms
just like keyboard navigation without voiceover, you can navigate through interactive elements using the tab key and the arrow keys: next interactive element: tab previous interactive element: shift + tab next radio button in a same named-group: right or down arrow previous radio button in a same named-group: left or up arrow navigating through the content of a page is done with the tab key and a series of other keys along with control + option keys next heading: control + option + h next list: control + option + x next g...
...raphic: control + option + g next table: control + option + t down an html hierarchical order control + option + right arrow previous heading: shift + control + option + h previous list: shift + control + option + x previous graphic: shift + control + option + g previous table: shift + control + option + t up an html hierarchical order: control + option + left arrow learn more aria ...
Debugging CSS - Learn web development
previous overview: building blocks next sometimes when writing css you will encounter an issue where your css doesn't seem to be doing what you expect.
... previous overview: building blocks next in this module cascade and inheritance css selectors type, class, and id selectors attribute selectors pseudo-classes and pseudo-elements combinators the box model backgrounds and borders handling different text directions overflowing content values and units sizing items in css images, media, and form elements styling tables debugging css organizing your css...
Sizing items in CSS - Learn web development
previous overview: building blocks next in the various lessons so far you have come across a number of ways to size items on a web page using css.
... previous overview: building blocks next in this module cascade and inheritance css selectors type, class, and id selectors attribute selectors pseudo-classes and pseudo-elements combinators the box model backgrounds and borders handling different text directions overflowing content values and units sizing items in css images, media, and form elements styling tables debugging css organizing your css...
Floats - Learn web development
previous overview: css layout next originally for floating images inside blocks of text, the float property became one of the most commonly used tools for creating multiple column layouts on webpages.
... previous overview: css layout next in this module introduction to css layout normal flow flexbox grid floats positioning multiple-column layout responsive design beginner's guide to media queries legacy layout methods supporting older browsers fundamental layout comprehension assessment ...
Grids - Learn web development
previous overview: css layout next css grid layout is a two-dimensional layout system for the web.
... see also css grid guides css grid inspector: examine grid layouts previous overview: css layout next in this module introduction to css layout normal flow flexbox grid floats positioning multiple-column layout responsive design beginner's guide to media queries legacy layout methods supporting older browsers fundamental layout comprehension assessment ...
Normal Flow - Learn web development
previous overview: css layout next this article explains normal flow, or the way that webpage elements lay themselves out if you have not changed their layout.
... previous overview: css layout next in this module introduction to css layout normal flow flexbox grid floats positioning multiple-column layout responsive design beginner's guide to media queries legacy layout methods supporting older browsers fundamental layout comprehension assessment ...
Supporting older browsers - Learn web development
previous overview: css layout next in this module, we recommend using flexbox and grid as the main layout methods for your designs.
... cascading web design with feature queries using feature queries (video) previous overview: css layout next in this module introduction to css layout normal flow flexbox grid floats positioning multiple-column layout responsive design beginner's guide to media queries legacy layout methods supporting older browsers fundamental layout comprehension assessment ...
Using your new knowledge - Learn web development
what's next?
...in the next module, css building blocks, we will go on to look at a number of key areas in depth.
Styling lists - Learn web development
previous overview: styling text next lists behave like any other text for the most part, but there are some css properties specific to lists that you need to know about, and some best practices to consider.
... playable code <div class="body-wrapper" style="font-family: 'open sans light',helvetica,arial,sans-serif;"> <h2>html input</h2> <textarea id="code" class="html-input" style="width: 90%;height: 10em;padding: 10px;border: 1px solid #0095dd;"><ul> <li>first, light the candle.</li> <li>next, open the box.</li> <li>finally, place the three magic items in the box, in this exact order, to complete the spell: <ol> <li>the book of spells</li> <li>the shiny rod</li> <li>the goblin statue</li> </ol> </li> </ul></textarea> <h2>css input</h2> <textarea id="code" class="css-input" style="width: 90%;height: 10em;padding: 10px;border: 1px solid #0095dd;"></tex...
Web fonts - Learn web development
previous overview: styling text next in the first article of the module, we explored the basic css features available for styling fonts and text.
... previous overview: styling text next in this module fundamental text and font styling styling lists styling links web fonts typesetting a community school homepage ...
How does the Internet work? - Learn web development
the next step is to send the messages from our network to the network we want to reach.
... next steps how the web works understanding the difference between a web page, a web site, a web server and a search engine understanding domain names ...
How much does it cost to do something on the Web? - Learn web development
your website is yours, and you can migrate seamlessly from one hosting provider to the next.
... next steps now that you understand what kind of money your website may cost you, it's time to start designing that website and setting up your work environment.
How do I start to design my website? - Learn web development
(should i implement these features, use these services, create these designs?) so now that you have a prioritized list of goals, let's move on to the next question.
...a next step might be to read how the internet works.
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.
... previous overview: forms next in this module your first form how to structure a web form basic native form controls the html5 input types other form controls styling web forms advanced form styling ui pseudo-classes client-side form validation sending form data advanced topics how to build custom form controls sending forms through javascript property compatibility table for form widgets ...
Test your skills: Advanced styling - Learn web development
advanced form styling 2 in our next task we provide you with a set of three radio buttons.
... next, give the radio buttons a reasonable base style — the style they have when the page first loads.
Your first form - Learn web development
overview: forms next the first article in our series provides you with your very first experience of creating a web form, including designing a simple form, implementing it using the right html form controls and other html elements, adding some very simple styling via css, and describing how data is sent to a server.
... overview: forms next in this module your first form how to structure a web form basic native form controls the html5 input types other form controls styling web forms advanced form styling ui pseudo-classes client-side form validation sending form data advanced topics how to build custom form controls sending forms through javascript property compatibility table for form widgets ...
HTML basics - Learn web development
previous overview: getting started with the web next html (hypertext markup language) is the code that is used to structure a web page and its content.
... previous overview: getting started with the web next in this module installing basic software what will your website look like?
Installing basic software - Learn web development
overview: getting started with the web next in installing basic software, we show you what tools you need to do simple web development and how to install them properly.
... overview: getting started with the web next in this module installing basic software what will your website look like?
The web and web standards - Learn web development
in the next few years that followed, the web exploded, with multiple browsers being released, thousands of web servers being set up, and millions of web pages being created.
...recent published figures say that there are currently around 19 million web developers in the world, and that figure is set more than double in the next decade.
Marking up a letter - Learn web development
previous overview: introduction to html next we all learn to write a letter sooner or later; it is also a useful example to test our text formatting skills.
... previous overview: introduction to html next in this module getting started with html what’s in the head?
Test your skills: Loops - Learn web development
loops 2 in this next task, we want you to write a simple program that, given a name, searches an array of objects containing names and phone numbers (phonebook) and, if it finds the name, outputs the name and phone number into the paragraph (para) and then exits the loop before it has run its course.
...for each number that isn't a prime number, continue on to the next loop iteration.
What went wrong? Troubleshooting JavaScript - Learn web development
previous overview: first steps next when you built up the "guess the number" game in the previous article, you may have found that it didn't work.
... math.random() next, we pass the result of invoking math.random() through math.floor(), which rounds the number passed to it down to the nearest whole number.
Inheritance in JavaScript - Learn web development
previous overview: objects next with most of the gory details of oojs now explained, this article shows how to create "child" object classes (constructors) that inherit features from their "parent" classes.
... in the next article we'll have a look at how to work with javascript object notation (json), a common data exchange format written using javascript objects.
CSS performance optimization - Learn web development
previous overview: performance next painting an unstyled page, and then repainting it once styles are parsed would be bad user experience.
... conclusion previous overview: performance next in this module the "why" of web performance what is web performance?
HTML performance features - Learn web development
previous overview: performance next html is by default fast and accessible.
... elements & attributes impacting performance the <picture> element the <video> element the <source> element the <img> srcset attribute responsive images preloading content with rel="preload" - (https://w3c.github.io/preload/ ) async / defer attributes <iframe> <object> <script> rel attribute conclusion previous overview: performance next in this module the "why" of web performance what is web performance?
Perceived performance - Learn web development
previous overview: performance next perceived performance is how fast a website seems to the user.
... previous overview: performance next in this module the "why" of web performance what is web performance?
Multimedia: video - Learn web development
previous overview: performance next as we learned in the previous section, media, namely images and video, account for over 70% of the bytes downloaded for the average website.
... previous overview: performance next in this module the "why" of web performance what is web performance?
The "why" of web performance - Learn web development
overview: performance next web performance is all about making websites fast, including making slow processes seem fast.
... overview: performance next in this module the "why" of web performance what is web performance?
Introduction to the server side - Learn web development
overview: first steps next welcome to the mdn beginner's server-side programming course!
... overview: first steps next in this module introduction to the server side client-server overview server-side web frameworks website security ...
Cross browser testing - Learn web development
guides introduction to cross browser testing this article starts the module off by providing an overview of the topic of cross browser testing, answering questions such as "what is cross browser testing?", "what are the most common types of problems you'll encounter?", and "what are the main approaches for testing, identifying, and fixing problems?" strategies for carrying out testing next, we drill down into carrying out testing, looking at identifying a target audience (e.g.
... handling common accessibility problems next we turn our attention to accessibility, providing information on common problems, how to do simple testing, and how to make use of auditing/automation tools for finding accessibility issues.
Accessible Toolkit Checklist
accnavigate: navigate to the first/last child, previous/next sibling, up, down, left or right from this iaccessible.
... key activates link (thus default button no longer shows dark border when link is focused) msaa support, including linked and traversed states, and accessible value that holds destination url text fields - single and multiple line it's probably best to use native widgets for these, otherwise accessibility support will be quite difficult tab should always focus the next item, not insert a tab, unless there's a really good reason and another way to navigate always use system selection color, otherwise screen reader won't read the text make sure the caret is never blinking when focus is not in text field handle standard editing keys, such as arrow keys, home, end, pageup, pagedown, ctrl+left/right, shifted keys for selection, delete, ctrl+delete,...
Theme concepts
practically, this means you would need to allow for a width of up to 5120 pixels wide (for the next generation of 5k monitors).
...next, you build a json object containing the same information you would use in a static theme’s manifest.json, finally, pass the json object in a theme.update() call.
Adding a new CSS property
again, see the documentation at the top of the file and the other entries for examples, and also see the next section for details about parsing.
... if you're adding a preference-controlled property to a non-preference-controlled shorthand, you need to call appendvalue for that property if and only if its preference is enabled (and see next point) if you need to check a preference in custom parsing code (e.g., because you're adding a new property to a shorthand, but only conditionally on that property's preference), call nscssprops::isenabled(), which is faster than calling into the preferences code for further understanding of how the parsing code works, you should read and understand the code in nscssparser.cpp.
Capturing a minidump
next, open the "file" menu and choose "open executable...".
... next, open the "file" menu and choose "attach to a process...".
How Mozilla's build system works
it then moves on to the next tier and continues until no tiers remain.
...a backslash as the last character on a line allows the variable definition to be continued on the next line.
Eclipse CDT Manual Setup
conversely, note this very carefully: if you configure eclipse to invoke a build process that is parallelized, silenced, or that fails to identify the directory that the compiler is being run from, then it will mess up the compiler options that eclipse associates with your files, and that in turn will significantly degrade the quality of the code assistance that eclipse will provide after it next re-indexes the code.
...(just-print-mozilla-build.py is a fast script that we'll download in the next section.) (append '--objdir /path/to/objdir' if your objdir lives outside your tree) set the build directory to "${projdirpath}/path/of/your/objdir/relative/to/the/root/of/your/source".
HTMLIFrameElement.clearMatch()
the clearmatch() method of the htmliframeelement clears any content highlighted by findall() or findnext().
... searchtoggle.addeventlistener('touchend',function() { if(search.getattribute('class') === 'search') { search.setattribute('class', 'search shifted'); } else if(search.getattribute('class') === 'search shifted') { search.setattribute('class', 'search'); if(searchactive) { browser.clearmatch(); searchactive = false; prev.disabled = true; next.disabled = true; searchbar.value = ''; } } }); specification not part of any specification.
MozBeforePaint
once you've called this, the mozbeforepaint event will be fired one time, when it's time for animations to be updated for the window's next animation frame.
...this computes the current position for the animating box and updates the box's position on screen, and, if the animation sequence is not yet complete, calls window.requestanimationframe() to schedule the next animation frame to be drawn.
Internationalized Domain Names (IDN) Support in Mozilla Browsers
ascii-compatible encoding (ace) the next step is to convert the 8-bit characters in unicode to 7-bit ones using only restricted ascii characters.
... next create another new preference item using the right-mouse click menu new > boolean.
Addon
pendingupgrade read only addon if this add-on will be replaced on the next restart, this property will hold the new addon object.
...if possible the uninstall will happen immediately, otherwise it will wait until the next application restart.
Sqlite.jsm
the next time this same sql statement is executed (the sql argument is identical to one passed in before), the old statement object is reused.
... conn.executetransaction(async function complextransaction() { await conn.execute("insert into mytable values (?, ?)", ["foo", "bar"]); let data = await conn.execute("select * from mytable"); if (data.length < 5) { throw new error("we don't have the expected 5 rows to perform the next operation!"); } // ...
L10n testing with xcode
next, you need to configure the ios app simulator to run the app in your locale.
...to perform the next steps, you'll need to be familiar with how user gestures and hardware interactions work in the simulator.
Localizing with Mozilla Translator
if you are a ''not so good'' mt user, however, you can just create a new product (or several ones; see next recipe to know why), run file -> update on them (you'll get a list of all the strings) and then run edit -> autotranslate.
...;-) enough chatting, what's next?
MathML In Action
next to it is this tiny formula, det | a c b d | = a d - b c , which can also be typeset in displaystyle as det | a b c d | = a d - b c .
...now, what next?
Power profiling overview
power estimates the next best measurements come from recent (sandy bridge and later) intel processors that implement the rapl (running average power limit) interface that provides msrs containing energy consumption estimates for up to four power planes or domains of a machine, as seen in the diagram above.
... proxy measurements the next best measurements are proxy measurements, i.e.
TimerFirings logging
the next value is the process id (pid).
... next is the timer kind, one of fn (function), iface (interface) or obs (observer), which are the three kinds of timers that gecko supports.
nglayout.debug.disable_xul_cache
the xul cache is serialized and saved between mozilla sessions in the xul fastload file, which saves a “compiled” version of the xul and javascript in a document to disk for faster startup the next time the application runs.
... during development of xul applications, it’s convenient to disable the xul cache so that changes you make to files on disk take effect the next time the window or dialog is loaded (instead of the next time mozilla starts).
Patches and pushes
from the dropdown menu next to the review flag.
... update your sign-offs on the l10n dashboard to include the change into the next release.
Research and prep
global search the second position can be used for the next best local language provider, meaning coverage within the local language and/or locale (indexing a smaller portion of the www but producing better local language results).
... next » ...
L20n Javascript API
context.translationerror, when the translation is present but broken in one of supported locales; the context instance will try to retrieve a fallback translation from the next locale in the fallback chain, parser.error, when l20n is unable to parse the syntax of a resource; this might result in entities being broken which in turn can lead to above error being emitted.
...a 404 error when fetching a resource file, or recursive import statements in resource files), context.translationerror, when there is a missing translation in one of supported locales; the context instance will try to retrieve a fallback translation from the next locale in the fallback chain, compiler.error, when l20n is unable to evaluate an entity to a string; there are two types of errors in this category: compiler.valueerror, when l20n can still try to use the literal source string of the entity as fallback, and compiler.indexerror otherwise.
PR_SetErrorText
description the text is copied into the thread structure and remains there until the next call to pr_seterror.
...the new value is copied into storage allocated and owned by nspr and remains there until the next call to pr_seterror or another call to pr_seterrortext.
Certificate functions
later cert_encodepolicyconstraintsextension mxr 3.12 and later cert_encodepolicymappingextension mxr 3.12 and later cert_encodesubjectkeyid mxr 3.12 and later cert_encodeusernotice mxr 3.12 and later cert_extractpublickey mxr 3.2 and later cert_findcertbyname mxr 3.2 and later cert_findcrlentryreasonexten mxr 3.12 and later cert_findcrlnumberexten mxr 3.12 and later cert_findnameconstraintsexten mxr 3.12 and later cert_filtercertlistbycanames mxr 3.4 and later cert_filtercertlistbyusage mxr 3.4 and later cert_filtercertlistforusercerts mxr 3.6 and later cert_findcertbydercert mxr 3.2 and later ...
...cert_getcommonname mxr 3.2 and later cert_getcountryname mxr 3.2 and later cert_getdbcontentversion mxr 3.2 and later cert_getdefaultcertdb mxr 3.2 and later cert_getdomaincomponentname mxr 3.2 and later cert_getfirstemailaddress mxr 3.7 and later cert_getlocalityname mxr 3.2 and later cert_getnextemailaddress mxr 3.7 and later cert_getnextgeneralname mxr 3.10 and later cert_getnextnameconstraint mxr 3.10 and later cert_getocspresponsestatus mxr 3.6 and later cert_getocspstatusforcertid mxr 3.6 and later cert_getoidstring mxr 3.9 and later cert_getorgname mxr 3.2 and later cert_getorguni...
Encrypt Decrypt MAC Keys As Session Objects
text[ptextlen+j] = (unsigned char)paddinglength; } ptextlen = blocksize; } rv = encrypt(ctxenc, encbuf, &encbuflen, sizeof(encbuf), ptext, ptextlen); if (rv != secsuccess) { pr_fprintf(pr_stderr, "encrypt failure\n"); goto cleanup; } /* save the last block of ciphertext as the next iv */ iv = encbuf; ivlen = encbuflen; /* write the cipher text to intermediate file */ nwritten = pr_write(encfile, encbuf, encbuflen); /*pr_assert(nwritten == encbuflen);*/ rv = macupdate(ctxmac, ptext, ptextlen); } rv = macfinal(ctxmac, mac, &maclen, digestsize); if (rv != secsuccess) { pr_fprintf(pr_stderr, "macfinal failur...
...progname + 1 : argv[0]; /* parse command line arguments */ optstate = pl_createoptstate(argc, argv, "c:d:i:o:f:p:z:a"); while ((status = pl_getnextopt(optstate)) == pl_opt_ok) { switch (optstate->option) { case 'a': ascii = pr_true; break; case 'c': command = strdup(optstate->value); break; case 'd': dbdir = strdup(optstate->value); break; case 'f': pwdata.source = pw_fromfile; pwdata.data = strdup(optstate-...
Encrypt and decrypt MAC using token
text[ptextlen+j] = (unsigned char)paddinglength; } ptextlen = blocksize; } rv = encrypt(ctxenc, encbuf, &encbuflen, sizeof(encbuf), ptext, ptextlen); if (rv != secsuccess) { pr_fprintf(pr_stderr, "encrypt failure\n"); goto cleanup; } /* save the last block of ciphertext as the next iv */ iv = encbuf; ivlen = encbuflen; /* write the cipher text to intermediate file */ nwritten = pr_write(encfile, encbuf, encbuflen); /*pr_assert(nwritten == encbuflen);*/ rv = macupdate(ctxmac, ptext, ptextlen); } rv = macfinal(ctxmac, mac, &maclen, digestsize); if (rv != secsuccess) { pr_fprintf(pr_stderr, "macfinal failur...
...progname + 1 : argv[0]; /* parse command line arguments */ optstate = pl_createoptstate(argc, argv, "c:d:i:o:f:p:z:a"); while ((status = pl_getnextopt(optstate)) == pl_opt_ok) { switch (optstate->option) { case 'a': ascii = pr_true; break; case 'c': command = strdup(optstate->value); break; case 'd': dbdir = strdup(optstate->value); break; case 'f': pwdata.source = pw_fromfile; pwdata.data = strdup(optstate-...
Index
crl generation script syntax crl generation script file has the following syntax: * line with comments should have # as a first symbol of a line * set "this update" or "next update" crl fields: update=yyyymmddhhmmssz nextupdate=yyyymmddhhmmssz field "next update" is optional.
...if the cryptographic module does not support the requested algorithm, then the next best fit will be selected (usually the default).
NSS_3.12_release_notes.html
hecknamespace (see cert.h) cert_encodecertpoliciesextension (see cert.h) cert_encodeinfoaccessextension (see cert.h) cert_encodeinhibitanyextension (see cert.h) cert_encodenoticereference (see cert.h) cert_encodepolicyconstraintsextension (see cert.h) cert_encodepolicymappingextension (see cert.h) cert_encodesubjectkeyid (see certdb/cert.h) cert_encodeusernotice (see cert.h) cert_findcrlentryreasonexten (see cert.h) cert_findcrlnumberexten (see cert.h) cert_findnameconstraintsexten (see cert.h) cert_getclassicocspdisabledpolicy (see cert.h) cert_getclassicocspenabledhardfailurepolicy (see cert.h) cert_getclassicocspenabledsoftfailurepolicy (see cert.h) cert_getpkixverifynistrevocationpolicy (see cert.h) cert_getusepkixforvalidation (see cert.h) cert_getvaliddnspatternsfromcert (see cert.h) cer...
...ain needs option to verify for specific date bug 387621: certutil's random noise generator isn't very efficient bug 390185: signtool error message wrongly uses the term database bug 391651: need config.mk file for windows vista bug 396322: fix secutil's code and nss tools that print public keys bug 417641: miscellaneous minor nss bugs bug 334914: hopefully useless null check of out it in jar_find_next bug 95323: ckfw should support cipher operations.
NSS 3.16.2 release notes
new macros in sslerr.h ssl_error_next_protocol_no_callback - an ssl error code that means the next protcol negotiation extension was enabled, but the callback was cleared prior to being needed.
... ssl_error_next_protocol_no_protocol - an ssl error code that means the server supports no protocols that the client advertises in the alpn extension.
Enc Dec MAC Output Public Key as CSR
text[ptextlen+j] = (unsigned char)paddinglength; } ptextlen = blocksize; } rv = encrypt(ctxenc, encbuf, &encbuflen, sizeof(encbuf), ptext, ptextlen); if (rv != secsuccess) { pr_fprintf(pr_stderr, "encrypt failure\n"); goto cleanup; } /* save the last block of ciphertext as the next iv */ iv = encbuf; ivlen = encbuflen; /* write the cipher text to intermediate file */ nwritten = pr_write(encfile, encbuf, encbuflen); /*pr_assert(nwritten == encbuflen);*/ rv = macupdate(ctxmac, ptext, ptextlen); if (rv != secsuccess) goto cleanup; } rv = macfinal(ctxmac, mac, &maclen, digestsize); if (rv != secs...
...progname + 1 : argv[0]; /* parse command line arguments */ optstate = pl_createoptstate(argc, argv, "c:d:i:o:f:p:z:a:s:r:"); while ((status = pl_getnextopt(optstate)) == pl_opt_ok) { switch (optstate->option) { case 'a': ascii = pr_true; break; case 'c': cmd = option2command(optstate->value); break; case 'd': dbdir = strdup(optstate->value); break; case 'f': pwdata.source = pw_fromfile; pwdata.data = strdup(optst...
Encrypt Decrypt_MAC_Using Token
text[ptextlen+j] = (unsigned char)paddinglength; } ptextlen = blocksize; } rv = encrypt(ctxenc, encbuf, &encbuflen, sizeof(encbuf), ptext, ptextlen); if (rv != secsuccess) { pr_fprintf(pr_stderr, "encrypt failure\n"); goto cleanup; } /* save the last block of ciphertext as the next iv.
...progname + 1 : argv[0]; /* parse command line arguments */ optstate = pl_createoptstate(argc, argv, "c:d:i:o:f:p:z:a"); while ((status = pl_getnextopt(optstate)) == pl_opt_ok) { switch (optstate->option) { case 'a': ascii = pr_true; break; case 'c': command = strdup(optstate->value); break; case 'd': dbdir = strdup(optstate->value); break; case 'f': pwdata.source = pw_fromfile; pwdata.data = strdup(optstate-...
NSS Sample Code Sample1
// bug: xxxxx list = pk11_listprivkeysinslot(slot, mservername, 0); cout << "getprivatekey: list = " << list << endl; if (!list) { rv = 1; goto done; } for(n = privkey_list_head(list); !privkey_list_end(n, list); n = privkey_list_next(n)) { nickname = pk11_getprivatekeynickname(n->key); if (pl_strcmp(nickname, mservername) == 0) break; } if (privkey_list_end(n, list)) { rv = 1; goto done; } *prvkey = seckey_copyprivatekey(n->key); done: if (list) seckey_destroyprivatekeylist(list); return rv; } int server::getpublickey(seckeypublickey **pubkey) { int rv; seckeyprivatekey *prvkey = 0; rv = getpriv...
...ational { pk11slotinfo *slot = 0; seckeyprivatekeylist *list = 0; seckeyprivatekeylistnode *n; slot = pk11_getinternalkeyslot(); if (!slot) goto list_done; cout << "list private keys" << endl; list = pk11_listprivkeysinslot(slot, 0, 0); if (!list) goto list_done; for(n = privkey_list_head(list); !privkey_list_end(n, list); n = privkey_list_next(n)) { char *name; name = pk11_getprivatekeynickname(n->key); cout << "key: " << name << endl; } list_done: if (slot) pk11_freeslot(slot); if (list) seckey_destroyprivatekeylist(list); cout << "done" << endl; } // let's see if the keys are the same rv = server1->comparekeys(server2); if (rv) { cout << "key comparison failed" << endl; } server1-...
NSS Sample Code Sample_3_Basic Encryption and MACing
text[ptextlen+j] = (unsigned char)paddinglength; } ptextlen = blocksize; } rv = encrypt(ctxenc, encbuf, &encbuflen, sizeof(encbuf), ptext, ptextlen); if (rv != secsuccess) { pr_fprintf(pr_stderr, "encrypt failure\n"); goto cleanup; } /* save the last block of ciphertext as the next iv */ iv = encbuf; ivlen = encbuflen; /* write the cipher text to intermediate file */ nwritten = pr_write(encfile, encbuf, encbuflen); /*pr_assert(nwritten == encbuflen);*/ rv = macupdate(ctxmac, ptext, ptextlen); } rv = macfinal(ctxmac, mac, &maclen, digestsize); if (rv != secsuccess) { pr_fprintf(pr_stderr, "macfinal failur...
...progname + 1 : argv[0]; /* parse command line arguments */ optstate = pl_createoptstate(argc, argv, "c:d:i:o:f:p:z:a"); while ((status = pl_getnextopt(optstate)) == pl_opt_ok) { switch (optstate->option) { case 'a': ascii = pr_true; break; case 'c': command = strdup(optstate->value); break; case 'd': dbdir = strdup(optstate->value); break; case 'f': pwdata.source = pw_fromfile; pwdata.data = strdup(optstate-...
EncDecMAC using token object - sample 3
ly created iv */ if (ptextlen != blocksize) { paddinglength = blocksize - ptextlen; for ( j=0; j < paddinglength; j++) { ptext[ptextlen+j] = (unsigned char)paddinglength; } ptextlen = blocksize; } rv = encrypt(ctxenc, encbuf, &encbuflen, sizeof(encbuf), ptext, ptextlen); if (rv != secsuccess) { pr_fprintf(pr_stderr, "encrypt failure\n"); goto cleanup; } /* save the last block of ciphertext as the next iv */ iv = encbuf; ivlen = encbuflen; /* write the cipher text to intermediate file */ nwritten = pr_write(encfile, encbuf, encbuflen); /*pr_assert(nwritten == encbuflen);*/ rv = macupdate(ctxmac, ptext, ptextlen); } rv = macfinal(ctxmac, mac, &maclen, digestsize); if (rv != secsuccess) { pr_fprintf(pr_stderr, "macfinal failure\n"); goto cleanup; } if (maclen == 0) { pr_fprintf(pr_stderr, "bad ma...
...progname + 1 : argv[0]; /* parse command line arguments */ optstate = pl_createoptstate(argc, argv, "c:d:i:o:f:p:z:a"); while ((status = pl_getnextopt(optstate)) == pl_opt_ok) { switch (optstate->option) { case 'a': ascii = pr_true; break; case 'c': command = strdup(optstate->value); break; case 'd': dbdir = strdup(optstate->value); break; case 'f': pwdata.source = pw_fromfile; pwdata.data = strdup(optstate->value); break; case 'p': pwdata.source = pw_plaintext; pwdata.data = strdup(optstate->value); break; case 'i': infilename = strdup(opts...
NSS sources building testing
hg clone https://hg.mozilla.org/projects/nspr hg clone https://hg.mozilla.org/projects/nss after the above commands complete, you should have two local directories, named nspr and nss, next to each other.
...the results directory ends up next to the nss directory, not within it).
FC_DigestUpdate
name fc_digestupdate - process the next block of a multi-part digest operation.
...ppart [in] pointer to the next block of data to be digested.
FC_SignUpdate
name fc_signupdate - process the next block of a multi-part signing operation.
...ppart [in] pointer to the next block of the data to be signed.
FC_VerifyUpdate
name fc_verifyupdate - process the next block of a multi-part verify operation.
...ppart [in] pointer to the next block of the data to be verified.
sslfnc.html
pr_true means the socket will attempt to handshake as a server the next time it tries, and pr_false means the socket will attempt to handshake as a client the next time it tries.
... description calling ssl_resethandshake causes the ssl handshake protocol to start from the beginning on the next i/o operation.
Invariants
but note that a stack frame is not necessarily newer than the next stack frame down, thanks to generators!) an object's scope chain (found by chasing jsobject::fslots[jsslot_parent]) never forms a cycle.
... if an object is inextensible, its dslots will never again change.
Property cache
furthermore, the .vword field describes the property in detail, as described in the next section.
...a cache hit of this type saves a property lookup, but the interpreter still has to examine vword.toshape() to determine what to do next.
JSAPI User Guide
the next section explains how to set them up, using jsapi functions.
...otherwise, the gc will free the memory occupied by those values, leading to a probable crash the next time your program tries to use them.
JS::AutoVectorRooter
const t *end() const returns a pointer to the element next to the last element.
... t *end() returns a pointer to the element next to the last element.
JSNewEnumerateOp
jsenumerate_next a previously allocated opaque iterator state is passed in via statep.
... return the next jsid in the iteration using *idp.
JS_ContextIterator
each call to js_contextiterator returns the next context in the cycle.
...otherwise *iterp must point to an existing context in rt, and js_contextiterator modifies it to point to the next context in the list, if any, and null otherwise.
JS_MapGCRoots
syntax uint32 js_mapgcroots(jsruntime *rt, jsgcrootmapfun map, void *data); callback syntax #define js_map_gcroot_next 0 /* continue mapping entries */ #define js_map_gcroot_stop 1 /* stop mapping entries */ #define js_map_gcroot_remove 2 /* remove and free the current entry */ typedef int (*jsgcrootmapfun)(void *rp, const char *name, void *data); description call js_mapgcroots to map the gc's roots table using map(rp, name, data).
...to continue mapping, return js_map_gcroot_next.
JS_NewPropertyIterator
crate an iterator object for use with js_nextproperty.
...note also that while for..in includes properties inherited from prototypes, iterator objects do not.) on success, this returns an iterator object that can be passed to js_nextproperty to fetch the property ids.
JS_ThrowStopIteration
in for…in and for each…in loops, the javascript engine can create an iterator object and call its .next method repeatedly, as described in new in javascript 1.7: iterators.
... the .next method may throw stopiteration when there are no more values left to iterate.
jsid
a few jsapi functions use jsids instead of js::values for property names: js_nextproperty, js_enumerate, and all functions with names ending in byid.
...a void jsid is not a valid id and only arises as an exceptional api return value, such as in js_nextproperty.
Redis Tips
the redis command watch lets you name keys you're worried about; it causes your next transaction to be immediately aborted if any of the watched keys has been modified by anyone else.
... so for a test user account creation and verification service called "persona test user," i have these keys: ptu:nextval an iterator ptu:mailq a queue (list) of incoming verification emails ptu:emails:staging a zset of emails being staged, sorted by creation date ptu:emails:valid a zset of email accounts ready for use, sorted by creation date ptu:email:<email>:passwd the password for an email account the ptu: prefix makes it extra clear what these keys ar...
Setting up an update server
if you update the installation without moving it, attempts at further incremental builds will not work properly, and a clobber will be needed when building next.
... next, you need to change the update url to point to the local xml file.
Gecko object attributes
tree related attributes cycles "true" when the tree cell is a cycler, which means each click will cycle to the next option.
... in this case action 0 is called "cycles", which moves to the next option in the same way a manual click does.
Gecko events
event_text_column_changed the caret moved from one column to the next.
... event_section_changed the caret moved from one section to the next.
Using the Places history service
this will cause the transition type of the next visit of the url to be marked as "typed." nsinavhistoryservice.markpageasfollowedbookmark: called by the ui (implemented, but not yet called, see bug 409301) when the user selects a bookmark.
... this will cause the transition type of the next visit of the url to be marked as "bookmark." nsinavhistoryservice.setpageusertitle: sets the user-defined title for the page, which will override the actual page title when displayed in the ui.
Creating a Python XPCOM component
tip: you can achieve a copy of binary of pyxpcom from pythonext; simply unpack xpi and take everything you need.
...then, the next time mozilla starts, it will rebuild the index of components, including any new one in the 'components' directory.
Avoiding leaks in JavaScript XPCOM components
the potential causes of leaks with garbage collection (the next strategy) also apply to reference counting as well.
...alname) { case "radio": return nodefilter.filter_accept; case "template": case "radiogroup": return nodefilter.filter_reject; default: return nodefilter.filter_skip; } } var iterator = this.ownerdocument.createtreewalker(this, nodefilter.show_element, _filterradiogroup, true); while (iterator.nextnode()) radiochildren.push(iterator.currentnode); return this.mradiochildren = radiochildren; in this example, the iterator object is an xpcom object that is wrapped so the javascript code can use it.
How to build an XPCOM component in JavaScript
if you want to use your component only from javascript, you can skip to the next section.
... if an interface exists that meets your needs, then you do not need to write an idl, or compile a typelib, and may skip to the next section.
An Overview of XPCOM
« previousnext » this is a book about xpcom.
... « previousnext » copyright (c) 2003 by doug turner and ian oeschger.
Preface
next » this is a book about gecko, and about creating xpcom components for gecko-based applications.
... next » copyright (c) 2003 by doug turner and ian oeschger.
How to build a binary XPCOM component using Visual Studio
this tutorial uses microsoft’s free visual c++ express and the sample project in the next paragraph.
...the next step is to compile the idl into a type-library (*.xpt) and a c++ header file (*.h), which we can use to define our implementation object.
imgIEncoder
delay=# -- default: "500" number of milliseconds to display the frame, before moving to the next frame.
... dispose=[none|background|previous] -- default: "none" what to do with the image's canvas before rendering the next frame.
nsIAccessible
nsiaccessible.parent to get the parent accessible nsiaccessible.nextsibling, nsiaccessible.previoussibling to get sibling accessibles nsiaccessible.firstchild, nsiaccessible.lastchild to get first and last child nsiaccessible.children, nsiaccessible.getchildat(), nsiaccessible.childcount to navigate through the children by index accessible position you can use nsiaccessible.indexinparent to get accessible index in its parent.
... nextsibling next sibling in accessible tree.
nsIAccessibleEvent
event_text_column_changed 0x003a 0x0036 the caret moved from one column to the next.
... event_section_changed 0x003b 0x0037 the caret moved from one section to the next.
nsICRLInfo
nextupdate prtime the time the suggested next update for this crl.
... nextupdatelocale astring nextupdate formatted as a human readable string formatted according to the environment locale.
nsICacheVisitor
return value returns true to start visiting all entries for this device, otherwise returns false to advance to the next device.
... return value returns true to visit the next entry on the current device, or if the end of the device has been reached, advance to the next device, otherwise returns false to advance to the next device.
nsIMicrosummaryGenerator
methods calculateupdateinterval() calculates the interval until the microsummary should be updated for the next time, depending on the page content.
... return value the interval in milliseconds until the next update request.
nsIMsgDBViewCommandUpdater
is implemented for different windows in several different places: nsmsgdbviewcommandupdater (for the standalone message window) nsmsgdbviewcommandupdater (for the threadpane message window) nsmsgsearchcommandupdater (for search dialogs) method overview void updatecommandstatus(); void displaymessagechanged(in nsimsgfolder afolder, in astring asubject, in acstring akeywords); void updatenextmessageafterdelete(); methods updatecommandstatus() called when the number of selected items changes.
... updatenextmessageafterdelete() allows the backend to tell the front end to re-determine which message we should select after a delete or move void updatenextmessageafterdelete(); parameters none.
nsIMsgDatabase
msgdbhdr ahdr, in boolean aadd); boolean hdrisincache(in string asearchfolderuri, in nsimsgdbhdr ahdr); attributes attribute type description dbfolderinfo nsidbfolderinfo readonly: firstnew nsmsgkey readonly: msgretentionsettings nsimsgretentionsettings msgdownloadsettings nsimsgdownloadsettings lowwaterarticlenum nsmsgkey readonly: highwaterarticlenum nsmsgkey readonly: nextpseudomsgkey nsmsgkey for undo-redo of move pop->imap.
... nextfakeofflinemsgkey nsmsgkey readonly: for saving "fake" offline msg hdrs.
nsISmsRequestManager
createinstance(components.interfaces.nsismsrequestmanager); method overview long addrequest(in nsidommozsmsrequest arequest); long createrequest(in nsidommozsmsmanager amanager, out nsidommozsmsrequest arequest); void notifycreatemessagelist(in long arequestid, in long alistid, in nsidommozsmsmessage amessage); void notifygetsmsfailed(in long arequestid, in long aerror); void notifygotnextmessage(in long arequestid, in nsidommozsmsmessage amessage); void notifygotsms(in long arequestid, in nsidommozsmsmessage amessage); void notifymarkedmessageread(in long arequestid, in bool aread); void notifymarkmessagereadfailed(in long arequestid, in long aerror); void notifynomessageinlist(in long arequestid); void notifyreadmessagelistfailed(in long arequestid, in long aerror); v...
... notifygotnextmessage() void notifygotnextmessage( in long arequestid, in nsidommozsmsmessage amessage ); parameters arequestid a number representing the id of the request.
nsITaskbarTabPreview
method overview void ensureregistration(); violates the xpcom interface guidelines nativewindow gethwnd(); violates the xpcom interface guidelines void move(in nsitaskbartabpreview anext); attributes attribute type description icon imgicontainer the icon displayed next to the title in the preview.
... void move( in nsitaskbartabpreview anext ); parameters anext the preview that this preview should be placed to the left of.
nsITimer
the timer period will ideally be at least the time between when processing for last firing the callback completes and when the next firing occurs, but note that this is not guaranteed: the timer can fire at any time.
... if the callback takes a long time, then the next callback will be scheduled immediately afterward, but only once, unlike type_repeating_precise.
nsIWebBrowserChromeFocus
inherits from: nsisupports last changed in gecko 1.7 method overview void focusnextelement(); void focusprevelement(); methods focusnextelement() set the focus at the next focusable element in the chrome.
... void focusnextelement(); parameters none.
nsIXPCScriptable
jsenumerate_next a previously allocated opaque iterator state is passed in via statep.
... return the next jsid in the iteration using idp.
nsIXULTemplateBuilder
for the next iteration, those children would be used to generate output for their child nodes and so forth.
...for convenience, each reference point as well as all results implement the nsixultemplateresult interface, allowing the result objects from each iteration to be used directly as the reference points for the next iteration.
Address Book examples
let abmanager = components.classes["@mozilla.org/abmanager;1"] .getservice(components.interfaces.nsiabmanager); let alladdressbooks = abmanager.directories; while (alladdressbooks.hasmoreelements()) { let addressbook = alladdressbooks.getnext() .queryinterface(components.interfaces.nsiabdirectory); if (addressbook instanceof components.interfaces.nsiabdirectory) { // or nsiabitem or nsiabcollection // alert ("directory name:" + addressbook.dirname); ...
... assuming you wish to search across multiple directories: let abmanager = components.classes["@mozilla.org/abmanager;1"] .getservice(components.interfaces.nsiabmanager); let alladdressbooks = abmanager.directories; while (alladdressbooks.hasmoreelements()) { let ab = alladdressbooks.getnext(); if (ab instanceof components.interfaces.nsiabdirectory && !ab.isremote) { let searchresult = abmanager.getdirectory(ab.uri + "?" + searchquery).childcards; // ...
Cached compose window FAQ
instead of destroying the mail compose window on send (or close) just to create a new one the next time, mozilla mail will "cache" the compose window on send (or close), and use that instead.
... we could just hide it on send, and then show it on the next compose.
Index
instead of destroying the mail compose window on send (or close) just to create a new one the next time, mozilla mail will "cache" the compose window on send (or close), and use that instead.
... we could just hide it on send, and then show it on the next compose.
MailNews fakeserver
forcibly aborted or stopped normally isstopped none if the server is stopped helper for performtest istestfinished none if the test is finished helper for performtest playtransaction none the transaction the transaction is an object with two properties: us, and them; us is an array of responses we sent, them an array of commands received resettest none nothing prepares the server for the next test without closing the connection start port number nothing starts the server listening stop none nothing stops the server and closes the connection using fakeserver in qa testing debug output from fakeservers it is possible to get the fakeservers to dump to the console the commands they have sent and received.
... (resetting if it exists) addarticle newsarticle object nothing adds the message to all groups in the article's group list addarticletogroup newsarticle object, group (string), integral key for group nothing adds the message to the specified group with the specified key getgroup group name group object group is a map key->article, with the additional properties: flags, keys (array of keys), nextkey (next key to use for new articles) getgroupstats group name array of [size, min, max] the size is an estimate if nntp_real_length is not specified in the daemon flags.
MailNews Filters
if one of the actions is a move, or a stop filter execution action, we move on to the next header; otherwise, we move on to the next filter.
...for each new header, we evaluate the filter criteria and apply the actions synchronously, including moving a message to an other local folder, and advance to the next header.
Building a Thunderbird extension 5: XUL
in the next section you will learn how to use javascript to modify your label so that it shows the current date.
... « previousnext » ...
Building a Thunderbird extension 6: Adding JavaScript
depending on the installed theme the result will look something like this: modify xul elements with javascript save the following javascript code into the content/ folder next to your myhelloworld.xul file and name it overlay.js.
... « previousnext » ...
Add to iPhoto
calling launch services to launch iphoto next, we need to build the parameters for the lsopenurlswithrole() function, then call it to start up iphoto.
...we do that next by following these steps: create a cfstring referring to file:///applications/iphoto.app, which is iphoto's default path, using cfstringcreatewithcharacters().
Declaring types
structures with next field it is common to see structures with a "next" field that is a pointer to itself.
... in order to accomplish this you can either set the type of next to ctypes.voidptr_t, or to be more accurate, use the define technique: var struct = ctypes.structtype('struct'); struct.define([{ next: struct.ptr }]); arrays to declare a new array type, you use the ctypes.arraytype() method.when declaring a new array type, you provide a ctype indicating the type of each element in the array as well as an optional array length.
Browser Side Plug-in API - Plugins
« previousnext » this chapter describes methods in the plug-in api that are available from the browser.
... netscape plug-in method summary « previousnext » npn_destroystream closes and deletes a stream.
Drawing and Event Handling - Plugins
« previousnext » this chapter tells how to determine whether a plug-in instance is windowed or windowless, how to draw and redraw plug-ins, and how to handle plug-in events.
... « previousnext » ...
Memory - Plugins
« previousnext » this chapter describes the plug-in api functions that allocate and free memory as needed by the plug-in.
... « previousnext » ...
Plug-in Development Overview - Plugins
« previousnext » writing plug-ins once you decide what you want your plug-in to do, creating it is a simple process.
...consider the following example, where a media player plug-in can be controlled with an advancetonextsong() method called inside the script element: <object id="myplugin" type="audio/wav" data="music.wav"> </object> <script type="application/javascript"> var theplugin = document.getelementbyid('myplugin'); if (theplugin && theplugin.advancetonextsong) theplugin.advancetonextsong(); else alert("plugin not installed correctly"); </script> in the past, liveconnect and late...
Plug-in Side Plug-in API - Plugins
« previousnext » this chapter describes methods in the plug-in api that are available for the plug-in object.
... « previousnext » ...
Scripting plugins - Plugins
« previousnext » xxx: dummy p element this document describes the new cross-browser npapi extensions, commonly called npruntime, that have been developed by a group of browser and plugin vendors, including the mozilla foundation, adobe, apple, opera, and sun microsystems (see press release).
...utf8fromidentifier npn_intfromidentifier npobject npn_construct (since firefox 3.0b1) npn_createobject npn_retainobject npn_releaseobject npn_invoke npn_invokedefault npn_enumerate (since mozilla 1.9a1) npn_evaluate npn_getproperty npn_setproperty npn_removeproperty npn_hasproperty npn_hasmethod npn_setexception npclass « previousnext » ...
Structures - Plugins
« previousnext » this chapter describes the data structures that are used to represent the various objects in the plug-in api.
... « previousnext » ...
URLs - Plugins
« previousnext » this chapter describes retrieving urls and displaying them on specified target pages, posting data to an http server, uploading files to an ftp server, and sending mail.
... « previousnext » ...
Version, UI, and Status Information - Plugins
« previousnext » this chapter describes the functions that allow a plug-in to display a message on the status line, get agent information, and check on the current version of the plug-in api and the browser.
... « previousnext » ...
Step through code - Firefox Developer Tools
when the debugger is stopped at a breakpoint, you can step through it using four buttons in the toolbar: in order, the buttons are: play: run to the next breakpoint step over: advance to the next line in the same function.
... step in: advance to the next line in the function, unless on a function call, in which case enter the function being called step out: run to the end of the current function, in which case, the debugger will skip the return value from a function, returning execution to the caller split console when paused, you can press the esc key to open and close the split console to gain more insight into errors and variables: pause on breakpoints overlay since firefox 70, when your code is paused on a breakpoint an overlay appears on the viewport of the tab you are debugging.
Set event listener breakpoints - Firefox Developer Tools
to break when event listeners are hit, check the boxes next the events you are interested in.
... when execution pauses, the source pane displays the highlighted line of the javascript code that is next to be executed, along with the surrounding code for context.
Examine and edit HTML - Firefox Developer Tools
this is equivalent to holding the alt key and clicking the disclosure triangle next to an element.
...this is equivalent to clicking the disclosure arrow next to an element that's expanded.
Shader Editor - Firefox Developer Tools
you can edit these programs and see the results the next time the webgl context redraws (for example, in the next animation frame).
... for example, you can modify the colors: the editor highlights syntax errors in your code: if you hover over the cross shown next to a line containing an error, you'll see more details about the problem: ...
Style Editor - Firefox Developer Tools
viewing original sources now, if you check "show original sources" in the style editor settings, the links next to css rules in the rules view will link to the original sources in the style editor.
...with sass you can do this simply by passing the --watch option: sass index.scss:index.css --watch next, save the original source in the style editor by clicking the "save" button next to the file, and saving it over the original file.
Console messages - Firefox Developer Tools
instead, the reflow happens asynchronously, the next time the browser decides it needs to be done (generally, the next time the browser repaints).
... for errors and warnings, when you turn off display of the category, a number appears next to the button text to indicate how many messages of that type are available.
The JavaScript input interpreter - Firefox Developer Tools
the menuitem enable autocompletion has a checkmark next to it when the feature is enabled, which is missing when it is disabled.
...the menuitem instant evaluation has a checkmark next to it when the feature is enabled, which is missing when it is disabled.
ANGLE_instanced_arrays.drawArraysInstancedANGLE() - Web APIs
gl.line_strip: draws a straight line to the next vertex.
... gl.line_loop: draws a straight line to the next vertex, and connects the last vertex back to the first.
ANGLE_instanced_arrays.drawElementsInstancedANGLE() - Web APIs
gl.line_strip: draws a straight line to the next vertex.
... gl.line_loop: draws a straight line to the next vertex, and connects the last vertex back to the first.
Basic usage of canvas - Web APIs
« previousnext » let's start this tutorial by looking at the <canvas> html element itself.
...canvas.getcontext('2d'); ctx.fillstyle = 'rgb(200, 0, 0)'; ctx.fillrect(10, 10, 50, 50); ctx.fillstyle = 'rgba(0, 0, 200, 0.5)'; ctx.fillrect(30, 30, 50, 50); } } </script> </head> <body onload="draw();"> <canvas id="canvas" width="150" height="150"></canvas> </body> </html> this example looks like this: screenshotlive sample « previousnext » ...
Drawing text - Web APIs
« previousnext » after having seen how to apply styles and colors in the previous chapter, we will now have a look at how to draw text onto the canvas.
... « previousnext » ...
Using images - Web APIs
« previousnext » until now we have created our own shapes and applied styles to them.
...you can disable this feature like this: ctx.mozimagesmoothingenabled = false; ctx.webkitimagesmoothingenabled = false; ctx.msimagesmoothingenabled = false; ctx.imagesmoothingenabled = false; « previousnext » ...
Using channel messaging - Web APIs
next, we post a confirmation message back to the main page via the message channel by calling messageport.postmessage on messagechannel.port2 that was initially transferred to the iframe.
... // handle messages received on port1 function onmessage(e) { output.innerhtml = e.data; input.value = ''; } when a message is received back from the iframe confirming that the original message was received successfully, this simply outputs the confirmation to a paragraph and empties the text input ready for the next message to be sent.
ChildNode.after() - Web APIs
WebAPIChildNodeafter
argitem : document.createtextnode(string(argitem))); }); this.parentnode.insertbefore(docfrag, this.nextsibling); } }); }); })([element.prototype, characterdata.prototype, documenttype.prototype]); another polyfill // from: https://github.com/fabiovergani/js-polyfill_element.prototype.after/blob/master/after.js (function(x){ var o=x.prototype,p='after'; if(!o[p]){ o[p]=function(){ var e, m=arguments, l=m.length, i=0, t=this, p=t.parentnode, n=node, s=string, d=document; ...
... if(p!==null){ while(i<l){ e=m[i]; if(e instanceof n){ t=t.nextsibling; if(t!==null){ p.insertbefore(e,t); }else{ p.appendchild(e); }; }else{ p.appendchild(d.createtextnode(s(e))); }; ++i; }; }; }; }; })(element); /* minified: (function(x){ var o=x.prototype; o.after||(o.after=function(){var e,m=arguments,l=m.length,i=0,t=this,p=t.parentnode,n=node,s=string,d=document;if(p!==null){while(i<l){((e=m[i]) instanceof n)?(((t=t.nextsibling )!==null)?p.insertbefore(e,t):p.appendchild(e)):p.appendchild(d.createtextnode(s(e)));++i;}}}); }(element)); */ specification specification status comment domthe definit...
CredentialsContainer.preventSilentAccess() - Web APIs
for example, you might call this, after a user signs out of a website to ensure that he/she isn't automatically signed in on the next site visit.
...this method is typically called after a user signs out of a website, ensuring this user's login information is not automatically passed on the next site visit.
Element.scrollHeight - Web APIs
</textarea> </p> <p> <input type="checkbox" id="agree" name="accept" /> <label for="agree">i agree</label> <input type="submit" id="nextstep" value="next" /> </p> </form> css #notice { display: inline-block; margin-bottom: 12px; border-radius: 5px; width: 600px; padding: 5px; border: 2px #7fdf55 solid; } #rules { width: 600px; height: 130px; padding: 5px; border: #2a9f00 solid 2px; border-radius: 5px; } javascript function checkreading () { if (checkreading.read) { return; } checkreading.read...
... = this.scrollheight - this.scrolltop === this.clientheight; document.registration.accept.disabled = document.getelementbyid("nextstep").disabled = !checkreading.read; checkreading.noticebox.innerhtml = checkreading.read ?
Using files from web applications - Web APIs
example: showing thumbnails of user-selected images let's say you're developing the next great photo-sharing website and want to use html to display thumbnail previews of images before the user actually uploads them.
... next, we establish the filereader to handle asynchronously loading the image and attaching it to the img element.
GlobalEventHandlers.onanimationend - Web APIs
#box { width: var(--boxwidth); height: var(--boxwidth); left: 0; top: 0; border: 1px solid #7788ff; margin: 0; position: relative; background-color: #2233ff; display: flex; justify-content: center; } the animation sequence is described next.
...the keyframes are defined next; they describe an animation which causes the box to migrate from the top-left corner of the container to the bottom-right corner.
GlobalEventHandlers.onanimationstart - Web APIs
#box { width: var(--boxwidth); height: var(--boxwidth); left: 0; top: 0; border: 1px solid #7788ff; margin: 0; position: relative; background-color: #2233ff; display: flex; justify-content: center; } the animation sequence is described next.
...the keyframes are defined next; they describe an animation which causes the box to migrate from the top-left corner of the container to the bottom-right corner.
History - Web APIs
WebAPIHistory
forward() this asynchronous method goes to the next page in session history, the same action as when the user clicks the browser's forward button; this is equivalent to history.go(1).
... go() asynchronously loads a page from the session history, identified by its relative location to the current page, for example -1 for the previous page or 1 for the next page.
IDBCursor.continuePrimaryKey() - Web APIs
the key is less than or equal to this cursor's position and the cursor's direction is next or nextunique.
... invalidaccesserror the cursor's direction is not prev or next.
IDBCursor.direction - Web APIs
possible values are: value description next this direction causes the cursor to be opened at the start of the source.
... nextunique this direction causes the cursor to be opened at the start of the source.
IDBObjectStore.openCursor() - Web APIs
valid values are "next", "nextunique", "prev", and "prevunique".
... the default is "next".
IDBObjectStore.openKeyCursor() - Web APIs
valid values are "next", "nextunique", "prev", and "prevunique".
... the default is "next".
Browser storage limits and eviction criteria - Web APIs
button (e.g., show in finder on mac os x) next to the profile folder title.
... lru policy when the available disk space is filled up, the quota manager will start clearing out data based on an lru policy — the least recently used origin will be deleted first, then the next one, until the browser is no longer over the limit.
KeyframeEffect.setKeyframes() - Web APIs
element.animate([ { opacity: 1, easing: 'ease-out' }, { opacity: 0.1, easing: 'ease-in' }, { opacity: 0 } ], 2000); in this example, the specified easing only applies from the keyframe where it is specified until the next keyframe.
... easing the timing function used from this keyframe until the next keyframe in the series.
MediaSession.setActionHandler() - Web APIs
it will be one of play, pause, seekbackward, seekforward, seekto, skipad,previoustrack, or nexttrack.
...the following strings identify the currently available types of media session action: nexttrack advances playback to the next track.
Node.insertBefore() - Web APIs
WebAPINodeinsertBefore
it can be emulated by combining the insertbefore method with node.nextsibling.
... in the previous example, sp1 could be inserted after sp2 using: parentdiv.insertbefore(sp1, sp2.nextsibling) if sp2 does not have a next sibling, then it must be the last child — sp2.nextsibling returns null, and sp1 is inserted at the end of the child node list (immediately after sp2).
NodeIterator - Web APIs
nodeiterator.nextnode() returns the next node in the document, or null if there are none.
... the methods previousnode() and nextnode() don't raise an exception any more.
NonDocumentTypeChildNode - Web APIs
nondocumenttypechildnode.nextelementsibling read only returns the element immediately following this node in its parent's children list, or null if there is no element in the list following this node.
...the previouselementsibling and nextelementsibling are now defined on the latter.
Resource Timing API - Web APIs
the next stages are connectstart and connectend which are the timestamps immediately before and after connecting to the server, respectively.
... other properties the nexthopprotocol property returns the network protocol used to fetch the resource.
SyncManager.register() - Web APIs
maxdelay: the maximum delay in milliseconds before the next sync event (or the first sync event if it is periodic).
... mindelay: the minimum delay in milliseconds before the next sync event (or the first sync event if it is periodic).
TextEncoder - Web APIs
new array(len * 1.5) : new uint8array(len * 3); for (var point=0, nextcode=0, i = 0; i !== len; ) { point = str.charcodeat(i), i += 1; if (point >= 0xd800 && point <= 0xdbff) { if (i === len) { resarr[respos += 1] = 0xef/*0b11101111*/; resarr[respos += 1] = 0xbf/*0b10111111*/; resarr[respos += 1] = 0xbd/*0b10111101*/; break; } // https://mathiasbynens.be/n...
...otes/javascript-encoding#surrogate-formulae nextcode = str.charcodeat(i); if (nextcode >= 0xdc00 && nextcode <= 0xdfff) { point = (point - 0xd800) * 0x400 + nextcode - 0xdc00 + 0x10000; i += 1; if (point > 0xffff) { resarr[respos += 1] = (0x1e/*0b11110*/<<3) | (point>>>18); resarr[respos += 1] = (0x2/*0b10*/<<6) | ((point>>>12)&0x3f/*0b00111111*/); resarr[respos += 1] = (0x2/*0b10*/<<6) | ((point>>>6)&0x3f/*0b00111111*/); resarr[respos += 1] = (0x2/*0b10*/<<6) | (point&0x3f/*0b00111111*/); continue; } } else { resarr[respos += 1] ...
TreeWalker - Web APIs
treewalker.nextsibling() moves the current node to its next sibling, if any, and returns the found sibling.
... treewalker.nextnode() moves the current node to the next visible node in the document order, and returns the found node.
WebGL2RenderingContext.drawArraysInstanced() - Web APIs
gl.line_strip: draws a straight line to the next vertex.
... gl.line_loop: draws a straight line to the next vertex, and connects the last vertex back to the first.
WebGL2RenderingContext.drawElementsInstanced() - Web APIs
gl.line_strip: draws a straight line to the next vertex.
... gl.line_loop: draws a straight line to the next vertex, and connects the last vertex back to the first.
WebGL2RenderingContext.drawRangeElements() - Web APIs
gl.line_strip: draws a straight line to the next vertex.
... gl.line_loop: draws a straight line to the next vertex, and connects the last vertex back to the first.
WebGLRenderingContext.drawArrays() - Web APIs
gl.line_strip: draws a straight line to the next vertex.
... gl.line_loop: draws a straight line to the next vertex, and connects the last vertex back to the first.
WebGLRenderingContext.drawElements() - Web APIs
gl.line_strip: draws a straight line to the next vertex.
... gl.line_loop: draws a straight line to the next vertex, and connects the last vertex back to the first.
Basic scissoring - Web APIs
« previousnext » in this example, we see how to draw simple rectangles and squares using webgl scissoring operations.
... « previousnext » ...
Boilerplate 1 - Web APIs
« previousnext » this example describes repeated pieces of code that will be hidden from now on, as well as defining a javascript utility function to make webgl initialization easier.
... « previousnext » ...
Canvas size and WebGL - Web APIs
« previousnext » this webgl example explores the effect of setting (or not setting) the canvas size to its element size in css pixels, as it appears in the browser window.
... « previousnext » ...
Clearing by clicking - Web APIs
« previousnext » this example demonstrates how to combine user interaction with webgl graphics operations by clearing the rendering context with a random color when the user clicks.
... « previousnext » ...
Detect WebGL - Web APIs
« previousnext » this example demonstrates how to detect a webgl rendering context and reports the result to the user.
... « previousnext » ...
Hello vertex attributes - Web APIs
« previousnext » this webgl example demonstrates how to combine shader programming and user interaction by sending user input to the shader using vertex attributes.
... « previousnext » ...
Raining rectangles - Web APIs
« previousnext » a simple webgl game that demonstrates clearing with solid colors, scissoring, animation, and user interaction.
... « previousnext » ...
Scissor animation - Web APIs
« previousnext » a simple webgl example in which we have some animation fun using scissoring and clearing operations.
... « previousnext » ...
Simple color animation - Web APIs
« previousnext » a very basic color animation created using webgl, performed by clearing the drawing buffer with a different random color every second.
... « previousnext » ...
Textures from code - Web APIs
« previousnext » this webgl example provides a simple demonstration of procedural texturing with fragment shaders.
... « previousnext » ...
WebGL by example - Web APIs
next » webgl by example is a series of live samples with short explanations that showcase webgl concepts and capabilities.
... next » ...
Animating objects with WebGL - Web APIs
« previousnext » in this example, we'll actually rotate our square plane.
... view the complete code | open this demo on a new page « previousnext » ...
Lighting in WebGL - Web APIs
« previousnext » as should be clear by now, webgl doesn't have much built-in knowledge.
... « previousnext » ...
Web Video Text Tracks Format (WebVTT) - Web APIs
the active text is the text between the timestamp and the next timestamp or to the end of the payload if there is not another timestamp in the payload.
...for example, for a first cue starting at time 1 second and ending at 5 seconds, it is written as: 00:01.000 --> 00:05.000 on the next line you can write the caption for this cue which will run from 1st second to the 5th second, inclusive.
Inputs and input sources - Web APIs
the next entry is generic-trigger-squeeze-thumbstick, indicating a generic device with a trigger, a squeeze control, and a thumbstick.
... after that, everything proceeds as usual, getting the viewer's pose from the updated reference frame, requesting the next frame callback through requestanimationframe(), and then continuing to set up webgl and draw the scene.
WebXR application life cycle - Web APIs
this serves as preparation for the next few articles in these webxr guides, which cover starting up and shutting down a webxr session, geometry, simulating cameras, spatial tracking, and more.
... each time the callback is invoked, it should call requestanimationframe() again in order to let the browser know that the callback needs to be run again when it's time to render the next frame.
Keyframe Formats - Web APIs
element.animate([ { opacity: 1, easing: 'ease-out' }, { opacity: 0.1, easing: 'ease-in' }, { opacity: 0 } ], 2000); in this example, the specified easing only applies from the keyframe where it is specified until the next keyframe.
... easing the timing function used from this keyframe until the next keyframe in the series.
Example and tutorial: Simple synth keyboard - Web APIs
next, we iterate over each octave in the note frequencies table.
...the returned oscillator is stored into osclist for future reference, and data-pressed is set to yes to indicate that the note is playing so we don't start it again next time this is called.
Using Web Workers - Web APIs
next, we add a message handler on the port to do the calculation and return the result to the main thread.
... the javascript code the following javascript code is stored in the "fibonacci.js" file referenced by the html in the next section.
window.location - Web APIs
WebAPIWindowlocation
cras sodales eleifend interdum.</p> </body> </html> …the same thing but with an animated page scroll: var showbookmark = (function () { var _usehash, _scrollx, _scrolly, _nodex, _nodey, _itframe, _scrollid = -1, _bookmark, /* * nduration: the duration in milliseconds of each frame * nframes: number of frames for each scroll */ nduration = 200, nframes = 10; function _next () { if (_itframe > nframes) { clearinterval(_scrollid); _scrollid = -1; return; } _isbot = true; document.documentelement.scrolltop = math.round(_scrolly + (_nodey - _scrolly) * _itframe / nframes); document.documentelement.scrollleft = math.round(_scrollx + (_nodex - _scrollx) * _itframe / nframes); if (_usehash && _itframe === nframes) { location.hash = _bookmark; } _itframe++; }...
...croll", _chkowner); } return function (sbookmark, busehash) { var onode = document.queryselector(sbookmark); _scrolly = document.documentelement.scrolltop; _scrollx = document.documentelement.scrollleft; _bookmark = sbookmark; _usehash = busehash === true; _nodex = onode.offsetleft; _nodey = onode.offsettop; _itframe = 1; if (_scrollid === -1) { _scrollid = setinterval(_next, math.round(nduration / nframes)); } }; })(); specifications specification status comment html living standardthe definition of 'window.location' in that specification.
window.requestIdleCallback() - Web APIs
you can call requestidlecallback() within an idle callback function to schedule another callback to take place no sooner than the next pass through the event loop.
...currently only one property is defined: timeout: if timeout is specified and has a positive value, and the callback has not already been called by the time timeout milliseconds have passed, the callback will be called during the next idle period, even if doing so risks causing a negative performance impact.
WindowOrWorkerGlobalScope.setTimeout() - Web APIs
if this parameter is omitted, a value of 0 is used, meaning execute "immediately", or more accurately, the next event cycle.
...for example: function foo() { console.log('foo has been called'); } settimeout(foo, 0); console.log('after settimeout'); will write to the console: after settimeout foo has been called this is because even though settimeout was called with a delay of zero, it's placed on a queue and scheduled to run at the next opportunity; not immediately.
XRRigidTransform.matrix - Web APIs
the values are stored into the array in column-major order; that is, each column is written into the array top-down before moving to the right one column and writing the next column into the array.
... next, the position is placed into the right-hand column, like this, resulting in a translation matrix that will transform a coordinate system by the specified distance in each dimension, with no rotational change.
XRSession.updateRenderState() - Web APIs
the updaterenderstate() method of the xrsession interface of webxr api schedules changes to be applied to the active render state prior to rendering of the next frame.
... syntax xrsession.updaterenderstate(newstate) parameters newstate an object conforming to the xrrenderstateinit dictionary specifying the properties of the session's renderstate to update before rendering the next frame.
ARIA: tab role - Accessibility
if focus is on the active tab moves focus to the next element in the keyboard focus order, ideally the active tab's associated tabpanel.
... → focuses and optionally activates the next tab in the tab list.
Understandable - Accessibility
what page to show, when to advance to the next photo in the gallery...) if you need to have something like a carousel on a page, provide an option to stop it automatically advancing.
...when an error is detected, an intuitive error message should be shown next to the form input that is at fault to help the user correct their inputs.
Adjacent sibling combinator - CSS: Cascading Style Sheets
/* paragraphs that come immediately after any image */ img + p { font-weight: bold; } syntax former_element + target_element { style properties } examples css li:first-of-type + li { color: red; } html <ul> <li>one</li> <li>two!</li> <li>three</li> </ul> result specifications specification status comment selectors level 4the definition of 'next-sibling combinator' in that specification.
... working draft renames it the "next-sibling" combinator.
Handling Overflow in Multicol - CSS: Cascading Style Sheets
in this situation, the content should visibly overflow into the next column, rather than be clipped by the column box.
... in a future version of the specification it would be useful to be able to have overflow columns in continuous media display in the block direction, therefore allowing the reader to scroll down to view the next set of columns.
Spanning and Balancing Columns - CSS: Cascading Style Sheets
things to watch out for if the spanning element is inside another element which has margins, padding and a border or a background color, it is possible to end up with the top of the box appearing above the spanner and the rest displaying below, as shown in the next example.
... in the next guide you will learn how multicol handles overflow, both within columns and where there are more columns than will fit the container.
Using multi-column layouts - CSS: Cascading Style Sheets
people have trouble reading text if lines are too long; if it takes too long for the eyes to move from the end of the one line to the beginning of the next, they lose track of which line they were on.
... in a multi-column block, content is automatically flowed from one column into the next as needed.
Aligning Items in a Flex Container - CSS: Cascading Style Sheets
in this next live example, the flex container has align-items: flex-start, which means the items are all aligned to the start of the cross axis.
... in this next example i have items laid out with flex-direction: row-reverse and justify-content: flex-end.
Basic concepts of flexbox - CSS: Cascading Style Sheets
next steps after reading this article you should have an understanding of the basic features of flexbox.
... in the next article we will look at how this specification relates to other parts of css.
Mastering Wrapping of Flex Items - CSS: Cascading Style Sheets
in the next example i have ten items all with a flex-basis of 160px and the ability to grow and shrink.
... i have created this behaviour in the next live example.
Flow Layout and Writing Modes - CSS: Cascading Style Sheets
the value vertical-rl gives you a right-to-left block flow direction with a vertical inline direction, as shown in the next example.
...this is shown in the next example where the box which displays as horizontal-tb contains a float which is contained due to its parent establishing a new bfc.
In Flow and Out of Flow - CSS: Cascading Style Sheets
in the next example i have three paragraph elements, the second element has position absolute, with offset values of top: 30px and right: 30px.
...in the next guide we will look at a related issue, that of creating a block formatting context, in formatting contexts explained.
Subgrid - CSS: Cascading Style Sheets
subgrid for rows the next example is the same setup, however we are using subgrid as the value of grid-template-rows and defining explicit column tracks.
... take a look at the next example — it uses the same parent and child grid as in the example above, however inside the subgrid i have twelve items trying to autoplace into ten grid cells.
Using CSS gradients - CSS: Cascading Style Sheets
in this example, the colors share a color stop at the 50% mark, halfway through the gradient: <div class="striped"></div> div { width: 120px; height: 120px; } .striped { background: linear-gradient(to bottom left, cyan 50%, palegoldenrod 50%); } gradient hints by default, the gradient transitions evenly from one color to the next.
...%, cyan 55% 70%, yellow 80% ); } .multiposition-stop2 { background: linear-gradient(to left, lime 25%, red 25%, red 50%, cyan 50%, cyan 75%, yellow 75% ); background: linear-gradient(to left, lime 25%, red 25% 50%, cyan 50% 75%, yellow 75% ); } in the first example above, the lime goes from the 0% mark, which is implied, to the 20% mark, transitions from lime to red over the next 10% of the width of the gradient, reach solid red at the 30% mark, and staying solid red up until 45% through the gradient, where it fades to cyan, being fully cyan for 15% of the gradient, and so on.
Overview of CSS Shapes - CSS: Cascading Style Sheets
in this next example, we have an image with a fully transparent area, and we are using an image as the url value for shape-outside.
... in this next example, we use generated content to insert an element with height and width of 150px.
Shapes From Images - CSS: Cascading Style Sheets
in this next example i have used generated content and floated this content, giving it a background image of a linear gradient.
... in this next example i am using a radial gradient with an ellipse, once again using a transparent part of the gradient to create the shape.
page-break-after - CSS: Cascading Style Sheets
left force page breaks after the element so that the next page is formatted as a left page.
... right force page breaks after the element so that the next page is formatted as a right page.
page-break-before - CSS: Cascading Style Sheets
left force page breaks before the element so that the next page is formatted as a left page.
... right force page breaks before the element so that the next page is formatted as a right page.
Getting Started - Developer guides
}; next, after declaring what happens when you receive the response, you need to actually make the request, by calling the open() and send() methods of the http request object, like this: httprequest.open('get', 'http://www.example.org/some.file', true); httprequest.send(); the first parameter of the call to open() is the http request method – get, post, head, or another method supported by your s...
...} the full list of the readystate values is documented at xmlhttprequest.readystate and is as follows: 0 (uninitialized) or (request not initialized) 1 (loading) or (server connection established) 2 (loaded) or (request received) 3 (interactive) or (processing request) 4 (complete) or (request finished and response is ready) next, check the http response status codes of the http response.
WAI ARIA Live Regions/API Support - Developer guides
if yes, member-of relation will point to the root of the region (see next section) aria-atomic on ancestor element member-of if container-atomic=true, points to an ancestor accessible object (thus it is actually an accessible relation, not object attribute) not in atomic region if not provided points to the root of the atomic container that this object is in.
...once the user presses the next key the speech will move on to echoing that key anyway.
Video player styling basics - Developer guides
] { display:none; } .controls[data-state=visible] { display:block; } there are a number of properties that also need to be set for all elements within the video controls: .controls > * { float:left; width:3.90625%; height:100%; margin-left:0.1953125%; display:block; } .controls > *:first-child { margin-left:0; } all elements are floated left, as they are to be aligned next to one another, and each element is set to have a width of nearly 4% (again the actual value was calculated based on the required dimensions of the buttons), and a height of 100%.
... javascript that's really it for the immediate styling; the next task is making a number of javascript changes to ensure that everything works as expected.
<br>: The Line Break element - HTML: Hypertext Markup Language
WebHTMLElementbr
the text after the <br> begins again at the start of the next line of the text block.
... deprecated attributes clear indicates where to begin the next line after the break.
<input type="datetime-local"> - HTML: Hypertext Markup Language
we had to put the icons on a <span> next to the input, not on the input itself, because in chrome the generated content is placed inside the form control, and can't be styled or shown effectively.
...kpicker.style.display = 'block'; fallbacklabel.style.display = 'block'; // populate the days and years dynamically // (the months are always the same, therefore hardcoded) populatedays(monthselect.value); populateyears(); populatehours(); populateminutes(); } function populatedays(month) { // delete the current set of <option> elements out of the // day <select>, ready for the next set to be injected while(dayselect.firstchild){ dayselect.removechild(dayselect.firstchild); } // create variable to hold new number of days to inject var daynum; // 31 or 30 days?
<input type="search"> - HTML: Hypertext Markup Language
WebHTMLElementinputsearch
permitted values are: go, done, next, search, and send.
...in this section, we'll use the following css, which will place a check (tick) next to inputs containing valid values, and a cross next to inputs containing invalid values.
<input type="text"> - HTML: Hypertext Markup Language
WebHTMLElementinputtext
permitted values are: go, done, next, search, and send.
...in this section, we'll use the following css, which will place a check (tick) mark next to inputs containing valid values, and a cross (x) next to inputs containing invalid values.
<input>: The Input (Form Input) element - HTML: Hypertext Markup Language
WebHTMLElementinput
there is an example in the next column, but it's hidden!
... permitted values are: go, done, next, search, and send.
<link>: The External Resource Link element - HTML: Hypertext Markup Language
WebHTMLElementlink
webtv supports the use of the value next for rel to preload the next page in a document series.
... prefetch secure context this attribute identifies a resource that might be required by the next navigation and that the user agent should retrieve it.
<source>: The Media or Image Source element - HTML: Hypertext Markup Language
WebHTMLElementsource
if the type attribute isn't specified, the media's type is retrieved from the server and checked to see if the user agent can handle it; if it can't be rendered, the next <source> is checked.
... if the type attribute is specified, it's compared against the types the user agent can present, and if it's not recognized, the server doesn't even get queried; instead, the next <source> element is checked at once.
HTML documentation index - HTML: Hypertext Markup Language
WebHTMLIndex
163 <nextid>: the next id element (obsolete) element, html, obsolete, reference, web <nextid> is an obsolete html element that served to enable the next web designing tool to generate automatic name labels for its anchors.
... 232 link types: prerender attribute, html, link, link types, reference the prerender keyword for the rel attribute of the <link> element is a hint to browsers that the user might need the target resource for the next navigation, and therefore the browser can likely improve the user experience by preemptively fetching and processing the resource — for example, by fetching its subresources or performing some rendering in the background offscreen.
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.
... http/3 - http over quic the next major version of http, http/3, will use quic instead tcp/tls for the transport layer portion.
HTTP conditional requests - HTTP
what happens next is very unfortunate: when they commit back to the server, the modifications from the first client are discarded by the next client push, as this second client is unaware of the first client's changes to the resource.
...the winner will change from one time to the next.
Connection management in HTTP/1.x - HTTP
the next request is only issued once the response to the current request has been received.
... as they are affected by network latencies and bandwidth limitations, this can result in significant delay before the next request is seen by the server.
Proxy Auto-Configuration (PAC) file - HTTP
in that case, the next value will be used, etc.
... the auto-config file should be saved to a file with a .pac filename extension: proxy.pac and the mime type should be set to: application/x-ns-proxy-autoconfig next, you should configure your server to map the .pac filename extension to the mime type.
Concurrency model and the event loop - JavaScript
then, the event loop will process the next message in the queue (if there is one).
... event loop the event loop got its name because of how it's usually implemented, which usually resembles: while (queue.waitformessage()) { queue.processnextmessage() } queue.waitformessage() waits synchronously for a message to arrive (if one is not already available and waiting to be handled).
Expressions and operators - JavaScript
« previousnext » this chapter describes javascript's expressions and operators, including assignment, comparison, arithmetic, bitwise, logical, string, ternary and more.
...super.functiononparent([arguments]); « previousnext » ...
Functions - JavaScript
« previousnext » functions are one of the fundamental building blocks in javascript.
... « previousnext » ...
Introduction - JavaScript
« previousnext » this chapter introduces javascript and discusses some of its fundamental concepts.
... « previousnext » ...
Keyed collections - JavaScript
« previousnext » this chapter introduces collections of data which are indexed by a key; map and set objects contain elements which are iterable in the order of insertion.
... « previousnext » ...
Meta programming - JavaScript
« previousnext » starting with ecmascript 2015, javascript gains support for the proxy and reflect objects allowing you to intercept and define custom behavior for fundamental language operations (e.g.
...because reflect.defineproperty returns a boolean success status, you can just use an if...else block here: if (reflect.defineproperty(target, property, attributes)) { // success } else { // failure } « previousnext » ...
Character classes - JavaScript
for characters that are usually treated literally, indicates that the next character is special and not to be interpreted literally.
... for characters that are usually treated specially, indicates that the next character is not special and should be interpreted literally.
Regular expressions - JavaScript
« previousnext » regular expressions are patterns used to match character combinations in strings.
... 'dbbd' myre lastindex the index at which to start the next match.
TypeError: 'x' is not iterable - JavaScript
you must be certain that your iterator method returns an object which is an iterator, which is to say it must have a next method.
... const myemptyiterable = { [symbol.iterator]() { return [] // [] is iterable, but it is not an iterator -- it has no next method.
Generator.prototype.throw() - JavaScript
has the value false if the iterator was able to produce the next value in the sequence.
... function* gen() { while(true) { try { yield 42; } catch(e) { console.log('error caught!'); } } } const g = gen(); g.next(); // { value: 42, done: false } g.throw(new error('something went wrong')); // "error caught!" // { value: 42, done: false } specifications specification ecmascript (ecma-262)the definition of 'generator.prototype.throw' in that specification.
Generator - JavaScript
instead, a generator instance can be returned from a generator function: function* generator() { yield 1; yield 2; yield 3; } const gen = generator(); // "generator { }" instance methods generator.prototype.next() returns a value yielded by the yield expression.
... examples an infinite iterator function* infinite() { let index = 0; while (true) { yield index++; } } const generator = infinite(); // "generator { }" console.log(generator.next().value); // 0 console.log(generator.next().value); // 1 console.log(generator.next().value); // 2 // ...
Object.preventExtensions() - JavaScript
var nonextensible = { removable: true }; object.preventextensions(nonextensible); object.defineproperty(nonextensible, 'new', { value: 8675309 }); // throws a typeerror // in strict mode, attempting to add new properties // to a non-extensible object throws a typeerror.
... function fail() { 'use strict'; // throws a typeerror nonextensible.newproperty = 'fail'; } fail(); a non-extensible object's prototype is immutable: var fixed = object.preventextensions({}); // throws a 'typeerror'.
RegExpInstance.lastIndex - JavaScript
the lastindex is a read/write integer property of regular expression instances that specifies the index at which to start the next match.
... otherwise, lastindex is set to the next position following the most recent match.
RegExp - JavaScript
regexp.lastindex the index at which to start the next match.
... let str = '#foo#' let regex = /foo/y regex.lastindex = 1 regex.test(str) // true regex.lastindex = 5 regex.test(str) // false (lastindex is taken into account with sticky flag) regex.lastindex // 0 (reset after match failure) the difference between the sticky flag and the global flag with the sticky flag y, the next match has to happen at the lastindex position, while with the global flag g, the match can happen at the lastindex position or later: re = /\d/y; while (r = re.exec("123 456")) console.log(r, "and re.lastindex", re.lastindex); // [ '1', index: 0, input: '123 456', groups: undefined ] and re.lastindex 1 // [ '2', index: 1, input: '123 456', groups: undefined ] and re.lastindex 2 // [ '3', index:...
continue - JavaScript
the continue statement terminates execution of the statements in the current iteration of the current or labeled loop, and continues execution of the loop with the next iteration.
... the continue statement can include an optional label that allows the program to jump to the next iteration of a labeled loop statement instead of the current loop.
switch - JavaScript
if break is omitted, the program continues execution at the next statement in the switch statement.
... methods for multi-criteria case source for this technique is here: switch statement multiple cases in javascript (stack overflow) multi-case : single operation this method takes advantage of the fact that if there is no break below a case clause it will continue to execute the next case clause regardless if the case meets the criteria.
CSS and JavaScript animation performance - Web Performance
the callback function of the method is called by the browser before the next repaint on each frame.
...this can occur because css transitions/animations are simply resampling element styles in the main ui thread before each repaint event happens, which is almost the same as resampling element styles via a requestanimationframe() callback, also triggered before the next repaint.
Media - Progressive web apps (PWAs)
what next?
...the next page describes how you can change rules dynamically by using a programming language: javascript.
The building blocks of responsive design - Progressive web apps (PWAs)
x-card:nth-child(1) video, x-card:nth-child(2) img, x-card:nth-child(3) { margin-top: 17.5vw; } x-card:nth-child(1) button, x-card:nth-child(2) button { position: absolute; bottom: 0; } x-card:nth-child(2) button:nth-of-type(2) { bottom: 5.9rem; } x-card:nth-child(1) button { font-size: 7vw; } x-card:nth-child(2) button { font-size: 7vw; } the next rules do some sizing on the buttons inside the first two cards, and give all card contents a top margin so that their content won't be lost under the navigation buttons (see below).
... next up, the font-size of the buttons is set to 6.8vw.
Structural overview of progressive web apps - Progressive web apps (PWAs)
that way, the next time someone visits the app from the device, the ui loads from the cache immediately and any new content is requested from the server (if it isn’t available in the cache already).
... we can control what is requested from the server and what is retrieved from the cache with a service worker, which will be explained in detail in the next article — for now let's focus on the structure itself.
calcMode - SVG: Scalable Vector Graphics
four elements are using this attribute: <animate>, <animatecolor>, <animatemotion>, and <animatetransform> usage notes value discrete | linear | paced | spline default value linear animatable no discrete this specifies that the animation function will jump from one value to the next without any interpolation.
... spline interpolates from one value in the values list to the next according to a time function defined by a cubic bézier spline.
SVG documentation index - SVG: Scalable Vector Graphics
WebSVGIndex
12 svg 2 support in mozilla firefox, svg svg 2 is the next major version of the svg standard, which is a complete rework of the svg 1.2 draft.
...if no value is provided, the output will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute.
Basic Transformations - SVG: Scalable Vector Graphics
« previousnext » now we're ready to start distorting our beautiful images.
... « previousnext » ...
Clipping and masking - SVG: Scalable Vector Graphics
« previousnext » erasing part of what one has created might at first sight look contradictory.
... « previousnext » ...
Filter effects - SVG: Scalable Vector Graphics
« previousnext » there are situations, where basic shapes do not provide the flexibility you need to achieve a certain effect.
... source graphic primitive 1 primitive 2 primitive 3 primitive 4 primitive 5 primitive 6 « previousnext » ...
Gradients in SVG - SVG: Scalable Vector Graphics
« previousnext » perhaps more exciting than just fills and strokes is the fact that you can also create and apply gradients as either fills or strokes.
... « previousnext » ...
Other content in SVG - SVG: Scalable Vector Graphics
« previousnext » apart from graphic primitives like rectangles and circles, svg offers a set of elements to embed other types of content in images as well.
... « previousnext » ...
Patterns - SVG: Scalable Vector Graphics
WebSVGTutorialPatterns
« previousnext » patterns patterns are arguably one of the more confusing fill types to use in svg.
... « previousnext » ...
Positions - SVG: Scalable Vector Graphics
« previousnext » in this article, we examine how scalable vector graphics (svg) represents the positions and sizes of objects within a drawing context, including coordinate system and what a "pixel" measurement means in a scalable context.
...then, for all processing of svg content: [...] "1cm" equals "35.43307px" (and therefore 35.43307 user units) « previousnext » ...
SVG image element - SVG: Scalable Vector Graphics
« previousnext » the svg <image> element allows for raster images to be rendered within an svg object.
... « previousnext » ...
SVG and CSS - SVG: Scalable Vector Graphics
ading" x="-280" y="-270">svg demonstration</text> <text id="caption" x="-280" y="-250">move your mouse pointer over the flower.</text> <g id="flower"> <circle id="overlay" cx="0" cy="0" r="200" stroke="none" fill="url(#fade)"/> <use id="outer-petals" xlink:href="#petals"/> <use id="inner-petals" xlink:href="#petals" transform="rotate(9) scale(0.33)"/> </g> </svg> what next?
...the next page demonstrates this: xml data ...
SVG fonts - SVG: Scalable Vector Graphics
« previousnext » when svg was specified, support for web fonts was not widespread in browsers.
...t font-family="super sans">my text uses super sans</text> option: reference a remote font the above mentioned font-face-uri element allows you to reference an external font, hence allowing greater re-usability: <font> <font-face font-family="super sans"> <font-face-src> <font-face-uri xlink:href="fonts.svg#super_sans" /> </font-face-src> </font-face> </font> « previousnext » ...
Texts - SVG: Scalable Vector Graphics
WebSVGTutorialTexts
« previousnext » when talking about text in svg we have to differentiate two almost completely separate topics.
... </textpath> </text> <style><![cdata[ text{ dominant-baseline: hanging; font: 28px verdana, helvetica, arial, sans-serif; } ]]></style> </svg> « previousnext » ...
How to turn off form autocompletion - Web security
for this reason, many modern browsers do not support autocomplete="off" for login fields: if a site sets autocomplete="off" for a <form>, and the form includes username and password input fields, then the browser still offers to remember this login, and if the user agrees, the browser will autofill those fields the next time the user visits the page.
... if a site sets autocomplete="off" for username and password <input> fields, then the browser still offers to remember this login, and if the user agrees, the browser will autofill those fields the next time the user visits the page.
Understanding WebAssembly text format - WebAssembly
next, we’ll load our binary into a typed array called addcode (as described in fetching webassembly bytecode), compile and instantiate it, and execute our add function in javascript (we can now find add() in the exports property of the instance): webassembly.instantiatestreaming(fetch('add.wasm')) .then(obj => { console.log(obj.instance.exports.add(1, 2)); // "3" }); note: you can find t...
... next, we define a function that will be exported with the name callbyindex.
Using the WebAssembly JavaScript API - WebAssembly
if you have already compiled a module from another language using tools like emscripten, or loaded and run the code yourself, the next step is to learn more about using the other features of the webassembly javascript api.
... next, let’s create a simple html file called index.html in the same directory as your wasm file (can use our simple template if you haven’t got one easily available).
2015 MDN Fellowship Program - Archive of obsolete content
mdn fellows: what they did & what’s next blog post, september 23, 2015.
SDK API Lifecycle - Archive of obsolete content
if it's not ok to remove it, the team will continue to support migration and aim to remove the module in the next release.
XUL Migration Guide - Archive of obsolete content
next, we'll look at some of the main tasks involved in migrating: working with content scripts using the sdk's supported apis how to go beyond the supported apis when necessary, by: using third party modules using the sdk's low-level apis getting direct access to xpcom finally, we'll walk through a simple example.
panel - Archive of obsolete content
a panel's content is loaded as soon as it is created, before the panel is shown, and the content remains loaded when a panel is hidden, so it is possible to keep a panel around in the background, updating its content as appropriate in preparation for the next time it is shown.
simple-storage - Archive of obsolete content
because jpm run by default uses a fresh profile each time it runs, simple storage won't work with add-ons executed using jpm run - that is, stored data will not persist from one run to the next.
ui - Archive of obsolete content
you initialize a toolbar with an array of buttons and frames: var ui = require("sdk/ui"); var { actionbutton } = require("sdk/ui/button/action"); var { toolbar } = require("sdk/ui/toolbar"); var { frame } = require("sdk/ui/frame"); var previous = ui.actionbutton({ id: "previous", label: "previous", icon: "./icons/previous.png" }); var next = ui.actionbutton({ id: "next", label: "next", icon: "./icons/next.png" }); var play = ui.actionbutton({ id: "play", label: "play", icon: "./icons/play.png" }); var frame = ui.frame({ url: "./frame-player.html" }); var toolbar = ui.toolbar({ title: "player", items: [previous, next, play, frame] }); the toolbar appears just above the content window: sidebar a sidebar giv...
dev/panel - Archive of obsolete content
creating a tool next, you need to create a new tool using the dev/toolbox module, initializing it with the newly defined constructor.
event/core - Archive of obsolete content
once(target, type, listener) registers an event listener that is called only once: the next time an event of the specified type is emitted on the given event target.
test/utils - Archive of obsolete content
if the callback is defined, then the afterfn is considered asynchronous, and the callback must be invoked before the next test runs.
ui/button/action - Archive of obsolete content
if a property value for a node in the tree has not been set explicitly using state(), then it inherits its value from the next level up.
ui/button/toggle - Archive of obsolete content
if a property value for a node in the tree has not been set explicitly using state(), then it inherits its value from the next level up.
ui/toolbar - Archive of obsolete content
lds part of the user interface for a music player using action buttons for the controls and a frame to display art and the currently playing song: var { actionbutton } = require('sdk/ui/button/action'); var { toolbar } = require("sdk/ui/toolbar"); var { frame } = require("sdk/ui/frame"); var previous = actionbutton({ id: "previous", label: "previous", icon: "./icons/previous.png" }); var next = actionbutton({ id: "next", label: "next", icon: "./icons/next.png" }); var play = actionbutton({ id: "play", label: "play", icon: "./icons/play.png" }); var frame = new frame({ url: "./frame-player.html" }); var toolbar = toolbar({ title: "player", items: [previous, next, play, frame] }); the toolbar appears just above the content window: to destroy a toolbar call its des...
cfx - Archive of obsolete content
this means that any profile-specific data entered from one run of cfx will not, by default, be available in the next run.
jpm - Archive of obsolete content
this means that any profile-specific data entered from one run of jpm is not, by default, available in the next run.
Implementing the widget - Archive of obsolete content
next we'll add the code to create annotations.
Overview - Archive of obsolete content
next, we will implement the widget.
Annotator - Archive of obsolete content
next we'll give a quick overview of the annotator's design, then go through the implementation, step by step.
Creating Event Targets - Archive of obsolete content
this consists of three functions: on(): start listening for events or a given type once(): listen for the next occurrence of a given event, and then stop removelistener(): stop listening for events of a given type the on() and once() exports delegate to the corresponding function from event/core, and use bind() to pass the exports object itself as the target argument to the underlying function.
Creating Reusable Modules - Archive of obsolete content
} return path; } exports.promptforfile = promptforfile; md5.js next, create another file in "lib", called "md5.js".
Developing for Firefox Mobile - Archive of obsolete content
enable usb debugging on the device (step 2 of this link only) on the development machine: install version 1.5 or higher of the add-on sdk install the correct version of the android sdk for your device using the android sdk, install the android platform tools next, attach the device to the development machine via usb.
Localization - Archive of obsolete content
once you've installed it, open the add-on manager, and you'll see a new button labeled "update l10n" next to each add-on you've installed: click the button and you'll be prompted for a new .properties file for that add-on.
Cookies - Archive of obsolete content
reading existing cookies cookies for a given host, represented as nsicookie2 objects, can be enumerated as such: let enum = services.cookies.getcookiesfromhost("example.com"); while (enum.hasmoreelements()) { var cookie = enum.getnext().queryinterface(ci.nsicookie2); dump(cookie.host + ";" + cookie.name + "=" + cookie.value + "\n"); } all cookies, regardless of host, can be enumerated using services.cookies.enumerator rather than getcookiesfromhost().
Drag & Drop - Archive of obsolete content
next, setup the handlers so that files can be dropped on the application: function _dragover(aevent) { var dragservice = components.classes["@mozilla.org/widget/dragservice;1"].getservice(components.interfaces.nsidragservice); var dragsession = dragservice.getcurrentsession(); var supported = dragsession.isdataflavorsupported("text/x-moz-url"); if (!supported) supported = dra...
HTML to DOM - Archive of obsolete content
for that matter, we're going to load our html document first: var request = xmlhttprequest(); request.open("get", "http://example.org/file.html", false); request.send(null); our next step is to create the document object that will represent the dom into which we'll insert our newly-retrieved html: var doc = document.implementation.createhtmldocument("example"); doc.documentelement.innerhtml = request.responsetext; after this any manipulation that we might want to do will be something as simple as the following: doc.body.textcontent = "this is inside the body!"; using ...
JavaScript Debugger Service - Archive of obsolete content
next, we add code to the various hooks.
Preferences - Archive of obsolete content
) { // asubject is the nsiprefbranch we're observing (after appropriate qi) // adata is the name of the pref that's been changed (relative to asubject) switch (adata) { case "pref1": // extensions.myextension.pref1 was changed break; case "pref2": // extensions.myextension.pref2 was changed break; } } } myprefobserver.register(); and next, here is a more evolved version of the previous code better fit for code reuse both within a project and across projects (for example, using javascript code modules): /** * @constructor * * @param {string} branch_name * @param {function} callback must have the following arguments: * branch, pref_leaf_name */ function preflistener(branch_name, callback) { // keeping a reference to the o...
Tabbox - Archive of obsolete content
tab(){ var tabbox = document.getelementbyid("tabbox"); var currentindex = tabbox.selectedindex; if(currentindex>=0){ var tabs=document.getelementbyid("tabs"); var tabpanels=document.getelementbyid("tabpanels"); tabpanels.removechild(tabpanels.childnodes[currentindex]); tabs.removeitemat(currentindex); /*work around if last tab is removed, widget fails to advance to next tab*/ if(-1 == tabbox.selectedindex && tabs.childnodes.length>0){ tabbox.selectedindex=0; } } creating a close tab button to have a tab close button, you must configure the style.
Windows - Archive of obsolete content
var wenum = components.classes["@mozilla.org/embedcomp/window-watcher;1"] .getservice(components.interfaces.nsiwindowwatcher) .getwindowenumerator(); var index = 1; var windowname = "yourwindowname"; while (wenum.hasmoreelements()) { var win = wenum.getnext(); if (win.name == windowname) { win.focus(); return; } index++ } window.open("chrome://to/your/window.xul", windowname, "features"); uniquely identifying dom windows requires gecko 2.0(firefox 4 / thunderbird 3.3 / seamonkey 2.1) in gecko, each dom window has a unique 64-bit id number.
XPath - Archive of obsolete content
"your browser does't support this script!"); return; } var fields = [];//store the results if(window.activexobject) { var tobj = obj.documentelement.selectnodes("/root/field/item"); for(var i=0;i<tobj.length; i++) { fields.push(tobj[i].text); } } else { var tobj = obj.evaluate("/root/field/item",obj.documentelement,null, xpathresult.any_type, null); var tmp = tobj.iteratenext(); while(tmp) { fields.push(tmp.textcontent); tmp = tobj.iteratenext(); } } alert(fields); } //here is the demo xml file for xpath <?xml version="1.0"?> <root> <field> <item>art_id</item> <item>psection</item> <item>qkind</item> <item>qtitle</item> <item>question</item> <item>pic</item> <item>answer1</item> <item>answer2</item> <item>answer3</item> <item>a...
getAttributeNS - Archive of obsolete content
k:href while (((result = prefixatt.exec(attrs[j].nodename)) !== null) && thisitem.nodename !== '#document' && thisitem.nodename !== '#document-fragment') { var xmlnsprefix = new regexp('^xmlns:'+result[1]+'$'); // e.g., xmnls:xl, xmlns:xlink // check higher up for xmlns:prefix // check the current node and if necessary, check for the next matching local name up in the hierarchy (until reaching the document root) while (thisitem.nodename !== '#document' && thisitem.nodename !== '#document-fragment') { attrs2 = thisitem.attributes; for (var i = 0; i < attrs2.length; i++) { // search for any prefixed xmlns declaration on thisitem which match prefixes found above with desired local name ...
Communication between HTML and your extension - Archive of obsolete content
next i started investigating events, there are only a handful of events and the w3c documentation is pretty complete.
Extension Packaging - Archive of obsolete content
the extension will be found automatically by the extension manager the next time the application is launched.
Extension Etiquette - Archive of obsolete content
to maintain the default theme, avoid the use of an icon next to the menu items.
Listening to events in Firefox extensions - Archive of obsolete content
next it creates an internal object to receive all web progress events from the browser.
Firefox addons developer guide - Archive of obsolete content
next » introduction to extensions technologies used in developing extensions introduction to xul—how to build a more intuitive ui using xpcom—implementing advanced processes let's build a firefox extension firefox extensions and xul applications license and authors next » ...
Signing an extension - Archive of obsolete content
next, import your certificate.
Using the Stylesheet Service - Archive of obsolete content
in firefox 1.5 and 2, adding and removing such style sheets takes effect upon the next load of a page.
An Interview With Douglas Bowman of Wired News - Archive of obsolete content
besides the fact that the engineers can finally focus on building out the working functionality of the site rather than worrying about appearance or where the next spacer.gif is supposed to go?
JXON - Archive of obsolete content
if you have already have a dom tree from using xmlhttprequest, skip to the next paragraph.
MMgc - Archive of obsolete content
deleted items are stored in a per-block free list which is used if there are any otherwise we get the next free item at the end.
Source code directories overview - Archive of obsolete content
rhapsody contains source code for mac os x server (which is based on nextstep which is based on x-windows on unix) using yellow box (cocoa).
Autodial for Windows NT - Archive of obsolete content
the next time this address is tried and can't be found, the autodial service will be triggered and dialup will commence.
Enabling the behavior - retrieving tinderbox status - Archive of obsolete content
« previousnext » ...
Enabling the behavior - updating the status bar panel - Archive of obsolete content
« previousnext » ...
Enabling the behavior - updating the status periodically - Archive of obsolete content
« previousnext » ...
Finding the file to modify - Archive of obsolete content
[explain further, http://www.mozilla.org/xpfe/configchromespec.html] « previousnext » ...
Making a Mozilla installation modifiable - Archive of obsolete content
[mention that if you have perl, you can also do this with patch maker] « previousnext » ...
Making it into a dynamic overlay and packaging it up for distribution - Archive of obsolete content
« previousnext » ...
Prerequisites - Archive of obsolete content
« previousnext » ...
Specifying the appearance - Archive of obsolete content
« previousnext » ...
Tinderbox - Archive of obsolete content
« previousnext » ...
Creating a Mozilla Extension - Archive of obsolete content
difiable finding the file to modify finding the code to modify adding the structure specifying the appearance enabling the behavior - retrieving tinderbox status enabling the behavior - updating the status bar panel enabling the behavior - updating the status periodically making it into a static overlay making it into a dynamic overlay and packaging it up for distribution conclusion next » original document information author(s): myk melez last updated date: september 19, 2006 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative commons license | details.
Getting Started - Archive of obsolete content
ome/my_theme.jar!/editor/* /chrome/my_theme.jar!/global/* /chrome/my_theme.jar!/help/* /chrome/my_theme.jar!/messenger/* /chrome/my_theme.jar!/messenger-newsblog/* /chrome/my_theme.jar!/mozapps/* /chrome/my_theme.jar!/navigator/* /chrome.manifest /install.rdf /icon.png /preview.png make sure not to just zip up the my_theme parent directory since that will cause the drag and drop install in the next section to fail without error messages.
Creating a Skin for Firefox/Getting Started - Archive of obsolete content
repackaging jar now all you need to do is repackage a jar file with the following directory structure, using your favorite archive manager to create a zip archive: /browser/* /communicator/* /global/* /help/* /mozapps/* /contents.rdf /install.rdf /icon.png /preview.png make sure not to just zip up the my_theme parent directory since that will cause the drag and drop install in the next section to fail without error messages.
Dehydra Function Reference - Archive of obsolete content
the default value is the following directories: the directory of the dehydra script being processed the libs directory next to the gcc_dehydra.so plugin user script may add additional directories sys.aux_base_name exposes the base filename part of the file being compiled sys.frontend exposes the compiler frontend (e.g.
Installing Dehydra - Archive of obsolete content
you can skip the next section "building gcc 4.5" if you are using gcc 4.6 or above.
Embedding Mozilla in a Java Application using JavaXPCOM - Archive of obsolete content
nsieventqueueservice eventqueueservive = (nsieventqueueservice)servicemanager.getservicebycontractid("@mozilla.org/event-queue-service;1",nsieventqueueservice.ns_ieventqueueservice_iid); // next, we want to get the ui thread, since we want to open a window.
External CVS snapshots in mozilla-central - Archive of obsolete content
such changes will get overwritten without warning on importing the next updated version.
Documentation for BiDi Mozilla - Archive of obsolete content
baselevel: the base level (direction) of the paragraph.nextbidi: when a frame has been split, this points to the next frame (in logical order).
Downloading Nightly or Trunk Builds - Archive of obsolete content
the three common cases are "trunk", meaning the most recent version of mozilla; "branch", meaning the version before trunk (though it can be any version before trunk); and "next", meaning a possible version in the future.
Layout FAQ - Archive of obsolete content
block(body)(1)@035ff490 {120,120,8820,600} [state=00000010] sc=035ff264(i=2,b=0)< line 035ffc18: count=1 state=inline,clean,prevmarginclean,not impacted,not wrapped,before:nobr,after:linebr[0x5100] {0,0,330,300} < inline(span)(0)@035ffa04 next=035ffc48 next-continuation=035ffc48 {0,7,330,285} [content=0359ed50] [sc=035ff990]< text(0)@035ffa8c[0,4,t] next=035ffb1c {0,0,330,285} [state=41600020] sc=035ffa3c pst=:-moz-non-element< "\nabc" > frame(br)(1)@035ffb1c {330,225,0,0} [state=00000020] [content=035aebf0] > > the linebox is used to contain everything on a single line: example how do you fix inco...
JavaScript Client API - Archive of obsolete content
the next three methods are called by the sync algorithm when it determines that the state of the local application needs to be changed to keep it up-to-date with the user's remote activities.
Introducing the Audio API extension - Archive of obsolete content
the function returns the number of samples written, which is useful for the next writing.
Basics - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Page modifications - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Content - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Extenders - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Twitter - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Libraries - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
First run - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Enabling Experimental Jetpack Features - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Me - Archive of obsolete content
ArchiveMozillaJetpackMetaMe
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Settings - Archive of obsolete content
the user can open this interface from the "settings" button next to your jetpack on the "installed features" tab of the about:jetpack page.
Meta - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Jetpack Snippets - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
File access - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Simple Storage - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Storage - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Clipboard - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
System information - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
System - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Menu - Archive of obsolete content
ArchiveMozillaJetpackUIMenu
if the menu is hidden, it will reflect the changes when it is next shown.
Notifications - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Panel - Archive of obsolete content
ArchiveMozillaJetpackUIPanel
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Selection - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Tabs - Archive of obsolete content
ArchiveMozillaJetpackUITabs
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
slideBar - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
UI - Archive of obsolete content
read the experiment report for what we learned from it and the blog post announcing the first sdk release for what we're up to next!
Mozilla Application Framework in Detail - Archive of obsolete content
as personal connectivity expands from the desktop computer to new web-enabled products and devices, gecko is a browser engine that has been designed from the ground up to power a new generation of desktop browsers and browsing devices and to accelerate the growth and development of the next-generation internet.
Plug-n-Hack Phase2 - Archive of obsolete content
the next phase of plug-n-hack (pnh) is still being planned but is intended to allow browsers to advertise their capabilities to security tools.
BundleLibrary - Archive of obsolete content
slimtimer client slimtimer.webapp a very useful time-tracking tool with a "slim" client spagobi spagobi.webapp a web collaborative business intelligence platform streamy streamy.webapp ( streamy is a pretty powerful, next-gen online rss feed reader.
Priority Content - Archive of obsolete content
dependant on: updating dhtml web pages for next generation browsers on devedge the tune-up wizard (see below, in the wishlist section) mostly completed: popup window controls devedge article migrators: mathieu deaudelin there are inline examples on this page that cannot be migrated.
PyDOM - Archive of obsolete content
related topics pyxpcom: create and use xpcom components with python python-spidermonkey pydom samples: sample applications that use pydom pythonext: a firefox/xulrunner extension that can be used to install pydom ...
Space Manager High Level Design - Archive of obsolete content
the band of available space is searched (with nsblockreflowstate::getavailablespace); the float frame that is get from the passed nsfloatcache argument is reflowed and its rect is retrieved with getrect; the floats margins are added; check if the float can be placed in the actual band: if not advance to the next band; check the float type and if it can be added to the space manager; align the float to its containing block top if rule css2/9.5.1/4 is not respected; add the float using nsspacemanager::addrectregion compare the area that the float used to occupy with the area that it now occupies: if different, record the vertically affected interval using nsspacemanager::includeindamage use case 3: s...
Table Cellmap - Archive of obsolete content
a typical code segment to come from the table level down to the rowgroup level nscellmap* map = mfirstmap; while (map) { if (map->getrowcount() > rowindex) { // add your action here } rowindex -= map->getrowcount(); map = map->getnextsibling(); } data entry the usual way to populate the cellmap is via nstableframe::insertrows.
Table Layout Strategy - Archive of obsolete content
for instance one cell could have a large min width,the next could have a specified fixed width and another a specified pct width.
Cmdline tests - Archive of obsolete content
two use cases for the cmdline testsuite: use case 1: test the interactive cmdline debugger test contents: start avmshell -d test.abc, set breakpoint on a line, show local variable value, quit from cmdutils import * def run(): r=runtestlib() r.run_test( 'debugger locals', '%s -d testdata/debug.abc'%r.avmrd, input='break 53\ncontinue\nnext\ninfo locals\nnext\ninfo locals\nquit\n', expectedout=['local1 = undefined','local2 = 10','local2 = 15'] ) use case 2: test -memstats returns memory logs to stdout test contents: start avmshell -memstats test.abc, assert stdout contains 'gross stats', 'sweep m reclaimed n pages.' from cmdutils import * def run(): r=runtestlib() r.run_test(name='memstats', command...
Tamarin build documentation - Archive of obsolete content
importing the project into eclipse file >> import >> general >> existing projects into workspace click next the root directory should be the full path to your top-level tamarin-redux directory ensure the 'avmshell-project' project is checked in the 'projects' list uncheck 'copy projects into workspace' click finish building in eclipse 8 build configurations are included for macos with the gcc 4.0 toolchain: mac-32-release mac-64-release mac-32-debug mac-64-debug mac-32-release-debugger m...
Tamarin Releases - Archive of obsolete content
upcoming release name(s)release datelinks tc next~ april 2009roadmap current release namerelease datelinks tc "mar 2009" a5c9ed928c9603/27/09tamarin-devel announcement prior release name(s)release datelinks tc "feb 2009" a5c9ed928c9602/19/09tamarin-devel announcement tamarin-central rev 703:2cee46be9ce0 12/02/08tamarin-devel announcement ...
The life of an HTML HTTP request - Archive of obsolete content
if there are several frames created from a content node, then the first of these are called the "primary" node, and the following frames can be found by using the getnextinflow() method of nsiframe.
Treehydra Manual - Archive of obsolete content
for (let node = cgraph; node; node = node.next) { let fn = node.decl; if (decl_struct_function(fn)) { // fn has a body print(fn); let cfg = function_decl_cfg(fn); } } gimple reference for a detailed description of gimple see gcc/tree.def and gcc/cp/operators.def see also treehydra.js, gcc_compat.js, gcc_util.js, and gcc_print.js in the treehydra libs directory, which have many ports of gcc macros and oth...
Using Breakpoints in Venkman - Archive of obsolete content
to debug an extension, uncheck "exclude browser files" on the debug menu and your installed extension files should appear in the loaded scripts list.) venkman also indicates that one or more breakpoints have been set in the loaded scripts view, where red dots appear next to the files in which breakpoints have been set, along with the line number where the function begins whose code is being stopped.
Elements - Archive of obsolete content
next: bindings > binding element.
XML in Mozilla - Archive of obsolete content
g animation (smil) w3c recommendation mathml w3c recommendation mathml p3p (no longer supported) w3c recommendation p3p wsdl (no longer supported) w3c note web services xbl mozilla's xbl reference xul mozilla's xul reference roadmap next big tasks would include support for xpointer xpointer() scheme (bug 32832), xinclude (bug 201754), xml catalogs (bug 98413), xforms (bug 97806; work being done on implementing this as an extension), validating parser (bug 196355) and xml schemas.
Creating XPI Installer Modules - Archive of obsolete content
the next step is to zip up the contents of the working directory.
Install Wizards (aka: Stub Installers) - Archive of obsolete content
it then proceeds to extract the xpinstall engine and feed it the downloaded software packages to install.) the stub installer code includes: the logic to display the install wizard widgets and dialogs the code that reads in the configuration file (config.ini) and dynamically installs from the net or from local xpi modules found next to the installer binary the code that processes user selections the code that calls the xpinstall engine through xpistub the libxpnet code that is statically linked in the stub installers are written in code native to the platform using native widget toolkits including the windows api for windows, the mac toolbox for the mac, and gtk for the unix version.
execute - Archive of obsolete content
the optional blocking argument, when set to true, specifies that the installation should wait for this executable to finish before processing the next queued install command.
Installer Script - Archive of obsolete content
// create the plugins folder next to mozilla 34.
A XUL Bestiary - Archive of obsolete content
if no one at a particular level in the hierarchy is interested in the event, then the event bubbles up to the next highest level on out to the top of the hierarchy.
Flexgroup - Archive of obsolete content
when those elements have reached their maximum sizes, the elements with the next higher flexgroup are flexed.
handleCtrlTab - Archive of obsolete content
« xul reference home handlectrltab type: boolean if set to true or omitted, the tabbox will switch to the next tab when the control and tab keys are pressed.
hidespinbuttons - Archive of obsolete content
« xul reference home hidespinbuttons type: boolean if true, the number box does not have arrow buttons next to it to allow the user to adjust the value.
keytext - Archive of obsolete content
this text would appear next to a menuitem label if that menuitem is associated with the key element via its key attribute.
lastSelected - Archive of obsolete content
it will be opened by default the next time the preferences dialog is opened.
orient - Archive of obsolete content
horizontal child elements of the element are placed next to each other in a row in the order that they appear in the xul source.
pageid - Archive of obsolete content
this is used with the next attribute.
statedatasource - Archive of obsolete content
this information will be remembered for the next time the xul file is opened.
tabscrolling - Archive of obsolete content
if false, the default, the tab key moves the focus to the next element.
textbox.tabScrolling - Archive of obsolete content
if false, the default, the tab key moves the focus to the next element.as of gecko 1.9.1, this attribute is now always specified in lower case.
textbox.type - Archive of obsolete content
in addition, arrow buttons appear next to the textbox to let the user step through values.
XUL Events - Archive of obsolete content
the focus can be changed by clicking on another element, by pressing tab to switch to the next element in the tab order sequence, or by pressing 'back tab' to switch focus to the previous element in the tab order.
How to implement a custom XUL query processor component - Archive of obsolete content
sed by the builder hasbeenremoved: function() { } }; // basic wrapper for nsisimpleenumerator function templateresultset(aarrayofdata) { this._index = 0; this._array = aarrayofdata; } templateresultset.prototype = { queryinterface: xpcomutils.generateqi([components.interfaces.nsisimpleenumerator]), hasmoreelements: function() { return this._index < this._array.length; }, getnext: function() { return new templateresult(this._array[this._index++]); } }; // the query processor class - implements nsixultemplatequeryprocessor function templatequeryprocessor() { // our basic list of data this._data = [ {name: "mark", age: 36, hair: "brown", eye: "brown"}, {name: "bill", age: 25, hair: "red", eye: "black"}, {name: "joe...
Introduction to XUL - Archive of obsolete content
the next element in the example declares the menubar.
addTab - Archive of obsolete content
ArchiveMozillaXULMethodaddTab
it also adds the relatedtocurrent parameter; firefox uses this to decide whether the new tab should be inserted next to the current tab.
advanceSelectedTab - Archive of obsolete content
« xul reference home advanceselectedtab( dir, wrap ) return type: no return value if the argument dir is set to 1, the currently selected tab changes to the next tab.
checkAdjacentElement - Archive of obsolete content
if the argument dir is true, the next radio button is selected.
extra1 - Archive of obsolete content
ArchiveMozillaXULMethodextra1
the code in the onextra1 attribute is called.
extra2 - Archive of obsolete content
ArchiveMozillaXULMethodextra2
the code in the onextra2 attribute is called.
goForwardGroup - Archive of obsolete content
« xul reference home goforwardgroup() not in firefox return type: no return value go forward to the next group of tabs.
goTo - Archive of obsolete content
ArchiveMozillaXULMethodgoTo
the onwizardback and onwizardnext code is not called when using this function.
removeNotification - Archive of obsolete content
« xul reference home removenotification( item ) return type: element remove a notification, displaying the next one if the removed item is the current one.
Methods - Archive of obsolete content
isvisible ensureindexisvisible ensureselectedelementisvisible expandtoolbar extra1 extra2 focus getbrowseratindex getbrowserfordocument getbrowserfortab getbrowserindexfordocument getbutton getdefaultsession geteditor getelementsbyattribute getelementsbyattributens getformattedstring gethtmleditor getindexoffirstvisiblerow getindexofitem getitematindex getnextitem getnotificationbox getnotificationwithvalue getnumberofvisiblerows getpagebyid getpreviousitem getresultat getresultcount getresultvalueat getrowcount getsearchat getselecteditem getsession getsessionbyname getsessionresultat getsessionstatusat getsessionvalueat getstring goback gobackgroup godown goforward goforwardgroup gohome goto gotoindex...
ContextMenus - Archive of obsolete content
on windows, the context menu can also be opened by pressing the menu key on the keyboard (the key on many keyboards next to control with a menu image) or by pressing shift+f10.
MenuButtons - Archive of obsolete content
an arrow appears on the button next to the label or image indicating to the user that a menu is present.
Menus - Archive of obsolete content
if you do place other elements on a menubar, you may wish to align them on the far side rather than next to the other menus.
lastSelected - Archive of obsolete content
it will be opened by default the next time the preferences dialog is opened.
pageid - Archive of obsolete content
this is used with the next attribute.
Additional Install Features - Archive of obsolete content
next, we get the 'main' folder, again from the file system root.
XUL element attributes - Archive of obsolete content
horizontal child elements of the element are placed next to each other in a row in the order that they appear in the xul source.
button - Archive of obsolete content
horizontal child elements of the element are placed next to each other in a row in the order that they appear in the xul source.
key - Archive of obsolete content
ArchiveMozillaXULkey
this text would appear next to a menuitem label if that menuitem is associated with the key element via its key attribute.
notificationbox - Archive of obsolete content
removenotification( item ) return type: element remove a notification, displaying the next one if the removed item is the current one.
radiogroup - Archive of obsolete content
if the argument dir is true, the next radio button is selected.
scrollbox - Archive of obsolete content
<vbox> <label value="01 four score and seven years ago "/> <label value="02 our fathers brought forth on "/> <label value="03 this continent, a new nation, "/> <label value="04 conceived in liberty, and "/> <label value="05 dedicated to the proposition "/> <label value="06 that all men are created equal."/> </vbox> the next bunch of labels is similar, but if the container doesn't give enough room for it, scroll bars will sprout out of nowhere and allow the user to scroll around the big content in the small view space.
tabbox - Archive of obsolete content
handlectrltab type: boolean if set to true or omitted, the tabbox will switch to the next tab when the control and tab keys are pressed.
tabs - Archive of obsolete content
ArchiveMozillaXULtabs
normalize(), queryselector(), queryselectorall(), removeattribute(), removeattributenode(), removeattributens(), removechild(), removeeventlistener(), replacechild(), setattribute(), setattributenode(), setattributenodens(), setattributens(), setuserdata advanceselectedtab( dir, wrap ) return type: no return value if the argument dir is set to 1, the currently selected tab changes to the next tab.
timepicker - Archive of obsolete content
arrow buttons next to the fields allow the values to be adjusted with the mouse.
toolbarbutton - Archive of obsolete content
horizontal child elements of the element are placed next to each other in a row in the order that they appear in the xul source.
tree - Archive of obsolete content
ArchiveMozillaXULtree
this information will be remembered for the next time the xul file is opened.
window - Archive of obsolete content
a filename following the system keyword in a doctype declaration may silently fail to load and the only error message will be an undefined entity error on the next xul element.
Creating XULRunner Apps with the Mozilla Build System - Archive of obsolete content
so basically, almost everyone should be able to skip the next section.
XULRunner Hall of Fame - Archive of obsolete content
github bluegriffon the next-generation web editor based on the rendering engine of firefox.
MacFAQ - Archive of obsolete content
taking advantage of the core code "openurl" from "nscommandlineservicemac.cpp", you'll see that it looks for "browser.chromeurl" before defaulting to navigator.xul, and this is called when an xulrunner app is already running, so: create a default preference of "browser.chromeurl" that points to your new "hiddenwindow" as such: "chrome://myxul/content/hiddenwindow.xul" next take the code below and drop it in, to create the hiddenwindow.xul (note: the debug function and nsicommandline try/catch can be removed, all you need is the window.arguments[0]) <?xml version="1.0"?> <window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" id="myxul_hidden" windowtype="myxul:hiddenwindow" title="" width="0" height="0" persist="scree...
XULRunner tips - Archive of obsolete content
.xul chrome://inspector/content/viewers/dom/commandoverlay.xul to launch dom inspector in your application, you need to open its main window, with a command like this: window.open("chrome://inspector/content/inspector.xul", "", "chrome"); alternatively, the dom inspector may also be added as an extension: (if you already have inspector installed for another application you can skip to the next step) follow the instructions above through "unzip the package." create a file in the extensions directory of your application with the same name as the dom inspector id (inspector@mozilla.org) containing one line of text -- the exact path to the root directory of dom inspector (where the install.rdf is) like this one: /home/username/.mozilla/firefox/numbersandletters/extensions/inspector@mo...
application/http-index-format specification - Archive of obsolete content
quoted tokens are terminated by the next quote but may not contain carrage returns or new lines.
Gecko Compatibility Handbook - Archive of obsolete content
for standards-based alternatives, see updating dhtml web pages for next generation browsers.
2006-10-20 - Archive of obsolete content
a: email: preed@mozilla.com irc: preed on irc.mozilla.org phone: 650.903.0800 x256 uploading language packs to amo on october 17th benjamin smedberg brought the following to the attention of the localizers and the build team: that he is planning to upload the firefox 2 language packages currently located at http://releases.mozilla.org/pub/mozi...rc3/win32/xpi/ to addons.mozilla.org in the next few days.
Extentsions FAQ - Archive of obsolete content
those will be completely removed upon next application launch.
2006-10-13 - Archive of obsolete content
l10n freeze on seamonkey 1.1 code is imminent in the next days, as well as beta release.
2006-11-3 - Archive of obsolete content
seamonkey 1.0.6 and 1.1 beta upcoming the seamonkey projet is planning a security release of the stable 1.0 series as well as a beta for the 1.1 version, all possibly in the next days or week.
2006-12-01 - Archive of obsolete content
jay patael calls for help getting the next update ff 1.5.x and 2.x.
2006-12-01 - Archive of obsolete content
discussions none meetings gecko 1.0a1 community test day - there will be a community test day to test an early alpha of the next firefox release.
2006-10-20 - Archive of obsolete content
problem with creating / updating / exporting events how to add/update events in "home" calendar meetings planning the next calendar release meet regarding the views of next calendar release.
2006-11-10 - Archive of obsolete content
next steps for 24 hours view discussion about the improving of some features of calendar ex.
NPEvent - Archive of obsolete content
no key events are sent to the instance until the next getfocusevent.
NPN_InvalidateRect - Archive of obsolete content
« gecko plugin api reference « browser side plug-in api summary invalidates the specified portion of the plugin's drawing area, adding it to the region that needs to be redrawn when the plugin next repaints its contents.
NPAPI plugin reference - Archive of obsolete content
npn_invalidaterect invalidates the specified portion of the plugin's drawing area, adding it to the region that needs to be redrawn when the plugin next repaints its contents.
Writing a plugin for Mac OS X - Archive of obsolete content
xcode will create a "build" directory next to the project file, and if you built it in release mode, that folder in turn contains a "release" directory with the plugin inside it.
Encryption and Decryption - Archive of obsolete content
ssl also uses techniques of public-key encryption, which is described in the next section.
Common Firefox theme issues and solutions - Archive of obsolete content
this issue needs to be corrected in the next version of your theme.
Scratchpad - Archive of obsolete content
you'll see the autocomplete box, as shown below: the icon next to each suggestion indicates the type, and the currently highlighted suggestion gets a popup with more information.
Updating an extension to support multiple Mozilla applications - Archive of obsolete content
« previousnext » this article shows how to take an existing extension and update it so that it can be used in additional mozilla applications.
Using Web Standards in your Web Pages - Archive of obsolete content
the next-to-last section, summary of changes, outlines all the changes described in this article.
-moz-border-bottom-colors - Archive of obsolete content
/* single <color> value */ -moz-border-bottom-colors: #f0f0f0; /* multiple <color> values */ -moz-border-bottom-colors: #f0f0f0 #a0a0a0 #505050 #000000; /* global values */ -moz-border-bottom-colors: inherit; -moz-border-bottom-colors: initial; -moz-border-bottom-colors: unset; when an element has a border that is larger than a single css pixel, each line of pixels uses the next color specified in this property, from the outside in.
-moz-border-left-colors - Archive of obsolete content
/* single <color> value */ -moz-border-left-colors: #f0f0f0; /* multiple <color> values */ -moz-border-left-colors: #f0f0f0 #a0a0a0 #505050 #000000; /* global values */ -moz-border-left-colors: inherit; -moz-border-left-colors: initial; -moz-border-left-colors: unset; when an element has a border that is larger than a single css pixel, each line of pixels uses the next color specified in this property, from the outside in.
-moz-border-right-colors - Archive of obsolete content
/* single <color> value */ -moz-border-right-colors: #f0f0f0; /* multiple <color> values */ -moz-border-right-colors: #f0f0f0 #a0a0a0 #505050 #000000; /* global values */ -moz-border-right-colors: inherit; -moz-border-right-colors: initial; -moz-border-right-colors: unset; when an element has a border that is larger than a single css pixel, each line of pixels uses the next color specified in this property, from the outside in.
-moz-border-top-colors - Archive of obsolete content
/* single <color> value */ -moz-border-top-colors: #f0f0f0; /* multiple <color> values */ -moz-border-top-colors: #f0f0f0 #a0a0a0 #505050 #000000; /* global values */ -moz-border-top-colors: inherit; -moz-border-top-colors: initial; -moz-border-top-colors: unset; when an element has a border that is larger than a single css pixel, each line of pixels uses the next color specified in this property, from the outside in.
Processing XML with E4X - Archive of obsolete content
function xmlchildwalker (xml) { var i = 0; var child = xml.*[0]; while (child != undefined) { yield child; child = xml.*[++i]; } yield false; } var a = <a><b/><c/></a>; var xcw = xmlchildwalker(a); var child; while ((child = xcw.next()) !== false) { alert(child.toxmlstring()); // "<b/>" then "<c/>" } see also e4x e4x tutorial ...
Using JavaScript Generators in Firefox - Archive of obsolete content
yield; } generator = databaseoperation(); generator.next(); ...
Generator comprehensions - Archive of obsolete content
an array comprehension would create a full array in memory containing the doubled values: var doubles = [for (i in it) i * 2]; a generator comprehension on the other hand would create a new iterator which would create doubled values on demand as they were needed: var it2 = (for (i in it) i * 2); console.log(it2.next()); // the first value from it, doubled console.log(it2.next()); // the second value from it, doubled when a generator comprehension is used as the argument to a function, the parentheses used for the function call means that the outer parentheses can be omitted: var result = dosomething(for (i in it) i * 2); the significant difference between the two examples being that by using the generat...
Enumerator.atEnd - Archive of obsolete content
v = e.item(); s += drv.path + " - "; if (drv.isready) { var freegb = drv.freespace / bytespergb; var totalgb = drv.totalsize / bytespergb; s += freegb.tofixed(3) + " gb free of "; s += totalgb.tofixed(3) + " gb"; } else { s += "not ready"; } s += "<br />"; e.movenext(); } return(s); } requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer 8 standards, internet explorer 9 standards, and internet explorer 10 standards.
Enumerator.item - Archive of obsolete content
v = e.item(); s += drv.path + " - "; if (drv.isready) { var freegb = drv.freespace / bytespergb; var totalgb = drv.totalsize / bytespergb; s += freegb.tofixed(3) + " gb free of "; s += totalgb.tofixed(3) + " gb"; } else { s += "not ready"; } s += "<br />"; e.movenext(); } return(s); } requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer 8 standards, internet explorer 9 standards, and internet explorer 10 standards.
Enumerator.moveFirst - Archive of obsolete content
v = e.item(); s += drv.path + " - "; if (drv.isready) { var freegb = drv.freespace / bytespergb; var totalgb = drv.totalsize / bytespergb; s += freegb.tofixed(3) + " gb free of "; s += totalgb.tofixed(3) + " gb"; } else { s += "not ready"; } s += "<br />"; e.movenext(); } return(s); } requirements supported in the following document modes: quirks, internet explorer 6 standards, internet explorer 7 standards, internet explorer 8 standards, internet explorer 9 standards, and internet explorer 10 standards.
VBArray.dimensions - Archive of obsolete content
<head> <script type="text/vbscript"> <!-- function createvbarray() dim i, j, k dim a(2, 2) k = 1 for i = 0 to 2 for j = 0 to 2 a(j, i) = k k = k + 1 next next createvbarray = a end function --> </script> <script type="text/javascript"> <!-- function vbarraytest(vba) { var i; var a = new vbarray(vba); var s = ""; for (i = 1; i <= a.dimensions(); i++) { s += "the upper bound of dimension "; s += i + " is "; s += a.ubound(i); s += ".<br />"; } return(s); } --> </script> </head> <body> <script type=...
VBArray.getItem - Archive of obsolete content
<head> <script type="text/vbscript"> <!-- function createvbarray() dim i, j, k dim a(2, 2) k = 1 for i = 0 to 2 for j = 0 to 2 a(i, j) = k document.writeln(k) k = k + 1 next document.writeln("<br>") next createvbarray = a end function --> </script> <script type="text/javascript"> <!-- function getitemtest(vbarray) { var i, j; var a = new vbarray(vbarray); for (i = 0; i <= 2; i++) { for (j =0; j <= 2; j++) { document.writeln(a.getitem(i, j)); } } } --> </script> </head> <body> <script type="text/javascript"> <!-- ...
VBArray.lbound - Archive of obsolete content
<head> <script type="text/vbscript"> <!-- function createvbarray() dim i, j, k dim a(2, 2) k = 1 for i = 0 to 2 for j = 0 to 2 a(j, i) = k k = k + 1 next next createvbarray = a end function --> </script> <script type="text/javascript"> <!-- function vbarraytest(vba){ var i; var a = new vbarray(vba); var s = ""; for (i = 1; i <= a.dimensions(); i++) { s += "the lower bound of dimension "; s += i + " is "; s += a.lbound(i); s += ".<br />"; } return (s); } --> </script> </head> <body> <script type=...
VBArray.toArray - Archive of obsolete content
<head> <script type="text/vbscript"> <!-- function createvbarray() dim i, j, k dim a(2, 2) k = 1 for i = 0 to 2 for j = 0 to 2 a(j, i) = k document.writeln(k) k = k + 1 next document.writeln("<br>") next createvbarray = a end function --> </script> <script type="text/javascript"> <!-- function vbarraytest(vbarray) { var a = new vbarray(vbarray); var b = a.toarray(); var i; for (i = 0; i < 9; i++) { document.writeln(b[i]); } } --> </script> </head> <body> <script type="text/javascript"> <!-- vbarraytest(createvbarray()); --> </...
VBArray.ubound - Archive of obsolete content
<head> <script type="text/vbscript"> <!-- function createvbarray() dim i, j, k dim a(2, 2) k = 1 for i = 0 to 2 for j = 0 to 2 a(j, i) = k k = k + 1 next next createvbarray = a end function --> </script> <script type="text/javascript"> <!-- function vbarraytest(vba) { var i; var a = new vbarray(vba); var s = ""; for (i = 1; i <= a.dimensions(); i++) { s += "the upper bound of dimension "; s += i + " is "; s += a.ubound(i); s += ".<br />"; } return (s); } --> </script> </head> <body> <script type...
VBArray - Archive of obsolete content
<head> <script type="text/vbscript"> <!-- function createvbarray() dim i, j, k dim a(2, 2) k = 1 for i = 0 to 2 for j = 0 to 2 a(j, i) = k document.writeln(k) k = k + 1 next document.writeln("<br />") next createvbarray = a end function --> </script> <script type="text/javascript"> <!-- function vbarraytest(vbarray){ var a = new vbarray(vbarray); var b = a.toarray(); var i; for (i = 0; i < 9; i++) { document.writeln(b[i]); } } --> </script> </head> <body> <script type="text/javascript"> <!-- vbarraytest(createvbarray()); --> <...
New in JavaScript - Archive of obsolete content
ecmascript next support implementation status for upcoming ecma-262 features as per the yearly (es2016/es2017/es2018/...) release schedule in mozilla-based engines and products.
Archived JavaScript Reference - Archive of obsolete content
see also the newer version of date.prototype.tolocaledatestring().ecmascript 2016 to es.next support in mozillaexpression closuresexpression closures are a shorthand function syntax for writing simple functions.for each...inthe for each...in statement iterates a specified variable over all values of object's properties.
Properly Using CSS and JavaScript in XHTML Documents - Archive of obsolete content
this recommendation may seem rather strong however it is made with the intention of reducing future problems with xhtml content when the transition from serving xhtml as text/html to application/xhtml+xml occurs in the next few years.
StopIteration - Archive of obsolete content
var a = { x: 10, y: 20 }; var iter = iterator(a); console.log(iter.next()); // ["x", 10] console.log(iter.next()); // ["y", 20] console.log(iter.next()); // throws stopiteration throwing stopiteration.
Reference - Archive of obsolete content
make a footnote on each page, pointing to a page listing "hot new javascript features", which in turn points to 1 page for 1.6, 1 page for 1.7, etc., listing all the differences from one version to the next ?
Building Mozilla XForms - Archive of obsolete content
skip to the next section.
Implementation Status - Archive of obsolete content
4.3.1 xforms-rebuild supported 4.3.2 xforms-recalculate supported 4.3.3 xforms-revalidate supported 4.3.4 xforms-refresh supported 4.3.5 xforms-reset supported 4.3.6 xforms-next xforms-previous supported 4.3.7 xforms-focus supported 4.3.8 xforms-help xforms-hint supported 4.3.9 xforms-submit partial see section 11.2 for more details 4.3.10 xforms-submit-serialize supported ...
XForms Input Element - Archive of obsolete content
it consists of a text field for direct user input next to a button that when activated will 'drop down' a calender widget that the user can also interact with (xhtml/xul).
Styling Abbreviations and Acronyms - Archive of obsolete content
in mozilla, placing the mouse pointer over the element and leaving it for a moment will cause the contents of the title attribute to appear as a tooltip next to the mouse pointer.
Windows Media in Netscape - Archive of obsolete content
the next subsection discusses them in detail.
Archive of obsolete content
adding preferences to an extension this article takes the creating a dynamic status bar extension sample to the next level, adding a popup menu that lets you quickly switch between multiple stocks to watch.
Using the DOM File API in chrome code - Extensions
instead, use the nsifile::append() method as explained in the next section.
Introduction to game development for the Web - Game development
lock api language javascript (or c/c++ using emscripten to compile to javascript) networking webrtc and/or websockets storage indexeddb or the "cloud" web html, css, svg (and much more!) the business case as a game developer, whether you're an individual or a large game studio, you want to know why it makes sense to target the web with your next game project.
Game monetization - Game development
the worst cases were when you could use real money to pay for getting advantages over other players, or when they restricted access to the next stages of the game unless the players paid.
2D collision detection - Game development
the complexity of an algorithm like this means we will need to consider performance optimization, covered in the next section.
Explaining basic 3D theory - Game development
the last step is viewport transformation, which involves outputting everything for the next step in the rendering pipeline.
Building up a basic demo with Babylon.js - Game development
let's deal with that next.
Building up a basic demo with Three.js - Game development
our material is now ready, what next?
3D games on the Web - Game development
where to go next with this article we just scratched the surface of what's possible with currently available technologies.
Unconventional controls - Game development
we next add these lines after all the event listeners for keyboard and mouse, but before the draw method: var todegrees = 1 / (math.pi / 180); var horizontaldegree = 0; var verticaldegree = 0; var degreethreshold = 30; var grabstrength = 0; right after that we use the leap's loop method to get the information held in the hand variable on every frame: leap.loop({ hand: function(hand) { hori...
Finishing up - Game development
we can also reset the ball and the paddle positions when the player begins with their next life.
Visual-js game engine - Game development
er for server part of application (important : www is not secure place) 4) select folder for client part of application ( any path in www) 5) new app name will appear in project list , select and click open application 6) open your server folder : install node.js modules one way - use windows bat-s file (in server root folder with prefix install_ ) second way - open cmd terminal and enter next command : npm install mysql npm install delivery npm install express npm install mkdirp npm install socket.io npm install nodemailer@0.7.0 very easy installation and project files generator .
Visual JS GE - Game development
next, run the command server_instance/node res.js.
Gecko FAQ - Gecko Redirect 1
the original mozilla browser, first released as navigator 1.0, was developed rapidly by a small team that was passionate about creating the next killer app, and they succeeded.
Block (CSS) - MDN Web Docs Glossary: Definitions of Web-related terms
for example, <p> is by default a block-level element, whereas <a> is an inline element — you can put several links next to one another in your html source and they will sit on the same line as one another in the rendered output.
Block - MDN Web Docs Glossary: Definitions of Web-related terms
for example, <p> is by default a block-level element, whereas <a> is an inline element — you can put several links next to one another in your html source and they will sit on the same line as one another in the rendered output.
Bézier curve - MDN Web Docs Glossary: Definitions of Web-related terms
the end points of the lines are then steadily moved to the next point.
Fragmentainer - MDN Web Docs Glossary: Definitions of Web-related terms
when breakable content would overflow a fragmentainer in the block dimension, it breaks into the next container in its fragmentation context instead.
HTTP header - MDN Web Docs Glossary: Definitions of Web-related terms
the value finish at the next crlf or at the end of the message.
Packet - MDN Web Docs Glossary: Definitions of Web-related terms
a packet contains: hop limit a hop occurs when a packet is passed from one network to the next network.
Routers - MDN Web Docs Glossary: Definitions of Web-related terms
this middleware module is used for all url functions, as these are given a path to a file that is rendered to open the next page.
Test your skills: CSS and JavaScript accessibility - Learn web development
css accessibility 2 in this next task you are presented with a simple bit of content — just headings and paragraphs.
Mobile accessibility - Learn web development
previous overview: accessibility next with web access on mobile devices being so popular and renowned platforms such as ios and android having full-fledged accessibility tools, it is important to consider the accessibility of your web content on these platforms.
Advanced styling effects - Learn web development
in this next example we are applying our filter to a box, and comparing it to a box shadow.
Fundamental CSS comprehension - Learn web development
taking care of the selectors and rulesets provided in the css resource file: next up, we'd like you to look at the four selectors, and calculate the specificity for each one.
Test your skills: floats - Learn web development
then we want the first line of text to display next to that element, but the following line of text (which has a class of .below) to display underneath it.
Multiple-column layout - Learn web development
previous overview: css layout next the multiple-column layout specification gives you a method of laying content out in columns, as you might see in a newspaper.
create fancy boxes - Learn web development
.fancy { position: relative; background-color: #ffc; padding: 2rem; text-align: center; max-width: 200px; } .fancy::before { content: ""; position : absolute; z-index : -1; bottom : 15px; right : 5px; width : 50%; top : 80%; max-width: 200px; box-shadow: 0px 13px 10px black; transform: rotate(4deg); } what's next in many ways, making a fancy box is mostly about adding color and images within the background, so it could worth digging into managing colors and images.
Typesetting a community school homepage - Learn web development
make it so that external links have the external link icon inserted next to them.
Styling text - Learn web development
with the basics of the css language covered, the next css topic for you to concentrate on is styling text — one of the most common things you'll do with css.
Learn to style HTML using CSS - Learn web development
styling text with the basics of the css language covered, the next css topic for you to concentrate on is styling text — one of the most common things you'll do with css.
What text editors are available? - Learn web development
these instructions will help you specify that your os should open files in your preferred editor when you double-click them: windows windows 8 windows 7 older systems mac os x linux ubuntu unity gnome kde next steps now that you have a good text editor, you could take some time to finalize your basic working environment, or, if you want to play with it right away, write your very first web page.
How do you make sure your website works properly? - Learn web development
a simple checklist check for 404s make sure all webpages are behaving as you expect check your website in several browsers to make sure it renders consistently next steps congratulations, your website is up and running for anyone to visit.
How can we design for all types of users? - Learn web development
back when we had newspapers, printers realized that the reader's eyes would have trouble going from one line to the next if the lines were too long.
What is the difference between webpage, website, web server, and search engine? - Learn web development
here is an instance of firefox showing a google search box as its default startup page: next steps dig deeper: what is a web server see how web pages are linked into a web site: understanding links on the web ...
What are hyperlinks? - Learn web development
next steps now you'll want to set up some webpages with links.
What is a Domain Name? - Learn web development
next steps okay, we talked a lot about processes and architecture.
What is a web server? - Learn web development
next steps now that you are familiar with web servers, you could: read up on how much it costs to do something on the web learn more about various software you need to create a website move on to something practical like how to upload files on a web server.
What is accessibility? - Learn web development
more details please refer to: wikipedia article about accessibility wai (w3c's web accessibility initiative) next steps accessibility can impact both a website's design and technical structure.
What software do I need to build a website? - Learn web development
next steps some of this software is free, but not all of it.
Test your skills: Basic controls - Learn web development
basic controls 2 the next task requires you to create working sets of checkboxes and radio buttons, from the provided text labels.
Test your skills: HTML5 controls - Learn web development
html5 controls 2 next, we want you to implement a slider control to allow the user to choose a maximum number of people to invite to their party.
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>.
HTML Cheatsheet - Learn web development
by default, "inline elements" appear next to one another in a webpage.
Use JavaScript within a webpage - Learn web development
take your webpages to the next level by harnessing javascript.
Adding vector graphics to the Web - Learn web development
previous overview: multimedia and embedding next vector graphics are very useful in many circumstances — they have small file sizes and are highly scalable, so they don't pixelate when zoomed in or blown up to a large size.
Mozilla splash page - Learn web development
next, create a 1200px wide landscape version of red-panda.jpg, and a 600px wide portrait version that shows the panda in more of a close up shot.
Responsive images - Learn web development
previous overview: multimedia and embedding next in this article, we'll learn about the concept of responsive images — images that work well on devices with widely differing screen sizes, resolutions, and other such features — and look at what tools html provides to help implement them.
Multimedia and Embedding - Learn web development
video and audio content next, we'll look at how to use the html5 <video> and <audio> elements to embed video and audio on our pages, including basics, providing access to different file formats to different browsers, adding captions and subtitles, and how to add fallbacks for older browsers.
Assessment: Structuring planet data - Learn web development
ensure all the content is placed into the right cells — in the raw data, each row of planet data is shown next to its associated planet.
Image gallery - Learn web development
it sets the width of any images inside the thumb-bar <div> (so-called "thumbnail" images) to 20%, and floats them to the left so they sit next to one another on a line.
Making decisions in your code — conditionals - Learn web development
overview: building blocks next in any programming language, the code needs to make decisions and carry out actions accordingly depending on different inputs.
Silly story generator - Learn web development
next we want to replace the three placeholders in the newstory string — :insertx:, :inserty:, and :insertz: — with the strings stored in xitem, yitem, and zitem.
Test your skills: Arrays - Learn web development
next, modify the first two items in the array using simple bracket notation and assignment.
Test your skills: Strings - Learn web development
strings 3 in the next string task, you are given the same quote that you ended up with in the previous task, but it is somewhat broken!
JavaScript First Steps - Learn web development
handling text — strings in javascript next we'll turn our attention to strings — this is what pieces of text are called in programming.
Solve common problems in your JavaScript code - Learn web development
how do you skip to the next iteration of a loop if a certain condition is met?
Test your skills: Object-oriented JavaScript - Learn web development
oojs 2 next up we want you to take the shape class you saw in task #1 (including the calcperimeter() method) and recreate it using es class syntax instead.
Test your skills: Object basics - Learn web development
object basics 2 in our next task, we want you to have a go at creating your own object literal to represent one of your favourite bands.
Aprender y obtener ayuda - Learn web development
also, it might be a good idea to have some sub-goals worked out to allow you to keep track of where you are more easily, for example: html and css basics learnt by summer javascript basics learnt by december example website project built by next april etc.
Learn web development
beyond the basics: if you have a bit of knowledge already, the next step is to learn html and css in detail: start with our introduction to html module and move on to our css first steps module.
Accessibility API cross-reference
n/a expandable expandable implied by the presence of the aria-expanded attribute, regardless of value can extend selection extselectable n/a n/a not clipped to boundary of parent, does not auto-move with parent floating n/a n/a identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.
Accessibility Features in Firefox
at my next opportunity, i intend to convert my family over to it too." darren paskell, from window-eyes beta testing list firefox works with popular screen readers, with the best support currently coming from gw micro's window-eyes 5.5.
Accessibility/LiveRegionDevGuide
container-relevant politeness advancing setting all off persisting politeness level navigation navigate to next and previous live regions bookmarking ...
CSUN Firefox Materials
at my next opportunity, i intend to convert my family over to it too.
Frequently Asked Questions for Lightweight themes
next to the theme you want to undo, click the disable button.
Adding phishing protection data providers
when installing a new provider, you should use the next unused number.
Browser chrome tests
clean up functions are also guaranteed to be called if your test timeouts, so you can ensure that in case of timeouts you won't pollute next running tests and causing them to fail.
Cookies Preferences in Mozilla
(the old prefs are network.cookie.lifetime.enabled, network.cookie.lifetime.behavior, and network.cookie.warnaboutcookies.) true = prefs have been migrated false = migrate prefs on next startup original document information author(s): mike connor last updated date: may 22, 2004 copyright information: portions of this content are © 1998–2007 by individual mozilla.org contributors; content available under a creative commons license | details.
Creating a Language Pack
x-testing: changed: 6 missinginfiles: 6124 missing: 5 0% of entries changed this step is not necessary anymore to create the language pack, because it is included in the next command.
Debugging Frame Reflow
it provides the following information for each frame at the start of its reflow reflow reason available width, available height computed width, computed height the previous and the next frame in flow and a count number.
Simple Instantbird build
this means deleting the object directory so that your next build is completely fresh.
ESLint
do something like: // eslint-disable-next-line no-undef it.does.not.exist(); need more help?
Working with Mozilla source code
creating a patch once you've made a change to the mozilla code, the next step (after making sure it works) is to create a patch and submit it for review.
Developer guide
dxr next generation of searching mozilla's source code.
Displaying Places information using views
<tree type="places" place="place:terms=mozilla&amp;onlybookmarked=1&amp;querytype=1"> <treecols> <treecol id="title" label="my bookmarks" flex="1" primary="true" /> </treecols> <treechildren /> </tree> the next example does the same as the last but uses javascript to set the tree's place attribute: var histserv = cc["@mozilla.org/browser/nav-history-service;1"].
Experimental features in Firefox
nightly 59 no developer edition 59 no beta 59 no release 59 no preference name security.mixed_content.block_object_subrequest insecure page labeling these two preferences add a "not secure" text label in the address bar next to the traditional lock icon when a page is loaded insecurely (that is, using http rather than https).
HTMLIFrameElement.findAll()
searchform.addeventlistener('submit', function(e) { e.preventdefault(); browser.findall(searchbar.value, 'case-sensitive'); searchactive = true; prev.disabled = false; next.disabled = false; searchbar.blur(); }); specification not part of any specification.
HTMLIFrameElement.goForward()
by calling this method, the browser <iframe> changes its location to the next location available in its navigation history, which sends a series of related events: mozbrowserlocationchange, mozbrowserloadstart and so on.
mozbrowserfindchange
this includes htmliframeelement.findall(), htmliframeelement.findnext(), and htmliframeelement.clearmatch().
Hacking with Bonsai
these people, when they check in, will be "on the hook" for the next day's build.
How to get a stacktrace with WinDbg
(start->all programs->debugging tools for windows->windbg) next, open the "file" menu and choose "open executable...".
Extending a Protocol
custom protocol - pecho.ipdl this next part requires us to both specify the protocol and actually implement everything in c++.
JavaScript-DOM Prototypes in Mozilla
this means that the next time the name of a class constructor is resolved in the same scope, say htmlanchorelement, the code will resolve the name htmlanchorelement, find the parent name, which is htmlelement, and resolve that, but since we've already resolved htmlelement as a result of resolving the name htmlimageelement earlier, the recursion will stop right there.
JavaScript Tips
prefer to loop through childnodes rather than using first/lastchild with next/previoussibling.
DeferredTask.jsm
by design, this method doesn't provide a way for the caller to detect when the next execution terminates, or collect a result.
Following the Android Toasts Tutorial from a JNI Perspective
when declaring methods, the signatures of the types go right next to each other without any spacing.
PromiseWorker.jsm
next, the promiseworker.js file should be brought in with the require() method.
Using JavaScript code modules
for example: components.utils.import("resource://app/my_module.jsm"); alert(foo()); // displays "foo" alert(bar.size + 3); // displays "6" alert(dummy); // displays "dummy is not defined" because 'dummy' was not exported from the module note: when you're testing changes to a code module, be sure to change the application's build id (e.g., the version) before your next test run; otherwise, you may find yourself running the previous version of your module's code.
WebRequest.jsm
next, return an object from the listener that contains instructions for what the browser should do with this request.
Webapps.jsm
doinstall(adata, amm) doinstallpackage: function doinstallpackage(adata, amm) pushcontentaction: function(windowid) popcontentaction: function(windowid) actioncancelled: function(windowid) denyinstall: function(adata) _setupapp: function(adata, aid) _cloneapp: function(adata, anewapp, alocalemanifest, amanifest, aid, alocalid) _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(areques...
Localization content best practices
a developer could be tempted to reuse the same string "bookmark" in the button to add a bookmark, and in the header for the next dialog.
Localizing with Mercurial
the next step will send your changes to your remote repo via push.
Localizing with Pontoon
next, simply select the project you want to work on and your locale from the dropdown menus.
Patching a Localization
next thing you need to know is which localization version you want to patch.
Initial setup
« previousnext » ...
Translation phase
« previousnext » ...
Localization quick start guide
next » ...
Creating localizable web applications
"</a> &raquo;</b>", $locale_conf->url('/demo_create_3'));?></div> using &laquo; and &raquo; should be ok here for rtl languages (they are flipped correctly if there are no latin characters next to them, which there aren't any), so let's leave it as it is.
Localization formats
html/php maybe you are designing a project that has relatively small translation needs like three to four lines (or more) of content asking users to update to the next version of software available.
Mozilla Web Developer FAQ
the almost standards mode is like the standards mode except it addresses the issue of the next question by rendering table cells with images in the traditional way.
Mozilla projects on GitHub
servo the next-generation rendering engine.
Mozilla Quirks Mode Behavior
in quirks mode floated tables never move to the next "line" if they don't fit next to other floats, they just keep widening the page (see bug 43086).
GC and CC logs
to fix a leak, the next step is to figure out why the rooting object is alive.
Profiling with Instruments
in the top left, next to the record and pause button, there will be a "[machine name] > all processes".
Profiling with the Firefox Profiler
i haven’t yet had the opportunity to try this, but i hope to next week.
tools/power/rapl
note that if you do change this file, its contents may reset when the machine is next rebooted.
Preference reference
the xul cache is serialized and saved between mozilla sessions in the xul fastload file, which saves a “compiled” version of the xul and javascript in a document to disk for faster startup the next time the application runs.reader.parse-on-load.force-enabledthe preference reader.parse-on-load.force-enabled controls if the reader mode used in firefox mobile should be enabled independent of the memory available in the device.
Productization guide
next » ...
AsyncTestUtils extended framework
thanks to javascript enhancements available on the mozilla platform, it is possible for a function to yield control in such a way that the function stops running at the line where you use a yield statement and resumes execution on the next line when resumed.
McCoy
we hope to resolve this for the next release - or around the year 2100.
Linked Lists
linked list macros macros that create and operate on linked lists are: pr_init_clist pr_init_static_clist pr_append_link pr_insert_link pr_next_link pr_prev_link pr_remove_link pr_remove_and_init_link pr_insert_before pr_insert_after pr_clist_is_empty pr_list_head pr_list_tail ...
Long Long (64-bit) Integers
« previousnext » this chapter describes the global functions you use to perform 64-bit integer operations.
PLHashEnumerator
syntax #include <plhash.h> typedef printn (pr_callback *plhashenumerator)(plhashentry *he, printn index, void *arg); /* return value */ #define ht_enumerate_next 0 /* continue enumerating entries */ #define ht_enumerate_stop 1 /* stop enumerating entries */ #define ht_enumerate_remove 2 /* remove and free the current entry */ #define ht_enumerate_unhash 4 /* just unhash the current entry */ description plhashenumerator is a function type used in the enumerating a hash table.
PRCList
syntax #include <prclist.h> typedef struct prcliststr prclist; typedef struct prcliststr { prclist *next; prclist *previous; }; description prclist defines a node in a circular linked list.
PRIOMethods
if a layer provides no functionality, it should call the next lower (higher) function of the same name (for example, the "close" method would return fd->lower->method->close(fd->lower)).
PRLogModuleInfo
syntax #include <prlog.h> typedef struct prlogmoduleinfo { const char *name; prlogmodulelevel level; struct prlogmoduleinfo *next; } prlogmoduleinfo; ...
PR_CWait
the thread waiting on the monitor resumes execution when the monitor is notified (assuming the thread is the next in line to receive the notify) or when the interval specified in the timeout parameter has been exceeded.
PR EnumerateAddrInfo
returns the function returns the value you should specify in the enumptr parameter for the next call of the enumerator.
PR_EnumerateHostEnt
returns the function returns one of the following values: if successful, the function returns the value you should specify in the enumindex parameter for the next call of the enumerator.
NSPR API Reference
functions memory allocation macros string operations pl_strlen pl_strcpy pl_strdup pl_strfree floating point number to string conversion pr_strtod pr_dtoa pr_cnvtf long long (64-bit) integers bitmaps formatted printing linked lists linked list types prclist linked list macros pr_init_clist pr_init_static_clist pr_append_link pr_insert_link pr_next_link pr_prev_link pr_remove_link pr_remove_and_init_link pr_insert_before pr_insert_after dynamic library linking library linking types prlibrary prstaticlinktable library linking functions pr_setlibrarypath pr_getlibrarypath pr_getlibraryname pr_freelibraryname pr_loadlibrary pr_unloadlibrary pr_findsymbol pr_findsymbolandlibrar...
Function_Name
avoid describing the return until the next section, for example: this function looks in the nsscryptocontext and the nsstrustdomain to find the certificate that matches the der-encoded certificate.
NSS CERTVerify Log
*/ unsigned int depth; /* how far up the chain are we */ void *arg; /* error specific argument */ struct certverifylognodestr *next; /* next in the list */ struct certverifylognodestr *prev; /* next in the list */ }; the list is a doubly linked null terminated list sorted from low to high based on depth into the cert chain.
Cryptography functions
pk11_getkeystrength mxr 3.2 and later pk11_getmechanism mxr 3.2 and later pk11_getminimumpwdlength mxr 3.4 and later pk11_getmodinfo mxr 3.6 and later pk11_getmodule mxr 3.3 and later pk11_getmoduleid mxr 3.2 and later pk11_getnextgenericobject mxr 3.9.2 and later pk11_getnextsafe mxr 3.4 and later pk11_getnextsymkey mxr 3.4 and later pk11_getpadmechanism mxr 3.4 and later pk11_getpbecryptomechanism mxr 3.12 and later pk11_getpbeiv mxr 3.6 and later pk11_get...
Build instructions for JSS 4.3.x
next, you should read the instructions on using jss.
Build instructions for JSS 4.4.x
build instructions for jss 4.4.x newsgroup: mozilla.dev.tech.crypto to build jss see upstream jss build/test instructions next, you should read the instructions on using jss.
NSS 3.46 release notes
ug 1574670 - remove expired deutsche telekom root ca 2 root certificate sha-256 fingerprint: b6191a50d0c3977f7da99bcdaac86a227daeb9679ec70ba3b0c9d92271c170d3 bug 1566569 - remove swisscom root ca 2 root certificate sha-256 fingerprint: f09b122c7114f4a09bd4ea4f4a99d558b46e4c25cd81140d29c05613914c3841 upcoming changes to default tls configuration the next nss team plans to make two changes to the default tls configuration in nss 3.47, which will be released in october: tls 1.3 will be the default maximum tls version.
NSS 3.47 release notes
upcoming changes to default tls configuration the next nss team plans to make two changes to the default tls configuration in nss 3.48, which will be released in early december: tls 1.3 will be the default maximum tls version.
NSS API Guidelines
next we examine global data, including function local static structures.
Enc Dec MAC Using Key Wrap CertReq PKCS10 CSR
progname + 1 : argv[0]; /* parse command line arguments */ optstate = pl_createoptstate(argc, argv, "gahedsvad:i:o:f:p:z:s:r:n:x:m:t:c:u:e:b:v:"); while ((status = pl_getnextopt(optstate)) == pl_opt_ok) { switch (optstate->option) { case 'a': ascii = pr_true; break; case 'g': /* generate a csr */ case 'a': /* add cert to database */ case 'h': /* save cert to the header file */ case 'e': /* encrypt with public key from cert in header file */ case 's': /* sign with private...
NSS Sample Code Sample_1_Hashing
progname + 1 : argv[0]; rv = nss_nodb_init("/tmp"); if (rv != secsuccess) { fprintf(stderr, "%s: nss_init failed in directory %s\n", progname, "/tmp"); return -1; } /* parse command line arguments */ optstate = pl_createoptstate(argc, argv, "t:"); while ((status = pl_getnextopt(optstate)) == pl_opt_ok) { switch (optstate->option) { case 't': require_arg(optstate->option, optstate->value); hashname = strdup(optstate->value); break; } } if (!hashname) usage(progname); /* convert and validate */ hashoidtag = hashnametooidtag(hashname); if (hashoidtag == sec_oid_unknown) { f...
NSS Sample Code Sample_2_Initialization of NSS
progname + 1 : argv[0]; /* parse command line arguments */ optstate = pl_createoptstate(argc, argv, "d:p:q:f:g:"); while ((status = pl_getnextopt(optstate)) == pl_opt_ok) { switch (optstate->option) { case 'd': dbdir = strdup(optstate->value); break; case 'p': plainpass = strdup(optstate->value); break; case 'f': pwfile = strdup(optstate->value); break; default: usage(progname); break; }...
NSS Sample Code Utilities_1
(slot); if (tokenname) { tokenlen = port_strlen(tokenname); } } i = 0; do { int startphrase = i; int phraselen; /* handle the windows eol case */ while (phrases[i] != '\r' && phrases[i] != '\n' && i < nb) i++; /* terminate passphrase */ phrases[i++] = '\0'; /* clean up any eol before the start of the next passphrase */ while ( (i<nb) analyze="" char="" current="" getmodulepassword="" if="" int="" now="" passphrase="" phrase="&amp;phrases[startphrase];" phraselen="" pk11slotinfo="" pwdata="=" pwdata-="" retry="" return="" secupwdata="" the="" void="" while="">source != pw_none) { pr_fprintf(pr_stderr, "incorrect password/pin entered.\n"); return null; } switch (pwda...
Hashing - sample 1
progname + 1 : argv[0]; rv = nss_nodb_init("/tmp"); if (rv != secsuccess) { fprintf(stderr, "%s: nss_init failed in directory %s\n", progname, "/tmp"); return -1; } /* parse command line arguments */ optstate = pl_createoptstate(argc, argv, "t:"); while ((status = pl_getnextopt(optstate)) == pl_opt_ok) { switch (optstate->option) { case 't': require_arg(optstate->option, optstate->value); hashname = strdup(optstate->value); break; } } if (!hashname) usage(progname); /* convert and validate */ hashoidtag = hashnametooidtag(hashname); if (hashoidtag == sec_oid_unknown) { f...
Initialize NSS database - sample 2
progname + 1 : argv[0]; /* parse command line arguments */ optstate = pl_createoptstate(argc, argv, "d:p:q:f:g:"); while ((status = pl_getnextopt(optstate)) == pl_opt_ok) { switch (optstate->option) { case 'd': dbdir = strdup(optstate->value); break; case 'p': plainpass = strdup(optstate->value); break; case 'f': pwfile = strdup(optstate->value); break; default: usage(progname); break; }...
Utilities for nss samples
(slot); if (tokenname) { tokenlen = port_strlen(tokenname); } } i = 0; do { int startphrase = i; int phraselen; /* handle the windows eol case */ while (phrases[i] != '\r' && phrases[i] != '\n' && i < nb) i++; /* terminate passphrase */ phrases[i++] = '\0'; /* clean up any eol before the start of the next passphrase */ while ( (i<nb) && (phrases[i] == '\r' || phrases[i] == '\n')) { phrases[i++] = '\0'; } /* now analyze the current passphrase */ phrase = &phrases[startphrase]; if (!tokenname) break; if (port_strncmp(phrase, tokenname, tokenlen)) continue; phraselen = port_strlen(phrase); if (phraselen < (tokenle...
sample1
progname + 1 : argv[0]; rv = nss_nodb_init("/tmp"); if (rv != secsuccess) { fprintf(stderr, "%s: nss_init failed in directory %s\n", progname, "/tmp"); return -1; } /* parse command line arguments */ optstate = pl_createoptstate(argc, argv, "t:"); while ((status = pl_getnextopt(optstate)) == pl_opt_ok) { switch (optstate->option) { case 't': require_arg(optstate->option, optstate->value); hashname = strdup(optstate->value); break; } } if (!hashname) usage(progname); /* convert and validate */ hashoidtag = hashnametooidtag(hashname); if (hashoidtag == sec_oid_unknow...
sample2
progname + 1 : argv[0]; /* parse command line arguments */ optstate = pl_createoptstate(argc, argv, "gahedsvad:i:o:f:p:z:s:r:n:x:m:t:c:u:e:b:v:"); while ((status = pl_getnextopt(optstate)) == pl_opt_ok) { switch (optstate->option) { case 'a': ascii = pr_true; break; case 'g': /* generate a csr */ case 'a': /* add cert to database */ case 'h': /* save cert to the header file */ case 'e': /* encrypt with public key from cert in header file */ case 's': /* sign with private key */ case 'd': /* decrypt with the matching private key */ case 'v': /* verify with the matching...
Notes on TLS - SSL 3.0 Intolerant Servers
the server software will appear next to server under ssl certificate information.
PKCS #11 Module Specs
embedded '\' charaters are considered escape characters for the next character in the stream.
PKCS 12 functions
sec_pkcs12createunencryptedsafe mxr 3.2 and later sec_pkcs12decoderfinish mxr 3.2 and later sec_pkcs12decodergetcerts mxr 3.4 and later sec_pkcs12decoderimportbags mxr 3.2 and later sec_pkcs12decoderiterateinit mxr 3.10 and later sec_pkcs12decoderiteratenext mxr 3.10 and later sec_pkcs12decodersettargettokencas mxr 3.8 and later sec_pkcs12decoderstart mxr 3.2 and later sec_pkcs12decoderupdate mxr 3.2 and later sec_pkcs12decodervalidatebags mxr 3.2 and later sec_pkcs12decoderverify mxr 3.2 and later ...
Python binding for NSS
rs() nss.nss.oid_dotted_decimal() nss.nss.oid_str() nss.nss.oid_tag() nss.nss.oid_tag_name() nss.nss.read_der_from_file() nss.nss.x509_alt_name() nss.nss.x509_ext_key_usage() nss.nss.x509_key_usage() the following class methods and properties were added: note: it's a method if the name is suffixed with (), a propety otherwise socket.next() socket.readlines() socket.sendall() sslsocket.next() sslsocket.readlines() sslsocket.sendall() authkeyid.key_id authkeyid.serial_number authkeyid.get_general_names() crldistributionpoint.issuer crldistributionpoint.get_general_names() crldistributionpoint.get_reasons() certdb.find_crl_by_cert() certdb.find_crl_by_name() certi...
FC_DecryptUpdate
pencryptedpart [in] pointer to the next block of data to be decrypted.
FC_EncryptUpdate
ppart [in] pointer to the next block of data to be encrypted.
FC_FindObjects
description fc_findobjects returns the next set of object handles matching the criteria set up by the previous call to fc_findobjectsinit and sets the object count variable to their number or to zero if there are none.
NSS tools : crlutil
crl generation script syntax crl generation script file has the following syntax: * line with comments should have # as a first symbol of a line * set "this update" or "next update" crl fields: update=yyyymmddhhmmssz nextupdate=yyyymmddhhmmssz field "next update" is optional.
NSS tools : pk12util
if the cryptographic module does not support the requested algorithm, then the next best fit will be selected (usually the default).
NSS reference
s12addcertandkey sec_pkcs12addpasswordintegrity sec_pkcs12enablecipher sec_pkcs12encode sec_pkcs12destroyexportcontext sec_pkcs12decoderstart sec_pkcs12decoderimportbags sec_pkcs12decoderupdate sec_pkcs12decoderfinish sec_pkcs12decodervalidatebags sec_pkcs12decoderverify sec_pkcs12decodergetcerts sec_pkcs12decodersettargettokencas sec_pkcs12decoderiterateinit sec_pkcs12decoderiteratenext sec_pkcs12isencryptionallowed sec_pkcs12setpreferredcipher nspr functions a small number of nspr functions are required for using the certificate verification and ssl functions in nss.
NSS Tools crlutil
crl generation script syntax: crl generation script file has the following syntax: line with comments should have <bold>#</bold> as a first symbol of a line set "this update" or "next update" crl fields: update=yyyymmddhhmmssz nextupdate=yyyymmddhhmmssz field "next update" is optional.
NSS tools : crlutil
MozillaProjectsNSStoolscrlutil
crl generation script syntax crl generation script file has the following syntax: * line with comments should have # as a first symbol of a line * set "this update" or "next update" crl fields: update=yyyymmddhhmmssz nextupdate=yyyymmddhhmmssz field "next update" is optional.
NSS tools : pk12util
if the cryptographic module does not support the requested algorithm, then the next best fit will be selected (usually the default).
Necko FAQ
todo when is the next stable release of this library going to be available?
Tutorial: Embedding Rhino
for example, we can see how to implement java.lang.runnable in a rhino shell session: js> obj = { run: function() { print("hi"); } } [object object] js> obj.run() hi js> r = new java.lang.runnable(obj); [object object] js> t = new java.lang.thread(r) thread[thread-0,5,main] js> t.start() hi adding java objects the next example is runscript2.
Scripting Java
the above examples could be expressed as follows: $ java org.mozilla.javascript.tools.shell.main js> importclass(packages.org.mozilla.javascript.context); js> context.currentcontext; org.mozilla.javascript.context@bb6ab6 working with java now that we can access java classes, the next logical step is to create an object.
Rhino shell
the next invocation has no arguments, so the shell goes into interactive mode, reading and evaluating each line as it is typed in.
Shumway
the next step is to use the inspector included as one of shumway's examples.
SpiderMonkey compartments
in the new model most objects touched by a website are tightly packed next to each other in memory, with no cross-origin objects in between.
GCIntegration - SpiderMonkey Redirect 1
consequently, more objects may be marked than necessary, but those objects will be collected in the next gc if they're unreachable.
Functions
(jscontext::display caches the enclosing function's stack frame.) if that function is also algol-like, its child can read locals and variables from the next enclosing function, and so on.
Exact Stack Rooting
this prevents an entire class of bugs where return values are not rooted properly before the next js-api call.
Tracing JIT
the associated fragment is placed in the monitor's fragment table and the monitor returns to monitoring mode, with a high likelihood of immediately transitioning to executing mode on the next bytecode interpreted.
SpiderMonkey Internals
the line-to-pc direction "rounds" toward the next bytecode generated from a line greater than or equal to the input line, and may return the pc of a for-loop update part, if given the line number of the loop body's closing brace.
JSAPI Cookbook
* otherwise, convert the number to floating point (see the next example).
JSID_VOID
a void jsid is not a valid id and only arises as an exceptional api return value, such as in js_nextproperty.
JSObjectOps.defaultValue
details of the api may change from one release to the next.
JSObjectOps.defineProperty
details of the api may change from one release to the next.
JSObjectOps.destroyObjectMap
details of the api may change from one release to the next.
JSObjectOps.dropProperty
details of the api may change from one release to the next.
JSObjectOps.enumerate
details of the api may change from one release to the next.
JSObjectOps.getAttributes
details of the api may change from one release to the next.
JSObjectOps.getProperty
details of the api may change from one release to the next.
JSObjectOps.getRequiredSlot
details of the api may change from one release to the next.
JSObjectOps.lookupProperty
details of the api may change from one release to the next.
JSObjectOps.newObjectMap
details of the api may change from one release to the next.
JSObjectOps.setProto
details of the api may change from one release to the next.
JS_ConvertArguments
each element of the array indicates the c type into which to convert the next available js value.
JS_LeaveLocalRootScopeWithResult
leave a local root scope, transferring the result value to the next enclosing root scope.
JS_NewObject
next, we must find the given class's constructor in that global object.
JS_PushArguments
format is a sequential character array, where each element of the array indicates the js type into which to convert the next c/c++ argument.
JS_SET_TRACING_DETAILS
this article covers features introduced in spidermonkey 1.8 set debugging information about the next thing to be traced by a jstracer.
JS_SetNativeStackQuota
if 0 is passed for a given kind of code, it defaults to the value of the next-highest-priority kind.
JSAPI reference
js_getpropertyattrsgetterandsetterbyid obsolete since jsapi 26 js_lookupproperty obsolete since jsapi 37 js_lookupucproperty obsolete since jsapi 37 js_lookuppropertybyid obsolete since jsapi 37 js_lookupelement obsolete since jsapi 37 js_lookuppropertywithflags obsolete since jsapi 31 js_lookuppropertywithflagsbyid obsolete since jsapi 31 js_newpropertyiterator obsolete since jsapi 36 js_nextproperty obsolete since jsapi 36 js_setpropertyattributes obsolete since jsapi 26 js_setucpropertyattributes obsolete since jsapi 26 the following functions behave like js_getproperty and js_getpropertybyid except when operating on e4x xml objects.
SpiderMonkey 38
tringcharsandlength (bug 1037869) js_getstringcharsandlength (bug 1037869) js_getstringcharsz (bug 1037869) js_getstringcharszandlength (bug 1037869) js_gettypename (bug 1037718) js_isabouttobefinalized (bug 650161) js_lookupelement (bug 1094176) js_lookupproperty (bug 1094176) js_lookuppropertybyid (bug 1094176) js_lookupucproperty (bug 1094176) js_newpropertyiterator (bug 1081660) js_nextproperty (bug 1081660) js_resolvestub (bug 1103152) js_setfinalizecallback (bug 996785) js_setfunctioncallback (bug 1103269) jschar (bug 1063962) api changes jschar, a typedef for the standard c++ type char16_t, has been removed.
Running Automated JavaScript Tests
the next time it is run, it will run only the tests in the given filename, and then will write the list of tests that failed when it is done.
Thread Sanitizer
# if it's not already in your $path, then uncomment this next line: #export llvm_symbolizer="/path/to/llvm-symbolizer" # add tsan to our compiler flags export cflags="-fsanitize=thread -fpic -pie" export cxxflags="-fsanitize=thread -fpic -pie" # additionally, we need the tsan flag during linking.
Zest implementation
the first version is aimed at creating scripts for reproducing basic security vulnerabilities includes a java reference implementation, which conforms to jsr 223 has been included in a proof-of-concept owasp zap add-on the next version is underdevelopment - more details soon.
Exploitable crashes
next steps once you've determined that a crash is potentially exploitable, take the following steps.
XForms Accessibility
if you use xhtml2 use nextfocus.
Places Expiration
common expiration runs on a timer, every 3 minutes and uses a simple adaptive algorithm: if the last step was unable to expire enough entries the next one will expire more entries, otherwise if the previous step completed the cleanup the next step will be delayed.
Fun With XBL and XPConnect
implementing a widget interface the next thing i needed to do was to implement an interface on the widget which i could then pass into the auto complete session.
Receiving startup notifications
what happens next once you've registered with the category manager, at mozilla startup time (or when the embedding application's ns_initembedding() function is called), the appstartupnotifier component is instantiated, and its observe() method is called; this in turn enumerates all components in the app-startup category and sends them the appropriate notifications.
PyXPCOM
other resources pythonext - extension that provides pyxpcom samples - demo applications using pyxpcom community python-xpcom bindings mailing list (activestate) #pyxpcom on irc.mozilla.org source code the pyxpcom code is available here: http://hg.mozilla.org/pyxpcom/ to build pyxpcom, see building pyxpcom.
nsIRegistry
try { st.first(); do { var data = st.currentitem(); if( data instanceof ci.nsiregistrynode ) print("nsiregistrynode: " + data.nameutf8 + " (" + data.key + ")"); st.next(); } while( components.lastresult == 0 ); } catch(e) {} now, the output is something like: profiles (344) profiles/default (530) profiles/foo (1046) profiles/bar (1518) the number inside the parenthesis is the "key." you can use this key with the rest of the nsiregistry api (see mxr).
HOWTO
put the following at the end of your script: // do async processing // from <https://developer.mozilla.org/en/xpconnect/xpcshell/howto> print("doing async work"); gscriptdone = false; var gthreadmanager = cc["@mozilla.org/thread-manager;1"] .getservice(ci.nsithreadmanager); var mainthread = gthreadmanager.currentthread; while (!gscriptdone) mainthread.processnextevent(true); while (mainthread.haspendingevents()) mainthread.processnextevent(true); 2.
Profiling XPCShell
then, the next lines shows the amount of time spend in the functions in that file.
Observer Notifications
note that any action will be taken the next time the application starts.
IAccessibleText
an index of 0 places the caret so that the next insertion goes before the first character.
nsIAccessNode
obsolete since gecko 2.0 nextsiblingnode nsiaccessnode the next nsiaccessnode sibling.
ChildCount
attribute long childcount; see also nsiaccessible.firstchild nsiaccessible.lastchild nsiaccessible.children nsiaccessible.getchildat() nsiaccessible.parent nsiaccessible.nextsibling nsiaccessible.previoussibling ...
Children
see also nsiaccessible.firstchild nsiaccessible.lastchild nsiaccessible.childcount nsiaccessible.getchildat() nsiaccessible.parent nsiaccessible.nextsibling nsiaccessible.previoussibling ...
FirstChild
see also nsiaccessible.lastchild nsiaccessible.children nsiaccessible.childcount nsiaccessible.getchildat() nsiaccessible.parent nsiaccessible.nextsibling nsiaccessible.previoussibling ...
GetChildAt
see also nsiaccessible.firstchild nsiaccessible.lastchild nsiaccessible.children nsiaccessible.childcount nsiaccessible.parent nsiaccessible.nextsibling nsiaccessible.previoussibling ...
LastChild
see also nsiaccessible.firstchild nsiaccessible.children nsiaccessible.childcount nsiaccessible.getchildat() nsiaccessible.parent nsiaccessible.nextsibling nsiaccessible.previoussibling ...
Parent
see also nsiaccessible.nextsibling nsiaccessible.previoussibling nsiaccessible.firstchild nsiaccessible.lastchild nsiaccessible.children nsiaccessible.childcount nsiaccessible.getchildat() ...
PreviousSibling
see also nsiaccessible.parent nsiaccessible.nextsibling nsiaccessible.firstchild nsiaccessible.lastchild nsiaccessible.children nsiaccessible.childcount nsiaccessible.getchildat() ...
nsIAccessibleTableCell
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 boolean isselected(); attributes attribute type description columnextent long return the number of columns occupied by this cell.
nsIAutoCompleteItem
comment wstring an extra comment that will be displayed next to the value but that will not be part of the value itself.
nsIBoxObject
layoutmanager nsiboxlayoutmanager obsolete since gecko 1.9 nextsibling nsidomelement the next sibling of the box, in box-ordinal-group order.
nsIBrowserHistory
this will cause the transition type of the next visit of the url to be marked as "typed." void markpageastyped( in nsiuri auri ); parameters auri the page that is to be marked as typed by the user.
nsICRLManager
inherits from: nsisupports last changed in gecko 1.7 method overview wstring computenextautoupdatetime(in nsicrlinfo info, in unsigned long autoupdatetype, in double noofdays); void deletecrl(in unsigned long crlindex); nsiarray getcrls(); void importcrl([array, size_is(length)] in octet data, in unsigned long length, in nsiuri uri, in unsigned long type, in boolean dosilentdownload, in wstring crlkey); void reschedulecrlautoupdate(); boolean updatecrlfromurl(in wstring url, in wstring key); constants constant value description type_autoupdate_time_based 1 type_autoupdate_freq_based 2 methods computenextautoupdatetime() wstring computenextautoupdatetime( ...
nsICompositionStringSynthesizer
to create an instance for this: var domwindowutils = window.windowutils; var compositionstringsynthesizer = domwindowutils.createcompositionstringsynthesizer(); for example, when you create a composition whose composing string is "foo-bar-buzz" and "bar" is selected to convert, then, first, you need to start composition: domwindowutils.sendcompositionevent("compositionstart", "", ""); next, dispatch composition string with crause information and caret information (optional): // set new composition string with .setstring().
nsIContentViewer
close() should be called when the load of a new page for the next content viewer begins, and destroy() should be called when the next content viewer replaces this one.
nsIDNSService
s.interfaces.nsidnsservice); let thread = components.classes["@mozilla.org/thread-manager;1"] .getservice(components.interfaces.nsithreadmanager).currentthread; let host = "www.mozilla.org"; let listener = { onlookupcomplete: function(request, record, status) { if (!components.issuccesscode(status)) { // handle error here return; } let address = record.getnextaddrasstring(); console.log(host + " = " + address); } }; dnsservice.asyncresolve(host, 0, listener, thread); ...
nsIDOMNode
nextsibling nsidomnode read only.
nsIDirectoryIterator
last changed in gecko 1.8 (firefox 1.5 / thunderbird 1.5 / seamonkey 1.0) inherits from: nsisupports method overview void init(in nsifilespec parent, in boolean resolvesymlink); boolean exist(); void next(); attributes attribute type description currentspec nsifilespec init() void init( in nsifilespec parent, in boolean resolvesymlink ); parameters parent resolvesymlink exist() boolean exists(); next() void next(); ...
nsIDocShell
setting this will make it take effect starting with the next document loaded in the docshell.
nsIEditor
tstatelistener(in nsidocumentstatelistener listener); debug methods void dumpcontenttree(); void debugdumpcontent() ; void debugunittests(out long outnumtests, out long outnumtestsfailed); [notxpcom] boolean ismodifiablenode(in nsidomnode anode); constants load flags constant value description enone 0 enext 1 eprevious 2 enextword 3 epreviousword 4 etobeginningofline 5 etoendofline 6 attributes attribute type description contentsmimetype string the mime type of the document.
nsIEnumerator
} iter.next(); } while( components.lastresult == 0 ); } catch(e) {} search for e-mail from "warren harris" dated 04/21/1999 time 16:11:03 for some notes on the subject.
nsIFilePicker
var files = fp.files; var paths = []; while (files.hasmoreelements()) { var arg = files.getnext().queryinterface(components.interfaces.nsilocalfile).path; paths.push(arg); } ...
nsIFocusManager
movefocus_forwarddoc 3 move focus forward to the next frame document, used when pressing f6.
Building an Account Manager Extension
ory devmoaccountmanagerextension.prototype._xpcom_categories: [{ category: "mailnews-accountmanager-extensions" }], // create entry point for the module if (xpcomutils.generatensgetfactory) var nsgetfactory = xpcomutils.generatensgetfactory([devmoaccountmanagerextension]); else var nsgetmodule = xpcomutils.generatensgetmodule([devmoaccountmanagerextension]); step3: create the new panel as next step we create the xul and the property file for your new panel.
nsIMsgMessageService
e.g., header=filter return the nsiuri that gets run example for example, the next piece of code shows the selected message code on a dialog: (taken from mozillazine) var content = ""; var messageuri = getfirstselectedmessage(); var msgservice = messenger.messageservicefromuri(messageuri); var msgstream = components.classes["@mozilla.org/network/sync-stream-listener;1"].createinstance(); var consumer = msgstream.queryinterface(components.interfaces.nsiinputstream); ...
nsINavHistoryContainerResultNode
this value is intended to be used to see if the "+" should be drawn next to a tree item, indicating that the item can be opened.
nsINavHistoryService
this will cause the transition type of the next visit of the url to be marked as "typed." void markpageastyped( in nsiuri auri ); parameters auri the page that is to be marked as typed by the user.
nsIProtocolProxyService
afailoverproxy specifies the next proxy to try if this proxy fails.
nsIProxyInfo
next nsiproxyinfo proxy info objects may be chained if several proxies could be treated equivalently.
nsISHistory
use nsisimpleenumerator.getnext() on the object returned by step #1 to obtain handle to the next object in the list.
nsISHistoryListener
onhistorygoforward() called when navigating to a next session history entry, for example due to an nsiwebnavigation.goforward() call.
nsIScriptableIO
buffered: a stream that uses a buffer to hold a block of the next piece of the data to be read.
nsISelectionPrivate
constants constant value description endofprecedingline 0 startofnextline 1 tableselection_none 0 tableselection_cell 1 tableselection_row 2 tableselection_column 3 tableselection_table 4 tableselection_allcells 5 methods addselectionlistener() void addselectionlistener( in nsiselectionlistener newlistener ); parameters newlistener endb...
nsIStreamListener
method overview void ondataavailable(in nsirequest arequest, in nsisupports acontext, in nsiinputstream ainputstream, in unsigned long aoffset, in unsigned long acount); methods ondataavailable() this method is called when the next chunk of data for the ongoing request may be read without blocking the calling thread.
nsIToolkitProfile
example: var profile = profilelist.getnext().queryinterface(ci.nsitoolkitprofile); var locker = profile.lock({}); remove() removes the profile from the registry of profiles.
nsIWebContentHandlerRegistrar
r); var htmlcontentwindow = undefined; var registeruri = 'http://mail.live.com/secure/start?action=compose&to=%s'; var myurihostname = services.io.newuri(registeruri, null, null).host; // this section here is long and daunting, but its just finding a suitable contentwindow var domwindows = services.wm.getenumerator(null); while (domwindows.hasmoreelements()) { var adomwindow = domwindows.getnext(); if (adomwindow.gbrowser) { if (adomwindow.gbrowser.tabcontainer) { //adomwindow has tabs var tabs = adomwindow.gbrowser.tabcontainer.childnodes; for (var i = 0; i < tabs.length; i++) { console.log(tabs[i].linkedbrowser.contentwindow.location); if (tabs[i].linkedbrowser.contentwindow.location.hostname == myurihostna...
nsIWebNavigation
void goback( ); goforward() tells the object to navigate to the next session history item.
nsIWindowMediator
var wm = components.classes["@mozilla.org/appshell/window-mediator;1"] .getservice(components.interfaces.nsiwindowmediator); var enumerator = wm.getenumerator(type); while(enumerator.hasmoreelements()) { var win = enumerator.getnext(); // win is [object chromewindow] (just like window), do something with it } this code iterates over all windows of the specified type, where type you specify is the window type.
nsIXULRuntime
methods invalidatecachesonrestart() signal the apprunner to invalidate caches on the next restart.
nsIZipReader
xtensions', 'portabletester@jetpack.xpi'); var nsifilexpi = new fileutils.file(pathtoxpitoread); //services.ww.activewindow.alert(pathtoxpitoread); try { zr.open(nsifilexpi); //if file dne it throws here var entries = zr.findentries('*'); //we use asterik because we want everything listed out while (entries.hasmore()) { var entrypointer = entries.getnext(); //just a string of "zip path" (this means path to file in zip, and it uses forward slashes remember) var entry = zr.getentry(entrypointer); // should return true on `entry instanceof ci.nsizipentry` console.log('entrypointer', entrypointer); /* console output * "entrypointer" "bootstrap.js" scratchpad/1:18 */ console.info('entry', entry); ...
nsIZipWriter
ens for reading and writing //recursviely add all var dirarr = [dir]; //adds dirs to this as it finds it for (var i=0; i<dirarr.length; i++) { cu.reporterror('adding contents of dir['+i+']: ' + dirarr[i].leafname + ' path: ' + dirarr[i].path); var direntries = dirarr[i].directoryentries; while (direntries.hasmoreelements()) { var entry = direntries.getnext().queryinterface(ci.nsifile); //entry is instance of nsifile so here https://developer.mozilla.org/docs/xpcom_interface_reference/nsifile if (entry.path == xpi.path) { cu.reporterror('skipping entry - will not add this entry to the zip file - as this is the zip itself: "' + xpi.path + '" leafname:"' + xpi.leafname + '"'); continue; } if (entry.isdire...
Storage
after you create and bind a statement, your javascript should look something like this to execute a statement asynchronously: statement.executeasync({ handleresult: function(aresultset) { for (let row = aresultset.getnextrow(); row; row = aresultset.getnextrow()) { let value = row.getresultbyname("column_name"); } }, handleerror: function(aerror) { print("error: " + aerror.message); }, handlecompletion: function(areason) { if (areason != components.interfaces.mozistoragestatementcallback.reason_finished) print("query canceled or aborted!"); } }); the call to...
Using nsIPasswordManager
var pass = e.getnext().queryinterface(components.interfaces.nsipassword); if (pass.host == querystring) { // found it!
Using nsISimpleEnumerator
using nsisimpleenumerator <stringbundle>.strings var enumerator = document.getelementbyid('astringbundleid').strings; var s = ""; while (enumerator.hasmoreelements()) { var property = enumerator.getnext().queryinterface(components.interfaces.nsipropertyelement); s += property.key + ' = ' + property.value + ';\n'; } alert(s); example using javascript 1.7 features // creates a generator iterating over enum's values function generatorfromsimpleenumerator(enum, interface) { while (enum.hasmoreelements()) { yield enum.getnext().queryinterface(interface); } } var b = document.getelementbyid("stringbundleset").firstchild var props = generatorfromenumerator(b.strings, components.interfaces.nsipropertyelement); var s = ""; for (let property in props) { s += property.key + ...
Weak reference
ns_interface_map_end // ...if you used a |ns_imple_queryinterfacen| macro, move up to the next higher one and add a term ns_impl_queryinterfacen+1( ...,nsisupportsweakreference) // ...if you implemented |queryinterface| by hand, add a clause ns_imethodimp nsfoo::queryinterface( refnsiid aiid, void** ainstanceptr ) { // ...
The libmime module
} method definitions next come the definitions of the methods we referred to in the class-init function.
Thunderbird Binaries
if you wish to download nightly builds to help us test for the next release, please read the testing page for where we need help.
Building a Thunderbird extension 1: introduction
next » ...
Building a Thunderbird extension 2: extension file layout
« previous next » ...
Building a Thunderbird extension 3: install manifest
« previous next » ...
Add Option to Context Menu
assuming this on chrome.manifest: overlay chrome://messenger/content/mailwindowoverlay.xul chrome://myext/content/thunderbird-overlay.xul add the next in thunderbird-overlay.xul.
customDBHeaders Preference
='1.0' encoding='utf-8'?> <rdf xmlns='http://www.w3.org/1999/02/22-rdf-syntax-ns#' xmlns:em='http://www.mozilla.org/2004/em-rdf#'> <description about='urn:mozilla:install-manifest'> <em:id>superfluous@yoursite.com</em:id> <em:version>0.1.1</em:version> <em:type>2</em:type> <!-- 2 is type 'extension' --> <em:targetapplication> <description> <!-- this next line identifies tbird as target --> <em:id>{3550f703-e582-4d05-9a08-453d09bdfdc6}</em:id> <em:minversion>2*</em:minversion> <em:maxversion>3.0.0.*</em:maxversion> </description> </em:targetapplication> <em:name>superfluous</em:name> <em:description>test superfluous extension</em:description> <em:creator>garrett comeaux</em:creator> </descrip...
Toolkit version format
see the next section for details on how versions are compared.
WebIDL bindings
here's an example: [constructor(optional long firstnumber), jsimplementation="@mozilla.org/my-number;1"] interface mynumber { attribute long value; readonly attribute long othervalue; void donothing(); }; next, create an xpcom component that implements this interface.
Working with windows in chrome code
we'll demonstrate them from the simplest to the most complex in the next few sections.
Working with data
the next line instantiates an object of that type, creating a new array.
Plugin Roadmap for Firefox - Plugins
2016 - roll-out plan for html5 by default july 2017 - saying goodbye to flash in chrome microsoft edge and internet explorer april 2016 - putting users in control of flash december 2016 - extending user control of flash with click-to-run july 2017 - flash on windows timeline august 2019 - update on removing flash from microsoft edge and internet explorer apple safari june 2016 - next steps for legacy plug-ins july 2017 - adobe announces flash distribution and updates to end ...
Accessibility Inspector - Firefox Developer Tools
check for accessibility issues you can check for accessibility issues by clicking the drop-down menu next to: check for issues.
Debugging service workers - Firefox Developer Tools
when your service worker is running, a debug button is available next to the source information (it is disabled when the service worker is stopped).
Disable breakpoints - Firefox Developer Tools
to disable a single breakpoint, uncheck the checkbox next to it in the breakpoints list.
Examine, modify, and watch variables - Firefox Developer Tools
you can remove a watch expression by clicking the "x" icon next to it, and, of course, you can have more than one watch expression at a time.
Highlight and inspect DOM nodes - Firefox Developer Tools
also, when you view the details of a dom node in the code panel, objects that you can highlight in the list will also have a target next to them.
Set watch expressions - Firefox Developer Tools
you can remove a watch expression by clicking the "x" icon next to it, and you can have more than one watch expression at a time.
Debugger keyboard shortcuts - Firefox Developer Tools
command windows macos linux close current file ctrl + w cmd + w ctrl + w search for a string in the current file ctrl + f cmd + f ctrl + f search for a string in all files ctrl + shift + f cmd + shift + f ctrl + shift + f find next in the current file ctrl + g cmd + g ctrl + g search for scripts by name ctrl + p cmd + p ctrl + p resume execution when at a breakpoint f8 f8 1 f8 step over f10 f10 1 f10 step into f11 f11 1 f11 step out shift + f11 shift + f11 1 shift + f11 toggle breakpoint on the currently selected line ctrl + b cmd + b ctrl + b toggle conditional breakpoint on the currently...
Set an XHR breakpoint - Firefox Developer Tools
to turn on the feature: open the debugger click on "pause on any url" which acts as a wild card, causing the code to pause on any call, or, click the plus sign next to the xhr breakpoints header, enter the url in which you are interested, and press enter.
Debugger.Memory - Firefox Developer Tools
for example, it is typical for many objects to have identical sets of properties, with only the properties’ values varying from one object to the next.
DevTools API - Firefox Developer Tools
selectnexttool() selects the next tool in the toolbox.
Eyedropper - Firefox Developer Tools
changing a color value in the rules view color values appearing in the inspector's rules view have color samples next to them: clicking the sample shows a color picker popup.
Aggregate view - Firefox Developer Tools
next to the type's name, there's an icon that contains three stars arranged in a triangle: click this to see every instance of that type.
Basic operations - Firefox Developer Tools
to create a diff, click the button that looks like a venn diagram next to the camera icon (before firefox 47, this looked like a "+/-" icon): you'll be prompted to select the snapshot to use as a baseline, then the snapshot to compare.
Dominators view - Firefox Developer Tools
by clicking on the disclosure arrow next to the function, we can see those nodes.
Edit CSS filters - Firefox Developer Tools
css filter properties in the rules view have a circular gray and white swatch next to them: clicking the swatch opens a filter editor: the filter editor lists each of the effects performed by that filter on a separate line.
Edit Shape Paths in CSS - Firefox Developer Tools
clicking on the shapes icon next to the value of circle() will highlight the shape, and also give you the option to resize the circle or move its center.
Examine Event Listeners - Firefox Developer Tools
the inspector shows the word "event" next to elements in the html pane, that have event listeners bound to them: click the icon, then you'll see a popup listing all the event listeners bound to this element: each line contains: a right-pointing arrowhead; click to expand the row and show the listener function source code a curved arrow pointing to a stack; click it to show the code for the handler in the debugger the name of the event for which a handler was attached to this element the name and line number for the listener; you can also click here to expand the row and view the listener function source code a label indicating whether the event bubbles a label indicating the system that defines the event.
Inspect and select colors - Firefox Developer Tools
in the css pane's rules view, if a rule contains a color value, you'll see a sample of the color next to the value: a color sample is also shown for css custom properties (variables) that represent colors.
Reposition elements in the page - Firefox Developer Tools
if an element has its position property set to absolute, relative or fixed and one or more of the top, bottom , left or right properties, the box model view displays a button: if you click that button, two handles appear next to the element: you can use these handles to drag the element around the page.
Use the Inspector from the Web Console - Firefox Developer Tools
dom elements in the web console output get a target next to them.
Animation inspector (Firefox 41 and 42) - Firefox Developer Tools
the animation inspector enables you to: see information about all animations running in the page play/pause all animations play/pause/rewind/fast-forward each animation jump to a specific point in an animation highlight and inspect the animated node adjust the playback rate of each animation see whether an animation is running in the compositor thread (a lightning bolt icon is displayed next to such animations) ...
Work with animations - Firefox Developer Tools
you'll get a message of "all animation properties are optimized." the expanded animation information now includes a lightning bolt icon next to the properties whose animation has been optimized via the compositor.
Paint Flashing Tool - Firefox Developer Tools
it's difficult to know what optimizations the browser will make to minimize repaints, and they are subject to change from one version to the next.
Allocations - Firefox Developer Tools
so in the example above: 8904 samples were taken in signallater(), which is 28.57% of the total number of samples taken those samples allocated 1102888 bytes, which is 30.01% of the total memory allocated in all samples next to each function name is a disclosure arrow.
Call Tree - Firefox Developer Tools
walking up the call tree next to each function name is a disclosure arrow: click that, and you can see the path back up the call tree, from the function in which the sample was taken, to the root.
Intensive JavaScript - Firefox Developer Tools
tionsbutton.disabled = false; return; } // test this number var candidate = index * (multiplier * math.random()); var isprime = true; for (var c = 2; c <= math.sqrt(candidate); ++c) { if (candidate % c === 0) { // not prime isprime = false; break; } } if (isprime) { primes.push(candidate); } // schedule the next var testfunction = testcandidate.bind(this, index + 1); window.requestanimationframe(testfunction); } var primes = []; var testfunction = testcandidate.bind(this, 0); window.requestanimationframe(testfunction); } let's test this version out: select the radio button labeled "use requestanimationframe" and capture another profile.
Waterfall - Firefox Developer Tools
layout: next, the browser uses the computed styles to figure out the position and geometry for the elements.
Debugging Firefox Desktop - Firefox Developer Tools
start the debugger server next, you need to start the debugger server in the debuggee.
Toolbox - Firefox Developer Tools
extra tools next there's an array of buttons that can be added or removed in the developer tool settings.
View Source - Firefox Developer Tools
for example view-source:https://www.mozilla.org/#line100 view selection source if you select part of a web page and conext-click, you'll see a context menu item labeled "view selection source", that behaves just like "view page source", except you only see the source for the selection.
Web console keyboard shortcuts - Firefox Developer Tools
turn shift + enter autocomplete popup these shortcuts apply while the autocomplete popup is open: command windows macos linux choose the current autocomplete suggestion tab tab tab cancel the autocomplete popup esc esc esc move to the previous autocomplete suggestion up arrow up arrow up arrow move to the next autocomplete suggestion down arrow down arrow down arrow page up through autocomplete suggestions page up page up page up page down through autocomplete suggestions page down page down page down scroll to start of autocomplete suggestions home home home scroll to end of autocomplete suggestions end end end glo...
AbstractRange - Web APIs
eah row beneath them shows the next layer of depth into the dom tree.
AddressErrors - Web APIs
process the payment the main payment processing code is found in the process() method, up next.
AesCtrParams - Web APIs
essentially: the nonce should ensure that counter blocks are not reused from one message to the next, while the counter should ensure that counter blocks are not reused within a single message.
AnalyserNode.getFloatFrequencyData() - Web APIs
estination); //create 2d canvas const canvas = document.createelement('canvas'); canvas.style.position = 'absolute'; canvas.style.top = 0; canvas.style.left = 0; canvas.width = window.innerwidth; canvas.height = window.innerheight; document.body.appendchild(canvas); const canvasctx = canvas.getcontext('2d'); canvasctx.clearrect(0, 0, canvas.width, canvas.height); function draw() { //schedule next redraw requestanimationframe(draw); //get spectrum data analysernode.getfloatfrequencydata(dataarray); //draw black background canvasctx.fillstyle = 'rgb(0, 0, 0)'; canvasctx.fillrect(0, 0, canvas.width, canvas.height); //draw spectrum const barwidth = (canvas.width / bufferlength) * 2.5; let posx = 0; for (let i = 0; i < bufferlength; i++) { const barheight = (dataarra...
Attr - Web APIs
WebAPIAttr
nextsibling this property now always returns null.
AudioBufferSourceNode.AudioBufferSourceNode() - Web APIs
if the loop is dynamically modified during playback, the new value will take effect on the next processing block of audio.
AudioContext.createMediaStreamSource() - Web APIs
next, we feed this source audio into a low pass biquadfilternode (which effectively serves as a bass booster), then a audiodestinationnode.
AudioNode.connect() - Web APIs
WebAPIAudioNodeconnect
next, it will mix it together with any other such outputs, and the intrinsic parameter value (the value the audioparam would normally have without any audio connections), including any timeline changes scheduled for the parameter.
AudioParam - Web APIs
var audiocontext = window.audiocontext || window.webkitaudiocontext; var audioctx = new audiocontext(); var gainnode = audioctx.creategain(); gainnode.gain.value = 0; next, an example showing a dynamicscompressornode having some param values maniuplated.
AudioParamDescriptor - Web APIs
} }) return true } } registerprocessor('white-noise-processor', whitenoiseprocessor) next, in our main scripts file we'll load the processor, create an instance of audioworkletnode passing it the name of the processor, and connect the node to an audio graph.
AudioTrack - Web APIs
this first example gets the first audio track on the media: var firsttrack = tracks[0]; the next example scans through all of the media's audio tracks, enabling any that are in the user's preferred language (taken from a variable userlanguage) and disabling any others.
AudioWorkletGlobalScope.registerProcessor - Web APIs
// test-processor.js class testprocessor extends audioworkletprocessor { process (inputs, outputs, parameters) { return true } } registerprocessor('test-processor', testprocessor) next, in our main script file we'll load the processor, create an instance of audioworkletnode — passing it the processor name that we used when calling registerprocessor — and connect it to an audio graph.
AudioWorkletGlobalScope - Web APIs
sample rate is not going to change ever, // because it's a read-only property of a baseaudiocontext // and is set only during its instantiation console.log(samplerate) // you can declare any variables and use them in your processors // for example it may be an arraybuffer with a wavetable const usefulvariable = 42 console.log(usefulvariable) registerprocessor('test-processor', testprocessor) next, in our main scripts file we'll load the processor, create an instance of audioworkletnode — passing the name of the processor to it — and connect the node to an audio graph.
AudioWorkletNode.parameters - Web APIs
} }) return true } } registerprocessor('white-noise-processor', whitenoiseprocessor) next, in our main scripts file we'll load the processor, create an instance of audioworkletnode passing it the name of the processor, and connect the node to an audio graph.
AudioWorkletNode - Web APIs
// white-noise-processor.js class whitenoiseprocessor extends audioworkletprocessor { process (inputs, outputs, parameters) { const output = outputs[0] output.foreach(channel => { for (let i = 0; i < channel.length; i++) { channel[i] = math.random() * 2 - 1 } }) return true } } registerprocessor('white-noise-processor', whitenoiseprocessor) next, in our main script file we'll load the processor, create an instance of audioworkletnode passing it the name of the processor, and connect the node to an audio graph.
AudioWorkletProcessor() - Web APIs
// test-processor.js class testprocessor extends audioworkletprocessor { constructor (options) { super() console.log(options.numberofinputs) console.log(options.processoroptions.someusefulvariable) } process (inputs, outputs, parameters) { return true } } registerprocessor('test-processor', testprocessor) next, in our main script file we'll load the processor, create an instance of audioworkletnode passing it the name of the processor and options object.
AudioWorkletProcessor.parameterDescriptors (static getter) - Web APIs
} }) return true } } registerprocessor('white-noise-processor', whitenoiseprocessor) next, in our main scripts file we'll load the processor, create an instance of audioworkletnode passing it the name of the processor, and connect the node to an audio graph.
AudioWorkletProcessor - Web APIs
// white-noise-processor.js class whitenoiseprocessor extends audioworkletprocessor { process (inputs, outputs, parameters) { const output = outputs[0] output.foreach(channel => { for (let i = 0; i < channel.length; i++) { channel[i] = math.random() * 2 - 1 } }) return true } } registerprocessor('white-noise-processor', whitenoiseprocessor) next, in our main script file we'll load the processor, create an instance of audioworkletnode, passing it the name of the processor, then connect the node to an audio graph.
BiquadFilterNode.getFrequencyResponse() - Web APIs
e float32arrays we need, one containing the input frequencies, and two to receive the output magnitude and phase values: var myfrequencyarray = new float32array(5); myfrequencyarray[0] = 1000; myfrequencyarray[1] = 2000; myfrequencyarray[2] = 3000; myfrequencyarray[3] = 4000; myfrequencyarray[4] = 5000; var magresponseoutput = new float32array(5); var phaseresponseoutput = new float32array(5); next we create a <ul> element in our html to contain our results, and grab a reference to it in our javascript: <p>biquad filter frequency response for: </p> <ul class="freq-response-output"> </ul> var freqresponseoutput = document.queryselector('.freq-response-output'); finally, after creating our biquad filter, we use getfrequencyresponse() to generate the response data and put it in our arrays, ...
BlobBuilder - Web APIs
this also resets the blobbuilder so that the next call to append() is starting a new, empty blob.
Body.body - Web APIs
WebAPIBodybody
se.body) .then(body => { const reader = body.getreader(); return new readablestream({ start(controller) { return pump(); function pump() { return reader.read().then(({ done, value }) => { // when no more data needs to be consumed, close the stream if (done) { controller.close(); return; } // enqueue the next data chunk into our target stream controller.enqueue(value); return pump(); }); } } }) }) .then(stream => new response(stream)) .then(response => response.blob()) .then(blob => url.createobjecturl(blob)) .then(url => console.log(image.src = url)) .catch(err => console.error(err)); specifications specification status comment fetchth...
CSSPseudoElement.element - Web APIs
const originatingelement = csspseudoelement.element; console.log(myelement === originatingelement); // outputs true console.log(myelement.parentelement === originatingelement); // outputs false console.log(myelement.lastelementchild === csspseudoelement); // outputs false console.log(myelement.lastchild === csspseudoelement); // outputs false console.log(myelement.nextelementsibling === csspseudoelement); // outputs false console.log(myelement.nextsibling === csspseudoelement); // outputs false specifications specification status comment css pseudo-elements level 4the definition of 'element' in that specification.
CSSStyleSheet.addRule() - Web APIs
if index is not specified, the next index after the last item currently in the list is used (that is, the value of cssstylesheet.cssrules.length).
CanvasRenderingContext2D.globalAlpha - Web APIs
next, we set the globalalpha property to 0.2 (20% opaque); this alpha level will apply to all of our transparent shapes.
Advanced animations - Web APIs
« previousnext » in the last chapter we made some basic animations and got to know ways to get things moving.
Hit regions and accessibility - Web APIs
« previousnext » the <canvas> element on its own is just a bitmap and does not provide information about any drawn objects.
Optimizing canvas - Web APIs
« previousnext » the <canvas> element is one of the most widely used tools for rendering 2d graphics on the web.
Pixel manipulation with canvas - Web APIs
« previousnext » until now we haven't looked at the actual pixels of our canvas.
Canvas API - Web APIs
next, the htmlcanvaselement.getcontext() method gets that element's context—the thing onto which the drawing will be rendered.
CharacterData - Web APIs
nondocumenttypechildnode.nextelementsibling read only returns the element immediately following the specified one in its parent's children list, or null if the specified element is the last one in the list.
ChildNode.replaceWith() - Web APIs
.createtextnode(currentnode); } else if (currentnode.parentnode){ currentnode.parentnode.removechild(currentnode); } // the value of "i" below is after the decrement if (!i) // if currentnode is the first argument (currentnode === arguments[0]) parent.replacechild(currentnode, this); else // if currentnode isn't the first parent.insertbefore(currentnode, this.nextsibling); } } if (!element.prototype.replacewith) element.prototype.replacewith = replacewithpolyfill; if (!characterdata.prototype.replacewith) characterdata.prototype.replacewith = replacewithpolyfill; if (!documenttype.prototype.replacewith) documenttype.prototype.replacewith = replacewithpolyfill; specification specification status comment domthe definit...
ChildNode - Web APIs
WebAPIChildNode
previouselementsibling and nextelementsibling are now defined on the latter.
Clients.claim() - Web APIs
WebAPIClientsclaim
when a service worker is initially registered, pages won't use it until they next load.
Console.groupCollapsed() - Web APIs
the user will need to use the disclosure button next to it to expand it, revealing the entries created in the group.
Console.info() - Web APIs
WebAPIConsoleinfo
in firefox, a small "i" icon is displayed next to these items in the web console's log.
Console.warn() - Web APIs
WebAPIConsolewarn
note: this feature is available in web workers.note: in chrome and firefox, warnings have a small exclamation point icon next to them in the web console log.
console - Web APIs
WebAPIConsole
formatting is supported, for example console.log("foo %.2f", 1.1) will output the number to 2 decimal places: foo 1.10 note: precision formatting doesn't work in chrome each of these pulls the next argument after the format string off the parameter list.
ConstantSourceNode.offset - Web APIs
the read-only offset property of the constantsourcenode interface returns a audioparam object indicating the numeric a-rate value which is always returned by the source when asked for the next sample.
ConvolverNode.normalize - Web APIs
changes to this value do not take effect until the next time the buffer attribute is set.
CredentialsContainer - Web APIs
for example, you might call this, after a user signs out of a website to ensure that he/she isn't automatically signed in on the next site visit.
DOMImplementation.createHTMLDocument() - Web APIs
the next two lines handle importing the contents of our new document into the new document's context.
DataTransferItem.webkitGetAsEntry() - Web APIs
then a new <ul> is created and appended to the parent list; this will contain the directory's contents in the next level down in the list's hierarchy.
Document.createNodeIterator() - Web APIs
nodefilter.filter_accept : nodefilter.filter_reject; } } ); const pars = []; let currentnode; while (currentnode = nodeiterator.nextnode()) { pars.push(currentnode); } specifications specification status comment domthe definition of 'document.createnodeiterator' in that specification.
Document.createTreeWalker() - Web APIs
var treewalker = document.createtreewalker( document.body, nodefilter.show_element, { acceptnode: function(node) { return nodefilter.filter_accept; } }, false ); var nodelist = []; var currentnode = treewalker.currentnode; while(currentnode) { nodelist.push(currentnode); currentnode = treewalker.nextnode(); } specifications specification status comment domthe definition of 'document.createtreewalker' in that specification.
Document.evaluate() - Web APIs
WebAPIDocumentevaluate
*/ var thisheading = headings.iteratenext(); var alerttext = "level 2 headings in this document are:\n"; while (thisheading) { alerttext += thisheading.textcontent + "\n"; thisheading = headings.iteratenext(); } alert(alerttext); // alerts the text of all h2 elements note, in the above example, a more verbose xpath is preferred over common shortcuts such as //h2.
Document.fullscreen - Web APIs
function isdocumentinfullscreenmode() { return document.fullscreen; } this next example, on the other hand, uses the current fullscreenelement property to determine the same thing: function isdocumentinfullscreenmode() { return document.fullscreenelement !== null; } if fullscreenelement isn't null, this returns true, indicating that full-screen mode is in effect.
Examples of web and XML development using the DOM - Web APIs
in the next example (see example 4), you can use stylesheets and their rules to change styles for whole documents.
Element.getAttributeNode() - Web APIs
common node attributes like parentnode, previoussibling, and nextsibling are null for an attr node.
Element - Web APIs
WebAPIElement
nondocumenttypechildnode.nextelementsibling read only is an element, the element immediately following the given one in the tree, or null if there's no sibling node.
Event.eventPhase - Web APIs
WebAPIEventeventPhase
example html <h4>event propagation chain</h4> <ul> <li>click 'd1'</li> <li>analyse event propagation chain</li> <li>click next div and repeat the experience</li> <li>change capturing mode</li> <li>repeat the experience</li> </ul> <input type="checkbox" id="chcapture" /> <label for="chcapture">use capturing</label> <div id="d1">d1 <div id="d2">d2 <div id="d3">d3 <div id="d4">d4</div> </div> </div> </div> <div id="divinfo"></div> css div { margin: 20px; padding: 4px; border: thi...
Event.preventDefault() - Web APIs
ob for the purposes of this example: var warningtimeout; var warningbox = document.createelement("div"); warningbox.classname = "warning"; function displaywarning(msg) { warningbox.innerhtml = msg; if (document.body.contains(warningbox)) { window.cleartimeout(warningtimeout); } else { // insert warningbox after mytextbox mytextbox.parentnode.insertbefore(warningbox, mytextbox.nextsibling); } warningtimeout = window.settimeout(function() { warningbox.parentnode.removechild(warningbox); warningtimeout = -1; }, 2000); } result notes calling preventdefault() during any stage of event flow cancels the event, meaning that any default action normally taken by the implementation as a result of the event will not occur.
EventTarget.addEventListener() - Web APIs
; const someobject = {aproperty: 'data'}; mybutton.addeventlistener('click', function() { console.log(someobject.aproperty); // expected value: 'data' someobject.aproperty = 'data again'; // change the value }); window.setinterval(function() { if (someobject.aproperty === 'data again') { console.log('data again: true'); someobject.aproperty = 'data'; // reset value to wait for next event execution } }, 5000); in this example, even though the scope in which both the event listener and the interval function are defined would have finished executing before the original value of someobject.aproperty would have changed, because someobject persists in memory (by reference) in both the event listener and interval function, both have access to the same data (i.e.
FetchEvent - Web APIs
if it finds a match in the cache, it asynchronously updates the cache for next time.
FileSystemDirectoryReader.readEntries() - Web APIs
then a new <ul> is created and appended to the parent list; this will contain the directory's contents in the next level down in the list's hierarchy.
File and Directory Entries API support in Firefox - Web APIs
to ensure your code will work in both chrome and other browsers, you can include code similar to the following: var filesystemdirectoryentry = window.filesystemdirectoryentry || window.directoryentry; var filesystementry = window.filesystementry || window.entry; limitations in firefox next, let's look at limitations of the firefox implementation of the api.
Introduction to the File and Directory Entries API - Web APIs
the app pre-fetches assets in the background, so the user can go to the next task or game level without waiting for a download.
Using the Frame Timing API - Web APIs
registering for notifications after an observer is created, the next step is to use the performanceobserver.observe() method to specify the set of performance events to observe.
Frame Timing API - Web APIs
next, performanceobserver.observe() is used to specify the set of performance events to observe - in this case, just the "frame" event type.
GlobalEventHandlers.onanimationcancel - Web APIs
#box { width: var(--boxwidth); height: var(--boxwidth); left: 0; top: 0; border: 1px solid #7788ff; margin: 0; position: relative; background-color: #2233ff; display: flex; justify-content: center; animation: 5s ease-in-out 0s infinite alternate both slidebox; } the animation's keyframes are described next, plotting a course from the top-left corner of the content box to the bottom-right corner.
GlobalEventHandlers.ontransitioncancel - Web APIs
bold 1.6em "helvetica", "arial", sans-serif; -webkit-transition: width 2s, height 2s, background-color 2s, -webkit-transform 2s, color 2s; transition: width 2s, height 2s, background-color 2s, transform 2s, color 2s; } .box:hover { background-color: #ffcccc; color: #000000; width: 200px; height: 200px; -webkit-transform: rotate(180deg); transform: rotate(180deg); } javascript next, we need to establish our event handlers to change the text content of the box when the transition begins and ends.
GlobalEventHandlers.ontransitionend - Web APIs
idth: 1px; display: block; width: 100px; height: 100px; background-color: #0000ff; color: #ffffff; padding: 20px; font: bold 1.6em "helvetica", "arial", sans-serif; transition: width 2s, height 2s, background-color 2s, transform 2s, color 2s; } .box:hover { background-color: #ffcccc; color: #000000; width: 200px; height: 200px; transform: rotate(180deg); } javascript next, we need to establish our event handlers to change the text content of the box when the transition begins and ends.
HTMLCanvasElement.toDataURL() - Web APIs
color in this example): html <img class="grayscale" src="mypicture.png" alt="description of my picture" /> javascript window.addeventlistener('load', removecolors); function showcolorimg() { this.style.display = 'none'; this.nextsibling.style.display = 'inline'; } function showgrayimg() { this.previoussibling.style.display = 'inline'; this.style.display = 'none'; } function removecolors() { var aimages = document.getelementsbyclassname('grayscale'), nimgslen = aimages.length, ocanvas = document.createelement('canvas'), octx = ocanvas.getcontext('2d'); for (var nwidth, nheight, oimgdata, ograyim...
HTMLElement.offsetLeft - Web APIs
however, for inline-level elements (such as span) that can wrap from one line to the next, offsettop and offsetleft describe the positions of the first border box (use element.getclientrects() to get its width and height), while offsetwidth and offsetheight describe the dimensions of the bounding border box (use element.getboundingclientrect() to get its position).
HTMLImageElement.decode() - Web APIs
this, in turn, prevents the rendering of the next frame after adding the image to the dom from causing a delay while the image loads.
HTMLImageElement - Web APIs
this prevents rendering of the next frame from having to pause to decode the image, as would happen if an undecoded image were added to the dom.
HTMLMediaElement - Web APIs
htmlmediaelement.seektonextframe() seeks to the next frame in the media.
HTMLScriptElement - Web APIs
r) { throw new urierror("the script " + oerror.target.src + " didn't load correctly."); } function prefixscript(url, onloadfunction) { var newscript = document.createelement("script"); newscript.onerror = loaderror; if (onloadfunction) { newscript.onload = onloadfunction; } document.currentscript.parentnode.insertbefore(newscript, document.currentscript); newscript.src = url; } this next function, instead of prepending the new scripts immediately before the document.currentscript element, appends them as children of the <head> tag.
Using microtasks in JavaScript with queueMicrotask() - Web APIs
second, if a microtask adds more microtasks to the queue by calling queuemicrotask(), those newly-added microtasks execute before the next task is run.
Drag Operations - Web APIs
for instance, for a copy, the cursor might appear with a plus sign next to it.
Recommended Drag Types - Web APIs
next, you should set the text/uri-list data, and finally the text/plain data.
History.state - Web APIs
WebAPIHistorystate
the next line logs the value to the console again, showing that history.state now has a value.
Working with the History API - Web APIs
next, suppose http://mozilla.org/bar.html executes the following javascript: history.replacestate(stateobj, "page 3", "bar2.html") this will cause the url bar to display http://mozilla.org/bar2.html, but won't cause the browser to load bar2.html or even check that bar2.html exists.
IDBCursor.advance() - Web APIs
WebAPIIDBCursoradvance
advance() works in a similar way to idbcursor.continue, except that it allows you to jump multiple records at a time, not just always go onto the next record.
IDBDatabase - Web APIs
false }); objectstore.createindex("minutes", "minutes", { unique: false }); objectstore.createindex("day", "day", { unique: false }); objectstore.createindex("month", "month", { unique: false }); objectstore.createindex("year", "year", { unique: false }); objectstore.createindex("notified", "notified", { unique: false }); note.innerhtml += '<li>object store created.</li>'; }; this next line opens up a transaction on the database, then opens an object store that we can then manipulate the data inside of.
IIRFilterNode.getFrequencyResponse() - Web APIs
32array objects we need, one containing the input frequencies, and two to receive the output magnitude and phase values: var myfrequencyarray = new float32array(5); myfrequencyarray[0] = 1000; myfrequencyarray[1] = 2000; myfrequencyarray[2] = 3000; myfrequencyarray[3] = 4000; myfrequencyarray[4] = 5000; var magresponseoutput = new float32array(5); var phaseresponseoutput = new float32array(5); next we create a <ul> element in our html to contain our results, and grab a reference to it in our javascript: <p>iir filter frequency response for: </p> <ul class="freq-response-output"> </ul> var freqresponseoutput = document.queryselector('.freq-response-output'); finally, after creating our filter, we use getfrequencyresponse() to generate the response data and put it in our arrays, then loop ...
IdleDeadline.timeRemaining() - Web APIs
for example, if the callback finishes a task and has another one to begin, it can call timeremaining() to see if there's enough time to complete the next task.
Basic concepts - Web APIs
next steps with these big concepts under our belts, we can get to more concrete stuff.
Intersection Observer API - Web APIs
so if the top level of an <iframe> is reached, the intersection rectangle is clipped to the frame's viewport, then the frame's parent element is the next block recursed through toward the intersection root.
KeyboardEvent.code - Web APIs
let shipsize = { width: 30, height: 30 }; let position = { x: 200, y: 200 }; let moverate = 9; let turnrate = 5; let angle = 0; let spaceship = document.getelementbyid("spaceship"); next comes the function updateposition().
KeyframeEffect.getKeyframes() - Web APIs
easing the timing function used from this keyframe until the next keyframe in the series.
LocalFileSystem - Web APIs
//taking care of the browser-specific prefix window.requestfilesystem = window.requestfilesystem || window.webkitrequestfilesystem; // the first parameter defines the type of storage: persistent or temporary // next, set the size of space needed (in bytes) // initfs is the success callback // and the last one is the error callback // for denial of access and other errors.
LocalFileSystemSync - Web APIs
example //taking care of the browser-specific prefix window.requestfilesystemsync = window.requestfilesystemsync || window.webkitrequestfilesystemsync; // the first parameter defines the type of storage: persistent or temporary // next, set the size of space needed (in bytes) // initfs is the success callback // and the last one is the error callback // for denial of access and other errors.
MediaMetadata.MediaMetadata() - Web APIs
; navigator.mediasession.setactionhandler('play', function() {}); navigator.mediasession.setactionhandler('pause', function() {}); navigator.mediasession.setactionhandler('seekbackward', function() {}); navigator.mediasession.setactionhandler('seekforward', function() {}); navigator.mediasession.setactionhandler('previoustrack', function() {}); navigator.mediasession.setactionhandler('nexttrack', function() {}); } specifications specification status comment media session standardthe definition of 'mediametadata()' in that specification.
MediaRecorder.pause() - Web APIs
if not, continue to the next step.
MediaRecorder.requestData() - Web APIs
if mediarecorder.state is "recording", continue to the next step.
MediaRecorder.resume() - Web APIs
if mediarecorder.state is not "inactive", continue to the next step.
MediaRecorder.start() - Web APIs
then, each time that amount of media has been recorded, an event will be delivered to let you act upon the recorded media, while a new blob is created to record the next slice of the media assuming the mediarecorder's state is inactive, start() sets the state to recording, then begins capturing media from the input stream.
MediaRecorder.stop() - Web APIs
if the mediarecorder.state is not "inactive", continue on to the next step.
MediaSession.metadata - Web APIs
; navigator.mediasession.setactionhandler('play', function() {}); navigator.mediasession.setactionhandler('pause', function() {}); navigator.mediasession.setactionhandler('seekbackward', function() {}); navigator.mediasession.setactionhandler('seekforward', function() {}); navigator.mediasession.setactionhandler('previoustrack', function() {}); navigator.mediasession.setactionhandler('nexttrack', function() {}); } specifications specification status comment media session standardthe definition of 'mediasession.metadata' in that specification.
MediaSession - Web APIs
; navigator.mediasession.setactionhandler('play', function() {}); navigator.mediasession.setactionhandler('pause', function() {}); navigator.mediasession.setactionhandler('seekbackward', function() {}); navigator.mediasession.setactionhandler('seekforward', function() {}); navigator.mediasession.setactionhandler('previoustrack', function() {}); navigator.mediasession.setactionhandler('nexttrack', function() {}); } the following example sets up event handlers for pausing and playing: var audio = document.queryselector("#player"); audio.src = "song.mp3"; navigator.mediasession.setactionhandler('play', play); navigator.mediasession.setactionhandler('pause', pause); function play() { audio.play(); navigator.mediasession.playbackstate = "playing"; } function pause() { audio.p...
Media Session action types - Web APIs
the following strings identify the currently available types of media session action: nexttrack advances playback to the next track.
MediaSessionActionDetails.action - Web APIs
syntax let mediasessionactiondetails = { action: actiontype }; let actiontype = mediasessionactiondetails.action; value a domstring specifying which of the action types the callback is being invoked for: nexttrack advances playback to the next track.
MediaSessionActionDetails - Web APIs
the following strings identify the currently available types of media session action: nexttrack advances playback to the next track.
MediaStream.getAudioTracks() - Web APIs
note: the order of the returned tracks is not defined by the specification and may, in fact, change from one call to getaudiotracks() to the next.
MediaStreamAudioSourceNode - Web APIs
next, we feed this source audio into a low pass biquadfilternode (which effectively serves as a bass booster), then a audiodestinationnode.
MediaStreamTrack.enabled - Web APIs
for example, the green "in use" light next to the camera in imac and macbook computers turns off while the track is muted in this way.
MediaStreamTrackAudioSourceNode - Web APIs
next, we feed this source audio into a low pass biquadfilternode (which effectively serves as a bass booster), then a audiodestinationnode.
MediaStream Image Capture API - Web APIs
}) next, isolate the visual part of the media stream.
Recording a media element - Web APIs
utility functions next, we create some utility functions that will get used later.
MediaTrackConstraints.latency - Web APIs
in audio processing, latency is the time between the start of processing (when sound occurs in the real world, or is generated by a hardware device) and the data being made available to the next step in the audio input or output process.
MediaTrackSettings - Web APIs
latency is the amount of time which elapses between the start of processing the audio and the data being available to the next stop in the audio utilization process.
Media Session API - Web APIs
*/ }); navigator.mediasession.setactionhandler('nexttrack', function() { /* code excerpted.
Transcoding assets for Media Source Extensions - Web APIs
get these installed successfully before moving to the next step.
Capabilities, constraints, and settings - Web APIs
we also need to set up an event listener to watch for the "start video" button to be clicked: document.getelementbyid("startbutton").addeventlistener("click", function() { startvideo(); }, false); applying constraint set updates next, we set up an event listener for the "apply constraints" button.
msPlayToSource - Web APIs
msplaytosource is used in the sourcerequested handler -- get the playtosource object from an audio, video, or img element using the msplaytosource property and pass it to e.setsource, then set the playtosource.next property to the msplaytosource of another element for continual playing.
MutationRecord - Web APIs
mutationrecord.nextsibling node return the next sibling of the added or removed nodes, or null.
Web-based protocol handlers - Web APIs
example <!doctype html public "-//w3c//dtd html 4.01//en"> <html lang="en"> <head> <title>web protocol handler sample - test</title> </head> <body> <p>hey have you seen <a href="web+burger:cheeseburger">this</a> before?</p> </body> </html> handling the next phase is handling the action.
Node.previousSibling - Web APIs
to navigate the opposite way through the child nodes list use node.nextsibling.
Node - Web APIs
WebAPINode
node.nextsiblingread only returns a node representing the next node in the tree, or null if there isn't such node.
NodeFilter.acceptNode() - Web APIs
/^\s*$/.test(node.data) ) { return nodefilter.filter_accept; } } }, false ); // show the content of every non-empty text node that is a child of root var node; while ((node = iterator.nextnode())) { alert(node.data); } specifications specification status comment domthe definition of 'nodefilter.acceptnode()' in that specification.
NodeFilter - Web APIs
/^\s*$/.test(node.data) ) { return nodefilter.filter_accept } } }, false ); // show the content of every non-empty text node that is a child of root let node; while ((node = nodeiterator.nextnode())) { alert(node.data) } specifications specification status comment domthe definition of 'nodefilter' in that specification.
NodeIterator.detach() - Web APIs
syntax nodeiterator.detach(); example var nodeiterator = document.createnodeiterator( document.body, nodefilter.show_element, { acceptnode: function(node) { return nodefilter.filter_accept; } }, false ); nodeiterator.detach(); // detaches the iterator nodeiterator.nextnode(); // throws an invalid_state_err exception specifications specification status comment domthe definition of 'nodeiterator.detach' in that specification.
NodeIterator.previousNode() - Web APIs
syntax node = nodeiterator.previousnode(); example var nodeiterator = document.createnodeiterator( document.body, nodefilter.show_element, { acceptnode: function(node) { return nodefilter.filter_accept; } }, false // this optional argument is not used any more ); currentnode = nodeiterator.nextnode(); // returns the next node previousnode = nodeiterator.previousnode(); // same result, since we backtracked to the previous node specifications specification status comment domthe definition of 'nodeiterator.previousnode' in that specification.
Notifications API - Web APIs
next, a new notification is created using the notification() constructor.
Page Visibility API - Web APIs
a site has an image carousel that shouldn't advance to the next slide unless the user is viewing the page an application showing a dashboard of information doesn't want to poll the server for updates when the page isn't visible a page wants to detect when it is being prerendered so it can keep accurate count of page views a site wants to switch off sounds when a device is in standby mode (user pushes power button to turn screen off) developers have histo...
PannerNode.coneInnerAngle - Web APIs
const x = math.cos(radians); const z = math.sin(radians); // we hard-code the y component to 0, as y is the axis of rotation return [x, 0, z]; }; now we can create our audiocontext, an oscillator and a pannernode: const context = new audiocontext(); const osc = new oscillatornode(context); osc.type = 'sawtooth'; const panner = new pannernode(context); panner.panningmodel = 'hrtf'; next, we set up the cone of our spatialised sound, determining the area in which it can be heard: // this value determines the size of the area in which the sound volume is constant // if coneinnerangle == 30, it means that when the sound is rotated // by at most 15 (30/2) degrees either direction, the volume won't change panner.coneinnerangle = 30; // this value determines the size of the area in wh...
PannerNode.coneOuterAngle - Web APIs
const x = math.cos(radians); const z = math.sin(radians); // we hard-code the y component to 0, as y is the axis of rotation return [x, 0, z]; }; now we can create our audiocontext, an oscillator and a pannernode: const context = new audiocontext(); const osc = new oscillatornode(context); osc.type = 'sawtooth'; const panner = new pannernode(context); panner.panningmodel = 'hrtf'; next, we set up the cone of our spatialised sound, determining the area in which it can be heard: // this value determines the size of the area in which the sound volume is constant // if coneinnerangle == 30, it means that when the sound is rotated // by at most 15 (30/2) degrees either direction, the volume won't change panner.coneinnerangle = 30; // this value determines the size of the area in wh...
PannerNode.coneOuterGain - Web APIs
const x = math.cos(radians); const z = math.sin(radians); // we hard-code the y component to 0, as y is the axis of rotation return [x, 0, z]; }; now we can create our audiocontext, an oscillator and a pannernode: const context = new audiocontext(); const osc = new oscillatornode(context); osc.type = 'sawtooth'; const panner = new pannernode(context); panner.panningmodel = 'hrtf'; next, we set up the cone of our spatialised sound, determining the area in which it can be heard: // this value determines the size of the area in which the sound volume is constant // if coneinnerangle == 30, it means that when the sound is rotated // by at most 15 (30/2) degrees either direction, the volume won't change panner.coneinnerangle = 30; // this value determines the size of the area in wh...
PannerNode.orientationX - Web APIs
const x = math.cos(radians); const z = math.sin(radians); // we hard-code the y component to 0, as y is the axis of rotation return [x, 0, z]; }; now we can create our audiocontext, an oscillator and a pannernode: const context = new audiocontext(); const osc = new oscillatornode(context); osc.type = 'sawtooth'; const panner = new pannernode(context); panner.panningmodel = 'hrtf'; next, we set up the cone of our spatialised sound, determining the area in which it can be heard: // this value determines the size of the area in which the sound volume is constant // if coneinnerangle == 30, it means that when the sound is rotated // by at most 15 (30/2) degrees either direction, the volume won't change panner.coneinnerangle = 30; // this value determines the size of the area in wh...
PannerNode.orientationY - Web APIs
const x = math.cos(radians); const z = math.sin(radians); // we hard-code the y component to 0, as y is the axis of rotation return [x, 0, z]; }; now we can create our audiocontext, an oscillator and a pannernode: const context = new audiocontext(); const osc = new oscillatornode(context); osc.type = 'sawtooth'; const panner = new pannernode(context); panner.panningmodel = 'hrtf'; next, we set up the cone of our spatialised sound, determining the area in which it can be heard: // this value determines the size of the area in which the sound volume is constant // if coneinnerangle == 30, it means that when the sound is rotated // by at most 15 (30/2) degrees either direction, the volume won't change panner.coneinnerangle = 30; // this value determines the size of the area in wh...
PannerNode.orientationZ - Web APIs
const x = math.cos(radians); const z = math.sin(radians); // we hard-code the y component to 0, as y is the axis of rotation return [x, 0, z]; }; now we can create our audiocontext, an oscillator and a pannernode: const context = new audiocontext(); const osc = new oscillatornode(context); osc.type = 'sawtooth'; const panner = new pannernode(context); panner.panningmodel = 'hrtf'; next, we set up the cone of our spatialised sound, determining the area in which it can be heard: // this value determines the size of the area in which the sound volume is constant // if coneinnerangle == 30, it means that when the sound is rotated // by at most 15 (30/2) degrees either direction, the volume won't change panner.coneinnerangle = 30; // this value determines the size of the area in wh...
PaymentRequest: shippingoptionchange event - Web APIs
for example, if there are three options (such as "free ground shipping", "2-day air", and "next day"), each time the user chooses one of those options, this event handler is called to recalculate the total based on the changed shipping option.
PerformanceResourceTiming - Web APIs
performanceresourcetiming.nexthopprotocolread only a string representing the network protocol used to fetch the resource, as identified by the alpn protocol id (rfc7301).
Performance API - Web APIs
resource timing level 2 working draft adds the nexthopprotocol, workerstart, transfersize, encodedbodysize, and decodedbodysize properties to the performanceresourcetiming interface.
Pointer Lock API - Web APIs
we set initial x and y positions on the canvas: var x = 50; var y = 50; the pointer lock methods are currently prefixed, so next we'll fork them for the different browser implementations.
Pinch zoom gestures - Web APIs
ff) { // the distance between the two pointers has increased log("pinch moving out -> zoom in", ev); ev.target.style.background = "pink"; } if (curdiff < prevdiff) { // the distance between the two pointers has decreased log("pinch moving in -> zoom out",ev); ev.target.style.background = "lightblue"; } } // cache the distance for the next move event prevdiff = curdiff; } } pointer up the pointerup event is fired when a pointer is raised from the contact surface.
RTCDTMFSender.toneBuffer - Web APIs
the comma (",") this character instructs the dialing process to pause for two seconds before sending the next character in the buffer.
RTCDTMFToneChangeEvent.RTCDTMFToneChangeEvent() - Web APIs
the comma (",") this character instructs the dialing process to pause for two seconds before sending the next character in the buffer.
RTCDTMFToneChangeEvent - Web APIs
it appends each tone to a display box as it's played, and, once all tones have been sent, re-enabled a previously-disabled "send" button, allowing the next dmtf string to be entered.
RTCIceCandidate.component - Web APIs
the next field on the a-line, "1", is the component id.
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.
RTCIceCandidateStats.networkType - Web APIs
note: keep in mind that the specified value only reflects the initial connection between the local peer and the next hop along the network toward reaching the remote peer.
RTCIceServers.urls - Web APIs
WebAPIRTCIceServerurls
mypeerconnection = new rtcpeerconnection({ iceservers: [ { urls: "turn:turnserver.example.org", username: "webrtc", credential: "turnpassword" } ] }); a single ice server with multiple urls the next example creates a new rtcpeerconnection which will use a single turn server which has multiple urls.
RTCNetworkType - Web APIs
note: keep in mind that the specified value only reflects the initial connection between the local peer and the next hop along the network toward reaching the remote peer.
RTCOfferOptions.iceRestart - Web APIs
syntax var options = { icerestart: trueorfalse }; value a boolean value indicating whether or not the rtcpeerconnection should generate new values for the connection's ice-ufrag and ice-pwd values, which will trigger ice renegotiation on the next message sent to the remote peer.
RTCPeerConnection.getReceivers() - Web APIs
the order of the returned rtcrtpreceiver instances is not defined by the specification, and may change from one call to getreceivers() to the next.
RTCPeerConnection.getSenders() - Web APIs
the order of the returned rtcrtpsenders is not defined by the specification, and may change from one call to getsenders() to the next.
ReadableStream.pipeThrough() - Web APIs
next, we log the contents of the readable stream, use pipethrough() to send it to a new function that creates a gray-scaled version of the stream, then log the new stream's contents too.
ReadableStreamBYOBReader.read() - Web APIs
the read() method of the readablestreambyobreader interface returns a promise providing access to the next chunk in the byte stream's internal queue.
ReadableStreamBYOBReader - Web APIs
readablestreambyobreader.read() returns a promise providing access to the next chunk in the stream's internal queue.
ReadableStreamDefaultReader.read() - Web APIs
the read() method of the readablestreamdefaultreader interface returns a promise providing access to the next chunk in the stream's internal queue.
ReadableStreamDefaultReader - Web APIs
readablestreamdefaultreader.read() returns a promise providing access to the next chunk in the stream's internal queue.
Selection.setBaseAndExtent() - Web APIs
next, we have two form inputs that allow you to set the anchoroffset and focusoffset — they both have a default value of 0.
ServiceWorkerRegistration - Web APIs
next, it adds an updatefound listener in which it uses the service worker registration to listen for further changes to the service worker's state.
Service Worker API - Web APIs
performance enhancements, for example pre-fetching resources that the user is likely to need in the near future, such as the next few pictures in a photo album.
Using writable streams - Web APIs
this is called when each chunk is actually written (see the next section).
SubmitEvent() - Web APIs
next, a new submitevent is created, configured with its submitter set to the identified button (or null if the button wasn't found).
Text.splitText() - Web APIs
WebAPITextsplitText
if the original node had a parent, the new node is inserted as the next sibling of the original node.
UIEvent.detail - Web APIs
WebAPIUIEventdetail
the uievent.detail read-only property, when non-zero, provides the current (or next, depending on the event) click count.
URLSearchParams.set() - Web APIs
the key/value pairs for(var pair of theurl.searchparams.entries()) { console.debug(pair[0] + ' = \'' + pair[1] + '\''); } console.debug(theurl) } return theurl } var url = genurl( /(^\s*\/\/|\s*[^:]\/\/).*\s*$|\s*\/\*(.|\n)+?\*\/\s*$/gm // single/multi-line comments // /(^\s*\/\/.*|\s*[^:]\/\/.*)/g // single-line comments ,[ "these should work:", "", "// eslint-disable-next-line no-unused-vars", "lockpref( 'keyword.url',\t\t'https://duckduckgo.com/html/?q=!+' )\t// test", "/*", " * bla bla ", "*/", "", "/* bla bla */", "", "// bla bla ", "", "these shouldn\'t work:", "console.log(\"http://foo.co.uk/\")", "var url = \"http://regexr.com/foo.html?q=bar\"", "alert(\"https://mediatemple.net\")", ] , true ) console.info( url, url.tostri...
VideoTrack - Web APIs
this first example gets the first video track on the media: var firsttrack = tracks[0]; the next example scans through all of the media's video tracks, activating the first video track that is in the user's preferred language (taken from a variable userlanguage).
Visual Viewport API - Web APIs
using requestanimationframe() ensures that the transform ocurrs before the next render.
WebGLRenderingContext.getUniformLocation() - Web APIs
having done this, the next time the shading functions are called, their own variables named uscalingfactor, uglobalcolor, and urotationvector will all have the values provided by the javascript code.
WebGLRenderingContext.uniform[1234][fi][v]() - Web APIs
they retain the values assigned to them by a call to this method until the next successful link operation occurs on the program object, when they are once again initialized to 0.
WebGLRenderingContext.vertexAttribPointer() - Web APIs
if stride is 0, the attribute is assumed to be tightly packed, that is, the attributes are not interleaved but each attribute is in a separate block, and the next vertex' attribute follows immediately after the current vertex.
Matrix math for the web - Web APIs
the next sections will demonstrate some of these matrices.
Animating textures in WebGL - Web APIs
using the video frames as a texture the next change is to inittexture(), which becomes much simpler, since it no longer needs to load an image file.
Getting started with WebGL - Web APIs
next » webgl enables web content to use an api based on opengl es 2.0 to perform 2d and 3d rendering in an html canvas in browsers that support it without the use of plug-ins.
WebGL best practices - Web APIs
// later, for example the next frame: if (ext) { if (gl.getprogramparameter(prog, ext.completion_status_khr)) { // check program link status; if ok, use and draw with it.
Writing WebSocket client applications - Web APIs
examplesocket.send(json.stringify(msg)); // blank the text input element, ready to receive the next line of text from the user.
Writing a WebSocket server in C# - Web APIs
this means that the next four bytes (61, 84, 35, and 6) are the mask bytes used to decode the message.
Writing a WebSocket server in Java - Web APIs
try { string data = s.usedelimiter("\\r\\n\\r\\n").next(); matcher get = pattern.compile("^get").matcher(data); creating the response is easier than understanding why you must do it in this way.
Fundamentals of WebXR - Web APIs
playcanvas next steps with these basic facts in hand, you're ready to take those next steps into the world of mixed reality.
Geometry and reference spaces in WebXR - Web APIs
next, consider the xr controller you have in your left hand.
WebXR Device API - Web APIs
it's a good way to prepare for the next steps.
Basic concepts behind Web Audio API - Web APIs
when a buffer plays, you will hear the left most sample frame, and then the one right next to it, etc.
Controlling multiple parameters with ConstantSourceNode - Web APIs
next, the gainnode gainnode1 is created to handle the volume for the non-linked oscillator (oscnode1).
Web audio spatialization basics - Web APIs
let's create constants that store the values we'll use for these parameters later on: const innercone = 60; const outercone = 90; const outergain = 0.3; the next parameter is distancemodel — this can only be set to linear, inverse, or exponential.
Using the Web Storage API - Web APIs
next, we set the values displayed in the form elements to those values, so that they keep in sync when you reload the page.
Window.console - Web APIs
WebAPIWindowconsole
console.log("an error occurred while loading the content"); the next example logs an object to the console, with the object's fields expandable using disclosure widgets: console.dir(someobject); see usage in console for more thorough examples.
Window.history - Web APIs
WebAPIWindowhistory
example history.back(); // equivalent to clicking back button history.go(-1); // equivalent to history.back(); notes for top-level pages you can see the list of pages in the session history, accessible via the history object, in the browser's dropdowns next to the back and forward buttons.
Window: popstate event - Web APIs
next, current-entry is set to new-entry.
Window.routeEvent() - Web APIs
WebAPIWindowrouteEvent
the window method routeevent(), which is obsolete and no longer available, used to be called to forward an event to the next object that has asked to capture events.
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.
WorkerGlobalScope.dump() - Web APIs
next, run a worker containing the following line: dump('test\n'); this should result in a "test" message being output to the terminal.
Synchronous and asynchronous requests - Web APIs
:( client.setrequestheader("content-type", "text/plain;charset=utf-8"); client.send(analyticsdata); } using the sendbeacon() method, the data will be transmitted asynchronously to the web server when the user agent has had an opportunity to do so, without delaying the unload or affecting the performance of the next navigation.
XPathResult - Web APIs
methods xpathresult.iteratenext() if the result is a node set, this method iterates over it and returns the next node from it or null if there are no more nodes.
XRInputSourceArray.values() - Web APIs
each pass through the loop, source is the next xrinputsource in the list.
XRInputSourcesChangeEvent - Web APIs
examples the following example shows how to set up an event handler which uses inputsourceschange events to detect newly-available pointing devices and to load their models in preparation to display them in the next animation frame.
XRReferenceSpace.getOffsetReferenceSpace() - Web APIs
canvas.oncontextmenu = (event) => { event.preventdefault(); }; canvas.addeventlistener("mousemove", (event) => { if (event.buttons & 2) { rotateviewby(event.movementx, event.movementy); } }); next, the rotateviewby() function, which updates the mouse look direction's yaw and pitch based on the mouse delta values from the mousemove event.
XRRenderState - Web APIs
when you apply changes using the xrsession method updaterenderstate(), the specified changes take effect after the current animation frame has completed, but before the next one begins.
XRRenderStateInit - Web APIs
the xrrenderstateinit dictionary is a writeable version of the xrrenderstate interface, and is used when calling an xrsession's updaterenderstate() method to apply changes to the render state prior to rendering the next frame.
XRRigidTransform() - Web APIs
the drawframe() callback will be executed when the system is ready to draw the next frame.
XRSession.cancelAnimationFrame() - Web APIs
since each frame callback schedules the next one, removing the callback terminates updating of the webxr scene.
XRSession - Web APIs
WebAPIXRSession
requestanimationframe() schedules the specified method to be called the next time the user agent is working on rendering an animation frame for the webxr device.
XRSystem: requestSession() - Web APIs
next, it calls issessionsupported(), passing it the desired session option before enabling controls for entering xr.
Basic form hints - Accessibility
on lines 4 and 12, the aria-required attributes are set to true (in addition to the asterisks next to the labels), indicating that the name and email fields are required.
Alerts - Accessibility
next, the function creates a div element to hold the alert text.
Cognitive accessibility - Accessibility
link text conveys meaning the link's text should clearly and concisely communicate what the user should expect to be navigated to next if they choose to activate it.
Operable - Accessibility
the only exception to this is where a page is one step in a process, so should only logically have links to the previous and next steps.
Perceivable - Accessibility
content images should have text available that clearly describes the image's contents, which can be programmatically associated with it (e.g., alt text), or otherwise is easy to associate (e.g., describes it and is sat right next to it).
Understanding the Web Content Accessibility Guidelines - Accessibility
wcag 2.1 includes: all of wcag 2.0 (verbatim, word-for-word) 17 new success criteria at the a / aa / aaa levels primarily addressing user needs in these areas: mobile accessibility low vision cognitive read more about wcag 2.1: deque: wcag 2.1: what is next for accessibility guidelines tpg: web content accessibility guidelines (wcag) 2.1 legal standing this guide is intended to provide practical information to help you build better, more accessible websites.
-moz-image-rect - CSS: Cascading Style Sheets
by simply copying the values of the background-image property from one element to the next with each mouse click, we achieve the desired effect.
-webkit-mask-repeat-x - CSS: Cascading Style Sheets
when the next image is added, all of the current ones compress to allow room.
-webkit-mask-repeat-y - CSS: Cascading Style Sheets
when the next image is added, all of the current ones compress to allow room.
::slotted() - CSS: Cascading Style Sheets
WebCSS::slotted
this allows them to stand out better next to the slots that haven't been successfully filled.
:nth-child() - CSS: Cascading Style Sheets
this may seem weird at first, but it makes more sense when the b part of the formula is >0, like in the next example.
src - CSS: Cascading Style Sheets
WebCSS@font-facesrc
fonts containing invalid data or local font faces that are not found are ignored and the user agent loads the next font in the list.
At-rules - CSS: Cascading Style Sheets
WebCSSAt-rule
they begin with an at sign, '@' (u+0040 commercial at), followed by an identifier and includes everything up to the next semicolon, ';' (u+003b semicolon), or the next css block, whichever comes first.
Detecting CSS animation support - CSS: Cascading Style Sheets
the next task is to actually add the keyframes to the page's css.
Handling content breaks in multicol - CSS: Cascading Style Sheets
they take the following values when in a multicol context: auto avoid avoid-column column in this next example, we are forcing a column break before an h2 element.
Controlling Ratios of Flex Items Along the Main Axis - CSS: Cascading Style Sheets
in the next live example i have three items in a flex container; i’ve given each a width of 200 pixels, and the container is 500 pixels wide.
Relationship of flexbox to other layout methods - CSS: Cascading Style Sheets
in this next live example the child elements have been floated, and then their container has had display: flex added.
Block and inline layout in normal flow - CSS: Cascading Style Sheets
in the next example, i have made the <strong> element 300%; that content now defines the height of the line box on that line.
Flow Layout and Overflow - CSS: Cascading Style Sheets
comparing the next example with the example for overflow: scroll you should see overflow scroll has horizontal and vertical scrollbars when it only needs vertical scrolling.
Introduction to formatting contexts - CSS: Cascading Style Sheets
in the next guide, we will find out how normal flow interacts with different writing modes.
CSS Grid Layout and Accessibility - CSS: Cascading Style Sheets
this means that someone navigating using the keyboard could be tabbing through links on your site and suddenly find themselves jumping from the top to the bottom of the document due to a reordered item being next in line.
CSS Grid Layout and Progressive Enhancement - CSS: Cascading Style Sheets
in this next example, i have a set of floated cards.
Line-based placement with CSS Grid - CSS: Cascading Style Sheets
in this next example i have flipped the layout we were working with by working from the right and bottom of our grid when placing the items.
Inline formatting context - CSS: Cascading Style Sheets
in the next example there is a (<span>) element wrapping a set of words wrapping onto two lines.
Card - CSS: Cascading Style Sheets
i then set the next track — which is where the content lives — to 1fr.
Mozilla CSS extensions - CSS: Cascading Style Sheets
ersion still accepted] -moz-transition-delay [prefixed version still accepted] -moz-transition-duration [prefixed version still accepted] -moz-transition-property [prefixed version still accepted] -moz-transition-timing-function [prefixed version still accepted] -moz-user-select values global values -moz-initial -moz-appearance button button-arrow-down button-arrow-next button-arrow-previous button-arrow-up button-bevel checkbox checkbox-container checkbox-label checkmenuitem dialog groupbox listbox menuarrow menucheckbox menuimage menuitem menuitemtext menulist menulist-button menulist-text menulist-textfield menupopup menuradio menuseparator -moz-mac-unified-toolbar -moz-win-borderless-glass -moz-win-browsertabbar-toolbox -moz-win-com...
Syntax - CSS: Cascading Style Sheets
WebCSSSyntax
at-rules that start with an at sign, '@' (u+0040 commercial at), followed by an identifier and then continuing up to the end of the statement, that is up to the next semi-colon (;) outside of a block, or the end of the next block.
Universal selectors - CSS: Cascading Style Sheets
examples css * [lang^=en] { color: green; } *.warning { color: red; } *#maincontent { border: 1px solid blue; } .floating { float: left } /* automatically clear the next sibling after a floating element */ .floating + * { clear: left; } html <p class="warning"> <span lang="en-us">a green span</span> in a red paragraph.
Using CSS custom properties (variables) - CSS: Cascading Style Sheets
so move on to the next step.
Value definition syntax - CSS: Cascading Style Sheets
juxtaposition placing several keywords, literals or data types, next to one another, only separated by one or several spaces, is called juxtaposition.
Visual formatting model - CSS: Cascading Style Sheets
in the next example i have a string inside a <div>; in the middle of my string is a <p> element containing part of the text.
Actual value - CSS: Cascading Style Sheets
next, the computed value is calculated according to the specification (for example, a span with position: absolute will have its computed display changed to block).
animation-iteration-count - CSS: Cascading Style Sheets
if multiple values are specified, each time the animation is played the next value in the list is used, cycling back to the first value after the last one is used.
animation-timing-function - CSS: Cascading Style Sheets
a keyframe's timing function is applied on a property-by-property basis from the keyframe on which it is specified until the next keyframe specifying that property, or until the end of the animation if there is no subsequent keyframe specifying that property.
appearance (-moz-appearance, -webkit-appearance) - CSS: Cascading Style Sheets
value browser description button-arrow-down firefox removed in firefox 64 button-arrow-next firefox removed in firefox 64 button-arrow-previous firefox removed in firefox 64 button-arrow-up firefox removed in firefox 64 button-focus firefox removed in firefox 64 dualbutton firefox removed in firefox 64 groupbox firefox removed in firefox 64 menuarrow firefox remove...
background-repeat - CSS: Cascading Style Sheets
when the next image is added, all of the current ones compress to allow room.
box-decoration-break - CSS: Cascading Style Sheets
note that if you stack the rendering of the two fragments horizontally next to each other it will result in the non-fragmented rendering.
box-flex-group - CSS: Cascading Style Sheets
if the space of all flexible children within the group has been increased to the maximum, the process repeats for the children within the next flex group, using any space left over from the previous flex group.
break-inside - CSS: Cascading Style Sheets
values */ break-inside: auto; break-inside: avoid; break-inside: avoid-page; break-inside: avoid-column; break-inside: avoid-region; /* global values */ break-inside: inherit; break-inside: initial; break-inside: unset; each possible break point (in other words, each element boundary) is affected by three properties: the break-after value of the previous element, the break-before value of the next element, and the break-inside value of the containing element.
caret-color - CSS: Cascading Style Sheets
the caret-color css property sets the color of the insertion caret, the visible marker where the next character typed will be inserted.
cursor - CSS: Cascading Style Sheets
WebCSScursor
the browser will try to load the first image specified, falling back to the next if it can't, and falling back to the keyword value if no images could be loaded (or if none were specified).
<display-outside> - CSS: Cascading Style Sheets
in normal flow, the next element will be on the same line if there is space run-in the element generates a run-in box.
display - CSS: Cascading Style Sheets
WebCSSdisplay
in normal flow, the next element will be on the same line if there is space run-in the element generates a run-in box.
float - CSS: Cascading Style Sheets
WebCSSfloat
additional squares would continue to stack to the right, until they filled the containing box, after which they would wrap to the next line.
image-orientation - CSS: Cascading Style Sheets
formal definition initial value0degapplies toall elementsinheritedyescomputed valuean <angle>, rounded to the next quarter turn from 0deg and normalized, that is moduloing the value by 1turnanimation typediscrete formal syntax from-image | <angle> | [ <angle>?
list-style-position - CSS: Cascading Style Sheets
chrome and safari both place this element on the same line as the marker box, whereas firefox, internet explorer, and opera place it on the next line.
mask-repeat - CSS: Cascading Style Sheets
when the next image is added, all of the current ones compress to allow room.
quotes - CSS: Cascading Style Sheets
WebCSSquotes
the first pair represents the outer level of quotation, the second pair is for the first nested level, next pair for third level and so on.
CSS: Cascading Style Sheets
WebCSS
styling text with the basics of the css language covered, the next css topic for you to concentrate on is styling text — one of the most common things you'll do with css.
Cross-browser audio basics - Developer guides
creating our own controls: <audio id="my-audio"> <source src="audiofile.mp3" type="audio/mpeg"> <source src="audiofile.ogg" type="audio/ogg"> <!-- place fallback here as <audio> supporting browsers will ignore it --> <p>download<a href="audiofile.mp3">audiofile.mp3</a></p> </audio> <!-- custom play and pause buttons --> <button id="play">play</button> <button id="pause">pause</button> next, we attach some functionality to the player using javascript: window.onload = function(){ var myaudio = document.getelementbyid('my-audio'); var play = document.getelementbyid('play'); var pause = document.getelementbyid('pause'); // associate functions with the 'onclick' events play.onclick = playaudio; pause.onclick = pauseaudio; function playaudio() { myaudio.play(); } ...
Live streaming web audio and video - Developer guides
so for example, if we detect that the network is slow, we can start requesting lower quality (smaller) chunks for the next segment.
Web Audio playbackRate explained - Developer guides
next we set playbackrate to 0.5, which represents half normal speed (the playbackrate is a multiplier applied to the original rate.) a complete example let's create a <video> element first, and set up video and playback rate controls in html: <video id="myvideo" controls> <source src="https://udn.realityripple.com/samples/6f/08625b424a.m4v" type='video/mp4' /> <source src="https://udn.realityri...
Creating a cross-browser video player - Developer guides
the next step is to define a custom control set, also in html, which will be used to control the video.
Audio and Video Delivery - Developer guides
to grab the stream from your webcam, first set up a <video> element: <video id="webcam" width="480" height="360"></video> next, if supported connect the webcam source to the video element: if (navigator.mediadevices) { navigator.mediadevices.getusermedia({ video: true, audio: false }) .then(function onsuccess(stream) { var video = document.getelementbyid('webcam'); video.autoplay = true; video.srcobject = stream; }) .catch(function onerror() { alert('there has been a problem retreiving the stream...
Using HTML sections and outlines - Developer guides
next up, older ie versions do not allow styling of unsupported elements, unless you create an instance of them in the dom.
<h1>–<h6>: The HTML Section Heading elements - HTML: Hypertext Markup Language
avoid skipping heading levels: always start from <h1>, next use <h2> and so on.
<details>: The Details disclosure element - HTML: Hypertext Markup Language
WebHTMLElementdetails
a disclosure widget is typically presented onscreen using a small triangle which rotates (or twists) to indicate open/closed status, with a label next to the triangle.
<dt>: The Description Term element - HTML: Hypertext Markup Language
WebHTMLElementdt
it is usually followed by a <dd> element; however, multiple <dt> elements in a row indicate several terms that are all defined by the immediate next <dd> element.
<input type="month"> - HTML: Hypertext Markup Language
WebHTMLElementinputmonth
we had to put the icons on a <span> next to the input, not on the input itself, because in chrome the generated content is placed inside the form control, and can't be styled or shown effectively.
<input type="tel"> - HTML: Hypertext Markup Language
WebHTMLElementinputtel
permitted values are: go, done, next, search, and send.
<input type="url"> - HTML: Hypertext Markup Language
WebHTMLElementinputurl
permitted values are: go, done, next, search, and send.
<input type="week"> - HTML: Hypertext Markup Language
WebHTMLElementinputweek
we had to put the icons on a <span> next to the input, not on the input itself, because in chrome the generated content is placed inside the form control, and can't be styled or shown effectively.
<isindex> - HTML: Hypertext Markup Language
WebHTMLElementisindex
in 2016, after it was removed from edge and chrome, it was proposed to remove isindex from the standard; this removal was completed the next day, after which safari and firefox also removed support.
<p>: The Paragraph element - HTML: Hypertext Markup Language
WebHTMLElementp
screen-readers and other assistive technology provide shortcuts to let their users skip to the next or previous paragraph, letting them skim content like how white space lets visual users skip around.
<picture>: The Picture element - HTML: Hypertext Markup Language
WebHTMLElementpicture
if the <source>'s media condition evaluates to false, the browser skips it and evaluates the next element inside <picture>.
<samp>: The Sample Output element - HTML: Hypertext Markup Language
WebHTMLElementsamp
found <em>n</em> results.</samp> you can then proceed to the next step.</p> the resulting output looks like this: sample output including user input you can nest the <kbd> element within a <samp> block to present an example that includes text entered by the user.
<summary>: The Disclosure Summary element - HTML: Hypertext Markup Language
WebHTMLElementsummary
this makes it possible to change or remove the icon displayed as the disclosure widget next to the label from the default, which is typically a triangle.
<tbody>: The Table Body element - HTML: Hypertext Markup Language
WebHTMLElementtbody
</tr> </thead> <tbody> <tr> <td>3741255</td> <td>jones, martha</td> <td>computer science</td> </tr> <tr> <td>3971244</td> <td>nim, victor</td> <td>russian literature</td> </tr> <tr> <td>4100332</td> <td>petrov, alexandra</td> <td>astrophysics</td> </tr> </tbody> </table> css the css to style our table is shown next.
<tr>: The Table Row element - HTML: Hypertext Markup Language
WebHTMLElementtr
we'll add <thead>, <tbody>, and <tfoot> in the next example.
HTML elements reference - HTML: Hypertext Markup Language
WebHTMLElement
<nextid> <nextid> is an obsolete html element that served to enable the next web designing tool to generate automatic name labels for its anchors.
data-* - HTML: Hypertext Markup Language
note that the htmlelement.dataset property is a domstringmap, and the name of the custom data attribute data-test-value will be accessible via htmlelement.dataset.testvalue (or by htmlelement.dataset["testvalue"]) as any dash (u+002d) is replaced by the capitalization of the next letter, converting the name to camelcase.
Link types: prerender - HTML: Hypertext Markup Language
the prerender keyword for the rel attribute of the <link> element is a hint to browsers that the user might need the target resource for the next navigation, and therefore the browser can likely improve the user experience by preemptively fetching and processing the resource — for example, by fetching its subresources or performing some rendering in the background offscreen.
Using the application cache - HTML: Hypertext Markup Language
in firefox, the offline cache data is stored separately from the firefox profile—next to the regular disk cache: windows vista/7: c:\users\<username>\appdata\local\mozilla\firefox\profiles\<salt>.<profile name>\offlinecache mac/linux: /users/<username>/library/caches/firefox/profiles/<salt>.<profile name>/offlinecache in firefox the current status of the offline cache can be inspected on the about:cache page (under the "offline cache device" heading).
Resource URLs - HTTP
syntax resource urls are composed of two parts: a prefix (resource:), and a url pointing to the resource you want to load: resource://<url> an example: resource://gre/res/svg.css when arrows are found in the resource url's ('->'), it means that the first file loaded the next one: resource://<file-loader> -> <file-loaded> please refer to identifying resources on the web for more general details.
Browser detection using the user agent - HTTP
next, always make your code dynamic.
Configuring servers for Ogg media - HTTP
see next point.
Content-Location - HTTP
then the client could remember that the json version is available at that particular url, skipping content negotation the next time it requests that document.
Keep-Alive - HTTP
unless 0, this value is ignored for non-pipelined connections as another request will be sent in the next response.
Set-Cookie - HTTP
warning: many web browsers have a session restore feature that will save all tabs and restore them next time the browser is used.
Strict-Transport-Security - HTTP
when the expiration time specified by the strict-transport-security header elapses, the next attempt to load the site via http will proceed as normal instead of automatically using https.
HTTP Index - HTTP
WebHTTPIndex
the browser may store it and send it back with the next request to the same server.
HTTP Messages - HTTP
WebHTTPMessages
headers are often very similar from one message to the next one, yet still repeated across connections.
404 Not Found - HTTP
WebHTTPStatus404
status 404 not found custom error pages many web sites customize the look of a 404 page to be more helpful to the user and provide guidance on what to do next.
A re-introduction to JavaScript (JS tutorial) - JavaScript
'yes' : 'no'; the switch statement can be used for multiple branches based on a number or string: switch (action) { case 'draw': drawit(); break; case 'eat': eatit(); break; default: donothing(); } if you don't add a break statement, execution will "fall through" to the next level.
JavaScript data types and data structures - JavaScript
the first element is at index 0, the next at index 1, and so on.
JavaScript modules - JavaScript
export { square }; next up comes the aggregation part.
Assertions - JavaScript
this is a position where the previous and next character are of the same type: either both must be words, or both must be non-words, for example between two letters or between two spaces.
Using Promises - JavaScript
« previousnext » a promise is an object representing the eventual completion or failure of an asynchronous operation.
Working with objects - JavaScript
« previousnext » javascript is designed on a simple object-based paradigm.
JavaScript Guide - JavaScript
chies inheritance promises guarantees chaining error propagation composition timing iterators and generators iterators iterables generators meta programming proxy handlers and traps revocable proxy reflect javascript modules exporting importing default exports renaming features aggregating modules dynamic module loading next » ...
Deprecated and obsolete features - JavaScript
lastindex the index at which to start the next match.
SyntaxError: unterminated string literal - JavaScript
the + operator variant looks like this: var longstring = 'this is a very long string which needs ' + 'to wrap across multiple lines because ' + 'otherwise my code is unreadable.'; or you can use the backslash character ("\") at the end of each line to indicate that the string will continue on the next line.
Method definitions - JavaScript
// using a named property const obj2 = { g: function* () { let index = 0 while (true) { yield index++ } } }; // the same object using shorthand syntax const obj2 = { * g() { let index = 0 while (true) { yield index++ } } }; const it = obj2.g() console.log(it.next().value) // 0 console.log(it.next().value) // 1 async methods async methods can also be defined using the shorthand syntax.
Rest parameters - JavaScript
// using the same function definition from example above myfun("one", "two") // a, one // b, two // manymoreargs, [] argument length since theargs is an array, a count of its elements is given by the length property: function fun1(...theargs) { console.log(theargs.length) } fun1() // 0 fun1(5) // 1 fun1(5, 6, 7) // 3 ordinary parameter and rest parameters in the next example, a rest parameter is used to collect all parameters after the first into an array.
Array.prototype[@@iterator]() - JavaScript
.iterator](); var letterresult = document.getelementbyid('letterresult'); // your browser must support for..of loop // and let-scoped variables in for loops // const and var could also be used for (let letter of earr) { letterresult.innerhtml += "<li>" + letter + "</li>"; } result alternative iteration var arr = ['a', 'b', 'c', 'd', 'e']; var earr = arr[symbol.iterator](); console.log(earr.next().value); // a console.log(earr.next().value); // b console.log(earr.next().value); // c console.log(earr.next().value); // d console.log(earr.next().value); // e use case for brace notation the use case for this syntax over using the dot notation (array.prototype.values()) is in a case where you don't know what object is going to be ahead of time.
Array.prototype.reduceRight() - JavaScript
} examples sum up all values within an array var sum = [0, 1, 2, 3].reduceright(function(a, b) { return a + b; }); // sum is 6 flatten an array of arrays var flattened = [[0, 1], [2, 3], [4, 5]].reduceright(function(a, b) { return a.concat(b); }, []); // flattened is [4, 5, 2, 3, 0, 1] run a list of asynchronous functions with callbacks in series each passing their results to the next const waterfall = (...functions) => (callback, ...args) => functions.reduceright( (composition, fn) => (...results) => fn(composition, ...results), callback )(...args); const randint = max => math.floor(math.random() * max) const add5 = (callback, x) => { settimeout(callback, randint(1000), x + 5); }; const mult3 = (callback, x) => { settimeout(callback, randint(1000), x * 3); ...
Array.prototype.flat() - JavaScript
, 3, 4, 5, 6] use a stack // non recursive flatten deep using a stack // note that depth control is hard/inefficient as we will need to tag each value with its own depth // also possible w/o reversing on shift/unshift, but array ops on the end tends to be faster function flatten(input) { const stack = [...input]; const res = []; while(stack.length) { // pop value from stack const next = stack.pop(); if(array.isarray(next)) { // push back array items, won't modify the original input stack.push(...next); } else { res.push(next); } } // reverse to restore input order return res.reverse(); } const arr = [1, 2, [3, 4, [5, 6]]]; flatten(arr); // [1, 2, 3, 4, 5, 6] use generator function function* flatten(array, depth) { if(depth === undefi...
Array.from() - JavaScript
iterator.next() : items[k]; }; }; var getarray = function getarray( t, a, len, getitem, isiterator, mapfn ) { // 16.
Array.prototype.shift() - JavaScript
in the following example every iteration will remove the next element from an array, until it is empty: var names = ["andrew", "edward", "paul", "chris" ,"john"]; while( (i = names.shift()) !== undefined ) { console.log(i); } // andrew, edward, paul, chris, john specifications specification ecmascript (ecma-262)the definition of 'array.prototype.shift' in that specification.
Atomics - JavaScript
atomic operations make sure that predictable values are written and read, that operations are finished before the next operation starts and that operations are not interrupted.
Function.prototype.bind() - JavaScript
this.x; } }; module.getx(); // returns 81 const retrievex = module.getx; retrievex(); // returns 9; the function gets invoked at the global scope // create a new function with 'this' bound to module // new programmers might confuse the // global variable 'x' with module's property 'x' const boundgetx = retrievex.bind(module); boundgetx(); // returns 81 partially applied functions the next simplest use of bind() is to make a function with pre-specified initial arguments.
GeneratorFunction - JavaScript
examples creating a generator function from a generatorfunction() constructor var generatorfunction = object.getprototypeof(function*(){}).constructor var g = new generatorfunction('a', 'yield a * 2'); var iterator = g(10); console.log(iterator.next().value); // 20 specifications specification ecmascript (ecma-262)the definition of 'generatorfunction' in that specification.
Intl.Locale.prototype.calendar - JavaScript
next, add the -ca extension to indicate that you are adding a calendar type.
Intl.Locale.prototype.caseFirst - JavaScript
next, add the -kf extension key to indicate that you are adding a value for casefirst.
Intl.Locale.prototype.collation - JavaScript
next, add the -co extension to indicate that you are adding a collation type.
Intl.Locale.prototype.hourCycle - JavaScript
next, add the -hc extension key to indicate that you are adding an hour cycle.
Intl.Locale.prototype.numberingSystem - JavaScript
next, add the -nu extension key to indicate that you are adding a value for numberingsystem.
Intl.Locale.prototype.numeric - JavaScript
next, add the -kn extension key to indicate that you are adding a value for numeric.
Map.prototype[@@iterator]() - JavaScript
examples using [@@iterator]() const mymap = new map() mymap.set('0', 'foo') mymap.set(1, 'bar') mymap.set({}, 'baz') const mapiter = mymap[symbol.iterator]() console.log(mapiter.next().value) // ["0", "foo"] console.log(mapiter.next().value) // [1, "bar"] console.log(mapiter.next().value) // [object, "baz"] using [@@iterator]() with for..of const mymap = new map() mymap.set('0', 'foo') mymap.set(1, 'bar') mymap.set({}, 'baz') for (const entry of mymap) { console.log(entry) } // ["0", "foo"] // [1, "bar"] // [{}, "baz"] for (const [key, value] of mymap) { console.log(...
Map.prototype.entries() - JavaScript
examples using entries() let mymap = new map() mymap.set('0', 'foo') mymap.set(1, 'bar') mymap.set({}, 'baz') let mapiter = mymap.entries() console.log(mapiter.next().value) // ["0", "foo"] console.log(mapiter.next().value) // [1, "bar"] console.log(mapiter.next().value) // [object, "baz"] specifications specification ecmascript (ecma-262)the definition of 'map.prototype.entries' in that specification.
Map.prototype.keys() - JavaScript
examples using keys() var mymap = new map(); mymap.set('0', 'foo'); mymap.set(1, 'bar'); mymap.set({}, 'baz'); var mapiter = mymap.keys(); console.log(mapiter.next().value); // "0" console.log(mapiter.next().value); // 1 console.log(mapiter.next().value); // object specifications specification ecmascript (ecma-262)the definition of 'map.prototype.keys' in that specification.
Map.prototype.values() - JavaScript
examples using values() var mymap = new map(); mymap.set('0', 'foo'); mymap.set(1, 'bar'); mymap.set({}, 'baz'); var mapiter = mymap.values(); console.log(mapiter.next().value); // "foo" console.log(mapiter.next().value); // "bar" console.log(mapiter.next().value); // "baz" specifications specification ecmascript (ecma-262)the definition of 'map.prototype.values' in that specification.
Math.ceil() - JavaScript
the math.ceil() function always rounds a number up to the next largest integer.
Math.random() - JavaScript
the value is no lower than min (or the next integer greater than min if min isn't an integer), and is less than (but not equal to) max.
Math.random() - JavaScript
the value is no lower than min (or the next integer greater than min if min isn't an integer), and is less than (but not equal to) max.
Object.assign() - JavaScript
onfigurable: true object.defineproperty(object, "assign", { value: function assign(target, varargs) { // .length of function is 2 'use strict'; if (target === null || target === undefined) { throw new typeerror('cannot convert undefined or null to object'); } var to = object(target); for (var index = 1; index < arguments.length; index++) { var nextsource = arguments[index]; if (nextsource !== null && nextsource !== undefined) { for (var nextkey in nextsource) { // avoid bugs when hasownproperty is shadowed if (object.prototype.hasownproperty.call(nextsource, nextkey)) { to[nextkey] = nextsource[nextkey]; } } } } return to; }, writable:...
Promise.prototype.catch() - JavaScript
ion(e) { console.error(e); // this is never called }); // errors thrown after resolve is called will be silenced var p3 = new promise(function(resolve, reject) { resolve(); throw new error('silenced exception!'); }); p3.catch(function(e) { console.error(e); // this is never called }); if it is resolved //create a promise which would not call onreject var p1 = promise.resolve("calling next"); var p2 = p1.catch(function (reason) { //this is never called console.error("catch p1!"); console.error(reason); }); p2.then(function (value) { console.log("next promise's onfulfilled"); /* next promise's onfulfilled */ console.log(value); /* calling next */ }, function (reason) { console.log("next promise's onrejected"); console.log(reason); }); specifications ...
Set.prototype[@@iterator]() - JavaScript
examples using [@@iterator]() const myset = new set(); myset.add('0'); myset.add(1); myset.add({}); const setiter = myset[symbol.iterator](); console.log(setiter.next().value); // "0" console.log(setiter.next().value); // 1 console.log(setiter.next().value); // object using [@@iterator]() with for..of const myset = new set(); myset.add('0'); myset.add(1); myset.add({}); for (const v of myset) { console.log(v); } specifications specification ecmascript (ecma-262)the definition of 'set.prototype[@@iterator]' in that specification.
Set.prototype.entries() - JavaScript
examples using entries() var myset = new set(); myset.add('foobar'); myset.add(1); myset.add('baz'); var setiter = myset.entries(); console.log(setiter.next().value); // ["foobar", "foobar"] console.log(setiter.next().value); // [1, 1] console.log(setiter.next().value); // ["baz", "baz"] specifications specification ecmascript (ecma-262)the definition of 'set.prototype.entries' in that specification.
Set.prototype.values() - JavaScript
examples using values() var myset = new set(); myset.add('foo'); myset.add('bar'); myset.add('baz'); var setiter = myset.values(); console.log(setiter.next().value); // "foo" console.log(setiter.next().value); // "bar" console.log(setiter.next().value); // "baz" specifications specification ecmascript (ecma-262)the definition of 'set.prototype.values' in that specification.
String.prototype[@@iterator]() - JavaScript
examples using [@@iterator]() var str = 'a\ud835\udc68'; var striter = str[symbol.iterator](); console.log(striter.next().value); // "a" console.log(striter.next().value); // "\ud835\udc68" using [@@iterator]() with for..of var str = 'a\ud835\udc68b\ud835\udc69c\ud835\udc6a'; for (var v of str) { console.log(v); } // "a" // "\ud835\udc68" // "b" // "\ud835\udc69" // "c" // "\ud835\udc6a" specifications specification ecmascript (ecma-262)the definition of 'string.prototype[@@iterator]()' ...
String.prototype.codePointAt() - JavaScript
index = 0; } // account for out-of-bounds indices: if (index < 0 || index >= size) { return undefined; } // get the first code unit var first = string.charcodeat(index); var second; if ( // check if it’s the start of a surrogate pair first >= 0xd800 && first <= 0xdbff && // high surrogate size > index + 1 // there is a next code unit ) { second = string.charcodeat(index + 1); if (second >= 0xdc00 && second <= 0xdfff) { // low surrogate // https://mathiasbynens.be/notes/javascript-encoding#surrogate-formulae return (first - 0xd800) * 0x400 + second - 0xdc00 + 0x10000; } } return first; }; if (defineproperty) { defineproperty(string.prototype,...
String - JavaScript
method 1 you can use the + operator to append multiple strings together, like this: let longstring = "this is a very long string which needs " + "to wrap across multiple lines because " + "otherwise my code is unreadable." method 2 you can use the backslash character (\) at the end of each line to indicate that the string will continue on the next line.
TypedArray.prototype[@@iterator]() - JavaScript
examples iteration using for...of loop var arr = new uint8array([10, 20, 30, 40, 50]); // your browser must support for..of loop // and let-scoped variables in for loops for (let n of arr) { console.log(n); } alternative iteration var arr = new uint8array([10, 20, 30, 40, 50]); var earr = arr[symbol.iterator](); console.log(earr.next().value); // 10 console.log(earr.next().value); // 20 console.log(earr.next().value); // 30 console.log(earr.next().value); // 40 console.log(earr.next().value); // 50 specifications specification ecmascript (ecma-262)the definition of '%typedarray%.prototype[@@iterator]()' in that specification.
TypedArray.prototype.entries() - JavaScript
examples iteration using for...of loop var arr = new uint8array([10, 20, 30, 40, 50]); var earray = arr.entries(); // your browser must support for..of loop // and let-scoped variables in for loops for (let n of earray) { console.log(n); } alternative iteration var arr = new uint8array([10, 20, 30, 40, 50]); var earr = arr.entries(); console.log(earr.next().value); // [0, 10] console.log(earr.next().value); // [1, 20] console.log(earr.next().value); // [2, 30] console.log(earr.next().value); // [3, 40] console.log(earr.next().value); // [4, 50] specifications specification ecmascript (ecma-262)the definition of '%typedarray%.prototype.entries()' in that specification.
TypedArray.prototype.keys() - JavaScript
examples iteration using for...of loop var arr = new uint8array([10, 20, 30, 40, 50]); var earray = arr.keys(); // your browser must support for..of loop // and let-scoped variables in for loops for (let n of earray) { console.log(n); } alternative iteration var arr = new uint8array([10, 20, 30, 40, 50]); var earr = arr.keys(); console.log(earr.next().value); // 0 console.log(earr.next().value); // 1 console.log(earr.next().value); // 2 console.log(earr.next().value); // 3 console.log(earr.next().value); // 4 specifications specification ecmascript (ecma-262)the definition of '%typedarray%.prototype.keys()' in that specification.
TypedArray.prototype.values() - JavaScript
examples iteration using for...of loop var arr = new uint8array([10, 20, 30, 40, 50]); var earray = arr.values(); // your browser must support for..of loop // and let-scoped variables in for loops for (let n of earray) { console.log(n); } alternative iteration var arr = new uint8array([10, 20, 30, 40, 50]); var earr = arr.values(); console.log(earr.next().value); // 10 console.log(earr.next().value); // 20 console.log(earr.next().value); // 30 console.log(earr.next().value); // 40 console.log(earr.next().value); // 50 specifications specification ecmascript (ecma-262)the definition of '%typedarray%.prototype.values()' in that specification.
Lexical grammar - JavaScript
only the following unicode code points are treated as line terminators in ecmascript, other line breaking characters are treated as white space (for example, next line, nel, u+0085 is considered as white space).
empty - JavaScript
in the next example, an if...else statement without curly braces ({}) is used.
for await...of - JavaScript
examples iterating over async iterables you can also iterate over an object that explicitly implements async iterable protocol: const asynciterable = { [symbol.asynciterator]() { return { i: 0, next() { if (this.i < 3) { return promise.resolve({ value: this.i++, done: false }); } return promise.resolve({ done: true }); } }; } }; (async function() { for await (let num of asynciterable) { console.log(num); } })(); // 0 // 1 // 2 iterating over async generators since the return values of async generators conform to the async iterabl...
for...of - JavaScript
} iterating over other iterable objects you can also iterate over an object that explicitly implements the iterable protocol: const iterable = { [symbol.iterator]() { return { i: 0, next() { if (this.i < 3) { return { value: this.i++, done: false }; } return { value: undefined, done: true }; } }; } }; for (const value of iterable) { console.log(value); } // 0 // 1 // 2 difference between for...of and for...in both for...in and for...of statements iterate over something.
for - JavaScript
this occurs before the next evaluation of condition.
Statements and declarations - JavaScript
continue terminates execution of the statements in the current iteration of the current or labeled loop, and continues execution of the loop with the next iteration.
Web audio codec guide - Web media technologies
vorbis inherently uses variable bit rate encoding; the bit rate can vary from one sample to the next as needed during the compression process.
Media container formats (file types) - Web media technologies
if the user agent can't play that, it moves on to the next option, whose type is specified as video/mp4.
Web video codec guide - Web media technologies
these are due to the mathematics involved in the coding of the residual frames, and can be easily noticed before being repaired by the next key frame.
Populating the page: how browsers work - Web Performance
in tcp slow start, after receipt of the initial packet, the server doubles the size of the next packet to around 28kb.
Navigation and resource timings - Web Performance
in the above image, we see via the name property that the file being timed is this document for the rest of this explanation, we use the following variable: let timing = performance.getentriesbytype('navigation')[0]; protocol we can check the protocol used by querying: let protocol = timing.nexthopprotocol it returns the network protocol used to fetch the resource: in this case h2 for http/2.
Mobile first - Progressive web apps (PWAs)
this puts the content first at the top of the page and means that when the user has reached the end of a page, they have a signpost giving them an idea of where to go next.
data-* - SVG: Scalable Vector Graphics
WebSVGAttributedata-*
hyphen characters (-, u+002d) are removed and the next letter is capitalized, resulting in the camelcase format.
in - SVG: Scalable Vector Graphics
WebSVGAttributein
if no value is provided, the output will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute.
keyTimes - SVG: Scalable Vector Graphics
the time associated with each value defines when the value is set; the animation function uses that value until the next time defined in the list.
result - SVG: Scalable Vector Graphics
WebSVGAttributeresult
if no value is provided, the output will only be available for re-use as the implicit input into the next filter primitive if that filter primitive provides no value for its in attribute.
SVG 2 support in Mozilla - SVG: Scalable Vector Graphics
svg 2 is the next major version of the svg standard, which is a complete rework of the svg 1.2 draft.
Same-origin policy - Web security
when two documents do not have the same origin, these references provide very limited access to window and location objects, as described in the next two sections.
Securing your site - Web security
user information security how to turn off form autocompletion form fields support autocompletion in gecko; that is, their values can be remembered and automatically brought back the next time the user visits your site.
Using custom elements - Web Components
next, we register the element using the define() method as before, except that this time it also includes an options object that details what element our custom element inherits from: customelements.define('expanding-list', expandinglist, { extends: "ul" }); using the built-in element in a web document also looks somewhat different: <ul is="expanding-list"> ...
Using shadow DOM - Web Components
creating the shadow root we first attach a shadow root to the custom element: // create a shadow root let shadow = this.attachshadow({mode: 'open'}); creating the shadow dom structure next, we use some dom manipulation to create the element's internal shadow dom structure: // create spans let wrapper = document.createelement('span'); wrapper.setattribute('class', 'wrapper'); let icon = document.createelement('span'); icon.setattribute('class', 'icon'); icon.setattribute('tabindex', 0); let info = document.createelement('span'); info.setattribute('class', 'info'); // take attribut...
Using templates and slots - Web Components
creating a new <element-details> element from the <template> next, let’s create a new custom element named <element-details> and use element.attachshadow to attach to it, as its shadow root, that document fragment we created with our <template> element above.
current - XPath
<xsl:value-of select="current()"/> <xsl:value-of select="foo/bar[current() = x]"/> <xsl:variable name="current" select="current()"/> <xsl:value-of select="foo/bar[$current = x]"/> and the next code is also semantically equivalent to the latter two, since the .
XPath snippets - XPath
anode.documentelement : anode.ownerdocument.documentelement); var result = xpe.evaluate(aexpr, anode, nsresolver, 0, null); var found = []; var res; while (res = result.iteratenext()) found.push(res); return found; } this function uses the new xpathevaluator() constructor, which is supported in firefox, chrome, opera and safari, but not in edge or internet explorer.
Exported WebAssembly functions - WebAssembly
next, we use set() to make the othertable table contain references to the same functions as the tbl table.
Loading and running WebAssembly code - WebAssembly
next, send the request using xmlhttprequest.send().
Converting WebAssembly text format to wasm - WebAssembly
next, execute the wat2wasm program, passing it the path to the input file, followed by an -o parameter, followed by the path to the output file: wat2wasm simple.wat -o simple.wasm this will convert the wasm into a file called simple.wasm, which contains the .wasm assembly code.