Search completed in 1.51 seconds.
1362 results for "path":
Your results are loading. Please wait...
Introduction to using XPath in JavaScript - XPath
this document describes the interface for using xpath in javascript internally, in extensions, and from websites.
... mozilla implements a fair amount of the dom 3 xpath, which means that xpath expressions can be run against both html and xml documents.
... the main interface to using xpath is the evaluate function of the document object.
...And 49 more matches
XPath snippets - XPath
this article provides some xpath code snippets—simple examples of how to a few simple utility functions based on standard interfaces from the dom level 3 xpath specification that expose xpath functionality to javascript code.
... node-specific evaluator function the following custom utility function can be used to evaluate xpath expressions on given xml nodes.
... the first argument is a dom node or document object, while the second is a string defining an xpath expression.
...And 15 more matches
Path2D.addPath() - Web APIs
WebAPIPath2DaddPath
the path2d.addpath() method of the canvas 2d api adds one path2d object to another path2d object.
... syntax void path.addpath(path [, transform]); parameters path a path2d path to add.
... transform optional a dommatrix to be used as the transformation matrix for the path that is added.
...And 5 more matches
SVGPathElement.pathLength - Web APIs
the svgpathelement.pathlength property reflects the pathlength attribute and returns the total length of the path, in user units.
... note: in svg 2 this property was moved to the svggeometryelement interface, from which the svgpathelement inherits it.
... syntax var pathlength = someelement.pathlength; specifications specification status comment scalable vector graphics (svg) 1.1 (second edition)the definition of 'svgpathelement.pathlength' in that specification.
Comparison of CSS Selectors and XPath - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes this article seeks to document the difference between css selectors and xpath for web developers to be able to better choose the right tool for the right job.
... xpath feature css equivalent ancestor, parent or preceding-sibling axis :has() selector attribute axis attribute selectors child axis child combinator descendant axis descendant combinator following-sibling axis general sibling combinator or adjacent sibling combinator self axis :scope or :host selector ...
Paths - SVG: Scalable Vector Graphics
WebSVGTutorialPaths
« previousnext » the <path> element is the most powerful element in the svg library of basic shapes.
... paths create complex shapes by combining multiple straight lines or curved lines.
...while <polyline>s and <path>s can create similar-looking shapes, <polyline>s require a lot of small straight lines to simulate curves, and don't scale well to larger sizes.
...And 30 more matches
SVGPathElement - Web APIs
the svgpathelement interface corresponds to the <path> element.
..." fill="#fff" stroke="#d4dde4" stroke-width="2px" /><text x="171" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggeometryelement</text></a><polyline points="81,89 71,84 71,94 81,89" stroke="#d4dde4" fill="none"/><line x1="71" y1="89" x2="41" y2="89" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgpathelement" target="_top"><rect x="-99" y="65" width="140" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="-29" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgpathelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} note: in svg 2 the getp...
...athsegatlength() and createsvgpathseg* methods were removed and the pathlength property and the gettotallength() and getpointatlength() methods were moved to svggeometryelement.
...And 26 more matches
SVGPathSeg - Web APIs
svg path segment interface this is a base interface that corresponds to a single command within a path data specification.
... interface overview also implement none methods none properties unsigned short pathsegtype domstring pathsegtypeasletter constants pathseg_unknown = 0 pathseg_closepath = 1 pathseg_moveto_abs = 2 pathseg_moveto_rel = 3 pathseg_lineto_abs = 4 pathseg_lineto_rel = 5 pathseg_curveto_cubic_abs = 6 pathseg_curveto_cubic_rel = 7 pathseg_curveto_quadratic_abs = 8 pathseg_curveto_quadratic_rel = 9 pathseg_arc_abs = 10 ...
... pathseg_arc_rel = 11 pathseg_lineto_horizontal_abs = 12 pathseg_lineto_horizontal_rel = 13 pathseg_lineto_vertical_abs = 14 pathseg_lineto_vertical_rel = 15 pathseg_curveto_cubic_smooth_abs = 16 pathseg_curveto_cubic_smooth_rel = 17 pathseg_curveto_quadratic_smooth_abs = 18 pathseg_curveto_quadratic_smooth_rel = 19 normative document svg 1.1 (2nd edition) constants name value description pathseg_unknown 0 the unit type is not one of predefined types.
...And 23 more matches
clip-path - CSS: Cascading Style Sheets
WebCSSclip-path
the clip-path css property creates a clipping region that sets what part of an element should be shown.
... syntax /* keyword values */ clip-path: none; /* <clip-source> values */ clip-path: url(resources.svg#c1); /* <geometry-box> values */ clip-path: margin-box; clip-path: border-box; clip-path: padding-box; clip-path: content-box; clip-path: fill-box; clip-path: stroke-box; clip-path: view-box; /* <basic-shape> values */ clip-path: inset(100px 50px); clip-path: circle(50px at 0 100px); clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); clip-path: path('m0.5,1 c0.5,1,0,0.7,0,0.3 a0.25,0.25...
...,1,1,1,0.5,0.3 a0.25,0.25,1,1,1,1,0.3 c1,0.7,0.5,1,0.5,1 z'); /* box and shape values combined */ clip-path: padding-box circle(50px at 0 100px); /* global values */ clip-path: inherit; clip-path: initial; clip-path: unset; the clip-path property is specified as one or a combination of the values listed below.
...And 23 more matches
Index - XPath
WebXPathIndex
found 57 pages: # page tags and summary 1 xpath css selectors, dom, jxon, landing, path, xml, xpath, xslt xpath stands for xml path language.
... 2 axes transforming_xml_with_xslt, xpath, xpath_reference, xslt, xslt_reference for further information on using xpath expressions, please see the for further reading section at the end of transforming xml with xslt document.
... also see the 'axes' section in the xpath spec.
...And 19 more matches
offset-path - CSS: Cascading Style Sheets
the offset-path css property specifies a motion path for an element to follow and defines the element's positioning within the parent container or svg coordinate system.
... syntax /* default */ offset-path: none; /* function values */ offset-path: ray(45deg closest-side contain); /* url */ offset-path: url(#path); /* shapes */ offset-path: circle(50% at 25% 25%); offset-path: inset(50% 50% 50% 50%); offset-path: polygon(30% 0%, 70% 0%, 100% 50%, 30% 100%, 0% 70%, 0% 30%); offset-path: path('m 0,200 q 200,200 260,80 q 290,20 400,0 q 300,100 400,200'); /* geometry boxes */ offset-path: margin-box; offset-path: stroke-box; /* global values */ offset-path: inherit; offset-path: initial; offset-path: unset; values ray() taking up to three values, defines a path that is a line segment starting from the position of the box and proceeds in the direction defined by the specified angle similar to the css gradient angle where 0deg is up, with positive angles...
... url() references the id of an svg shape -- circle, ellipse, line, path, polygon, polyline, or rect -- using the shape's geometry as the path.
...And 18 more matches
nsIDOMXPathEvaluator
dom/interfaces/xpath/nsidomxpathevaluator.idlscriptable this interface is used to evaluate xpath expressions against a dom node.
... inherits from: nsisupports last changed in gecko 1.7 implemented by: @mozilla.org/dom/xpath-evaluator;1.
... to create an instance, use: var domxpathevaluator = components.classes["@mozilla.org/dom/xpath-evaluator;1"] .createinstance(components.interfaces.nsidomxpathevaluator); method overview nsidomxpathexpression createexpression(in domstring expression, in nsidomxpathnsresolver resolver) nsidomxpathnsresolver creatensresolver(in nsidomnode noderesolver); nsisupports evaluate(in domstring expression, in nsidomnode contextnode, in nsidomxpathnsresolver resolver, in unsigned short type, in nsisupports result) methods createexpression() creates an nsidomxpathexpression which can then be used for (repeated) evaluations.
...And 14 more matches
Path2D - Web APIs
WebAPIPath2D
the path2d interface of the canvas 2d api is used to declare a path that can then be used on a canvasrenderingcontext2d object.
... the path methods of the canvasrenderingcontext2d interface are also present on this interface, which gives you the convenience of being able to retain and replay your path whenever desired.
... constructors path2d() path2d constructor.
...And 13 more matches
XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes xpath stands for xml path language.
... xpath is mainly used in xslt, but can also be used as a much more powerful way of navigating through the dom of any xml-like language document using xpathexpression, such as html and svg, instead of relying on the document.getelementbyid() or parentnode.queryselectorall() methods, the node.childnodes properties, and other dom core features.
... xpath uses a path notation (as in urls) for navigating through the hierarchical structure of an xml document.
...And 13 more matches
SVGTextPathElement - Web APIs
the svgtextpathelement interface corresponds to the <textpath> element.
..."#fff" stroke="#d4dde4" stroke-width="2px" /><text x="156" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgtextcontentelement</text></a><polyline points="51,89 41,84 41,94 51,89" stroke="#d4dde4" fill="none"/><line x1="41" y1="89" x2="11" y2="89" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgtextpathelement" target="_top"><rect x="-169" y="65" width="180" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="-79" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgtextpathelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constants method t...
...ypes name value description textpath_methodtype_unknown 0 the type is not one of predefined types.
...And 12 more matches
pathLength - SVG: Scalable Vector Graphics
the pathlength attribute lets authors specify a total length for the path, in user units.
... this value is then used to calibrate the browser's distance calculations with those of the author, by scaling all distance computations using the ratio pathlength/(computed value of path length).
... this can affect the actual rendered lengths of paths; including text paths, animation paths, and various stroke operations.
...And 12 more matches
XPathResult - Web APIs
the xpathresult interface represents the results generated by evaluating an xpath expression within the context of a given node.
... since xpath expressions can result in a variety of result types, this interface makes it possible to determine and handle the type and value of the result.
... properties xpathresult.booleanvalueread only a boolean representing the value of the result if resulttype is boolean_type.
...And 11 more matches
path - SVG: Scalable Vector Graphics
WebSVGAttributepath
the path attribute has two different meanings, either it defines a text path along which the characters of a text are rendered, or a motion path along which a referenced element is animated.
... two elements are using this attribute: <animatemotion> and <textpath> html, body, svg { height: 100%; } <svg viewbox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"> <path id="mypath" fill="none" stroke="silver" d="m10,90 q90,90 90,45 q90,10 50,10 q10,10 10,40 q10,70 45,70 q70,70 75,50" /> <text> <textpath path="m10,90 q90,90 90,45 q90,10 50,10 q10,10 10,40 q10,70 45,70 q70,70 75,50"> quick brown fox jumps over the lazy dog.
... </textpath> </text> </svg> animatemotion for <animatemotion>, path defines the motion path, expressed in the same format and interpreted the same way as the d geometric property for the <path> element.
...And 10 more matches
<clipPath> - SVG: Scalable Vector Graphics
WebSVGElementclipPath
the <clippath> svg element defines a clipping path, to be used by the clip-path property.
... a clipping path restricts the region to which paint can be applied.
... conceptually, parts of the drawing that lie outside of the region bounded by the clipping path are not drawn.
...And 9 more matches
Edit Shape Paths in CSS - Firefox Developer Tools
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.
... activate / deactivate the shape path editor the shape path editor is accessed via the css rules panel, which can be opened as described in the guide to opening the inspector.
... to deactivate the shape path editor click on the icon again, or select another element or a different editor.
...And 8 more matches
XPathEvaluator.evaluate() - Web APIs
the evaluate() method of the xpathevaluator interface executes an xpath expression on the given node or document and returns an xpathresult.
... syntax xpathresult xpathevaluator.evaluate(expression, contextnode, resolver, type, result); parameters expression a domstring representing the xpath expression to be parsed and evaluated.
... resolver optional permits translation of all prefixes, including the xml namespace prefix, within the xpath expression into appropriate namespace uris.
...And 8 more matches
<textPath> - SVG: Scalable Vector Graphics
WebSVGElementtextPath
to render text along the shape of a <path>, enclose the text in a <textpath> element that has an href attribute with a reference to the <path> element.
... html,body,svg { height:100% } <svg viewbox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"> <!-- to hide the path, it is usually wrapped in a <defs> element --> <!-- <defs> --> <path id="mypath" fill="none" stroke="red" d="m10,90 q90,90 90,45 q90,10 50,10 q10,10 10,40 q10,70 45,70 q70,70 75,50" /> <!-- </defs> --> <text> <textpath href="#mypath"> quick brown fox jumps over the lazy dog.
... </textpath> </text> </svg> attributes href the url to the path or basic shape on which to render the text.
...And 8 more matches
CanvasRenderingContext2D.isPointInPath() - Web APIs
the canvasrenderingcontext2d.ispointinpath() method of the canvas 2d api reports whether or not the specified point is contained in the current path.
... syntax ctx.ispointinpath(x, y [, fillrule]); ctx.ispointinpath(path, x, y [, fillrule]); parameters x the x-axis coordinate of the point to check, unaffected by the current transformation of the context.
... fillrule the algorithm by which to determine if a point is inside or outside the path.
...And 7 more matches
XPathExpression.evaluate() - Web APIs
the evaluate() method of the xpathexpression interface executes an xpath expression on the given node or document and returns an xpathresult.
... syntax xpathresult node.evaluate(contextnode, type, result); parameters contextnode a node representing the context to use for evaluating the expression.
...this must be one of the xpathresult.constants.
...And 7 more matches
clip-path - SVG: Scalable Vector Graphics
the clip-path presentation attribute defines or associates a clipping path with the element it is related to.
... note: as a presentation attribute clip-path can be used as a css property.
... as a presentation attribute, it can be applied to any element but it has noticeable effects mostly on the following nineteen elements: <a>, <circle>, <clippath>, <ellipse>, <g>, <glyph>, <image>, <line>, <marker>, <mask>, <path>, <pattern>, <polygon>, <polyline>, <rect>, <svg>, <symbol>, <text>, <use> html,body,svg { height:100% } <svg viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> <clippath id="myclip" clippathunits="objectboundingbox"> <circle cx=".5" cy=".5" r=".5" /> </clippath> <!-- top-left: apply a custom defined clipping path --> <rect x="1" y="1" width="8" height="8" stroke="green" clip-path="url(#myclip)" /> <!-- top-right: apply a css basic shape on a fill-box geometry.
...And 7 more matches
SVGAnimatedPathData - Web APIs
svg animated path data interface the svganimatedpathdata interface supports elements which have a 'd' attribute which holds svg path data, and supports the ability to animate that attribute.
... interface overview also implement none methods none properties svgpathseglist animatednormalizedpathseglist svgpathseglist animatedpathseglist svgpathseglist normalizedpathseglist svgpathseglist pathseglist normative document svg 1.1 (2nd edition) properties this interface also inherits properties from its parent, svgpathelement.
... name type description animatednormalizedpathseglist svgpathseglist provides access to the current animated contents of the 'd' attribute in a form where all path data commands are expressed in terms of the following subset of svgpathseg types: svg_pathseg_moveto_abs (m), svg_pathseg_lineto_abs (l), svg_pathseg_curveto_cubic_abs (c) and svg_pathseg_closepath (z).
...And 6 more matches
SVGPathSegList - Web APIs
svg path segment list interface this interface defines a list of svgpathseg objects.
... interface overview also implement none methods void clear() svgpathseg initialize(in svgpathseg newitem) svgpathseg getitem(in unsigned long index) svgpathseg insertitembefore(in svgpathseg newitem, in unsigned long index) svgpathseg replaceitem(in svgpathseg newitem, in unsigned long index) svgpathseg removeitem(in unsigned long index) svgpathseg appenditem(in svgpathseg newitem) properties readonly unsigned long numberofitems normative document svg 1.1 ...
... initialize(in svgpathseg newitem) svgpathseg clears all existing current items from the list and re-initializes the list to hold the single item specified by newitem.
...And 6 more matches
<path> - SVG: Scalable Vector Graphics
WebSVGElementpath
the <path> svg element is the generic element to define a shape.
... all the basic shapes can be created with a path element.
... html,body,svg { height:100% } <svg viewbox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"> <path d="m 10,30 a 20,20 0,0,1 50,30 a 20,20 0,0,1 90,30 q 90,60 50,90 q 10,60 10,30 z"/> </svg> attributes d this attribute defines the shape of the path.
...And 5 more matches
nsIDOMXPathExpression
dom/interfaces/xpath/nsidomxpathexpression.idlscriptable represents a compiled xpath query returned from nsidomxpathevaluator.createexpression or document.createexpression inherits from: nsisupports last changed in gecko 1.7 method overview nsisupports evaluate(in nsidomnode contextnode, in unsigned short type, in nsisupports result) methods evaluate() evaluate the xpath expression.
... nsisupports evaluate( in nsidomnode contextnode, in unsigned short type, in nsisupports result ); parameters contextnode a dom node to evaluate the xpath expression against.
... type a number that corresponds to one of the type constants of nsidomxpathresult.
...And 4 more matches
CanvasRenderingContext2D.closePath() - Web APIs
the canvasrenderingcontext2d.closepath() method of the canvas 2d api attempts to add a straight line from the current point to the start of the current sub-path.
...you can render the path using the stroke() or fill() methods.
... syntax void ctx.closepath(); examples closing a triangle this example creates the first two (diagonal) sides of a triangle using the lineto() method.
...And 4 more matches
Event.composedPath() - Web APIs
the composedpath() method of the event interface returns the event’s path which is an array of the objects on which listeners will be invoked.
... syntax var composed = event.composedpath(); parameters none.
... examples in our composed-composed-path example (see it live), we define two trivial custom elements, <open-shadow> and <closed-shadow>, both of which take the contents of their text attribute and insert them into the element's shadow dom as the text content of a <p> element.
...And 4 more matches
FileSystemEntry.fullPath - Web APIs
the read-only fullpath property of the filesystementry interface returns a usvstring specifying the full, absolute path from the file system's root to the file represented by the entry.
... this can also be thought of as a path which is relative to the root directory, with a "/" prepended to it to make it absolute.
... syntax var fullpath = filesystementry.fullpath; value a usvstring indicating the entry's full path.
...And 4 more matches
IDBIndex.keyPath - Web APIs
WebAPIIDBIndexkeyPath
the keypath property of the idbindex interface returns the key path of the current index.
... syntax var mykeypath = myindex.keypath; value any data type that can be used as a key path.
... the key path of the current index is logged to the console: it should be returned as lname.
...And 4 more matches
Path2D() - Web APIs
WebAPIPath2DPath2D
the path2d() constructor returns a newly instantiated path2d object, optionally with another path as an argument (creates a copy), or optionally with a string consisting of svg path data.
... syntax new path2d(); new path2d(path); new path2d(d); parameters path optional when invoked with another path2d object, a copy of the path argument is created.
... d optional when invoked with a string consisting of svg path data, a new path is created from that description.
...And 4 more matches
XPathEvaluator.createExpression() - Web APIs
this method compiles an xpathexpression which can then be used for (repeated) evaluations of the xpath expression.
... syntax xpathexpression xpathevaluator.createexpression(expression, resolver); parameters expression a domstring representing representing the xpath expression to be created.
... resolver optional permits translation of all prefixes, including the xml namespace prefix, within the xpath expression into appropriate namespace uris.
...And 4 more matches
clipPathUnits - SVG: Scalable Vector Graphics
the clippathunits attribute indicates which coordinate system to use for the contents of the <clippath> element.
... only one element is using this attribute: <clippath> html,body,svg { height:100% } <svg viewbox="0 0 100 100"> <clippath id="myclip1" clippathunits="userspaceonuse"> <circle cx="50" cy="50" r="35" /> </clippath> <clippath id="myclip2" clippathunits="objectboundingbox"> <circle cx=".5" cy=".5" r=".35" /> </clippath> <!-- some reference rect to materialized to clip path --> <rect id="r1" x="0" y="0" width="45" height="45" /> <rect id="r2" x="0" y="55" width="45" height="45" /> <rect id="r3" x="55" y="55" width="45" height="45" /> <rect id="r4" x="55" y="0" width="45" height="45" /> <!-- the first 3 rect are clipped with usespaceonuse units --> <use clip-path="url(#myclip1)" xlink:href="#r1" fill="red" /> <use clip-path="url(#myclip1)" xlink:href="#r2...
..." fill="red" /> <use clip-path="url(#myclip1)" xlink:href="#r3" fill="red" /> <!-- the last rect is clipped with objectboundingbox units --> <use clip-path="url(#myclip2)" xlink:href="#r4" fill="red" /> </svg> clippath for <clippath>, clippathunits define the coordinate system in use for the content of the element.
...And 4 more matches
CanvasRenderingContext2D.beginPath() - Web APIs
the canvasrenderingcontext2d.beginpath() method of the canvas 2d api starts a new path by emptying the list of sub-paths.
... call this method when you want to create a new path.
... note: to create a new sub-path, i.e., one matching the current canvas state, you can use canvasrenderingcontext2d.moveto().
...And 3 more matches
IDBObjectStore.keyPath - Web APIs
the keypath read-only property of the idbobjectstore interface returns the key path of this object store.
... syntax var mykeypath = objectstore.keypath; value any value type.
...after the object store has been created, we log objectstore.keypath to the console.
...And 3 more matches
XPathEvaluator - Web APIs
the xpathevaluator interface allows to compile and evaluate xpath expressions.
... methods xpathevaluator.createexpression() creates a parsed xpath expression with resolved namespaces.
... xpathevaluator.creatensresolver() adapts any dom node to resolve namespaces allowing the xpath expression to be evaluated relative to the context of the node where it appeared within the document.
...And 3 more matches
Critical rendering path - Web Performance
the critical rendering path is the sequence of steps the browser goes through to convert the html, css, and javascript into pixels on the screen.
... optimizing the critical render path improves render performance.the critical rendering path includes the document object model (dom), css object model (cssom), render tree and layout.
... optimizing the critical rendering path improves the time to first render.
...And 3 more matches
<mpath> - SVG: Scalable Vector Graphics
WebSVGElementmpath
the <mpath> sub-element for the <animatemotion> element provides the ability to reference an external <path> element as the definition of a motion path.
... usage context categoriesanimation elementpermitted contentany number of the following elements, in any order:descriptive elements attributes global attributes core attributes » xlink attributes » externalresourcesrequired specific attributes xlink:href dom interface this element implements the svgmpathelement interface.
... example svg <svg width="100%" height="100%" viewbox="0 0 500 300" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" > <rect x="1" y="1" width="498" height="298" fill="none" stroke="blue" stroke-width="2" /> <!-- draw the outline of the motion path in blue, along with three small circles at the start, middle and end.
...And 3 more matches
CanvasRenderingContext2D.scrollPathIntoView() - Web APIs
the canvasrenderingcontext2d.scrollpathintoview() method of the canvas 2d api scrolls the current or given path into view.
... syntax void ctx.scrollpathintoview(); void ctx.scrollpathintoview(path); parameters path a path2d path to use.
... examples using the scrollpathintoview method this example demonstrates the scrollpathintoview() method.
...And 2 more matches
SVGClipPathElement - Web APIs
the svgclippathelement interface provides access to the properties of <clippath> elements, as well as methods to manipulate them.
...o,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgclippathelement" target="_top"><rect x="301" y="65" width="180" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="391" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgclippathelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this int...
... svgclippathelement.clippathunits read only an svganimatedenumeration corresponding to the clippathunits attribute of the given <clippath> element.
...And 2 more matches
SVGPathElement.getPointAtLength() - Web APIs
the svgpathelement.getpointatlength() method returns the point at a given distance along the path.
... note: in svg 2 this property was moved to the svggeometryelement interface, from which the svgpathelement inherits it.
... syntax svgpoint someelement.getpointatlength(float distance); parameters distance a float referring to the distance along the path.
...And 2 more matches
XPathExpression - Web APIs
this interface is a compiled xpath expression that can be evaluated on a document or specific node to return information from its dom tree.
... objects of this type are created by calling xpathevaluator.createexpression().
... methods xpathexpression.evaluate() evaluates the xpath expression on the given node or document.
...And 2 more matches
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.
... exceptions type_err in case xpathresult.resulttype is not unordered_node_iterator_type or ordered_node_iterator_type, an xpathexception of type type_err is thrown.
...And 2 more matches
XPathResult.resultType - Web APIs
the read-only resulttype property of the xpathresult interface represents the type of the result, as defined by the type constants.
...this is useful for example, in an xpath expression using the count() function.
...this is useful for example, in an xpath expression using the not() function.
...And 2 more matches
CSS Motion Path - CSS: Cascading Style Sheets
motion path is a css module that allows authors to animate any graphical object along a custom path.
... the idea is that when you want to animate an element moving along a path, you previously only had animating translation, position, etc.
...with offset-path you can define a specific path of any shape you want.
...And 2 more matches
child - XPath
WebXPathAxeschild
if an xpath expression does not specify an axis, the child axis is understood by default.
... specifications specification status comment xpath 3.1the definition of 'child' in that specification.
... recommendation xpath 3.0the definition of 'child' in that specification.
...And 2 more matches
PR_GetLibraryPath
retrieves the current default library path.
... syntax #include <prlink.h> char* pr_getlibrarypath(void); parameters the function has no parameters.
... returns a copy of the default library pathname string.
... description this function retrieves the current default library pathname, copies it, and returns the copy.
PR_SetLibraryPath
registers a default library pathname with a runtime.
... syntax #include <prlink.h> prstatus pr_setlibrarypath(const char *path); parameters the function has this parameter: path a pointer to a character array that contains the directory path that the application should use as a default.
... the syntax of the pathname is not defined, nor whether that pathname should be absolute or relative.
...this may indicate that the function cannot allocate sufficient storage to make a copy of the path string description this function registers a default library pathname with the runtime.
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.
... numbervalue double if resulttype is number_type, the numeric value of the xpath value.
... constants type constants constant value description any_type 0 used when evaluating an xpath expression; the evaluator will return the most appropriate type.
...see also introduction to using xpath in javascript document object model (dom) level 3 xpath specification nsidomxpathevaluator document.evaluate nsidomxpathexception ...
File.webkitRelativePath - Web APIs
the file.webkitrelativepath is a read-only property that contains a usvstring which specifies the file's path relative to the directory selected by the user in an <input> element with its webkitdirectory attribute set.
... syntax relativepath = file.webkitrelativepath value a usvstring containing the path of the file relative to the ancestor directory the user selected.
...d="filepicker" name="filelist" webkitdirectory multiple /> <ul id="listing"></ul> javascript content document.getelementbyid("filepicker").addeventlistener("change", function(event) { let output = document.getelementbyid("listing"); let files = event.target.files; for (let i=0; i<files.length; i++) { let item = document.createelement("li"); item.innerhtml = files[i].webkitrelativepath; output.appendchild(item); }; }, false); result specifications specification status comment file and directory entries apithe definition of 'webkitrelativepath' in that specification.
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetwebkitrelativepathchrome full support 13prefixed full support 13prefixed prefixed implemented with the vendor prefix: webkitedge full support 13firefox full support 49ie no support noopera ...
SVGMPathElement - Web APIs
the svgmpathelement interface corresponds to the <mpath> element.
...naco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgelement</text></a><polyline points="481,25 491,20 491,30 481,25" stroke="#d4dde4" fill="none"/><line x1="491" y1="25" x2="499" y2="25" stroke="#d4dde4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#d4dde4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/svgmpathelement" target="_top"><rect x="331" y="65" width="150" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="406" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svgmpathelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this interf...
... specifications specification status comment svg animations level 2the definition of 'svgmpathelement' in that specification.
... scalable vector graphics (svg) 1.1 (second edition)the definition of 'svgmpathelement' in that specification.
SVGPathElement.getTotalLength() - Web APIs
the svgpathelement.gettotallength() method returns the user agent's computed value for the total length of the path in user units.
... note: in svg 2 this method was moved to the svggeometryelement interface, from which the svgpathelement inherits it.
... syntax float someelement.gettotallength(); return value a float indicating the total length of the path in user units.
... specifications specification status comment scalable vector graphics (svg) 1.1 (second edition)the definition of 'svgpathelement.gettotallength()' in that specification.
XPathEvaluator.createNSResolver() - Web APIs
this method adapts any dom node to resolve namespaces so that an xpath expression can be easily evaluated relative to the context of the node where it appeared within the document.
... syntax xpathnsresolver xpathevaluator.creatensresolver(noderesolver); parameters noderesolver a node to be used as a context for namespace resolution.
... return value an xpathnsresolver object which resolves namespaces with respect to the definitions in scope for a specified node.
... specifications specification status comment document object model (dom) level 3 xpath specificationthe definition of 'xpathevaluator.creatensresolver()' in that specification.
XPathException - Web APIs
in the dom xpath api the xpathexception interface represents exception conditions that can be encountered while performing xpath operations.
... properties xpathexception.code read only returns a short that contains one of the error code constants.
... constants constant value description invalid_expression_err 51 if the expression has a syntax error or otherwise is not a legal expression according to the rules of the specific xpathevaluator or contains specialized extension functions or variables not supported by this implementation.
... specifications specification status comment document object model (dom) level 3 xpath specificationthe definition of 'xpathexception' in that specification.
XPathNSResolver - Web APIs
the xpathnsresolver interface permits prefix strings in an xpath expression to be properly bound to namespace uri strings.
... the xpathevaluator interface can construct an implementation of xpathnsresolver from a node, or the interface may be implemented by any application.
... methods xpathnsresolver.lookupnamespaceuri() looks up the namespace uri associated to the given namespace prefix.
... specifications specification status comment document object model (dom) level 3 xpath specificationthe definition of 'xpathnsresolver' in that specification.
XPathResult.booleanValue - Web APIs
the read-only booleanvalue property of the xpathresult interface returns the boolean value of a result with xpathresult.resulttype being boolean_type.
... syntax var value = result.booleanvalue; return value the return value is the boolean value of the xpathresult returned by document.evaluate().
... exceptions type_err in case xpathresult.resulttype is not boolean_type, an xpathexception of type type_err is thrown.
... html <div>xpath example</div> <p>text is 'xpath example': <output></output></p> javascript var xpath = "//div/text() = 'xpath example'"; var result = document.evaluate(xpath, document, null, xpathresult.boolean_type, null); document.queryselector("output").textcontent = result.booleanvalue; result specifications specification status comment document object model (dom) level 3 xpath specificationthe definition of 'xpathresult.booleanvalue' in that specification.
XPathResult.invalidIteratorState - Web APIs
the read-only invaliditeratorstate property of the xpathresult interface signifies that the iterator has become invalid.
... it is true if xpathresult.resulttype is unordered_node_iterator_type or ordered_node_iterator_type and the document has been modified since this result was returned.
... html <div>xpath example</div> <p>iterator state: <output></output></p> javascript var xpath = "//div"; var result = document.evaluate(xpath, document, null, xpathresult.any_type, null); // invalidates the iterator state document.queryselector("div").remove(); document.queryselector("output").textcontent = result.invaliditeratorstate ?
... "invalid" : "valid"; result specifications specification status comment document object model (dom) level 3 xpath specificationthe definition of 'xpathresult.invaliditeratorstate' in that specification.
XPathResult.numberValue - Web APIs
the read-only numbervalue property of the xpathresult interface returns the numeric value of a result with xpathresult.resulttype being number_type.
... syntax var value = result.numbervalue; return value the return value is the numeric value of the xpathresult returned by document.evaluate().
... exceptions type_err in case xpathresult.resulttype is not number_type, an xpathexception of type type_err is thrown.
... html <div>xpath example</div> <div>number of &lt;div&gt;s: <output></output></div> javascript var xpath = "count(//div)"; var result = document.evaluate(xpath, document, null, xpathresult.number_type, null); document.queryselector("output").textcontent = result.numbervalue; result specifications specification status comment document object model (dom) level 3 xpath specificationthe definition of 'xpathresult.numbervalue' in that specification.
XPathResult.singleNodeValue - Web APIs
the read-only singlenodevalue property of the xpathresult interface returns a node value or null in case no node was matched of a result with xpathresult.resulttype being any_unordered_node_type or first_ordered_node_type.
... syntax var value = result.singlenodevalue; return value the return value is the node value of the xpathresult returned by document.evaluate().
... exceptions type_err in case xpathresult.resulttype is not any_unordered_node_type or first_ordered_node_type, an xpathexception of type type_err is thrown.
... html <div>xpath example</div> <div>tag name of the element having the text content 'xpath example': <output></output></div> javascript var xpath = "//*[text()='xpath example']"; var result = document.evaluate(xpath, document, null, xpathresult.first_ordered_node_type, null); document.queryselector("output").textcontent = result.singlenodevalue.localname; result specifications specification status comment document object model (dom) level 3 xpath specificationthe definition of 'xpathresult.singlenodevalue' in that specification.
XPathResult.snapshotItem() - Web APIs
the snapshotitem() method of the xpathresult interface returns an item of the snapshot collection or null in case the index is not within the range of nodes.
... syntax var node = result.snapshotitem(i); return value the node at the given index within the node set of the xpathresult.
... exceptions type_err in case xpathresult.resulttype is not unordered_node_snapshot_type or ordered_node_snapshot_type, an xpathexception of type type_err is thrown.
... 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.ordered_node_snapshot_type, null); var node = null; var tagnames = []; for(var i = 0; i < result.snapshotlength; i++) { var node = result.snapshotitem(i); 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.snapshotitem()' in that specification.
XPathResult.stringValue - Web APIs
the read-only stringvalue property of the xpathresult interface returns the string value of a result with xpathresult.resulttype being string_type.
... syntax var value = result.stringvalue; return value the return value is the string value of the xpathresult returned by document.evaluate().
... exceptions type_err in case xpathresult.resulttype is not string_type, an xpathexception of type type_err is thrown.
... html <div>xpath example</div> <div>text content of the &lt;div&gt; above: <output></output></div> javascript var xpath = "//div/text()"; var result = document.evaluate(xpath, document, null, xpathresult.string_type, null); document.queryselector("output").textcontent = result.stringvalue; result specifications specification status comment document object model (dom) level 3 xpath specificationthe definition of 'xpathresult.stringvalue' in that specification.
self - XPath
WebXPathAxesself
specifications specification status comment xpath 3.1the definition of 'self' in that specification.
... recommendation xpath 3.0the definition of 'self' in that specification.
... recommendation xpath 2.0the definition of 'self' in that specification.
... recommendation xpath 1.0the definition of 'self' in that specification.
Axes - XPath
WebXPathAxes
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes there are thirteen different axes in the xpath specification.
... for further information on using xpath expressions, please see the for further reading section at the end of transforming xml with xslt document.
... also see the 'axes' section in the xpath spec.
...if an xpath expression does not specify an axis, this is understood by default.
translate - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the translate function evaluates a string and a set of characters to translate and returns the translated string.
... notes xpath notes that the translate function is not a sufficient solution for case conversion in all languages.
... a future version of xpath may provide additional functions for case conversion.
... defined xpath 1.0 4.2 gecko support supported.
fs/path - Archive of obsolete content
experimental provides access to the local filesystem with the nodejs path module api.
... usage this module attempts to implement the nodejs path module api.
... please refer the nodejs path module api documentation for this module.
nsIDOMXPathException
dom/interfaces/xpath/nsidomxpathexception.idlscriptable describes an exception resulting from xpath operations.
... constants error codes constant value description invalid_expression_err 51 an invalid xpath expression was used.
... see also introduction to using xpath in javascript document object model (dom) level 3 xpath specification nsidomxpathevaluator document.evaluate nsidomxpathresult ...
SVGGeometryElement.pathLength - Web APIs
the svggeometryelement.pathlength property reflects the pathlength attribute and returns the total length of the path, in user units.
... note: this property was originally part of the svgpathelement interface.
... syntax var pathlength = someelement.pathlength; specifications specification status comment scalable vector graphics (svg) 2the definition of 'svggeometryelement.pathlength' in that specification.
URL.pathname - Web APIs
WebAPIURLpathname
the pathname property of the url interface is a usvstring containing an initial '/' followed by the path of the url (or the empty string if there is no path).
... syntax const path = url.pathname url.pathname = newpath value a usvstring.
... examples const url = new url('/docs/web/api/url/pathname?q=value'); console.log(url.pathname); // logs "/docs/web/api/url/pathname" specifications specification status comment urlthe definition of 'url.pathname' in that specification.
URL.pathname - Web APIs
the pathname property of the url interface is a usvstring containing an initial '/' followed by the path of the url (or the empty string if there is no path).
... syntax const path = url.pathname url.pathname = newpath value a usvstring.
... examples const url = new url('/docs/web/api/url/pathname?q=value'); console.log(url.pathname); // logs "/docs/web/api/url/pathname" specifications specification status comment urlthe definition of 'url.pathname' in that specification.
URLUtilsReadOnly.pathname - Web APIs
the urlutilsreadonly.pathname read-only property returns a domstring containing an initial '/' followed by the path of the url.
... syntax string = object.pathname; examples // in a web worker, on the page https://developer.mozilla.org/urlutilsreadonly.pathname var result = window.self.pathname; // returns:'/urlutilsreadonly.pathname' specifications specification status comment urlthe definition of 'urlutilsreadonly.pathname' in that specification.
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetpathname experimentalchrome no support noedge no support nofirefox full support 3.5ie no support noopera no support nosafari no support ...
XPathNSResolver.lookupNamespaceURI() - Web APIs
the lookupnamespaceuri method looks up the namespace uri associated to the given namespace prefix within an xpath expression evaluated by the xpathevaluator interface.
... syntax domstring xpathnsresolver.lookupnamespaceuri(prefix); parameters prefix a domstring representing the prefix to look for.
... specifications specification status comment document object model (dom) level 3 xpath specificationthe definition of 'xpathnsresolver.lookupnamespaceuri()' in that specification.
XPathResult.snapshotLength - Web APIs
the read-only snapshotlength property of the xpathresult interface represents the number of nodes in the result snapshot.
... exceptions type_err in case xpathresult.resulttype is not unordered_node_snapshot_type or ordered_node_snapshot_type, an xpathexception of type type_err is thrown.
... html <div>xpath example</div> <div>number of matched nodes: <output></output></div> javascript var xpath = "//div"; var result = document.evaluate(xpath, document, null, xpathresult.ordered_node_snapshot_type, null); document.queryselector("output").textcontent = result.snapshotlength; result specifications specification status comment document object model (dom) level 3 xpath specificationthe definition of 'xpathresult.snapshotlength' in that specification.
<hatchpath> - SVG: Scalable Vector Graphics
WebSVGElementhatchpath
the <hatchpath> svg element defines a hatch path used by the <hatch> element.
... usage context categoriesnonepermitted contentany number of the following elements, in any order:animation elementsdescriptive elements<script>, <style> attributes global attributes core attributes global event attributes presentation attributes style attributes specific attributes d offset dom interface this element implements the svghatchpathelement interface.
... example svg <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg"> <defs> <hatch id="hatch" hatchunits="userspaceonuse" pitch="5" rotate="135"> <hatchpath stroke="#a080ff" stroke-width="2"/> </hatch> </defs> <rect fill="url(#hatch)" stroke="black" stroke-width="2" x="10%" y="10%" width="80%" height="80%" /> </svg> result ...
current - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the current function can be used to get the context node in an xslt instruction.
... notes this function is an xslt-specific addition to xpath.
... it is not a part of the core xpath function library.
document - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the document finds a node-set in an external document, or multiple external documents, and returns the resulting node-set.
... this function is an xslt-specific addition to xpath.
... it is not a part of the core xpath function library.
format-number - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the format-number function evaluates a number and returns a string representing the number in a given format.
... notes this function is an xslt-specific addition to xpath.
... it is not a part of the core xpath function library.
generate-id - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the generate-id function generates a unique id for the first node in a given node-set and returns a string containing that id.
... this function is an xslt-specific addition to xpath.
... it is not a part of the core xpath function library.
key - XPath
WebXPathFunctionskey
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the key function returns a node-set of nodes that have the given value for the given key.
... this function is an xslt-specific addition to xpath.
... it is not a part of the core xpath function library.
position - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the position function returns a number equal to the context position from the expression evaluation context.
... the context is determined by the rest of the path.
...--> </xsl:template> <xsl:template match="//div[@class='foo']/bar[position() = 1]"> <!-- this template matches the first bar element that is a child of a div element with a class attribute equal to "foo" --> </xsl:template> defined xpath 1.0 4.1 gecko support supported.
substring - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the substring function returns a part of a given string.
... notes as in other xpath functions, the position is not zero-based.
... defined xpath 1.0 4.2 gecko support supported.
XPath - Archive of obsolete content
notes and sample code for xpath and ajax (the following was moved from document.evaluate) obj.evaluate(xpathexpression,contextnode,namespaceresolver,resulttype,result); //obj and contextnode should be the same object, if context is a ajax xml object (example: returnedxml) this should be used as : returnedxml.evaluate(xpathexpression,returnedxml,namespaceresolver,returntype,result); //contextnode should be used in the one in which it was created //add by mooring 2008-11-15 16:00 china var xhr = new ajax('post','demo.xml',parsexml,'xml'); //ajax is a class written by javascript which return responsexml object to parsexml function function parsexml(obj)//obj is the returnxml object now { if(!obj.documentelement) { alert("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>answer4</item> </field> </root> //add by mooring 2008...
XPath - MDN Web Docs Glossary: Definitions of Web-related terms
xpath is a query language that can access sections and content in an xml document.
... learn more technical reference xpath documentation on mdn xpath specification general knowledge official website xpath on wikipedia ...
HTMLHyperlinkElementUtils.pathname - Web APIs
the htmlhyperlinkelementutils.pathname property is a usvstring containing an initial '/' followed by the path of the url (or the empty string if there is no path).
... syntax string = object.pathname; object.pathname = string; examples // let's an <a id="myanchor" href="https://developer.mozilla.org/docs/htmlhyperlinkelementutils.pathname"> element be in the document var anchor = document.getelementbyid("myanchor"); var result = anchor.pathname; // returns:'/docs/htmlhyperlinkelementutils.pathname' specifications specification status comment html living standardthe definition of 'htmlhyperlinkelementutils.pathname' in that specification.
Location: pathname - Web APIs
WebAPILocationpathname
the pathname property of the location interface is a usvstring containing an initial '/' followed by the path of the url (or the empty string if there is no path).
... syntax string = object.pathname; object.pathname = string; examples // let's an <a id="myanchor" href="https://developer.mozilla.org/docs/location.pathname"> element be in the document var anchor = document.getelementbyid("myanchor"); var result = anchor.pathname; // returns:'/docs/location.pathname' specifications specification status comment html living standardthe definition of 'pathname' in that specification.
XPathException.code - Web APIs
the code read-only property of the xpathexception interface returns a short that contains one of the error code constants.
... specifications specification status comment document object model (dom) level 3 xpath specificationthe definition of 'xpathexception' in that specification.
boolean - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the boolean function evaluates an expression and returns true or false.
... defined xpath 1.0 4.3 gecko support supported.
ceiling - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the ceiling function evaluates a decimal number and returns the smallest integer greater than or equal to the decimal number.
... for example: ceiling (5.2) = 6 ceiling (-5.2) = -5 defined xpath 1.0 4.4 gecko support supported.
concat - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the concat function concatenates two or more strings and returns the resulting string.
... defined xpath 1.0 4.2 gecko support supported.
contains - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the contains function determines whether the first argument string contains the second argument string and returns boolean true or false.
... defined xpath 1.0 4.2 gecko support supported.
count - XPath
WebXPathFunctionscount
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the count function counts the number of nodes in a node-set and returns an integer.
... defined xpath 1.0 4.1 gecko support supported.
false - XPath
WebXPathFunctionsfalse
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the false function returns boolean false.
... notes this function is useful part of a comparison: <xsl:if test="boolean((1 &gt; 2) = false())"> the expression evaluates as true </xsl:if> defined xpath 1.0 4.3 gecko support supported.
floor - XPath
WebXPathFunctionsfloor
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the floor function evaluates a decimal number and returns the largest integer less than or equal to the decimal number.
... defined xpath 1.0 4.4 gecko support supported.
function-available - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the function-available function determines if a given function is available and returns boolean true or false.
... defined xpath 1.0 15 gecko support supported.
id - XPath
WebXPathFunctionsid
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the id function finds nodes matching the given ids and returns a node-set containing the identified nodes.
...see xpath 1.0 5.2.1 defined xpath 1.0 4.1 gecko support partially supported.
lang - XPath
WebXPathFunctionslang
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the lang function determines whether the context node matches the given language and returns boolean true or false.
...ang="en">i went up a floor.</p> <p xml:lang="en-gb">i took the lift.</p> <p xml:lang="en-us">i rode the elevator.</p> and this part of an xsl template: <xsl:value-of select="count(//p[lang('en')])" /> <xsl:value-of select="count(//p[lang('en-gb')])" /> <xsl:value-of select="count(//p[lang('en-us')])" /> <xsl:value-of select="count(//p[lang('de')])" /> the output might be: 3 1 1 0 defined xpath 1.0 4.3 gecko support supported.
last - XPath
WebXPathFunctionslast
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the last function returns a number equal to the context size from the expression evaluation context.
... defined xpath 1.0 4.1 gecko support supported.
local-name - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the local-name function returns a string representing the local name of the first node in a given node-set.
... defined xpath 1.0 4.1 gecko support supported.
name - XPath
WebXPathFunctionsname
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the name function returns a string representing the qname of the first node in a given node-set.
... defined xpath 1.0 4.1 gecko support supported.
namespace-uri - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the namespace-uri function returns a string representing the namespace uri of the first node in a given node-set.
... defined xpath 1.0 4.1 gecko support supported.
normalize-space - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the normalize-space function strips leading and trailing white-space from a string, replaces sequences of whitespace characters by a single space, and returns the resulting string.
... defined xpath 1.0 4.2 gecko support supported.
not - XPath
WebXPathFunctionsnot
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the not function evaluates a boolean expression and returns the opposite value.
...--> </xsl:template> defined xpath 1.0 4.3 gecko support supported.
number - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the number function converts an object to a number and returns the number.
... defined xpath 1.0 4.4 gecko support supported.
round - XPath
WebXPathFunctionsround
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the round function returns a number that is the nearest integer to the given number.
... defined xpath 1.0 4.4 gecko support supported.
starts-with - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the starts-with checks whether the first string starts with the second string and returns true or false.
... defined xpath 1.0 4.2 gecko support supported.
string-length - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the string-length function returns a number equal to the number of characters in a given string.
... defined xpath 1.0 4.2 gecko support supported.
string - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the string function converts the given argument to a string.
... defined xpath 1.0 4.2 gecko support supported.
substring-after - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the substring-after function returns a string that is the rest of a given string after a given substring.
... examples xpath example output substring-after('aa-bb','-') bb substring-after('aa-bb','a') a-bb substring-after('aa-bb','b') b substring-after('aa-bb','q') (empty string) defined xpath 1.0 4.2 gecko support supported.
substring-before - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the substring-before function returns a string that is the part of a given string before a given substring.
... examples xpath example output substring-before('aa-bb','-') aa substring-before('aa-bb','a') (empty string) substring-before('aa-bb','b') aa- substring-before('aa-bb','q') (empty string) defined xpath 1.0 4.2 gecko support supported.
sum - XPath
WebXPathFunctionssum
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the sum function returns a number that is the sum of the numeric values of each node in a given node-set.
... notes (none) defined xpath 1.0 4.3 gecko support supported.
true - XPath
WebXPathFunctionstrue
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the true function returns a boolean value of true.
... defined xpath 1.0 4.3 gecko support supported.
Functions - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the following is an annotated list of core xpath functions and xslt-specific additions to xpath, including a description, syntax, a list of arguments, result-type, source in the appropriate w3c recommendation, and degree of present gecko support.
... for further information on using xpath/xslt functions, please see the for further reading page.
Tutorial: Show Allocations Per Call Path - Firefox Developer Tools
tutorial: show allocations per call path this page shows how to use the debugger api to show how many objects a web page allocates, sorted by the function call path that allocated them.
File.mozFullPath - Web APIs
WebAPIFilemozFullPath
a privileged exension to the file interface, the mozfullpath property contains the full pathname of the represented file.
choose - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the choose function returns one of the specified objects based on a boolean parameter.
element-available - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the element-available function determines if an element is available and returns true or false.
system-property - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the system-property function returns an object representing the given system-property.
unparsed-entity-url - XPath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the unparsed-entity-url() function returns the uri of the unparsed entity with the given name.
The Netscape XSLT/XPath Reference - XSLT: Extensible Stylesheet Language Transformations
the following is an alphabetized and annotated list of the elements, axes, and functions from the w3c's 1.0 recommendation for xslt, as well as from the appropriate sections of the xpath recommendation.
Index - Web APIs
WebAPIIndex
this is used to compute the path loss as this.txpower - this.rssi.
...this is used to compute the path loss as this.txpower - this.rssi.
... 544 canvasrenderingcontext2d.arc() api, canvas, canvasrenderingcontext2d, method, reference the canvasrenderingcontext2d.arc() method of the canvas 2d api adds a circular arc to the current sub-path.
...And 76 more matches
Drawing shapes with canvas - Web APIs
working with paths is essential when drawing objects onto the canvas and we will see how that can be done.
... drawing rectangles unlike svg, <canvas> only supports two primitive shapes: rectangles and paths (lists of points connected by lines).
... all other shapes must be created by combining one or more paths.
...And 58 more matches
OS.File for the main thread
ry runs out, or the application is stopped.) let encoder = new textencoder(); // this encoder can be reused for several writes let array = encoder.encode("this is some text"); // convert the text to an array let promise = os.file.writeatomic("file.txt", array, // write the array atomically to "file.txt", using as temporary {tmppath: "file.txt.tmp"}); // buffer "file.txt.tmp".
... but will fail if "file.txt" already exists: let encoder = new textencoder(); // this encoder can be reused for several writes let array = encoder.encode("this is some text"); // convert the text to an array let promise = os.file.writeatomic("file.txt", array, // write the array atomically to "file.txt", using as temporary {tmppath: "file.txt.tmp", nooverwrite: true}); // buffer "file.txt.tmp".
... example: rename a file you have to use os.file.move to rename a file: let promise = os.file.move("oldname.txt", "newname.txt", {nooverwrite:true}); here's a working example which renames test.txt to testrenamed.txt if the file is located in directory c:\jean\ var promise = os.file.move(os.path.join('c:', 'jean', 'test.txt'), os.path.join('c:', 'jean', 'testrenamed.txt')); promise.then( function() { console.log('rename successful') }, function(arejectreason) { console.log('rename failed, arejectreason = ', arejectreason) } ) the nooverwrite true is important, as default is false which means if a file in the directory exists already with the same name it will no longer be there after this "renam...
...And 50 more matches
nsIFile
with an nsifile you can navigate to ancestors or descendants without having to deal with the different path separators used on different platforms, query the state of any file or directory at the position represented by the nsifile and create, move or copy items in the filesystem.
... an nsifile can be retrieved by either instantiating an nsilocalfile using a platform specific path string or by using cross-platform locations retrieved from the directory service.
...therefore, you must not use the native form unless it is guaranteed that the path passed to a native form function is always ascii.
...And 39 more matches
io/file - Archive of obsolete content
usage paths path specifications in this api are platform-specific.
... this means that on windows paths are specified using the backslash path separator (\), and on unix-like systems like linux and os x paths are specified using the forward slash path separator (/).
... if your add-on uses literal windows-style path specifications with this api, your add-on likely won't work when users run it on unix-like systems.
...And 34 more matches
cfx - Archive of obsolete content
called with no options it looks for a file called package.json in the current directory, loads the corresponding add-on, and runs it under the version of firefox it finds in the platform's default install path.
... you can specify a different version of the host application using the --binary option, passing in the path to the application binary to run.
... the path may be specified as a full path or may be relative to the current directory.
...And 27 more matches
Install script template - Archive of obsolete content
var plid = "@myplugin.com/myplugin,version=5.3"; var version = "5.3.0.0"; var mimetype = "application/x-my-plugin"; var suffix = "my"; var suffix_description = "my plugin files"; var company_name = "mypluginco"; var plugin_description = "my exemplary plugin mine all mine"; // registry constant paths // these will be used when the win32 registry keys are written var hkey_local_machine = "hkey_local_machine"; var hkey_current_user = "hkey_current_user"; var reg_moz_path = "software\\mozillaplugins"; // my own error code in case secondary installation fails var nosecondaryinstall = 1; // error return codes need some memory var err; // error return codes when we try and install to the c...
... if this is a scriptable plugin errblock2 = addfile (plid, version, component_file, secondaryfolder, null); if (errblock2!=0) { logcomment("could not add " + component_file + " to " + secondaryfolder + ":" + errblock2); return errblock2; } } return 0; // 0 means everything went well with the secondary install } function writeplidsolution() { //concatenate the secondary install path with the filename to make a fully qualified pathname var qualifiedsecondaryfolderdll = secondaryfolder + plugin_file; var qualifiedsecondaryfolderxpt = secondaryfolder + component_file; // write plid keys (mozilla.org/projects/plugins/first-install-problem.html) // write plid keys to hklm var hklm_status = registerplid(hkey_local_machine, reg_moz_path, plid, qualifiedse...
...pany_name, software_name, version, mimetype, suffix, suffix_description); logcomment("moz first install installation: registerplid("+hkey_local_machine+") returned, status "+hklm_status); if (hklm_status == false) { // write plid keys (mozilla.org/projects/plugins/first-install-problem.html) // write plid keys to hkcu var hkcu_status = registerplid(hkey_current_user, reg_moz_path, plid, qualifiedsecondaryfolderdll, qualifiedsecondaryfolderxpt, plugin_description, company_name, software_name, version, mimetype, suffix, suffix_description); logcomment("first install installation: registerplid("+hkey_current_user+") returned, status "+hklm_status); if (hkcu_status != 0) { logcomment("could not write to the reg...
...And 26 more matches
SVG documentation index - SVG: Scalable Vector Graphics
WebSVGIndex
41 clip-path svg, svg attribute the clip-path presentation attribute defines or associates a clipping path with the element it is related to.
... 42 clip-rule svg, svg attribute the clip-rule attribute only applies to graphics elements that are contained within a <clippath> element.
... the clip-rule attribute basically works as the fill-rule attribute, except that it applies to <clippath> definitions.
...And 26 more matches
DirectoryEntrySync - Web APIs
if you try to create a directory using a full path that includes parent directories that do not exist yet, you get an error.
... so create the hierarchy by recursively adding a new path after creating the parent directory.
... var direntry = fs.root.getdirectory('superseekrit', {create: true}); method overview directoryreadersync createreader () raises (fileexception); fileentrysync getfile (in domstring path, in optional flags options) raises (fileexception); directoryentrysync getdirectory (in domstring path, in optional flags options) raises (fileexception); void removerecursively () raises (fileexception); methods createreader() creates a new directoryreadersync to read entries from this directory.
...And 24 more matches
CanvasRenderingContext2D - Web APIs
this code draws a house: // set line width ctx.linewidth = 10; // wall ctx.strokerect(75, 140, 150, 110); // door ctx.fillrect(130, 190, 40, 60); // roof ctx.beginpath(); ctx.moveto(50, 140); ctx.lineto(150, 60); ctx.lineto(250, 140); ctx.closepath(); ctx.stroke(); the resulting drawing looks like this: reference drawing rectangles there are three methods that immediately draw rectangles to the canvas.
... paths the following methods can be used to manipulate paths of objects.
... canvasrenderingcontext2d.beginpath() starts a new path by emptying the list of sub-paths.
...And 22 more matches
nsIZipWriter
void addentrychannel( in autf8string azipentry, in prtime amodtime, in print32 acompression, in nsichannel achannel, in boolean aqueue ); parameters azipentry the path of the file entry to add to the zip file.
... this is the path it will be located at within the zip file.
... note: you must use forward slashes ('/') in the path.
...And 21 more matches
Applying styles and colors - Web APIs
function draw() { var ctx = document.getelementbyid('canvas').getcontext('2d'); for (var i = 0; i < 6; i++) { for (var j = 0; j < 6; j++) { ctx.strokestyle = 'rgb(0, ' + math.floor(255 - 42.5 * i) + ', ' + math.floor(255 - 42.5 * j) + ')'; ctx.beginpath(); ctx.arc(12.5 + j * 25, 12.5 + i * 25, 10, 0, math.pi * 2, true); ctx.stroke(); } } } <canvas id="canvas" width="150" height="150"></canvas> draw(); the result looks like this: screenshotlive sample transparency in addition to drawing opaque shapes to the canvas, we can also draw semi-transparent (or translucent) shapes.
...background ctx.fillstyle = '#fd0'; ctx.fillrect(0, 0, 75, 75); ctx.fillstyle = '#6c0'; ctx.fillrect(75, 0, 75, 75); ctx.fillstyle = '#09f'; ctx.fillrect(0, 75, 75, 75); ctx.fillstyle = '#f30'; ctx.fillrect(75, 75, 75, 75); ctx.fillstyle = '#fff'; // set transparency value ctx.globalalpha = 0.2; // draw semi transparent circles for (var i = 0; i < 7; i++) { ctx.beginpath(); ctx.arc(75, 75, 10 + 10 * i, 0, math.pi * 2, true); ctx.fill(); } } <canvas id="canvas" width="150" height="150"></canvas> draw(); screenshotlive sample an example using rgba() in this second example, we do something similar to the one above, but instead of drawing circles on top of each other, i've drawn small rectangles with increasing opacity.
... the line width is the thickness of the stroke centered on the given path.
...And 19 more matches
jpm - Archive of obsolete content
to ensure compatibility with jpm, however, it must be present in your path under the name node.
... on debian and ubuntu, this can be remedied by ensuring you installed the compatibility package, nodejs-legacy: sudo apt-get install nodejs-legacy on other distributions, you may have to create a local symlink to nodejs manually: sudo ln -s "$(which nodejs)" /usr/local/bin/node installing jpm after you have npm installed and node on your path, install jpm just as you would any other npm package.
...tall jpm --global depending on your setup, you might need to run this as an administrator: sudo npm install jpm --global installing jpm locally if you do not wish to, or are unable to, install jpm globally, you may instead install it locally: cd $home && npm install jpm to run jpm from a terminal when installed locally, you must add the directory "$home/node_modules/.bin/" to your terminal's path first.
...And 18 more matches
Index
as a result, when searching for a trust path from (a) to a trusted anchor (root) certificate (z), the set of candidate issuer certificates might have different issuer names (referring to the second or higher issuer level).
... -libfile library-file specify a path to a library file containing the implementation of the pkcs #11 interface module that is being added to the database.
...for example: platforms { linux:5.4.08:x86 { modulename { "example pkcs #11 module" } modulefile { crypto.so } defaultmechanismflags{0x0000} cipherenableflags{0x0000} files { crypto.so { path{ /tmp/crypto.so } } setup.sh { executable path{ /tmp/setup.sh } } } } linux:6.0.0:x86 { equivalentplatform { linux:5.4.08:x86 } } } both the install script and the required libraries must be bundled in a jar file, which is specified with the -jar argument.
...And 18 more matches
nsILocalFile
to create an instance, use: var localfile = components.classes["@mozilla.org/file/local;1"] .createinstance(components.interfaces.nsilocalfile); method overview void appendrelativenativepath(in acstring relativefilepath); native code only!
... void appendrelativepath(in astring relativefilepath); acstring getrelativedescriptor(in nsilocalfile fromfile); void initwithfile(in nsilocalfile afile); void initwithnativepath(in acstring filepath); native code only!
... void initwithpath(in astring filepath); void launch(); prlibrarystar load(); native code only!
...And 18 more matches
d - SVG: Scalable Vector Graphics
WebSVGAttributed
the d attribute defines a path to be drawn.
... a path definition is a list of path commands where each command is composed of a command letter and numbers that represent the command parameters.
... three elements have this attribute: <path>, <glyph>, and <missing-glyph> html,body,svg { height:100% } <svg viewbox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"> <path fill="none" stroke="red" d="m 10,30 a 20,20 0,0,1 50,30 a 20,20 0,0,1 90,30 q 90,60 50,90 q 10,60 10,30 z" /> </svg> path for <path>, d is a string containing a series of path commands that define the path to be drawn.
...And 17 more matches
Drawing graphics - Learn web development
drawing shapes tends to be done using the rectangle shape primitive, or by tracing a line along a certain path and then filling in the shape.
... drawing paths if you want to draw anything more complex than a rectangle, you need to draw a path.
... basically, this involves writing code to specify exactly what path the pen should move along on your canvas to trace the shape you want to draw.
...And 16 more matches
Chapter 4: Using XPCOM—Implementing advanced processes - Archive of obsolete content
make sure to change file paths to match your own environment.
...when you initialize this by passing the full path to the file with the nsilocalfile.initwithpath() method, it becomes available to all functions.
... it doesn't matter whether a file at the specified path already exists.
...And 15 more matches
Compositing and clipping - Web APIs
clipping paths a clipping path is like a normal canvas shape but it acts as a mask to hide unwanted parts of shapes.
...the red star shape is our clipping path.
... everything that falls outside of this path won't get drawn on the canvas.
...And 15 more matches
Document.evaluate() - Web APIs
WebAPIDocumentevaluate
returns an xpathresult based on an xpath expression and other given parameters.
... syntax var xpathresult = document.evaluate( xpathexpression, contextnode, namespaceresolver, resulttype, result ); xpathexpression is a string representing the xpath to be evaluated.
... contextnode specifies the context node for the query (see the xpath specification).
...And 15 more matches
stroke-linejoin - SVG: Scalable Vector Graphics
the stroke-linejoin attribute is a presentation attribute defining the shape to be used at the corners of paths when they are stroked.
... as a presentation attribute, it can be applied to any element but it has effect only on the following nine elements: <altglyph>, <path>, <polygon>, <polyline>, <rect>, <text>, <textpath>, <tref>, and <tspan> html,body,svg { height:100% } <svg viewbox="0 0 18 12" xmlns="http://www.w3.org/2000/svg"> <!-- upper left path: effect of the "miter" value --> <path d="m1,5 a2,2 0,0,0 2,-3 a3,3 0 0 1 2,3.5" stroke="black" fill="none" stroke-linejoin="miter" /> <!-- center path: effect of the "round" value --> <path d="m7,5 a2,2 0,0,0 2,-3 a3,3 0 0 1 2,3.5" stroke="black" fill="none" stroke-linejoin="round" /> <!-- upper right path: effect of the "bevel" value --> <...
...path d="m13,5 a2,2 0,0,0 2,-3 a3,3 0 0 1 2,3.5" stroke="black" fill="none" stroke-linejoin="bevel" /> <!-- bottom left path: effect of the "miter-clip" value with fallback to "miter" if not supported.
...And 15 more matches
File I/O - Archive of obsolete content
createinstance(components.interfaces.nsilocalfile); file.initwithpath("/home"); note: the path should be in the "native" form (for example"c:\\windows").
...if you want the // file system path, use file.path note: file is an object that implements nsifile.
... if you want the file system path, use file.path, .
...And 14 more matches
Manifest Files - Archive of obsolete content
doesn't work with utf-8 with bom.) add the following line to it: content tests file:///c:/testfiles/ the file path in that line should point to the directory created above.
... if you aren't sure what the file path is, open that directory in a browser and copy the url from the address field.
...if the file doesn't load, make sure that the file path is correct.
...And 13 more matches
Creating Reusable Modules - Archive of obsolete content
ilepicker;1"] .createinstance(nsifilepicker); var window = require("sdk/window/utils").getmostrecentbrowserwindow(); fp.init(window, "select a file", nsifilepicker.modeopen); fp.appendfilters(nsifilepicker.filterall | nsifilepicker.filtertext); var rv = fp.show(); if (rv == nsifilepicker.returnok || rv == nsifilepicker.returnreplace) { var file = fp.file; // get the path as string.
... note that you usually won't // need to work with the string paths.
... var path = fp.file.path; // work with returned nsilocalfile...
...And 12 more matches
Promises - Archive of obsolete content
let info = yield os.file.stat(configpath); if (info.lastmodificationdate <= timestamp) return; timestamp = info.lastmodificationdate; // read the file as a utf-8 string, parse as json.
... let config = json.parse( yield os.file.read(configpath, { encoding: "utf-8" })); let files = []; // get the directory contents from a list of directories.
... let iter = new os.file.directoryiterator(dir); yield iter.foreach(entry => { if (!entry.isdir) files.push(entry.path); }); iter.close(); } // read the files as binary blobs and process them.
...And 12 more matches
Eclipse CDT
download "eclipse ide for c/c++ developers" (not eclipse ide for enterprise java developers) from the eclipse download page, install it, and add the directory containing the eclipse binary to your path (/applications/eclipse.app/contents/eclipse/ on mac).
...first, make sure that the directory of eclipse's eclipse binary (typically /applications/eclipse.app/contents/macos/ on macos) is in your path.
... if you want to invoke "make -f client.mk" from your source directory instead of invoking 'make' from your object directory, then in the "c/c++ build" section of the project properties, set "build command" to "make -f client.mk" and set "build directory" to just "${projdirpath}" (this is the top of the source tree).
...And 12 more matches
Eclipse CDT Manual Setup
eally good code assistance for a project's source code, ides like eclipse need to carry out a thorough static analysis of the project's source files, to build up a picture of the code (what eclipse is trying to do when it "indexes" the source.) static analysis involves parsing the source files, so naturally it can only produce good results if it has a sensible set of preprocessor defines, include paths and pre-include files for each source file.
... for projects the size and complexity of mozilla, it's impractical to manually configure eclipse when there is a valid set of defines and includes paths for each of the different parts of the source code.
...for each line that invoked a compiler, it tries to figure out which source file was being built and what its include paths were.
...And 12 more matches
/loader - Archive of obsolete content
instantiation the loader module provides a loader() function that may be used to instantiate new loader instances: let loader = loader(options); configuration loader() may be provided with a set of configuration options: paths: describes where the loader should find the modules it is asked to load.
... paths the loader needs to be provided with a set of locations to indicate where to find modules loaded using require().
... this is provided by a mandatory options.paths hash that represents the mapping between module id prefixes and locations.
...And 11 more matches
NSS tools : modutil
-libfile library-file specify a path to a library file containing the implementation of the pkcs #11 interface module that is being added to the database.
...for example: platforms { linux:5.4.08:x86 { modulename { "example pkcs #11 module" } modulefile { crypto.so } defaultmechanismflags{0x0000} cipherenableflags{0x0000} files { crypto.so { path{ /tmp/crypto.so } } setup.sh { executable path{ /tmp/setup.sh } } } } linux:6.0.0:x86 { equivalentplatform { linux:5.4.08:x86 } } } both the install script and the required libraries must be bundled in a jar file, which is specified with the -jar argument.
... forwardcompatible { irix:6.2:mips sunos:5.5.1:sparc } platforms { winnt::x86 { modulename { "example module" } modulefile { win32/fort32.dll } defaultmechanismflags{0x0001} defaultcipherflags{0x0001} files { win32/setup.exe { executable relativepath { %temp%/setup.exe } } win32/setup.hlp { relativepath { %temp%/setup.hlp } } win32/setup.cab { relativepath { %temp%/setup.cab } } } } win95::x86 { equivalentplatform {winnt::x86} } sunos:5.5.1:sparc { modulename { "example unix module" } modulefile { unix/fort.so } defaultmechanismflags{0x0001} cipherenableflags{0x0001} files { unix/fort.so { relativepath{%root%/lib/fort.so} ...
...And 10 more matches
NSS Tools modutil
-libfile library-file specify a path to the dll or other library file containing the implementation of the pkcs #11 interface module that is being added to the database.
... this: + pkcs11_install_script: pk11install the sample script file could contain the following: forwardcompatible { irix:6.2:mips sunos:5.5.1:sparc }platforms { winnt::x86 { modulename { "fortezza module" } modulefile { win32/fort32.dll } defaultmechanismflags{0x0001} defaultcipherflags{0x0001} files { win32/setup.exe { executable relativepath { %temp%/setup.exe } } win32/setup.hlp { relativepath { %temp%/setup.hlp } } win32/setup.cab { relativepath { %temp%/setup.cab } } } } win95::x86 { equivalentplatform {winnt::x86} } sunos:5.5.1:sparc { modulename { "fortezza unix module" } modulefile { unix/fort.so } defaultmechanismflags{0x0001} c...
...ipherenableflags{0x0001} files { unix/fort.so { relativepath{%root%/lib/fort.so} absolutepath{/usr/local/netscape/lib/fort.so} filepermissions{555} } xplat/instr.html { relativepath{%root%/docs/inst.html} absolutepath{/usr/local/netscape/docs/inst.html} filepermissions{555} } } } irix:6.2:mips { equivalentplatform { sunos:5.5.1:sparc } }} script grammar the script file grammar is as follows: --> valuelistvaluelist --> value valuelist <null>value ---> key_value_pair stringkey_value_pair --> key { valuelist }key --> stringstring --> simple_string "complex_string"simple_string --> [^ \t\n\""{""}"]+ (no whitespace, quotes, or braces.)compl...
...And 10 more matches
NSS tools : modutil
MozillaProjectsNSStoolsmodutil
-libfile library-file specify a path to a library file containing the implementation of the pkcs #11 interface module that is being added to the database.
...for example: platforms { linux:5.4.08:x86 { modulename { "example pkcs #11 module" } modulefile { crypto.so } defaultmechanismflags{0x0000} cipherenableflags{0x0000} files { crypto.so { path{ /tmp/crypto.so } } setup.sh { executable path{ /tmp/setup.sh } } } } linux:6.0.0:x86 { equivalentplatform { linux:5.4.08:x86 } } } both the install script and the required libraries must be bundled in a jar file, which is specified with the -jar argument.
... forwardcompatible { irix:6.2:mips sunos:5.5.1:sparc } platforms { winnt::x86 { modulename { "example module" } modulefile { win32/fort32.dll } defaultmechanismflags{0x0001} defaultcipherflags{0x0001} files { win32/setup.exe { executable relativepath { %temp%/setup.exe } } win32/setup.hlp { relativepath { %temp%/setup.hlp } } win32/setup.cab { relativepath { %temp%/setup.cab } } } } win95::x86 { equivalentplatform {winnt::x86} } sunos:5.5.1:sparc { modulename { "example unix module" } modulefile { unix/fort.so } defau...
...And 10 more matches
SVG and CSS - SVG: Scalable Vector Graphics
top-2" offset="95%"/> </radialgradient> </defs> <text id="heading" 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)"/> <g id="outer-petals"> <g class="quadrant"> <g class="segment"> <path class="segment-fill" d="m0,0 v-200 a40,40 0 0,0 -62,10 z"/> <path class="segment-edge" d="m0,-200 a40,40 0 0,0 -62,10"/> </g> <g class="segment" transform="rotate(18)"> <path class="segment-fill" d="m0,0 v-200 a40,40 0 0,0 -62,10 z"/> <path class="segment-edge" d="m0,-200 a40,40 0 0,0 -62,10"/> </g> <g class="segment" transform="rotate...
...(36)"> <path class="segment-fill" d="m0,0 v-200 a40,40 0 0,0 -62,10 z"/> <path class="segment-edge" d="m0,-200 a40,40 0 0,0 -62,10"/> </g> <g class="segment" transform="rotate(54)"> <path class="segment-fill" d="m0,0 v-200 a40,40 0 0,0 -62,10 z"/> <path class="segment-edge" d="m0,-200 a40,40 0 0,0 -62,10"/> </g> <g class="segment" transform="rotate(72)"> <path class="segment-fill" d="m0,0 v-200 a40,40 0 0,0 -62,10 z"/> <path class="segment-edge" d="m0,-200 a40,40 0 0,0 -62,10"/> </g> </g> <g class="quadrant"> <g class="segment" transform="rotate(90)"> <path class="segment-fill" d="m0,0 v-200 a40,40 0 0,0 -62,10 z"/> <path class="segment-edge" d="m0,-200 a...
...40,40 0 0,0 -62,10"/> </g> <g class="segment" transform="rotate(108)"> <path class="segment-fill" d="m0,0 v-200 a40,40 0 0,0 -62,10 z"/> <path class="segment-edge" d="m0,-200 a40,40 0 0,0 -62,10"/> </g> <g class="segment" transform="rotate(126)"> <path class="segment-fill" d="m0,0 v-200 a40,40 0 0,0 -62,10 z"/> <path class="segment-edge" d="m0,-200 a40,40 0 0,0 -62,10"/> </g> <g class="segment" transform="rotate(144)"> <path class="segment-fill" d="m0,0 v-200 a40,40 0 0,0 -62,10 z"/> <path class="segment-edge" d="m0,-200 a40,40 0 0,0 -62,10"/> </g> <g class="segment" transform="rotate(162)"> <path class="segment-fill" d="m0,0 v-200 a40,40 0 0,0 -62,10 z"/> ...
...And 10 more matches
url - Archive of obsolete content
functions tofilename(url) attempts to convert the given url to a native file path.
...an exception is raised if the url can't be converted; otherwise, the native file path is returned as a string.
... returns string : the converted native file path as a string.
...And 9 more matches
nsIHttpServer
} let host = "localhost"; if (typeof port === "string" && port.indexof(':') != -1){ [host, port] = port.split(':'); port = parseint(port); server.identity.add('http', host, port); } server.wrappedjsobject._start(port, host); return true; }, registerfile: function(path, filepath) { var file = components.classes['@mozilla.org/file/local;1'] .createinstance(components.interfaces.nsilocalfile); file.initwithpath(filepath); return server.registerfile(path, file); }, registerdirectory : function(path, directorypath) { var file = components.classes['@mozilla.org/file/local;1'...
...] .createinstance(components.interfaces.nsilocalfile); file.initwithpath(directorypath); return server.registerdirectory(path, file); }, registerpathhandler: function(path, handlercallback) { server.registerpathhandler(path, function (request, response) { var req = createhttprequest(request); var resp = new httpresponse(response); handlercallback(req, resp); }); }, registerprefixhandler: function(prefix, handlercallback) { server.registerprefixhandler(prefix, function (request, response) { var req = createhttprequest(request); var resp = new httpresponse(response); ...
... * * @param path * the path which is to be mapped to the given file; must begin with "/" and * be a valid uri path (i.e., no query string, hash reference, etc.) * @param file * the file to serve for the given path, or null to remove any mapping that * might exist; this file must exist for the lifetime of the server */ void registerfile(in string path, in nsifile file); /** * regi...
...And 9 more matches
Using IndexedDB - Web APIs
in the handler for the upgradeneeded event, you should create the object stores needed for this version of the database: // this event is only implemented in recent browsers request.onupgradeneeded = function(event) { // save the idbdatabase interface var db = event.target.result; // create an objectstore for this database var objectstore = db.createobjectstore("name", { keypath: "mykey" }); }; in this case, the database will already have the object stores from the previous version of the database, so you do not have to create these object stores again.
...if you need to change an existing object store (e.g., to change the keypath), then you must delete the old object store and create it again with the new options.
...there are several different ways that a key can be supplied depending on whether the object store uses a key path or a key generator.
...And 9 more matches
Chapter 6: Firefox extensions and XUL applications - Archive of obsolete content
we can guess from the name that this has something to do with handling files, but we’ve still got the following questions: what does nsilocalfile.initwithpath do?
... how is nsilocalfile.initwithpath actually implemented?
... in initwithpath, the nsilocalfile object gets initialized, and any information already in it gets reset.
...And 8 more matches
Index - Archive of obsolete content
86 fs/path provides access to the local filesystem with the nodejs path module api.
... 181 downloading files code snippets to download a file, create an instance of nsiwebbrowserpersist and call its nsiwebbrowserpersist.saveuri() method, passing it a url to download and an nsifile instance representing the local file name/path.
... 221 xpath no summary!
...And 8 more matches
Application Translation with Mercurial
mozillabuild must be installed into an absolute file path without whitespaces, else it will break.
... launch the installed mozillabuild toolset by launching it with its path, e.g.
... c:\mozilla\coding\buildtools\mozillabuild\start-shell-msvc2010.bat you can autocomplete the file path after typing a few characters and then pressing the tabulator key.
...And 8 more matches
sample2
d_cert_to_db, save_cert_to_header, encrypt, decrypt, sign, verify, unknown } commandtype; typedef enum { symkey = 0, mackey = 1, iv = 2, mac = 3, pad = 4, pubkey = 5, lab = 6, certenc= 7, certvfy= 8, sig = 9 } headertype; /* * print usage message and exit */ static void usage(const char *progname) { fprintf(stderr, "\nusage: %s %s %s %s %s %s %s %s %s %s\n\n", progname, " -<g|a|h|e|ds|v> -d <dbdirpath> ", "[-p <dbpwd> | -f <dbpwdfile>] [-z <noisefilename>] [-a <\"\">]", "-s <subject> -r <csr> | ", "-n <nickname> -t <trust> -c <cert> [ -r <csr> -u <issuernickname> [-x <\"\">] -m <serialnumber> ] | ", "-n <nickname> -b <headerfilename> | ", "-b <headerfilename> -i <ipfilename> -e <encryptfilename> | ", "-b <headerfilename> -i <ipfilename> | ", "-b <headerfilename> -i <ipfilename> | ", "-b <heade...
...orresponding private key \n\n", progname, "-d -b <headerfilename> -e <encryptfilename> -o <opfilename>"); fprintf(stderr, "%s %s\n --sign using private key \n\n", progname, "-s -b <headerfilename> -i <infilename> "); fprintf(stderr, "%s %s\n --verify using public key \n\n", progname, "-v -b <headerfilename> -i <ipfilename> "); fprintf(stderr, "options:\n\n"); fprintf(stderr, "%-30s - db directory path\n\n", "-d <dbdirpath>"); fprintf(stderr, "%-30s - db password [optional]\n\n", "-p <dbpwd>"); fprintf(stderr, "%-30s - db password file [optional]\n\n", "-f <dbpwdfile>"); fprintf(stderr, "%-30s - noise file name [optional]\n\n", "-z <noisefilename>"); fprintf(stderr, "%-30s - input file name\n\n", "-i <ipfilename>"); fprintf(stderr, "%-30s - header file name\n\n", "-b <headerfilename>"); fprintf...
...) { pr_fprintf(pr_stderr, "%s -g -d %s -s: improperly formatted name: \"%s\"\n", progname, dbdir, subjectstr); validationfailed = pr_true; } if (!certreqfilename) { pr_fprintf(pr_stderr, "%s -g -d %s -s %s -r: certificate request file name not found\n", progname, dbdir, subjectstr); validationfailed = pr_true; } if (validationfailed) { fprintf(stderr, "\nusage: %s %s \n\n", progname, "-g -d <dbdirpath> -s <subject> -r <csr> \n"); exit(-1); } } /* * validate the options used for add cert to db command */ static void validateaddcerttodbcommand(const char *progname, const char *dbdir, const char *nicknamestr, const char *truststr, const char *certfilename, const char *certreqfilename, const char *issuernamestr, const char *serialnumberstr, prbool selfsign) { prbool validationfailed = pr_false; if...
...And 8 more matches
Index
MozillaTechXPCOMIndex
135 ns_newlocalfile functions, functions:frozen, xpcom, xpcom api reference the ns_newlocalfile function creates an instance of nsilocalfile that provides a platform independent representation of a file path.
... 136 ns_newnativelocalfile functions, functions:frozen, xpcom, xpcom api reference the ns_newnativelocalfile function creates an instance of nsilocalfile that provides a platform independent representation of a file path.
...for instance, it can give you the path of the system's temporary directory, desktop directory, current working directory, and so on.
...And 8 more matches
Add to iPhoto
it differs from a string in that it offers url-specific methods for managing the content, and includes methods for converting between urls and file system routine data formats such as fsref and unix pathnames.
...s.cfurlref, // returns ctypes.voidptr_t, // input: allocator ctypes.unsigned_char.ptr, // input: pointer to string cfindex, // input: string length ctypes.bool) // input: isdirectory this method is used to convert a unix pathname into an url.
... the pathname is specified as a value of type ctypes.unsigned_char.ptr, which is a pointer to an unsigned character.
...And 8 more matches
FileSystemDirectoryEntry.getDirectory() - Web APIs
syntax filesystemdirectoryentry.getdirectory([path][, options][, successcallback][, errorcallback]); parameters path optional a usvstring representing an absolute path or a path relative to the directory on which the method is called, describing which directory entry to return.
... absolute paths may not be able to be used, for security reasons.
... fileerror.path_exists_err the create and exclusive options were both true, indicating that the directory should be created but must not already exist, but the directory does in fact already exist.
...And 8 more matches
Creating custom Firefox extensions with the Mozilla build system - Archive of obsolete content
topsrcdir = @top_srcdir@ srcdir = @srcdir@ vpath = @srcdir@ include $(depth)/config/autoconf.mk module = myextension dirs = public src xpi_name = myextension install_extension_id = myextension@mycompany.com xpi_pkgname = myextension dist_files = install.rdf include $(topsrcdir)/config/rules.mk a detailed description of the make process, describing the key features of this makefile, can be found here.
...topsrcdir = @top_srcdir@ srcdir = @srcdir@ vpath = @srcdir@ include $(depth)/config/autoconf.mk module = myextension xpidl_module = myextension xpi_name = myextension exports = \ myheader.h \ $(null) xpidlsrcs = \ myifirstcomponent.idl \ myisecondcomponent.idl \ $(null) include $(topsrcdir)/config/rules.mk xpidl_module is the name of the generated xpt file that contains type information about your idl interfaces...
...topsrcdir = @top_srcdir@ srcdir = @srcdir@ vpath = @srcdir@ include $(depth)/config/autoconf.mk is_component = 1 module = myextension library_name = myextension use_static_libs = 1 xpi_name = myextension cppsrcs = \ myfirstcomponent.cpp \ mysecondcomponent.cpp \ myextension.cpp \ $(null) include $(topsrcdir)/config/rules.mk extra_dso_ldopts += \ $(moz_component_libs) \ $(nspr_libs) \ $(null) in this...
...And 7 more matches
MCD, Mission Control Desktop, AKA AutoConfig - Archive of obsolete content
e ldap address book, create an email account, and configure imap and smtp: [root@calaz /usr/lib/thunderbird] $ cat thunderbird.cfg //put everything in a try/catch try { // 1) env variables if(getenv("user") != "") { // *nix settings var env_user = getenv("user"); var env_home = getenv("home"); } else { // windows settings var env_user = getenv("username"); var env_home = getenv("homepath"); } var env_mozdebug= getenv("mozilla_debug"); // var env_user = prompt("indiquez votre login", toto); // 2) lock general preferences //ldap address book lockpref("ldap_2.prefs_migrated", true); lockpref("ldap_2.servers.ldapint.auth.savepassword", true); lockpref("ldap_2.servers.ldapint.description", "ldap int"); lockpref("ldap_2.servers.ldapint.filename", "abook-1.mab"); lockpref("ldap_2.serve...
... my tests were on windows vista, and i noticed at least one difference, it is that paths changed; now the profile is in (for my procacci user sample): c:\users\procacci\appdata\roaming\thunderbird\profiles\v6we4uku.default start in debug mode in comand line interface: debug with displayerror() here's the result, i used the displayerror() method ( not the best way :-( see bug 206294 ) to show environment and ldap variables in order to check that it worked fine.
...ne.org/viewtopic.php?p=3381133#3381133 defaultpref("browser.safebrowsing.enabled", false); defaultpref("browser.safebrowsing.malware.enabled", false); // 1) env variables if(getenv("user") != "") { // *nix settings var env_user = getenv("user"); var env_home = getenv("home"); } else { // windows settings var env_user = getenv("username"); var env_home = getenv("homepath"); } var env_mozdebug= getenv("mozilla_debug"); // 2) define here (because if set after "3)" below it doesn't work !) processldapvalues which is eventually called by getldapattributes() just below, // check getldapattributes() code from $mozilla_home/defaults/autoconfig/prefcalls.js to see the inside call to "user defined" processldapvalues /* commented all this section about ldap calls, ...
...And 7 more matches
Setting up your own test automation environment - Learn web development
add the chromedriver and geckodriver driver's location to your system path variable.
... this should be an absolute path from the root of your hard disk, to the directory containing the drivers.
... for example, if we were using a mac os x machine, our user name was bob, and we put our drivers in the root of our home folder, the path would be /users/bob.
...And 7 more matches
Command line options
each message option follows the syntax field=value, for example: to=foo@nowhere.net subject=cool page attachment=www.mozilla.org attachment='file:///c:/test.txt' body=check this page or also in thunderbird 52 and newer: body=c:\path\to\file.txt separate multiple message options by comma (,), for example: "to=foo@nowhere.net,subject=cool page" .
... -override /path/to/override.ini load the specified override.ini file to override application.ini (browser/app/application.ini).
... -profile "profile_path" start with the profile with the given path.
...And 7 more matches
Examples
components.utils.import("resource://gre/modules/osfile.jsm") let path = os.path.join(os.constants.path.tmpdir, "file.txt"); let promise = os.file.exists(path); let newpromise = promise.then(function onfulfill(aexists) { if (aexists) { console.log("you have file.txt in your temporary directory."); } else { throw new error("you don't have file.txt in your temporary directory."); } }); // unexpected errors should always be reported at the end of a promise chain.
... components.utils.import("resource://gre/modules/osfile.jsm") let path = os.path.join(os.constants.path.tmpdir, "file.txt"); let promise = os.file.exists(path); let newpromise = promise.then(function onfulfill(aexists) { if (aexists) { console.log("you have file.txt in your temporary directory."); } else { console.log("you don't have file.txt in your temporary directory."); } }); // unexpected errors should always be reported at the end of a promise chain.
... using a promise returned by a function (compact) the same code as the previous example is usually written with a more compact syntax: components.utils.import("resource://gre/modules/osfile.jsm") let path = os.path.join(os.constants.path.tmpdir, "file.txt"); os.file.exists(path).then(exists => { console.log(exists ?
...And 7 more matches
nsIScriptableIO
okies.txt"); from an xpcom component, however, you will need to get a reference as with other components: var scriptableio = components.classes["@mozilla.org/io/scriptable-io;1"] .getservice(); scriptableio.getfile("profile", "cookies.txt"); method overview nsifile getfile(in astring alocation, in astring afilename); nsifile getfilewithpath(in astring afilepath); nsisupports newinputstream(in nsivariant abase, in astring amode, [optional] in astring acharset, [optional] in astring areplacechar, [optional] in unsigned long abuffersize); nsisupports newoutputstream(in nsivariant abase, in astring amode, [optional] in astring acharset, [optional] in astring areplacechar, [optional] in unsigned long abuff...
...this properly allows platform-independent path construction.
... afilename the relative path of the file to generate a reference for.
...And 7 more matches
FileSystemDirectoryEntry.getFile() - Web APIs
syntax filesystemdirectoryentry.getfile([path][, options][, successcallback][, errorcallback]); parameters path optional a usvstring specifying the path, relative to the directory on which the method is called, describing which file's entry to return.
... fileerror.path_exists_err the create and exclusive options were both true, indicating that the file should be created but must not already exist, but the file does in fact already exist.
... fileerror.type_mismatch_err the path specified is not a file; it's probably a directory, but might be an unsupported file descriptor such as a pipe; this depends on the user agent to some extent.
...And 7 more matches
SVG Presentation Attributes - SVG: Scalable Vector Graphics
alignment-baseline baseline-shift clip clip-path clip-rule color color-interpolation color-interpolation-filters color-profile color-rendering cursor direction display dominant-baseline enable-background fill fill-opacity fill-rule filter flood-color flood-opacity font-family font-size font-size-adjust font-stretch font-style font-variant font-weight glyph-orientation-horizontal glyph-orientation-vertical image-rendering kerning letter-spacing lighting-color marker-end marker-mid marker-start mask opacity overflow pointer-events shape-rendering solid-color solid-opacity stop-color stop-opacity stroke stroke-dasharray stroke-dashoffset stroke-lin...
... value: auto|<shape()>|inherit; animatable: yes clip-path it binds the element it is applied to with a given <clippath> element.
... value: none|<funciri>|inherit; animatable: yes clip-rule it indicates how to determine what side of a path is inside a shape in order to know how a <clippath> should clip its target.
...And 7 more matches
addFile - Archive of obsolete content
method of install object syntax public int addfile ( string registryname, installversion version, string xpisourcepath, object localdirspec, string relativelocalpath, boolean forceupdate); public int addfile ( string registryname, string version, string xpisourcepath, object localdirspec, string relativelocalpath, boolean forceupdate); public int addfile ( string xpisourcepath); public int addfile ( string registryname, string xpisourcepath, object localdirspec, string relativelocalpath); public int addfile ( string registryname, string version, stri...
...ng xpisourcepath, object localdirspec, string relativelocalpath); parameters the addfile method has the following parameters: registryname the pathname in the client version registry about the file.
... this parameter can be an absolute pathname, such as /royalairways/royalsw/executable or a relative pathname, such as executable.
...And 6 more matches
patch - Archive of obsolete content
method of install object syntax int patch ( string registryname, string xpisourcepath, object localdirspec, string relativelocalpath); int patch ( string registryname, installversion version, string xpisourcepath, object localdirspec, string relativelocalpath); int patch ( string registryname, string version, string xpisourcepath, object localdirspec, string relativelocalpath); parameters the patch method has the following parameters: registryname the pathname in the client version registry for the component that is to be patched.this parameter can be an absolute pathname, such as /royalairways/royalsw/executable or a relative pathname, such as executable.
... typically, absolute pathnames are only used for shared components, or components that come from another vendor, such as /microsoft/shared/msvcrt40.dll.
... typically, relative pathnames are relative to the main pathname specified in the initinstall method.
...And 6 more matches
mach
try running the program: $ ./mach run try running your program in a debugger: $ ./mach run --debug try running some tests: $ ./mach xpcshell-test services/common/tests/unit/ or run an individual test: $ ./mach mochitest browser/base/content/test/general/browser_pinnedtabs.js you run mach from the source directory, so you should be able to use your shell's tab completion to tab-complete paths to tests.
...$ mozconfig=/path/to/mozconfig ./mach build # alternatively (for persistent mozconfig usage): $ export mozconfig=/path/to/mozconfig $ ./mach build # let's pretend the mozconfig environment variable isn't set.
...$ cd objdir-firefox $ mach build adding mach to your shell's search path if you add mach to your path (by modifying the path environment variable to include your source directory, or by copying mach to a directory in the default path like /usr/local/bin) then you can type mach anywhere in your source directory or your objdir.
...And 6 more matches
JavaScript OS.Constants
os.constants.path paths of well-known files and directories.
... libxul the path to the file containing libxul.
... profiledir the path to the current profile.
...And 6 more matches
Profiling with Xperf
for 64-bit windows 7 or vista, you'll need to do a registry tweak and then restart to enable stack walking: reg add "hklm\system\currentcontrolset\control\session manager\memory management" -v disablepagingexecutive -d 0x1 -t reg_dword -f symbol server setup with the latest versions of the windows performance toolkit, you can modify the symbol path directly from within the program via the trace menu.
... just make sure you set the symbol paths before enabling "load symbols" and before opening a summary view.
... you can also modify the _nt_symbol_path and _nt_symcache_path environment variables to make these changes permanent.
...And 6 more matches
Enc Dec MAC Using Key Wrap CertReq PKCS10 CSR
num { symkey = 0, mackey = 1, iv = 2, mac = 3, pad = 4, pubkey = 5, lab = 6, certenc= 7, certvfy= 8, sig = 9 } headertype; /* * print usage message and exit */ static void usage(const char *progname) { fprintf(stderr, "\nusage: %s %s %s %s %s %s %s %s %s %s\n\n", progname, " -<g|a|h|e|ds|v> -d <dbdirpath> ", "[-p <dbpwd> | -f <dbpwdfile>] [-z <noisefilename>] [-a <\"\">]", "-s <subject> -r <csr> | ", "-n <nickname> -t <trust> -c <cert> [ -r <csr> -u <issuernickname> [-x <\"\">] -m <serialnumber> ] | ", "-n <nickname> -b <headerfilename> | ", "-b <headerfilename> -i <ipfilename> -e <encryptfilename> | ", "-b <headerfilen...
... <headerfilename> -e <encryptfilename> -o <opfilename>"); fprintf(stderr, "%s %s\n --sign using private key \n\n", progname, "-s -b <headerfilename> -i <infilename> "); fprintf(stderr, "%s %s\n --verify using public key \n\n", progname, "-v -b <headerfilename> -i <ipfilename> "); fprintf(stderr, "options:\n\n"); fprintf(stderr, "%-30s - db directory path\n\n", "-d <dbdirpath>"); fprintf(stderr, "%-30s - db password [optional]\n\n", "-p <dbpwd>"); fprintf(stderr, "%-30s - db password file [optional]\n\n", "-f <dbpwdfile>"); fprintf(stderr, "%-30s - noise file name [optional]\n\n", "-z <noisefilename>"); fprintf(stderr, "%-30s - input file name\n\n", "-i <ipfi...
...ir, subjectstr); validationfailed = pr_true; } if (!certreqfilename) { pr_fprintf(pr_stderr, "%s -g -d %s -s %s -r: certificate request file name not found\n", progname, dbdir, subjectstr); validationfailed = pr_true; } if (validationfailed) { fprintf(stderr, "\nusage: %s %s \n\n", progname, "-g -d <dbdirpath> -s <subject> -r <csr> \n"); exit(-1); } } /* * validate the options used for add cert to db command */ static void validateaddcerttodbcommand(const char *progname, const char *dbdir, const char *nicknamestr, const char *truststr, const char *certfilename, ...
...And 6 more matches
Running Automated JavaScript Tests
basic usage is: jstests.py path_to_js_shell or using mach: ./mach jstests note that mach will generally find the js shell itself; the --shell argument can be used to specify the location manually.
... developers will often want to use the -d option: jstests.py -d path_to_js_shell the -d option skips tests that are marked as randomly failing; random failures are usually just noise when being run for day-to-day developer testing.
... another common use case is to run just one test, or all the tests in just one directory: jstests.py path_to_js_shell test_path_substring [ test_path_substring_2 ...
...And 6 more matches
nsIWindowsRegKey
method overview void close(); void create(in unsigned long rootkey, in astring relpath, in unsigned long mode); nsiwindowsregkey createchild(in astring relpath, in unsigned long mode); astring getchildname(in unsigned long index); astring getvaluename(in unsigned long index); unsigned long getvaluetype(in astring name); boolean haschanged(); boolean haschild(in astring name); boolean hasvalue(in astring name); ...
...boolean iswatching(); void open(in unsigned long rootkey, in astring relpath, in unsigned long mode); nsiwindowsregkey openchild(in astring relpath, in unsigned long mode); acstring readbinaryvalue(in astring name); unsigned long long readint64value(in astring name); unsigned long readintvalue(in astring name); astring readstringvalue(in astring name); void removechild(in astring relpath); void removevalue(in astring name); void startwatching(in boolean recurse); void stopwatching(); void writebinaryvalue(in astring name, in acstring data); void writeint64value(in astring name, in unsigned long long data); void writeintvalue(in astring name, in unsigned long data); void...
...void create( in unsigned long rootkey, in astring relpath, in unsigned long mode ); parameters rootkey a root key defined above or any valid hkey on 32-bit windows.
...And 6 more matches
ctypes.open
they can also be loaded from the system library path.
...they must be accessed through a local file path (file://) or a jar path (jar:).
... if the addon is an unpacked addon, such as bootstrap or add-on sdk addons, the jar path must be used.
...And 6 more matches
CanvasRenderingContext2D.stroke() - Web APIs
the canvasrenderingcontext2d.stroke() method of the canvas 2d api strokes (outlines) the current or given path with the current stroke style.
... strokes are aligned to the center of a path; in other words, half of the stroke is drawn on the inner side, and half on the outer side.
... the stroke is drawn using the non-zero winding rule, which means that path intersections will still get filled.
...And 6 more matches
stroke-linecap - SVG: Scalable Vector Graphics
the stroke-linecap attribute is a presentation attribute defining the shape to be used at the end of open subpaths when they are stroked.
... as a presentation attribute, it can be applied to any element but it has effect only on the following eight elements: <altglyph>, <path>, <polyline>, <line>, <text>, <textpath>, <tref>, and <tspan> html,body,svg { height:100% } <svg viewbox="0 0 6 6" xmlns="http://www.w3.org/2000/svg"> <!-- effect of the (default) "butt" value --> <line x1="1" y1="1" x2="5" y2="1" stroke="black" stroke-linecap="butt" /> <!-- effect of the "round" value --> <line x1="1" y1="3" x2="5" y2="3" stroke="black" stroke-linecap="round" /> <!-- effect of the "square" value --> <line x1="1" y1="5" x2="5" y2="5" stroke="black" stroke-linecap="square" /> <!-- the following pink lines highli...
...ght the position of the path for each stroke --> <path d="m1,1 h4 m1,3 h4 m1,5 h4" stroke="pink" stroke-width="0.025" /> </svg> usage notes value butt | round | square default value butt animatable yes butt the butt value indicates that the stroke for each subpath does not extend beyond its two endpoints.
...And 6 more matches
Fills and Strokes - SVG: Scalable Vector Graphics
strokes are drawn centered around the path.
... in the example above, the path is shown in pink, and the stroke in black.
... square has essentially the same appearance, but stretches the stroke slightly beyond the actual path.
...And 6 more matches
Chapter 5: Let's build a Firefox extension - Archive of obsolete content
to create this dev profile start firefox with firefox.exe -no-remote -p dev on the first start the profile manager will appear, where you can create the dev profile and configure its home-path.
...to register a package, you use a special uri scheme called a “chrome url” to represent the path to the file.
... chrome urls are structured as: chrome://%package name%/%package type%/%relative path to source file% for example, the chrome url for the firefox browser window is as follows: chrome://browser/content/browser.xul here, the package name is “browser”, the file “browser.xul”, and the type of the package is “content”.
...And 5 more matches
Creating a Microsummary - Archive of obsolete content
plate> <transform xmlns="http://www.w3.org/1999/xsl/transform" version="1.0"> <output method="text"/> <template match="/"> </template> </transform> </template> </generator> including the download count to include the download count in the output of the xslt transform sheet, we need to add an xslt <value-of> element to the template whose select attribute contains an xpath expression that points to the node containing the count.
... xpath is a language for identifying nodes in html/xml documents.
...the easiest way to get an xpath expression that points to the node in question is to use the xpath checker extension.
...And 5 more matches
XML in Mozilla - Archive of obsolete content
another exception is an entity whose system identifier is a relative path, and the xml declaration states that the document is not standalone (default), in which case mozilla will try to look for the entity under <bin>/res/dtd directory.
...xpointer framework obsolete since gecko 1.9.1 w3c recommendation xpointer element() scheme obsolete since gecko 1.9.1 w3c recommendation xpointer xmlns() scheme obsolete since gecko 1.9.1 w3c recommendation xpointer fixptr() scheme obsolete since gecko 1.9.1 this scheme is simply a wrapper for fixptr xpointer xpath1() scheme obsolete since gecko 1.9.1 internet-draft document.load(), document.async part of dom level 3 load & save module, a w3c working draft xhtml we have reasonable xhtml support, most things should work.
...files that go through the html code path are not checked for well-formedness.
...And 5 more matches
Error codes returned by Mozilla APIs
ns_error_file_unrecognized_path (0x80520001) this error occurs when an attempt is made to set a path that isn't valid for the platform.
... for example, if a character in the path is not valid for a filename.
... in addition, this error may occur when a relative path is supplied to a method that expects an absolute path and vice versa.
...And 5 more matches
Sqlite.jsm
this function takes an object defining connection options: path (required) the database file to open.
... this can be an absolute or relative path.
... if a relative path is given, it is interpreted as relative to the current profile's directory.
...And 5 more matches
Localizing without a specialized tool
get the source change your current directory to your working directory with the following command: $ cd /path/to/your/working/directory first, you will need to check out the sources of mozilla-1.9.2 together with the en-us strings.
...you can follow more detailed guidelines on compare-locale's page, but running the following command from the command line should be enough: $ sudo easy_install -u compare-locales to start, be sure to open your command line interface and change your directory to where you are keeping your localization files, the en-us sources $ cd /path/to/your/working/directory now, you will need run compare locales.
... to start, make sure you are in /path/to/your/working/directory/l10n-mozilla-1.9.2/x-testing and then, type the command mkdir /browser/chrome/browser now, step back out to the broader directory that contains both your l10n base (l10n-mozilla-1.9.2) and the en-us source code (mozilla-1.9.2).
...And 5 more matches
Dynamic Library Linking
library linking types these data types are defined for dynamic library linking: prlibrary prstaticlinktable library linking functions the library linking functions are: pr_setlibrarypath pr_getlibrarypath pr_getlibraryname pr_freelibraryname pr_loadlibrary pr_unloadlibrary pr_findsymbol pr_findsymbolandlibrary finding symbols defined in the main executable program pr_loadlibrary cannot open a handle that references the main executable program.
... dynamic library search path exporting symbols from the main executable program dynamic library search path the dynamic library search path is the list of directories in which to look for a dynamic library.
... on most unix systems, this environment variable is ld_library_path.
...And 5 more matches
Shell global objects
scriptpath a string that is a path of script.
... getmoduleloadpath() return any --module-load-path argument passed to the shell.
...argv[0] of the nested shell will be argv[0] of the current shell (which is assumed to be the actual path to the shell.
...And 5 more matches
Setting up the Gecko SDK
this directory structure makes build scripts slightly more complicated (since there will be many different include paths), but it helps to organize the parts of the sdk meaningfully.
...this window is where you add the include paths to the gecko sdk as well as two preprocessor defines: xpcom_glue mozilla_strict_api at a minimum, you must include the nspr, the embedstring and string include directories, and the xpcom include subdirectory.
... assuming you are using the example location for your project, these paths are the following: c:\gecko-sdk\embedstring\include c:\gecko-sdk\xpcom\include c:\gecko-sdk\nspr\include c:\gecko-sdk\string\include under the c++ language category, disable exception handling.
...And 5 more matches
Starting WebLock
the two functions look like this: static ns_method weblockregistration(nsicomponentmanager *acompmgr, nsifile *apath, const char *registrylocation, const char *componenttype, const nsmodulecomponentinfo *info); static ns_method weblockunregistration(nsicomponentmanager *acompmgr, nsifile *apath, const char *registrylocation, const nsmodulecomponentinfo *info); the names of the functio...
...both functions are passed the component manager and the path to the component, including the opaque registrylocation.
... ns_decl_isupports ns_decl_nsiobserver }; weblock::weblock() { ns_init_isupports(); } weblock::~weblock() { } ns_impl_isupports1(weblock, nsiobserver); ns_imethodimp weblock::observe(nsisupports *asubject, const char *atopic, const prunichar *adata) { return ns_ok; } static ns_method weblockregistration(nsicomponentmanager *acompmgr, nsifile *apath, const char *registrylocation, const char *componenttype, const nsmodulecomponentinfo *info) { nsresult rv; nscomptr<nsiservicemanager> servman = do_queryinterface((nsisupports*)acompmgr, &rv); if (ns_failed(rv)) return rv; nscomptr<nsicategorymanager> catman; rv = servma...
...And 5 more matches
nsIURL
netwerk/base/public/nsiurl.idlscriptable this interface provides convenience methods that further break down the path portion of nsiuri.
...tp://host/directory/filebasename.fileextension#ref http://host/directory/filebasename.fileextension;param \ \ / \ ----------------------- \ | / \ filename / ---------------------------- | filepath you can get a nsiurl from an nsiuri, using the queryinterface() method: var myuri = components.classes["@mozilla.org/network/io-service;1"] .getservice(components.interfaces.nsiioservice) .newuri("http://developer.mozilla.org", null, null); try { var myurl = myuri.queryinterface(components.interfaces.nsiurl); } catch(e) { // the uri is not an url }...
...if the url denotes a path to a directory and not a file, for example http://host/foo/bar/, then the directory attribute accesses the complete /foo/bar/ portion, and the filename is the empty string.
...And 5 more matches
Plug-in Basics - Plugins
how gecko finds plug-ins when a gecko-based browser starts up, it checks certain directories for plug-ins, in this order: windows directory pointed to by moz_plugin_path environment variable.
... directories pointed to by hkey_current_user\software\mozillaplugins\*\path registry value, where * can be replaced by any name.
... directories pointed to by hkey_local_machine\software\mozillaplugins\*\path registry value, where * can be replaced by any name.
...And 5 more matches
Dominators view - Firefox Developer Tools
it looks something like this: the dominators view consists of two panels: the dominators tree panel shows you which nodes in the snapshot are retaining the most memory the retaining paths panel (new in firefox 47) shows the 5 shortest retaining paths for a single node.
... retaining paths panel the retaining paths panel is new in firefox 47.
... the retaining paths panel shows you, for a given node, the 5 shortest paths back from this node to a gc root.
...And 5 more matches
CanvasRenderingContext2D.isPointInStroke() - Web APIs
the canvasrenderingcontext2d.ispointinstroke() method of the canvas 2d api reports whether or not the specified point is inside the area contained by the stroking of a path.
... syntax ctx.ispointinstroke(x, y); ctx.ispointinstroke(path, x, y); parameters x the x-axis coordinate of the point to check.
... path a path2d path to check against.
...And 5 more matches
offset-anchor - CSS: Cascading Style Sheets
the offset-anchor css property specifies the point inside the box of an element travelling along an offset-path that is actually moving along the path.
...25% 75%; /* <length> values */ offset-anchor: 0 0; offset-anchor: 1cm 2cm; offset-anchor: 10ch 8em; /* edge offsets values */ offset-anchor: bottom 10px right 20px; offset-anchor: right 3em bottom 10px; /* global values */ offset-anchor: inherit; offset-anchor: initial; offset-anchor: unset; values auto offset-anchor is given the same value as the element's transform-origin, unless offset-path is none, in which case it takes its value from offset-position.
...each <div> is given the same offset-path (a horizontal line 200 pixels long) and animated to move along it.
...And 5 more matches
Writing forward-compatible websites - Developer guides
first, have a default code path that runs in unknown browsers and in the current and future versions of browsers you are testing with.
... then, if the default code path doesn't work in past versions of particular browsers and the breakage cannot be detected by sniffing for the absence of certain features your default code path uses, it's ok to add hacks that are targeted to old versions of particular browsers by sniffing for those old browser versions.
...for example, if you have tested that your default code path runs properly in firefox aurora but firefox beta and the latest release have a bug that make your default code path fail, it is ok to treat the firefox version number that is in aurora at the moment of testing as "current", and consider the beta version as a "past" version even though it hasn't been released to the general public yet.
...And 5 more matches
Performance fundamentals - Web Performance
resources have been loaded to paint an initial frame the second is when the application becomes interactive — for example, users are able to tap a button and the application responds the final event is full load — for example when all the user's albums have been listed in a music player the key to fast startup is to keep two things in mind: upp is all that matters, and there's a "critical path" to each user-perceived event above.
... the critical path is exactly and only the code that must run to produce the event.
...those work items are not on the critical path to painting the first frame.
...And 5 more matches
href - SVG: Scalable Vector Graphics
WebSVGAttributehref
fifteen elements are using this attribute: <a>, <animate>, <animatemotion>, <animatetransform>, <discard>, <feimage>, <image>, <lineargradient>, <mpath>, <pattern>, <radialgradient>, <script>, <set>, <textpath>, and <use> html, body, svg { height: 100%; } <svg viewbox="0 0 160 40" xmlns="http://www.w3.org/2000/svg"> <a href="https://developer.mozilla.org/"><text x="10" y="25">mdn web docs</text></a> </svg> in svg a for <a>, href defines the location of the referenced object, expressed as a url reference.
... value <url> default value none animatable yes mpath for <mpath>, href defines a url referring to the <path> element or basic shape which defines the motion path.
... value <url> default value none animatable no textpath for <textpath>, href defines a url referring to the <path> element or basic shape onto which the text will be rendered if no path attribute is provided.
...And 5 more matches
startOffset - SVG: Scalable Vector Graphics
the startoffset attribute defines an offset from the start of the path for the initial current text position along the path after converting the path to the <textpath> element's coordinate system.
... only one element is using this attribute: <textpath> html,body,svg { height:100% } <svg viewbox="0 0 220 100" xmlns="http://www.w3.org/2000/svg"> <path id="path1" fill="none" stroke="red" d="m10,90 q90,90 90,45 q90,10 50,10 q10,10 10,40 q10,70 45,70 q70,70 75,50" /> <path id="path2" fill="none" stroke="red" d="m130,90 q210,90 210,45 q210,10 170,10 q130,10 130,40 q130,70 165,70 q190,70 195,50" /> <text> <textpath href="#path1" startoffset="0"> quick brown fox jumps over the lazy dog.
... </textpath> </text> <text> <textpath href="#path2" startoffset="40"> quick brown fox jumps over the lazy dog.
...And 5 more matches
SVG 2 support in Mozilla - SVG: Scalable Vector Graphics
svgelement.style removed implementation status unknown svggraphicselement.gettransformtoelement() removed not removed yet svggraphicselement.getctm() on the outermost element implementation status unknown animval attribute alias of baseval implementation status unknown dataset attribute for svgelement implementation status unknown moved pathlength attribute and gettotallength() and getpointatlength() methods from svgpathelement to svggeometryelement implemented (bug 1239100) document structure change notes svgsvgelement.suspendredraw(), svgsvgelement.unsuspendredraw(), and svgsvgelement.unsuspendredrawall() deprecated turned into no-ops (bug 734079) externalresourcesrequired attribute r...
...(bug 1239218) lang attribute without namespace implemented (bug 721920) svgsvgelement.viewport removed never implemented xml:base attribute removed implementation status unknown reorder descendent elements of <switch> having systemlanguage attribute according to allowreorder smil attribute implementation status unknown made <tspan> and <textpath> graphics elements implementation status unknown allow x, y, width, and height on <symbol> implementation status unknown made <use> element shadow trees consistent with shadow dom spec implementation status unknown role mapping of <a> element depending on whether it is a valid link implementation status unknown aria state and property attributes ani...
...rveaspectratio attribute removed (bug 1280425) added non-scaling-size, non-rotation and fixed-position keywords for vector-effect property not implemented yet (bug 1318208) vector-effect has no effect within 3d rendering context implementation status unknown consider clip and overflow on svg document referenced by <image> implementation status unknown paths change notes b and b path commands implementation status unknown z and z path commands to add path coordinate data to previous command implementation status unknown not render <path>, <polygon> and <polyline> with no data implementation status unknown svgpathseg*, svganimatedpathdata and related methods removed from svgpathelement ...
...And 5 more matches
Basic shapes - SVG: Scalable Vector Graphics
nt" stroke-width="5"/> <line x1="10" x2="50" y1="110" y2="150" stroke="orange" stroke-width="5"/> <polyline points="60 110 65 120 70 115 75 130 80 125 85 140 90 135 95 150 100 145" stroke="orange" fill="transparent" stroke-width="5"/> <polygon points="50 160 55 180 70 180 60 190 65 205 50 195 35 205 40 190 30 180 45 180" stroke="green" fill="transparent" stroke-width="5"/> <path d="m20,230 q40,205 50,230 t90,230" fill="none" stroke="blue" stroke-width="5"/> </svg> note: the stroke, stroke-width, and fill attributes are explained later in the tutorial.
...for polygons though, the path automatically connects the last point with the first, creating a closed shape.
...the drawing then closes the path, so a final straight line would be drawn from (2,2) to (0,0).
...And 5 more matches
system - Archive of obsolete content
usage querying your environment using the system module you can access environment variables (such as path), find out which operating system your add-on is running on and get information about the host application (for example, firefox or fennec), such as its version.
... var system = require("sdk/system"); // path environment variable console.log(system.env.path); // operating system console.log("platform = " + system.platform); // processor architecture console.log("architecture = " + system.architecture); // compiler used to build host application console.log("compiler = " + system.compiler); // host application build identifier console.log("build = " + system.build); // host application uuid console.log("id = " + system.id); // host application name console.log("name = " + system.name); // host application version console.log("version = " + system.version); // host application vendor console.log("vendor = " + system.vendor); // host application profile directory console.log("profile directory = " + system.pathfor("profd")); quit the host application to ...
... pathfor(id) firefox enables you to get the path to certain "special" directories, such as the desktop or the profile directory.
...And 4 more matches
How to convert an overlay extension to restartless - Archive of obsolete content
mappings, so that you can access your files with custom paths such as: resource://myaddon/filename.ext chrome://myaddon/content/filename.ext step 2: no more resource:// uris for files internal to your bundle unfortunately, resource mappings in your chrome.manifest were not usable in restartless add-ons until mozilla finally fixed this bug in firefox 38, which looked bad, but only because mozilla is still using resource:// uris internally and in examples...
... step 2a: load your jsm from chrome:// now with that preface out of the way, this part is easy: drop support for firefox 3.x if you haven't already, move your jsm files to wherever you've got your chrome mapping to for your xul overlay and/or windows, import your files from that new chrome mapped path instead of the old resource one, and remove your "resource" line from your chrome.manifest file.
... a file:// uri to the install location, or .xpi file, is available in installpath property of the bootstrap data structure passed to the startup(), shutdown(), install(), and uninstall() functions in what will be your bootstrap.js file (see below).
...And 4 more matches
Running Tamarin acceptance tests - Archive of obsolete content
running the tamarin test suite requires the following steps: set the avm environment variable to the path of the avmplus executable (avmshell).
...set the builtinabc environment variable to the path of the generated/builtin.abc.
...set the shellabc environment variable to the path of the generated/shell_toplevel.abc.
...And 4 more matches
Running Tamarin performance tests - Archive of obsolete content
running the performance tests requires the following steps: set the avm environment variable to the path of the avmshell executable.
... set the builtinabc environment variable to the path of the builtin.abc.
... (in the tamarin-redux/generated directory) set the shellabc environment variable to the path of the shell_toplevel.abc.
...And 4 more matches
addDirectory - Archive of obsolete content
method of install object syntax public int adddirectory ( string xpisourcepath); public int adddirectory ( string registryname, string xpisourcepath, object localdirspec, string relativelocalpath); public int adddirectory ( string registryname, string version, string xpisourcepath, object localdirspec, string relativelocalpath); public int adddirectory ( string registryname, string version, string xpisourcepath, object localdirspec, string relativelocalpath, boolean forceupdate); public int adddirectory ( string registryname, installversion version, string xpisourcepath, object localdirspec, string relativelocalpath, boolean forceupdate); parameters...
... the adddirectory method has the following parameters: registryname the pathname in the client version registry for the root directory of the files that are to be installed.this parameter can be an absolute pathname (beginning with a /) or a relative pathname, (not beginning with a slash).
... an absolute pathname is used as specified.
...And 4 more matches
XML Templates - Archive of obsolete content
an xml document will be loaded and xpath expressions may be used to take portions of the xml document and generate content from these.
...just place an expr attribute on the query element containing an xpath expression returns the set of results to output.
... here is an example: <listbox datasources="people.xml" ref="*" querytype="xml"> <template> <query expr="person"/> <action> <listitem uri="?" label="?name"/> </action> </template> </listbox> the expr attribute is a very simple xpath expression which simply retrieves the person elements from within the datasource.
...And 4 more matches
Configuring Build Options
create a blank mozconfig file: echo "# my first mozilla config" > mozconfig if your mozconfig isn't in your source directory, you can also use the mozconfig environment variable to specify the path to your mozconfig.
... the path you specify must be an absolute path or else client.mk will not find it.
... setting the mozconfig path: export mozconfig=$home/mozilla/mozconfig-firefox calling the file .mozconfig (with a leading dot) is also supported, but this is not recommended because it may make the file harder to find.
...And 4 more matches
How Mozilla's build system works
topsrcdir = @top_srcdir@ srcdir = @srcdir@ vpath = @srcdir@ include $(depth)/config/autoconf.mk # ...
... the depth variable should be set to the relative path from your makefile.in to the top-level mozilla directory.
... vpath is a list of directories where make will look for prerequisites (i.e., source files).
...And 4 more matches
Old Thunderbird build
windows build prerequisites gnu/linux build prerequisites mac os x build prerequisites get the source note: on windows, you won't be able to build the thunderbird source code if it's under a directory with spaces in the path (e.g., don't use "documents and settings").
... note: parts of the build process also have problems when the source code is in a directory where the path is long (nested many levels deep).
... on linux, this can manifest as problems setting up the virtualenv for running tests (failure to install pip or virtualenv because of os access denied errors, where access is denied not because of permission problems, but because the paths being accessed have been truncated, and so do not exist).
...And 4 more matches
Simple Thunderbird build
009 17:02 26,467 mapiutil.h 02/06/2009 17:02 97,301 mapival.h 02/06/2009 17:02 9,334 mapiwin.h 02/06/2009 17:02 1,906 mapiwz.h 02/06/2009 17:02 18,277 mapix.h 02/06/2009 17:02 5,012 mspst.h get the source note: on windows, you won't be able to build the thunderbird source code if it's under a directory with spaces in the path (e.g., don't use "documents and settings").
... note: parts of the build process also have problems when the source code is in a directory where the path is long (nested many levels deep).
... on linux, this can manifest as problems setting up the virtualenv for running tests (failure to install pip or virtualenv because of os access denied errors, where access is denied not because of permission problems, but because the paths being accessed have been truncated, and so do not exist).
...And 4 more matches
Multiple Firefox profiles
type or paste in the path to firefox, followed by .app/contents/macos/firefox.
... if you have the path to your desired profile handy, enter a space character, followed by -profile followed by another space character, followed by the full path to the profile folder you wish to launch into.
... when the properties dialog box pops up, you should see a "target" text field that you can edit, and it should show the current file path.
...And 4 more matches
L10n Checks
you pass both the path to the ini file and the parent directory of the localizations as first arguments, followed by the locale codes of the locales you want to compare.
...you pass the path to the xpi file (optionally) followed by the locale codes of the locales you want to compare.
...you pass both paths to the xpi file and both paths to the locales inside the files, e.g.: check-l10n-completeness -i xpis en-us-langpack.xpi my-langpack.xpi jar:chrome/en-us.jar!locale/ jar:chrome/my.jar!locale/my/ jar/zip file (jar) mode l10n checks can compare two locales found in different jar files.
...And 4 more matches
Localizing with Mercurial
part of the command line hg install for windows involves making sure the hg executable is in the system's %path% variable (tortoisehg doesn't need this step).
... use the add_path.exe utility found in c:\mozilla-build\hg to do this.
... ps c:\users\your_id> cd c:\mozilla-build\hg ps c:\mozilla-build\hg> .\add_path.exe /result .
...And 4 more matches
NS_NewNativeLocalFile
« xpcom api reference summary the ns_newnativelocalfile function creates an instance of nsilocalfile that provides a platform independent representation of a file path.
... #include "nsxpcom.h" #include "nsilocalfile.h" nsresult ns_newnativelocalfile( const nsacstring& apath, prbool afollowlinks, nsilocalfile** aresult ); parameters apath [in] a string object that specifies an absolute filesystem path.
...this path does not need to reference an existing file.
...And 4 more matches
nsIURLParser
ring authority, in long authoritylen, out unsigned long usernamepos, out long usernamelen, out unsigned long passwordpos, out long passwordlen, out unsigned long hostnamepos, out long hostnamelen, out long port); void parsefilename(in string filename, in long filenamelen, out unsigned long basenamepos, out long basenamelen, out unsigned long extensionpos, out long extensionlen); void parsefilepath(in string filepath, in long filepathlen, out unsigned long directorypos, out long directorylen, out unsigned long basenamepos, out long basenamelen, out unsigned long extensionpos, out long extensionlen); void parsepath(in string path, in long pathlen, out unsigned long filepathpos, out long filepathlen, out unsigned long parampos, out long paramlen, out unsigned long querypos, out long queryle...
...n, out unsigned long refpos, out long reflen); void parseserverinfo(in string serverinfo, in long serverinfolen, out unsigned long hostnamepos, out long hostnamelen, out long port); void parseurl(in string spec, in long speclen, out unsigned long schemepos, out long schemelen, out unsigned long authoritypos, out long authoritylen, out unsigned long pathpos, out long pathlen); void parseuserinfo(in string userinfo, in long userinfolen, out unsigned long usernamepos, out long usernamelen, out unsigned long passwordpos, out long passwordlen); methods the string to parse in the methods may be given as a null terminated string, in which case the length argument should be -1.
...amelen passwordpos passwordlen hostnamepos hostnamelen port parsefilename() filename = <basename>.<extension> void parsefilename( in string filename, in long filenamelen, out unsigned long basenamepos, out long basenamelen, out unsigned long extensionpos, out long extensionlen ); parameters filename filenamelen basenamepos basenamelen extensionpos extensionlen parsefilepath() breaks the file path string up into: the directory portion, file base name, and file extension.
...And 4 more matches
CanvasRenderingContext2D.arcTo() - Web APIs
the canvasrenderingcontext2d.arcto() method of the canvas 2d api adds a circular arc to the current sub-path, using the given control points and radius.
... the arc is automatically connected to the path's latest point with a straight line, if necessary for the specified parameters.
... html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // tangential lines ctx.beginpath(); ctx.strokestyle = 'gray'; ctx.moveto(200, 20); ctx.lineto(200, 130); ctx.lineto(50, 20); ctx.stroke(); // arc ctx.beginpath(); ctx.strokestyle = 'black'; ctx.linewidth = 5; ctx.moveto(200, 20); ctx.arcto(200,130, 50,20, 40); ctx.stroke(); // start point ctx.beginpath(); ctx.fillstyle = 'blue'; ctx.arc(200, 20, 5, 0, 2 * math.pi); ctx.fill(); // control points ctx.beginpath(); ctx.fillstyle ...
...And 4 more matches
CanvasRenderingContext2D.clip() - Web APIs
the canvasrenderingcontext2d.clip() method of the canvas 2d api turns the current or given path into the current clipping region.
... note: be aware that the clipping region is only constructed from shapes added to the path.
...instead, you'd have to use rect() to add a rectangular shape to the path before calling clip().
...And 4 more matches
Basic animations - Web APIs
conds() + ((2 * math.pi) / 60000) * time.getmilliseconds()); ctx.translate(105, 0); ctx.fillrect(0, -12, 40, 24); // shadow ctx.drawimage(earth, -12, -12); // moon ctx.save(); ctx.rotate(((2 * math.pi) / 6) * time.getseconds() + ((2 * math.pi) / 6000) * time.getmilliseconds()); ctx.translate(0, 28.5); ctx.drawimage(moon, -3.5, -3.5); ctx.restore(); ctx.restore(); ctx.beginpath(); ctx.arc(150, 150, 105, 0, math.pi * 2, false); // earth orbit ctx.stroke(); ctx.drawimage(sun, 0, 0, 300, 300); window.requestanimationframe(draw); } init(); <canvas id="canvas" width="300" height="300"></canvas> screenshotlive sample an animated clock this example draws an animated clock, showing your current time.
...clock() { var now = new date(); var ctx = document.getelementbyid('canvas').getcontext('2d'); ctx.save(); ctx.clearrect(0, 0, 150, 150); ctx.translate(75, 75); ctx.scale(0.4, 0.4); ctx.rotate(-math.pi / 2); ctx.strokestyle = 'black'; ctx.fillstyle = 'white'; ctx.linewidth = 8; ctx.linecap = 'round'; // hour marks ctx.save(); for (var i = 0; i < 12; i++) { ctx.beginpath(); ctx.rotate(math.pi / 6); ctx.moveto(100, 0); ctx.lineto(120, 0); ctx.stroke(); } ctx.restore(); // minute marks ctx.save(); ctx.linewidth = 5; for (i = 0; i < 60; i++) { if (i % 5!= 0) { ctx.beginpath(); ctx.moveto(117, 0); ctx.lineto(120, 0); ctx.stroke(); } ctx.rotate(math.pi / 30); } ctx.restore(); var sec = now.getseco...
...hr - 12 : hr; ctx.fillstyle = 'black'; // write hours ctx.save(); ctx.rotate(hr * (math.pi / 6) + (math.pi / 360) * min + (math.pi / 21600) *sec); ctx.linewidth = 14; ctx.beginpath(); ctx.moveto(-20, 0); ctx.lineto(80, 0); ctx.stroke(); ctx.restore(); // write minutes ctx.save(); ctx.rotate((math.pi / 30) * min + (math.pi / 1800) * sec); ctx.linewidth = 10; ctx.beginpath(); ctx.moveto(-28, 0); ctx.lineto(112, 0); ctx.stroke(); ctx.restore(); // write seconds ctx.save(); ctx.rotate(sec * math.pi / 30); ctx.strokestyle = '#d40000'; ctx.fillstyle = '#d40000'; ctx.linewidth = 6; ctx.beginpath(); ctx.moveto(-30, 0); ctx.lineto(83, 0); ctx.stroke(); ctx.b...
...And 4 more matches
Document.cookie - Web APIs
WebAPIDocumentcookie
consider also that: any of the following cookie attribute values can optionally follow the key-value pair, specifying the cookie to set/update, and preceded by a semi-colon separator: ;path=path (e.g., '/', '/mydir') if not specified, defaults to the current path of the current document location.
... note: prior to gecko 6.0, paths with quotes were treated as if the quotes were part of the string, instead of as if they were delimiters surrounding the actual path string.
... __host- signals to the browser that in addition to the restriction to only use the cookie from a secure origin, the scope of the cookie is limited to a path attribute passed down by the server.
...And 4 more matches
Document.createNSResolver() - Web APIs
creates an xpathnsresolver which resolves namespaces with respect to the definitions in scope for a specified node.
... return value nsresolver is an xpathnsresolver object.
... notes adapts any dom node to resolve namespaces so that an xpath expression can be easily evaluated relative to the context of the node where it appeared within the document.
...And 4 more matches
FileSystemFlags.create - Web APIs
syntax filesystemflags.create = booleanvalue values the table below describes the result of each possible combination of these flags depending on whether or not the target file or directory path already exists.
... option values file/directory condition result create exclusive false n/a[1] path exists and matches the desired type (depending on whether the function called is getfile() or getdirectory() the successcallback is called with a filesystemfileentry if getfile() was called or a filesystemdirectoryentry if getdirectory() was called.
... false n/a[1] path exists but doesn't match the desired type the errorcallback is called with an appropriate error code (if the callback was provided).
...And 4 more matches
FileSystemFlags.exclusive - Web APIs
syntax filesystemflags.exclusive = booleanvalue values the table below describes the result of each possible combination of these flags depending on whether or not the target file or directory path already exists.
... option values file/directory condition result create exclusive false n/a[1] path exists and matches the desired type (depending on whether the function called is getfile() or getdirectory() the successcallback is called with a filesystemfileentry if getfile() was called or a filesystemdirectoryentry if getdirectory() was called.
... false n/a[1] path exists but doesn't match the desired type the errorcallback is called with an appropriate error code (if the callback was provided).
...And 4 more matches
FileSystemFlags - Web APIs
values and results the table below describes the result of each possible combination of these flags depending on whether or not the target file or directory path already exists.
... option values file/directory condition result create exclusive false n/a[1] path exists and matches the desired type (depending on whether the function called is getfile() or getdirectory() the successcallback is called with a filesystemfileentry if getfile() was called or a filesystemdirectoryentry if getdirectory() was called.
... false n/a[1] path exists but doesn't match the desired type the errorcallback is called with an appropriate error code (if the callback was provided).
...And 4 more matches
IDBObjectStore.createIndex() - Web APIs
syntax var myidbindex = objectstore.createindex(indexname, keypath); var myidbindex = objectstore.createindex(indexname, keypath, objectparameters); parameters indexname the name of the index to create.
... keypath the key path for the index to use.
... note that it is possible to create an index with an empty keypath, and also to pass in a sequence (array) as a keypath.
...And 4 more matches
Basic concepts - Web APIs
the object store can optionally have a key generator and a key path.
... if the object store has a key path, it is using in-line keys; otherwise, it is using out-of-line keys.
...the object store can derive the key from one of three sources: a key generator, a key path, or an explicitly specified value.
...And 4 more matches
Overview of CSS Shapes - CSS: Cascading Style Sheets
shapes from images an interesting way to generate your path is to use an image with an alpha channel — the text will then wrap around the non-transparent parts of the image.
...in the example below, if you change the threshold the path that the shape takes changes based on the level of opacity you have selected.
...change the margin to push the text further away from the path the shape would take by default.
...And 4 more matches
<basic-shape> - CSS: Cascading Style Sheets
the <basic-shape> css data type represents a shape used in the clip-path, shape-outside, and offset-path properties.
... path() path( [<fill-rule>,]?
... <string>) the optional <fill-rule> represents the filling rule used to determine the interior of the path.
...And 4 more matches
fill-rule - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following eight elements: <altglyph>, <path>, <polygon>, <polyline>, <text>, <textpath>, <tref>, and <tspan> html,body,svg { height:100% } <svg viewbox="-10 -10 220 120" xmlns="http://www.w3.org/2000/svg"> <!-- default value for fill-rule --> <polygon fill-rule="nonzero" stroke="red" points="50,0 21,90 98,35 2,35 79,90"/> <!-- the center of the shape has two path segments (shown by the red stroke) between it and infinity.
...starting with a count of zero, add one each time a path segment crosses the ray from left to right and subtract one each time a path segment crosses the ray from right to left.
... after counting the crossings, if the result is zero then the point is outside the path.
...And 4 more matches
xlink:href - SVG: Scalable Vector Graphics
22 elements are using this attribute: <a>, <altglyph>, <animate>, <animatecolor>, <animatemotion>, <animatetransform>, <color-profile>, <cursor>, <feimage>, <filter>, <font-face-uri>, <glyphref>, <image>, <lineargradient>, <mpath>, <pattern>, <radialgradient>, <script>, <set>, <textpath>, <tref>, and <use>} html, body, svg { height: 100%; } <svg viewbox="0 0 160 40" xmlns="http://www.w3.org/2000/svg"> <a xlink:href="https://developer.mozilla.org/"><text x="10" y="25">mdn web docs</text></a> </svg> a for <a>, xlink:href defines the location of the referenced object.
... value <iri> default value none animatable yes mpath for <mpath>, xlink:href defines the reference to the <path> element which defines the motion path.
... value <iri> default value none animatable no textpath for <textpath>, xlink:href defines a reference to the <path> element onto which the glyphs will be rendered.
...And 4 more matches
SVG animation with SMIL - SVG: Scalable Vector Graphics
smil allows you to: animate the numeric attributes of an element (x, y, ...) animate transform attributes (translation or rotation) animate color attributes follow a motion path this is done adding an svg element like <animate> inside the svg element to animate.
...t x="0" y="0" width="300" height="100" stroke="black" stroke-width="1" /> <rect x="0" y="50" width="15" height="34" fill="blue" stroke="black" stroke-width="1"> <animatetransform attributename="transform" begin="0s" dur="20s" type="rotate" from="0 60 60" to="360 100 60" repeatcount="indefinite" /> </rect> </svg> animation following a path the <animatemotion> element lets you animate an element position and rotation according to a path.
... the path is defined the same way as in <path>.
...And 4 more matches
Enhanced Extension Installation - Archive of obsolete content
any location specified in a guid-to-path registry key mapping, e.g.
... app-registry a registry-key based install location for items living at locations specified by a guid-to-path value set within the registry at a predefined location.
...the file is written simply as extension#=<absolute path to item> and is read until there are no more numbers.
...And 3 more matches
Connecting to Remote Content - Archive of obsolete content
there are a couple of tools you can use to process these documents more efficiently: using xpath xpath stands for xml path language, it uses a non-xml syntax that provides a flexible way of addressing (pointing to) different parts of an xml document.
... taken from the xpath page.
... you can use xpath to quickly access specific nodes in an xml or html document with a simple query mechanism.
...And 3 more matches
Signing an XPI - Archive of obsolete content
in my case it's c:\apps\nspr-4.6\ add path add the nss tools bin/ and lib/, and the nspr lib/ directories to the system path.
...certutil.exe) in the system directory (\windows\system32\) so ensure the new paths are first in the path search list.
... c:\> set path=c:\apps\nss-3.11.4\bin\;c:\apps\nss-3.11.4\lib\;c:\apps\nspr-4.6\lib\;%path% an easier way is to copy everything from your new directories c:\apps\nss-3.11.4\ and c:\apps\nspr-4.6\ including sub directories to the same directory - fx c:\apps\codesigning\ - and then run every command from that.
...And 3 more matches
Tamarin build documentation - Archive of obsolete content
if you have trouble starting the app try this: $ export android_swt=$android_build_top/android-sdk-mac_86/tools/lib/x86_64 where $android_build_top is the full path to your sdk/ndk top folder - get the openssl-0.9.8r.tar (openssl-1.0.0c.tar.gz won't work) openssl files from http://www.openssl.org (use the source link on the left).
... build tamarin release shell - get tamarin-redux - export the following variables into the environment $ export android_toolchain=<full path to your android sdk/ndk top folder> $ export android_ndk=$android_toolchain/android-ndk $ export android_ndk_bin=$android_ndk/toolchains/arm-linux-androideabi-4.4.3/prebuilt/darwin-x86/bin $ export android_sdk=$android_toolchain/android-sdk-mac_86 $ export path=$path:$android_sdk/platform-tools:$android_ndk_bin - example commands to build tamarin: $ hg clone http://hg.mozilla.org/tamarin-redux...
...nor does any other brand of make.) setup: if you normally work in a cygwin mounted place (eg /home/user/...) then you must cd around to the cygdrive path equivalent (eg /cygdrive/c/cygwin/home/user/).
...And 3 more matches
URIs and URLs - Archive of obsolete content
nssimpleuri contains setters and getters for the uri and the components of an uri: scheme and path (non-scheme).
...these schemes support a hierarchical naming system, where the hierarchy of the name is denoted by a "/" delimiter separating the components in the path.
...the spec consists of prepath and path.
...And 3 more matches
XPCOM Interfaces - Archive of obsolete content
initwithpath this method is used to initialize the path and filename for the nsilocalfile.
... the first parameter should be the file path, such as '/usr/local/mozilla'.
...we can call the method initwithpath() to indicate which file we mean.
...And 3 more matches
GetObject - Archive of obsolete content
syntax getobject([pathname] [, class]) parameters pathname full path and name of the file containing the object to retrieve.
... if pathname is omitted, class is required.
...for example: var cadobject; cadobject = getobject("c:\\cad\\schema.cad"); when this code is executed, the application associated with the specified pathname is started, and the object in the specified file is activated.
...And 3 more matches
Using the DOM File API in chrome code - Extensions
in fact, you get one bonus feature: you can create file objects specifying the path of the file on the user's computer.
...if you pass a path to the file constructor from unprivileged code (such as web content), an exception will be thrown.
... in bootstrap scope, this must be imported in like so: cu.importglobalproperties( [ "file" ] ) accessing a file by hard-coded pathname to reference a file by its path, you can simply use a string literal: var file = file.createfromfilename("path/to/some/file"); cross platform note: however using hard-coded paths raises cross platform issues since it uses a platform-dependent path separator (here "/").
...And 3 more matches
What is a URL? - Learn web development
let's see the most important parts using the following url: http://www.example.com:80/path/to/myfile.html?key1=value1&key2=value2#somewhereinthedocument http is the protocol.
... /path/to/myfile.html is the path to the resource on the web server.
... in the early days of the web, a path like this represented a physical file location on the web server.
...And 3 more matches
Dealing with files - Learn web development
file paths to make files talk to one another, you have to provide a file path between them — basically a route, so one file knows where another one is.
...to walk down the file structure from index.html to our image, the file path we'd need is images/your-image-filename.
... for example, our image is called firefox-icon.png, so the file path is images/firefox-icon.png.
...And 3 more matches
Chrome registration
locale packagename localename path/to/files skin packagename skinname path/to/files note: the characters @ # ; : ?
...if the above example had a packagename of camelcasepackage, you would get an error message similar to "no chrome registered for chrome://camelcasepackage/path/to/files".
...also, the path inside overridden files is relative to the overridden path, not the original one (this can be annoying and/or useful in css files, for example).
...And 3 more matches
IPDL Tutorial
the following ipdl code defines a very basic interaction of browser and plugin actors: async protocol pplugin { child: async init(nscstring pluginpath); async shutdown(); parent: async ready(); }; this code declares the pplugin protocol.
...each incoming message is a pure-virtual c++ method which must be implemented: class ppluginparent { public: bool sendinit(const nscstring& pluginpath) { // generated code to send an init() message } bool sendshutdown() { // generated code to send a shutdown() message } protected: /** * a subclass of ppluginparent must implement this method to handle the ready() message.
... */ bool recvready() = 0; }; class ppluginchild { protected: bool recvinit(const nscstring& pluginpath) = 0; bool recvshutdown() = 0; public: bool sendready() { // generated code to send a ready() message } }; these parent and child abstract classes take care of all the "protocol layer" concerns: serializing data, sending and receiving messages, and checking protocol safety.
...And 3 more matches
Addon
overview of required methods void iscompatiblewith(in string appversion, in string platformversion) void findupdates(in updatelistener listener, in integer reason, in string appversion, in string platformversion) overview of optional methods void uninstall() void canceluninstall() boolean hasresource(in string path) nsiuri getresourceuri(in string path) void getdatadirectory(in datadirectorycallback callback) required properties attribute type description appdisabled read only boolean true if this add-on cannot be used in the application based on version compatibility, dependencies, and blocklisting.
... only number reviewcount read only integer reviewurl read only string totaldownloads read only integer weeklydownloads read only integer dailyusers read only integer repositorystatus read only integer callbacks datadirectorycallback() a callback which is passed a directory path, and, when an error has occured, an error object.
... void datadirectorycallback( in string path, in error error ) parameters path a string representation of the addon's data directory.
...And 3 more matches
Using JavaScript code modules
the basic syntax of a resource url is as follows: resource://<alias>/<relative-path>/<file.js|jsm> the <alias> is an alias to a location, usually a physical location relative to the application or xul runtime.
... there are multiple pre-defined aliases set up by the xul runtime: app - alias to the location of the xul application gre - alias to the location of the xul runtime the <relative-path> can be multiple levels deep and is always relative to the location defined by the <alias>.
... the common relative path is "modules" and is used by xul runner and firefox.
...And 3 more matches
XPCOMUtils.jsm
ction definelazygetter(aobject, aname, alambda); function definelazymodulegetter(aobject, aname, aresource, [optional] asymbol); function definelazyservicegetter(aobject, aname, acontract, ainterfacename); function generatensgetfactory(componentsarray); function generateci(classinfo); function generateqi(interfaces); void importrelative(that, path, scope); generator itersimpleenumerator(enumerator, interface); generator iterstringenumerator(enumerator); attributes attribute type description categorymanager nsicategorymanager returns a reference to nsicategorymanager.
...} importrelative() imports a javascript code module given the calling javascript code module's global object (you should specify this) and a path relative to that module.
... this lets modules bundled in a package load one another without having to hard-code full paths.
...And 3 more matches
PR_GetLibraryName
constructs a full library path name.
... syntax #include <prlink.h> char* pr_getlibraryname ( const char *dir, const char *lib); parameters the function has these parameters: dir a null-terminated string representing the path name of the library, as returned by pr_getlibrarypath.
... returns if successful, returns a new character string containing a constructed path name.
...And 3 more matches
NSS tools : certutil
· oid (example): 1.2.3.4 · critical-flag: critical or not-critical · filename: full path to a file containing an encoded extension -f password-file specify a file that will automatically supply the password to include in a certificate or to access a certificate database.
...the path to the directory (-d) is required.
... to list all keys in the database, use the -k command option and the (required) -d argument to give the path to the directory.
...And 3 more matches
TPS Bookmark Lists
each key is the full path for the array of contents specified in the key's value.
...all bookmark paths must begin with one of the following: "menu": the normal bookmarks menu "toolbar": the bookmarks toolbar "tags": the tags folder "unfiled": the unfiled bookmarks folder "places": the places root folder ("menu", "toolbar", and "unfiled" are all children of this) sub-folders are preceded with forward slashes, so "menu/folder1" denotes that "folder1" is a sub-folder of "menu".
...the properties for this object include the uri, title, loadinsidebar, description, tags, keyword properties above, plus two additional properties: location: the full path of the folder that the bookmark should be moved to position: the title of the existing bookmark item, in the current folder, where this bookmark should be moved to (i.e., this bookmark would be inserted into the bookmark list at the position of the named bookmark, causing that bookmark to be positioned below the current one) example: { uri: "http://www.google.com", title: "google", loadins...
...And 3 more matches
NS_NewLocalFile
« xpcom api reference summary the ns_newlocalfile function creates an instance of nsilocalfile that provides a platform independent representation of a file path.
... #include "nsxpcom.h" #include "nsilocalfile.h" nsresult ns_newlocalfile( const nsastring& apath, prbool afollowlinks, nsilocalfile** aresult ); parameters apath [in] a utf-16 string object that specifies an absolute filesystem path.
... this path does not need to reference an existing file.
...And 3 more matches
nsICookieManager2
to create an object implementing this interface: components.utils.import("resource://gre/modules/services.jsm"); var cookieservice = services.cookies; method overview void add(in autf8string ahost, in autf8string apath, in acstring aname, in acstring avalue, in boolean aissecure, in boolean aishttponly, in boolean aissession, in print64 aexpiry); boolean cookieexists(in nsicookie2 acookie); unsigned long countcookiesfromhost(in autf8string ahost); boolean findmatchingcookie(in nsicookie2 acookie, out unsigned long acountfromhost); obsolete since gecko 1.9 nsisimpleenumerato...
... void add( in autf8string ahost, in autf8string apath, in acstring aname, in acstring avalue, in boolean aissecure, in boolean aishttponly, in boolean aissession, in print64 aexpiry ); parameters ahost the host or domain for which the cookie is set.
... apath the path within the domain for which the cookie is valid.
...And 3 more matches
nsIURI
to create an nsiuri object, you should use nsiioservice.newuri(), like this: function makeuri(aurl, aorigincharset, abaseuri) { var ioservice = components.classes["@mozilla.org/network/io-service;1"] .getservice(components.interfaces.nsiioservice); return ioservice.newuri(aurl, aorigincharset, abaseuri); } components of a uri prepath path scheme userpass host port ref ftp :// username@password @ hostname : portnumber /pathname?query=value #ref method overview nsiuri clone(); nsiuri cloneignoringref(); boolean equals(in nsiuri other); boolean equalsexceptref(in nsiuri other); autf8string resol...
...ve(in autf8string relativepath); boolean schemeis(in string scheme); attributes attribute type description asciihost acstring the uri host with an ascii compatible encoding.
... if this value is something other than utf-8 then the uri components (for example spec, prepath, username, and so on) are all fully url-escaped.
...And 3 more matches
Streams - Plugins
file mode: the browser saves the entire stream to a local file and passes the file path to the plug-in instance through the npp_streamasfile method.
...the browser saves stream data to a local file, and, when the stream is complete, delivers the path of the file through a call to npp_streamasfile.
... sending the stream in file mode if the stream is sent in file mode, the browser saves the entire stream to a local file and passes the full file path to the plug-in instance through the npp_streamasfile method.
...And 3 more matches
Advanced animations - Web APIs
var canvas = document.getelementbyid('canvas'); var ctx = canvas.getcontext('2d'); var ball = { x: 100, y: 100, radius: 25, color: 'blue', draw: function() { ctx.beginpath(); ctx.arc(this.x, this.y, this.radius, 0, math.pi * 2, true); ctx.closepath(); ctx.fillstyle = this.color; ctx.fill(); } }; ball.draw(); nothing special here, the ball is actually a simple circle and gets drawn with the help of the arc() method.
... var canvas = document.getelementbyid('canvas'); var ctx = canvas.getcontext('2d'); var raf; var ball = { x: 100, y: 100, vx: 5, vy: 2, radius: 25, color: 'blue', draw: function() { ctx.beginpath(); ctx.arc(this.x, this.y, this.radius, 0, math.pi * 2, true); ctx.closepath(); ctx.fillstyle = this.color; ctx.fill(); } }; function draw() { ctx.clearrect(0,0, canvas.width, canvas.height); ball.draw(); ball.x += ball.vx; ball.y += ball.vy; raf = window.requestanimationframe(draw); } canvas.addeventlistener('mouseover', function(e) { raf = window.requestanimation...
... <canvas id="canvas" style="border: 1px solid" width="600" height="300"></canvas> var canvas = document.getelementbyid('canvas'); var ctx = canvas.getcontext('2d'); var raf; var ball = { x: 100, y: 100, vx: 5, vy: 2, radius: 25, color: 'blue', draw: function() { ctx.beginpath(); ctx.arc(this.x, this.y, this.radius, 0, math.pi * 2, true); ctx.closepath(); ctx.fillstyle = this.color; ctx.fill(); } }; function draw() { ctx.clearrect(0,0, canvas.width, canvas.height); ball.draw(); ball.x += ball.vx; ball.y += ball.vy; if (ball.y + ball.vy > canvas.height || ball.y + ball.vy < 0) { ball.vy = -ball.vy; } if (ball.x + ball.vx > can...
...And 3 more matches
SVGGeometryElement - Web APIs
the svggeometryelement interface represents svg elements whose rendering is defined by geometry with an equivalent path, and which can be filled and stroked.
... this includes paths and the basic shapes.
...vggeometryelement" target="_top"><rect x="81" y="65" width="180" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="171" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">svggeometryelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} note: the pathlength property and the gettotallength() and getpointatlength() methods were originally part of the svgpathelement interface.
...And 3 more matches
offset-distance - CSS: Cascading Style Sheets
the offset-distance css property specifies a position along an offset-path for an element to be placed.
... syntax /* default value */ offset-distance: 0; /* the middle of the offset-path */ offset-distance: 50%; /* a fixed length positioned along the path */ offset-distance: 40px; <length-percentage> a length that specifies how far the element is along the path (defined with offset-path).
... 100% represents the total length of the path (when the offset-path is defined as a basic shape or path()).
...And 3 more matches
offset - CSS: Cascading Style Sheets
WebCSSoffset
the offset css shorthand property sets all the properties required for animating an element along a defined path.
... constituent properties this property is a shorthand for the following css properties: offset-anchor offset-distance offset-path offset-position offset-rotate syntax /* offset position */ offset: auto; offset: 10px 30px; offset: none; /* offset path */ offset: ray(45deg closest-side); offset: path('m 100 100 l 300 100 l 200 300 z'); offset: url(arc.svg); /* offset path with distance and/or rotation */ offset: url(circle.svg) 100px; offset: url(circle.svg) 40%; offset: url(circle.svg) 30deg; offset: url(circle.svg) 50px 20deg; /* including offset anchor */ offset: ray(45deg closest-side) / 40px 20px; offset: url(arc.svg) 2cm / 0.5cm 3cm; offset: url(arc.svg) 30deg / 50px 100px; formal definition initial valueas e...
...ach of the properties of the shorthand:offset-position: autooffset-path: noneoffset-distance: 0offset-anchor: autooffset-rotate: autoapplies totransformable elementsinheritednopercentagesas each of the properties of the shorthand:offset-position: refertosizeofcontainingblockoffset-distance: refer to the total path lengthoffset-anchor: relativetowidthandheightcomputed valueas each of the properties of the shorthand:offset-position: for <length> the absolute value, otherwise a percentageoffset-path: as specifiedoffset-distance: for <length> the absolute value, otherwise a percentageoffset-anchor: for <length> the absolute value, otherwise a percentageoffset-rotate: as specifiedanimation typeas each of the properties of the shorthand:offset-position: a positionoffset-path: as <angle>, <basic-shap...
...And 3 more matches
shape-outside - CSS: Cascading Style Sheets
syntax /* keyword values */ shape-outside: none; shape-outside: margin-box; shape-outside: content-box; shape-outside: border-box; shape-outside: padding-box; /* function values */ shape-outside: circle(); shape-outside: ellipse(); shape-outside: inset(10px 10px 10px 10px); shape-outside: polygon(10px 10px, 20px 20px, 30px 30px); shape-outside: path('m0.5,1 c0.5,1,0,0.7,0,0.3 a0.25,0.25,1,1,1,0.5,0.3 a0.25,0.25,1,1,1,1,0.3 c1,0.7,0.5,1,0.5,1 z'); /* <url> value */ shape-outside: url(image.png); /* <gradient> value */ shape-outside: linear-gradient(45deg, rgba(255, 255, 255, 0) 150px, red 150px); /* global values */ shape-outside: initial; shape-outside: inherit; shape-outside: unset; the shape-outside property is specified using the val...
... <basic-shape> the float area is computed based on the shape created by of one of inset(), circle(), ellipse(), polygon(), or as added in the level 2 specification path().
...tofloatsinheritednocomputed valueas defined for <basic-shape> (with <shape-box> following, if supplied), the <image> with its uri made absolute, otherwise as specified.animation typeyes, as specified for <basic-shape>, otherwise no formal syntax none | <shape-box> | <basic-shape> | <image>where <shape-box> = <box> | margin-box<basic-shape> = <inset()> | <circle()> | <ellipse()> | <polygon()> | <path()><image> = <url> | <image()> | <image-set()> | <element()> | <paint()> | <cross-fade()> | <gradient>where <box> = border-box | padding-box | content-box<inset()> = inset( <length-percentage>{1,4} [ round <'border-radius'> ]?
...And 3 more matches
<input type="file"> - HTML: Hypertext Markup Language
WebHTMLElementinputfile
value a domstring representing the path to the selected file.
...upported common attributes required additional attributes accept, capture, files, multiple idl attributes files and value dom interface htmlinputelement properties properties that apply only to elements of type file methods select() value a file input's value attribute contains a domstring that represents the path to the selected file(s).
... the string is prefixed with c:\fakepath\, to prevent malicious software from guessing the user's file structure.
...And 3 more matches
Set-Cookie - HTTP
eader type response header forbidden header name no forbidden response-header name yes syntax set-cookie: <cookie-name>=<cookie-value> set-cookie: <cookie-name>=<cookie-value>; expires=<date> set-cookie: <cookie-name>=<cookie-value>; max-age=<non-zero-digit> set-cookie: <cookie-name>=<cookie-value>; domain=<domain-value> set-cookie: <cookie-name>=<cookie-value>; path=<path-value> set-cookie: <cookie-name>=<cookie-value>; secure set-cookie: <cookie-name>=<cookie-value>; httponly set-cookie: <cookie-name>=<cookie-value>; samesite=strict set-cookie: <cookie-name>=<cookie-value>; samesite=lax set-cookie: <cookie-name>=<cookie-value>; samesite=none // multiple attributes are also possible, for example: set-cookie: <cookie-name>=<cookie-value>; domain=<domain-val...
... __host- prefix: cookies with names starting with __host- must be set with the secure flag, must be from a secure page (https), must not have a domain specified (and therefore aren't sent to subdomains) and the path must be /.
... path=<path-value> optional a path that must exist in the requested url, or the browser won't send the cookie header.
...And 3 more matches
Applying SVG effects to HTML content - SVG: Scalable Vector Graphics
there are 3 properties you can use: mask, clip-path, and filter.
...</p> <button onclick="toggleradius()">toggle radius</button> <svg height="0"> <clippath id="clipping-path-1" clippathunits="objectboundingbox"> <circle cx="0.25" cy="0.25" r="0.25" id="circle"/> <rect x="0.5" y="0.2" width="0.5" height="0.8"/> </clippath> </svg> .target { clip-path: url(#clipping-path-1); } p { width: 300px; border: 1px solid #000; display: inline-block; } this establishes a clipping area made of a circle and rectangle, assigns it the id #clippi...
...ng-path-1, then references it in the css.
...And 3 more matches
clip-rule - SVG: Scalable Vector Graphics
« svg attribute reference home the clip-rule attribute only applies to graphics elements that are contained within a <clippath> element.
... the clip-rule attribute basically works as the fill-rule attribute, except that it applies to <clippath> definitions.
... the following fragment of code will cause an evenodd clipping rule to be applied to the clipping path because clip-rule is specified on the <path> element that defines the clipping shape: <g> <clippath id="myclip"> <path d="..." clip-rule="evenodd" /> </clippath> <rect clip-path="url(#myclip)" ...
...And 3 more matches
<metadata> - SVG: Scalable Vector Graphics
WebSVGElementmetadata
et3"/> <connect:ends rdf:resource="#socket4"/> <connect:ends rdf:resource="#socket5"/> </rdf:description> </rdf:rdf> </metadata> <title>network</title> <desc>an example of a computer network based on a hub.</desc> <style> svg { /* default styles to be inherited */ fill: white; stroke: black; } text { fill: black; stroke: none; } path { fill: none; } </style> <!-- define symbols used in the svg --> <defs> <!-- hubplug symbol.
... used by hub symbol --> <symbol id="hubplug"> <desc>a 10baset/100basetx socket</desc> <path d="m0,10 h5 v-9 h12 v9 h5 v16 h-22 z"/> </symbol> <!-- hub symbol --> <symbol id="hub"> <desc>a typical 10baset/100basetx network hub</desc> <text x="0" y="15">hub</text> <g transform="translate(0 20)"> <rect width="253" height="84"/> <rect width="229" height="44" x="12" y="10"/> <circle fill="red" cx="227" cy="71" r="7" /> <!-- five groups each using the defined socket --> <g id="sock1et" transform="translate(25 20)"> <title>socket 1</title> <use xlink:href="#hubplug"/> </g> <g id="socket2" transform="translate(70 20)"> <title>socket 2</title> <use xlink:href="#...
... <title>socket 5</title> <use xlink:href="#hubplug"/> </g> </g> </symbol> <!-- computer symbol --> <symbol id="computer"> <desc>a common desktop pc</desc> <g id="monitorstand" transform="translate(40 121)"> <title>monitor stand</title> <desc>one of those cool swivelling monitor stands that sit under the monitor</desc> <path d="m0,0 s 10 10 40 12"/> <path d="m80,0 s 70 10 40 12"/> <path d="m0,20 l 10 10 s 40 12 70 10 l 80 20z"/> </g> <g id="monitor"> <title>monitor</title> <desc>a very fancy monitor</desc> <rect width="160" height="120"/> <rect fill="lightgrey" width="138" height="95" x="11" y="12"/> </g> <g id="processor" transform="translate(0 ...
...And 3 more matches
Clipping and masking - SVG: Scalable Vector Graphics
creating clips we create the above mentioned semicircle based on a circle element: <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <clippath id="cut-off-bottom"> <rect x="0" y="0" width="200" height="100" /> </clippath> </defs> <circle cx="100" cy="100" r="100" clip-path="url(#cut-off-bottom)" /> </svg> centered at (100,100) a circle with radius 100 is painted.
... the attribute clip-path references a <clippath> element with a single rect element.
...note, that the clippath element is usually placed in a defs section.
...And 3 more matches
An Overview - XSLT: Extensible Stylesheet Language Transformations
locations on the tree are specified using xpath, another w3c recommendation.
...to facilitate this, the w3c decided to use a separate language, xpath, which also has uses outside the xslt context.
... as its name implies, xpath defines a "path" the processor must take through the tree to arrive at the desired node.
...And 3 more matches
Module structure of the SDK - Archive of obsolete content
to use sdk modules, you can pass require() a complete path, starting with "sdk", to the module you want to use.
... for high-level modules this is just sdk/<module_name>, and for low-level modules it is sdk/<path_to_module>/<module_name>: // load the high-level "tabs" module var tabs = require("sdk/tabs"); // load the low-level "uuid" module var uuid = require('sdk/util/uuid'); the path to specify for a low-level module is given along with the module name itself in the title of the module's documentation page (for example, system/environment).
... to import a local module, specify a path relative to the importing module.
...And 2 more matches
The Essentials of an Extension - Archive of obsolete content
this is what a chrome uri looks like: chrome://packagename/section/path/to/file so, for instance, if i want to access the file browseroverlay.xul in the extension, the chrome uri would be chrome://xulschoolhello/content/browseroverlay.xul.
... if you have too many files in the content and you want to organize them in subdirectories, there's nothing you need to change in chrome.manifest, all you need is to add the right path after content in the uri.
...so, to access the dtd file in the hello world extension, the chrome path is chrome://xulschoolhello/locale/browseroverlay.dtd.
...And 2 more matches
Embedding Mozilla in a Java Application using JavaXPCOM - Archive of obsolete content
prerequisites java 1.4.2 or newer xulrunner 1.8.0.1 or newer embedding in order to embed mozilla in your java application, you will need to add the library mozillainterfaces.jar (located in xulrunner/sdk/lib folder) to your classpath.
...first, the java application must find a suitable xulrunner installation: mozilla mozilla = mozilla.getinstance(); greversionrange[] range = new greversionrange[1]; range[0] = new greversionrange("1.8.0", true, "1.9", false); // work with trunk nightly version 1.9a1 ^^ try { file grepath = mozilla.getgrepathwithproperties(range, null); locationprovider locprovider = new locationprovider(grepath); mozilla.initembedding(grepath, grepath, locprovider); } catch (filenotfoundexception e) { // this exception is thrown if gregrepathwithproperties cannot find a gre } catch (xpcomexception e) { // this exception is thrown if initembedding failed } locationprovider is a cl...
... if your code cannot find the gre and keeps throwing filenotfoundexceptions during the getgrepathwithproperties(...) call, check whether you already registered the gre on your system: gre registration the initembedding method kicks off the embedding process, allowing the java application to work with xpcom and mozilla.
...And 2 more matches
Learn XPI Installer Scripting by Example - Archive of obsolete content
// this function verifies disk space in kilobytes function verifydiskspace(dirpath, spacerequired) { var spaceavailable; // get the available disk space on the given path spaceavailable = filegetdiskspaceavailable(dirpath); // convert the available disk space into kilobytes spaceavailable = parseint(spaceavailable / 1024); // do the verification if(spaceavailable < spacerequired) { logcomment("insufficient disk space: " + dirpath); logcomme...
...nt(" required : " + spacerequired + " k"); logcomment(" available: " + spaceavailable + " k"); return(false); } return(true); } in the verifydiskspace block, filegetdiskspaceavailable is called with dirpath as its expected input.
... this input is defined in line 22, where getfolder() is used to assign a value to the communicatorfolder variable representing the "program" folder on the local system: var communicatorfolder = getfolder("program"); spaceavailable = filegetdiskspaceavailable(dirpath); spacerequired, the other expected input to the verifydiskspace function, is given as 17311 kilobytes on line 19.
...And 2 more matches
Debugging a XULRunner Application - Archive of obsolete content
xulrunner.exe /path/to/application.ini -console to output text to the console, use dump("my text here\n");.
...xulrunner.exe /path/to/application.ini -jsconsole by default the js console only shows errors from web content.
... to log js errors to disk, set the environment variable xre_console_log to the path to the filename.
...And 2 more matches
Gecko Compatibility Handbook - Archive of obsolete content
or use absolute paths in urls such as http://example.com/directory/...
...a relative url that refers to a path relative to the directory where a web page is located looks like path/file.html.
... relative urls that refer to a path relative to the web server's root directory look like /path/file.html.
...And 2 more matches
Move the ball - Game development
now, let's draw the ball — add the following inside your draw() function: ctx.beginpath(); ctx.arc(50, 50, 10, 0, math.pi*2); ctx.fillstyle = "#0095dd"; ctx.fill(); ctx.closepath(); try your updated code now — the ball should be repainted on every frame.
... 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 ball is moving.
...add the following two new lines indicated below to your draw() function: function draw() { ctx.beginpath(); ctx.arc(x, y, 10, 0, math.pi*2); ctx.fillstyle = "#0095dd"; ctx.fill(); ctx.closepath(); x += dx; y += dy; } save your code again and try it in your browser.
...And 2 more matches
Visual-js game engine - Game development
1) click create application 2) enter new application name in input prompt 3) select folder 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 ins...
...- important safari not working at the moment chrome , firefox , opera tutorial - pencil (animation path) : how to use pencil tool to create path object .
... path object can be saved intro localhost , you can collect object and put it direct source code .
...And 2 more matches
Command line crash course - Learn web development
if the directory you want to go to is nested deep, you need to know the path to get to it.
... this usually becomes easier as you get more familiar with the structure of your file system, but if you are not sure of the path you can usually figure it out with a combination of the ls command (see below), and by clicking around in your explorer/finder window to see where a directory is, relative to where you currently are.
... for example, if you wanted to go to a directory called src, located inside a directory called project, located on the desktop, you could type these three commands to get there from your home folder: cd desktop cd project cd src but this a waste of time — instead, you can type one command, with the different items in the path separated by forward slashes, just like you do when specifying paths to images or other assets in css, html, or javascript code: cd desktop/project/src note that including a leading slash on your path makes the path absolute, for example /users/your-user-name/desktop.
...And 2 more matches
Gmake vs. Pymake
path issues on windows on windows, you must take special care to be able to switch back and forth between gmake and pymake on the same object dir.
... gmake uses msys paths ("/c/dev/foo"), while pymake uses native windows paths ("c:\dev\foo").
... a relative configure produces paths that look like "../../foo" which can be understood by gmake and pymake.
...And 2 more matches
Simple Instantbird build
get the source note: on windows, you won't be able to build the instantbird source code if it's under a directory with spaces in the path (e.g., don't use "documents and settings").
... note: parts of the build process also have problems when the source code is in a directory where the path is long (nested many levels deep).
... on linux, this can manifest as problems setting up the virtualenv for running tests (failure to install pip or virtualenv because of os access denied errors, where access is denied not because of permission problems, but because the paths being accessed have been truncated, and so do not exist).
...And 2 more matches
DownloadLastDir.jsm
the downloadlastdir.jsm javascript code module lets you retrieve the path of the last directory into which a download occurred.
... using the downloadlastdir object to determine or set the path into which the last download occurred: // file is an nsifile var file = downloadlastdir.file; downloadlastdir.file = file; you can also set and retrieve this information on a site-by-site basis.
... to set the path, use setfile: // file is an nsifile downloadlastdir.setfile(uri, file); to retrieve the path in firefox 26 or later, use getfileasync: downloadlastdir.getfileasync(uri, function (file) { // file is an nsifile console.log(file); }); deprecated since gecko 26.0 to retrieve the path in firefox 25 or earlier, use getfile: // file is an nsifile var file = gdownloadlastdir.getfile(uri); console.log(file); private browsing mode when browsing normally, the browser uses the browser.download.lastdir preference to store the last download directory path.
...And 2 more matches
Downloads.jsm
target: string containing the path of the target file.
... alternatively, may be an nsifile, a downloadtarget object, or an object with the following properties: path: string containing the path of the target file.
... atarget string containing the path of the target file.
...And 2 more matches
FileUtils.jsm
to use it, you first need to import the code module into your javascript scope: components.utils.import("resource://gre/modules/fileutils.jsm"); the file constructor if you have a path to a file (or directory) you want to obtain an nsifile for, you can do so using the file constructor, like this: var f = new fileutils.file(mypath); method overview nsifile getfile(string key, array patharray, bool followlinks); nsifile getdir(string key, array patharray, bool shouldcreate, bool followlinks); nsifileoutputstream openfileoutputstream(nsifile file, int modeflags); nsifileoutputstream openatomicfileoutputstream(nsifile file, int modeflags); nsifileoutputs...
... nsifile getfile( string key, array patharray, bool followlinks ); parameters key the nsidirectoryservice key to start from (see getting special files for more info) patharray an array of path components to locate beneath the directory specified by key.
... nsifile getdir( string key, array patharray, bool shouldcreate, bool followlinks ); parameters key the nsidirectoryservice key to start from (see getting special files for more info) patharray an array of path components to locate beneath the directory specified by key.
...And 2 more matches
certutil
the path to the directory (-d) is required.
... to list all keys in the database, use the -k command option and the (required) -d argument to give the path to the directory.
...the path to the directory (-d) is required.
...And 2 more matches
Installing Pork
to tell mcpp which gcc installation to integrate itself with, place the selected gcc bin dir as the first element of your path: path=/bindir/of/my/gcc:$path if you want to use a gcc that has binaries named something other than "gcc" and "g++", or you use "ccache" for you main gcc installation and want mcpp to override a separate installation, you need to pass the options "cc=gccxxx cxx=g++xxx" to "./configure".
... but don't give absolute paths there: mcpp won't build right.
... instead, make sure the commands will be found on the path, as above.
...And 2 more matches
Thread Sanitizer
adjusting the build configuration create the build configuration file .mozconfig with the following content in your mozilla-central directory: mk_add_options moz_objdir=@topsrcdir@/objdir-ff-tsan mk_add_options moz_make_flags=-j12 # enable llvm specific code and build workarounds ac_add_options --enable-thread-sanitizer # if clang is already in your $path, then these can simply be: # export cc=clang # export cxx=clang++ export cc="/path/to/clang" export cxx="/path/to/clang++" # llvm-symbolizer displays much more complete backtraces when data races are detected.
... # 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.
...before using it, you must of course adjust the path name for llvm_root to match your setup.
...And 2 more matches
XPCOM glue
MozillaTechXPCOMGlue
this is typically done using gre_getgrepathwithproperties.
... linking strategy: dependent glue standalone glue compiler flags: cross-platform #include "xpcom-config.h" #include "xpcom-config.h" #define xpcom_glue windows /fi "xpcom-config.h" linux -include "xpcom-config.h" linker flags: windows for older versions of the firefox sdk: -libpath:c:/path/to/sdk/lib xpcomglue_s.lib xpcom.lib nspr4.lib for recent versions of the firefox sdk (at least version 42, but possibly earlier versions as well): -libpath:c/path/to/sdk/lib xpcomglue_s.lib xul.lib nss3.lib mozcrt.lib -libpath:c:/path/to/sdk/lib xpcomglue.lib mac -l/path/to/sdk/lib -l/path/to/sdk/bin -wl,-executable-path,/path/to/sdk/bin -lxpcomglue_s -l...
...xpcom -lnspr4 when building against a xulrunner derived sdk, use: -l/path/to/sdk/lib -l/path/to/xulrunner-bin -wl,-executable_path,/path/to/xulrunner-bin -lxpcomglue_s -lxpcom -lnspr4 where 'xulrunner-bin' is either /library/frameworks/xul.framework/versions/current/ or /path/to/xulrunner-build/[platform]/dist/bin -l/path/to/sdk/lib -lxpcomglue linux -l/path/to/sdk/lib -l/path/to/sdk/bin -wl,-rpath-link,/path/to/sdk/bin -lxpcomglue_s -lxpcom -lnspr4 write it exactly as stated, see notes.
...And 2 more matches
nsIToolkitProfileService
warning: this service is synchronous so it is recommended that you use os.file to find the profile directory via os.constants.path.profiledir.
... method overview nsitoolkitprofile createprofile(in nsilocalfile arootdir, in autf8string aname); void flush(); nsitoolkitprofile getprofilebyname(in autf8string aname); nsiprofilelock lockprofilepath(in nsilocalfile adirectory, in nsilocalfile atempdirectory); attributes attribute type description profilecount unsigned long the number of user profiles currently in existence.
... lockprofilepath() locks an arbitrary path as a profile.
...And 2 more matches
Using the Mozilla symbol server
the debugger will not be able to show you the content of all variables and the execution path can seem strange because of inlining, tail calls, and other compiler optimizations.
...you cannot visit this url directly: you must add it to the symbol path of your debugging tool.
... using the symbol server in microsoft visual c++ using the symbol server in windbg the windbg symbol path is configured with a string value delimited with asterisk characters.
...And 2 more matches
Virtualenv
import paths).
... > ls tmp/bin/ activate activate.fish easy_install pip python activate.csh activate_this.py easy_install-2.7 pip-2.7 using this python binary, or these scripts (which point to this python binary), you will correctly install python packages in the lib/python2.x/site-packages directory and they will be appropriately added to your import path (sys.path) via lib/python2.x/site.py.
... in order to get the virtualenv's python binary on your path, you should source the bin/activate script on unix or run activate.bat on windows.
...And 2 more matches
Migrating from Firebug - Firefox Developer Tools
copy html and related information firebug's html panel allows to copy the inner and outer html of an element as well as the css and xpath to it via the context menu of an element.
... the page inspector provides the same functionality except copying xpaths.
... search for elements via css selectors or xpaths firebug allows to search for elements within the html panel via css selectors or xpaths.
...And 2 more matches
Examine and edit HTML - Firefox Developer Tools
there are three types of searches that are performed automatically depending on what you enter, a full text search, a css selector search, and an xpath search.
...that allows you to find css selectors and xpath expressions occurring within the text.
... xpath search it is also possible to search via xpaths.
...And 2 more matches
CanvasRenderingContext2D.drawFocusIfNeeded() - Web APIs
the canvasrenderingcontext2d.drawfocusifneeded() method of the canvas 2d api draws a focus ring around the current or given path, if the specified element is focused.
... syntax void ctx.drawfocusifneeded(element); void ctx.drawfocusifneeded(path, element); parameters element the element to check whether it is focused or not.
... path a path2d path to use.
...And 2 more matches
CanvasRenderingContext2D.fill() - Web APIs
the canvasrenderingcontext2d.fill() method of the canvas 2d api fills the current or given path with the current fillstyle.
... syntax void ctx.fill([fillrule]); void ctx.fill(path [, fillrule]); parameters fillrule the algorithm by which to determine if a point is inside or outside the filling region.
... path a path2d path to fill.
...And 2 more matches
CanvasRenderingContext2D.rect() - Web APIs
the canvasrenderingcontext2d.rect() method of the canvas 2d api adds a rectangle to the current path.
... like other methods that modify the current path, this method does not directly render anything.
... syntax void ctx.rect(x, y, width, height); the rect() method creates a rectangular path whose starting point is at (x, y) and whose size is specified by width and height.
...And 2 more matches
Hit regions and accessibility - Web APIs
you can add a hit region to your path and check for the mouseevent.region property to test if your mouse is hitting your region, for example.
... <canvas id="canvas"></canvas> <script> var canvas = document.getelementbyid('canvas'); var ctx = canvas.getcontext('2d'); ctx.beginpath(); ctx.arc(70, 80, 10, 0, 2 * math.pi, false); ctx.fill(); ctx.addhitregion({id: 'circle'}); canvas.addeventlistener('mousemove', function(event) { if (event.region) { alert('hit region: ' + event.region); } }); </script> the addhitregion() method also takes a control option to route events to an element (that is a descendant of the canvas): ctx.addhitregion({control: element}); this can be useful for routing to <input> elements, for example.
... canvasrenderingcontext2d.drawfocusifneeded() if a given element is focused, this method draws a focus ring around the current path.
...And 2 more matches
Document - Web APIs
WebAPIDocument
the document interface is extended with the xpathevaluator interface: document.createexpression() compiles an xpathexpression which can then be used for (repeated) evaluations.
... document.creatensresolver() creates an xpathnsresolver object.
... document.evaluate() evaluates an xpath expression.
...And 2 more matches
Document Object Model (DOM) - Web APIs
svg interfaces svg element interfaces svgaelement svgaltglyphelement svgaltglyphdefelement svgaltglyphitemelement svganimationelement svganimateelement svganimatecolorelement svganimatemotionelement svganimatetransformelement svgcircleelement svgclippathelement svgcolorprofileelement svgcomponenttransferfunctionelement svgcursorelement svgdefselement svgdescelement svgelement svgellipseelement svgfeblendelement svgfecolormatrixelement svgfecomponenttransferelement svgfecompositeelement svgfeconvolvematrixelement svgfediffuselightingelement svgfedisplacementmapelement svgfedistantlightelement svgfedropshadowelement svgfefloodele...
...eelement svgfeturbulenceelement svgfilterelement svgfilterprimitivestandardattributes svgfontelement svgfontfaceelement svgfontfaceformatelement svgfontfacenameelement svgfontfacesrcelement svgfontfaceurielement svgforeignobjectelement svggelement svggeometryelement svgglyphelement svgglyphrefelement svggradientelement svggraphicselement svghatchelement svghatchpathelement svghkernelement svgimageelement svglineargradientelement svglineelement svgmarkerelement svgmaskelement svgmeshelement svgmeshgradientelement svgmeshpatchelement svgmeshrowelement svgmetadataelement svgmissingglyphelement svgmpathelement svgpathelement svgpatternelement svgpolylineelement svgpolygonelement svgradialgradientelement svgrectelement svgscrip...
...telement svgsetelement svgsolidcolorelement svgstopelement svgstyleelement svgsvgelement svgswitchelement svgsymbolelement svgtextcontentelement svgtextelement svgtextpathelement svgtextpositioningelement svgtitleelement svgtrefelement svgtspanelement svguseelement svgunknownelement svgviewelement svgvkernelement svg data type interfaces here are the dom apis for data types used in the definitions of svg properties and attributes.
...And 2 more matches
Event.composed - Web APIs
WebAPIEventcomposed
you can determine the path the event will follow through the shadow root to the dom root by calling composedpath().
... examples in our composed-composed-path example (see it live), we define two trivial custom elements, <open-shadow> and <closed-shadow>, both of which take the contents of their text attribute and insert them into the element's shadow dom as the text content of a <p> element.
... .appendchild(pelem); } }); we then insert one of each element into our page: <open-shadow text="i have an open shadow root"></open-shadow> <closed-shadow text="i have a closed shadow root"></closed-shadow> then include a click event listener on the <html> element: document.queryselector('html').addeventlistener('click',function(e) { console.log(e.composed); console.log(e.composedpath()); }); when you click on the <open-shadow> element and then the <closed-shadow> element, you'll notice two things.
...And 2 more matches
FileSystemDirectoryEntry - Web APIs
if you try creating a directory using a full path that includes parent directories that do not exist yet, an error is returned.
... so create the hierarchy by recursively adding a new path after creating the parent directory.
... function onfs(fs){ fs.root.getdirectory('documents', {create:true}, function(directoryentry){ //directoryentry.isfile === false //directoryentry.isdirectory === true //directoryentry.name === 'documents' //directoryentry.fullpath === '/documents' }, onerror); } // opening a file system with temporary storage window.requestfilesystem(temporary, 1024*1024 /*1mb*/, onfs, onerror); properties this interface has no properties of its own, but inherits properties from its parent interface, filesystementry.
...And 2 more matches
FileSystemEntrySync - Web APIs
it includes methods for working with files—including copying, moving, removing, and reading files—as well as information about the file it points to—including the file name and its path from the root to the entry.
... fullpath readonly domstring the full absolute path from the root to the entry.
... an absolute path is a relative path from the root directory, prepended with a '/'.
...And 2 more matches
IDBDatabase.createObjectStore() - Web APIs
it includes the following properties: attribute description keypath the key path to be used by the new object store.
... if empty or not specified, the object store is created without a key path and uses out-of-line keys.
... you can also pass in an array as a keypath.
...And 2 more matches
Web APIs
WebAPI
s_element_index_uint oes_fbo_render_mipmap oes_standard_derivatives oes_texture_float oes_texture_float_linear oes_texture_half_float oes_texture_half_float_linear oes_vertex_array_object ovr_multiview2 offlineaudiocompletionevent offlineaudiocontext offscreencanvas orientationsensor oscillatornode overconstrainederror p pagetransitionevent paintworklet pannernode parentnode passwordcredential path2d payererrors paymentaddress paymentcurrencyamount paymentdetailsbase paymentdetailsupdate paymentitem paymentmethodchangeevent paymentrequest paymentrequestevent paymentrequestupdateevent paymentresponse paymentvalidationerrors pbkdf2params performance performanceentry performanceeventtiming performanceframetiming performancelongtasktiming performancemark performancemeasure performancena...
...nimatecolorelement svganimateelement svganimatemotionelement svganimatetransformelement svganimatedangle svganimatedboolean svganimatedenumeration svganimatedinteger svganimatedlength svganimatedlengthlist svganimatednumber svganimatednumberlist svganimatedpoints svganimatedpreserveaspectratio svganimatedrect svganimatedstring svganimatedtransformlist svganimationelement svgcircleelement svgclippathelement svgcolorprofileelement svgcomponenttransferfunctionelement svgcursorelement svgdefselement svgdescelement svgelement svgellipseelement svgevent svgexternalresourcesrequired svgfeblendelement svgfecolormatrixelement svgfecomponenttransferelement svgfecompositeelement svgfeconvolvematrixelement svgfediffuselightingelement svgfedisplacementmapelement svgfedistantlightelement svgfedropshad...
...primitivestandardattributes svgfontelement svgfontfaceelement svgfontfaceformatelement svgfontfacenameelement svgfontfacesrcelement svgfontfaceurielement svgforeignobjectelement svggelement svggeometryelement svgglyphelement svgglyphrefelement svggradientelement svggraphicselement svghkernelement svgimageelement svglength svglengthlist svglineelement svglineargradientelement svgmpathelement svgmaskelement svgmatrix svgmeshelement svgmetadataelement svgmissingglyphelement svgnumber svgnumberlist svgpathelement svgpatternelement svgpoint svgpolygonelement svgpolylineelement svgpreserveaspectratio svgradialgradientelement svgrect svgrectelement svgrenderingintent svgsvgelement svgscriptelement svgsetelement svgsolidcolorelement svgstopelement svgstringlist svgstylable ...
...And 2 more matches
Cubic Bezier Generator - CSS: Cascading Style Sheets
vas element using the dom var canvas = document.getelementbyid('bezier'); // make sure we don't execute when canvas isn't supported if (canvas.getcontext) { // use getcontext to use the canvas for drawing var ctx = canvas.getcontext('2d'); // clear canvas ctx.clearrect(0, 0, canvas.width, canvas.height); // draw the rulers ctx.beginpath(); ctx.strokestyle = "black"; // draw the y axis ctx.moveto(cx(0), cy(0)); ctx.lineto(cx(1), cy(0)); ctx.textalign = "right"; for (var i = 0.1; i <= 1; i = i + 0.1) { ctx.moveto(-basic_scale_size + cx(0), ly(i)); if ((i == 0.5) || (i > 0.9)) { ctx.moveto(-2 * basic_scale_size + cx(0), ly(i)); ...
... ctx.filltext(math.round(i * 10) / 10, -3 * basic_scale_size + cx(0), cy(i) + 4); // limitation the constant 4 should be font size dependant } ctx.lineto(cx(0), ly(i)); } ctx.stroke(); ctx.closepath(); ctx.beginpath(); // draw the y axis label ctx.save(); ctx.rotate(-math.pi / 2); ctx.textalign = "left"; ctx.filltext("output (value ratio)", -cy(0), -3 * basic_scale_size + cx(0)); ctx.restore(); // draw the x axis ctx.moveto(cx(0), cy(0)); ctx.lineto(cx(0), cy(1)); ctx.textalign = "center"; for (i = 0.1; i <= 1; i = i + 0.1) { ctx.moveto(lx(i), basic_scale_size + cy(0)); if ((i == 0.5) || (i > 0.9)) { ...
... // limitation the constant 4 should be dependant of the font size } ctx.lineto(lx(i), cy(0)); } // draw the x axis label ctx.textalign = "left"; ctx.filltext("input (time duration ratio)", cx(0), 4 * basic_scale_size + cy(0)); // limitation the constant 4 should be dependant of the font size ctx.stroke(); ctx.closepath(); // draw the bézier curve ctx.beginpath(); ctx.moveto(cx(0), cy(0)); ctx.strokestyle = 'blue'; ctx.beziercurveto(cx(x1), cy(y1), cx(x2), cy(y2), cx(1), cy(1)); ctx.stroke(); ctx.closepath(); // draw the p2 point (with a line to p0) ctx.beginpath(); ctx.strokestyle = 'red'; ctx.moveto(cx(x1), cy(y1)); ...
...And 2 more matches
Using HTTP cookies - HTTP
WebHTTPCookies
additional restrictions to a specific domain and path can be set, limiting where the cookie is sent.
... here is an example: set-cookie: id=a3fwa; expires=wed, 21 oct 2021 07:28:00 gmt; secure; httponly define where cookies are sent the domain and path attributes define the scope of the cookie: what urls the cookies should be sent to.
... path attribute the path attribute indicates a url path that must exist in the requested url in order to send the cookie header.
...And 2 more matches
HTTP Index - HTTP
WebHTTPIndex
8 identifying resources on the web domain, http, path, scheme, syntax, uri, url, url syntax, web, fragment, port, query, resources the target of an http request is called a "resource", whose nature isn't defined further; it can be a document, a photo, or anything else.
... 153 forwarded http, http header, reference, request header, header the forwarded header contains information from the client-facing side of proxy servers that is altered or lost when a proxy is involved in the path of the request.
...it doesn't include any path information, but only the server name.
...And 2 more matches
eval() - JavaScript
using eval() this would look like: var obj = {a: {b: {c: 0}}}; var proppath = getproppath(); // returns e.g.
... "a.b.c" eval( 'var result = obj.' + proppath ); avoiding eval() here could be done by splitting the property path and looping through the different properties: function getdescendantprop(obj, desc) { var arr = desc.split('.'); while (arr.length) { obj = obj[arr.shift()]; } return obj; } var obj = {a: {b: {c: 0}}}; var proppath = getproppath(); // returns e.g.
... "a.b.c" var result = getdescendantprop(obj, proppath); setting a property that way works similarly: function setdescendantprop(obj, desc, value) { var arr = desc.split('.'); while (arr.length > 1) { obj = obj[arr.shift()]; } return obj[arr[0]] = value; } var obj = {a: {b: {c: 0}}}; var proppath = getproppath(); // returns e.g.
...And 2 more matches
Populating the page: how browsers work - Web Performance
building the dom tree we describe five steps in the critical rendering path.
... building the cssom the second step in the critical rendering path is processing css and building the cssom tree.
... style the third step in the critical rendering path is combining the dom and cssom into a render tree.the computed style tree, or render tree, construction starts with the root of the dom tree, traversing each visible node.
...And 2 more matches
display - SVG: Scalable Vector Graphics
WebSVGAttributedisplay
it has implications for the <tspan>, <tref>, and <altglyph> elements, event processing, for bounding box calculations and for calculation of clipping paths: if display is set to none on a <tspan>, <tref>, or <altglyph> element, then the text string is ignored for the purposes of text layout.
... the geometry of a graphics element with display set to none is not included in bounding box and clipping paths calculations.
...for example, setting it to none on a <path> element will prevent that element from getting rendered directly onto the canvas, but the <path> element can still be referenced by a <textpath> element; furthermore, its geometry will be used in text-on-a-path processing even if the <path> has a display value of none.
...And 2 more matches
requiredFeatures - SVG: Scalable Vector Graphics
twentynine elements are using this attribute: <a>, <altglyph>, <animate>, <animatecolor>, <animatemotion>, <animatetransform>, <circle>, <clippath>, <cursor>, <defs>, <ellipse>, <foreignobject>, <g>, <image>, <line>, <mask>, <path>, <pattern>, <polygon>, <polyline>, <rect>, <set>, <svg>, <switch>, <text>, <textpath>, <tref>, <tspan>, <use> html, body, svg { height: 100%; } text { fill: white; } <svg viewbox="0 0 250 45" xmlns="http://www.w3.org/2000/svg"> <g> <rect fill="forestgreen" x="10" y="10" height="25" width="230" />...
... http://www.w3.org/tr/svg11/feature#shape the browser supports the <rect>, <circle>, <line>, <polyline>, <polygon>, <ellipse> and <path> elements.
... http://www.w3.org/tr/svg11/feature#text the browser supports the <text>, <tspan>, <tref>, <textpath>, <altglyph>, <altglyphdef>, <altglyphitem> and <glyphref> elements.
...And 2 more matches
rotate - SVG: Scalable Vector Graphics
WebSVGAttributerotate
the rotate attribute specifies how the animated element rotates as it travels along a path specified in an <animatemotion> element.
... usage notes value auto | auto-reverse | <number> default value 0 animatable no the auto and auto-reverse values allow the animated element's rotation to change dynamically as it travels along the path.
... examples svg <svg width="400" height="120" viewbox="0 0 480 120" xmlns="http://www.w3.org/2000/svg"> <!-- draw the outline of the motion path in grey --> <path d="m10,110 a120,120 -45 0,1 110 10 a120,120 -45 0,1 10,110" stroke="lightgrey" stroke-width="2" fill="none" id="themotionpath"/> <!-- red arrow which will not rotate --> <path fill="red" d="m-5,-5 l10,0 -5,5 0,0 z"> <!-- define the motion path animation --> <animatemotion dur="6s" repeatcount="indefinite" rotate="0"> <mpath href="#themotionpath"...
...And 2 more matches
<animateMotion> - SVG: Scalable Vector Graphics
the svg <animatemotion> element let define how an element moves along a motion path.
... note: to reuse an existing path, it will be necessary to use an <mpath> element inside the <animatemotion> element instead of the path attribute.
... html,body,svg { height:100%; margin: 0; padding: 0; display:block; } <svg viewbox="0 0 200 100" xmlns="http://www.w3.org/2000/svg"> <path fill="none" stroke="lightgrey" d="m20,50 c20,-50 180,150 180,50 c180-50 20,150 20,50 z" /> <circle r="5" fill="red"> <animatemotion dur="10s" repeatcount="indefinite" path="m20,50 c20,-50 180,150 180,50 c180-50 20,150 20,50 z" /> </circle> </svg> usage context categoriesanimation elementpermitted contentany number of the following elements, in any order:descriptive elements<mpath> attributes keypoints this attribute indicate, in the range [0,1], how far is the object along the path for each keytimes associated values.
...And 2 more matches
SVG 1.1 Support in Firefox - SVG: Scalable Vector Graphics
shape module path implemented.
... svgpathelement interface unimplemented attributes: normalizedpathseglist, animatednormalizedpathseglist rect implemented.
... textpath implemented.
...And 2 more matches
Modules - Archive of obsolete content
for instance, the option paths is used to specify a list of paths to be used by the loader to resolve relative urls: let loader = loader({ paths: ["./": "http://www.foo.com/"] }); commonjs also defines the notion of a main module.
...instead, the main module is loaded using a special function, called main: const { loader, main } = require('toolkit/loader'); let loader = loader({ paths: ["./": "http://www.foo.com/"] }); main(loader, "./main.js"); secondly, the main module is defined as a property on require.
...the resolved id is then further resolved using the paths array: const { loader, main } = require('toolkit/loader'); let loader = loader({ paths: ["./": "http://www.foo.com/"], resolve: function (id, requirer) { // your code here return id; } }); main(loader, "./main.js"); cuddlefish uses a custom resolve function to implement a form of access control: modules can only require modules for which they have been explicitly g...
...cuddlefish uses this option to expose the components object as a module called chrome, in a way similar to the code here below: const { classes: cc, constructor: cc, interfaces: ci, utils: cu, results: cr, manager: cm } = components; let loader = loader({ paths: ["./": "http://www.foo.com/"], resolve: function (id, requirer) { // your logic here return id; }, modules: { 'chrome': { components: components, cc: cc, cc: bind(cc, components), ci: ci, cu: cu, cr: cr, cm: cm } } }); all accesses to the chrome module go through ...
xml:base support in old browsers - Archive of obsolete content
'scheme' per http://www.ietf.org/rfc/rfc2396.txt' xmlbase = getxmlbase (thisitem); if (!xmlbase.match(/\/$/) && !xlink.match(/\/$/)) { // if no preceding slash on xlink or trailing slash on xml:base, add one in between xmlbase += '/'; } else if (xmlbase.match(/\/$/) && xlink.match(/\/$/)) { xmlbase = xmlbase.substring(0, xmlbase.length-2); // strip off last slash to join with xlink path with slash } // alert(xmlbase + '::' + xlink); } var link = xmlbase + xlink; if (!link.match(scheme)) { // if there is no domain, we'll need to use the current domain var loc = window.location; if (link.indexof('/') === 0 ) { // if link is an absolute url, it should be from the host only link = loc.protocol + '//' + loc.host + link; } else { // if link is r...
...elative, it should be from full path, minus the file var dirpath = loc.pathname.substring(0, loc.pathname.lastindexof('/')-1); if (link.lastindexof('/') !== link.length-1) { link += '/'; } link = loc.protocol + '//' + loc.host + dirpath + link; } } return link; } function getxmlbase (thisitem) { // fix: need to keep going up the chain if still a relative url!!!!!
...3 : 2; // if the file protocol has an extra slashe, prepare to also skip it in the separator search var att2 = att.indexof('/', protocolpos+skipfile); // find first path separator ('/') after protocol if (att2 !== -1) { att = att.substring(0, att2 - 1); // don't want any trailing slash, 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, reso...
...lve 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 === '') ?
Setting Up a Development Environment - Archive of obsolete content
also make sure that make is in the executable system path.
... in the "start in" textbox you should choose %p (directory path of active project).
...we use this information to locate the installation path of the extension and overwrite the installed files.
... you should also set up your environment so that xpidl.exe (or just xpidl on other systems) is in the default executable path, and also add a variable called gecko_sdk, that points to your sdk build: export gecko_sdk=/path/to/your/sdk our build system should pick it up from there.
Using Dependent Libraries In Extension Components - Archive of obsolete content
srcdir = @srcdir@ topsrcdir = @top_srcdir@ vpath = @srcdir@ include $(depth)/config/autoconf.mk module = bsmedberg library_name = bsmedberg_stub is_component = 1 force_shared_lib = 1 requires = \ xpcom \ string \ $(null) cppsrcs = bdsstubloader.cpp extra_dso_ldopts += \ $(dist)/lib/$(lib_prefix)xpcomglue_s.$(lib_suffix) \ $(xpcom_frozen_ldopts) \ $(nspr_libs) \ $(null) include $(topsrcdir)/config/rules.mk defines += -dmoz_d...
...nt to find // <extensiondir>/libraries nscomptr<nsifile> libraries; rv = alocation->getparent(getter_addrefs(libraries)); if (ns_failed(rv)) return rv; nscomptr<nsilocalfile> library(do_queryinterface(libraries)); if (!library) return ns_error_unexpected; library->setnativeleafname(ns_literal_cstring("libraries")); library->appendnative(ns_literal_cstring("dummy")); nscstring path; // loop through and load dependent libraries for (char const *const *dependent = kdependentlibraries; *dependent; ++dependent) { library->setnativeleafname(nsdependentcstring(*dependent)); rv = library->getnativepath(path); if (ns_failed(rv)) return rv; //at this point, we would have used prlibrary *lib; library->load(&lib); //but we can't use that in os x.
... nsaddimage(path.get(), nsaddimage_option_return_on_error | nsaddimage_option_with_searching | nsaddimage_option_match_filename_by_installname); // 1) we don't care if this failed!
... } library->setnativeleafname(ns_literal_cstring(krealcomponent)); rv = library->getnativepath(path); if (ns_failed(rv)) return rv; const mach_header * componentlib = nsaddimage(path.get(), nsaddimage_option_return_on_error | nsaddimage_option_with_searching | nsaddimage_option_match_filename_by_installname); if (componentlib == null) return ns_error_unexpected; //find the nsgetmodule procedure of the real component and “pass the buck”.
Notes on HTML Reflow - Archive of obsolete content
the reflow tree work, which will remove several commands from the queue at once.) a path is built from the target frame to the root frame and stored in the reflow command.
...the root frame notes the incremental reflow reason specified in the reflow state, and inspects the path contained within the reflow command object.
... 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.
Style System Overview - Archive of obsolete content
there is one rule node on the path from the root rule node to the style context's rule node for each rule that the element matches.
...(the context tree can be deep.) each rule node has a per-struct set of “none bits” that say that the rule node's set of rules (the rules on the path to the root) specify nothing non-inherited for the struct.
... when we compute a data struct, we cache it as high as possible in the rule tree -- on the lowest of the rule nodes on the path to the root that specified something for that struct.
... otherwise, we cache the struct in the rule tree, on the first rule node that contributed any data, and mark dependent bits on the path up to that rule node.
GRE - Archive of obsolete content
if you link directly against xpcom.dll/libxpcom.so (xpcom.lib import lib), your application will not launch unless xpcom.dll is in your path.
... to find a compatible gre, you should use the function gre_getgrepathwithproperties() (declared in xpcom/glue/standalone/nsxpcomglue.h).
... dependent libraries and environment variables the xulrunner gre is designed so that the embedder does not need to set any environment variables such as path or ld_library_path before calling xpcomgluestartup(), because it dynamically loads the correct dependent libraries.
...embedders will need to set the ld_library_path environment variable and start a new process in order to embed a suite-based gre correctly.
Java in Firefox Extensions - Archive of obsolete content
policyclass.newinstance(); policy.setouterpolicy(java.security.policy.getpolicy()); java.security.policy.setpolicy(policy); policy.addpermission(new java.security.allpermission()); for (var j=0; j < urls.length; j++) { policy.addurl(urls[j]); } }catch(e) { alert(e+'::'+e.linenumber); } } //get extension folder installation path...
... (this works in firefox 3.x, for firefox 4.x use addonmanager.getaddonbyid) var extensionpath = components.classes["@mozilla.org/extensions/manager;1"].
...// guid of extension getitemlocation("test@yoursite"); //the path logic would work if we include em:unpack for ff 4.x, for ff 3.x since things are unpacked by default things work // get path to the jar files (the following assumes your jars are within a // directory called "java" at the root of your extension's folder hierarchy) // you must add this utilities (classloader) jar to give your extension full privileges var extensionurl = "file:///" + extensionpath.path.replace(/\\/g,"/"); var classloaderjarpath = extensionurl + "/java/javafirefoxextensionutils.jar"; // add the paths for all the other jar files that you will be using var myjarpath = extensionurl + "/ja...
...va/testjava.jar"; // seems you don't actually have to replace the backslashes as they work as well var urlarray = []; // build a regular javascript array (liveconnect will auto-convert to a java array) urlarray[0] = new java.net.url(myjarpath); urlarray[1] = new java.net.url(classloaderjarpath); var cl = java.net.urlclassloader.newinstance(urlarray); //set security policies using the above policyadd() function policyadd(cl, urlarray); now you can begin using liveconnect, including referencing the classes in your jars.
Enabling Experimental Jetpack Features - Archive of obsolete content
methods import(stringmountpath string)imports the requested experimental feature into the script.
... stringmountpathstring that enumerates where, starting from the jetpack base, the feature will be mounted.
... to get a list of mount paths that are available, see the method below.
...list() arrayreturns an array of the set of potential stringmountpath as used in jetpack.future.import().
Enabling - Archive of obsolete content
methods import(stringmountpath string)imports the requested experimental feature into the script.
... stringmountpathstring that enumerates where, starting from the jetpack base, the feature will be mounted.
... to get a list of mount paths that are available, see the method below.
...list()returns an array of the set of potential stringmountpath as used in jetpack.future.import().
Enabling Experimental Jetpack Features - Archive of obsolete content
ArchiveMozillaJetpackdocsMetaFuture
methods import(stringmountpath string)imports the requested experimental feature into the script.
... stringmountpathstring that enumerates where, starting from the jetpack base, the feature will be mounted.
... to get a list of mount paths that are available, see the method below.
...list() arrayreturns an array of the set of potential stringmountpath as used in jetpack.future.import().
Microsummary XML grammar reference - Archive of obsolete content
child elements: <condition> (optional) an xpath boolean expression along with a conditional interval of time, in minutes, that must elapse between updates if the expression evaluates to true.
...for each one, firefox evaluates the element's xpath boolean expression against the page being summarized.
... the <condition> element the optional <condition> element specifies an xpath boolean expression along with a conditional interval of time, in minutes, that must elapse between updates if the expression evaluates to true when evaluated against the page being summarized.
...attributes: expression (required) an xpath boolean expression to be evaluated against the page being summarized.
windowsShortcut - Archive of obsolete content
method of file object syntax int windowsshortcut( folderobject atarget, folderobject ashortcutpath, string adescription, folderobject aworkingpath, string aparams, folderobject aicon, number aiconid); parameters the windowsshortcut method has the following parameters: atarget a filespecobject representing the absolute path (including filename) to file that the shortcut will be created for.
... ashortcutpath a filespecobject representing the absolute path (not including filename) to where the shortcut is to be created.
... aworkingpath a filespecobject representing the absolute path to the working dir for where atarget will is to be run from.
... aicon a filespecobject representing the absolute path (including fiilename) to a file that contains icons.
Installer Script - Archive of obsolete content
function verifydiskspace(dirpath, spacerequired) 3.
... // get the available disk space on the given path 6.
... spaceavailable = filegetdiskspaceavailable(dirpath); 7.
... logcomment("insufficient disk space: " + dirpath); 13.
XML Assignments - Archive of obsolete content
xpath provides syntax to retrieve this using the built-in string-length method.
...this element allows the use of additional xpath expressions to get more data from the xml data.
...the expr attribute specifies the xpath expression and the var attribute specifies the variable to assign to.
... note that while the query expression uses the root node (or reference node) as the xpath context, the expressions for the assign element are evaluated using each result node as the context.
The First Install Problem - Archive of obsolete content
the solution suggests that plugin vendors ought to leave dlls on a windows desktop whether or not a netscape gecko browser is detected, and then write keys in the windows registry giving future netscape gecko browsers the path where the plugin resides and meta-information about how to load the plugin.
... "path" -- string value -- this would be the absolute path to the plugin module.
... this is the path to the actual dll.
... (note that the file name must still begin with "np", just as it must when the file is loaded from the .\plugins directory.) example: [hkey_local_machine\software\mozillaplugins\@mycompany.com/myapplication,version=5.01] path=c:\mycompany\myapplication\netscape\npmyapp.dll "xptpath" -- string value -- absolute path to xpt module required for scripting plug-in, if applicable example: [hkey_local_machine\software\mozillaplugins\@mycompany.com/myapplication,version=5.01] xptpath=c:\mycompany\myapplication\netscape\npmyapp.xpt "geckoversion" -- this is the optional mention of the minimal gecko version that the browser is compatible with.
Building a Theme - Archive of obsolete content
browser to chrome/browser/ communicator to chrome/communicator/ you should end up with this directory structure: <ext path>/ /install.rdf /chrome.manifest /chrome/ browser/ communicator/ global/ mozapps/ after this, it would be a good idea to read the article setting up extension development environment and follow the directions there.
...that form the structure and behavior of an application ui), locale (dtd, .properties files etc that contain strings for the ui's localization), and skin (css and images that form the theme of the ui) finally, the path of a file to load.
...for example, the line skin browser sample skin/browser/ means "when the user has the sample theme selected, use the directory browser/ to look up skins for the browser package." more concisely, this means that the url chrome://browser/skin/some/path/file.css will look for a file browser/some/path/file.css in your theme's root directory.
... create a new text file and put the full path to your development folder inside (e.g.
LiveConnect Overview - Archive of obsolete content
for example, if the helloworld class is directly in the classpath and not in a package, you can access it as follows: var red = new packages.helloworld(); the liveconnect java, sun, and netscape objects provide shortcuts for commonly used java packages.
...using the liveconnect classes with the jdk to access the liveconnect classes, place the .jar or .zip file in the classpath of the jdk compiler in either of the following ways: create a classpath environment variable to specify the path and name of .jar or .zip file.
... specify the location of .jar or .zip file when you compile by using the -classpath command line parameter.
... you can specify an environment variable in windows nt by double-clicking the system icon in the control panel and creating a user environment variable called classpath with a value similar to the following: c:\program files\java\jre1.4.1\lib\plugin.jar see the sun jdk documentation for more information about classpath.
Creating hyperlinks - Learn web development
a quick primer on urls and paths to fully understand link targets, you need to understand urls and file paths.
... urls use paths to find files.
... paths specify where the file you're interested in is located in the filesystem.
...— so the url you would use is ../pdfs/project-brief.pdf: <p>a link to my <a href="../pdfs/project-brief.pdf">project brief</a>.</p> note: you can combine multiple instances of these features into complex urls, if needed, for example: ../../../complex/path/to/my/file.html.
Index - Learn web development
14 common questions codingscripting, infrastructure, learn, web, webmechanics this section of the learning area is designed to provide answers to common questions that may come up, which are not necessarily part of the structured core learning pathways (e.g.
... 35 front-end web developer beginner, css, front-end, html, javascript, learn, tools, web standards welcome to our front-end web developer learning pathway!
...this module provides a gentle beginning to your path towards css mastery with the basics of how it works, what the syntax looks like, and how you can start using it to add styling to html.
...as we learned in the critical rendering path document, linking css with a tradional link tag with rel="stylesheet" is synchronous and blocks rendering.
Browser chrome tests
as with mochitest, the path given as an argument is the path to a test or directory within the mozilla source tree.
... if the path points to a directory, then the tests in that directory and all of its subdirectories will be run.
... for example, to run the tests in browser/base/content/test the command would be: ./mach mochitest -f browser browser/base/content/test/ or without mach test_path=<path_to_the_tests> make -c <objdir> mochitest-browser-chrome to run tests in debugger the following should work ./mach mochitest -f browser --debugger gdb browser/base/content/test/ run ./mach help mochitest-browser for more options.
...irst tests in a directory, make sure to also include any head.js you added to support-files, and additionally, ensure that your browser.ini is referenced by a moz.build file somewhere, such as: browser_chrome_manifests += [ 'test/functional/mochitest/browser.ini' ] support-files once added to support-file section of browser.ini support files may be referenced as https://example.com/browser/[path_to_file] or chrome://mochitests/content/browser/[path_to_file].
Debugging on Mac OS X
to workaround this problem, remove the quarantine extended attribute from the downloaded nightly: $ xattr -r -d com.apple.quarantine /path/to/nightly.app local builds local builds of mozilla-central do not enable hardened runtime and hence do not have debugging restrictions.
... the breakpoint runs some commands to # figure out the object directory path from the attached target and then # sources the .lldbinit from there.
...# 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 information.
Simple SeaMonkey build
by default you will arrive in your windows user home directory which is likely to contain spaces in its path (e.g.
...to avoid that, create a directory without spaces in its path (e.g.
...echo 'mk_add_options moz_objdir=/path/to/comm-central/obj-sm-release' >> .mozconfig # specify amount of parallel building.
... mk_add_options moz_objdir=/path/to/comm-central/obj-sm-debug ac_add_options --enable-application=suite ac_add_options --enable-debug ac_add_options --disable-optimize normally a shared build suffices for debugging purposes but current nightly releases are actually static builds which require even more memory to link.
pymake
anywhere you would normally type make, instead type python /path/to/srcdir/build/pymake/make.py.
... type touch .profile using any appropriate text editor open .profile and add the following line in the file (assuming your mozilla-central is at c:/mozilla-central, if not, adjust your path accordingly.) alias pymake=c:/mozilla-central/build/pymake/make.py save your .profile edit and close the shell, then restart the shell.
... note: on windows, if using an absolute path moz_objdir in your .mozconfig, it must be a windows-style (i.e.
.../c/foo/bar) path.
SVG Guidelines
for example, consider an image of a path with a gradient fill.
... basics two spaces indenting no useless whitespaces or line breaks (see below for more details) adding a license header use double quotes whitespace and line breaks whitespace in addition to trailing whitespace at the end of lines, there are a few more cases more specific to svgs: trailing whitespaces in attribute values (usually seen in path definitions) excessive whitespace in path or polygon points definition examples this path: <path d=" m5,5 l1,1z "> can be cut down to this: <path d="m5,5 l1,1z"> similarly, this polygon: <polygon points=" 0,0 4,4 4,0 "/> can be cut down to this: <polygon points="0,0 4,4 4,0"/> line breaks you should only use line breaks for logical separation or if they help make the file re...
...he filter effects specification) id (id on root element has no effect) xmlns:xlink attribute when there are no xlink:href attributes used throughout the file other unused xml namespace definitions xml:space when there is no text used in the file other empty tags, this may be obvious, but those are sometimes found in svgs unreferenced ids (usually on gradient stops, but also on shapes or paths) clip-rule attribute when the element is not a descendant of a <clippath> fill-rule attribute when the element is a descendant of a <clippath> unreferenced/unused clip paths, masks or defs (example) styling basics privilege short lowercase hex for colors don't use excessive precision for numeric values (usually comes from illustrator) use descriptive ids avoid inline styles and use ...
... instead of using css/svg transforms, apply directly the transform on the path/shape definition.
AddonManager
callback) void addaddonlistener(in addonlistener listener) void removeaddonlistener(in addonlistener listener) void addtypelistener(in typelistener listener) void removetypelistener(in typelistener listener) nsiuri geturiforresourceinfile(in nsifile afile, in string apath) properties overview attribute type description addontypes dictionary a dictionary that maps type id to addontype.
... void removetypelistener( in typelistener listener ) parameters listener the typelistener to remove geturiforresourceinfile() nsiuri geturiforresourceinfile( in nsifile afile, in string apath ) parameters afile the nsifile containing the resources; must be either a directory or an xpi file.
... apath the path to find the resource at, "/" separated.
... if apath is empty then the uri to the root of the contained files will be returned.
Promise
for example, the os.file.exists function returns a promise that will eventually fulfill with a boolean: promise<boolean> exists(string path); the rejection reason may be specified separately in the function's documentation, and is considered to be an error object unless otherwise specified.
... handling errors and common pitfalls you should report unhandled errors, unless you're handing off the promise to a caller or another code path that will handle the error.
...os.file.exists(path).then(exists => { if (exists) myread(path); }); // ###### wrong: silently drops any exception raised by "myread".
... os.file.exists(path).then(exists => { if (exists) myread(path); }, components.utils.reporterror); // correct (for example, might report the exception "myread is not defined") os.file.exists(path).then(exists => { if (exists) myread(path); }) .catch(components.utils.reporterror); // correct (the function returns a promise, and the caller will handle the rejection) function myreadifexists(path) { return os.file.exists(path).then(exists => { if (exists) myread(path); }); } ...
PromiseWorker.jsm
promiseworker.jsm path: resource://gre/modules/promiseworker.jsm a javascript code module used by the main thread to create a worker thread and communicate with it.
... promiseworker.js path: resource://gre/modules/workers/promiseworker.js a javascript file used by the worker thread, which is created by promiseworker.jsm in main thread, to communicate with the main thread.
... main thread file the basepromiseworker object needs to be imported: const { utils: cu } = components; const { basepromiseworker } = cu.import('resource://gre/modules/promiseworker.jsm', {}); let myworker = new basepromiseworker('path_to_worker_file.js'); you're now ready to start using promiseworker.
...r argument of: `' + shouldresolve + '`'; } else { throw new error('you passed in a non-true value for shouldresolve argument and therefore this will reject the main thread promise'); } } main thread file bootstrap.js const { utils: cu } = components; const { basepromiseworker } = cu.import('resource://gre/modules/promiseworker.jsm', {}); var myworker = new basepromiseworker('chrome://path/to/content/myworker.js'); var promise_domyfunctrue = myworker.post('resolvetest', [true]); promise_domyfunctrue.then( function(aval) { console.log('fullfilled - promise_domyfunctrue - ', aval); }, function(areason) { console.error('rejected - promise_domyfunctrue - ', areason); } ).catch( function(acaught) { console.error('caught - promise_domyfunctrue...
Webapps.jsm
importing components.utils.import("resource://gre/modules/webapps.jsm"); // exported symbol is domapplicationregistry method overview init: function() loadcurrentregistry: function() notifyappsregistrystart: function notifyappsregistrystart() notifyappsregistryready: function notifyappsregistryready() sanitizeredirects: function sanitizeredirects(asource) _savewidgetsfullpath: function(amanifest, adestapp) appkind: function(aapp, amanifest) updatepermissionsforapp: function(aid, aispreinstalled) updateofflinecacheforapp: function(aid) installpreinstalledapp: function installpreinstalledapp(aid) removeifhttpsduplicate: function(aid) installsystemapps: function() loadandupdateapps: function() updatedatastore: function(aid, aorigin, amanifesturl, amanifest) _reg...
...ner: function(amsgnames, aapp, amm) removemessagelistener: function(amsgnames, amm) formatmessage: function(adata) receivemessage: function(amessage) getappinfo: function getappinfo(aappid) broadcastmessage: function broadcastmessage(amsgname, acontent) registerupdatehandler: function(ahandler) unregisterupdatehandler: function(ahandler) notifyupdatehandlers: function(aapp, amanifest, azippath) _getappdir: function(aid) _writefile: function(apath, adata) dogetlist: function() doexport: function(amsg, amm) doimport: function(amsg, amm) doextractmanifest: function(amsg, amm) dolaunch: function (adata, amm) launch: function launch(amanifesturl, astartpoint, atimestamp, aonsuccess, aonfailure) close: function close(aapp) canceldownload: function canceldownload(amanifesturl, aerro...
...ata, 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(arequestchannel, aid, aoldapp, anewapp) _computefilehash: function(afilepath) _sendappliedevent: function(aapp) _openandreadpackage: function(azipfile, aoldapp, anewapp, aislocalfileinstall,) _openpackage: function(azipfile, aapp, aislocalfileinstall) _opensignedpackage: function(...
...t) getappbymanifesturl: function(amanifesturl) getfullappbymanifesturl: function(amanifesturl, aentrypoint, alang) getmanifestcspbylocalid: function(alocalid) getdefaultcspbylocalid: function(alocalid) getapplocalidbystoreid: function(astoreid) getappbylocalid: function(alocalid) getmanifesturlbylocalid: function(alocalid) getapplocalidbymanifesturl: function(amanifesturl) getcoreappsbasepath: function() getwebappsbasepath: function() _islaunchable: function(aapp) _notifycategoryandobservers: function(subject, topic, data, msg) registerbrowserelementparentforapp: function(amsg, amn) receiveappmessage: function(appid, message) _clearprivatedata: function(appid, browseronly, msg) _sendprogressevent: function() updatestatechanged: function appobs_update(aupdate, astate) applica...
Bootstrapping a new locale
make sure to have the directory where you intend to work as the current path on your terminal.
...ocales/chrome ab-cd/extensions cp -r mozilla-1.9.x/netwerk/locales/ ab-cd/netwerk cp -r mozilla-1.9.x/other-licenses/branding/firefox/locales/ ab-cd/other-licenses cp -r mozilla-1.9.x/security/manager/locales/ ab-cd/security cp -r mozilla-1.9.x/toolkit/locales/ ab-cd/toolkit getting started change your directory to the new working directory so you are in the ~/[your working directory]/[ab-cd]/ path and can start localizing.
... (read more about tools at l10n:tools.) after you have downloaded your editor of choice, type the following command in the same path from above (~/ab-cd/browser/chrome/browser) $ edit ab-cd/browser/chrome/browser/aboutcerterror.dtd read the top of the file to get any context on how to translate contained in the notes written by the developers or l10n-drivers.
... $ cd /path/to/existing/hg/repo/ $ hg push http://bitbucket.org/mozillal10n/ab-cd/ prefer ssh?
GC and CC logs
from the commandline tldr: if you just want shutdown gc/cc logs to debug leaks that happen in our automated tests, you probably want something along the lines of: moz_disable_content_sandbox=t moz_cc_log_directory=/full/path/to/log/directory/ moz_cc_log_shutdown=1 moz_cc_all_traces=shutdown ./mach ...
...won't work - you need to specify a full path.
...by default, the file is created in some temp directory, and the path to the file is printed to the error console.
...calling find_roots.py on a cc log with a specific object or kind of object will produce paths from rooting objects to the specified objects.
Profiling with the Firefox Profiler
common performance bugs in firefox inefficient code that is on the reflow or restyle paths is often to blame for jank.
... you'll need to have adb and arm-eabi-addr2line (which is part of the android ndk) in your bash path, so use locate arm-eabi-addr2line (on linux) or mdfind name:arm-eabi-addr2line (on os x) and stick an export to its location in ~/.bash_profile.
... type in2, : p (void)profiler_save_profile_to_file("somepath/profile.txt") clone mstange’s handy profile analysis repository.
... run: python symbolicate_profile.py somepath/profile.txt to graft symbols into the profile.
I/O Functions
functions that operate on pathnames functions that act on file descriptors directory i/o functions socket manipulation functions converting between host and network addresses memory-mapped i/o functions anonymous pipe function polling functions pollable events manipulating layers functions that operate on pathnames a file or directory in a file system is specified by its pathname.
... nspr uses unix-style pathnames, which are null-terminated character strings.
...the forward slash (/) separates the directories in a pathname.
... nspr converts the slashes in a pathname to the directory separator of the native os--for example, backslash (\) on windows and colon (:) on mac os--before passing it to the native system calls.
PR_MkDir
all the path components up to but not including the leaf component must already exist.
... description pr_mkdir creates a new directory with the pathname name.
... all the path components up to but not including the leaf component must already exist.
... for example, if the pathname of the directory to be created is a/b/c/d, the directory a/b/c must already exist.
HTTP delegation
http uris consist of host:port and a path, e.g.
...instead, the parameters are a server session object (that carries host and port information already) and the request path.
... in our example the path is "/cgi-bin/ocsp-responder".
... (when issueing get requests, the "?query-string=data" portion should already be appended to the request path) after creation, nss might call functions to provide additional details of the http request (e.g.
HTTP delegation
http uris consist of host:port and a path, e.g.
...instead, the parameters are a server session object (that carries host and port information already) and the request path.
... in our example the path is "/cgi-bin/ocsp-responder".
... (when issuing get requests, the "?query-string=data" portion should already be appended to the request path) after creation, nss might call functions to provide additional details of the http request (e.g.
Using JSS
MozillaProjectsNSSJSSUsing JSS
you can put this directory in your classpath to run applications locally; or, you can package the class files into a jar file for easier distribution: cd mozilla/dist/classes[_dbg] zip -r ../jss42.jar .
... classpath include the path containing the jss classes you built, or the path to jss42.jar.
... (the path to jss34.jar ends with the string "/jss42.jar".
... it is not just the directory that contains jss42.jar.) ld_library_path (unix) / path (windows) include the path to the nspr, nss, and jss shared libraries.
sslfnc.html
syntax #include "nss.h" secstatus nss_init(char *configdir); parameter this function has the following parameter: configdir a pointer to a string containing the pathname of the directory where the certificate, key, and security module databases reside.
... syntax #include "nss.h" secstatus nss_initreadwrite(char *configdir); parameter this function has the following parameter: configdir a pointer to a string containing the pathname of the directory where the certificate, key, and security module databases reside.
... directory a pointer to a string specifying the pathname of the directory that will contain the session cache.
... directory a pointer to a string specifying the pathname of the directory that will contain the session cache.
SpiderMonkey Build Documentation
./configure.in --with-nspr-cflags="-ic:/mozilla-build/msys/local/include" \ --with-nspr-libs="c:/mozilla-build/msys/local/lib/libnspr4.a \ c:/mozilla-build/msys/local/lib/libplds4.a \ c:/mozilla-build/msys/local/lib/libplc4.a" if you get symbol loading or dynamic library errors, you can force the correct nspr to load with: path="$path;c:/mozilla-build/msys/local/lib/" ./js specifying installation directories make install puts files in the following directories by default.
...mac os x 10.5), you can use the following: ar=ar cc="gcc -m64" cxx="g++ -m64" ../configure --target=x86_64-apple-darwin10.0.0 to build a 64-bit windows version, you can use the following: $src/configure --host=x86_64-pc-mingw32 --target=x86_64-pc-mingw32 note: you must have started your mozillabuild shell with the proper -x64.bat script in order for the 64-bit compilers to be in your path.
... the js-config script, described below, is the recommended way to determine correct include paths, required libraries, etc.
... to build an optimized (non-debug) version of spidermonkey: make build_opt=1 -f makefile.ref to build a thread-safe version of spidermonkey: make js_dist=/full/path/to/directory/containing/nspr js_threadsafe=1 -f makefile.ref ...
A Web PKI x509 certificate primer
in order for a certificate to be valid these three requirements must be met: there is a verification path from the site certificate to a trusted certificate of the user agent (ie if you follow the issuer path you will end on a self-signed certificate that is considered trusted by the browser).
... the attributes of the certificates in the verification path have valid parameters for that verification (for example the validity period of all the certificates are valid for the time the verification is being done) revocation checks are considered ok for that particular validation.
...it can also be used to express the maximum depth of the trust path from the ca.
... sec_error_invalid_algorithm a certificate has been signed with an unknown algorithm re-sign the certificate with a standardized certificate signing algorithm sec_error_invalid_time a time field in a certificate has an invalid value re-generate the certificate with valid encodings for time fields mozilla_pkix_error_key_pinning_failure sec_error_path_len_constraint_invalid sec_error_unknown_critical_extension a certificate contains an extension marked as critical that is not handled by mozilla::pkix re-generate the certificate without the extension or with it not marked as critical sec_error_unknown_issuer either a missing intermediate or root certificate is necessary to verify the certificate import the ...
Signing Mozilla apps for Mac OS X
--keychain /path/to/keychain lets you specify which keychain contains the signing certificate specified by your-signing-identity, rather than allowing the codesign to search the keychain list.
... the path specified must be a full path; it's usually something similar to /users/username/library/keychains/keychain-name.keychain.
... --resource-rules /path/to/coderesources specifies a file to use when generating the rules to be applied to the code signing.
...you'll of course need to change the signing id, keychain, bundle path, and requirements.
Creating the Component Code
the code to register such an object is simple: ns_imethodimp samplemodule::registerself(nsicomponentmanager *acompmgr, nsifile* apath, const char* registrylocation, const char* componenttype) { printf("hello mozilla registration!\n\n"); nsicomponentregistrar* compreg = nsnull; nsresult rv = acompmgr->queryinterface(kicomponentregistrariid,(void**)& compreg); if (ns_failed(rv)) return rv; rv = compreg->registerfactorylocation(ksamplecid, ...
... "sample class", nsnull, apath, registrylocation, componenttype); compreg->release(); return rv; } unregistration follows the same logic.
...; samplefactory* factory = new samplefactory(); if (!factory) return ns_error_out_of_memory; nsresult rv = factory->queryinterface(aiid, result); if (ns_failed(rv)) { *result = nsnull; delete factory; } return rv; } //---------------------------------------- ns_imethodimp samplemodule::registerself(nsicomponentmanager *acompmgr, nsifile* apath, const char* registrylocation, const char* componenttype) { nsicomponentregistrar* compreg = nsnull; nsresult rv = acompmgr->queryinterface(kicomponentregistrariid, (void**)&compreg); if (ns_failed(rv)) return rv; rv = compreg->registerfactorylocation(ksamplecid, "sample class", ...
... nsnull, apath, registrylocation, componenttype); compreg->release(); return rv; } ns_imethodimp samplemodule::unregisterself(nsicomponentmanager* acompmgr, nsifile* apath, const char* registrylocation) { nsicomponentregistrar* compreg = nsnull; nsresult rv = acompmgr->queryinterface(kicomponentregistrariid, (void**)&compreg); if (ns_failed(rv)) return rv; rv = compreg->unregisterfactorylocation(ksamplecid, apath); compreg->release(); return rv; } ns_imethodimp samplemodule::canunload(nsicomponentmanager *acompmgr, prbool *oktounload) { *oktounload = pr_fa...
nsICommandLine
resolvefile() resolves a file-path argument into an nsifile object.
... this method gracefully handles relative or absolute file paths, according to the working directory of this command line.
... return value the file path as an nsifile.
...this method has platform-specific logic for converting an absolute uri or a relative file-path into the appropriate uri object; it gracefully handles win32 c:\ paths which would confuse the i/o service if passed directly.
nsICookieManager
it is implemented by the @mozilla.org/cookiemanager;1 component, but should generally be accessed via services.cookies method overview void remove(in autf8string ahost, in acstring aname, in autf8string apath, in boolean ablocked, in jsval aoriginattributes); void removeall(); attributes attribute type description enumerator nsisimpleenumerator called to enumerate through each cookie in the cookie list.
... methods remove() this method is called to remove an individual cookie from the cookie list, specified by host, name, and path.
... void remove( in autf8string ahost, in acstring aname, in autf8string apath, in boolean ablocked, in jsval aoriginattributes ); parameters ahost the host or domain for which the cookie was set.
... apath the path for which the cookie was set.
nsIFilePicker
onents.interfaces.nsifilepicker; var fp = components.classes["@mozilla.org/filepicker;1"] .createinstance(nsifilepicker); fp.init(window, "dialog title", nsifilepicker.modeopen); fp.appendfilters(nsifilepicker.filterall | nsifilepicker.filtertext); fp.open(function (rv) { if (rv == nsifilepicker.returnok || rv == nsifilepicker.returnreplace) { var file = fp.file; // get the path as string.
... note that you usually won't // need to work with the string paths.
... var path = fp.file.path; // work with returned nsilocalfile...
... var files = fp.files; var paths = []; while (files.hasmoreelements()) { var arg = files.getnext().queryinterface(components.interfaces.nsilocalfile).path; paths.push(arg); } ...
nsIInstallLocation
you can get the install location of a particular add-on using nsiextensionmanager interface: var il = components.classes["@mozilla.org/extensions/manager;1"] .getservice(components.interfaces.nsiextensionmanager) .getinstalllocation("add-on id") method overview astring getidforlocation(in nsifile file); nsifile getitemfile(in astring id, in astring path); nsifile getitemlocation(in astring id); nsifile getstagefile(in astring id); boolean itemismanagedindependently(in astring id); void removefile(in nsifile file); nsifile stagefile(in nsifile file, in astring id); attributes attribute type description canaccess boolean whether or not the user can write to the install location with the current access privileges.
...note: this function makes no promises about whether or not this path is actually maintained by this install location.
...nsifile getitemfile( in astring id, in astring path ); parameters id the guid of the item.
... path the path to the file beneath an extension's directory.
nsIWebBrowserPersist
webbrowserpersist = components.classes["@mozilla.org/embedding/browser/nswebbrowserpersist;1"] .createinstance(components.interfaces.nsiwebbrowserpersist); method overview void cancelsave(); void savechannel(in nsichannel achannel, in nsisupports afile); void savedocument(in nsidomdocument adocument, in nsisupports afile, in nsisupports adatapath, in string aoutputcontenttype, in unsigned long aencodingflags, in unsigned long awrapcolumn); void saveuri(in nsiuri auri, in nsisupports acachekey, in nsiuri areferrer, in long areferrerpolicy, in nsiinputstream apostdata, in string aextraheaders, in nsisupports afile, in nsiloadcontext aprivacycontext); void saveprivacyawareuri(in nsiuri auri, in nsisupports acachekey, in nsi...
... void savedocument( in nsidomdocument adocument, in nsisupports afile, in nsisupports adatapath, in string aoutputcontenttype, in unsigned long aencodingflags, in unsigned long awrapcolumn ); parameters adocument document to save to file.
... adatapath path to directory where uris linked to the document are saved or nsnull if no linked uris should be saved.
... function downloadfile(httploc, sourcewindow) { try { //new obj_uri object var obj_uri = components.classes["@mozilla.org/network/io-service;1"].getservice(components.interfaces.nsiioservice).newuri(httploc, null, null); //new file object var obj_targetfile = components.classes["@mozilla.org/file/local;1"].createinstance(components.interfaces.nsilocalfile); //set file with path obj_targetfile.initwithpath("c:\\temp\\test.pdf"); //if file doesn't exist, create if(!obj_targetfile.exists()) { obj_targetfile.create(0x00,0644); } //new persistence object var obj_persist = components.classes["@mozilla.org/embedding/browser/nswebbrowserpersist;1"].createinstance(components.interfaces.nsiwebbrowserpersist); // with persist flags if desired ...
ctypes
open() opens a library, specified by a pathname.
... the library is loaded from the specified full path, or, if a partial path is specified, from the appropriate library directory based on the platform on which the application is running.
... see library search paths for more details.
... library open( libspec ); parameters libspec the native library to open, specified as a pathname string.
Using the CSS Painting API - Web APIs
perties() { return ['--highcolour']; } static get contextoptions() { return {alpha: true}; } paint(ctx, size, props) { /* set where to start the highlight & dimensions */ const x = 0; const y = size.height * 0.3; const blockwidth = size.width * 0.33; const highlightheight = size.height * 0.85; const color = props.get('--highcolour'); ctx.fillstyle = color; ctx.beginpath(); ctx.moveto( x, y ); ctx.lineto( blockwidth, y ); ctx.lineto( blockwidth + highlightheight, highlightheight ); ctx.lineto( x, highlightheight ); ctx.lineto( x, y ); ctx.closepath(); ctx.fill(); /* create the dashes */ for (let i = 0; i < 4; i++) { let start = i * 2; ctx.beginpath(); ctx.moveto( (blockwidth) + (start * 10) + 10, y ); ctx.lineto( (blockwidth) + (sta...
...rt * 10) + 20, y ); ctx.lineto( (blockwidth) + (start * 10) + 20 + (highlightheight), highlightheight ); ctx.lineto( (blockwidth) + (start * 10) + 10 + (highlightheight), highlightheight ); ctx.lineto( (blockwidth) + (start * 10) + 10, y ); ctx.closepath(); ctx.fill(); } } // paint }); we can then create a little html that will accept this image as backgrounds: <h1 class="fancy">largest header</h1> <h3 class="fancy">medium size header</h3> <h6 class="fancy">smallest header</h6> we give each header a different value for the --highcolour custom property .fancy { background-image: paint(headerhighlight); } h1 { --highcolour: hsla(155, 90%, 60%, 0.7); } h3 { --highcolour: hsla(255, 90%, 60%, 0.5); } h6 { --highcolour: hsla(355, 90%, 60%, 0.3); } and we register our workl...
...strokewidth ) { ctx.linewidth = strokewidth; } else { ctx.linewidth = 1.0; } // set the fill type if ( stroketype === 'stroke' ) { ctx.fillstyle = 'transparent'; ctx.strokestyle = colour; } else if ( stroketype === 'filled' ) { ctx.fillstyle = colour; ctx.strokestyle = colour; } else { ctx.fillstyle = 'none'; ctx.strokestyle = 'none'; } // block ctx.beginpath(); ctx.moveto( x, y ); ctx.lineto( blockwidth, y ); ctx.lineto( blockwidth + blockheight, blockheight ); ctx.lineto( x, blockheight ); ctx.lineto( x, y ); ctx.closepath(); ctx.fill(); ctx.stroke(); // dashes for (let i = 0; i < 4; i++) { let start = i * 2; ctx.beginpath(); ctx.moveto( blockwidth + (start * 10) + 10, y); ctx.lineto( blockwidth + (start * 10) + 20, y...
...); ctx.lineto( blockwidth + (start * 10) + 20 + blockheight, blockheight); ctx.lineto( blockwidth + (start * 10) + 10 + blockheight, blockheight); ctx.lineto( blockwidth + (start * 10) + 10, y); ctx.closepath(); ctx.fill(); ctx.stroke(); } } // paint }); we can set different colors, stroke widths, and pick whether the background image should be filled or hollow: li { --boxcolor: hsla(155, 90%, 60%, 0.5); background-image: paint(hollowhighlights, stroke, 5px); } li:nth-of-type(3n) { --boxcolor: hsla(255, 90%, 60%, 0.5); background-image: paint(hollowhighlights, filled, 3px); } li:nth-of-type(3n+1) { --boxcolor: hsla(355, 90%, 60%, 0.5); background-image: paint(hollowhighlights, stroke, 1px); } <ul> <li>item 1</li> <li>item 2</li> <li>...
CanvasRenderingContext2D.addHitRegion() - Web APIs
when provided, it is an object which can contain the following properties: path a path2d object describing the area of the hit region.
... if not provided, the current path is used.
... html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); canvas.addeventlistener('mousemove', function(event) { if(event.region) { alert('ouch, my eye :('); } }); ctx.beginpath(); ctx.arc(100, 100, 75, 0, 2 * math.pi); ctx.linewidth = 5; ctx.stroke(); // eyes ctx.beginpath(); ctx.arc(70, 80, 10, 0, 2 * math.pi); ctx.arc(130, 80, 10, 0, 2 * math.pi); ctx.fill(); ctx.addhitregion({id: "eyes"}); // mouth ctx.beginpath(); ctx.arc(100, 110, 50, 0, math.pi); ctx.stroke(); edit the code below to see your changes update live in the canvas.
...your current browser supports hit regions already; you might need to activate a preference.) playable code <canvas id="canvas" width="400" height="200" class="playable-canvas"></canvas> <div class="playable-buttons"> <input id="edit" type="button" value="edit" /> <input id="reset" type="button" value="reset" /> </div> <textarea id="code" class="playable-code" style="height:250px"> ctx.beginpath(); ctx.arc(100, 100, 75, 0, 2 * math.pi, false); ctx.linewidth = 5; ctx.stroke(); // eyes ctx.beginpath(); ctx.arc(70, 80, 10, 0, 2 * math.pi, false); ctx.arc(130, 80, 10, 0, 2 * math.pi, false); ctx.fill(); ctx.addhitregion({id: "eyes"}); // mouth ctx.beginpath(); ctx.arc(100, 110, 50, 0, math.pi, false); ctx.stroke();</textarea> var canvas = document.getelementbyid("canvas"); var ctx = canv...
CanvasRenderingContext2D.arc() - Web APIs
the canvasrenderingcontext2d.arc() method of the canvas 2d api adds a circular arc to the current sub-path.
...the path starts at startangle, ends at endangle, and travels in the direction given by anticlockwise (defaulting to clockwise).
... const canvas = document.queryselector('canvas'); const ctx = canvas.getcontext('2d'); ctx.beginpath(); ctx.arc(100, 75, 50, 0, 2 * math.pi); ctx.stroke(); result different shapes demonstrated this example draws various shapes to show what is possible with arc().
... html <canvas width="150" height="200"></canvas> javascript const canvas = document.queryselector('canvas'); const ctx = canvas.getcontext('2d'); // draw shapes for (let i = 0; i <= 3; i++) { for (let j = 0; j <= 2; j++) { ctx.beginpath(); let x = 25 + j * 50; // x coordinate let y = 25 + i * 50; // y coordinate let radius = 20; // arc radius let startangle = 0; // starting point on circle let endangle = math.pi + (math.pi * j) / 2; // end point on circle let anticlockwise = i % 2 == 1; // draw anticlockwise ctx.arc(x, y, radius, startangle, endangle, anticlockwise); if (i > 1) { ctx.fill(); } else {...
CanvasRenderingContext2D.bezierCurveTo() - Web APIs
the canvasrenderingcontext2d.beziercurveto() method of the canvas 2d api adds a cubic bézier curve to the current sub-path.
...the starting point is the latest point in the current path, which can be changed using moveto() before creating the bézier curve.
... html <canvas id="canvas"></canvas> javascript // define canvas and context const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // define the points as {x, y} let start = { x: 50, y: 20 }; let cp1 = { x: 230, y: 30 }; let cp2 = { x: 150, y: 80 }; let end = { x: 250, y: 100 }; // cubic bézier curve ctx.beginpath(); ctx.moveto(start.x, start.y); ctx.beziercurveto(cp1.x, cp1.y, cp2.x, cp2.y, end.x, end.y); ctx.stroke(); // start and end points ctx.fillstyle = 'blue'; ctx.beginpath(); ctx.arc(start.x, start.y, 5, 0, 2 * math.pi); // start point ctx.arc(end.x, end.y, 5, 0, 2 * math.pi); // end point ctx.fill(); // control points ctx.fillstyle = 'red'; ctx.beginpath(); ctx.arc(cp1.x, cp1.y, 5, 0, 2 * ...
... const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.beginpath(); ctx.moveto(30, 30); ctx.beziercurveto(120,160, 180,10, 220,140); ctx.stroke(); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.beziercurveto' in that specification.
CanvasRenderingContext2D.ellipse() - Web APIs
the canvasrenderingcontext2d.ellipse() method of the canvas 2d api adds an elliptical arc to the current sub-path.
...the path starts at startangle and ends at endangle, and travels in the direction given by anticlockwise (defaulting to clockwise).
... html <canvas id="canvas" width="200" height="200"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // draw the ellipse ctx.beginpath(); ctx.ellipse(100, 100, 50, 75, math.pi / 4, 0, 2 * math.pi); ctx.stroke(); // draw the ellipse's line of reflection ctx.beginpath(); ctx.setlinedash([5, 5]); ctx.moveto(0, 200); ctx.lineto(200, 0); ctx.stroke(); result various elliptical arcs this example creates three elliptical paths with varying properties.
... html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.fillstyle = 'red'; ctx.beginpath(); ctx.ellipse(60, 75, 50, 30, math.pi * .25, 0, math.pi * 1.5); ctx.fill(); ctx.fillstyle = 'blue'; ctx.beginpath(); ctx.ellipse(150, 75, 50, 30, math.pi * .25, 0, math.pi); ctx.fill(); ctx.fillstyle = 'green'; ctx.beginpath(); ctx.ellipse(240, 75, 50, 30, math.pi * .25, 0, math.pi, true); ctx.fill(); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.ellipse' in that specification.
CanvasRenderingContext2D.lineTo() - Web APIs
the canvasrenderingcontext2d method lineto(), part of the canvas 2d api, adds a straight line to the current sub-path by connecting the sub-path's last point to the specified (x, y) coordinates.
... like other methods that modify the current path, this method does not directly render anything.
... to draw the path onto a canvas, you can use the fill() or stroke() methods.
... const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.beginpath(); // start a new path ctx.moveto(30, 50); // move the pen to (30, 50) ctx.lineto(150, 100); // draw a line to (150, 100) ctx.stroke(); // render the path result drawing connected lines each call of lineto() (and similar methods) automatically adds to the current sub-path, which means that all the lines will all be stroked or filled together.
CanvasRenderingContext2D.moveTo() - Web APIs
the canvasrenderingcontext2d.moveto() method of the canvas 2d api begins a new sub-path at the point specified by the given (x, y) coordinates.
... examples creating multiple sub-paths this example uses moveto() to create two sub-paths within a single path.
... both sub-paths are then rendered with a single stroke() call.
... var canvas = document.getelementbyid('canvas'); var ctx = canvas.getcontext('2d'); ctx.beginpath(); ctx.moveto(50, 50); // begin first sub-path ctx.lineto(200, 50); ctx.moveto(50, 90); // begin second sub-path ctx.lineto(280, 120); ctx.stroke(); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.moveto' in that specification.
CanvasRenderingContext2D.quadraticCurveTo() - Web APIs
the canvasrenderingcontext2d.quadraticcurveto() method of the canvas 2d api adds a quadratic bézier curve to the current sub-path.
...the starting point is the latest point in the current path, which can be changed using moveto() before creating the quadratic bézier curve.
... html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // quadratic bézier curve ctx.beginpath(); ctx.moveto(50, 20); ctx.quadraticcurveto(230, 30, 50, 100); ctx.stroke(); // start and end points ctx.fillstyle = 'blue'; ctx.beginpath(); ctx.arc(50, 20, 5, 0, 2 * math.pi); // start point ctx.arc(50, 100, 5, 0, 2 * math.pi); // end point ctx.fill(); // control point ctx.fillstyle = 'red'; ctx.beginpath(); ctx.arc(230, 30, 5, 0, 2 * math.pi); ctx.fill(); result in this example, the co...
... const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.beginpath(); ctx.moveto(20, 110); ctx.quadraticcurveto(230, 150, 250, 20); ctx.stroke(); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.quadraticcurveto' in that specification.
Document.createExpression() - Web APIs
this method compiles an xpathexpression which can then be used for (repeated) evaluations.
... syntax xpathexpr = document.createexpression(xpathtext, namespaceurlmapper); parameters xpathtext is a string which is the xpath expression to be compiled.
... firefox 3 note prior to firefox 3, you could call this method on documents other than the one you planned to run the xpath against.
... return value xpathexpression ...
FileSystemEntry - Web APIs
it includes methods for working with files—including copying, moving, removing, and reading files—as well as information about a file it points to—including the file name and its path from the root to the entry.
... fullpath read only a usvstring object which provides the full, absolute path from the file system's root to the entry; it can also be thought of as a path which is relative to the root directory, prepended with a "/" character.
... name read only a usvstring containing the name of the entry (the final part of the path, after the last "/" character).
... ≤37chrome android full support 18firefox android full support 50opera android no support nosafari ios full support 11.3samsung internet android full support yesfullpath experimentalchrome full support 8edge full support 79firefox full support 50ie no support noopera no support nosafari full support ...
HTMLInputElement.webkitdirectory - Web APIs
understanding the results after the user makes a selection, each file object in files has its file.webkitrelativepath property set to the relative path within the selected directory at which the file is located.
...the entry for pic2343.jpg will have a webkitrelativepath of photoalbums/birthdays/don's 40th birthday/pic2343.jpg.
... note: the behavior of webkitrelativepath is different in chromium < 72.
...d="filepicker" name="filelist" webkitdirectory multiple /> <ul id="listing"></ul> javascript content document.getelementbyid("filepicker").addeventlistener("change", function(event) { let output = document.getelementbyid("listing"); let files = event.target.files; for (let i=0; i<files.length; i++) { let item = document.createelement("li"); item.innerhtml = files[i].webkitrelativepath; output.appendchild(item); }; }, false); result specifications specification status comment file and directory entries apithe definition of 'webkitdirectory' in that specification.
IDBDatabaseSync - Web APIs
method overview idbobjectstoresync createobjectstore (in domstring name, in domstring keypath, in optional boolean autoincrement) raises (idbdatabaseexception); idbobjectstoresync openobjectstore (in domstring name, in optional unsigned short mode) raises (idbdatabaseexception); void removeobjectstore (in domstring storename) raises (idbdatabaseexception); void setversion (in domstring version); idbtransactionsync transaction (in optional domstringlist...
... idbobjectstoresync createobjectstore( in domstring name, in domstring keypath, in optional boolean autoincrement ) raises (idbdatabaseexception); parameters name the name of a new object store.
... keypath the key path used by the new object store.
... if a null path is specified, then the object store does not have a key path, and uses out-of-line keys.
IDBObjectStoreSync - Web APIs
method overview any add (in any value, in optional any key) raises (idbdatabaseexception); idbindexsync createindex (in domstring name, in domstring storename, in domstring keypath, in optional boolean unique); any get (in any key) raises (idbdatabaseexception); idbcursorsync opencursor (in optional idbkeyrange range, in optional unsigned short direction) raises (idbdatabaseexception); idbindexsync openindex (in domstring name) raises (idbdatabaseexception); any put (in any value, in optional any key) raises (idbdatabaseexception); ...
... keypath readonly domstring the key path of this object store.
... idbindexsync createindex ( in domstring name, in domstring keypath, in optional boolean unique ); parameters name the name of a new index.
... keypath the key path used by the new index.
SVGGeometryElement.getPointAtLength() - Web APIs
the svggeometryelement.getpointatlength() method returns the point at a given distance along the path.
... note: this method was originally part of the svgpathelement interface.
... syntax dompoint someelement.getpointatlength(float distance); parameters distance a float referring to the distance along the path.
... return value a dompoint indicating the point at a given distance along the path.
Using XMLHttpRequest - Web APIs
there are four primary ways of analyzing this xml document: using xpath to address (or point to) parts of it.
...*/, "yourpage.html"); oreq.onload = getheadertime; oreq.send(); do something when last modified date changes let's create two functions: function getheadertime () { var nlastvisit = parsefloat(window.localstorage.getitem('lm_' + this.filepath)); var nlastmodif = date.parse(this.getresponseheader("last-modified")); if (isnan(nlastvisit) || nlastmodif > nlastvisit) { window.localstorage.setitem('lm_' + this.filepath, date.now()); isfinite(nlastvisit) && this.callback(nlastmodif, nlastvisit); } } function ifhaschanged(surl, fcallback) { var oreq = new xmlhttprequest(); oreq.open("head" /* use head - we only need the h...
...*/, surl); oreq.callback = fcallback; oreq.filepath = surl; oreq.onload = getheadertime; oreq.send(); } and to test: /* let's test the file "yourpage.html"...
... */ ifhaschanged("yourpage.html", function (nmodif, nvisit) { console.log("the page '" + this.filepath + "' has been changed on " + (new date(nmodif)).tolocalestring() + "!"); }); if you want to know if the current page has changed, please read the article about document.lastmodified.
offset-rotate - CSS: Cascading Style Sheets
the offset-rotate css property defines the orientation/direction of the element as it is positioned along the offset-path.
... syntax /* follow the path direction, with optional additional angle */ offset-rotate: auto; offset-rotate: auto 45deg; /* follow the path direction but facing the opposite direction of `auto` */ offset-rotate: reverse; /* keep a constant rotation regardless the position on the path */ offset-rotate: 90deg; offset-rotate: .5turn; auto the element is rotated by the angle of the direction of the offset-path, relative to the positive x-axis.
... formal definition initial valueautoapplies totransformable elementsinheritednocomputed valueas specifiedanimation typeas <angle>, <basic-shape> or <path()> formal syntax [ auto | reverse ] | <angle> examples setting element orientation along its offset path html <div></div> <div></div> <div></div> css div { width: 40px; height: 40px; background: #2bc4a2; margin: 20px; clip-path: polygon(0% 0%, 70% 0%, 100% 50%, 70% 100%, 0% 100%, 30% 50%); animation: move 5000ms infinite alternate ease-in-out; offset-path: path('m20,20 c20,...
...50 180,-10 180,20'); } div:nth-child(1) { offset-rotate: auto; } div:nth-child(2) { offset-rotate: auto 90deg; } div:nth-child(3) { offset-rotate: 30deg; } @keyframes move { 100% { offset-distance: 100%; } } result specifications specification status comment motion path module level 1the definition of 'offset-rotate' in that specification.
<link>: The External Resource Link element - HTML: Hypertext Markup Language
WebHTMLElementlink
to link an external stylesheet, you'd include a <link> element inside your <head> like this: <link href="main.css" rel="stylesheet"> this simple example provides the path to the stylesheet inside an href attribute, and a rel attribute with a value of stylesheet.
... origin-when-cross-origin means that navigating to other origins will be limited to the scheme, the host, and the port, while navigating on the same origin will include the referrer's path.
... unsafe-url means that the referrer will include the origin and the path (but not the fragment, password, or username).
... this case is unsafe because it can leak origins and paths from tls-protected resources to insecure origins.
Referrer-Policy - HTTP
the origin, path, and querystring of the url are sent as a referrer when the protocol security level stays the same (http→http, https→https) or improves (http→https), but isn't sent to less secure destinations (https→http).
... origin-when-cross-origin send the origin, path, and query string when performing a same-origin request, but only send the origin of the document for other cases.
... strict-origin-when-cross-origin send the origin, path, and querystring when performing a same-origin request, only send the origin when the protocol security level stays the same while performing a cross-origin request (https→https), and send no header to any less-secure destinations (https→http).
... unsafe-url send the origin, path, and query string when performing any request, regardless of security.
JavaScript modules - JavaScript
the simplest way to do this is as follows: import { name, draw, reportarea, reportperimeter } from './modules/square.js'; you use the import statement, followed by a comma-separated list of the features you want to import wrapped in curly braces, followed by the keyword from, followed by the path to the module file — a path relative to the site root, which for our basic-modules example would be /js-examples/modules/basic-modules.
... however, we've written the path a bit differently — we are using the dot (.) syntax to mean "the current location", followed by the path beyond that to the file we are trying to find.
... this is much better than writing out the entire relative path each time, as it is shorter, and it makes the url portable — the example will still work if you move it to a different location in the site hierarchy.
... this new functionality allows you to call import() as a function, passing it the path to the module as a parameter.
Web Performance
the performance cost of animating a css property can vary from one property to another, and animating expensive css properties can result in jank as the browser struggles to hit a smooth frame rate.critical rendering paththe critical rendering path is the sequence of steps the browser goes through to convert the html, css, and javascript into pixels on the screen.
... optimizing the critical render path improves render performance.the critical rendering path includes the document object model (dom), css object model (cssom), render tree and layout.css and javascript animation performancebrowsers are able to optimize rendering flows.
...it is a way of shorten the critical rendering path length, what would translate into improved page load times.
...start here if you are a newcomer to performance: web performance: brief overview overview of the web performance learning path.
clip - SVG: Scalable Vector Graphics
WebSVGAttributeclip
the value of auto defines a clipping path along the bounds of the viewport created by the given element.
...use clip-path instead.
... value auto | rect() default value auto animatable yes the value auto defines a clipping path along the bounds of the viewport created by the given element.the value rect() defines a clipping rectangle following the following syntax: rect(<top>, <right>, <bottom>, <left>).
... candidate recommendation deprecates clip property, suggests clip-path as replacement.
marker-end - SVG: Scalable Vector Graphics
for all shape elements, except <polyline> and <path>, the last vertex is the same as the first vertex.
...for <path> elements, for each closed subpath, the last vertex is the same as the first vertex.
... marker-end is only rendered on the final vertex of the path data.
... as a presentation attribute, it can be applied to any element but it has effect only on the following seven elements: <circle>, <ellipse>, <line>, <path>, <polygon>, <polyline>, and <rect> html, body, svg { height: 100%; } <svg viewbox="0 0 120 120" xmlns="http://www.w3.org/2000/svg"> <defs> <marker id="triangle" viewbox="0 0 10 10" refx="1" refy="5" markerunits="strokewidth" markerwidth="10" markerheight="10" orient="auto"> <path d="m 0 0 l 10 5 l 0 10 z" fill="#f00"/> </marker> </defs> <polyline fill="none" stroke="black" points="20,100 40,60 70,80 100,20" marker-end="url(#triangle)"/> </svg> usage notes value none | <mark...
marker-start - SVG: Scalable Vector Graphics
for all shape elements, except <polyline> and <path>, the last vertex is the same as the first vertex.
...for <path> elements, for each closed subpath, the last vertex is the same as the first vertex.
... marker-start is only rendered on the first vertex of the path data.
... as a presentation attribute, it can be applied to any element but it has effect only on the following seven elements: <circle>, <ellipse>, <line>, <path>, <polygon>, <polyline>, and <rect> html, body, svg { height: 100%; } <svg viewbox="0 0 120 120" xmlns="http://www.w3.org/2000/svg"> <defs> <marker id="triangle" viewbox="0 0 10 10" refx="1" refy="5" markerunits="strokewidth" markerwidth="10" markerheight="10" orient="auto"> <path d="m 0 0 l 10 5 l 0 10 z" fill="#f00"/> </marker> </defs> <polyline fill="none" stroke="black" points="20,100 40,60 70,80 100,20" marker-start="url(#triangle)"/> </svg> usage notes value none | <...
method - SVG: Scalable Vector Graphics
WebSVGAttributemethod
the method attribute indicates the method by which text should be rendered along the path of a <textpath> element.
... only one element is using this attribute: <textpath> textpath for <textpath>, method indicates the method by which text should be rendered along the path.
...cursive fonts), the connections may not align properly when text is rendered along the path.
... stretch this value indicates that the character outlines will be converted into paths, and then stretched and possibly warped.
side - SVG: Scalable Vector Graphics
WebSVGAttributeside
the side attribute determines the side of a path the text is placed on (relative to the path direction).
... only one element is using this attribute: <textpath> html, body, svg { height: 100%; } text { font: 25px arial, helvelica, sans-serif; } <svg viewbox="0 0 420 200" xmlns="http://www.w3.org/2000/svg"> <text> <textpath href="#circle1" side="left">text left from the path</textpath> </text> <text> <textpath href="#circle2" side="right">text right from the path</textpath> </text> <circle id="circle1" cx="100" cy="100" r="70" fill="transparent" stroke="silver"/> <circle id="circle2" cx="320" cy="100" r="70" fill="transparent" stroke="silver"/> </svg> usage notes value left | right default value left animatable yes left this value places the text on the left side of the path (relative to the path direction).
... right this value places the text on the right side of the path (relative to the path direction).
... this effectively reverses the path direction.
text-anchor - SVG: Scalable Vector Graphics
has an initial current text position, which represents the point in the user coordinate system resulting from (depending on context) application of the x and y attributes on the <text> element, any x or y attribute values on a <tspan>, <tref> or <altglyph> element assigned explicitly to the first rendered character in a text chunk, or determination of the initial current text position for a <textpath> element.
... as a presentation attribute, it can be applied to any element but it has effect only on the following five elements: <altglyph>, <text>, <textpath>, <tref>, and <tspan> html, body, svg { height: 100%; } <svg viewbox="0 0 120 120" xmlns="http://www.w3.org/2000/svg"> <!-- materialisation of anchors --> <path d="m60,15 l60,110 m30,40 l90,40 m30,75 l90,75 m30,110 l90,110" stroke="grey" /> <!-- anchors in action --> <text text-anchor="start" x="60" y="40">a</text> <text text-anchor="middle" x="60" y="75">a</text> <text text-anchor="end" x="60" y="110">a</text> <!-- materialisation of anchors --> <circle cx="60" cy="40" r="3" fill="red" /> <circle cx="60" cy="75" r="3" fill="red" /> <circle ...
...(for text on a path, conceptually the text string is first laid out in a straight line.
...then, the text string is mapped onto the path with this midpoint placed at the current text position.) end the rendered characters are shifted such that the end of the resulting rendered text (final current text position before applying the text-anchor property) is at the initial current text position.
vector-effect - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following ten elements: <circle>, <ellipse>, <foreignobject>, <image>, <line>, <path>, <polygon>, <polyline>, <rect>, <text>, <textpath> <tspan>, and <use> usage notes value none | non-scaling-stroke | non-scaling-size | non-rotation | fixed-position default value none animatable yes none this value specifies that no vector effect shall be applied, i.e.
...normally stroking involves calculating stroke outline of the shapeʼs path in current user coordinate system and filling that outline with the stroke paint (color or gradient).
... example example: vector-effect="non-scaling-stroke" <svg viewbox="0 0 500 240"> <!-- normal --> <path d="m10,20l40,100l39,200z" stroke="black" stroke-width="2px" fill="none"></path> <!-- scaled --> <path transform="translate(100,0)scale(4,1)" d="m10,20l40,100l39,200z" stroke="black" stroke-width="2px" fill="none"></path> <!-- fixed--> <path vector-effect="non-scaling-stroke" transform="translate(300,0)scale(4,1)" d="m10,20l40,100l39,200z" stroke="black" stroke-width="2px" fi...
...ll="none"></path> </svg> result specifications specification status comment scalable vector graphics (svg) 2the definition of 'vector-effect' in that specification.
visibility - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following nineteen elements: <a>, <altglyph>, <audio>, <canvas>, <circle>, <ellipse>, <foreignobject>, <iframe>, <image>, <line>, <path>, <polygon>, <polyline>, <rect>, <text>, <textpath>, <tref>, <tspan>, <video> html, body, svg { height: 100%; } <svg viewbox="0 0 220 120" xmlns="http://www.w3.org/2000/svg"> <rect x="10" y="10" width="200" height="100" stroke="black" stroke-width="5" fill="transparent" /> <g stroke="seagreen" stroke-width="5" fill="skyblue"> <rect x="20" y="20" width="80" height="80" visibil...
...it may receive pointer events depending on the pointer-events attribute, may receive focus depending on the tabindex attribute, contributes to bounding box calculations and clipping paths, and does affect text layout.
... example the following example toggles the css visibility of the svg image path.
... html <button id="nav-toggle-button" > <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" class="button-icon"> <path d="m16.59 8.59l12 13.17 7.41 8.59 6 10l6 6 6-6z" /> <path d="m12 8l-6 6 1.41 1.41l12 10.83l4.59 4.58l18 14z" class="invisible" /> <path d="m0 0h24v24h0z" fill="none" /> </svg> <span> click me </span> </button> css svg { display: inline !important; } span { vertical-align: 50%; } button { line-height: 1em; } .invisible { visibility: hidden; } javascript document.queryselector("button").addeventlistener("click", function (evt) { this.queryselector("svg > path:nth-of-type(1)").classlist.toggle("invisible"); this.queryselector("svg > path:nth-of-type(2)").classlist.toggle("invisible"); }); specifications...
<hatch> - SVG: Scalable Vector Graphics
WebSVGElementhatch
the <hatch> svg element is used to fill or stroke an object using one or more pre-defined paths that are repeated at fixed intervals in a specified direction to cover the areas to be painted.
...paths are defined by <hatchpath> elements.
... usage context categoriesnever-rendered element, paint server elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements<hatchpath>, <script>, <style> attributes global attributes core attributes global event attributes presentation attributes style attributes specific attributes x y pitch rotate hatchunits hatchcontentunits transform href dom interface this element implements the svghatchelement interface.
... example svg <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg"> <defs> <hatch id="hatch" hatchunits="userspaceonuse" pitch="5" rotate="135"> <hatchpath stroke="#a080ff" stroke-width="2"/> </hatch> </defs> <rect fill="url(#hatch)" stroke="black" stroke-width="2" x="10%" y="10%" width="80%" height="80%" /> </svg> result ...
<marker> - SVG: Scalable Vector Graphics
WebSVGElementmarker
the <marker> element defines the graphic that is to be used for drawing arrowheads or polymarkers on a given <path>, <line>, <polyline> or <polygon> element.
... html,body,svg { height:100% } <svg viewbox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"> <defs> <!-- arrowhead marker definition --> <marker id="arrow" viewbox="0 0 10 10" refx="5" refy="5" markerwidth="6" markerheight="6" orient="auto-start-reverse"> <path d="m 0 0 l 10 5 l 0 10 z" /> </marker> <!-- simple dot marker definition --> <marker id="dot" viewbox="0 0 10 10" refx="5" refy="5" markerwidth="5" markerheight="5"> <circle cx="5" cy="5" r="5" fill="red" /> </marker> </defs> <!-- coordinate axes with a arrowhead in both direction --> <polyline points="10,10 10,90 90,90" fill="none" stroke="black" marker-start="url(...
... value type: <list-of-numbers> ; default value: none; animatable: yes global attributes core attributes most notably: id, tabindex styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, a...
...red, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriescontainer elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specifications specification status comment svg markersthe definition of '<marker>' in that specification.
SVG element reference - SVG: Scalable Vector Graphics
WebSVGElement
svg elements a to z a <a> <animate> <animatemotion> <animatetransform> c <circle> <clippath> <color-profile> d <defs> <desc> <discard> e <ellipse> f <feblend> <fecolormatrix> <fecomponenttransfer> <fecomposite> <feconvolvematrix> <fediffuselighting> <fedisplacementmap> <fedistantlight> <fedropshadow> <feflood> <fefunca> <fefuncb> <fefuncg> <fefuncr> <fegaussianblur> <feimage> <femerge> <femergenode> <femorphology> <feoffset> <fepointlight> <fespecularlighting> <fespotli...
...ght> <fetile> <feturbulence> <filter> <foreignobject> g <g> h <hatch> <hatchpath> i <image> l <line> <lineargradient> m <marker> <mask> <mesh> <meshgradient> <meshpatch> <meshrow> <metadata> <mpath> p <path> <pattern> <polygon> <polyline> r <radialgradient> <rect> s <script> <set> <solidcolor> <stop> <style> <svg> <switch> <symbol> t <text> <textpath> <title> <tspan> u <unknown> <use> v <view> svg elements by category animation elements <animate>, <animatecolor>, <animatemotion>, <animatetransform>, <discard>, <mpath>, <set> basic shapes <circle>, <ellipse>, <line>, <polygon>, <polyline>, <rect> container elements <a>, <defs>, <g>, <marker>, <mask>, <missing-glyph>, <pattern>, <svg>, <switch>, <symbol>,...
...egaussianblur>, <feimage>, <femerge>, <femergenode>, <femorphology>, <feoffset>, <fespecularlighting>, <fetile>, <feturbulence> font elements <font>, <font-face>, <font-face-format>, <font-face-name>, <font-face-src>, <font-face-uri>, <hkern>, <vkern> gradient elements <lineargradient>, <meshgradient>, <radialgradient>, <stop> graphics elements <circle>, <ellipse>, <image>, <line>, <mesh>, <path>, <polygon>, <polyline>, <rect>, <text>, <use> graphics referencing elements <mesh>, <use> light source elements <fedistantlight>, <fepointlight>, <fespotlight> never-rendered elements <clippath>, <defs>, <hatch>, <lineargradient>, <marker>, <mask>, <meshgradient>, <metadata>, <pattern>, <radialgradient>, <script>, <style>, <symbol>, <title> paint server elements <hatch>, <lineargradient>...
..., <meshgradient>, <pattern>, <radialgradient>, <solidcolor> renderable elements <a>, <circle>, <ellipse>, <foreignobject>, <g>, <image>, <line>, <mesh>, <path>, <polygon>, <polyline>, <rect>, <svg>, <switch>, <symbol>, <text>, <textpath>, <tspan>, <unknown>, <use> shape elements <circle>, <ellipse>, <line>, <mesh>, <path>, <polygon>, <polyline>, <rect> structural elements <defs>, <g>, <svg>, <symbol>, <use> text content elements <altglyph>, <altglyphdef>, <altglyphitem>, <glyph>, <glyphref>, <textpath>, <text>, <tref>, <tspan> text content child elements <altglyph>, <textpath>, <tref>, <tspan> uncategorized elements <clippath>, <color-profile>, <cursor>, <filter>, <foreignobject>, <hatchpath>, <meshpatch>, <meshrow>, <script>, <style>, <view> obsolete and deprecated elements war...
<xsl:stylesheet> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:stylesheet> element (or the equivalent <xsl:transform> element) is the outermost element of a stylesheet.
... default-collation specifies the default collation used by all xpath expressions appearing in attributes or text value templates that have the element as an ancestor, unless overridden by another default-collation attribute on an inner element.
... xpath-default-namespace specifies the namespace that will be used if the element name is unprefixed or an unprefixed type name within an xpath expression.
... xslt 2.0 added the attributes xpath-default-namespace, default-validation, default-collation, and input-type-annotations and made all attributes except version optional.
XSLT: Extensible Stylesheet Language Transformations
WebXSLT
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes extensible stylesheet language transformations (xslt) is an xml-based language used, in conjunction with specialized processing software, for the transformation of xml documents.
... xslt & xpath tutorial the topxml xslt tutorial introduces you to the basics of xslt concepts, syntax, and programming.
... this extensive introduction to xslt and xpath assumes no prior knowledge of the technologies and guides the reader through background, context, structure, concepts and introductory terminology.
... mailing list newsgroup rss feed related topics xml, xpath, xquery ...
remote/parent - Archive of obsolete content
you can use an absolute path to the module or a relative path.
... if you use a relative path, you must use the module parameter.
...to use a relative path you must pass the module parameter.
ui/button/action - Archive of obsolete content
you can specify this in one of three ways: as a resource:// url pointing at an icon file in your add-on's "data" directory, typically constructed using self.data.url(iconfile) as a relative path: a string in the form "./iconfile", where "iconfile" is a relative path to the icon file beginning in your add-on's "data" directory as an object, or dictionary of key-value pairs.
...each key-value pair specifies an icon: each value specifies an image file as a resource:// url or relative path.
... icon the button's icon or icons, as a url, relative path, or object containing a set of key-value pairs.
ui/button/toggle - Archive of obsolete content
you can specify this in one of three ways: as a resource:// url pointing at an icon file in your add-on's "data" directory, typically constructed using self.data.url(iconfile) as a relative path: a string in the form "./iconfile", where "iconfile" is a relative path to the icon file beginning in your add-on's "data" directory as an object, or dictionary of key-value pairs.
...each key-value pair specifies an icon: each value specifies an image file as a resource:// url or relative path.
... icon the button's icon or icons, as a url, relative path, or object containing a set of key-value pairs.
cfx to jpm - Archive of obsolete content
requiring local modules suppose your add-on is structured into separate modules: my-addon lib main.js utils.js when you want to use the "utils" module in "main.js", you should use a path relative to "main.js", and prefix the path with "./" to indicate that it's a relative path: var utils = require("./utils"); however, with cfx you are also allowed to omit the "./": var utils = require("utils"); // this will not work with jpm!
... with jpm, you must specify the path to "my-addon" explicitly, using a relative path: var my_addon = require("../lib/my-addon"); third-party modules the sdk has always supported third-party modules: developers can write their own modules that extend the sdk's apis or add new apis, and other add-on developers can make use of these modules in the same way that they use the sdk's built-in modules.
... permanently removed options jpm has dropped support for: --extra-packages --use-config --package-path --pkgdir --no-strip-xpi --harness-option --manifest-overload --output-file --templatedir --keydir --profiledir --overload-modules --static-args --app --no-run --addons --e10s --logfile --dependencies --force-mobile --test-runner-pkg instead of --profiledir and --overload-modules, use --profile and --overload.
package.json - Archive of obsolete content
icon the path to an image file containing the icon for the add-on.
... when using jpm, using a relative path to the data directory (to make it re-usable for add-on html content) does not work.
... the path to an image containing the large icon for the add-on.
Developing for Firefox Mobile - Archive of obsolete content
make sure the "platform-tools" directory is in your path.
...then execute jpm-mobile run with some extra options: jpm-mobile run --adb /path/to/adb in the command shell, you should see something like: launching mobile application with intent name org.mozilla.fennec pushing the addon to your device starting: intent { act=android.activity.main cmp=org.mozilla.fennec/.app (has extras) } --------- beginning of /dev/log/main --------- beginning of /dev/log/system could not read chrome manifest 'file:///data/data/org.mozilla.fennec/chrom...
... running jpm-mobile test is identical: jpm-mobile test --adb /path/to/adb packaging mobile add-ons to package a mobile add-on as an xpi, use the command: jpm xpi actually installing the xpi on the device is a little tricky.
Canvas code snippets - Archive of obsolete content
{ if (typeof canvas === 'string') { canvas = document.getelementbyid(canvas); } if (!(this instanceof canvas2dcontext)) { return new canvas2dcontext(canvas); } this.context = this.ctx = canvas.getcontext('2d'); if (!canvas2dcontext.prototype.arc) { canvas2dcontext.setup.call(this, this.ctx); } } canvas2dcontext.setup = function() { var methods = ['arc', 'arcto', 'beginpath', 'beziercurveto', 'clearrect', 'clip', 'closepath', 'drawimage', 'fill', 'fillrect', 'filltext', 'lineto', 'moveto', 'quadraticcurveto', 'rect', 'restore', 'rotate', 'save', 'scale', 'settransform', 'stroke', 'strokerect', 'stroketext', 'transform', 'translate']; var gettermethods = ['createpattern', 'drawfocusring', 'ispointinpath', 'measuretext', // drawfocusring not currently s...
... saving a canvas image to a file the following function accepts a canvas object and a destination file path string.
... function savecanvas(canvas, path, type, options) { return task.spawn(function *() { var reader = new filereader; var blob = yield new promise(accept => canvas.toblob(accept, type, options)); reader.readasarraybuffer(blob); yield new promise(accept => { reader.onloadend = accept }); return yield os.file.writeatomic(path, new uint8array(reader.result), { tmppath: path + '.tmp' }); }); } loading a remote page onto a canvas element the following class first creates a hidden iframe element and attaches a listener to the frame's load event.
Inline options - Archive of obsolete content
this method does not require you to create a chrome.manifest and set it's path.
...this requires that you register a content path in the chrome.manifest.
... you must also specify the optionstype as 2: <em:optionsurl>chrome://myaddon/content/name_of_my_file_to_use_for_inline_opts.xul</em:optionsurl> <em:optionstype>2</em:optionstype> your chrome.manifest file should contain the following, otherwise the path chrome://myaddon/content/name_of_my_file_to_use_for_inline_opts.xul will not exist content myaddon ./ this method allows you to maintain compatibility with previous versions of firefox by adding an override to your chrome.manifest: ...
How Thunderbird and Firefox find their configuration files - Archive of obsolete content
here is an example of what this may look like: [general] startwithlastprofile=1 [profile0] name=default isrelative=1 path=profiles/default.uda if you want to point this to a location of your choice (for example h:\thunderbird), you need to perform to changes: set isrelative to be 0 update the path to point to the desired place.
... note: for absolute paths thunderbird uses dos'ish backslashes (\) rather than unixish slashes (/).
... you'd obtain a file such as the following: [general] startwithlastprofile=1 [profile0] name=default isrelative=0 path=h:\thunderbird a discussion about this file can be found here ...
Dehydra Function Reference - Archive of obsolete content
gcc command line -fplugin=/path/to/gcc_dehydra.so -fplugin-arg-gcc_dehydra=/path/to/your/script.js callback functions the following functions may be provided by the analysis script and will be called by dehydra while compiling.
...the default namespace is this the directories in sys.include_path are searched for the file, and the current working directory is searched last.
...builtin objects sys this.sys is a container for miscellaneous properties exposes by dehydra sys.gcc_version is a gcc version string sys.include_path exposes the search path used by include().
jspage - Archive of obsolete content
h($type(c)){case"object":b={};for(var e in c){b[e]=$unlink(c[e]); }break;case"hash":b=new hash(c);break;case"array":b=[];for(var d=0,a=c.length;d<a;d++){b[d]=$unlink(c[d]);}break;default:return c;}return b;}var browser=$merge({engine:{name:"unknown",version:0},platform:{name:(window.orientation!=undefined)?"ipod":(navigator.platform.match(/mac|win|linux/i)||["other"])[0].tolowercase()},features:{xpath:!!(document.evaluate),air:!!(window.runtime),query:!!(document.queryselector)},plugins:{},engines:{presto:function(){return(!window.opera)?false:((arguments.callee.caller)?960:((document.getelementsbyclassname)?950:925)); },trident:function(){return(!window.activexobject)?false:((window.xmlhttprequest)?((document.queryselectorall)?6:5):4);},webkit:function(){return(navigator.taintenabled)?false:(...
...(browser.features.xpath)?((browser.features.query)?525:420):419); },gecko:function(){return(!document.getboxobjectfor&&window.mozinnerscreenx==null)?false:((document.getelementsbyclassname)?19:18);}}},browser||{});browser.platform[browser.platform.name]=true; browser.detect=function(){for(var b in this.engines){var a=this.engines[b]();if(a){this.engine={name:b,version:a};this.engine[b]=this.engine[b+a]=true; break;}}return{name:b,version:a};};browser.detect();browser.request=function(){return $try(function(){return new xmlhttprequest();},function(){return new activexobject("msxml2.xmlhttp"); },function(){return new activexobject("microsoft.xmlhttp");});};browser.features.xhr=!!(browser.request());browser.plugins.flash=(function(){var a=($try(function(){return navigator.plugins["shockwave flash...
... null;},decode:function(string,secure){if($type(string)!="string"||!string.length){return null;}if(secure&&!(/^[,:{}\[\]0-9.\-+eaeflnr-u \n\r\t]*$/).test(string.replace(/\\./g,"@").replace(/"[^"\\\n\r]*"/g,""))){return null; }return eval("("+string+")");}});native.implement([hash,array,string,number],{tojson:function(){return json.encode(this);}});var cookie=new class({implements:options,options:{path:false,domain:false,duration:false,secure:false,document:document},initialize:function(b,a){this.key=b; this.setoptions(a);},write:function(b){b=encodeuricomponent(b);if(this.options.domain){b+="; domain="+this.options.domain;}if(this.options.path){b+="; path="+this.options.path; }if(this.options.duration){var a=new date();a.settime(a.gettime()+this.options.duration*24*60*60*1000);b+="; expires="+...
Overview of how downloads work - Archive of obsolete content
are all part of the second codepath.
... this document describes both codepaths (see below for the second one).
...get the .dia file here: mozilla_downloads_path2.dia original document information author: christian biesinger ...
Standalone XPCOM - Archive of obsolete content
this should have been installed in your bin/components directory to run the test, cd to your bin/ directory setenv ld_library_path .
... ./nstestsample: error in loading shared libraries: libxpcom.so: cannot open shared object file: no such file or directory ld_library_path not set.
... to fix, setenv ld_library_path .
Windows Install - Archive of obsolete content
// this function verifies disk space in kilobytes function verifydiskspace(dirpath, spacerequired) { var spaceavailable; // get the available disk space on the given path spaceavailable = filegetdiskspaceavailable(dirpath); // convert the available disk space into kilobytes spaceavailable = parseint(spaceavailable / 1024); // do the verification if(spaceavailable < spacerequired) { logcomment("insufficient disk space: " + dirpath); logcomment(" required : " + sp...
... winreg.setrootkey(winreg.hkey_current_user) ;// current_user subkey = "software\\microsoft\\windows\\currentversion\\runonce" ; winreg.createkey(subkey,""); valname = "ren8dot3"; value = fprogram + "ren8dot3.exe " + ftemp + "ren8dot3.ini"; err = winreg.setvaluestring(subkey, valname, value); } } function prepareren8dot3(listlongfilepaths) { var ftemp = getfolder("temporary"); var fprogram = getfolder("program"); var fren8dot3ini = getwinprofile(ftemp, "ren8dot3.ini"); var binicreated = false; var flongfilepath; var sshortfilepath; if(fren8dot3ini != null) { for(i = 0; i < listlongfilepaths.length; i++) { flongfilepath = getfolder(fprogram, listlongfilepaths[i]); sshortfilepath = f...
...ile.windowsgetshortname(flongfilepath); if(sshortfilepath) { fren8dot3ini.writestring("rename", sshortfilepath, flongfilepath); binicreated = true; } } if(binicreated) updatewinreg4ren8dot3() ; } return(0); } // main var srdest; var err; var fprogram; srdest = 449; err = initinstall(prettyname, regname, "6.0.0.2000110801"); logcomment("initinstall: " + err); fprogram = getfolder("program"); logcomment("fprogram: " + fprogram); if(verifydiskspace(fprogram, srdest)) { setpackagefolder(fprogram); err = adddirectory("", "6.0.0.2000110801", "bin", // dir name in jar to extract fprogram, // where to put this file // (returned from getfolder) "", // subdir name to create relative to fprogram ...
windowsGetShortName - Archive of obsolete content
summary returns a path that conforms to the windows 8.3 file naming convention.
...if the path already conforms to 8.3, the return value is null.
... example flongfilepath = getfolder(fprogram, "longfilename.file"); sshortfilepath = file.windowsgetshortname(flongfilepath); if(sshortfilepath) { // do something } ...
initInstall - Archive of obsolete content
package the client version registry pathname for the software (for example: plugins/adobe/acrobat or /royalairways/royalpi/).
...a relative pathname is relative to the netscape 6 namespace.
... a relative pathname must start with plugins/, to be relative to the plug-ins portion of that namespace or java/download/, to be relative to the java portion.
registerChrome - Archive of obsolete content
method of install object syntax int registerchrome( switch, srcdir, xpipath); parameters the registerchrome method has the following parameters: switch switch is the chrome switch indicating what type of file is being registered.
... xpipath xpipath is the path within the xpi in where the contents.rdf file defining the chrome is located.
...in this case, registerchrome does not require a path inside the archive, as it does now in order to locate the more flexible contents.rdf format of installation archives.
Uploading and Downloading Files - Archive of obsolete content
to add a file field to the data you use a file object that an extension can construct from file path.
... the formdata object can then simply be passed to xmlhttprequest: function upload(posturl, fieldname, filepath) { var formdata = new formdata(); formdata.append(fieldname, new file(filepath)); var req = new xmlhttprequest(); req.open("post", posturl); req.onload = function(event) { alert(event.target.responsetext); }; req.send(formdata); } http put you can also upload a file using an http put operation.
... function uploadput(posturl, filepath) { var req = new xmlhttprequest(); req.open("put", posturl); req.setrequestheader("content-type", "text/plain"); req.onload = function(event) { alert(event.target.responsetext); } req.send(new file(filepath)); } in this example, a new input stream is created for a file, and is passed to the xmlhttprequest's send method.
Template Logging - Archive of obsolete content
xpath expression in query could not be parsed for xml datasources, a query attribute has an xpath expression that is not valid.
... xpath expression in <assign> could not be parsed </assign> for xml datasources, an <assign> element has an xpath expression that is not valid.
... xpath expression in <binding> could not be parsed for xml datasources, a <binding> element has an xpath expression that is not valid.
Getting started with XULRunner - Archive of obsolete content
you need to move your existing chrome.manifest to the application root folder, remembering to update the relative paths within the file.
... windows from a windows command prompt opened to the myapp folder, we should be able to execute this: c:\path\to\xulrunner.exe application.ini of course, if you opted to install xulrunner then you could simply do ​%programfiles%\xulrunner.exe application.ini or on 64 bit systems ​%programfiles(x86)%\xulrunner.exe application.ini note: you can also install your application when you're finished debugging it.
...installing the application creates an os x application bundle: /library/frameworks/xul.framework/xulrunner-bin --install-app /<path>/<to>/myapp.zip once installed, you can run the application: /library/frameworks/xul.framework/xulrunner-bin "/applications/finkle/testapp.app/contents/resources/application.ini" you may run it without installing (but with the menu bar and dock icon missing) in os x by typing: /library/frameworks/xul.framework/xulrunner-bin "/<full path>/testapp/application.ini" note: the full path is required or a "error: couldn't parse application.ini."-message will be...
XULRunner tips - Archive of obsolete content
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@mozilla.org/ now create a javascript file with the following code and include it in the main window of your application: function startdomi() { // load the window datasource so that browser windows opened subsequent to dom // inspector ...
... on windows: firefox.exe -app path\to\application.ini on linux: firefox -app path/to/application.ini on the mac: /applications/firefox.app/contents/macos/firefox-bin -app /path/to/application.ini note that at least on the mac, you need to use a full path.
... partial paths don't seem to work.
NPN_PostURL - Archive of obsolete content
buf path to local temporary file or data buffer that contains the data to post.
...values: true: post the file whose path is specified in buf, then delete the file.
... to post to a temporary file, set the flag file to true, the buffer buf to the path name string for a file, and len to the length of the path string.
Using SSH to connect to CVS - Archive of obsolete content
setting up cvs to use ssh in your system's environment, make sure thatcvs_rsh is set to whatever your ssh binary is called; a full path is not necessary if ssh is already in your path.
... ms-dos command prompt cygwin for /f "tokens=1,2,3* delims=; " %%a in ('ssh-agent -c') do if "%%a"=="setenv" set %%b=%%c set home=/cygdrive/c/path/to/your/cygwin/home/directory ssh-add ~/.ssh/id_dsa start /b /wait cmd.exe ssh-agent -k exit essentially both sets of commands do the same thing.
...finally, note that ssh-add needs the environment variable home to be set with the cygwin path to your cygwin home directory.
Audio for Web games - Game development
let's create our audio context: // for cross browser compatibility const audiocontext = window.audiocontext || window.webkitaudiocontext; const audioctx = new audiocontext(); now let's select all the <li> elements; later we can harness these elements to give us access to the track file path and each individual play button.
... const trackels = document.queryselectorall('li'); we want to make sure each file has loaded and been decoded into a buffer before we use it, so let's create an async function to allow us to do this: async function getfile(filepath) { const response = await fetch(filepath); const arraybuffer = await response.arraybuffer(); const audiobuffer = await audioctx.decodeaudiodata(arraybuffer); return audiobuffer; } we can then use the await operator when calling this function, which ensures that we can run subsequent code when it has finished executing.
... let's create another async function to set up the sample — we can combine the two async functions in a nice promise pattern to perform further actions when each file is loaded and buffered: async function loadfile(filepath) { const track = await getfile(filepath); return track; } let's also create a playtrack() function, which we can call once a file has been fetched.
Tiles and tilemaps overview - Game development
this set of articles covers the basics of creating tile maps using javascript and canvas (although the same high level techniques could be used in any programming language.) besides the performance gains, tilemaps can also be mapped to a logical grid, which can be used in other ways inside the game logic (for example creating a path-finding graph, or handling collisions) or to create a level editor.
... logic grid: this can be a collision grid, a path-finding grid, etc., depending on the type of game.
...the most common case is to use this logic grid to handle collisions, but other uses are possible as well: character spawning points, detecting whether some elements are placed together in the right way to trigger a certain action (like in tetris or bejeweled), path-finding algorithms, etc.
Create the Canvas and draw on it - Game development
ctx.beginpath(); ctx.rect(20, 40, 50, 50); ctx.fillstyle = "#ff0000"; ctx.fill(); ctx.closepath(); all the instructions are between the beginpath() and closepath() methods.
...try adding this to the bottom of your javascript, saving and refreshing: ctx.beginpath(); ctx.arc(240, 160, 20, 0, math.pi*2, false); ctx.fillstyle = "green"; ctx.fill(); ctx.closepath(); as you can see we're using the beginpath() and closepath() methods again.
...try adding this code to your javascript too: ctx.beginpath(); ctx.rect(160, 10, 100, 40); ctx.strokestyle = "rgba(0, 0, 255, 0.5)"; ctx.stroke(); ctx.closepath(); the code above prints a blue-stroked empty rectangle.
Index - MDN Web Docs Glossary: Definitions of Web-related terms
both of them are part of the critical rendering path which is a series of steps that must happen to properly render a website.
... 121 dominator codingscripting, glossary in graph theory, node a dominates node b if every path from the root node to b passes through a.
... 512 xpath codingscripting, glossary, xml, xpath xpath is a query language that can access sections and content in an xml document.
How do you set up a local testing server? - Learn web development
if the web address path starts with file:// followed by the path to the file on your local hard drive, a local file is being used.
... on the first installer page, make sure you check the "add python 3.xxx to path" checkbox.
... to run php server-side code, launch php's built-in development server: $ cd path/to/your/php/code $ php -s localhost:8000 ...
Images in HTML - Learn web development
the src attribute contains a path pointing to the image you want to embed in the page, which can be a relative or absolute url, in the same way as href attribute values in <a> elements.
... note: you should read a quick primer on urls and paths to refresh your memory on relative and absolute urls before continuing.
... as described above, the spelling of the file or path name might be wrong.
Looping code - Learn web development
t ctx = canvas.getcontext('2d'); let width = document.documentelement.clientwidth; let height = document.documentelement.clientheight; canvas.width = width; canvas.height = height; function random(number) { return math.floor(math.random()*number); } function draw() { ctx.clearrect(0,0,width,height); for (let i = 0; i < 100; i++) { ctx.beginpath(); ctx.fillstyle = 'rgba(255,0,0,0.5)'; ctx.arc(random(width), random(height), random(50), 0, 2 * math.pi); ctx.fill(); } } btn.addeventlistener('click',draw); </script> </body> </html> you don't have to understand all the code for now, but let's look at the part of the code that actually draws the 100 circles: for (let i = 0; i < 100; i++) { ...
...ctx.beginpath(); ctx.fillstyle = 'rgba(255,0,0,0.5)'; ctx.arc(random(width), random(height), random(50), 0, 2 * math.pi); ctx.fill(); } random(x), defined earlier in the code, returns a whole number between 0 and x-1.
... if we weren't using a loop here, we'd have to repeat the following code for every circle we wanted to draw: ctx.beginpath(); ctx.fillstyle = 'rgba(255,0,0,0.5)'; ctx.arc(random(width), random(height), random(50), 0, 2 * math.pi); ctx.fill(); this would get very boring and difficult to maintain very quickly.
Client-side storage - Learn web development
lowing code, below your previous handler: // setup the database tables if this has not already been done request.onupgradeneeded = function(e) { // grab a reference to the opened database let db = e.target.result; // create an objectstore to store our notes in (basically like a single table) // including a auto-incrementing key let objectstore = db.createobjectstore('notes_os', { keypath: 'id', autoincrement:true }); // define what data items the objectstore will contain objectstore.createindex('title', 'title', { unique: false }); objectstore.createindex('body', 'body', { unique: false }); console.log('database setup complete'); }; this is where we define the schema (structure) of our database; that is, the set of columns (or fields) it contains.
... // register service worker to control making site work offline if('serviceworker' in navigator) { navigator.serviceworker .register('/learning-area/javascript/apis/client-side-storage/cache-sw/video-store-offline/sw.js') .then(function() { console.log('service worker registered'); }); } note: the given path to the sw.js file is relative to the site origin, not the javascript file that contains the code.
...the origin is https://mdn.github.io, and therefore the given path has to be /learning-area/javascript/apis/client-side-storage/cache-sw/video-store-offline/sw.js.
Object building practice - Learn web development
drawing the ball first add the following draw() method to the ball()'s prototype: ball.prototype.draw = function() { ctx.beginpath(); ctx.fillstyle = this.color; ctx.arc(this.x, this.y, this.size, 0, 2 * math.pi); ctx.fill(); } using this function, we can tell the ball to draw itself onto the screen, by calling a series of members of the 2d canvas context we defined earlier (ctx).
... the context is like the paper, and now we want to command our pen to draw something on it: first, we use beginpath() to state that we want to draw a shape on the paper.
... last of all, we use the fill() method, which basically states "finish drawing the path we started with beginpath(), and fill the area it takes up with the color we specified earlier in fillstyle." you can start testing your object out already.
Aprender y obtener ayuda - Learn web development
focused thinking is great for concentrating hard on specific subjects, getting into deep problem solving, and improving your mastery of the techniques required — strengthening the neural pathways in your brain where that information is stored.
... it isn't however very good at getting an understanding of "the big picture", and unlocking new neural pathways when you are trying to understand new subjects or solve new problems that you haven't come across before.
... getting practice the more you practice solving a problem, the stronger your brain's neural pathways are in that area, and the easier it becomes to recall the details and the logic of that particular problem.
CSS performance optimization - Learn web development
browsers follow a specific rendering path: paint only occurs after layout, which occurs after the render tree is created, which in turn requires both the dom and the cssom trees.
...media queries are important for a responsive web design and help us optimize a critical rendering path.
... @font-face { font-family: somefont; src: url(/path/to/fonts/somefont.woff) format('woff'); font-weight: 400; font-style: normal; font-display: fallback; } the contain property the contain css property allows an author to indicate that an element and its contents are, as much as possible, independent of the rest of the document tree.
Web performance resources - Learn web development
best practices start with learning the critical rendering path of the browser.
...as we learned in the critical rendering path document, linking css with a tradional link tag with rel="stylesheet" is synchronous and blocks rendering.
... <link rel="stylesheet" href="/path/to/my.css" media="print" onload="this.media='all'"> <noscript><link rel="stylesheet" href="/path/to/my.css"></noscript> the downside with this approach is the flash of unstyled text (fout.) the simplist way to address this is by inlining css that is required for any content that is rendered above the fold, or what you see in the browser viewport before scrolling.
What is web performance? - Learn web development
the critical path.
...the browser follows a well-defined set of steps, and optimizing the critical rendering path to prioritize the display of content that relates to the current user action will lead to significant improvements in content rendering time.
... see critical rendering path for more information.
Learning area release notes - Learn web development
june 2020 our front-end web developer learning pathway is officially launched!
... check it out for an opinionated pathway to follow for learning front-end development!
... also see our hacks post — introducing the mdn web docs front-end developer learning pathway — for more information about the rationale behind it.
Creating reftest-based unit tests
to run all the reftests, go to the directory where you save firefox's source code and run: ./mach reftest if you want to run a particular set of reftests, pass the path as an argument: ./mach reftest path/from/sourcedir/reftest.list and to run a single reftest just pass the path to the test file (not the reference file): ./mach reftest path/from/sourcedir/reftest-name.html there is no reftest equivalent to mach mochitest --keep-open, but temporarily adding the reftest-wait class to a test (or disabling the script that removes it) will keep it open longer.
... <body><strong>hello!</strong></body> </html> step 4 create a file named bar.html with the following: <html><head><title>reftest0001</title> <body><b>hello!</b></body> </html> step 5 create a file named reftest.list with the following: == foo.html bar.html you are now ready to run the test (but first you must go back to the root of firefox's source code tree): $ ./mach reftest path/to/reftest.list 2>&1 | grep reftest reftest pass: file:///users/ray/mozilla-central/path/to/foo.html $ congratulations!
... when we run them, we see: $ ./mach reftest path/to/reftest.txt 2>&1 | grep reftest reftest pass: file:///users/ray/mo/spaces1.html reftest pass: (!=) file:///users/ray/mo/spaces3.html $ fabulous!
ESLint
node.js is not recognized add it to your path environment variable by running path="$path:/path/to/node.js/".
... for example: in windows 10, if you have installed node.js on "c:\nodejs", then the command should look like: export path=$path:/c/nodejs enabling eslint for a new directory remove the directory from .eslintignore (in the base directory of the repository) fix errors that occur when running ./mach eslint path/to/dir, see also the no-undef rules below.
... you'll need to include the following just above it: /* import-globals-from relative/path/to/file.js */ do_check_eq, add_task not defined in a test directory.
Obsolete Build Caveats and Tips
therefore, instead of deleting all these nuggets of information, it's best to collect them all here and remove them from the majority happy path documentation.
... unsupported sdks the windows sdk for windows server 2008 is not supported, and has been found to cause the following problems: breaks the vcvars32.bat file from visual studio 2008 no longer sets the correct path for the .net framework causes an invalid path which breaks the mozilla build if you have the windows server 2008 sdk installed, uninstall it.
... if you do not specify a moz_objdir it will be automatically set to @topsrcdir@/obj-@config_guess@ alternatively, you can run client.mk directly from your objdir, using make -f <path_to_srcdir>/client.mk.
Download
launcherpath string local file path of the application to be used to launch the target file, or null if the file should be launched with the default application associated with the contenttype property or the extension of the target file.
... if the launcherpath property is null, the file will be opened with the default application for the mime type specified in the contenttype property.
... if the launcherpath property is set, the file will be opened with the specified custom application.
JNI.jsm
we will get paths to special folders on fennec (firefox for android) into a javascript variable with readstring().
... this shows how to get the paths to the "pictures" folder: components.utils.import("resource://gre/modules/jni.jsm"); components.utils.import("resource://gre/modules/osfile.jsm"); // because we use os.path.join in this example var my_jenv = null; try { my_jenv = jni.getforthread(); var sig = { environment: 'landroid/os/environment;', string: 'ljava/lang/string;', file: 'ljava/io/file;' }; var environment = jni.loadclass(my_jenv, sig.environment.substr(1, sig.environment.length - 2), { static_fields: [ { name: 'directory_pictures', sig: sig.string } ], static_methods: [ { name:'getexternalstoragedirectory', sig:'()' + sig.file } ] }); jni.loadclass(my_jenv, sig.file.substr(1, sig.file.le...
...ngth - 2), { methods: [ { name:'getpath', sig:'()' + sig.string } ] }); var javafile_dirextstore = environment.getexternalstoragedirectory(); // object { js#obj: cdata } var javastr_dirextstorepath = javafile_dirextstore.getpath(); // object { js#obj: cdata } var jsstr_dirextstorepath = jni.readstring(my_jenv, javastr_dirextstorepath); // "/mnt/sdcard" var jsstr_dirpicsname = jni.readstring(my_jenv, environment.directory_pictures); // "pictures" var jsstr_dirpics = os.path.join(jsstr_dirextstorepath, jsstr_dirpicsname); // "/mnt/sdcard/pictures" } finally { if (my_jenv) { jni.unloadclasses(my_jenv); } } example 2 blah blah blah code here ...
Creating localizable web applications
you can put the locale code as the top-most element of the url's path (e.g.
...you could easily use list($category, $tab, $page) = explode('/', $path); to get this information directly from the url.
...good: $tab_labels = array( "popular" => _('popular'), "recent" => _('recent'), "all" => _('all'), "my" => _('my'), "favorites" => _('favorites') ); list($category, $tab, $page) = explode('/', $path); if ($tab == 'popular') { // $tab is always english // ....
Extras
style="stop-color:rgb(255,0,0); stop-opacity:.8;"/> </radialgradient> </defs> <g transform="translate(15,15)"> <g> <animatetransform attributename="transform" attributetype="xml" type="rotate" from="360" to="0" dur="15s" repeatcount="indefinite"/> <g transform="translate(-15, -15)"> <path fill="url(#radgrad1)" d="m 15 0 l 20 10 l 30 15 l 20 20 l 15 30 l 10 20 l 0 15 l 10 10"/> </g> </g> </g> </svg> </mtext> </mpadded> </msqrt> <mo>=</mo> <msubsup> <mo>∫</mo> <mn>0</mn> <mfrac> <mi>π</mi> <mn>2</mn> </mfrac> </msubsup> <msup> <mi>θ</mi> <mtext> <svg width="15px" height="15px"> <defs> <radialgradient id="radgrad2" cx="50%" cy="50%" ...
...r="50%" fx="50%" fy="50%"> <stop offset="0%" style="stop-color:rgb(255,255,255); stop-opacity:1;"/> <stop offset="100%" style="stop-color:rgb(0,0,255); stop-opacity:.9;"/> </radialgradient> </defs> <g> <animatemotion path="m0,0 l3,0 l2,5 l5,5 l0,4 l5,2 z" begin="0s" dur="0.5s" repeatcount="indefinite"/> <circle fill="url(#radgrad2)" r="5px" cx="5px" cy="5px"/> </g> </svg> </mtext> </msup> <mrow> <mo>â…†</mo> <mi>θ</mi> </mrow> </math> <div style="width: 300px; margin-left: auto; margin-right: auto;"> <svg width="300px" height="250px"> <defs> <lineargradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%"> <stop offset="0%" style="stop-color:rgb(0,0,255);stop-opacity:1"/> <stop offset="100%" style="stop-color:...
...tensions="http://www.w3.org/1998/math/mathml"> <math display="block"> <mrow> <mo>(</mo> <mtable> <mtr> <mtd><mi>cos</mi><mi>θ</mi></mtd> <mtd><mo>−</mo><mi>sin</mi><mi>θ</mi></mtd> </mtr> <mtr> <mtd><mi>sin</mi><mi>θ</mi></mtd> <mtd><mi>cos</mi><mi>θ</mi></mtd> </mtr> </mtable> <mo>)</mo> </mrow> </math> </foreignobject> <text>rotation matrix</text> </switch> </g></g></g> <g> <animatemotion path="m 32,69 c 64,121 100,27 152,42 203,56 239,257 275,161 295,109 144,221 88,214 -2,202 11,35 32,69 z" begin="0s" dur="20s" repeatcount="indefinite"/> <animatetransform attributename="transform" attributetype="xml" type="scale" values="1;2;.5;1" keytimes="0;.25;.75;1" dur="20s" repeatcount="indefinite"/> <circle fill="url(#grad3)" ...
Profile Manager
additionally, you can manually add firefox versions by clicking the "manage firefox versions..." button: each firefox version in the list has the following properties: path, version, and default.
... a dialog will appear that allows you to specify the profile's name, and optionally the profile's path, and the version of firefox (or other application) that will be used with this profile: launching firefox with a profile to launch firefox with a specific profile, select the profile in the main window, and hit the "start firefox" button: firefox will be launched with that profile, and profile manager will terminate.
... properties - shows a dialog that displays the profile's path and last-modified date.
PR_GetFileInfo
gets information about a file with a specified pathname.
... syntax #include <prio.h> prstatus pr_getfileinfo( const char *fn, prfileinfo *info); parameters the function has the following parameters: fn the pathname of the file to get information about.
... description pr_getfileinfo stores information about the file with the specified pathname in the prfileinfo structure pointed to by info.
PR_GetFileInfo64
gets information about a file with a specified pathname.
... syntax #include <prio.h> prstatus pr_getfileinfo64( const char *fn, prfileinfo64 *info); parameters the function has the following parameters: fn the pathname of the file to get information about.
... description pr_getfileinfo64 stores information about the file with the specified pathname in the prfileinfo64 structure pointed to by info.
PR_OpenDir
opens the directory with the specified pathname.
... syntax #include <prio.h> prdir* pr_opendir(const char *name); parameter the function has the following parameter: name the pathname of the directory to be opened.
... description pr_opendir opens the directory specified by the pathname name and returns a pointer to a directory stream (a prdir object) that can be passed to subsequent pr_readdir calls to get the directory entries (files and subdirectories) in the directory.
4.3 Release Notes
release date: 01 april 2009 introduction network security services for java (jss) 4.3 is a minor release with the following new features: sqlite-based shareable certificate and key databases libpkix: an rfc 3280 compliant certificate path validation library pkcs11 needslogin method support hmacsha256, hmacsha384, and hmacsha512 support for all nss 3.12 initialization options jss 4.3 is tri-licensed under mpl 1.1/gpl 2.0/lgpl 2.1.
... new sqlite-based shareable certificate and key databases by prepending the string "sql:" to the directory path passed to configdir parameter for crypomanager.initialize method or using the nss environment variable nss_default_db_type.
... libpkix: an rfc 3280 compliant certificate path validation library (see pkixverify) pk11token.needslogin method (see needslogin) support hmacsha256, hmacsha384, and hmacsha512 (see hmactest.java) support for all nss 3.12 initialization options (see initializationvalues) new ssl error codes (see http://mxr.mozilla.org/security/sour...util/sslerrs.h) ssl_error_unsupported_extension_alert ssl_error_certificate_unobtainable_alert ssl_error_unrecognized_name_alert ssl_error_bad_cert_status_response_alert ssl_error_bad_cert_hash_value_alert new tls cipher suites (see http://mxr.mozilla.org/security/sour...sslsocket.java): tls_rsa_with_camellia_128_cbc_sha tls_dhe_dss_with_camellia_128_cbc_sha tls_dhe_rsa_with_camellia_128_cbc_sha tls_rsa_with_camel...
Build instructions
(the free edition works, and other versions like visual studio 2008 and visual studio 2012 may also work.) use start-shell-msvc2010.bat from mozillabuild to get a bash shell with the path already configured, and execute these instructions from within that bash shell.
...you can install the new assembler as root as follows: yum install binutils220 you can then use the new assembler by adding /usr/libexec/binutils220 to the beginning of your build path.
... this can be done in sh or bash as follows: export path=/usr/libexec/binutils220:$path the following build instructions should work for all platforms (with some platform-specific changes as noted).
Setting up an update server
then run these commands, substituting <obj dir>, <mar output path>, <version> and <channel> appropriately: ./mach package touch "<obj dir>/dist/firefox/precomplete" mar="<obj dir>/dist/host/bin/mar.exe" moz_product_version=<version> mar_channel_id=<channel> ./tools/update-packaging/make_full_update.sh <mar output path> "<obj dir>/dist/firefox" for a local build, <channel> can be default, and <version> can be the value from browser/config/version.txt (or some...
... note: it can be a bit tricky to get the make_full_update.sh script to accept paths with spaces.
...you can use this command with firefox's browser console to determine the update directory: const {fileutils} = chromeutils.import("resource://gre/modules/fileutils.jsm"); fileutils.getdir("updrootd", [], false).path once you have determined the update directory, close firefox, browse to the directory and remove the subdirectory called updates.
Accessing the Windows Registry Using XPCOM
also notice that the path to the key has backslashes escaped, a necessity in javascript and c++ string constants.
...they are: root_key_classes_root — corresponds to hkey_classes_root root_key_current_user — corresponds to hkey_current_user root_key_local_machine — corresponds to hkey_local_machine the second parameter for open() and create() is the path to the key.
...both methods take a relative path and access mode as parameters and return a new object implementing nsiwindowsregkey.
Using XPCOM Components
lasses["@mozilla.org/cookiemanager;1"] .getservice(); cmgr = cmgr.queryinterface(components.interfaces.nsicookiemanager); // called as part of a largerdeleteallcookies() function function finalizecookiedeletions() { for (var c=0; c<deletedcookies.length; c++) { cmgr.remove(deletedcookies[c].host, deletedcookies[c].name, deletedcookies[c].path); } deletedcookies.length = 0; } connecting to components from the interface the mozilla user interface uses javascript that has been given access to xpcom components in the application core with a technology called xpconnect.
...iemanager", ns_get_iid(nsicookiemanager), getter_addrefs(cookiemanager)); if (ns_failed(rv)) return -1; pruint32 len; deletedcookies->getlength(&len); for (int c=0; c<len; c++) cookiemanager->remove(deletedcookies[c].host, deletedcookies[c].name, deletedcookies[c].path, pr_false); xxx: in the original document, there were only the first three parameters to the |remove| call.
...*/ } function finalizecookiedeletions() { for (var c=0; c<deletedcookies.length; c++) { cmgr.remove(deletedcookies[c].host, deletedcookies[c].name, deletedcookies[c].path, false); } deletedcookies.length = 0; } xxx: in the original document, there were only the first three parameters to the |remove| call.
Mozilla internal string guide
we only support utf-8-encoded file paths on *nix, non-path gtk strings are always utf-8 and cocoa and java strings are always utf-16.
...gtk apis take utf-8 for non-file paths.
... in the gecko case, we support only utf-8 file paths outside windows, so all gtk strings are utf-8 for our purposes though file paths received from gtk may not be valid utf-8.
getFile
« xpcom api reference called by the directory service to obtain an nsifile object corresponding for a given standard path location.
... the individual platform implementation of nsidirectoryserviceprovider maps the symbolic path location passed to this function and returns the appropriate nsifile.
...available on all platforms these symbolic names are available on all platforms (although, of course, they may refer to different physical paths on the storage device).
nsILoginManager
hostnames an array of hostname strings in url format without a pathname.
...this argument should be in the origin url format, with no pathname.
...this argument should be in the origin url format, with no pathname.
nsIMemoryMultiReporterCallback
1.0 66 introduced gecko 7.0 inherits from: nsisupports last changed in gecko 7.0 (firefox 7.0 / thunderbird 7.0 / seamonkey 2.4) method overview void callback(in acstring process, in autf8string path, in print32 kind, in print32 units, in print64 amount, in autf8string description, in nsisupports closure); methods callback() called to provide information from a multi-reporter.
...void callback( in acstring process, in autf8string path, in print32 kind, in print32 units, in print64 amount, in autf8string description, in nsisupports closure ); parameters process the value of the process attribute for the memory reporter.
... path the value of the path attribute.
nsIMemoryReporter
path autf8string the path that this memory usage should be reported under.
... paths are delimited with '/' characters to allow a hierarchy of memory to be displayed in about:memory.
... as of gecko 6.0, the path should start with "explicit/" if the memory report accounts for all memory reported under sub-paths.
nsIMsgIncomingServer
name, in acstring newname); void performbiff(in nsimsgwindow amsgwindow); void performexpand(in nsimsgwindow amsgwindow); void removefiles(); void setboolattribute(in string name, in boolean value); void setboolvalue(in string attr, in boolean value); void setcharattribute(in string name, in acstring value); void setcharvalue(in string attr, in acstring value); void setdefaultlocalpath(in nsilocalfile adefaultlocalpath); void setfilevalue(in string relpref, in string abspref, in nsilocalfile avalue); void setfilterlist(in nsimsgfilterlist afilterlist); void setintattribute(in string name, in long value); void setintvalue(in string attr, in long value); void setunicharattribute(in string name, in astring value); void setunicharvalue(in string attr, in astring value);...
... limitofflinemessagesize boolean localpath nsilocalfile localstoretype acstring the schema for the local mail store, such as "mailbox", "imap", or "news" used to construct uris.
...void setcharattribute( in string name, in acstring value ); parameters name missing description value missing description exceptions thrown missing exception missing description setcharvalue() void setcharvalue( in string attr, in acstring value ); parameters attr missing description value missing description exceptions thrown missing exception missing description setdefaultlocalpath() void setdefaultlocalpath( in nsilocalfile adefaultlocalpath ); parameters adefaultlocalpath missing description exceptions thrown missing exception missing description setfilevalue() void setfilevalue( in string relpref, in string abspref, in nsilocalfile avalue ); parameters relpref missing description abspref missing description avalue missing description exceptions thrown mi...
nsIZipReader
var zr = cc["@mozilla.org/libjar/zip-reader;1"].createinstance(ci.nsizipreader); cu.import('resource://gre/modules/osfile.jsm'); cu.import('resource://gre/modules/fileutils.jsm'); var reusablestreaminstance = cc['@mozilla.org/scriptableinputstream;1'].createinstance(ci.nsiscriptableinputstream); var pathtoxpitoread = os.path.join(os.constants.path.profiledir, 'extensions', '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); /* console output * "entry" xpcwrappednative_nohelper { queryinterface: queryinterface(), compression: getter, size: getter, realsize: getter, crc32: getter, isdirectory: getter, lastmodifiedtime: getter, issynthetic: getter, permissions: getter, compression: 8 } scratchpad/1:19 */ if (!entry.isdirectory) { ...
...am); var filecontents = reusablestreaminstance.read(entry.realsize); console.log('contenst of file=', filecontents); } else { console.log('is directory, no stream to read'); } } } catch (ex) { console.warn('exception occured = ', ex); if (ex.name == 'ns_error_file_not_found') { services.ww.activewindow.alert('xpi at path does not exist!\n\npath = ' + pathtoxpitoread); } } finally { zr.close(); console.log('zr closed'); } see also nsizipentry nsizipwriter ...
Troubleshooting XPCOM components registration
set nspr_log_modules=nsnativemoduleloader:5 set nspr_log_file=c:\path\to\logfile "c:\program files\mozilla firefox\firefox.exe" examining this log for warning and errors may provide valuable clues why the component failed to load.
... if you have the option, you can manually copy these dependencies to firefox.exe's directory, to windows\system32, or to any directory is the system's path.
... linux-specific hints check if you have missing dependent libraries: from your firefox (/xulrunner) install directory, run "./run-mozilla.sh `which ldd` -r path/to/your/component.so".
Thunderbird Configuration Files
on windows vista/xp/2000, the path is usually %appdata%\thunderbird\profiles\xxxxxxxx.default\, where xxxxxxxx is a random string of 8 characters.
... on windows 95/98/me, the path is usually c:\windows\application data\thunderbird\profiles\xxxxxxxx.default\ on linux, the path is usually ~/.thunderbird/xxxxxxxx.default/ on mac os x, the path is usually ~/library/thunderbird/profiles/xxxxxxxx.default/ %appdata% is a shorthand for the application data path on windows 2000/xp/vista.
...the path examples above refers to the default profile that is automatically created when you start thunderbird for the first time.
Using js-ctypes
examples can be found here: bugzilla :: bug 505907 - support c++ calling from jsctypes library search paths if you specify a full path, that path is used to load the library.
... the current working directory the directories listed in the path environment variable.
... instead of defining the whole path, you may also just give the file name.
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.
... sometimes there's more than one path back from an entry to the top level.
...but swap() was reached by two different paths: both bubblesort() and selectionsort() use it.
CanvasRenderingContext2D.clearRect() - Web APIs
note: be aware that clearrect() may cause unintended side effects if you're not using paths properly.
... make sure to call beginpath() before starting to draw new items after calling clearrect().
... const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // draw yellow background ctx.beginpath(); ctx.fillstyle = '#ff6'; ctx.fillrect(0, 0, canvas.width, canvas.height); // draw blue triangle ctx.beginpath(); ctx.fillstyle = 'blue'; ctx.moveto(20, 20); ctx.lineto(180, 20); ctx.lineto(130, 130); ctx.closepath(); ctx.fill(); // clear part of the canvas ctx.clearrect(10, 10, 120, 100); result specifications specification status comment html living standardthe ...
CanvasRenderingContext2D.lineJoin - Web APIs
examples changing the joins in a path this example applies rounded line joins to a path.
... html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.linewidth = 20; ctx.linejoin = 'round'; ctx.beginpath(); ctx.moveto(20, 20); ctx.lineto(190, 100); ctx.lineto(280, 20); ctx.lineto(280, 150); ctx.stroke(); result comparison of line joins the example below draws three different paths, demonstrating each of the three linejoin options.
... <canvas id="canvas" width="150" height="150"></canvas> var ctx = document.getelementbyid('canvas').getcontext('2d'); var linejoin = ['round', 'bevel', 'miter']; ctx.linewidth = 10; for (let i = 0; i < linejoin.length; i++) { ctx.linejoin = linejoin[i]; ctx.beginpath(); ctx.moveto(-5, 5 + i * 40); ctx.lineto(35, 45 + i * 40); ctx.lineto(75, 5 + i * 40); ctx.lineto(115, 45 + i * 40); ctx.lineto(155, 5 + i * 40); ctx.stroke(); } screenshotlive sample specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.linejoin' in that specification.
Using images - Web APIs
to do this, you can use the convenient image() constructor: var img = new image(); // create new img element img.src = 'myimage.png'; // set source path when this script gets executed, the image starts loading.
...so you need to be sure to use the load event so you don't try this before the image has loaded: var img = new image(); // create new img element img.addeventlistener('load', function() { // execute drawimage statements here }, false); img.src = 'myimage.png'; // set source path if you're only using one external image this can be a good approach, but once you need to track more than one we need to resort to something more clever.
... <html> <body onload="draw();"> <canvas id="canvas" width="180" height="150"></canvas> </body> </html> function draw() { var ctx = document.getelementbyid('canvas').getcontext('2d'); var img = new image(); img.onload = function() { ctx.drawimage(img, 0, 0); ctx.beginpath(); ctx.moveto(30, 96); ctx.lineto(70, 66); ctx.lineto(103, 76); ctx.lineto(170, 15); ctx.stroke(); }; img.src = 'https://mdn.mozillademos.org/files/5395/backdrop.png'; } the resulting graph looks like this: screenshotlive sample scaling the second variant of the drawimage() method adds two new parameters and lets us place scaled images on the canvas.
HTMLAnchorElement - Web APIs
htmlhyperlinkelementutils.pathname is a usvstring representing the path name component, if any, of the referenced url.
... technically, the url-related properties, media, host, hostname, pathname, port, protocol, search, and hash, have been moved to the htmlhyperlinkelementutils mixin, and htmlanchorelement implements this mixin.
... the following properties have been added: hash, host, hostname, media, pathname, port, protocol, rellist, search, and text.
HTMLAreaElement - Web APIs
htmlhyperlinkelementutils.pathname is a usvstring containing the path name component, if any, of the referenced url.
... technically, the url-related properties, media, host, hostname, pathname, port, protocol, search, and hash, have been moving to the htmlhyperlinkelementutils mixin, and htmlareaelement implements this mixin.
... the following properties have been added: rel, rellist, media, hreflang, type, host, hostname, pathname, port, protocol, search, and hash.
HTMLCanvasElement.toBlob() - Web APIs
var canvas = document.getelementbyid('canvas'); var d = canvas.width; ctx = canvas.getcontext('2d'); ctx.beginpath(); ctx.moveto(d / 2, 0); ctx.lineto(d, d); ctx.lineto(0, d); ctx.closepath(); ctx.fillstyle = 'yellow'; ctx.fill(); function blobcallback(iconname) { return function(b) { var a = document.createelement('a'); a.textcontent = 'download'; document.body.appendchild(a); a.style.display = 'block'; a.download = iconname + '.ico'; a.href = window.url.createobjecturl(b); } } c...
... var canvas = document.getelementbyid('canvas'); var d = canvas.width; ctx = canvas.getcontext('2d'); ctx.beginpath(); ctx.moveto(d / 2, 0); ctx.lineto(d, d); ctx.lineto(0, d); ctx.closepath(); ctx.fillstyle = 'yellow'; ctx.fill(); function blobcallback(iconname) { return function(b) { var r = new filereader(); r.onloadend = function () { // r.result contains the arraybuffer.
... cu.import('resource://gre/modules/osfile.jsm'); var writepath = os.path.join(os.constants.path.desktopdir, iconname + '.ico'); var promise = os.file.writeatomic(writepath, new uint8array(r.result), {tmppath:writepath + '.tmp'}); promise.then( function() { console.log('successfully wrote file'); }, function() { console.log('failure writing file') } ); }; r.readasarraybuffer(b); } } canvas.toblob(blobcallback('passthisstring'), 'image/vnd.microsoft.icon', '-moz-parse-options:format=bmp;bpp=32'); specifications specification status comment html living standardthe definition of 'htmlcanvaselement.toblob' in that specifica...
IDBIndex - Web APIs
WebAPIIDBIndex
idbindex.keypath read only the key path of this index.
... idbindex.multientry read only affects how the index behaves when the result of evaluating the index's key path yields an array.
... nochrome android no support nofirefox android full support 43opera android no support nosafari ios no support nosamsung internet android no support nokeypathchrome full support 24 full support 24 no support 23 — 24prefixed prefixed implemented with the vendor prefix: webkitedge full support 12firefox full support 16 full support ...
IDBObjectStore - Web APIs
idbobjectstore.keypath read only the key path of this object store.
... not // been created before, or a new version number has been // submitted via the window.indexeddb.open line above dbopenrequest.onupgradeneeded = function(event) { var db = event.target.result; db.onerror = function(event) { note.innerhtml += '<li>error loading database.</li>'; }; // create an objectstore for this database var objectstore = db.createobjectstore("todolist", { keypath: "tasktitle" }); // define what data items the objectstore will contain objectstore.createindex("hours", "hours", { unique: 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 }); ob...
...a android full support 14safari ios full support 8samsung internet android full support 1.5 full support 1.5 no support 1.5 — 7.0prefixed prefixed implemented with the vendor prefix: webkitkeypathchrome full support 24 full support 24 no support 23 — 57prefixed prefixed implemented with the vendor prefix: webkitedge full support 12firefox full support 16 full support ...
compareVersion - Web APIs
method of installtrigger object syntax int compareversion ( string registryname, installversion version); int compareversion ( string registryname, string version); int compareversion ( string registryname, int major, int minor, int release, int build); parameters the compareversion method has the following parameters: registryname the pathname in the client version registry for the component whose version is to be compared.
... this parameter can be an absolute pathname, such as /royalairways/royalsw or a relative pathname, such as plugsin/royalairway/royalsw.
... note that the registry pathname is not the location of the software on the computer; it is the location of information about the software inside the client version registry.
Location - Web APIs
WebAPILocation
anatomy of location html <span id="href" title="href"><span id="protocol" title="protocol">http:</span>//<span id="host" title="host"><span id="hostname" title="hostname">example.org</span>:<span id="port" title="port">8888</span></span><span id="pathname" title="pathname">/foo/bar</span><span id="search" title="search">?q=baz</span><span id="hash" title="hash">#bang</span></span> css html, body {height:100%;} html {display:table; width:100%;} body {display:table-cell; text-align:center; vertical-align:middle; font-family:georgia; font-size:230%; line-height:1em; white-space:nowrap;} [title] {position:relative; display:inline-block; box-siz...
... location.pathname is a usvstring containing an initial '/' followed by the path of the url.
...href = 'https://developer.mozilla.org:8080/search?q=url#search-results-close-container'; console.log(url.href); // https://developer.mozilla.org:8080/search?q=url#search-results-close-container console.log(url.protocol); // https: console.log(url.host); // developer.mozilla.org:8080 console.log(url.hostname); // developer.mozilla.org console.log(url.port); // 8080 console.log(url.pathname); // /search console.log(url.search); // ?q=url console.log(url.hash); // #search-results-close-container console.log(url.origin); // https://developer.mozilla.org:8080 specifications specification status comment html living standardthe definition of 'location' in that specification.
Using Pointer Events - Web APIs
function handlestart(evt) { log("pointerdown."); var el = document.getelementsbytagname("canvas")[0]; var ctx = el.getcontext("2d"); log("pointerdown: id = " + evt.pointerid); ongoingtouches.push(copytouch(evt)); var color = colorfortouch(evt); ctx.beginpath(); ctx.arc(touches[i].pagex, touches[i].pagey, 4, 0, 2 * math.pi, false); // a circle at the start ctx.arc(evt.clientx, evt.clienty, 4, 0, 2 * math.pi, false); // a circle at the start ctx.fillstyle = color; ctx.fill(); } after storing some of the event's processing in the ongoingtouches for later processing, the start point is drawn as a small circle.
... function handlemove(evt) { var el = document.getelementsbytagname("canvas")[0]; var ctx = el.getcontext("2d"); var color = colorfortouch(evt); var idx = ongoingtouchindexbyid(evt.pointerid); log("continuing touch: idx = " + idx); if (idx >= 0) { ctx.beginpath(); log("ctx.moveto(" + ongoingtouches[idx].pagex + ", " + ongoingtouches[idx].pagey + ");"); ctx.moveto(ongoingtouches[idx].pagex, ongoingtouches[idx].pagey); log("ctx.lineto(" + evt.clientx + ", " + evt.clienty + ");"); ctx.lineto(evt.clientx, evt.clienty); ctx.linewidth = 4; ctx.strokestyle = color; ctx.stroke(); ongoingtouches.splice(idx, 1, copytouch(evt)); /...
... function handleend(evt) { log("pointerup"); var el = document.getelementsbytagname("canvas")[0]; var ctx = el.getcontext("2d"); var color = colorfortouch(evt); var idx = ongoingtouchindexbyid(evt.pointerid); if (idx >= 0) { ctx.linewidth = 4; ctx.fillstyle = color; ctx.beginpath(); ctx.moveto(ongoingtouches[idx].pagex, ongoingtouches[idx].pagey); ctx.lineto(evt.clientx, evt.clienty); ctx.fillrect(evt.clientx - 4, evt.clienty - 4, 8, 8); // and a square at the end ongoingtouches.splice(idx, 1); // remove it; we're done } else { log("can't figure out which touch to end"); } } this is very similar to the previous function; the only real differenc...
SVGGeometryElement.getTotalLength() - Web APIs
the svggeometryelement.gettotallength() method returns the user agent's computed value for the total length of the path in user units.
... note: this method was originally part of the svgpathelement interface.
... syntax float someelement.gettotallength(); return value a float indicating the total length of the path in user units.
Touch events - Web APIs
function handlestart(evt) { evt.preventdefault(); console.log("touchstart."); var el = document.getelementbyid("canvas"); var ctx = el.getcontext("2d"); var touches = evt.changedtouches; for (var i = 0; i < touches.length; i++) { console.log("touchstart:" + i + "..."); ongoingtouches.push(copytouch(touches[i])); var color = colorfortouch(touches[i]); ctx.beginpath(); ctx.arc(touches[i].pagex, touches[i].pagey, 4, 0, 2 * math.pi, false); // a circle at the start ctx.fillstyle = color; ctx.fill(); console.log("touchstart:" + i + "."); } } this calls event.preventdefault() to keep the browser from continuing to process the touch event (this also prevents a mouse event from also being delivered).
... function handlemove(evt) { evt.preventdefault(); var el = document.getelementbyid("canvas"); var ctx = el.getcontext("2d"); var touches = evt.changedtouches; for (var i = 0; i < touches.length; i++) { var color = colorfortouch(touches[i]); var idx = ongoingtouchindexbyid(touches[i].identifier); if (idx >= 0) { console.log("continuing touch "+idx); ctx.beginpath(); console.log("ctx.moveto(" + ongoingtouches[idx].pagex + ", " + ongoingtouches[idx].pagey + ");"); ctx.moveto(ongoingtouches[idx].pagex, ongoingtouches[idx].pagey); console.log("ctx.lineto(" + touches[i].pagex + ", " + touches[i].pagey + ");"); ctx.lineto(touches[i].pagex, touches[i].pagey); ctx.linewidth = 4; ctx.strokestyle = color; ctx.stroke(); ...
... { evt.preventdefault(); log("touchend"); var el = document.getelementbyid("canvas"); var ctx = el.getcontext("2d"); var touches = evt.changedtouches; for (var i = 0; i < touches.length; i++) { var color = colorfortouch(touches[i]); var idx = ongoingtouchindexbyid(touches[i].identifier); if (idx >= 0) { ctx.linewidth = 4; ctx.fillstyle = color; ctx.beginpath(); ctx.moveto(ongoingtouches[idx].pagex, ongoingtouches[idx].pagey); ctx.lineto(touches[i].pagex, touches[i].pagey); ctx.fillrect(touches[i].pagex - 4, touches[i].pagey - 4, 8, 8); // and a square at the end ongoingtouches.splice(idx, 1); // remove it; we're done } else { console.log("can't figure out which touch to end"); } } } this is very similar to ...
URL - Web APIs
WebAPIURL
pathname a usvstring containing an initial '/' followed by the path of the url.
... usage notes the constructor takes a url parameter, and an optional base parameter to use as a base if the url parameter is a relative url: const url = new url('../cats', 'http://www.example.com/dogs'); console.log(url.hostname); // "www.example.com" console.log(url.pathname); // "/cats" url properties can be set to construct the url: url.hash = 'tabby'; console.log(url.href); // "http://www.example.com/cats#tabby" urls are encoded according to the rules found in rfc 3986.
... for instance: url.pathname = 'démonstration.html'; console.log(url.href); // "http://www.example.com/d%c3%a9monstration.html" the urlsearchparams interface can be used to build and manipulate the url query string.
Shapes From Images - CSS: Cascading Style Sheets
rather than drawing a path with a complex polygon in css, you can create the shape in a graphics program and then use the path created by the pixels less opaque than a threshold value.
...i use the path to the image file as the value of the shape-outside property.
... you can experiment directly in these live examples, to see how changing the gradient will change the path of your shape.
CSS reference - CSS: Cascading Style Sheets
WebCSSReference
cingborder-start-end-radiusborder-start-start-radiusborder-styleborder-topborder-top-colorborder-top-left-radiusborder-top-right-radiusborder-top-styleborder-top-widthborder-widthbottom@bottom-centerbox-decoration-breakbox-shadowbox-sizingbreak-afterbreak-beforebreak-insidebrightness()ccalc()caption-sidecaret-colorch@character-variantcharacter-variant()@charset:checkedcircle()clamp()clearclipclip-pathcm<color>colorcolor-adjustcolumn-countcolumn-fillcolumn-gapcolumn-rulecolumn-rule-colorcolumn-rule-stylecolumn-rule-widthcolumn-spancolumn-widthcolumnsconic-gradient()containcontentcontrast()<counter>counter-incrementcounter-resetcounter-set@counter-stylecounters()cross-fade()cubic-bezier()::cue::cue-regioncursor<custom-ident>d:defaultdeg<dimension>:dirdirection:disableddisplay<display-box><displa...
...height (@viewport)max-inline-sizemax-widthmax-width (@viewport)max-zoom (@viewport)@mediamin()min-block-sizemin-heightmin-height (@viewport)min-inline-sizemin-widthmin-width (@viewport)min-zoom (@viewport)minmax()mix-blend-modemmmsn@namespacenegative (@counter-style):not:nth-child:nth-last-child:nth-last-of-type:nth-of-type<number>oobject-fitobject-positionoffsetoffset-anchoroffset-distanceoffset-pathoffset-rotate:only-child:only-of-typeopacityopacity():optionalorderorientation (@viewport)@ornamentsornaments()orphans:out-of-rangeoutlineoutline-coloroutline-offsetoutline-styleoutline-widthoverflowoverflow-anchoroverflow-blockoverflow-inlineoverflow-wrapoverflow-xoverflow-yoverscroll-behavioroverscroll-behavior-blockoverscroll-behavior-inlineoverscroll-behavior-xoverscroll-behavior-yppad (@count...
...er-style)paddingpadding-blockpadding-block-endpadding-block-startpadding-bottompadding-inlinepadding-inline-endpadding-inline-startpadding-leftpadding-rightpadding-top@pagepage-break-afterpage-break-beforepage-break-insidepaint()paint-orderpath()pc<percentage>perspectiveperspective()perspective-originplace-contentplace-itemsplace-self::placeholderpointer-eventspolygon()<position>positionprefix (@counter-style)ptpxqqquotesrradradial-gradient()range (@counter-style)<ratio>:read-only:read-writerect()remrepeat()repeating-linear-gradient()repeating-radial-gradient():requiredresize<resolution>revertrgb()rgba():rightright@right-bottom:rootrotaterotate()rotate3d()rotatex()rotatey()rotatez()row-gapsssaturate()scalescale()scale3d()scalex()scaley()scalez():scopescroll-behaviorscroll-marginscroll-margin-b...
animation - CSS: Cascading Style Sheets
WebCSSanimation
ttom: 0; } svg { width: 1.5em; height: 1.5em; } button { width: 27px; height: 27px; background-size: 16px; background-position: center; background-repeat: no-repeat; border-radius: 3px; cursor: pointer; } button.play { background-image: url('data:image/svg+xml;charset=utf-8,%3csvg%20xmlns%3d%22http%3a%2f%2fwww.w3.org%2f2000%2fsvg%22%20viewbox%3d%220%200%2016%2016%22%3e%3cstyle%3epath%20%7bdisplay%3anone%7d%20path%3atarget%7bdisplay%3ablock%7d%3c%2fstyle%3e%3cpath%20id%3d%22play%22%20d%3d%22m3%2c3%20l3%2c13%20l13%2c8%20z%22%20%2f%3e%3cpath%20id%3d%22pause%22%20d%3d%22m5%2c4%20l7%2c4%20l7%2c13%20l5%2c13%20z%20m9%2c4%20l11%2c4%20l11%2c13%20l9%2c13%20z%22%20%2f%3e%3cpath%20id%3d%22restart%22%20d%3d%22m13%2c9%20a5%2c5%2c1%2c1%2c1%2c8%2c4%20l8%2c2%20l12%2c5%20l8%2c8%20l8%2c6%20a3%2...
...c3%2c1%2c1%2c0%2c11%2c9%20a1%2c1%2c1%2c1%2c1%2c13%2c9%20z%22%20%2f%3e%3c%2fsvg%3e#play'); } button.pause { background-image: url('data:image/svg+xml;charset=utf-8,%3csvg%20xmlns%3d%22http%3a%2f%2fwww.w3.org%2f2000%2fsvg%22%20viewbox%3d%220%200%2016%2016%22%3e%3cstyle%3epath%20%7bdisplay%3anone%7d%20path%3atarget%7bdisplay%3ablock%7d%3c%2fstyle%3e%3cpath%20id%3d%22play%22%20d%3d%22m3%2c3%20l3%2c13%20l13%2c8%20z%22%20%2f%3e%3cpath%20id%3d%22pause%22%20d%3d%22m5%2c4%20l7%2c4%20l7%2c13%20l5%2c13%20z%20m9%2c4%20l11%2c4%20l11%2c13%20l9%2c13%20z%22%20%2f%3e%3cpath%20id%3d%22restart%22%20d%3d%22m13%2c9%20a5%2c5%2c1%2c1%2c1%2c8%2c4%20l8%2c2%20l12%2c5%20l8%2c8%20l8%2c6%20a3%2c3%2c1%2c1%2c0%2c11%2c9%20a1%2c1%2c1%2c1%2c1%2c13%2c9%20z%22%20%2f%3e%3c%2fsvg%3e#pause'); } button.restart { background-ima...
...ge: url('data:image/svg+xml;charset=utf-8,%3csvg%20xmlns%3d%22http%3a%2f%2fwww.w3.org%2f2000%2fsvg%22%20viewbox%3d%220%200%2016%2016%22%3e%3cstyle%3epath%20%7bdisplay%3anone%7d%20path%3atarget%7bdisplay%3ablock%7d%3c%2fstyle%3e%3cpath%20id%3d%22play%22%20d%3d%22m3%2c3%20l3%2c13%20l13%2c8%20z%22%20%2f%3e%3cpath%20id%3d%22pause%22%20d%3d%22m5%2c4%20l7%2c4%20l7%2c13%20l5%2c13%20z%20m9%2c4%20l11%2c4%20l11%2c13%20l9%2c13%20z%22%20%2f%3e%3cpath%20id%3d%22restart%22%20d%3d%22m13%2c9%20a5%2c5%2c1%2c1%2c1%2c8%2c4%20l8%2c2%20l12%2c5%20l8%2c8%20l8%2c6%20a3%2c3%2c1%2c1%2c0%2c11%2c9%20a1%2c1%2c1%2c1%2c1%2c13%2c9%20z%22%20%2f%3e%3c%2fsvg%3e#restart'); } .grid { width: 100%; height: 100%; display: flex; background: #eee; font: 1em monospace; } .row { display: flex; flex: 1 auto; flex-direct...
url() - CSS: Cascading Style Sheets
WebCSSurl()
/* simple usage */ url(https://example.com/images/myimg.jpg); url(data:image/png;base64,irxvb0…); url(myfont.woff); url(#idofsvgpath); /* associated properties */ background-image: url("https://mdn.mozillademos.org/files/16761/star.gif"); list-style-image: url('../images/bullet.jpg'); content: url("pdficon.jpg"); cursor: url(mycursor.cur); border-image-source: url(/media/diamonds.png); src: url('fantasticfont.woff'); offset-path: url(#path); mask-image: url("masks.svg#mask1"); /* properties with fallbacks */ cursor: url(poin...
...the following are all valid and equivalent: <css_property>: url("https://example.com/image.png") <css_property>: url('https://example.com/image.png') <css_property>: url(https://example.com/image.png) path references the id of an svg shape -- circle, ellipse, line, path, polygon, polyline, or rect -- using the shape's geometry as the path.
...> <li>item 1</li> <li>item 2</li> <li>item 3</li> </ul> css li::after { content: ' - ' url(https://mdn.mozillademos.org/files/16761/star.gif); } result data-uri html <div class="background"></div> css .background { height: 100vh; } .background { background: yellow; background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='90' height='45'%3e%3cpath d='m10 10h60' stroke='%2300f' stroke-width='5'/%3e%3cpath d='m10 20h60' stroke='%230f0' stroke-width='5'/%3e%3cpath d='m10 30h60' stroke='red' stroke-width='5'/%3e%3c/svg%3e"); } specifications specification status comment css values and units module level 4the definition of 'url()' in that specification.
<area> - HTML: Hypertext Markup Language
WebHTMLElementarea
"origin-when-cross-origin" meaning that navigations to other origins will be limited to the scheme, the host and the port, while navigations on the same origin will include the referrer's path.
... "unsafe-url" meaning that the referrer will include the origin and the path (but not the fragment, password, or username).
... this case is unsafe because it can leak origins and paths from tls-protected resources to insecure origins.
<iframe>: The Inline Frame element - HTML: Hypertext Markup Language
WebHTMLElementiframe
navigations on the same origin will still include the path.
... unsafe-url: the referrer will include the origin and the path (but not the fragment, password, or username).
... this value is unsafe, because it leaks origins and paths from tls-protected resources to insecure origins.
<img>: The Image Embed element - HTML: Hypertext Markup Language
WebHTMLElementimg
the above example shows usage of the <img> element: the src attribute is required, and contains the path to the image you want to embed.
... origin-when-cross-origin: navigating to other origins will limit the included referral data to the scheme, host, and port, while navigating from the same origin will include the full path and query string.
... unsafe-url: the referer header will always include the origin, path and query string, but not the fragment, password, or username.
<input type="image"> - HTML: Hypertext Markup Language
WebHTMLElementinputimage
the path to the image to be displayed is specified in the src attribute.
...sential image input features let's look at a basic example that includes all the essential features you'd need to use (these work exactly the same as they do on the <img> element.): <input id="image" type="image" width="100" height="30" alt="login" src="/static/external/62/62ac2ecddbec0e0b540098c28451e57203e5cab46dfed7ab0115d5a659fcfb7b.png"> the src attribute is used to specify the path to the image you want to display in the button.
...it will also display if the image can't be shown for any reason (for example if the path is misspelled).
<script>: The Script element - HTML: Hypertext Markup Language
WebHTMLElementscript
navigations on the same origin will still include the path.
... unsafe-url: the referrer will include the origin and the path (but not the fragment, password, or username).
... this value is unsafe, because it leaks origins and paths from tls-protected resources to insecure origins.
Identifying resources on the Web - HTTP
a more complex example might look like this: http://www.example.com:80/path/to/myfile.html?key1=value1&key2=value2#somewhereinthedocument urns a uniform resource name (urn) is a uri that identifies a resource by name in a particular namespace.
... path /path/to/myfile.html is the path to the resource on the web server.
... in the early days of the web, a path like this represented a physical file location on the web server.
Index - HTTP
WebHTTPHeadersIndex
74 forwarded http, http header, reference, request header, header the forwarded header contains information from the client-facing side of proxy servers that is altered or lost when a proxy is involved in the path of the request.
...it doesn't include any path information, but only the server name.
...it is similar to the referer header, but, unlike this header, it doesn't disclose the whole path.
dominant-baseline - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it only has effect on the text content elements, including: <altglyph>, <text>, <textpath>, <tref>, and <tspan> html, body, svg { height: 100%; } text { font: bold 14px verdana, helvetica, arial, sans-serif; } <svg viewbox="0 0 200 120" xmlns="http://www.w3.org/2000/svg"> <path d="m20,20 l180,20 m20,50 l180,50 m20,80 l180,80" stroke="grey" /> <text dominant-baseline="baseline" x="30" y="20">baseline</text> <text dominant-baseline="middle" x="30" y="50">middle</t...
... if this property occurs on a <tspan>, <tref>, <altglyph>, or <textpath> element, then the dominant-baseline and the baseline-table components remain the same as those of the parent text content element.
... example svg <svg width="400" height="300" viewbox="0 0 300 300" xmlns="http://www.w3.org/2000/svg"> <!-- materialization of anchors --> <path d="m60,20 l60,270 m30,20 l400,20 m30,70 l400,70 m30,120 l400,120 m30,170 l400,170 m30,220 l400,220 m30,270 l400,270" stroke="grey" /> <!-- anchors in action --> <text dominant-baseline="auto" x="70" y="20">auto</text> <text dominant-baseline="middle" x="70" y="70">middle</text> <text dominant-baseline="baseline" x=...
fill - SVG: Scalable Vector Graphics
WebSVGAttributefill
as a presentation attribute, it can be applied to any element but it only has an effect on the following eleven elements: <altglyph>, <circle>, <ellipse>, <path>, <polygon>, <polyline>, <rect>, <text>, <textpath>, <tref>, and <tspan>.
... path for <path>, fill is a presentation attribute that defines the color of the interior of the shape.
... textpath for <textpath>, fill is a presentation attribute that defines the color of the text.
keyPoints - SVG: Scalable Vector Graphics
five elements are using this attribute: <animate>, <animatecolor>, <animatemotion>, <animatetransform>, and <set> html, body, svg { height: 100%; } <svg viewbox="0 0 120 120" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <path d="m10,110 a120,120 -45 0,1 110 10 a120,120 -45 0,1 10,110" stroke="lightgrey" stroke-width="2" fill="none" id="motionpath"/> <circle cx="10" cy="110" r="3" fill="lightgrey"/> <circle cx="110" cy="10" r="3" fill="lightgrey"/> <circle r="5" fill="red"> <animatemotion dur="3s" repeatcount="indefinite" keypoints="0;0.5;1" keytimes="0;0.15;1" calcmode="linear"> <mpath xlink:href="#motionpath"/> </animatemotion> </circle> ...
... this value defines a semicolon-separated list of floating point values between 0 and 1 and indicates how far along the motion path the object shall move at the moment in time specified by corresponding keytimes value.
... the distance is calculated along the path specified by the path attribute.
orient - SVG: Scalable Vector Graphics
WebSVGAttributeorient
only one element is using this attribute: <marker> html, body, svg { height: 100%; } <svg viewbox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"> <defs> <marker id="arrow" viewbox="0 0 10 10" refx="5" refy="5" markerwidth="6" markerheight="6" orient="auto-start-reverse"> <path d="m 0 0 l 10 5 l 0 10 z" /> </marker> <marker id="dataarrow" viewbox="0 0 10 10" refx="5" refy="5" markerwidth="6" markerheight="6" orient="-65deg"> <path d="m 0 0 l 10 5 l 0 10 z" fill="red" /> </marker> </defs> <polyline points="10,10 10,90 90,90" fill="none" stroke="black" marker-start="url(#arrow)" marker-end="url(#arrow)" /> <polyline points=...
... marker-start="url(#dataarrow)" marker-mid="url(#dataarrow)" marker-end="url(#dataarrow)" /> </svg> usage notes value auto | auto-start-reverse | <angle> | <number> default value 0 animatable yes (non-additive) auto this value indicates that the marker is oriented such that its positive x-axis is pointing in a direction relative to the path at the position the marker is placed.
... note: this allows a single arrowhead marker to be defined that can be used for both the start and end of a path, i.e.
preserveAspectRatio - SVG: Scalable Vector Graphics
example <svg viewbox="-1 -1 162 92" xmlns="http://www.w3.org/2000/svg"> <defs> <path id="smiley" d="m50,10 a40,40,1,1,1,50,90 a40,40,1,1,1,50,10 m30,40 q36,35,42,40 m58,40 q64,35,70,40 m30,60 q50,75,70,60 q50,75,30,60" /> </defs> <!-- (width>height) meet --> <svg preserveaspectratio="xmidymid meet" x="0" y="0" viewbox="0 0 100 100" width="20" height="10"><use href="#smiley" /></svg> <svg preserveaspectratio="xminymid meet" x="25" y="0" viewbox="0 0 100 100" width...
...pectratio="xmaxymid slice" x="150" y="0" viewbox="0 0 100 100" width="10" height="25"><use href="#smiley" /></svg> <!-- none --> <svg preserveaspectratio="none" x="0" y="30" viewbox="0 0 100 100" width="160" height="60"><use href="#smiley" /></svg> </svg> topexample html,body,svg { height:100% } <svg viewbox="-1 -1 162 92" xmlns="http://www.w3.org/2000/svg"> <defs> <path id="smiley" d="m50,10 a40,40,1,1,1,50,90 a40,40,1,1,1,50,10 m30,40 q36,35,42,40 m58,40 q64,35,70,40 m30,60 q50,75,70,60 q50,75,30,60" /> </defs> <!-- (width>height) meet --> <rect x="0" y="0" width="20" height="10"> <title>xmidymid meet</title> </rect> <svg viewbox="0 0 100 100" width="20" height="10" preserveaspectratio="xmidymid meet" x="0" y="0"> <use href="#smiley" /...
... </rect> <svg viewbox="0 0 100 100" width="10" height="25" preserveaspectratio="xmaxymid slice" x="150" y="0"> <use href="#smiley" /> </svg> <!-- none --> <rect x="0" y="30" width="160" height="60"> <title>none</title> </rect> <svg viewbox="0 0 100 100" width="160" height="60" preserveaspectratio="none" x="0" y="30"> <use href="#smiley" /> </svg> </svg> path { fill: yellow; stroke: black; stroke-width: 8px; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; } rect:hover, rect:active { outline: 1px solid red; } syntax preserveaspectratio="<align> [<meetorslice>]" its value is made of one or two keywords: a required alignment value and an optional "meet or slice" reference as described below: alignment value t...
spacing - SVG: Scalable Vector Graphics
WebSVGAttributespacing
the spacing attribute indicates how the user agent should determine the spacing between typographic characters that are to be rendered along a path.
... only one element is using this attribute: <textpath> usage notes value auto | exact default value exact animatable yes auto this value indicates that the user agent should use text-on-a-path layout algorithms to adjust the spacing between typographic characters in order to achieve visually appealing results.
... exact this value indicates that the typographic characters should be rendered exactly according to the spacing rules as specified by the layout rules for text-on-a-path.
stroke-miterlimit - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following nine elements: <altglyph>, <path>, <polygon>, <polyline>, <rect>, <text>, <textpath>, <tref>, and <tspan> html,body,svg { height:100% } <svg viewbox="0 0 38 30" xmlns="http://www.w3.org/2000/svg"> <!-- impact of the default miter limit --> <path stroke="black" fill="none" stroke-linejoin="miter" id="p1" d="m1,9 l7 ,-3 l7 ,3 m2,0 l3.5 ,-3 l3.5 ,3 m2,0 l2 ,-3 l2 ,3 m2,0 l0.
...75,-3 l0.75,3 m2,0 l0.5 ,-3 l0.5 ,3" /> <!-- impact of the smallest miter limit (1) --> <path stroke="black" fill="none" stroke-linejoin="miter" stroke-miterlimit="1" id="p2" d="m1,19 l7 ,-3 l7 ,3 m2, 0 l3.5 ,-3 l3.5 ,3 m2, 0 l2 ,-3 l2 ,3 m2, 0 l0.75,-3 l0.75,3 m2, 0 l0.5 ,-3 l0.5 ,3" /> <!-- impact of a large miter limit (8) --> <path stroke="black" fill="none" stroke-linejoin="miter" stroke-miterlimit="8" id="p3" d="m1,29 l7 ,-3 l7 ,3 m2, 0 l3.5 ,-3 l3.5 ,3 m2, 0 l2 ,-3 l2 ,3 m2, 0 l0.75,-3 l0.75,3 m2, 0 l0.5 ,-3 l0.5 ,3" /> <!-- the following pink lines highlight the position of the path for each stroke --> <path stroke="pink" fill...
...7,-3 l7,3 m2,0 l3.5,-3 l3.5,3 m2,0 l2,-3 l2,3 m2,0 l0.75,-3 l0.75,3 m2,0 l0.5,-3 l0.5,3 m1,29 l7,-3 l7,3 m2,0 l3.5,-3 l3.5,3 m2,0 l2,-3 l2,3 m2,0 l0.75,-3 l0.75,3 m2,0 l0.5,-3 l0.5,3" /> </svg> when two line segments meet at a sharp angle and miter joins have been specified for stroke-linejoin, it is possible for the miter to extend far beyond the thickness of the line stroking the path.
SVG Attribute reference - SVG: Scalable Vector Graphics
WebSVGAttribute
svg attributes a to z a accent-height accumulate additive alignment-baseline allowreorder alphabetic amplitude arabic-form ascent attributename attributetype autoreverse azimuth b basefrequency baseline-shift baseprofile bbox begin bias by c calcmode cap-height class clip clippathunits clip-path clip-rule color color-interpolation color-interpolation-filters color-profile color-rendering contentscripttype contentstyletype cursor cx cy d d decelerate descent diffuseconstant direction display divisor dominant-baseline dur dx dy e edgemode elevation enable-background end exponent externalresourcesrequired f fill fill-opacity fill-ru...
...djust letter-spacing lighting-color limitingconeangle local m marker-end marker-mid marker-start markerheight markerunits markerwidth mask maskcontentunits maskunits mathematical max media method min mode n name numoctaves o offset opacity operator order orient orientation origin overflow overline-position overline-thickness p panose-1 paint-order path pathlength patterncontentunits patterntransform patternunits ping pointer-events points pointsatx pointsaty pointsatz preservealpha preserveaspectratio primitiveunits r r radius referrerpolicy refx refy rel rendering-intent repeatcount repeatdur requiredextensions requiredfeatures restart result rotate rx ry s scale seed shape-rendering slope spacing spe...
... alignment-baseline, baseline-shift, clip, clip-path, clip-rule, color, color-interpolation, color-interpolation-filters, color-profile, color-rendering, cursor, direction, display, dominant-baseline, enable-background, fill, fill-opacity, fill-rule, filter, flood-color, flood-opacity, font-family, font-size, font-size-adjust, font-stretch, font-style, font-variant, font-weight, glyph-orientation-horizontal, glyph-orientation-vertical, image-render...
<mask> - SVG: Scalable Vector Graphics
WebSVGElementmask
html,body,svg { height:100% } <svg viewbox="-10 -10 120 120"> <mask id="mymask"> <!-- everything under a white pixel will be visible --> <rect x="0" y="0" width="100" height="100" fill="white" /> <!-- everything under a black pixel will be invisible --> <path d="m10,35 a20,20,0,0,1,50,35 a20,20,0,0,1,90,35 q90,65,50,95 q10,65,10,35 z" fill="black" /> </mask> <polygon points="-10,110 110,110 110,-10" fill="orange" /> <!-- with this mask applied, we "punch" a heart shape hole into the circle --> <circle cx="50" cy="50" r="50" mask="url(#mymask)" /> </svg> attributes height this attribute defines the height of the masking area.
... value type: <length> ; default value: 120%; animatable: yes global attributes core attributes most notably: id styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage presentation attributes most notably: clip-path, clip-rule, color, display, fill, fill-opacity, fill-rule, filter, mask, opacity, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility usage notes categoriescontainer elementpermitted contentany number of the following elements, in any order:animation elementsdescript...
...ive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specifications specification status comment css masking module level 1the definition of '<mask>' in that specification.
<symbol> - SVG: Scalable Vector Graphics
WebSVGElementsymbol
html,body,svg { height:100% } <svg viewbox="0 0 80 20" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <!-- our symbol in its own coordinate system --> <symbol id="mydot" width="10" height="10" viewbox="0 0 2 2"> <circle cx="1" cy="1" r="1" /> </symbol> <!-- a grid to materialize our symbol positioning --> <path d="m0,10 h80 m10,0 v20 m25,0 v20 m40,0 v20 m55,0 v20 m70,0 v20" fill="none" stroke="pink" /> <!-- all instances of our symbol --> <use xlink:href="#mydot" x="5" y="5" style="opacity:1.0" /> <use xlink:href="#mydot" x="20" y="5" style="opacity:0.8" /> <use xlink:href="#mydot" x="35" y="5" style="opacity:0.6" /> <use xlink:href="#mydot" x="50" y="5" style="opacity:0.4" /> <use xlink:...
... value type: <length>|<percentage> ; default value: 0; animatable: yes global attributes core attributes most notably: id styling attributes class, style event attributes global event attributes, document element event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, a...
...ption, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriescontainer element, structural elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> note: a <symbol> element itself is not meant to be rendered.
SVG fonts - SVG: Scalable Vector Graphics
<font id="font1" horiz-adv-x="1000"> <font-face font-family="super sans" font-weight="bold" font-style="normal" units-per-em="1000" cap-height="600" x-height="400" ascent="700" descent="300" alphabetic="0" mathematical="350" ideographic="400" hanging="500"> <font-face-src> <font-face-name name="super sans bold"/> </font-face-src> </font-face> <missing-glyph><path d="m0,0h200v200h-200z"/></missing-glyph> <glyph unicode="!" horiz-adv-x="300"><!-- outline of exclam.
...the horiz-adv-x attribute determines how wide a character is on average compared to the path definitions of the single glyphs.
...for simple glyphs, however, you can simply add a d attribute — this defines a shape for the glyph exactly like how standard svg paths work.
Texts - SVG: Scalable Vector Graphics
WebSVGTutorialTexts
textpath this element fetches via its xlink:href attribute an arbitrary path and aligns the characters, that it encircles, along this path: <path id="my_path" d="m 20,20 c 80,60 100,40 120,20" fill="transparent" /> <text> <textpath xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#my_path"> a curve.
... </textpath> </text> playable code 2 <svg width="200" height="100" xmlns="http://www.w3.org/2000/svg"> <path id="my_path" d="m 20,20 c 80,60 100,40 120,20" fill="transparent" /> <text> <textpath xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#my_path"> a curve.
... </textpath> </text> <style><![cdata[ text{ dominant-baseline: hanging; font: 28px verdana, helvetica, arial, sans-serif; } ]]></style> </svg> « previousnext » ...
XSLT elements reference - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElement
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes there are two types of elements discussed here: top-level elements and instructions.
...an attribute value template is simply a string that includes an embedded xpath expression which is used to specify the value of an attribute.
... at run-time the expression is evaluated and the result of the evaluation is substituted for the xpath expression.
Index - XSLT: Extensible Stylesheet Language Transformations
WebXSLTIndex
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes found 54 pages: # page tags and summary 1 xslt: extensible stylesheet language transformations landing, web, xslt extensible stylesheet language transformations (xslt) is an xml-based language used, in conjunction with specialized processing software, for the transformation of xml documents.
... 17 the netscape xslt/xpath reference netscape, reference, xslt, axes no summary!
... 51 <xsl:value-of> element, reference, xslt, value-of the <xsl:value-of> element evaluates an xpath expression, converts it to a string, and writes that string to the result tree.
PI Parameters - XSLT: Extensible Stylesheet Language Transformations
select an xpath expression for the parameter.
... the value of the attribute is parsed as an xpath expression.
... the function library is the standard xpath function library.
Classes and Inheritance - Archive of obsolete content
consequently, overriding a method is as simple as providing a new definition on the prototype of the subclass: circle.prototype.draw = function (ctx) { ctx.beginpath(); ctx.arc(this.x, this.y, this.radius, 0, 2 * math.pi, false); ctx.fill(); }; with this definition in place, we get: let shape = shape(2, 3); shape.draw(); // error: not yet implemented let circle = circle(2, 3, 5); circle.draw(); // typeerror: ctx is not defined which is the behavior we were aiming for.
...f shape; // => true shape instanceof class; // => true to illustrate the use of the extends property, let's redefine the constructor for the class circle in terms of class: var circle = class({ extends: shape, initialize: function(x, y, radius) { shape.prototype.initialize.call(this, x, y); this.radius = radius; }, draw: function (context) { context.beginpath(); context.arc(this.x, this.y, this.radius, 0, 2 * math.pi, false); context.fill(); } }); unlike the definition of circle in the previous section, we no longer have to override its prototype, or set its constructor property.
Testing the Add-on SDK - Archive of obsolete content
with mach there are two commands: ./mach mochitest -f jetpack-addon <optional_addon_path>: this runs the test add-ons mentioned for cfx testaddons and gulp test:addons with the older sdk/loader/cuddlefish used with cfx.
... ./mach mochitest -f jetpack-package <optional_file_path>: this runs the module unit tests mentioned for cfx testpkgs and gulp test:modules but in this case with the newer toolkit/loader used with jpm.
simple-prefs - Archive of obsolete content
{ "type": "color", "name": "highlightcolor", "value": "#6a5acd", "title": "highlight color" } file displayed as a "browse" button that opens a file picker and stores the full path and name of the file selected.
... { "type": "file", "name": "myfile", "title": "select a file" } directory displayed as a "browse" button that opens a directory picker and stores the full path and name of the directory selected.
simple-storage - Archive of obsolete content
the easiest solution to this problem is to use the --profile option to jpm with a path to a profile - not just a profile name.
... jpm run --no-copy --profile path/to/profile/dir if you specify a non-existent profile, the same will be created, don't worry.
platform/xpcom - Archive of obsolete content
autoregister(path) register a component (.manifest) file or all component files in a directory.
... parameters path : string path to a component file to be registered or a directory containing component files to be registered.
ui/frame - Archive of obsolete content
this toolbar might look something like: scripting frames to add scripts to frames, include them directly from the frame's html content, as with a normal web page: <script type="text/javascript" src="frame.js"></script> as usual, the path to the script is relative to the html file's location.
...you can specify the url in one of two ways: as a resource:// url pointing at a file under your add-on's "data" directory, typically constructed using self.data.url(filename) as a relative path: a string in the form "./relativepath", where "relativepath" is a relative path to the file beginning in your add-on's "data" directory var { frame } = require("sdk/ui/frame"); var self = require("sdk/self"); var frame1 = new frame({ url: require("sdk/self").data.url("content1.html") }); var frame2 = new frame({ url: "./content2.html" }); optional options: nam...
jpm-mobile - Archive of obsolete content
jpm-mobile run this command runs a new instance of firefox with the add-on installed: jpm-mobile run jpm-mobile run accepts the following options: --adb /path/to/adb provides the path to adb.
... jpm-mobile test accepts the following options: --adb /path/to/adb provides the path to adb.
Getting Started (jpm) - Archive of obsolete content
if firefox can not be located, or you have installed firefox developer as an alternate browser, you may need to provide the path to it.
... to build an xpi, just execute the command jpm xpi from the add-on's directory: jpm xpi you should see a message like: jpm info successfully created xpi at /path/to/my-addon/@my-addon-0.0.1.xpi to test that this worked, try installing the xpi file in your own firefox installation.
Using third-party modules (jpm) - Archive of obsolete content
in your add-on code, you can require() modules by passing a path to the module starting from, but not including "node_modules": var menuitems = require("menuitem"); details create a new directory called, for example, "my-menuitem", navigate to it, type "jpm init" and accept all the defaults: mkdir my-menuitem cd my-menuitem jpm init install the menuitem package from npm: npm install menuitem --save this will install the package in the current directory...
...it will contain a single directory "addon-pathfinder", and the modules included in this package will be somewhere in that directory: my-menuitem index.js node_modules menuitem package.json test we're interested in using the "menuitem" module, which is at "addon-pathfinder/lib/ui/menuitem".
Miscellaneous - Archive of obsolete content
window.addeventlistener('fullscreen', function(){ alert('fullscreen mode on or off') }, false) getting addon install path first one using addon manager: components.utils.import('resource://gre/modules/addonmanager.jsm'); addonmanager.getaddonbyid('example@addon', function(addon) { let path = addon.getresourceuri().path; // something like /home/username/....
... yourmodule(data.installpath.path); // some code ...
Preferences - Archive of obsolete content
nsilocalfile and nsirelativefilepref store paths in preferences.
... nsilocalfile is used to store absolute paths, while nsirelativefilepref is used to store paths relative to a "special" directory, such as the profile folder.
Install Manifests - Archive of obsolete content
to do so, set optionstype to 3 and set optionsurl to a the path of a page to open.
... this object has a package property (with a path within the jar file or directory that leads to the location where the contents.rdf file responsible for registering that package is located), a locale property (ditto, but to register the locale) and a skin property (ditto, but to register the theme material).
Setting up an extension development environment - Archive of obsolete content
to quickly achieve our task of creating just a developer profile, we will start the application with the parameters: /path/to/firefox -no-remote -p profilename without these parameters, the default behavior of your mozilla applications is to only open the everyday user profile: named default.
... the contents of this file should be the path to the directory that contains your install.rdf file, for example /full/path/to/yourextension/ on mac and linux, and c:\full\path\to\yourextension\ on windows.
Index of archived content - Archive of obsolete content
console/traceback content/content content/loader content/mod content/symbiont content/worker core/heritage core/namespace core/promise dev/panel event/core event/target frame/hidden-frame frame/utils fs/path io/byte-streams io/file io/text-streams lang/functional lang/type loader/cuddlefish loader/sandbox net/url net/xhr places/bookmarks places/favicon places/history platform/xpcom preferences/event-target ...
...vg animation svg general scrollbar sidebar stringview tabbox toolbar tree uri parsing view source for xul applications windows xml-related code snippets xml:base support in old browsers xpath getattributens common pitfalls communication between html and your extension creating custom firefox extensions with the mozilla build system custom about: urls default preferences deploying a plugin as an extension developing add-ons displaying web content in an extension without se...
Install.js - Archive of obsolete content
tall.confirm('install ' + this.extfullname + ' ' + this.extversion + ' to your profile directory (ok) or your browser directory (cancel)?'); } // init install var dispname = this.extfullname + ' ' + this.extversion; var regname = '/' + this.extauthor + '/' + this.extshortname; install.initinstall(dispname, regname, this.extversion); // find directory to install into var installpath; if (this.profileinstall) installpath = profiledir; else installpath = install.getfolder('chrome'); // add jar file install.addfile(null, 'chrome/' + jarname, installpath, null); // register chrome var jarpath = install.getfolder(installpath, jarname); var installtype = this.profileinstall ?
... install.profile_chrome : install.delayed_chrome; // register content install.registerchrome(install.content | installtype, jarpath, 'content/' + this.extshortname + '/'); // register locales for (var locale in this.extlocalenames) { var regpath = 'locale/' + this.extlocalenames[locale] + '/' + this.extshortname + '/'; install.registerchrome(install.locale | installtype, jarpath, regpath); } // register skins for (var skin in this.extskinnames) { var regpath = 'skin/' + this.extskinnames[skin] + '/' + this.extshortname + '/'; install.registerchrome(install.skin | installtype, jarpath, regpath); } // perform install var err = install.performinstall(); if (err == install.success || err == install.reboot_needed) { if (!this.silentinstall && t...
Installing plugins to Gecko embedding browsers on Windows - Archive of obsolete content
to find the path to the browser executable (exe) applicable to netscape 6.1, 6.2.x, netscape 7.0 (and up), mozilla 1.0, and compuserve 7.0 finding the browser executable is useful if you wish to launch the browser following installation of the plugin dll.
...hkey_local_machine\software\mozilla\netscape 6 6.1\bin\ access the pathtoexe value and value-data pair, e.g: pathtoexe=c:\program files\netscape\netscape 6\netscp6.exe you now have information about the location of the exe on windows for gecko embedding browsers.
Using content preferences - Archive of obsolete content
browser.zoom.sitespecific toolkit.zoommanager.zoomvalues zoom.maxpercent and zoom.minpercent browser.download.lastdir path of a filesystem directory related about:config preferences: browser.download.lastdir the last directory for any site use downloadlastdir.jsm for access to these preferences.
... browser.upload.lastdir path of a filesystem directory this preference is stored and retrieved automatically by file upload controls.
Compiling The npruntime Sample Plugin in Visual Studio - Archive of obsolete content
add the npapi sdk include path (example : c:\npapi-sdk\headers) to project properties|(all configurations)|c++|general|additional include directories.
...it could be either the full path or the path relative to the project directory.
Creating regular expressions for a microsummary generator - Archive of obsolete content
urls 101 urls for auction item pages on ebay, like those on many other sites, usually start with the string "http://" and contain a domain name, a file path, and some query parameters.
... here's a url for an auction item page on ebay: http://cgi.ebay.com/ws/ebayisapi.dll?viewitem&item=280018439106 in this url, the domain name is "cgi.ebay.com", the file path is "/ws/ebayisapi.dll", and the query parameters are "?viewitem&item=280018439106".
Building Firefox with Rust code - Archive of obsolete content
if you want to call code in the "e10s" crate, you would add: extern crate e10s; to toolkit/library/rust/shared/lib.rs; you would also need to specify the path to that crate in the dependencies section of toolkit/library/rust/shared/cargo.toml: [dependencies] e10s = { path = "../../../../path/from/srcdir/e10s" } the e10s crate must also be checked into the tree at the appropriate path.
... if the e10s crate depends on any other crates, their sources must also be checked into the tree, and e10s's cargo.toml must have path attributes for each of its dependencies, and so on.
JSS build instructions for OSX 10.6 - Archive of obsolete content
cvs login cvs co -r nspr_4_8_7_rtm nspr cvs co -r nss_3_12_9_with_ckbi_1_82_rtm nss cvs co -r jss_4_3_2_rtm jss build nss for 32 and 64: cd mozilla/security/nss make nss_build_all cc="gcc -arch i386" ccc="g++ -arch i386" make nss_build_all use_64=1 build jss for 32 and 64: cd ../jss make cc="gcc -arch i386" ccc="g++ -arch i386" make use_64=1 on osx, java.library.path doesnt seem to have /usr/lib or other paths.
...setting ld_library_path didnt work ...
Code snippets - Archive of obsolete content
mainwindow.gbrowser.addtab(url); } } partially corrupt a server components.utils.import("resource://services-sync/main.js"); components.utils.import("resource://services-sync/resource.js"); function deletepath(path) { let resource = new resource(weave.service.storageurl + path); resource.setheader("x-confirm-delete", "1"); return resource.delete(); } // delete meta/global: deletepath("meta/global"); // delete keys: deletepath("crypto/keys"); // delete server: deletepath(""); corrupt a single engine on the server let engine = "bookmarks"; components.utils.import("resource://services-sync/main.
... bump meta/global's modified time components.utils.import("resource://services-sync/main.js"); components.utils.import("resource://services-sync/resource.js"); function getpath(path) { let r = new resource(weave.service.storageurl + path); let g = r.get(); return [g, r]; }; let [g, r] = getpath("meta/global"); r.put(g); delete and restore a record components.utils.import("resource://services-sync/main.js"); components.utils.import("resource://services-sync/resource.js"); components.utils.import("resource://services-sync/record.js"); // for example: let id = "ia...
GRE Registration - Archive of obsolete content
each subkey is searched for gre registration information: hklm/software/mozilla.org/gre/1.8_1 version=1.8 grehome=c:\path\to\installed-dir feature=value feature2=value2 hklm/software/mozilla.org/gre/1.8_2 version=1.8 grehome=c:\path\to\second-installation when installing a gre via the mozilla suite gre installer, the installer will blindly overwrite any previous gre information in hklm/software/mozilla.org/gre/<version>.
... linux on linux, registration information is kept in ini-style files of the following form: [1.7.10] gre_path=/usr/lib/mozilla-1.7.10 feature=value feature2=value2 these ini files can be in any of the following locations: /etc/gre.conf /etc/gre.d/*.conf ~/.gre.conf ~/.gre.d/*.conf mozilla has never officially shipped a linux gre based on the mozilla suite.
Creating a Help Content Pack - Archive of obsolete content
for example, if your glossary, index, and table of contents rdf files are all located at chrome://myapp/locale/help/*, then you could put chrome://myapp/locale/help/ here and use only the actual file names without path when needed later.
... acontentpackspec: the path to the content pack you want to load.
JavaScript crypto - Archive of obsolete content
*/); loading pkcs #11 modules long deletemodule(domstring modulename); long addmodule(domstring modulename, domstring libraryfullpath, long cryptomechanismflags, long cipherflags); loads or removes a new pkcs #11 module.
... libraryfullpath the filename of the library prepended with its full path.
Metro browser chrome tests - Archive of obsolete content
as with mochitest, the path given as an argument is the path to a test file within the mozilla source tree.
... if the path points to the root tests directory, then all metro browser chrome tests will be run.
Migrate apps from Internet Explorer to Mozilla - Archive of obsolete content
nd xhtml 1.1 cascade style sheets (css): css level 1, css level 2.1 and parts of css level 3 document object model (dom): dom level 1, dom level 2 and parts of dom level 3 mathematical markup language: mathml version 2.0 extensible markup language (xml): xml 1.0, namespaces in xml, associating style sheets with xml documents 1.0, fragment identifier for xml xsl transformations: xslt 1.0 xml path language: xpath 1.0 resource description framework: rdf simple object access protocol: soap 1.1 ecma-262, revision 3 (javascript 1.5): ecma-262 general cross-browser coding tips even though web standards do exist, different browsers behave differently (in fact, the same browser may behave differently depending on the platform).
...it also allows javascript to perform xslt transformations and allows running xpath on a document.
Modularization techniques - Archive of obsolete content
the second takes a class id and the path to a dynamically loadable library.
... extern "c" ns_export nsresult nsregisterself(const char *path); extern "c" ns_export nsresult nsunregisterself(const char *path); this allows a dll to register and unregister all its factories.
RDF Datasource How-To - Archive of obsolete content
registering an rdf datasource is fairly simple: in the dll's nsregisterself() method, you simply call the component manager's registercomponent() method: extern "c" pr_implement(nsresult) nsregisterself(nsisupports* aservicemanager, const char* apath) { nsresult rv; ...
... // assume compmgr refers to the component manager rv = compmgr->registercomponent(kmydatasourcecid, "my data source", ns_rdf_datasource_progid_prefix "my-datasource", apath, pr_true, pr_true); ...
File object - Archive of obsolete content
file.path the canonical path to the file.
...xxx file.tostring() returns the canonical path to the file.
Anonymous Content - Archive of obsolete content
xpath selectors specified using the includes attribute determine which insertion point a given child should be placed under.
...child, descendant, and sibling selectors will match on any path of anonymous and explicit elements.
execute - Archive of obsolete content
method of install object syntax int execute ( string xpisourcepath [, boolean blocking]); int execute ( string xpisourcepath, string args [, boolean blocking]); parameters the execute method has the following parameters: xpisourcepath the pathname of the file to extract and execute.
... (note that this path points into the xpi itself.) args a parameter string that is passed to the executable.
Return Codes - Archive of obsolete content
no_matching_certificate -206 extracted file was not signed by the certificate used to sign the installation script cant_read_archive -207 xpi package cannot be read invalid_arguments -208 bad parameters to a function illegal_relative_path -209 illegal relative path user_cancelled -210 user clicked cancel on install dialog install_not_started -211 a problem occurred with the parameters to initinstall, or initinstall was not called first silent_mode_denied -212 the silent installation privilege has not been granted.
... invalid_path_err -219 the path provided to getfolder was invalid.
preference.type - Archive of obsolete content
in this situation the preference will save the path to a property file which contains the actual value of the preference.
...the file path will be stored in the preferences.
Accessing Files - Archive of obsolete content
retrieving a file when working with files, usage is always done via a file object and not via string paths.
...because string paths are not used, references to files in a file object are made relative to some starting directory.
Index - Archive of obsolete content
ArchiveMozillaXULIndex
for an xml datasource, generated content will be output in the order corresponding to the results of the xpath query expression.
...an xml document will be loaded and xpath expressions may be used to take portions of the xml document and generate content from these.
Using Recursive Templates - Archive of obsolete content
<groupbox type="menu" datasources="people.xml" ref="*" querytype="xml"> <template> <query expr="*"/> <action> <vbox uri="?" class="indent"> <label value="?name"/> </vbox> </action> </template> </groupbox> in this simplified example, the xpath expression just gets the list of child elements of the reference node.
...in an xpath expression, the period refers to the context node.
preference - Archive of obsolete content
in this situation the preference will save the path to a property file which contains the actual value of the preference.
...the file path will be stored in the preferences.
window - Archive of obsolete content
<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:html="http://www.w3.org/1999/xhtml"> <!-- icon from chrome --> <html:link rel="icon" href="chrome://myextension/content/path/to/favicon.png"/> <!-- from a remote site --> <html:link rel="icon" href="http://www.mozilla.org/favicon.ico"/> since firefox 3.6 the above listed code does not work correctly - it produces the following message: "warning: xul box for box element contained an inline link child, forcing all its children to be wrapped in a block".
...the problem can be solved as follows: <html:link rel="icon" href="chrome://myextension/content/path/to/favicon.png" style="display:none"/> or <html:head> <html:link rel="icon" href="chrome://myextension/content/path/to/favicon.png"/> </html:head> ...
Building XULRunner with Python - Archive of obsolete content
for example def onload(): btntest = document.getelementbyid("btntest") btntest.addeventlistener('command', ontest, false) def ontest(): window.alert('button activated') window.addeventlistener('load', onload, false) one possible gotcha is that the default python path used to find modules that areimported explicitly includes the xulrunner executable directory and the directory that is current when xulrunner launches.
... however it does not include any path related to the xul application being run.
Creating XULRunner Apps with the Mozilla Build System - Archive of obsolete content
ac_add_options --with-libxul-sdk=/path/to/xulrunner-sdk ac_add_options --enable-application=mccoy you still need to get the mozilla source code and put your project in a subdirectory underneath the mozilla root.
...you can make this jar.mn to rule them all just by concatenating the three files in the mccoy example and updating the path to each file (since you will need to point to the correct subdirectory): mccoy.jar: % content mccoy %content/ * content/mccoy.xul (content/mccoy.xul) content/mccoy.js (content/mccoy.js) * content/mccoy.xml (content/mccoy.xml) ...etc...
Deploying XULRunner - Archive of obsolete content
copy xulrunner/ to this directory when deploying with xulrunner 2.0 and above do the following: move chrome.manifest to the root directory, and adjust resource paths inside chrome.manifest accordingly with xulrunner 9.0 or 10.0 you may need to copy "mozutils.dll" and/or "mozcrt19.dll" from the xulrunner directory to the root directory.
...you should copy this file from /library/frameworks/xul.framework/versions/1.8/xulrunner.) when deploying with xulrunner 2.0, move chrome.manifest to the root directory, and adjust resource paths inside chrome.manifest accordingly.
application/http-index-format specification - Archive of obsolete content
a valid path token must be url escaped.
... filename the name of file that can be used to retrieve the file when combined with the full path provided by the 300 line.
mozilla.dev.platform FAQ - Archive of obsolete content
faq for questions asked on mozilla.dev.platform xulrunner q: xulrunner on mac os x a: instead of using /path/to/xulrunner-bin.ini, applications on a mac must be in an application bundle (foo.app).
...in order to use xr successfully in <tt>--disable-libxul</tt> mode, you have to setup dyld_library_path to include <tt>/library/frameworks/xul.framework/versions/1.9a1</tt> - benjamin smedberg, fri, oct 20 2006 9:12 am q: when i try to build a completely standalone xul app on os x (10.4.8).
NPN_PostURLNotify - Archive of obsolete content
buf path to local temporary file or data buffer that contains the data to post.
...values: true: post the local file whose path is specified in buf, then delete the file.
NPP_NewStream - Archive of obsolete content
when the stream is complete, the browser calls npp_streamasfile to deliver the path of the file to the plug-in.
...when the stream is complete, the browser calls npp_streamasfile to deliver the path of the file to the plug-in.
NPP_StreamAsFile - Archive of obsolete content
fname pointer to full path to a local file.
... description when the stream is complete, the browser calls npp_streamasfile to provide the instance with a full path name for a local file for the stream.
Solaris 10 Build Prerequisites - Archive of obsolete content
--- env.sh.orig tue jul 1 02:38:35 2008 +++ env.sh tue jun 24 01:08:01 2008 @@ -95,7 +95,8 @@ echo setting ld=$ld export ld -path="$cbe_prefix/bin:/usr/ccs/bin:/usr/gnu/bin:/usr/bin:/usr/sbin:/bin:/usr /sfw/bin:$ccdir" +path="/opt/sfw/bin:$cbe_prefix/bin:/usr/ccs/bin:/usr/gnu/bin:/usr/bin:/usr/s bin:/bin:/usr/sfw/bin:$ccdir" test "x$jds_cbe_env_quiet" != x1 && \ echo setting path=$path export path +export pkg_config_path=/opt/sfw/lib/pkgconfig:/usr/lib/pkgconfig 3.
...add /opt/sfw/bin to path environment after installation.
Browser Detection and Cross Browser Support - Archive of obsolete content
due to bugs, incomplete implementations of the standards and legacy browsers, web developers must be able to determine which browser a visitor is using and provide the appropriate content and scripting code path.
... provide support for unknown browsers always provide content and code paths for unknown browsers.
Back to the Server: Server-Side JavaScript On The Rise - Archive of obsolete content
if you don’t already have it, you’ll need to also download the jdbc driver for mysql, extract the class files, and include the path in your classpath environment variable.
...also since you know which engine you're targeting, you're free to confidently use advanced built in controls such as xml processing via e4x, xpath, and xslt.
Mozilla XForms User Interface - Archive of obsolete content
they can be bound to instance nodes to define context for the xforms controls that they contain, should any of their child nodes happen to use relative xpath expressions.
...that node will serve as the context node for any relative xpath expressions in that set of repeated markup.
XForms - Archive of obsolete content
drawing on other w3c standards like xml schema, xpath, and xml events, xforms tried to address some of the limitations of the current html forms model.
... tools xforms validator xforms buddy related topics extensions, html, xhtml, xml, xpath ...
Choosing Standards Compliance Over Proprietary Practices - Archive of obsolete content
following a proprietary path has led many organizations down disastrous paths.
...on the other hand, by adopting open technology standards and participating in the development and direction of those standards, an organization is providing a path for future development, growth and revenue.
bootstrap.js - Extensions
function startup(data, reason) { /// bootstrap data structure @see /docs/extensions/bootstrapped_extensions#bootstrap_data /// string id /// string version /// nsifile installpath /// nsiuri resourceuri /// /// reason types: /// app_startup /// addon_enable /// addon_install /// addon_upgrade /// addon_downgrade } function shutdown(data, reason) { /// bootstrap data structure @see /docs/extensions/bootstrapped_extensions#bootstrap_data /// string id /// string version /// nsifile installpath /// nsiur...
...i resourceuri /// /// reason types: /// app_shutdown /// addon_disable /// addon_uninstall /// addon_upgrade /// addon_downgrade } function install(data, reason) { /// bootstrap data structure @see /docs/extensions/bootstrapped_extensions#bootstrap_data /// string id /// string version /// nsifile installpath /// nsiuri resourceuri /// /// reason types: /// addon_install /// addon_upgrade /// addon_downgrade } function uninstall(data, reason) { /// bootstrap data structure @see /docs/extensions/bootstrapped_extensions#bootstrap_data /// string id /// string version /// nsifile installpath /// nsiuri resourceuri /// /// reason types: /// addon_uninstall //...
Examples - Game development
canvas airport simulation animated map showing planes taking off and landing at airports, along with flight path patterns.
... flight stream 3d globe with simulated flight paths.
Game monetization - Game development
if your work is a serious endeavour on the path to becoming an independent game developer able to make a living, read on and see what your options are.
...it's totally up to you which path you're going to follow.
Build the brick field - Game development
our code might look like this: function drawbricks() { for(var c=0; c<brickcolumncount; c++) { for(var r=0; r<brickrowcount; r++) { bricks[c][r].x = 0; bricks[c][r].y = 0; ctx.beginpath(); ctx.rect(0, 0, brickwidth, brickheight); ctx.fillstyle = "#0095dd"; ctx.fill(); ctx.closepath(); } } } again, we're looping through the rows and columns to set the x and y position of each brick, and we're also painting a brick on the canvas — size brickwidth x brickheight — with each loop iteration.
...nto your code below the drawpaddle() function: function drawbricks() { for(var c=0; c<brickcolumncount; c++) { for(var r=0; r<brickrowcount; r++) { var brickx = (c*(brickwidth+brickpadding))+brickoffsetleft; var bricky = (r*(brickheight+brickpadding))+brickoffsettop; bricks[c][r].x = brickx; bricks[c][r].y = bricky; ctx.beginpath(); ctx.rect(brickx, bricky, brickwidth, brickheight); ctx.fillstyle = "#0095dd"; ctx.fill(); ctx.closepath(); } } } actually drawing the bricks the last thing to do in this lesson is to add a call to drawbricks() somewhere in the draw() function, preferably at the beginning, between the clearing of the canvas and drawing the ball.
Visual JS GE - Game development
you need to edit the config file to include the correct paths to the node app and project instance, as indicated below: module.exports = { version : "0.5", path_of_node_app : "d:/path_to_server_instance_folder/server/" , // edit here path_of_www : "d:/xamp/htdocs/project_instance/", // path_to_www edit here editor_port : "1013", reg_path : "users/", account_port : 3666 , destroy_session_after_x_mseconds : 20000, }; local node...
... resource objects contain the path data for all your images.
Visual typescript game engine - Game development
*/ private addson: addson = [ { name: "cache", enabled: true, scriptpath: "externals/cacheinit.ts", }, { name: "hackertimer", enabled: true, scriptpath: "externals/hack-timer.js", }, { name: "dragging", enabled: true, scriptpath: "externals/drag.ts", }, ]; /** * @description this is main coordinary types of positions * can be "diametric-fullscreen" or "frame".
... -run services database server (locally and leave it alive to develop process): npm run dataserver looks like this : mongod --dbpath ./server/database/data fix: "failed: address already in use" : netstat -ano | findstr :27017 taskkill /pid typeyourpidhere /f also important "run visual studio code as administrator".
Plug-in Development Overview - Gecko Plugin API Reference
file mode: the browser saves the data to a local file in cache and passes that file path to the plug-in.
...then the following registry values should be added to the windows registry (the plug-in-identifier should follow the specification): hklm/software/mozillaplugins/plugin-identifier descripton: reg_sz "description of the plugin" path: reg_sz "c:\..path to the plugin.dll" productname: reg_sz "the plugin name" vendor: reg_sz "the plugin author/vendor" version: reg_sz "0.5.whatever plugin version string" hklm/software/mozillaplugins/plugin-identifier/mimetypes add a sub-key for each mime type the plugin supports, with no values install to known locations on linux and mac on linux and mac, plug-ins are installed to well-k...
XInclude - MDN Web Docs Glossary: Definitions of Web-related terms
return false; break; } request.send(null); if((request.status === 200 || request.status === 0) && request[responsetype] !== null) { response = request[responsetype]; if (responsetype === 'responsexml') { // apply xpointer (only xpath1() subset is supported) var responsenodes; if (xpointer) { var xpathresult = response.evaluate( xpointer, response, ...
...null, xpathresult.ordered_node_snapshot_type, null ); var a = []; for(var k = 0; k < xpathresult.snapshotlength; k++) { a[k] = xpathresult.snapshotitem(k); } responsenodes = a; } else { // otherwise, the response must be a single well-formed document response responsenodes = [response.documentelement]; // put in array so can be treated the same way as the above ...
Web fonts - Learn web development
each of the url() functions points to a font file that we want to import into our css — we need to make sure the paths to the files are correct, so add fonts/ to the start of each path (adjust as necessary).
... src: these lines specify the paths to the font files to be imported into your css (the url part), and the format of each font file (the format part).
How do you upload your files to a web server? - Learn web development
source is the path to the local file or directory that you want to copy files over from.
... destination is the path to the location you want to copy your directory or files to on the remote server.
Front-end web developer - Learn web development
welcome to our front-end web developer learning pathway!
... the learning pathway getting started time to complete: 1.5–2 hours prerequisites nothing except basic computer literacy.
HTML basics - Learn web development
it does this via the src (source) attribute, which contains the path to our image file.
...for example, try deliberately changing the path inside your src attribute to make it incorrect.
JavaScript basics - Learn web development
the code uses a conditional to check if the src value is equal to the path of the original image: if it is, the code changes the src value to the path of the second image, forcing the other image to be loaded inside the <img> element.
... if it isn't (meaning it must already have changed), the src value swaps back to the original image path, to the original state.
Test your skills: Multimedia and embedding - Learn web development
you need to: add the path to the audio file to an appropriate attribute to embed it on the page.
... add multiple sources, containing the paths to the video files.
Getting started with React - Learn web development
note the use of ./ at the beginning of the path, and the .svg extension at the end — these tell us that the file is local and that it is not a javascript file.
... we don't write a path or extension when importing the react module — this is not a local file; instead, it is listed as a dependency in our package.json file.
Deployment and next steps - Learn web development
create a .gitlab-ci.yml file inside your project's root and give it the following content: image: node:latest pages: stage: deploy script: - npm install - npm run build artifacts: paths: - public only: - master here we are telling gitlab to use an image with the latest version of node to build our app.
...do this by running the following commands: > git add public/index.html > git add .gitlab-ci.yml > git commit -m "added .gitlab-ci.yml file and fixed index.html absolute paths" > git push counting objects: 5, done.
Getting started with Svelte - Learn web development
to create a file inside a folder just specify the complete pathname, like this — components/mycomponent.svelte.
...then when you see a path in the code, for example import todos from './components/todos.svelte', just replace it with a flat url, e.g.
Embedding API for Accessibility
it's a w3c uaag requirement */ setboolpref("browser.selection.use_system_colors", usesystemcolors); no content waiting alerts setcharpref("alert.audio.mail_waiting", pathtosoundfile); setcharpref("alert.audio.background_image_waiting", pathtosoundfile); setcharpref("alert.audio.popup_waiting", pathtosoundfile); setcharpref("alert.audio.applet_waiting", pathtosoundfile); setcharpref("alert.audio.script_waiting", pathtosoundfile); setcharpref("alert.aud...
...io.redirect_waiting", pathtosoundfile); setcharpref("alert.audio.refresh_waiting", pathtosoundfile); setcharpref("alert.audio.plugin_content_waiting", pathtosoundfile); setcharpref("alert.audio.video_waiting", pathtosoundfile); setcharpref("alert.audio.audio_waiting", pathtosoundfile); setcharpref("alert.audio.timed_event_waiting", pathtosoundfile); /* these alerts will also be mirrored visually, either on the status bar or elsewhere */ no background images setboolpref("browser.accept.background_images", acceptbackgroundimages); no blinking text ...
Debugging Frame Reflow
enter this line in the text file * 1 this should look like: point the gecko_display_reflow_rules_file environment variable to the path of the reflow_rules.txt file.
... on mac this is accomplished with: $ env dyld_library_path="`pwd`/obj-ff-dbg/dist/nightlydebug.app/contents/macos" \ ./obj-ff-dbg/dist/nightlydebug.app/contents/macos/firefox-bin > logfile.txt after loading your testcase, the log file will contain the promised information.
HTTP logging
export moz_log=timestamp,rotate:200,nshttp:5,cache2:5,nssockettransport:5,nshostresolver:5,cookie:5 export moz_log_file=/tmp/log.txt cd /path/to/firefox ./firefox reproduce the problem you're debugging.
...if you've put it elsewhere, change the path used on the third line appropriately.) reproduce whatever problem you're trying to debug.
Gecko Logging
redirecting logging output to a file logging output can be redirected to a file by passing its path via an environment variable.
... you can set an overall logging level, though it could be quite verbose: set rust_log="debug" you can also target individual modules by path: set rust_log="style::style_resolver=debug" for linux/macos users, you need to use export rather than set.
Browser API
htmliframeelement.download() downloads a specified url, storing it at the specified filename/path.
... mozbrowsermanifestchange sent when a the path to the app manifest changes, in the case of a browser <iframe> with an open web app embedded in it.
Roll your own browser: An embedding how-to
there are two functions that are needed: nsresult ns_initembedding(const char *apath); nsresult ns_termembedding(); pretty self-explanatory.
... the apath parameter will be passed to ns_initxpcom.
DownloadTarget
path read only string the path of the target file.
... partfilepath read only string the path of the ".part" file containing the data downloaded so far, or null to disable the use of a ".part" file to keep partially downloaded data.
OS.File.Info
using os.file.info example: determining if a file is a regular file the following snippet uses the main thread api to determine (asynchronously) whether some path is a regular file, or a directory, or a symbolic link: let promise = os.file.stat(somepath); promise.then( function onsuccess(info) { // |info| is an instance of |os.file.info| if (info.isdir) { // |somepath| represents a directory } else if (info.issymlink) { // |somepath| represents a symbolic link } else { // |somepath| represents a regular file } }, fu...
...nction onfailure(reason) { if (reason instanceof os.file.error && reason.becausenosuchfile) { // |somepath| does not represent anything } else { // some other error } } ) example: determining the owner of a file let promise = os.file.stat() promise.then( function onsuccess(info) { if ("unixowner" in info) { // info.unixowner holds the owner of the file } else { // information is not available on this platform } } ); evolution of this example bug 802534 will introduce the ability to check whether field unixowner appears in os.file.info.prototype, which will make it possible to write faster code.
Localizing extension descriptions
add the following line to it (where extension_id matches your application id from install.rdf and path_to_localization_file is the chrome path to the localization file you added to earlier): pref("extensions.extension_id.description", "path_to_localization_file"); localizable strings the following add-on metadata can be localized using this process: name description creator homepageurl localizable lists in cases where multiple values can exist, a numeric index is appended to the en...
...d of the preference name: extensions.extension_id.contributor.1=first_localized_contributor_name extensions.extension_id.contributor.2=second_localized_contributor_name extensions.extension_id.contributor.3=thrid_localized_contributor_name pref("extensions.extension_id.contributor.1", "path_to_localization_file"); pref("extensions.extension_id.contributor.2", "path_to_localization_file"); pref("extensions.extension_id.contributor.3", "path_to_localization_file"); the following add-on metadata can be localized using this process: developer translator contributor ...
Localizing with Koala
due to a bug in koala (bug 21930), it is recommended that you don't choose a path that contains spaces (like c:\documents and settings\user\...).
...make sure that your mercurial installation is in your system's $path.
QA phase
use ./mach build config after step 4 update the mozilla source code: $ cd mozilla-aurora $ hg pull -u enter the following command to create the .mozconfig file: $ nano -w .mozconfig enter the following lines in your .mozconfig file: mk_add_options moz_objdir=@topsrcdir@/../firefox-build ac_add_options --disable-compile-environment ac_add_options --with-l10n-base=../l10n-central # path relative to moz_objdir ac_add_options --enable-application=[browser or mail] you will need to specify which application you're localizing in the fourth line (e.g., for firefox, that's browser, thunderbird would be mail).
... if you're using koala, this should be located at /path/to/your/koala.project/locale/3.6/x-testing, otherwise, it should be located at /path/to/your/working_dir/l10n_base/x-testing.
SVN for Localizers
it's a bit hard to read, but you can also create a diff file (aka a diff patch) use svn diff > /path/to/output/file.diff to save the output to a file.
... note that path/to/output is meant to indicate the directory on your computer where you wish to store the diff file.
Fonts for Mozilla's MathML engine
typically, use a fontconfig configuration /etc/fonts/conf.avail/09-texlive-fonts.conf that points to the opentype directory of texlive, such as: <?xml version="1.0"?> <!doctype fontconfig system "fonts.dtd"> <fontconfig> <dir>/your/path/to/texmf-dist/fonts/opentype</dir> </fontconfig> finally, add this configuration file to the system font location list and regenerate the fontconfig cache: ln -sf /etc/fonts/conf.avail/09-texlive-fonts.conf /etc/fonts/conf.d/ fc-cache -sf android you must use the mathml-fonts add-on.
...on os x and linux, the standard paths are ~/library/fonts/ and ~/.fonts.
DMD
i/geckoconsole(20731): nsimemoryinfodumper dumped reports to /storage/emulated/0/download/memory-reports/unified-memory-report-default-20731.json.gz the path is where the memory reports and dmd reports get dumped to.
...however, if you have crash reporter symbols for your build -- as tryserver builds do -- you can use this script instead: clone the whole repo, edit the paths at the top of resymbolicate_dmd.py and run it.) the simplest way to do this is to just run the dmd.py script on your dmd report while your working directory is $objdir/dist/bin.
Leak-hunting strategies and tips
if you really need to debug leaks that involve js objects closely, you can get detailed printouts of the paths js uses to mark objects when it is determining the set of live objects by using the functions added in bug 378261 and bug 378255.
... getting symbol information for system libraries windows setting the environment variable _nt_symbol_path to something like symsrv*symsrv.dll*f:\localsymbols*http://msdl.microsoft.com/download/symbols as described in microsoft's article.
TraceMalloc
if you run with --trace-malloc -, your code can call ns_tracemallocdumpallocations(pathname) at opportune times, and a human-readable listing of the current heap, including stack traces for every allocation, will be written to pathname.
... tracemallocdumpallocations(pathname) - dump a human-readable listing of all traced, live allocations.
about:memory
tree paths can be written using '/' as a separator.
... for example, preference/referent/weak/dead represents the path to the final leaf node in the example tree above.
NSPR build instructions
on mac os x, they can be executed with the following: /bin/sh: $ cd pr/tests $ dyld_library_path=../../dist/lib ./accept pass $ $ # to run all the nspr tests...
... $ $ dyld_library_path=../../dist/lib ../../../nspr/pr/tests/runtests.sh ../..
PR_Delete
syntax #include <prio.h> prstatus pr_delete(const char *name); parameters the function has the following parameter: name the pathname of the file to be deleted.
... description pr_delete deletes a file with the specified pathname name.
PR_Open
syntax #include <prio.h> prfiledesc* pr_open( const char *name, printn flags, printn mode); parameters the function has the following parameters: name the pathname of the file to be opened.
... description pr_open creates a file descriptor (prfiledesc) for the file with the pathname name and sets the file status flags of the file descriptor according to the value of flags.
NSPR API Reference
ndition variable type condition variable functions monitors monitor type monitor functions cached monitors cached monitor functions i/o types directory type file descriptor types file info types network address types types used with socket options functions type used with memory-mapped i/o offset interpretation for seek functions i/o functions functions that operate on pathnames functions that act on file descriptors directory i/o functions socket manipulation functions converting between host and network addresses memory-mapped i/o functions anonymous pipe function polling functions pollable events manipulating layers network addresses network address types and constants network address functions atomic operations pr_atomicincrement pr_atomicde...
... 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_findsymbolandlibrary finding symbols defined in the main executable program platform notes dynamic library search path exporting symbols from the main executable program process management and interprocess communication process management types ...
NSS_3.12_release_notes.html
se notes 17 june 2008 newsgroup: mozilla.dev.tech.crypto contents introduction distribution information new in nss 3.12 bugs fixed documentation compatibility feedback introduction network security services (nss) 3.12 is a minor release with the following new features: sqlite-based shareable certificate and key databases libpkix: an rfc 3280 compliant certificate path validation library camellia cipher support tls session ticket extension (rfc 5077) nss 3.12 is tri-licensed under the mpl 1.1/gpl 2.0/lgpl 2.1.
...bug 217538: softoken databases cannot be shared between multiple processes bug 294531: design new interfaces for certificate path building and verification for libpkix bug 326482: nss ecc performance problems (intel) bug 391296: need an update helper for shared databases bug 395090: remove duplication of pkcs7 code from pkix_pl_httpcertstore.c bug 401026: need to provide a way to modify and create new pkcs #11 objects.
NSS 3.14.2 release notes
on red hat enterprise linux 5.x systems, install the binutils220 package and add /usr/libexec/binutils220 to the beginning of your path environment variable.
...if so, nss uses the optimized code path, reducing the cpu cycles per byte to 1/20 of what was required before the patch (https://bugzilla.mozilla.org/show_bug.cgi?id=805604 and https://crypto.stanford.edu/realworldcrypto/slides/gueron.pdf).
NSS 3.31 release notes
pk11uri_getpathattribute - retrieve a path attribute with the given name.
... new macros in pkcs11uri.h several new macros that start with pk11uri_pattr_ for path attributes defined in rfc7512.
NSS Sample Code Sample_2_Initialization of NSS
sample code 1 /* nspr headers */ #include <prthread.h> #include <plgetopt.h> #include <prprf.h> /* nss headers */ #include <nss.h> #include <pk11func.h> #include "util.h" /* print a usage message and exit */ static void usage(const char *progname) { fprintf(stderr, "\nusage: %s -d <dbdirpath> [-p <plainpasswc>]" " [-f <passwdffile>]\n\n", progname); fprintf(stderr, "%-15s specify a db directory path\n\n", "-d <dbdirpath>"); fprintf(stderr, "%-15s specify a plaintext password\n\n", "-p <plainpasswc>"); fprintf(stderr, "%-15s specify a password file\n\n", "-f <plainpasswc>"); exit(-1); } /* ...
...ass, 0, pwfile, 0); if (rv != secsuccess) { pr_fprintf(pr_stderr, "failed to change password\n"); } if (slot) { pk11_freeslot(slot); } rvshutdown = nss_shutdown(); if (rvshutdown != secsuccess) { pr_fprintf(pr_stderr, "failed : nss_shutdown()\n"); rv = secfailure; } pr_cleanup(); return rv; } </plainpasswc></plainpasswc></dbdirpath></passwdffile></plainpasswc></dbdirpath></pk11func.h></nss.h></prprf.h></plgetopt.h></prthread.h> ...
NSS Sample Code Sample_3_Basic Encryption and MACing
pad_header "-----begin pad-----" #define pad_trailer "-----end pad-----" typedef enum { encrypt, decrypt, unknown } commandtype; typedef enum { symkey = 0, mackey = 1, iv = 2, mac = 3, pad = 4 } headertype; /* print a usage message and exit */ static void usage(const char *progname) { fprintf(stderr, "\nusage: %s -c <a|b> -d <dbdirpath> [-z <noisefilename>] " "[-p <dbpwd> | -f <dbpwdfile>] -i <ipfilename> -o <opfilename>\n\n", progname); fprintf(stderr, "%-20s specify 'a' for encrypt operation\n\n", "-c <a|b>"); fprintf(stderr, "%-20s specify 'b' for decrypt operation\n\n", " "); fprintf(stderr, "%-20s specify db directory path\n\n", "-d <dbdirpath>")...
...down(); if (rvshutdown != secsuccess) { pr_fprintf(pr_stderr, "failed : nss_shutdown()\n"); rv = secfailure; } pr_cleanup(); return rv; } </plstr.h></prtypes.h></prlog.h></prinit.h></prerror.h></plgetopt.h></prthread.h></opfilename></ipfilename></ipfilename></ipfilename></ipfilename></ipfilename></opfilename></ipfilename></noisefilename></dbpwdfile></dbpwd></dbdirpath></a|b></opfilename></ipfilename></dbpwdfile></dbpwd></noisefilename></dbdirpath></a|b></pk11priv.h></keyhi.h></plstr.h></prtypes.h></prlog.h></prinit.h></prerror.h></plgetopt.h></prthread.h> ...
PKCS #11 Module Specs
recognized names all applications/libraries must be able recognize the following name values: library this specifies the path to the pkcs #11 library.
... if the name is not specified, the application can use the library path to describe the pkcs #11 library in any ui it may have.
PKCS11 Implement
in the create a new security module dialog box, add the security module name for your module and the full pathname for the security module file.
... to avoid requiring the user to type long pathnames, make sure your module is not buried too deeply.
Python binding for NSS
fix bug in test/setup_certs.py, hardcoded full path to libnssckbi.so was causing failures on 64-bit systems, just use the libnssckbi.so basename, modutil will find it on the standard search path.
... the following classes were replaced signaturealgorithm replaced by new class algorithmid the following classes were added algorithmid pkcs12decodeitem pkcs12decoder the following class methods were added pk11slot.authenticate() pk11slot.get_disabled_reason() pk11slot.has_protected_authentication_path() pk11slot.has_root_certs() pk11slot.is_disabled() pk11slot.is_friendly() pk11slot.is_internal() pk11slot.is_logged_in() pk11slot.is_removable() pk11slot.logout() pk11slot.need_login() pk11slot.need_user_init() pk11slot.user_disable() pk11slot.user_enable() pkcs12decodeitem.format() pkcs12decodeitem.format_lines() pkcs12decoder...
Installation guide
if you install the libraries in a directory other than /usr/lib, you usually need to set the ld_library_path environment variable.
...this is done here: http://lxr.mozilla.org/security/sour...platlibs.mk#53 53 ifeq ($(os_arch), linux) 54 ifeq ($(use_64), 1) 55 extra_shared_libs += -wl,-rpath,'$$origin/../lib64:$$origin/../lib' 56 else 57 extra_shared_libs += -wl,-rpath,'$$origin/../lib' 58 endif 59 endif for example, if you install certutil in /foo/bar/nss/bin and the .so's in /foo/bar/nss/lib, then you only need to add /foo/bar/nss/bin to your path; you don't need to set ld_library_path.
NSS environment variables
3.12.3 nss_output_file string (filename) output file path name for the pkcs #11 module logger.
...the possible values are: copy: copies of files are published absolute_symlink: symlinks whose targets are absolute pathnames are published if not specified, default to relative symlinks (symlinks whose targets are relative pathnames).
sslerr.html
sec_error_path_len_constraint_invalid -8155 certificate path length constraint is invalid.
... sec_error_js_invalid_dll -8085 invalid module path/filename.
NSS tools : signtool
note that versions 1.1 and later of netscape signing tool correctly recognizes the codebase attribute, allows paths to be expressed for the class and src attributes instead of filenames only, processes link tags and parses html correctly, and offers clearer error messages.
... status path ------------ ------------------- verified test.f using netscape signing tool with a zip utility to use netscape signing tool with a zip utility, you must have the utility in your path environment variable.
Renaming With Pork
use absolute paths.
...pork patches contain absolute paths in them and will touch generated sources if it comes across any.
Tutorial: Embedding Rhino
here's an example use of runscript from a shell command line: $ java runscript "math.cos(math.pi)" -1 $ java runscript "function f(x){return x+1} f(7)" 8 note that you'll have to have both the rhino classes and the runscript example class file in the classpath.
...(note that because the java -jar option preempts the rest of the classpath, we can't use that and access the counter class.) $ java -cp "js.jar;examples" org.mozilla.javascript.tools.shell.main js> defineclass("counter") js> c = new counter(7) [object counter] js> c.count 7 js> c.count 8 js> c.count 9 js> c.resetcount() js> c.count 0 counter's constructors the zero-argument constructor is used by rhino runtime to create instances.
JIT Optimization Outcomes
multiprotopaths objects used in this operation had differing prototypes.
... hascommoninliningpath inlined dom monomorphic polymorphic inline cache outcomes outcomes describing inline cache stubs that were generated.
SpiderMonkey 1.8.5
to select an alternate c++ compiler, invoke configure thus: cxx=/usr/bin/g++-4.0 /path/configure --my-configuration-options js-config the new configure-based build system does not correctly generate the js-config script on many platforms, nor when js-ctypes are enabled.
... if you are building your project with a gnu-make based build system, the following workaround can be integrated into your build system to generate the correct ldflags, with a strong likelihood that it will work with future versions when js-config is fixed: js_config ?= /path/to/js-config uname_system = $(shell uname -s) jsapi_ldflags = $(shell $(js_config) --libs) ifeq ($(uname_system),darwin) jsapi_ldflags := $(filter -l%,$(jsapi_ldflags)) $(filter -l%,$(jsapi_ldflags))\ $(filter -%_namespace,$(jsapi_ldflags))\ $(filter -wl%,$(jsapi_ldflags)) jsapi_ldflags := $(filter-out $(mozjs_install_name_opt),$(jsapi_ldflags)) endif jsapi_ldflags := $(filter-out %libffi.a,$(jsapi_ldflags)) ldflags += $(jsapi_ldflags) future direction the spider...
SpiderMonkey 1.8.7
to select an alternate c++ compiler, invoke configure thus: cxx=/usr/bin/g++-4.0 /path/configure --my-configuration-options js-config the new configure-based build system does not correctly generate the js-config script on many platforms, nor when js-ctypes are enabled.
... if you are building your project with a gnu-make based build system, the following workaround can be integrated into your build system to generate the correct ldflags, with a strong likelihood that it will work with future versions when js-config is fixed: js_config ?= /path/to/js-config uname_system = $(shell uname -s) jsapi_ldflags = $(shell $(js_config) --libs) ifeq ($(uname_system),darwin) jsapi_ldflags := $(filter -l%,$(jsapi_ldflags)) $(filter -l%,$(jsapi_ldflags))\ $(filter -%_namespace,$(jsapi_ldflags))\ $(filter -wl%,$(jsapi_ldflags)) jsapi_ldflags := $(filter-out $(mozjs_install_name_opt),$(jsapi_ldflags)) endif jsapi_ldflags := $(filter-out %libffi.a,$(jsapi_ldflags)) ldflags += $(jsapi_ldflags) future direction the spide...
TPS Tests
steps get the source code clone mozilla-central (choose your flavor): hg clone hg.mozilla.org/mozilla-central or git clone github.com/mozilla/gecko-dev cd into the tps folder cd testing/tps create the environment i suggest the path to be outside of the mc source tree python create_venv.py --username=%email% --password=%password% %path% note: if you are updating the tps environment and want to keep your existing config (eg, the existing username and password), you should instead execute: python create_venv.py --keep-config %path% activate the environment source %path%/bin/activate run some tests no...
...te that the testfile is not a path, it should only be the filename from services/sync/tests/tps/ runtps --debug --testfile %test_file_name% --binary %firefox_binary_path% additionally, omitting a --testfile parameter will cause it to run all tps tests listed in services/sync/tests/tps/all_tests.json an example on osx, for running just the test_sync.js testfile against a locally built firefox (where the mozconfig set the objdir to obj-ff-artifact): runtps --debug --testfile test_sync.js --binary obj-ff-artifact/dist/nightly.app/contents/macos/firefox running tps against stage, or dev fxa tps can be configured using the $tps_venv_path/config.json file.
Web Replay
webgl is not supported yet, as it uses a pretty different rendering path from normal web content.
... the difficulties are in figuring out the set of system library apis to intercept, in getting the memory management and dirty memory parts of the rewind infrastructure to work, and in handling the different graphics and ipc pathways on different platforms.
WebReplayRoadmap
code path highlighting (not yet implemented) when paused in a frame, the code path taken through the frame (the lines/expressions executed) could be highlighted somehow, which would make it easier to see what happened in the frame.
... points on the path could be clicked to seek there, which should offer faster and less clunky navigation than stepping buttons.
Using the Places history service
using the referrer information in each visit, the browsing path can be reconstructed at any time.
... the "session id" allows these paths to be reconstructed more easily.
Creating a Python XPCOM component
this is probably best done by setting a pythonpath variable pointing at the 'bin/python' directory in the application.
... this is not necessary when your components are loaded by mozilla as the python loader modifies sys.path.
How to build an XPCOM component in JavaScript
{sdk_dir}/bin/xpidl -m typelib -w -v -i {sdk_dir}/idl -e helloworld.xpt helloworld.idl note: on windows you must use forward slashes for the include path.
...depth = @depth@ topsrcdir = @top_srcdir@ srcdir = @srcdir@ vpath = @srcdir@ include $(depth)/config/autoconf.mk # module specifies where header files from this makefile are installed # use dom if your component implements a dom api module = dom # name of the typelib xpidl_module = dom_apps # set to 1 if the module should be part of the gecko runtime common to all applications gre_module = 1 # the idl sources xpidlsrcs = \ helloworld.idl \ $(null) incl...
Finishing the Component
to add the weblock component to this category, modify the weblockregistration callback function so that it looks like this: static ns_method weblockregistration(nsicomponentmanager *acompmgr, nsifile *apath, const char *registrylocation, const char *componenttype, const nsmodulecomponentinfo *info) { nsresult rv; nscomptr<nsiservicemanager> servman = do_queryinterface((nsisupports*)acompmgr, &rv); if (ns_failed(rv)) return rv; nscomptr<nsicategorymanager> catman; servman->get...
... the name of the resource itself, given as a path.
XPCOM Stream Guide
MozillaTechXPCOMGuideStreams
zip input and output for getting an input stream from a zip archive, see the nsizipreader interface: // file is an nsifile object mapping to a zip archive var zipreader = components.classes["@mozilla.org/libjar/zip-reader;1"] .createinstance(components.interfaces.nsizipreader); zipreader.open(file); var stream = zipreader.getinputstream("/path/to/zipped/file"); // process the stream // when we don't need the zipreader anymore zipreader.close(); for writing from an input stream to a zip archive, see the nsizipwriter interface: // file is an nsifile object mapping to a zip archive var zipwriter = components.classes["@mozilla.org/zipwriter;1"] .createinstance(components.interfaces.nsizipwriter); zipwriter.o...
...pen(file, ioflags); // stream is the output stream zipwriter.addentrystream("/path/to/zipped/file", modtime, compression, stream, queueforlater); // if queued for later operations, and all operations are queued zipwriter.processqueue(); // when we don't need the zipwriter anymore zipwriter.close(); concatenating input streams var stringstream = components.constructor("@mozilla.org/io/string-input-stream;1", "nsistringinputstream", "setdata"); function buildstream(data) { return new stringstream(data, data.length); } function run_test() { var str1 = buildstream("we "); var str2 = buildstream("will "); var str3 = buildstream("rock "); var str4 = buildstream("you!"); var check = "we will roc...
nsLocalFile
example code function getfilesize(path) { var file = components.classes["@mozilla.org/file/local;1"].
... createinstance(components.interfaces.nsilocalfile); file.initwithpath(path); return file.filesize; } see also components, nsicomponentmanager ...
nsIDownloadManager
the path is dependent on two user configurable prefs set in preferences: browser.download.folderlist defines the default download location for files: 0: files are downloaded to the desktop by default.
... 2: files are downloaded to the local path specified by the browser.download.dir preference.
nsIEnvironment
examples windows this example gets the path to the porgram files directory on windows.
... var nsienvironment = components.classes["@mozilla.org/process/environment;1"].getservice(components.interfaces.nsienvironment); var pathtoprogramfiles = nsienvironment.get("programfiles"); //for me this returns "c:\program files" ...
nsILoginManagerStorage
this string will be in the origin url format, without a pathname.
...the argument is in origin url format, without a pathname (for example: "http://mozilla.com").
nsIMsgFolder
filepath nsilocalfile local path of this folder.
... knowssearchnntpextension boolean readonly allowsposting boolean readonly relativepathname acstring readonly sizeondisk unsigned long size of this folder on disk (not including .msf file) for imap, it's the sum of the size of the messages.
nsIStandardURL
netwerk/base/public/nsistandardurl.idlscriptable this interface defines the interface to an url with the standard file path format common to protocols like http, ftp, and file.
... it supports initialization from a relative path and provides some customization on how urls are normalized.
nsITreeView
getimagesrc() the image path for a given cell.
... return value the image path of the cell.
pyxpidl
generating c++ headers to generate c++ headers, use the header.py utility: sdkdir/sdk/bin/header.py --cachedir=<path> -o <outputfilename.h> <filename.idl> generating typelibs generating typelib files is done using the typelib.py utility: sdkdir/sdk/bin/typelib.py --cachedir=<path> -o <outputfilename.xpt> <filename.idl> comparing pyxpidl to xpidl this table provides a mapping of old xpidl options to pyxpidl.
...l equivalent -a emit annotations to typelib n/a (feature removed) -w turn on warnings n/a (this is now the default and can't be turned off) -v verbose mode (nyi) n/a (feature removed) -t creates a typelib of a specific version number n/a (feature removed, and probably never actually worked) -i add an entry to start of include path for #include "nsifoo.idl" -i (unchanged) -o specify the base name for output (-o /tmp/nsifoo for example) -o outputfile (this isn't just the base name, but needs to include the extension; for example -o /tmp/nsifoo.idl) -e specify an explicit output file name (-e /tmp/nsifoo.idl for example) n/a (this is subsumed by -o now) -d write dependencies (requi...
Using the Multiple Accounts API
- boolean, should we download new messags on biff (true) or just alert user that there is new mail (false) preference: mail.server.server.directory - local platform-specific path to store messages and folder indexes preference: mail.server.server.name - user-visible name of server the following are specific to imap: preference: mail.server.server.admin_url - administration url for server preference: mail.server.server.using_subscription - boolean, should we use subscriptions?
... preference: mail.server.server.newsrc.file - platform specific file path to newsrc file identities preference: mail.identity.identity.fullname - the user's full name, i.e.
Using the Mozilla source server
source code served to you for debugging without a local build what you'll need windbg or visual studio (note: express editions will not work, but windbg is a free download) a nightly build that was created after april 15, 2008; go to the /pub/firefox/nightly/latest-mozilla-central/ folder and grab the installer for builds predating the switch to mercurial, you'll need cvs.exe, added to your path (the cvs.exe from mozillabuild has problems, use this one instead) note: do not use the cvs from mozillabuild, it will not work!
...once the symbol path is set you must now enable source server.
WebIDL bindings
[headerfile="path/to/headerfile.h"] indicates where the implementation can be found.
...this allows the binding code to avoid extra reference-counting of the string buffer in many cases, and allows it to take a faster codepath even if it does end up having to addref the nsstringbuffer.
Standard OS Libraries
you just need to supply the path to appropriate files and set up the proper types of values/arguments in the js-ctypes code.
...so /system/library/frameworks/coregraphics.framework/coregraphics is the library path to pass to ctypes.open function call.
Plug-in Development Overview - Plugins
file mode: the browser saves the data to a local file in cache and passes that file path to the plug-in.
...then the following registry values should be added to the windows registry (the plug-in-identifier should follow the specification): hklm/software/mozillaplugins/plugin-identifier descripton: reg_sz "description of the plugin" path: reg_sz "c:\..path to the plugin.dll" productname: reg_sz "the plugin name" vendor: reg_sz "the plugin author/vendor" version: reg_sz "0.5.whatever plugin version string" hklm/software/mozillaplugins/plugin-identifier/mimetypes add a sub-key for each mime type the plugin supports, with no values install to known locations on linux and mac on linux and mac, plug-ins are installed to well-k...
Debugging service workers - Firefox Developer Tools
registration is done with a block of code along these lines, using the register() method: if('serviceworker' in navigator) { navigator.serviceworker .register('sw.js') .then(function() { console.log('service worker registered'); }); } if you get the path wrong, for example, you'll get an error in the web console giving you a hint as to what's wrong, which depends on what exactly is wrong with the code.
... the path to the service worker source file.
Index - Firefox Developer Tools
26 tutorial: show allocations per call path debugger, tools, tutorial this page shows how to use the debugger api to show how many objects a web page allocates, sorted by the function call path that allocated them.
... 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.
Aggregate view - Firefox Developer Tools
on the right-hand side is a pane that just says "select an item to view its retaining paths".
... if you select an item, you'll see the retaining paths panel for that item: call stack the call stack shows you exactly where in your code you are making heap allocations.
Network request list - Firefox Developer Tools
domain: domain of the path requested.
... scheme: the scheme (https/http/ftp/...) of the path requested.
Debugging Firefox Desktop - Firefox Developer Tools
run the debuggee from the command line, passing it the --start-debugger-server option: /path/to/firefox --start-debugger-server passed with no arguments, --start-debugger-server makes the debugger server listen on port 6000.
... to use a different port, pass the desired port number: /path/to/firefox --start-debugger-server 1234 note: in windows, the start-debugger-server call will only have one dash: firefox.exe -start-debugger-server 1234 note: by default, and for security reasons, the devtools.debugger.force-local option is set.
Web Console Helpers - Firefox Developer Tools
$x(xpath, element, resulttype) evaluates the xpath xpath expression in the context of element and returns an array of matching nodes.
...the resulttype parameter specifies the type of result to return; it can be an xpathresult constant, or a corresponding string: "number", "string", "bool", "node", or "nodes"; if not provided, any_type is used.
The JavaScript input interpreter - Firefox Developer Tools
$x(xpath, element, resulttype) evaluates the xpath xpath expression in the context of element and returns an array of matching nodes.
...the resulttype parameter specifies the type of result to return; it can be an xpathresult constant, or a corresponding string: "number", "string", "bool", "node", or "nodes"; if not provided, any_type is used.
BluetoothAdvertisingData - Web APIs
this is used to compute the path loss as this.txpower - this.rssi.
...this is used to compute the path loss as this.txpower - this.rssi.
CSS Painting API - Web APIs
log(thecolor); if ( strokewidth ) { ctx.linewidth = strokewidth; } else { ctx.linewidth = 1.0; } if ( stroketype === 'stroke' ) { ctx.fillstyle = 'transparent'; ctx.strokestyle = thecolor; } else if ( stroketype === 'filled' ) { ctx.fillstyle = thecolor; ctx.strokestyle = thecolor; } else { ctx.fillstyle = 'none'; ctx.strokestyle = 'none'; } ctx.beginpath(); ctx.moveto( x, y ); ctx.lineto( blockwidth, y ); ctx.lineto( blockwidth + blockheight, blockheight ); ctx.lineto( x, blockheight ); ctx.lineto( x, y ); ctx.closepath(); ctx.fill(); ctx.stroke(); for (let i = 0; i < 4; i++) { let start = i * 2; ctx.beginpath(); ctx.moveto( blockwidth + (start * 10) + 10, y); ctx.lineto( blockwidth + (start * 10) + 20, y); ctx...
....lineto( blockwidth + (start * 10) + 20 + blockheight, blockheight); ctx.lineto( blockwidth + (start * 10) + 10 + blockheight, blockheight); ctx.lineto( blockwidth + (start * 10) + 10, y); ctx.closepath(); ctx.fill(); ctx.stroke(); } } }); we then include the paintworklet: <ul> <li>item 1</li> <li>item 2</li> <li>item 3</li> <li>item 4</li> <li>item 5</li> <li>item 6</li> <li>item 7</li> <li>item 8</li> <li>item 9</li> <li>item 10</li> <li>item 11</li> <li>item 12</li> <li>item 13</li> <li>item 14</li> <li>item 15</li> <li>item 16</li> <li>item 17</li> <li>item 18</li> <li>item 19</li> <li>item 20</li> </ul> css.paintworklet.addmodule('https://mdn.github.io/houdini-examples/csspaint/intro/w...
CanvasRenderingContext2D.lineCap - Web APIs
html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.beginpath(); ctx.moveto(20, 20); ctx.linewidth = 15; ctx.linecap = 'round'; ctx.lineto(100, 100); ctx.stroke(); result comparison of line caps in this example three lines are drawn, each with a different value for the linecap property.
... <canvas id="canvas" width="150" height="150"></canvas> const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); const linecap = ['butt', 'round', 'square']; // draw guides ctx.strokestyle = '#09f'; ctx.beginpath(); ctx.moveto(10, 10); ctx.lineto(140, 10); ctx.moveto(10, 140); ctx.lineto(140, 140); ctx.stroke(); // draw lines ctx.strokestyle = 'black'; for (let i = 0; i < linecap.length; i++) { ctx.linewidth = 15; ctx.linecap = linecap[i]; ctx.beginpath(); ctx.moveto(25 + i * 50, 10); ctx.lineto(25 + i * 50, 140); ctx.stroke(); } screenshotlive sample specifications specification...
CanvasRenderingContext2D.setLineDash() - Web APIs
html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // dashed line ctx.beginpath(); ctx.setlinedash([5, 15]); ctx.moveto(0, 50); ctx.lineto(300, 50); ctx.stroke(); // solid line ctx.beginpath(); ctx.setlinedash([]); ctx.moveto(0, 100); ctx.lineto(300, 100); ctx.stroke(); result some common patterns this example illustrates a variety of common line dash patterns.
... function drawdashedline(pattern) { ctx.beginpath(); ctx.setlinedash(pattern); ctx.moveto(0, y); ctx.lineto(300, y); ctx.stroke(); y += 20; } const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); let y = 15; drawdashedline([]); drawdashedline([1, 1]); drawdashedline([10, 10]); drawdashedline([20, 5]); drawdashedline([15, 3, 3, 3]); drawdashedline([20, 3, 3, 3, 3, 3, 3, 3]); drawdashedline([12, 3, 3]); // equals [12, 3, 3, 12, 3, 3] result specifications specification status comment html living standardthe definition of 'c...
Compositing example - Web APIs
var lightmix = function() { var ctx = canvas2.getcontext("2d"); ctx.save(); ctx.globalcompositeoperation = "lighter"; ctx.beginpath(); ctx.fillstyle = "rgba(255,0,0,1)"; ctx.arc(100, 200, 100, math.pi*2, 0, false); ctx.fill() ctx.beginpath(); ctx.fillstyle = "rgba(0,0,255,1)"; ctx.arc(220, 200, 100, math.pi*2, 0, false); ctx.fill() ctx.beginpath(); ctx.fillstyle = "rgba(0,255,0,1)"; ctx.arc(160, 100, 100, math.pi*2, 0, false); ctx.fill(); ctx.restore(); ctx.beginpath(); ...
...++) { var gradient = ctx.createlineargradient(oleft + halfwidth, otop, oleft + halfwidth, otop + halfwidth); var color = color.hsv_rgb({ h: (n + 300) % 360, s: 100, v: 100 }); gradient.addcolorstop(0, "rgba(0,0,0,0)"); gradient.addcolorstop(0.7, "rgba("+color.r+","+color.g+","+color.b+",1)"); gradient.addcolorstop(1, "rgba(255,255,255,1)"); ctx.beginpath(); ctx.moveto(oleft + halfwidth, otop); ctx.lineto(oleft + halfwidth, otop + halfwidth); ctx.lineto(oleft + halfwidth + 6, otop); ctx.fillstyle = gradient; ctx.fill(); ctx.translate(oleft + halfwidth, otop + halfwidth); ctx.rotate(rotate); ctx.translate(-(oleft + halfwidth), -(otop + halfwidth)); } ctx.beginpath(); ctx.fi...
CustomEvent - Web APIs
event.deeppath an array of dom nodes through which the event has bubbled.
... event.composedpath() returns the event’s path (objects on which listeners will be invoked).
DOMMatrixReadOnly.flipX() - Web APIs
examples this svg contains two paths in the shape of a triangle, both drawn to the same position.
... <svg width="100" height="100" viewbox="-50 0 100 100"> <path fill="red" d="m 0 50 l 50 0 l 50 100 z" /> <path id="flipped" fill="blue" d="m 0 50 l 50 0 l 50 100 z" /> </svg> this javascript first creates an identity matrix, then uses the `flipx()` method to create a new matrix, which is then applied to the blue triangle, inverting it across the x-axis.
DirectoryReaderSync - Web APIs
var paths = []; function getallentries(dirreader) { var entries = dirreader.readentries(); for (var i = 0, entry; entry = entries[i]; ++i) { // stash this entry's filesystem in url paths.push(entry.tourl()); // if this is a directory, traverse.
... if (!data.cmd || data.cmd != 'list') { return; } try { var fs = requestfilesystemsync(temporary, 1024*1024 /*1mb*/); getallentries(fs.root.createreader()); self.postmessage({entries: paths}); } catch (e) { onerror(e); } }; method overview entrysync readentries () raises (fileexception); method readentries() returns a lost of entries from a specific directory.
Document.getElementsByTagNameNS() - Web APIs
some outer text</p> <button onclick="getallparaelems();"> show all p elements in document</button><br /> <button onclick="div1paraelems();"> show all p elements in div1 element</button><br /> <button onclick="div2paraelems();"> show all p elements in div2 element</button> </body> </html> potential workaround for other browsers which do not support if the desired browser did not support xpath, another approach (such as traversing the dom through all its children, identifying all @xmlns instances, etc.) would be necessary to find all tags with the desired local name and namespace, but xpath is much faster.
... (to accommodate explorer, one could call an xpath wrapper instead of the xpath in the function below (as explorer supports xpath with a different api), such as this wrapper class.) function getelementsbytagnamenswrapper (ns, elname, doc, context) { if (!doc) { doc = document; } if (!context) { context = doc; } var result = doc.evaluate('//*[local-name()="'+elname+'" and namespace-uri() = "'+ns+'"]', context, null, xpathresult.ordered_node_snapshot_type, null); var a = []; for(var i = 0; i < result.snapshotlength; i++) { a[i] = result.snapshotitem(i); } return a; } specifications specification status comment domthe definition of 'document.getelementsbytagnamens' in that specification.
Document.lastModified - Web APIs
here is a possible example of how to show an alert message when the page changes (see also: javascript cookies api): if (date.parse(document.lastmodified) > parsefloat(document.cookie.replace(/(?:(?:^|.*;)\s*last_modif\s*\=\s*([^;]*).*$)|^.*$/, "$1") || "0")) { document.cookie = "last_modif=" + date.now() + "; expires=fri, 31 dec 9999 23:59:59 gmt; path=" + location.pathname; alert("this page has changed!"); } …the same example, but skipping the first visit: var nlastvisit = parsefloat(document.cookie.replace(/(?:(?:^|.*;)\s*last_modif\s*\=\s*([^;]*).*$)|^.*$/, "$1")), nlastmodif = date.parse(document.lastmodified); if (isnan(nlastvisit) || nlastmodif > nlastvisit) { document.cookie = "last_modif=" + date.now() + "; expires=fri, 31 ...
...dec 9999 23:59:59 gmt; path=" + location.pathname; if (isfinite(nlastvisit)) { alert("this page has been changed!"); } } note: webkit returns the time string in utc; gecko and internet explorer return a time in the local timezone.
Event - Web APIs
WebAPIEvent
event.deeppath an array of dom nodes through which the event has bubbled.
... methods event.composedpath() returns the event’s path (objects on which listeners will be invoked).
Using Fetch - Web APIs
the simplest use of fetch() takes one argument — the path to the resource you want to fetch — and returns a promise containing the response (a response object).
...: fetch('flowers.jpg') .then(response => { if (!response.ok) { throw new error('network response was not ok'); } return response.blob(); }) .then(myblob => { myimage.src = url.createobjecturl(myblob); }) .catch(error => { console.error('there has been a problem with your fetch operation:', error); }); supplying your own request object instead of passing a path to the resource you want to request into the fetch() call, you can create a request object using the request() constructor, and pass that in as a fetch() method argument: const myheaders = new headers(); const myrequest = new request('flowers.jpg', { method: 'get', headers: myheaders, mode: 'cors', cache: 'default', }); fetch(myrequest) .then(response => response.blob()) .then(mybl...
File.name - Web APIs
WebAPIFilename
for security reasons, the path is excluded from this property.
... syntax var name = file.name; value a string, containing the name of the file without path, such as "my resume.rtf".
FileReader - Web APIs
it cannot be used to simply read a file by pathname from a file system.
... to read files by pathname in javascript, standard ajax solutions should be used to do server-side file reading, with cors permission if reading cross-domain.
HTMLAnchorElement.referrerPolicy - Web APIs
"unsafe-url" meaning that the referrer will include the origin and the path (but not the fragment, password, or username).
... this case is unsafe as it can leak path information that has been concealed to third-party by using tls.
HTMLAreaElement.referrerPolicy - Web APIs
"unsafe-url" meaning that the referrer will include the origin and the path (but not the fragment, password, or username).
... this case is unsafe as it can leak path information that has been concealed to third-party by using tls.
HTMLImageElement.alt - Web APIs
</p> </div> css the main feature of the css here is the use of clip-path and shape-outside to wrap the text around the icon in an appealing way.
... .container { max-width: 500px; } .pageinfo-badge { width: 9em; padding-right: 1em; float: left; clip-path: polygon(100% 0, 100% 50%, 90% 70%, 80% 80%, 70% 90%, 50% 100%, 0 100%, 0 0); shape-outside: polygon(100% 0, 100% 50%, 90% 70%, 80% 80%, 70% 90%, 50% 100%, 0 100%, 0 0); } .contents { margin-top: 1em; font: 16px arial,helvetica,verdana,sans-serif; } result other images images simply showing objects or scenes should have alt text describing what's seen in the image.
HTMLImageElement.referrerPolicy - Web APIs
"unsafe-url" meaning that the referrer will include the origin and the path (but not the fragment, password, or username).
... this case is unsafe as it can leak path information that has been concealed to third-party by using tls.
HTMLObjectElement - Web APIs
htmlobjectelement.code is a domstring representing the name of an applet class file, containing either the applet's subclass, or the path to get to the class, including the class file itself.
... htmlobjectelement.codebase is a domstring that reflects the codebase html attribute, specifying the base path to use to resolve relative uris.
IDBDatabase: abort event - Web APIs
// open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = (event) => { const db = event.target.result; // create an objectstore for this database const objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
... // abort the transaction transaction.abort(); }; the same example, but assigning the event handler to the onabort property: // open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = (event) => { const db = event.target.result; // create an objectstore for this database const objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
IDBDatabase: close event - Web APIs
event event handler property onerror examples this example opens a database and listens for the close event: // open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = (event) => { const db = event.target.result; // create an objectstore for this database const objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
... console.log('database connection closed'); }); }; the same example, using the onclose property instead of addeventlistener(): // open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = (event) => { const db = event.target.result; // create an objectstore for this database const objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
IDBDatabase: error event - Web APIs
ng for the error event for the add() operation (this will occur if, for example, a record with the given tasktitle already exists): // open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = (event) => { const db = event.target.result; // create an objectstore for this database const objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
...nst objectstorerequest = objectstore.add(newitem); }; the same example, using the onerror property instead of addeventlistener(): // open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = (event) => { const db = event.target.result; // create an objectstore for this database const objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
IDBDatabase: versionchange event - Web APIs
ndler property onversionchange examples this example opens a database and, on success, adds a listener to versionchange: // open the database const dbopenrequest = window.indexeddb.open('nonexistent', 4); dbopenrequest.onupgradeneeded = event => { const db = event.target.result; // create an objectstore for this database const objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
...le.log('the version of this database has changed'); }); }); the same example, using the onversionchange event handler property: // open the database const dbopenrequest = window.indexeddb.open('nonexistent', 4); dbopenrequest.onupgradeneeded = event => { const db = event.target.result; // create an objectstore for this database const objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
IDBOpenDBRequest: blocked event - Web APIs
erty onblocked examples using addeventlistener(): // open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = (event) => { const db = event.target.result; db.onerror = () => { console.log('error creating database'); }; // create an objectstore for this database var objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
...uest was blocked'); }); }; using the onblocked property: // open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = (event) => { const db = event.target.result; db.onerror = () => { console.log('error creating database'); }; // create an objectstore for this database var objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
IDBOpenDBRequest: upgradeneeded event - Web APIs
// open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.addeventlistener('upgradeneeded', event => { const db = event.target.result; console.log(`upgrading to version ${db.version}`); // create an objectstore for this database var objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }); t...
... // open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = event => { const db = event.target.result; console.log(`upgrading to version ${db.version}`); // create an objectstore for this database var objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; ...
IDBRequest: error event - Web APIs
cord with the given tasktitle already exists): // open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.addeventlistener('upgradeneeded', event => { const db = event.target.result; db.onerror = () => { console.log('error creating database'); }; // create an objectstore for this database var objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }); d...
...ple, using the onerror property instead of addeventlistener(): // open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = event => { const db = event.target.result; db.onerror = () => { console.log('error creating database'); }; // create an objectstore for this database var objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
IDBRequest: success event - Web APIs
base and listens for the success event using addeventlistener(): // open the database const openrequest = window.indexeddb.open('todolist', 4); openrequest.onupgradeneeded = (event) => { const db = event.target.result; db.onerror = () => { console.log('error creating database'); }; // create an objectstore for this database var objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; op...
...he same example, but using the onsuccess event handler property: // open the database const openrequest = window.indexeddb.open('todolist', 4); openrequest.onupgradeneeded = (event) => { const db = event.target.result; db.onerror = () => { console.log('error creating database'); }; // create an objectstore for this database var objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; op...
IDBTransaction: abort event - Web APIs
// open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = event => { const db = event.target.result; db.onerror = () => { console.log('error creating database'); }; // create an objectstore for this database var objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
...mple, but assigning the event handler to the onabort property: // open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = event => { const db = event.target.result; db.onerror = () => { console.log('error creating database'); }; // create an objectstore for this database var objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
IDBTransaction: complete event - Web APIs
perty oncomplete examples using addeventlistener(): // open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = event => { const db = event.target.result; db.onerror = () => { console.log('error creating database'); }; // create an objectstore for this database var objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
...objectstore.add(newitem); }; using the oncomplete property: // open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = event => { const db = event.target.result; db.onerror = () => { console.log('error creating database'); }; // create an objectstore for this database var objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
IDBTransaction: error event - Web APIs
ng for the error event for the add() operation (this will occur if, for example, a record with the given tasktitle already exists): // open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = (event) => { const db = event.target.result; // create an objectstore for this database const objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
...nst objectstorerequest = objectstore.add(newitem); }; the same example, using the onerror property instead of addeventlistener(): // open the database const dbopenrequest = window.indexeddb.open('todolist', 4); dbopenrequest.onupgradeneeded = (event) => { const db = event.target.result; // create an objectstore for this database const objectstore = db.createobjectstore('todolist', { keypath: 'tasktitle' }); // define what data items the objectstore will contain objectstore.createindex('hours', 'hours', { unique: 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 }); }; db...
Transcoding assets for Media Source Extensions - Web APIs
extract the executable from the archive file and add it's location to your path statement.
... creating content for dash given that you have ffmpeg and bento4's utilities accessible through your $path, you can run bento4's mp4-dash-encode.py python script to generate multiple encodings of your content at various resolutions.
Using Service Workers - Web APIs
the path to your service worker file is not written correctly — it needs to be written relative to the origin, not your app’s root directory.
...but the path needs to be written as /sw-test/sw.js, not /sw.js.
URLUtilsReadOnly - Web APIs
urlutilsreadonly.pathname read only is a domstring containing an initial '/' followed by the path of the url.
... nochrome android no support nofirefox android full support 29opera android no support nosafari ios no support nosamsung internet android no support nopathname experimentalchrome no support noedge no support nofirefox full support 3.5ie no support noopera no support nosafari no support ...
Advanced techniques: Creating and sequencing audio - Web APIs
loading the sample we want to make sure our file has loaded and been decoded into a buffer before we use it, so let's create an async function to allow us to do this: async function getfile(audiocontext, filepath) { const response = await fetch(filepath); const arraybuffer = await response.arraybuffer(); const audiobuffer = await audiocontext.decodeaudiodata(arraybuffer); return audiobuffer; } we can then use the await operator when calling this function, which ensures that we can only run subsequent code when it has finished executing.
... let's create another async function to set up the sample — we can combine the two async functions in a nice promise pattern to perform further actions when this file is loaded and buffered: async function setupsample() { const filepath = 'dtmf.mp3'; const sample = await getfile(audioctx, filepath); return sample; } note: you can easily modify the above function to take an array of files and loop over them to load more than one sample.
Migrating from webkitAudioContext - Web APIs
the example below shows old code which downloads an audio file over the network, and then decoded it using createbuffer(): var xhr = new xmlhttprequest(); xhr.open("get", "/path/to/audio.ogg", true); xhr.responsetype = "arraybuffer"; xhr.send(); xhr.onload = function() { var decodedbuffer = context.createbuffer(xhr.response, false); if (decodedbuffer) { // decoding was successful, do something useful with the audio buffer } else { alert("decoding the audio buffer failed"); } }; converting this code to use decodeaudiodata() is relatively simple, as can b...
...e seen below: var xhr = new xmlhttprequest(); xhr.open("get", "/path/to/audio.ogg", true); xhr.responsetype = "arraybuffer"; xhr.send(); xhr.onload = function() { context.decodeaudiodata(xhr.response, function onsuccess(decodedbuffer) { // decoding was successful, do something useful with the audio buffer }, function onfailure() { alert("decoding the audio buffer failed"); }); }; note that the decodeaudiodata() method is asynchronous, which means that it will return immediately, and then when the decoding finishes, one of the success or failure callback functions will get called depending on whether the audio decoding was successful.
Using IIR filters - Web APIs
ffsetwidth; const height = canvascontainer.offsetheight; canvasel.width = width; canvasel.height = height; // set background fill canvasctx.fillstyle = 'white'; canvasctx.fillrect(0, 0, width, height); // set up some spacing based on size const spacing = width/16; const fontsize = math.floor(spacing/1.5); // draw our axis canvasctx.linewidth = 2; canvasctx.strokestyle = 'grey'; canvasctx.beginpath(); canvasctx.moveto(spacing, spacing); canvasctx.lineto(spacing, height-spacing); canvasctx.lineto(width-spacing, height-spacing); canvasctx.stroke(); // axis is gain by frequency -> make labels canvasctx.font = fontsize+'px sans-serif'; canvasctx.fillstyle = 'grey'; canvasctx.filltext('1', spacing-fontsize, spacing+fontsize); canvasctx.filltext('g', spacing-fontsize, (height-spacing+fontsize)/2...
...); canvasctx.filltext('0', spacing-fontsize, height-spacing+fontsize); canvasctx.filltext('hz', width/2, height-spacing+fontsize); canvasctx.filltext('20k', width-spacing, height-spacing+fontsize); // loop over our magnitude response data and plot our filter canvasctx.beginpath(); for(let i = 0; i < magresponseoutput.length; i++) { if (i === 0) { canvasctx.moveto(spacing, height-(magresponseoutput[i]*100)-spacing ); } else { canvasctx.lineto((width/totalarrayitems)*i, height-(magresponseoutput[i]*100)-spacing ); } } canvasctx.stroke(); summary that's it for our iirfilter demo.
Window.open() - Web APIs
WebAPIWindowopen
this can be a path or url to an html page, image file, or any other resource that is supported by the browser.
... examples var windowobjectreference; var windowfeatures = "menubar=yes,location=yes,resizable=yes,scrollbars=yes,status=yes"; function openrequestedpopup() { windowobjectreference = window.open("http://www.cnn.com/", "cnn_windowname", windowfeatures); } var windowobjectreference; function openrequestedpopup() { windowobjectreference = window.open( "http://www.domainname.ext/path/imagefile.png", "descriptivewindowname", "resizable,scrollbars,status" ); } if a window with the name already exists, then url is loaded into the existing window.
Introduction - Web APIs
xsl (extensible stylesheet language) transformations are composed of two parts: xsl elements, which allow the transformation of an xml tree into another markup tree and xpath, a selection language for trees.
...each template matches (using xpath) a certain fragment of the input xml document and then applies the substitution part on that fragment to create the new resulting document.
src - CSS: Cascading Style Sheets
WebCSS@font-facesrc
syntax /* <url> values */ src: url(https://somewebsite.com/path/to/font.woff); /* absolute url */ src: url(path/to/font.woff); /* relative url */ src: url(path/to/font.woff) format("woff"); /* explicit format */ src: url('path/to/font.woff'); /* quoted url */ src: url(path/to/svgfont.svg#example); /* fragment identifying font */ /* <font-face-name> values */ src: local(font); /* unquoted name */ src: local(some font); /* name containing space */ src: local("font"); /* quoted name */ /* multiple items */ src: local(font), url(path/to/font.svg) format("svg"), url(path/t...
...o/font.woff) format("woff"), url(path/to/font.otf) format("opentype"); values <url> [ format( <string># ) ]?
Variable fonts guide - CSS: Cascading Style Sheets
example for a standard upright (roman) font: @font-face { font-family: 'myvariablefontname'; src: 'path/to/font/file/myvariablefont.woff2' format('woff2-variations'); font-weight: 125 950; font-stretch: 75% 125%; font-style: normal; } example for a font that includes both upright and italics: @font-face { font-family: 'myvariablefontname'; src: 'path/to/font/file/myvariablefont.woff2' format('woff2-variations'); font-weight: 125 950; font-stretch: 75% 125%; font-style: oblique 0deg 20deg...
...; } note: there is no set specific value for the upper-end degree measurement in this case; they simply indicate that there is an axis so the browser can know to render upright or italic (remember that italics are only on or off) example for a font that contains only italics and no upright characters: @font-face { font-family: 'myvariablefontname'; src: 'path/to/font/file/myvariablefont.woff2' format('woff2-variations'); font-weight: 125 950; font-stretch: 75% 125%; font-style: italic; } example for a font that contains an oblique (slant) axis: @font-face { font-family: 'myvariablefontname'; src: 'path/to/font/file/myvariablefont.woff2' format('woff2-variations'); font-weight: 125 950; font-stretch: 75% 125%; font-style: oblique 0deg 12deg; } note: not all browsers have impl...
Animatable CSS properties - CSS: Cascading Style Sheets
der-left border-left-color border-left-width border-radius border-right border-right-color border-right-width border-start-end-radius border-start-start-radius border-top border-top-color border-top-left-radius border-top-right-radius border-top-width border-width bottom box-shadow caret-color clip clip-path color column-count column-gap column-rule column-rule-color column-rule-width column-width columns filter flex flex-basis flex-grow flex-shrink font font-size font-size-adjust font-stretch font-variation-settings font-weight gap grid-column-gap grid-gap grid-row-gap grid-templat...
... margin-inline-end margin-inline-start margin-left margin-right margin-top mask mask-border mask-position mask-size max-block-size max-height max-inline-size max-lines max-width min-block-size min-height min-inline-size min-width object-position offset offset-anchor offset-distance offset-path offset-position offset-rotate opacity order outline outline-color outline-offset outline-width padding padding-block-end padding-block-start padding-bottom padding-inline-end padding-inline-start padding-left padding-right padding-top perspective perspective-origin right rotate row-gap ...
Linear-gradient Generator - CSS: Cascading Style Sheets
ient-axis .rotate-point { width: 25px; height: 25px; position: absolute; top: -10.5px; right: -12px; } .gradient-axis[axisid='0']:after { background-color: #da5c5c; } .gradient-axis[axisid='1']:after { background-color: #5cda9b; } .gradient-axis[axisid='2']:after { background-color: #5c9bda; } .gradient-axis[axisid='3']:after { background-color: #5c5cda; } .gradient-axis[axisid='0'] path { fill: #da5c5c; } .gradient-axis[axisid='1'] path { fill: #5cda9b; } .gradient-axis[axisid='2'] path { fill: #5c9bda; } .gradient-axis[axisid='3'] path { fill: #5c5cda; } .gradient-axis .rotate-point:hover { cursor: pointer; } /** * controls */ #controls { width: 100%; margin: 0 auto; display: table; } #controls .section { width: 50%; padding: 10px; display: table; float: l...
...s.updateonresize(); trackmouse(rotate_point, this.updateaxisangle.bind(this), this.startrotation.bind(this)); container.appendchild(axis); line.addeventlistener('click', this.placegradientpoint.bind(this)); }; gradientaxis.prototype.createsvgarrow = function createsvgarrow(id) { var xmlns = 'http://www.w3.org/2000/svg'; var svg = document.createelementns(xmlns, 'svg'); var path = document.createelementns(xmlns, 'path'); svg.setattribute('class', 'gradient-arrow'); svg.setattribute('width', '25'); svg.setattribute('height', '25'); path.setattribute('fill', '#ccc'); path.setattribute('d', 'm 25,12.5 l 0,0 l 7.5,12.5 l 0,25'); svg.appendchild(path); return svg; }; gradientaxis.prototype.placegradientpoint = function placegradientpoint(e) { this.updat...
clip - CSS: Cascading Style Sheets
WebCSSclip
/* keyword value */ clip: auto; /* <shape> values */ clip: rect(1px 10em 3rem 2ch); clip: rect(1px, 10em, 3rem, 2ch); /* global values */ clip: inherit; clip: initial; clip: unset; syntax note: where possible, authors are encouraged to use the newer clip-path property instead.
... candidate recommendation deprecates clip property, suggests clip-path as replacement.
offset-position - CSS: Cascading Style Sheets
the offset-position css property defines the initial position of the offset-path.
...| [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ] ]where <length-percentage> = <length> | <percentage> examples setting initial offset position <div id="motion-demo"></div> #motion-demo { offset-path: path('m20,20 c20,100 200,0 200,100'); offset-position: left top; animation: move 3000ms infinite alternate ease-in-out; width: 40px; height: 40px; background: cyan; } @keyframes move { 0% { offset-distance: 0%; } 100% { offset-distance: 100%; } } specifications specification status comment motion path module level 1the definition of 'offse...
<shape> - CSS: Cascading Style Sheets
WebCSSshape
note: <shape> and rect() work in conjunction with clip, which has been deprecated in favor of clip-path.
... when possible, use clip-path and the <basic-shape> data type instead.
Ajax - Developer guides
WebGuideAJAX
xpath xpath stands for xml path language, it uses a non-xml syntax that provides a flexible way of addressing (pointing to) different parts of an xml document.
... see also ajax: a new approach to web applications jesse james garrett, of adaptive path, wrote this article in february 2005, introducing ajax and its related concepts.
A hybrid approach - Developer guides
the bad one downside of mixing approaches is that it can lead to an increase in the number of code paths, both on the client and server side.
...in fact, one potential path for the main mozilla site is roughly outlined in the “the good” section above: using user-agent detection, route visitors to a landing page for the firefox version for their device.
<a>: The Anchor element - HTML: Hypertext Markup Language
WebHTMLElementa
can be used with or without a value: without a value, the browser will suggest a filename/extension, generated from various sources: the content-disposition http header the final segment in the url path the media type (from the (content-type header, the start of a data: url, or blob.type for a blob: url) defining a value suggests it as the filename.
...> <canvas width="300" height="300"></canvas> css html { font-family: sans-serif; } canvas { background: #fff; border: 1px dashed; } a { display: inline-block; background: #69c; color: #fff; padding: 5px 10px; } javascript var canvas = document.queryselector('canvas'), c = canvas.getcontext('2d'); c.fillstyle = 'hotpink'; function draw(x, y) { if (isdrawing) { c.beginpath(); c.arc(x, y, 10, 0, math.pi*2); c.closepath(); c.fill(); } } canvas.addeventlistener('mousemove', event => draw(event.offsetx, event.offsety) ); canvas.addeventlistener('mousedown', () => isdrawing = true); canvas.addeventlistener('mouseup', () => isdrawing = false); document.queryselector('a').addeventlistener('click', event => event.target.href = canvas.todataurl() ); re...
Content Security Policy (CSP) - HTTP
WebHTTPCSP
_/csp-reports, when the document is visited: { "csp-report": { "document-uri": "http://example.com/signup.html", "referrer": "", "blocked-uri": "http://example.com/css/style.css", "violated-directive": "style-src cdn.example.com", "original-policy": "default-src 'none'; style-src cdn.example.com; report-uri /_/csp-reports" } } as you can see, the report includes the full path to the violating resource in blocked-uri.
...for example, if the signup.html attempted to load css from http://anothercdn.example.com/stylesheet.css, the browser would not include the full path, but only the origin (http://anothercdn.example.com).
Content-Security-Policy-Report-Only - HTTP
ent is visited: { "csp-report": { "document-uri": "http://example.com/signup.html", "referrer": "", "blocked-uri": "http://example.com/css/style.css", "violated-directive": "style-src cdn.example.com", "original-policy": "default-src 'none'; style-src cdn.example.com; report-uri /_/csp-reports", "disposition": "report" } } as you can see, the report includes the full path to the violating resource in blocked-uri.
...for example, when the signup.html would attempt to load css from http://anothercdn.example.com/stylesheet.css, the browser would not include the full path but only the origin (http://anothercdn.example.com).
Origin - HTTP
WebHTTPHeadersOrigin
it doesn't include any path information, but only the server name.
...it is similar to the referer header, but, unlike this header, it doesn't disclose the whole path.
HTTP headers - HTTP
WebHTTPHeaders
proxies forwarded contains information from the client-facing side of proxy servers that is altered or lost when a proxy is involved in the path of the request.
... service-worker-allowed used to remove the path restriction by including this header in the response of the service worker script.
HTTP Messages - HTTP
WebHTTPMessages
the request target, usually a url, or the absolute path of the protocol, port, and domain are usually characterized by the request context.
...it can be an absolute path, ultimately followed by a '?' and query string.
Proxy Auto-Configuration (PAC) file - HTTP
the path and query components of https:// urls are stripped.
... in chrome (versions 52 to 73), you can disable this by setting pachttpsurlstrippingenabled to false in policy or by launching with the --unsafe-pac-url command-line flag (in chrome 74, only the flag works, and from 75 onward, there is no way to disable path-stripping; as of chrome 81, path-stripping does not apply to http urls, but there is interest in changing this behavior to match https); in firefox, the preference is network.proxy.autoconfig_url.include_path.
Grammar and types - JavaScript
this is called hashbang comment syntax, and is a special comment used to specify the path to a particular javascript engine that should execute the script.
...for example, to assign the file path c:\temp to a string, use the following: var home = 'c:\\temp'; you can also escape line breaks by preceding them with backslash.
SyntaxError: Using //@ to indicate sourceURL pragmas is deprecated. Use //# instead - JavaScript
//@ sourcemappingurl=http://example.com/path/to/your/sourcemap.map standard syntax use the "#" sign instead.
... //# sourcemappingurl=http://example.com/path/to/your/sourcemap.map or, alternatively, you can set a sourcemap header to your javascript file to avoid having a comment at all: sourcemap: /path/to/file.js.map ...
Error.prototype.fileName - JavaScript
the filename property contains the path to the file that raised this error.
... description this non-standard property contains the path to the file that raised this error.
import - JavaScript
syntax import defaultexport from "module-name"; import * as name from "module-name"; import { export1 } from "module-name"; import { export1 as alias1 } from "module-name"; import { export1 , export2 } from "module-name"; import { foo , bar } from "module-name/path/to/specific/un-exported/file"; import { export1 , export2 as alias2 , [...] } from "module-name"; import defaultexport, { export1 [ , [...] ] } from "module-name"; import defaultexport, * as name from "module-name"; import "module-name"; var promise = import("module-name"); defaultexport name that will refer to the default export from the module.
...this is often a relative or absolute path name to the .js file containing the module.
Lazy loading - Web Performance
it's a way to shorten the length of the critical rendering path, which translates into reduced page load times.
... one of the methods we can use to tackle this problem is to shorten the critical rendering path length by lazy loading resources that are not critical for the first render to happen.
Progressive loading - Progressive web apps (PWAs)
the js13kpwa app uses a placeholder image instead, which is small and lightweight, while the final paths to target images are stored in data-src attributes: <img src='data/img/placeholder.png' data-src='data/img/slug.jpg' alt='name'> those images will be loaded via javascript after the site finishes building the html structure.
...ript the app.js file processes the data-src attributes like so: let imagestoload = document.queryselectorall('img[data-src]'); const loadimages = (image) => { image.setattribute('src', image.getattribute('data-src')); image.onload = () => { image.removeattribute('data-src'); }; }; the imagestoload variable contains references to all the images, while the loadimages function moves the path from data-src to src.
alignment-baseline - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following four elements: <tspan>, <tref>, <altglyph>, and <textpath> usage notes value auto | baseline | before-edge | text-before-edge | middle | central | after-edge | text-after-edge | ideographic | alphabetic | hanging | mathematical | top | center | bottom default value auto animatable yes auto the value is the dominant-baseline of the script to which the character belongs - i.e., use the dominant-baseline of...
... example <svg width="300" height="120" viewbox="0 0 300 120" xmlns="http://www.w3.org/2000/svg"> <!-- materialisation of anchors --> <path d="m60,10 l60,110 m30,10 l300,10 m30,65 l300,65 m30,110 l300,110 " stroke="grey" /> <!-- anchors in action --> <text alignment-baseline="hanging" x="60" y="10">a hanging</text> <text alignment-baseline="middle" x="60" y="65">a middle</text> <text alignment-baseline="baseline" x="60" y="110"...
class - SVG: Scalable Vector Graphics
WebSVGAttributeclass
troke: #006600; fill: #cc0000; } ]]> </style> <rect class="rectclass" x="10" y="10" width="100" height="100"/> <circle class="circleclass" cx="40" cy="50" r="26"/> </svg> </body> </html> elements the following elements can use the class attribute: <a> <altglyph> <circle> <clippath> <defs> <desc> <ellipse> <feblend> <fecolormatrix> <fecomponenttransfer> <fecomposite> <feconvolvematrix> <fediffuselighting> <fedisplacementmap> <feflood> <fegaussianblur> <feimage> <femerge> <femorphology> <feoffset> <fespecularlighting> <fetile> <feturbulence> <filter> <font> <foreignobject> <g> <glyph> <glyphref> <image> <line> <lineargradient> <marker> <mask> <...
...missing-glyph> <path> <pattern> <polygon> <polyline> <radialgradient> <rect> <stop> <svg> <switch> <symbol> <text> <textpath> <title> <tref> <tspan> <use> ...
marker-mid - SVG: Scalable Vector Graphics
the marker is rendered on every vertex other than the first and last vertices of the path data.
... as a presentation attribute, it can be applied to any element but it has effect only on the following seven elements: <circle>, <ellipse>, <line>, <path>, <polygon>, <polyline>, and <rect> html, body, svg { height: 100%; } <svg viewbox="0 0 120 120" xmlns="http://www.w3.org/2000/svg"> <defs> <marker id="circle" markerwidth="8" markerheight="8" refx="4" refy="4"> <circle cx="4" cy="4" r="4" stroke="none" fill="#f00"/> </marker> </defs> <polyline fill="none" stroke="black" points="20,100 40,60 70,80 100,20" marker-mid="url(#circle)"/> </svg> usage notes value none | <marker-ref> default value none animatable yes none indicates that...
shape-rendering - SVG: Scalable Vector Graphics
the shape-rendering attribute provides hints to the renderer about what tradeoffs to make when rendering shapes like paths, circles, or rectangles.
... as a presentation attribute, it can be applied to any element but it has effect only on the following seven elements: <circle>, <ellipse>, <line>, <path>, <polygon>, <polyline>, and <rect> html, body, svg { height: 100%; } <svg viewbox="0 0 420 200" xmlns="http://www.w3.org/2000/svg"> <circle cx="100" cy="100" r="100" shape-rendering="geometricprecision"/> <circle cx="320" cy="100" r="100" shape-rendering="crispedges"/> </svg> usage notes value auto | optimizespeed | crispedges | geometricprecision default value auto animatable yes auto this value indicates that the user agent shall make appropriate tradeoffs to balance speed, crisp edges and geomet...
stroke-dashoffset - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following twelve elements: <altglyph>, <circle>, <ellipse>, <path>, <line>, <polygon>, <polyline>, <rect>, <text>, <textpath>, <tref>, and <tspan> html,body,svg { height:100% } <svg viewbox="-3 0 33 10" xmlns="http://www.w3.org/2000/svg"> <!-- no dash array --> <line x1="0" y1="1" x2="30" y2="1" stroke="black" /> <!-- no dash offset --> <line x1="0" y1="3" x2="30" y2="3" stroke="black" stroke-dasharray="3 1" /> <!-- the start of the dash array computation is pulled...
... 1" stroke-dashoffset="-3" /> <!-- the start of the dash array computation is pulled by 1 user units which ends up in the same rendering as the previous example --> <line x1="0" y1="9" x2="30" y2="9" stroke="black" stroke-dasharray="3 1" stroke-dashoffset="1" /> <!-- the following red lines highlight the offset of the dash array for each line --> <path d="m0,5 h-3 m0,7 h3 m0,9 h-1" stroke="rgba(255,0,0,.5)" /> </svg> usage notes value <percentage> | <length> default value 0 animatable yes the offset is usually expressed in user units resolved against the pathlength but if a <percentage> is used, the value is resolved as a percentage of the current viewport.
transform - SVG: Scalable Vector Graphics
html,body,svg { height:100% } <svg viewbox="-40 0 150 100" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <g fill="grey" transform="rotate(-10 50 100) translate(-36 45.5) skewx(40) scale(1 0.5)"> <path id="heart" d="m 10,30 a 20,20 0,0,1 50,30 a 20,20 0,0,1 90,30 q 90,60 50,90 q 10,60 10,30 z" /> </g> <use xlink:href="#heart" fill="none" stroke="red"/> </svg> note: as of svg2, transform is a presentation attribute, meaning it can be used as a css property.
... as a presentation attribute, transform can be used by any element (in svg 1.1, only these 16 elements were allowed to use it: <a>, <circle>, <clippath>, <defs>, <ellipse>, <foreignobject>, <g>, <image>, <line>, <path>, <polygon>, <polyline>, <rect>, <switch>, <text>, and <use>).
writing-mode - SVG: Scalable Vector Graphics
the writing-mode attribute applies only to <text> elements; the attribute is ignored for <tspan>, <tref>, <altglyph> and <textpath> sub-elements.
... as a presentation attribute, it can be applied to any element but it has effect only on the following five elements: <altglyph>, <text>, <textpath>, <tref>, and <tspan> usage notes default value horizontal-tb value horizontal-tb | vertical-rl | vertical-lr animatable yes horizontal-tb this value defines a top-to-bottom block flow direction.
xlink:title - SVG: Scalable Vector Graphics
these elements are using this attribute: <a>, <altglyph>, <animate>, <animatecolor>, <animatemotion>, <animatetransform>, <color-profile>, <cursor>, <feimage>, <filter>, <font-face-uri>, <glyphref>, <image>, <lineargradient>, <mpath>, <pattern>, <radialgradient>, <script>, <set>, <textpath>, <tref>, and <use> usage context value <anything> default value none animatable no <anything> this value specifies the title used to describe the meaning of the link or resource.
... candidate recommendation deprecated the attribute and made it only apply to <a>, <image>, <lineargradient>, <pattern>, <radialgradient>, <script>, <textpath>, and <use> scalable vector graphics (svg) 1.1 (second edition)the definition of 'seed' in that specification.
<a> - SVG: Scalable Vector Graphics
WebSVGElementa
value type: <url> ; default value: none; animatable: yes global attributes core attributes most notably: id, lang, tabindex styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, document element event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility xlink attributes most notably: xlink:title aria attributes aria-active...
...red, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriescontainer elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specifications specification status comment scalable vector graphics (svg) 2the definition of '<a>' in that specification.
<circle> - SVG: Scalable Vector Graphics
WebSVGElementcircle
value type: <length> ; default value: 0; animatable: yes pathlength the total length for the circle's circumference, in user units.
... global attributes core attributes most notably: id, tabindex styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, a...
<defs> - SVG: Scalable Vector Graphics
WebSVGElementdefs
rgradient> </defs> <!-- using my graphical objects --> <use x="5" y="5" xlink:href="#mycircle" fill="url('#mygradient')" /> </svg> attributes global attributes core attributes most notably: id lang styling attributes class, style event attributes global event attributes, document element event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility usage notes categoriescontainer element, structural elementpermitted co...
...ntentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specifications specification status comment scalable vector graphics (svg) 2the definition of '<defs>' in that specification.
<ellipse> - SVG: Scalable Vector Graphics
WebSVGElementellipse
value type: auto|<length>|<percentage> ; default value: auto; animatable: yes pathlength this attribute lets specify the total length for the path, in user units.
... global attributes core attributes most notably: id, tabindex styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, a...
<g> - SVG: Scalable Vector Graphics
WebSVGElementg
="60" cy="60" r="25" /> </g> </svg> attributes this element only includes global attributes global attributes core attributes most notably: id, tabindex styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, a...
...ption, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriescontainer element, structural elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specifications specification status comment scalable vector graphics (svg) 2the definition of '<g>' in that specification.
<glyph> - SVG: Scalable Vector Graphics
WebSVGElementglyph
usage context categoriestext content elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> attributes global attributes core attributes presentation attributes class style specific attributes d horiz-adv-x vert-origin-x vert-origin-y vert-adv-y unicode glyph-name orientation arabic-form lang dom interface this element implements the svgglyphelement interface.
... <font-face font-family="super sans" font-weight="bold" font-style="normal" units-per-em="1000" cap-height="600" x-height="400" ascent="700" descent="300" alphabetic="0" mathematical="350" ideographic="400" hanging="500"> <font-face-src> <font-face-name name="super sans bold"/> </font-face-src> </font-face> <missing-glyph><path d="m0,0h200v200h-200z"/></missing-glyph> <glyph unicode="!" horiz-adv-x="80" d="m0,0h200v200h-200z"></glyph> <glyph unicode="@" d="m0,50l100,300l400,100z"></glyph> </font> </defs> <text x="100" y="100" style="font-family: 'super sans', helvetica, sans-serif; font-weight: bold; font-style: normal">text using embe@dded font!</text> </svg> result speci...
<line> - SVG: Scalable Vector Graphics
WebSVGElementline
value type: <length>|<percentage>|<number> ; default value: 0; animatable: yes pathlength defines the total path length in user units.
... value type: <number> ; default value: none; animatable: yes global attributes core attributes most notably: id, tabindex styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcoun...
<pattern> - SVG: Scalable Vector Graphics
WebSVGElementpattern
value type: <length>|<percentage> ; default value: 0; animatable: yes global attributes core attributes most notably: id, tabindex styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility xlink attributes most notably: xlink:title usage notes categoriescont...
...ainer elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specifications specification status comment scalable vector graphics (svg) 2the definition of '<pattern>' in that specification.
<polygon> - SVG: Scalable Vector Graphics
WebSVGElementpolygon
value type: <number>+ ; default value: ""; animatable: yes pathlength this attribute lets specify the total length for the path, in user units.
... value type: <number> ; default value: none; animatable: yes global attributes core attributes most notably: id, tabindex styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcoun...
<polyline> - SVG: Scalable Vector Graphics
WebSVGElementpolyline
points="0,100 50,25 50,75 100,0" /> <!-- example of the same polyline shape with stroke and no fill --> <polyline points="100,100 150,25 150,75 200,0" fill="none" stroke="black" /> </svg> attributes points this attribute defines the list of points (pairs of x,y absolute coordinates) required to draw the polyline value type: <number>+ ; default value: ""; animatable: yes pathlength this attribute lets specify the total length for the path, in user units.
... value type: <number> ; default value: none; animatable: yes global attributes core attributes most notably: id, tabindex styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcoun...
<rect> - SVG: Scalable Vector Graphics
WebSVGElementrect
value type: auto|<length>|<percentage> ; default value: auto; animatable: yes pathlength the total length of the rectangle's perimeter, in user units.
... global attributes core attributes most notably: id, tabindex styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, a...
<svg> - SVG: Scalable Vector Graphics
WebSVGElementsvg
global attributes core attributes most notably: id, tabindex styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes, document event attributes, document element event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, a...
...ption, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role usage notes categoriescontainer element, structural elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specifications specification status comment scalable vector graphics (svg) 2the definition of '<svg>' in that specification.
<text> - SVG: Scalable Vector Graphics
WebSVGElementtext
it's possible to apply a gradient, pattern, clipping path, mask, or filter to <text>, like any other svg graphics element.
...es global attributes core attributes most notably: id, tabindex styling attributes class, style, font-family, font-size, font-size-adjust, font-stretch, font-style, font-variant, font-weight conditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, dominant-baseline, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, text-anchor, transform, vector-effect, visibility aria attributes aria-activedescendant, a...
Same-origin policy - Web security
(a "tuple" is a set of items that together comprise a whole — a generic form for double/triple/quadruple/quintuple/etc.) the following table gives examples of origin comparisons with the url http://store.company.com/dir/page.html: url outcome reason http://store.company.com/dir2/other.html same origin only the path differs http://store.company.com/dir/inner/another.html same origin only the path differs https://store.company.com/page.html failure different protocol http://store.company.com:81/dir/page.html failure different port (http:// is port 80 by default) http://news.company.com/dir/page.html failure different host inherited origins sc...
...when you set a cookie, you can limit its availability using the domain, path, secure, and httponly flags.
<xsl:apply-templates> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:apply-templates> element selects a set of nodes in the input tree and instructs the processor to apply the proper templates to them.
... optional attributes select uses an xpath expression that specifies the nodes to be processed.
<xsl:copy-of> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementcopy-of
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:copy-of> element makes a deep copy (including descendant nodes) of whatever the select attribute specifies to the output document.
... syntax <xsl:copy-of select=expression /> required attributes select uses an xpath expression that specifies what is to be copied.
<xsl:for-each> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementfor-each
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:for-each> element selects a set of nodes and processes each of them in the same way.
... syntax <xsl:for-each select=expression> <xsl:sort> [optional] template </xsl:for-each> required attributes select uses an xpath expression to select nodes to be processed.
<xsl:if> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementif
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:if> element contains a test attribute and a template.
... syntax <xsl:if test=expression> template </xsl:if> required attributes test contains an xpath expression that can be evaluated (using the rules defined for boolean( ) if necessary) to a boolean value.
<xsl:key> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementkey
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:key> element declares a named key which can be used elsewhere in the stylesheet with the key( ) function.
... use specifies an xpath expression that will be used to determine the value of the key for each of the applicable nodes.
<xsl:number> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementnumber
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:number> element counts things sequentially.
...it uses an xpath expression.
<xsl:param> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementparam
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:param> element establishes a parameter by name and, optionally, a default value for that parameter.
... optional attributes select uses an xpath expression to provide a default value if none is specified.
<xsl:sort> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementsort
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:sort> element defines a sort key for nodes selected by <xsl:apply-templates> or <xsl:for-each> and determines the order in which they are processed.
... optional attributes select uses an xpath expression to specify the nodes to be sorted.
<xsl:value-of> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementvalue-of
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:value-of> element evaluates an xpath expression, converts it to a string, and writes that string to the result tree.
... syntax <xsl:value-of select=expression disable-output-escaping="yes" | "no" /> required attributes select specifies the xpath expression to be evaluated and written to the output tree.
<xsl:variable> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementvariable
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:variable> element declares a global or local variable in a stylesheet and gives it a value.
... optional attributes select defines the value of the variable through an xpath expression.
<xsl:with-param> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:with-param> element sets the value of a parameter to be passed into a template.
... optional attributes select defines the value of the parameter through an xpath expression.
Transforming XML with XSLT - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes an overview the separation of content and presentation is a key design feature of xml.
... xslt/xpath reference elements xsl:apply-imports (supported) xsl:apply-templates (supported) xsl:attribute (supported) xsl:attribute-set (supported) xsl:call-template (supported) xsl:choose (supported) xsl:comment (supported) xsl:copy (supported) xsl:copy-of (supported) xsl:decimal-format (supported) xsl:element (supported) xsl:fallback (not supported) xsl:for-each (supported) xsl:if (suppor...
Advanced Example - XSLT: Extensible Stylesheet Language Transformations
however, the value needs to be an xpath expression and not a string, so {$myorder} is used.
... using {} evaluates the content as an xpath expression.
Compiling a New C/C++ Module to WebAssembly - WebAssembly
file://your_path/hello.html), you will end up with an error message along the lines of both async and sync fetching of the wasm failed.
... we've also specified --shell-file html_template/shell_minimal.html — this provides the path to the html template you want to use to create the html you will run your example through.
Loading and running WebAssembly code - WebAssembly
webassembly is not yet integrated with <script type='module'> or es2015 import statements, thus there is not a path to have the browser fetch modules for you using imports.
...again, assuming our module is called simple.wasm: create a new xmlhttprequest() instance, and use its open() method to open a request, setting the request method to get, and declaring the path to the file we want to fetch.
Compiling from Rust to WebAssembly - WebAssembly
note: pay attention to the post-install note about needing cargo's bin directory in your system path.
...create webpack.config.js and put the following in it: const path = require('path'); module.exports = { entry: "./index.js", output: { path: path.resolve(__dirname, "dist"), filename: "index.js", }, mode: "development" }; now we need an html file; create index.html and give it the following contents: <!doctype html> <html> <head> <meta charset="utf-8"> <title>hello-wasm example</title> </head> <body> <script src="./index.js">...
Converting WebAssembly text format to wasm - WebAssembly
once you’ve got the tool built, add the /wabt/out/clang/debug directory to your system path.
... 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.
XUL Migration Guide - Archive of obsolete content
in that directory you can keep your "content", "locale", and "skin" subdirectories: this allows you to refer to objects in these directories from "chrome.manifest" using a relative path, like "chrome/content".
indexed-db - Archive of obsolete content
error = function(e) { console.error(e.value) } function open(version) { var request = indexeddb.open("stuff", version); request.onupgradeneeded = function(e) { var db = e.target.result; e.target.transaction.onerror = database.onerror; if(db.objectstorenames.contains("items")) { db.deleteobjectstore("items"); } var store = db.createobjectstore("items", {keypath: "time"}); }; request.onsuccess = function(e) { database.db = e.target.result; }; request.onerror = database.onerror; }; function additem(name) { var db = database.db; var trans = db.transaction(["items"], "readwrite"); var store = trans.objectstore("items"); var time = new date().gettime(); var request = store.put({ "name": name, "time": time }); request.one...
page-mod - Archive of obsolete content
are attached to all documents whose url matches the rule: so if your rule matches a specific hostname and path, and the topmost document that satisfies the rule includes ten iframes using a relative url, then your page-mod is applied eleven times.
loader/sandbox - Archive of obsolete content
load(scope, 'resource://path/to/my/script.js'); load(scope, 'file:///path/to/script.js'); load(scope, 'data:,var a = 5;'); globals functions sandbox(source) make a new sandbox that inherits principals from source.
system/child_process - Archive of obsolete content
the sdk versions don't: so when you specify a command you must pass in a complete path to the command or use the env option to set up the child process environment.
system/environment - Archive of obsolete content
usage var { env } = require('sdk/system/environment'); you can get the value of an environment variable, by accessing the property with the name of the desired variable: var path = env.path; you can check for the existence of an environment variable by checking whether a property with that variable name exists: console.log('path' in env); // true console.log('foo' in env); // false you can set the value of an environment variable by setting the property: env.foo = 'foo'; env.path += ':/my/path/' you can unset an environment variable by deleting the property: delete env.foo; limitations there is no way to enumerate existing environment variables, also env won't have any enumerable properties: console.log(object.keys(env)); // [] env...
test/httpd - Archive of obsolete content
usage the most basic usage is: var { startserverasync } = require("sdk/test/httpd"); var srv = startserverasync(port, basepath); require("sdk/system/unload").when(function cleanup() { srv.stop(function() { // you should continue execution from this point.
ui/sidebar - Archive of obsolete content
so you can rewrite the above code like this: var sidebar = require("sdk/ui/sidebar").sidebar({ id: 'my-sidebar', title: 'my sidebar', url: "./sidebar.html" }); you can include javascript and css from the html as you would with any web page, for example using <script> and <link> tags containing a path relative to the html file itself.
Low-Level APIs - Archive of obsolete content
fs/path provides access to the local filesystem with the nodejs path module api.
Getting started (cfx) - Archive of obsolete content
another example using grunt and grunt-shell: module.exports = function(grunt) { 'use strict'; require('matchdep').filterdev('grunt-!(cli)').foreach(grunt.loadnpmtasks); grunt.initconfig({ shell: { xpi: { command: [ 'cd pluginpath', 'cfx xpi', 'wget --post-file=pluginname.xpi http://localhost:8888/ || echo>/dev/null' ].join('&&') } }, watch: { xpi: { files: ['pluginpath/**'], tasks: ['shell:xpi'] } } }); grunt.loadnpmtasks('grunt-contrib-watch'); grunt.loadnpmtasks('grunt-shell'); grunt.registertask('default', ['watch']); }; ...
Unit Testing - Archive of obsolete content
ello", "atob works"); } exports["test btoa"] = function(assert) { assert.ok(base64.btoa("hello") == "agvsbg8=", "btoa works"); } exports["test empty string"] = function(assert) { assert.throws(function() { base64.atob(); }, "empty string check works"); } require("sdk/test").run(exports); note that with jpm we must give the exact relative path to the base64.js module.
Bootstrapped extensions - Archive of obsolete content
installpath nsifile the installation location of the add-on being bootstrapped.
Cookies - Archive of obsolete content
services.cookies.add(".host.example.com", "/cookie-path", "cookie_name", "cookie_value", is_secure, is_http_only, is_session, expiry_date); see also document.cookie nsicookie nsicookie2 nsicookieservice nsicookiemanager nsicookiemanager2 http cookies ...
Downloading Files - Archive of obsolete content
downloading files to download a file, create an instance of nsiwebbrowserpersist and call its nsiwebbrowserpersist.saveuri() method, passing it a url to download and an nsifile instance representing the local file name/path.
Examples and demos from articles - Archive of obsolete content
convert relative paths to absolute this example show how to translate relative paths to absolute paths.
HTML to DOM - Archive of obsolete content
let's take a look at the donkeyfire.donkeybrowser_onpageload() handler: donkeybrowser_onpageload: function(aevent) { var doc = aevent.originaltarget; var url = doc.location.href; if (aevent.originaltarget.nodename == "#document") { // ok, it's a real page, let's do our magic dump("[df] url = "+url+"\n"); var text = doc.evaluate("/html/body/h1",doc,null,xpathresult.string_type,null).stringvalue; dump("[df] text in /html/body/h1 = "+text+"\n"); } }, as you can see, we obtain full access to the dom of the page we loaded in background, and we can even evaluate xpath expressions.
JS XPCOM - Archive of obsolete content
for example, var nsfile = components.constructor("@mozilla.org/file/local;1", "nsifile", "initwithpath"); var file = new nsfile(filepath); they can also be created and initialized manually: var file = components.classes["@mozilla.org/file/local;1"] .createinstance(components.interfaces.nsifile); file.initwithpath(filepath); this creates a new instance of the object with contract id @mozilla.org/file/local;1 and allows you to call methods from the nsifile interface on it.
Running applications - Archive of obsolete content
var file = components.classes["@mozilla.org/file/local;1"] .createinstance(components.interfaces.nsilocalfile); file.initwithpath("c:\\myapp.exe"); file.launch(); references nsiprocess nsilocalfile if you need to launch an executable bundled in your xpi, see code snippets:file i/o#getting your extension's folder.
XML-related code snippets - Archive of obsolete content
how to create a dom tree using xmlhttprequest parsing and serializing xml using xpath jxon (lossless javascript xml object notation) xsl transforms xlink xinclude xml:id xml:base support in old browsers xpointer svg namespaces, or why http://www.mozilla.org/keymaster/gat...re.is.only.xul is at the top of every xul document.
Installing Extensions and Themes From Web Pages - Archive of obsolete content
thus you should only use updateenabled to display content in the page to alert the user that software installation is disabled, or your site is not in the whitelist—do not place it in the install code path.
Migrating raw components to add-ons - Archive of obsolete content
this leads to a better compatibility path as new versions of firefox are released.
Chapter 1: Introduction to Extensions - Archive of obsolete content
locationbar separates a url’s domain and path in the location bar for easier reading.
Chapter 3: Introduction to XUL—How to build a more intuitive UI - Archive of obsolete content
note: you may use a relative path to access a chrome url from an xul document.
Appendix D: Loading Scripts - Archive of obsolete content
if the argument is not an absolute path, the module is imported relative to the caller's filename.
JavaScript Object Management - Archive of obsolete content
just like with the chrome, we define the package name and then a path.
Local Storage - Archive of obsolete content
there are two paths you can take when creating the local database you'll be using for your extension: generate the database file (through mozistorageservice.opendatabase(), all tables (through mozistorageconnection.createtable(), and initial data when your extension starts up for the first time.
Mozilla Documentation Roadmap - Archive of obsolete content
all of these provide advanced search capabilities, including regular expression search and file path search.
Signing an extension - Archive of obsolete content
sign the basic usage of the signing tool is as follows: nss-signtool \ -d (path to the directory that contains your certificate database files) \ -k (your certificate nickname) \ -p (your certificate password) \ -x -z (output path/name of signed file) \ (path to your extension working directory that contains chrome directory, chrome.manifest file, install.rdf file, etc.) writing your password directly in the script is dangerous.
CSS3 - Archive of obsolete content
motion path module level 1 working draft css fonts module level 4 working draft css easing functions level 1 working draft css logical properties and values level 1 editor's draft modules in the revising phase modules that are in the revising phase are much less stable than those in the refining phase.
Creating a status bar extension - Archive of obsolete content
this path is relative to the extension's root folder in this case, but can be absolute if you want it to be.
JXON - Archive of obsolete content
note: if you are interested to address only some parts of an xml document (and are not starting in javascript/json for templating purposes), use xpath instead of converting the whole document into json.
MMgc - Archive of obsolete content
i think we want the later because: all wb's take the fast path when we're not marking, so the more time we spend out of the marking phase the better performance will be overall applications that have low or steady state memory requirements shouldn't suffer any marking penalty the first thing to determine is when we decide to start marking.
ActiveX Control for Hosting Netscape Plug-ins in IE - Archive of obsolete content
assuming you have cvs somewhere in your path, type this from a command prompt: c:\> set cvsroot=:pserver:anonymous@cvs-mirror.mozilla.org:/cvsroot c:\> set home=\temp c:\> cvs login (logging in to anonymous@cvs-mirror.mozilla.org) cvs password: anonymous c:\> cvs -z3 co mozilla/embedding/browser/activex/src/pluginhostctrl this fetches the source for the control into mozilla\embedding\browser\activex\src\pluginhostctrl.
Structure of an installable bundle - Archive of obsolete content
basic structure of a bundle a bundle may include any of the following files: path from the root of the bundle description version information /install.rdf extension/theme install manifest /application.ini application launch manifest /bootstrap.js the bootstrap script for extensions not requiring a restart (those with <em:bootstrap>true</em:bootstrap> in their install.rdf).
Creating a Firefox sidebar extension - Archive of obsolete content
open your profile folder open the extensions folder (create it if it doesn't exist) create a new text file, and put the path to your extension folder inside, e.g.
Finding the file to modify - Archive of obsolete content
chrome urls have paths that do not necessarily refer to a precise directory hierarchy.
Getting Started - Archive of obsolete content
select them all and zip them up, making sure to include the paths (do not include the \myskin directory inside of the zip, just the files inside of \myskin).
Download Manager preferences - Archive of obsolete content
migration of other browser settings may also set this path.
Block and Line Layout Cheat Sheet - Archive of obsolete content
it may be set as a side-effect of calling nsblockframe::shouldapplytopmargin(); once set, shouldapplytopmargin() uses it as a fast-path way to return whether the top margin should apply.
Repackaging Firefox - Archive of obsolete content
however, it's still recommended that you look through this tutorial, as it contains tips specific for creating extensions of this type, and there are a few options that you will need to set to ensure a smooth upgrade path for users.
Mozilla Application Framework in Detail - Archive of obsolete content
s) performinstall(); else { alert("error detected: "+getlasterror()); cancelinstall(); } other features a resource description framework (rdf) parser with support for creating rdf graphs programmatically or by parsing files, compositing multiple sources into a single rdf graph, querying and manipulating graphs, and populating xul widgets (trees, menus, etc.) with graph data; an xslt/xpath processor; scalable vector graphics (svg) rendering with support for a usable subset of the standard including all basic shapes, beziers, stroking and filling with opacity, and much of the dom; mathml rendering; an ecma-262 edition 3-compliant javascript engine; java integration with a bridge to xpcom, a java dom api, the open jvm integration (oji) facility, a java webclient api, and java plu...
New Security Model for Web Services - Archive of obsolete content
where a server spans multiple owners, the alternative would be to scan all directories in the path looking for a web scripts access file, which seems undesirable.
Bundles - Archive of obsolete content
how-to here is a simple way to build a basic web application bundle: create file called webapp.ini that contains something like: [parameters] id=unique-app-id@unique-author-id.whatever name=webapp name uri=http://[the-url-what-you-want-to-connect-to]/ status=yes location=no sidebar=no navigation=no zip the file to [whatever].webapp double-click the webapp bundle or use prism -webapp [path-to-webapp] structure a bundle can contain the following files.
Hacking wiki - Archive of obsolete content
the following worked for me (from the <tt>www</tt> directory): /path/to/php -f ./maintenance/update-devmo.php done you should have a working install of the mdc wiki now.
Running Windows Debug Builds Downloaded From Tinderbox - Archive of obsolete content
to run tests of the tests package you can, for example, run the reftests as follows: python reftest/runreftest.py --appname=firefox/firefox.exe --utility-path=bin --extra-profile-file=bin/plugins reftest/tests/layout/reftests/reftest.list ...
Standard Makefile Header - Archive of obsolete content
topsrcdir = @top_srcdir@ srcdir = @srcdir@ vpath = @srcdir@ include $(depth)/config/autoconf.mk ...
Actionscript Performance Tests - Archive of obsolete content
to compare two vms against each other export avm2=<path to 2nd vm> or use --avm2=<path to 2nd vm>.
Tamarin Build System Documentation - Archive of obsolete content
; cd scripts edit environment.sh, change the basedir and buildsdir settings (around line 51) basedir=~/hg/tamarin-redux (path to my test repository) (next line) buildsdir=~/hg/builds (a directory to store downloaded builds) always set current working directory to the scripts directory when running a script run a script (e.g.) ../all/run-acceptance-release.sh <optional hg revision number like 1902> how do i navigate the build status page?
Tamarin mercurial commit hook - Archive of obsolete content
installing the commit hook the easiest way to implement the hook is to sync to the tip of tamarin-redux then add the following to your tamarin-redux/.hg/hgrc file (or to ~/.hgrc to implement for all local repos): [hooks] pretxncommit.commit = python:/path/to/tamarin-redux/utils/hooks/tamarin-commit-hook.py:master_hook once added, all commits will run the commit hook.
The Download Manager schema - Archive of obsolete content
temppath text the path of the temporary file being used for the download.
Treehydra Manual - Archive of obsolete content
for example, if esp reaches a point where two control flow paths merge, and on one side the abstract value of x is 1, and on the other side, the abstract value of x is 2, then the new abstract value of x will be 1 join 2.
Treehydra - Archive of obsolete content
build instructions how to build treehydra treehydra manual usage instructions static analyses analyses being worked on for mozilla 2(many use treehydra) interesting papers esp path-sensitive program verification in polynomial time community view treehydra forums...
Using gdb on wimpy computers - Archive of obsolete content
here's an example: [blizzard@gunhead mozilla]$ cd dist/bin/ [blizzard@gunhead bin]$ ./mozilla -g .//run-mozilla.sh -g ./mozilla-bin mozilla_five_home=/home/blizzard/src/mozilla/mozilla/dist/bin ld_library_path=/home/blizzard/src/mozilla/mozilla/dist/bin shlib_path=/home/blizzard/src/mozilla/mozilla/dist/bin libpath=/home/blizzard/src/mozilla/mozilla/dist/bin moz_program=./mozilla-bin moz_toolkit= moz_debug=1 moz_debugger= /usr/bin/gdb ./mozilla-bin -x /tmp/mozargs22288 gnu gdb 19991004 copyright 1998 free software foundation, inc.
Venkman Introduction - Archive of obsolete content
this starts the dhtml down the other codepath in start() and makes the fishes start swimming again.
Windows stub installer - Archive of obsolete content
if you need to use vc++ to debug the installer: under project | settings | debug set "executable for debug session" to be the path to mozilla/dist/win32_d.obj/install/setup.exe set "working directory" to be the path to mozilla/dist/wind32_d.obj/install press f10 to step into the code how we get setup to debug the xpinstall engine from the windows stub installer?
Using XPInstall to Install Plugins - Archive of obsolete content
write keys in the windows registry which store information about this secondary location, in particular the plugin path and the xpt path (if applicable) so that netscape gecko browsers can pick up the plugin from the secondary location if they are installed after the plugin is (and thus, if a particular netscape gecko browser follows or replaces the current browser).
File.windowsShortcut - Archive of obsolete content
var xpisrc = "misc.exe"; var vi = "1.1.1.1"; initinstall( "windows shortcut", "test", vi, 0); f = getfolder("windows"); g = getfolder("temporary"); addfile( "miscshortcut", "2.2.2.2", xpisrc, f, xpisrc, true); target = getfolder(f, xpisrc); shortcutpath = getfolder("program"); err = file.windowsshortcut( target, shortcutpath, "misc shortcut", g, "", target, 0); logcomment("file.windowsshortcut returns: " + err); if (0 == getlasterror()) performinstall(); else cancelinstall(); ...
InstallTrigger.startSoftwareUpdate - Archive of obsolete content
installtrigger.startsoftwareupdate this is a very simple example of the installtrigger object's principal method, startsoftwareupdate, which takes a string representing the path to the xpi and installs that xpi on the local machine.
dirCreate - Archive of obsolete content
method of file object syntax int dircreate( filespecobject dirtocreate ); parameters the dircreate method has the following parameters: dirtocreate a filespecobject representing the pathname of the directory to create.
dirGetParent - Archive of obsolete content
method of file object syntax filespecobject dirgetparent( filespecobject fileordir ); parameters the dirgetparent method has the following parameters: fileordir a filespecobject representing the pathname of the file or directory whose parent is being requested.
diskSpaceAvailable - Archive of obsolete content
method of file object syntax double diskspaceavailable ( string nativefolderpath ); parameters the diskspaceavailable method has the following parameters: nativefolderpath a string representing the pathname of the partition, a file, or a directory on the partition whose space is being queried.
isDirectory - Archive of obsolete content
method of file object syntax boolean isdirectory ( filespecobject nativefolderpath ); parameters the isdirectory method has the following parameters: nativefolderpath a filespecobject representing the queried directory.
isFile - Archive of obsolete content
method of file object syntax boolean isfile (filespecobject nativefolderpath); parameters the isfile method has the following parameter: nativefolderpath a filespecobject representing the queried file object.
modDate - Archive of obsolete content
method of file object syntax double moddate ( filespecobject nativefolderpath ); parameters the moddate method has the following parameters: nativefolderpath a filespecobject representing the queried file.
size - Archive of obsolete content
method of file object syntax int size (string nativefolderpath); parameters the size method has the following parameters: nativefolderpath the full pathname to the file.
Methods - Archive of obsolete content
windowsgetshortname returns the windows shortname of the path.
deleteRegisteredFile - Archive of obsolete content
method of install object syntax int deleteregisteredfile (string registryname); parameters the deleteregisteredfile method has the following parameter: registryname the pathname in the client version registry for the file that is to be deleted.
getComponentFolder - Archive of obsolete content
method of install object syntax object getcomponentfolder (string registryname); object getcomponentfolder ( string registryname, string subdirectory); parameters the getcomponentfolder method has these parameters: registryname the pathname in the client version registry for the component whose installation directory is to be obtained.
getWinProfile - Archive of obsolete content
file a relative pathname to an initialization file in the directory specified by the folder parameter, such as "royal/royal.ini".
loadResources - Archive of obsolete content
method of install object syntax object loadresources( string xpipath ); parameters the sole input parameter for loadresources is a string representing the path to the properties file in the xpi in which the key/value pairs are defined.
Properties - Archive of obsolete content
properties archive full local path of the archive after it is downloaded to the platform specific temp folder.
writeString - Archive of obsolete content
example to set the name of the wallpaper file from the desktop section of the win.ini file, use this call: ini = getwinprofile (getfolder("windows"), "win.ini"); ini.writestring ("desktop", "wallpaper", "newpathname"); ...
createKey - Archive of obsolete content
method of winreg object syntax int createkey ( string subkey, string classname); parameters the method has the following parameters: subkey the key path to the appropriate location in the key hierarchy, such as "software\\netscape\\navigator\\mail".
deleteKey - Archive of obsolete content
method of winreg object syntax int deletekey ( string subkey); parameters the method has the following parameters: subkey the key path to the appropriate location in the key hierarchy, such as "software\\netscape\\navigator\\mail".
deleteValue - Archive of obsolete content
method of winreg object syntax int deletevalue ( string subkey, string valname); parameters the deletevalue method has the following parameters: subkey the key path to the appropriate location in the key hierarchy, such as "software\\netscape\\navigator\\mail".
enumKeys - Archive of obsolete content
method of winreg object syntax string enumkeys ( string key, int subkeyindex ); parameters the enumkeys method has the following parameters: key the key path to the appropriate location in the key hierarchy, such as "software\\netscape\\navigator\\mail".
enumValueNames - Archive of obsolete content
method of winreg object syntax string enumvaluenames ( string key, int subkeyindex ); parameters the enumvaluenames method has the following parameters: key the key path to the appropriate location in the key hierarchy, such as "software\\netscape\\navigator\\mail".
getValue - Archive of obsolete content
method of winreg object syntax winregvalue getvalue ( string subkey, string valname); parameters the getvalue method has the following parameters: subkey the key path to the appropriate location in the key hierarchy, such as "software\\netscape\\navigator\\mail".
getValueNumber - Archive of obsolete content
method of winreg object syntax number getvaluenumber ( string subkey, string valname); parameters the getvaluestring method has the following parameters: subkey the key path to the appropriate location in the key hierarchy, such as "software\\netscape\\navigator\\mail".
getValueString - Archive of obsolete content
method of winreg object syntax string getvaluestring ( string subkey, string valname); parameters the getvaluestring method has the following parameters: subkey the key path to the appropriate location in the key hierarchy, such as "software\\netscape\\navigator\\mail".
isKeyWritable - Archive of obsolete content
method of winreg object syntax boolean iskeywritable( string key); parameters the method has the following parameter: key a string representing the path to the key returns a boolean value: true if the key is writable; false if not.
keyExists - Archive of obsolete content
method of winreg object syntax boolean keyexists ( string key); parameters the method has the following parameter: key a string representing the path to the key returns boolean value description if the user does not have read access to the given key, this will also return false.
setValue - Archive of obsolete content
method of winreg object syntax string setvalue ( string subkey, string valname, winregvalue value); parameters the setvalue method has the following parameters: subkey the key path to the appropriate location in the key hierarchy, such as "software\\netscape\\navigator\\mail".
setValueNumber - Archive of obsolete content
method of winreg object syntax int setvaluenumber ( string subkey, string valname, number value ); parameters the method has the following parameters: subkey the key path to the appropriate location in the key hierarchy, such as "software\\netscape\\navigator\\mail".
setValueString - Archive of obsolete content
method of winreg object syntax int setvaluestring ( string subkey, string valname, string value); parameters the method has the following parameters: subkey the key path to the appropriate location in the key hierarchy, such as "software\\netscape\\navigator\\mail".
valueExists - Archive of obsolete content
method of winreg object syntax boolean valueexists ( string key, string value ); parameters the method has the following parameters: key a string representing the path to the key.
A XUL Bestiary - Archive of obsolete content
note that when no file name is specified after the chrome directory path, a file name with the same name as the package is assumed.
expr - Archive of obsolete content
ArchiveMozillaXULAttributeexpr
« xul reference home expr type: string for xml queries, an xpath expression which returns results.
Working With Directories - Archive of obsolete content
var dir1 = io.getfile("home", ""); var dir2 = io.getfile("desktop", "myfiles"); to refer to a subdirectory, rather than using a path, use nsifile.append() to build up a path.
Attribute Substitution - Archive of obsolete content
the bug is that this code path for bindings doesn't handle the textnode element properly.
Building Hierarchical Trees - Archive of obsolete content
or, with more complex xpath expressions, a template could display a tree where the hierarchy wasn't directly like the xml document.
Multiple Rules - Archive of obsolete content
in this simple example with one rule though, it would likely be simpler and faster to just filter these out using the query xpath expression rather than generating the results then using a condition to filter them.
SQLite Templates - Archive of obsolete content
in this case, you will often be setting the datasources attribute dynamically after determining the file path.
Sorting Results - Archive of obsolete content
for an xml datasource, generated content will be output in the order corresponding to the results of the xpath query expression.
Template Builder Interface - Archive of obsolete content
so you will need to use the full path in this situation.
Code Samples - Archive of obsolete content
const path = "c:\\windows\\charmap.exe" var file = components .classes["@mozilla.org/file/local;1"] .createinstance(components.interfaces.nsilocalfile) file.initwithpath(path) file.launch() open a web page if your button is in firefox or seamonkey, use code like this to open a web page.
SeaMonkey - making custom toolbar (SM ver. 1.x) - Archive of obsolete content
it is one very long line ending in path—make sure that you get all of it: components.classes["@mozilla.org/file/directory_service;1"].getservice( components.interfaces.nsiproperties).get("achrom", components.interfaces.nsifile).path in the javascript console window, paste the code in the field near the top.
Grids - Archive of obsolete content
ArchiveMozillaXULTutorialGrids
for example: example 2 : source view <grid flex="1"> <columns> <column/> <column flex="1"/> </columns> <rows> <row> <label control="doctitle" value="document title:"/> <textbox id="doctitle" flex="1"/> </row> <row> <label control="docpath" value="path:"/> <hbox flex="1"> <textbox id="docpath" flex="1"/> <button label="browse..."/> </hbox> </row> </rows> </grid> notice in the image how the first column of elements containing the labels has only a single element in each row.
Install Scripts - Archive of obsolete content
this key is structured as directory-like path of the following form: /author/package name replace the word author with your name and replace the package name with the name of the package that you are installing.
Tree View Details - Archive of obsolete content
since the third element in the item array (with an index of 2) holds whether the row is open or not, we use two code paths, the first to close a row and the second to open a row.
XUL Structure - Archive of obsolete content
it is used to map a chrome url to a file or directory path on the disk where the xul files are located.
Using the Editor from XUL - Archive of obsolete content
the path of a key press so what happens to a key press once it's got to the nstexteditorkeylistener?
assign - Archive of obsolete content
for more information, see xml_assignments attributes expr, var examples (example needed) attributes expr type: string for xml queries, an xpath expression which returns results.
prefpane - Archive of obsolete content
attributes helpuri, image, label, onpaneload, selected, src properties image, label, preferenceelements, preferences, selected, src examples methods preferenceforelement <prefpane id="panegeneral" label="general" src="chrome://path/to/paneoverlay.xul"/> or <prefpane id="panegeneral" label="general" onpaneload="ongeneralpaneload(event);"> <preferences> <preference id="pref_one" name="extensions.myextension.one" type="bool"/> ...
query - Archive of obsolete content
ArchiveMozillaXULquery
attributes expr examples (example needed) attributes expr type: string for xml queries, an xpath expression which returns results.
Using LDAP XPCOM with XULRunner - Archive of obsolete content
srcdir = @srcdir@ topsrcdir = @top_srcdir@ vpath = @srcdir@ include $(depth)/config/autoconf.mk module = mozldapstub library_name = mozldap_stub is_component = 1 force_shared_lib = 1 requires = \ xpcom \ string \ $(null) cppsrcs = ldapstubloader.cpp extra_dso_ldopts += \ $(dist)/lib/$(lib_prefix)xpcomglue_s.$(lib_suffix) \ $(xpcom_frozen_ldopts) \ $(nspr_libs) \ $(null) include $(topsrcdir)/config/rules.mk defines += -dmoz_...
MacFAQ - Archive of obsolete content
to do this, type: xulrunner-bin --install-app /path/to/appdir note the path to your application must end with the directory containing application.ini; you should not reference application.ini in this command.
XUL Application Packaging - Archive of obsolete content
example: id=testapplication@example.tld vendor specifies the application vendor optional example: vendor=grinch productions profile specifies the path to use for the application's profile, based within the user's application data directory optional example: profile=myappdata the [gecko] section the gecko section specifies what version of xulrunner is required by the application.
Mozprocess - Archive of obsolete content
basic usage: process = processhandler(['command', '-line', 'arguments'], cwd=none, # working directory for cmd; defaults to none env={}, # environment to use for the process; defaults to os.environ ) exit_code = process.waitforfinish(timeout=60) # seconds see an example in https://github.com/mozilla/mozbase/b...profilepath.py processhandler may be subclassed to handle process timeouts (by overriding the ontimeout() method), process completion (by overriding onfinish()), and to process the command output (by overriding processoutputline()).
Mozrunner - Archive of obsolete content
command line usage the mozrunner command will launch the application (specified by --app) from a binary specified with -b or as located on the path.
nsIContentPolicy - Archive of obsolete content
return value accept or reject_* example you can implement this interface easily by including the nsicontentpolicy.h header file and implementing public nsicontentpolicy into your class, like this: // put this into your header file #include "_path_to_sdk/include/content/nsicontentpolicy.h" class myclass: public nsisupports, public nsicontentpolicy { ...
Mozilla release FAQ - Archive of obsolete content
use that to launch mozilla for you -- it sets ld_library_path automatically.
2006-11-24 - Archive of obsolete content
they would like to discuss the use of it in bug 361026 rich results for searches a proposal for a search tool that gives users a quicker path to specific information they are looking for.
2006-09-29 - Archive of obsolete content
instead of using /path/to/xulrunner-bin.ini (which will was doing) applications on a mac must be in an application bundle (foo.app).
2006-10-20 - Archive of obsolete content
benjamin smedberg would like to know what paths were used.
2006-09-06 - Archive of obsolete content
how to build xpcom component on mac os x a tutorial on how to build xpcom component on mac os x firefox crashes when calling a function provided by a .so library a solution to the problem loading a shared library when using xpcom firefoxes crashes while getting url in xpcom solutions to resolve the problem of the firefox crash when trying to get the path and the prepath of the url of the current page in xpcom meetings none during this week.
.htaccess ( hypertext access ) - Archive of obsolete content
php_value auto_prepend_file "/real/path/to/file/functions.php" # adds function.php at the top of requested document php_value auto_append_file "/real/path/to/file/footer.php" # adds footer.html at bottom of requested document customized error responses : user can be directed to different pages depending on the error they caused or by the webserver.
Introduction to Public-Key Cryptography - Archive of obsolete content
a certificate chain traces a path of certificates from a branch in the hierarchy to the root of the hierarchy.
Table Reflow Internals - Archive of obsolete content
incremental - has a reflow path (tree) where each node has a command with a target frame, reflow command types are: dirty - something changed inside a target (e.g.
Processing XML with E4X - Archive of obsolete content
these filter operations are specified using an expression contained in parentheses: var html = <html> <p id="p1">first paragraph</p> <p id="p2">second paragraph</p> </html>; alert(html.p.(@id == "p1")); // alerts "first paragraph" nodes matching the path before the expression (in this case the paragraph elements) are added to the scope chain before the expression is evaluated, as if they had been specified using the with statement.
Enumerator.atEnd - Archive of obsolete content
ple in following code, the atend method is used to determine if the end of a list of drives has been reached: 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); } req...
Enumerator.item - Archive of obsolete content
example 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); } req...
Enumerator.moveFirst - Archive of obsolete content
mple, the movefirst method is used to evaluate members of the drivescollection from the beginning of the list: 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); } req...
Enumerator.moveNext - Archive of obsolete content
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); } req...
Enumerator - Archive of obsolete content
example the following code shows the usage of the enumerator object: var bytespergb = 1024 * 1024 * 1024; var fso = new activexobject("scripting.filesystemobject"); document.write(fso.drives); var e = new enumerator(fso.drives); var drivestring = ""; e.movefirst(); while (e.atend() == false) { 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...
Packages - Archive of obsolete content
consequently, you can access java classes in these packages without the packages keyword, as follows: var theframe = new java.awt.frame(); the classname property represents the fully qualified path name of any other java class that is available to javascript.
Troubleshooting XForms Forms - Archive of obsolete content
xpath 1.0 expressions do not have a default namespace, so a prefix must always be specified if the namespace is not the empty namespace.
Implementation Status - Archive of obsolete content
xpath expressions in xforms section title status notes bugs 7.1 xpath datatypes supported 7.2 evaluation context partial 7.3 references, dependencies, and dynamic dependencies partial we probably already do most of it due to our 1.0 work, but w...
Mozilla XForms Specials - Archive of obsolete content
(limitation tracked in bug 271724) optional parameters in xpath functions optional parameters in xpath functions are not supported, you will have to specify all parameters when calling a function.
RFE to the XForms API - Archive of obsolete content
ArchiveWebXFormsRFEXForms API
ability to get nsixformsaccessors for instance node we need the ability to get to the nsixformsaccessors interface on a node by specifying the node via an xpath expression or by specifying the instance node directly (see bug 312956).
XForms Output Element - Archive of obsolete content
attributes ui common appearance - the value of this attribute gives a hint to the xforms processor as to which type of widget(s) to use to represent this control accesskey - used to specify the keyboard shortcut for focusing this control single-node binding special value - xpath expression whose evaluation result is used as the output's value.
XForms Repeat Element - Archive of obsolete content
that node will serve as the context node for any relative xpath expressions in that set of repeated markup.
Archived open Web documentation - Archive of obsolete content
drawing on other w3c standards like xml schema, xpath, and xml events, xforms tried to address some of the limitations of the current html forms model.
XQuery - Archive of obsolete content
it offers powerful and yet intuitive searching based on xpath, has sql-like syntax for the query portion, and has scripting features such as function and variable definitions, xml-inclusion, etc.
Archive of obsolete content
it offers powerful and yet intuitive searching based on xpath, has sql-like syntax for the query portion, and has scripting features such as function and variable definitions, xml-inclusion, etc.
Anatomy of a video game - Game development
each of these paths will lead to different opportunities and constraints.
Index - Game development
it's totally up to you which path you're going to follow.
Publishing games - Game development
game monetization is essential to anyone who considers their game development work a serious endeavour on the path to becoming an independent game developer able to make a living, so read on and see what your options are.
2D collision detection - Game development
= {x: 20, y: 20} crafty.c("circle", { circle: function(radius, color) { this.radius = radius; this.w = this.h = radius * 2; this.color = color || "#000000"; this.bind("move", crafty.drawmanager.drawall) return this; }, draw: function() { var ctx = crafty.canvas.context; ctx.save(); ctx.fillstyle = this.color; ctx.beginpath(); ctx.arc( this.x + this.radius, this.y + this.radius, this.radius, 0, math.pi * 2 ); ctx.closepath(); ctx.fill(); ctx.restore(); } }); var circle1 = crafty.e("2d, canvas, circle").attr(dim1).circle(15, "red"); var circle2 = crafty.e("2d, canvas, circle, fourway").fourway(2).attr(dim2).circle(20, "blu...
Collision detection - Game development
icks() { for(var c=0; c<brickcolumncount; c++) { for(var r=0; r<brickrowcount; r++) { if(bricks[c][r].status == 1) { var brickx = (c*(brickwidth+brickpadding))+brickoffsetleft; var bricky = (r*(brickheight+brickpadding))+brickoffsettop; bricks[c][r].x = brickx; bricks[c][r].y = bricky; ctx.beginpath(); ctx.rect(brickx, bricky, brickwidth, brickheight); ctx.fillstyle = "#0095dd"; ctx.fill(); ctx.closepath(); } } } } tracking and updating the status in the collision detection function now we need to involve the brick status property in the collisiondetection() function: if the brick is active (its status ...
Paddle and keyboard controls - Game development
add the following just below your drawball() function: function drawpaddle() { ctx.beginpath(); ctx.rect(paddlex, canvas.height-paddleheight, paddlewidth, paddleheight); ctx.fillstyle = "#0095dd"; ctx.fill(); ctx.closepath(); } allowing the user to control the paddle we can draw the paddle wherever we want, but it should respond to the user's actions.
Load the assets and print them on screen - Game development
the second parameter is the relative path to the graphic asset.
2D breakout game using Phaser - Game development
the mdn breakout game we are building together — are available on github: initialize the framework scaling load the assets and print them on screen move the ball physics bounce off the walls player paddle and controls game over build the brickfield collision detection the score win the game extra lives animations and tweens buttons randomizing gameplay as a note on learning paths — starting with pure javascript is the best way to get a solid knowledge of web game development.
Algorithm - MDN Web Docs Glossary: Definitions of Web-related terms
common algorithms are pathfinding algorithms such as the traveling salesman problem, tree traversal algorithms and so on.
CSS Object Model (CSSOM) - MDN Web Docs Glossary: Definitions of Web-related terms
both of them are part of the critical rendering path which is a series of steps that must happen to properly render a website.
Dominator - MDN Web Docs Glossary: Definitions of Web-related terms
in graph theory, node a dominates node b if every path from the root node to b passes through a.
ICE - MDN Web Docs Glossary: Definitions of Web-related terms
the framework algorithm looks for the lowest-latency path for connecting the two peers, trying these options in order: direct udp connection (in this case—and only this case—a stun server is used to find the network-facing address of a peer) direct tcp connection, via the http port direct tcp connection, via the https port indirect connection via a relay/turn server (if a direct connection fails, e.g., if one peer is behind a firewall that blo...
Response header - MDN Web Docs Glossary: Definitions of Web-related terms
entity header: 200 ok access-control-allow-origin: * connection: keep-alive content-encoding: gzip content-type: text/html; charset=utf-8 date: mon, 18 jul 2016 16:06:00 gmt etag: "c561c68d0ba92bbeb8b0f612a9199f722e3a621a" keep-alive: timeout=5, max=997 last-modified: mon, 18 jul 2016 02:36:04 gmt server: apache set-cookie: mykey=myvalue; expires=mon, 17-jul-2017 16:06:00 gmt; max-age=31449600; path=/; secure transfer-encoding: chunked vary: cookie, accept-encoding x-backend-server: developer2.webapp.scl3.mozilla.com x-cache-info: not cacheable; meta data too large x-kuma-revision: 1085259 x-frame-options: deny ...
Synthetic monitoring - MDN Web Docs Glossary: Definitions of Web-related terms
synthetic monitoring involves deploying scripts to simulate the path an end-user might take through a web application, reporting back the performance of the simulator experiences.
WebRTC - MDN Web Docs Glossary: Definitions of Web-related terms
rtcdatachannel provides a method to set up a peer-to-peer data pathway between browsers.
XSLT - MDN Web Docs Glossary: Definitions of Web-related terms
xslt has its own processor that accepts xml input, or any format convertible to an xquery and xpath data model.
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.
MDN Web Docs Glossary: Definitions of Web-related terms
webassembly webdav webextensions webgl webidl webkit webm webp webrtc websockets webvtt whatwg whitespace world wide web wrapper x xforms xhr (xmlhttprequest) xhtml xinclude xlink xml xpath xquery xslt other 404 502 alpn at-rule attack byte-order mark character set client cryptosystem debug digital signature execution flex-direction glsl interface library memory management routers ...
What is accessibility? - Learn web development
if someone does complain that your site has an accessibility problem, start a dialog with them, be empathic, and take reasonable steps to try to fix the problem.
How CSS is structured - Learn web development
in the example above, the css file is in the same folder as the html document, but you could place it somewhere else and adjust the path.
CSS first steps - Learn web development
this module provides a gentle beginning to your path towards css mastery with the basics of how it works, what the syntax looks like, and how you can start using it to add styling to html.
CSS FAQ - Learn web development
LearnCSSHowtoCSS FAQ
here are some possible causes: you've got the path to css file wrong.
Styling links - Learn web development
we set the path to the image we want to insert, specify no-repeat so we only get one copy inserted, and then specify the position as 100% of the way over to the right of the text content, and 0 pixels from the top.
Styling lists - Learn web development
the relevant properties are as follows: background-image: this references the path to the image file you want to use as the bullet.
Learn to style HTML using CSS - Learn web development
this module provides a gentle beginning to your path towards css mastery with the basics of how it works, what the syntax looks like, and how you can start using it to add styling to html.
How do you make sure your website works properly? - Learn web development
first check the spelling and accuracy of the file path, and if there's still a problem, upload your files again.
How do I start to design my website? - Learn web development
you must sit down and structure your ideas to get a clear view of what path you must take to make your ideas a reality.
What are browser developer tools? - Learn web development
some browsers also have copy css path and copy xpath available, to allow you to copy the css selector or xpath expression that would select the current html element.
Common questions - Learn web development
this section of the learning area is designed to provide answers to common questions that may come up, which are not necessarily part of the structured core learning pathways (e.g.
Styling web forms - Learn web development
if the fontsquirrel output was different to what we described above, you can find the correct @font-face blocks inside your downloaded webfont kit, in the stylesheet.css file (you'll need to replace the below @font-face blocks with them, and update the paths to the font files): @font-face { font-family: 'handwriting'; src: url('fonts/journal-webfont.woff2') format('woff2'), url('fonts/journal-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'typewriter'; src: url('fonts/veteran_typewriter-webfont.woff2') format('woff2'), url('fonts/veteran_typewriter-webfo...
Web forms — Working with user data - Learn web development
advanced articles the following articles aren't essential to the learning pathway, but they'll prove interesting and useful when you've mastered the above techniques and want to know more.
Use JavaScript within a webpage - Learn web development
if you want to execute a .js script from your webpage, just use <script> with an src attribute pointing to the script file, using its url: <script src="path/to/my/script.js"></script> writing javascript within html you may also add javascript code between <script> tags rather than providing an src attribute.
What’s in the head? Metadata in HTML - Learn web development
this takes two attributes, rel="stylesheet", which indicates that it is the document's stylesheet, and href, which contains the path to the stylesheet file: <link rel="stylesheet" href="my-css-file.css"> the <script> element should also go into the head, and should include a src attribute containing the path to the javascript you want to load, and defer, which basically instructs the browser to load the javascript at the same time as the page's html.
Adding vector graphics to the Web - Learn web development
popular web raster formats include bitmap (.bmp), png (.png), jpeg (.jpg), and gif (.gif.) vector images are defined using algorithms — a vector image file contains shape and path definitions that the computer can use to work out what the image should look like when rendered on the screen.
Test your skills: HTML images - Learn web development
you need to: add the path to the image to an appropriate attribute to embed it on the page.
From object to iframe — other embedding technologies - Learn web development
src this attribute, as with <video>/<img>, contains a path pointing to the url of the document to be embedded.
Responsive images - Learn web development
the srcset attributes contain the path to the image to display.
Video and audio content - Learn web development
here is a <a href="rabbit320.webm">link to the video</a> instead.</p> </video> the features of note are: src in the same way as for the <img> element, the src (source) attribute contains a path to the video you want to embed.
General asynchronous programming concepts - Learn web development
function expensiveoperation() { for(let i = 0; i < 1000000; i++) { ctx.fillstyle = 'rgba(0,0,255, 0.2)'; ctx.beginpath(); ctx.arc(random(0, canvas.width), random(0, canvas.height), 10, degtorad(0), degtorad(360), false); ctx.fill() } } fillbtn.addeventlistener('click', expensiveoperation); alertbtn.addeventlistener('click', () => alert('you clicked me!') ); if you click the first button and then quickly click the second one, you'll see that the alert does not appear until the circles have finished ...
Functions — reusable blocks of code - Learn web development
in our random-canvas-circles.html example (see also the full source code) from our loops article, we included a custom draw() function that looked like this: function draw() { ctx.clearrect(0,0,width,height); for (let i = 0; i < 100; i++) { ctx.beginpath(); ctx.fillstyle = 'rgba(255,0,0,0.5)'; ctx.arc(random(width), random(height), random(50), 0, 2 * math.pi); ctx.fill(); } } this function draws 100 random circles inside a <canvas> element.
Image gallery - Learn web development
in each loop iteration, replace the xxx placeholder value with a string that will equal the path to the image in each case.
Function return values - Learn web development
our draw() function draws 100 random circles somewhere on an html <canvas>: function draw() { ctx.clearrect(0, 0, width, height); for (let i = 0; i < 100; i++) { ctx.beginpath(); ctx.fillstyle = 'rgba(255,0,0,0.5)'; ctx.arc(random(width), random(height), random(50), 0, 2 * math.pi); ctx.fill(); } } inside each loop iteration, three calls are made to the random() function, to generate a random value for the current circle's x-coordinate, y-coordinate, and radius, respectively.
Fetching data from the server - Learn web development
modify the path to the file being fetched, to something like 'produc.json' (make sure it is misspelled).
Introduction to web APIs - Learn web development
ent you want to draw on, and then calling its htmlcanvaselement.getcontext() method: const canvas = document.queryselector('canvas'); const ctx = canvas.getcontext('2d'); anything that we want to do to the canvas is then achieved by calling properties and methods of the context object (which is an instance of canvasrenderingcontext2d), for example: ball.prototype.draw = function() { ctx.beginpath(); ctx.fillstyle = this.color; ctx.arc(this.x, this.y, this.size, 0, 2 * math.pi); ctx.fill(); }; note: you can see this code in action in our bouncing balls demo (see it running live also).
Adding features to our bouncing balls demo - Learn web development
this can be achieved by setting a value for linewidth somewhere after the beginpath() call (3 will do).
Web performance - Learn web development
learning pathway while knowing html, css, and javascript is needed for implementing many web performance improvement recommendations, knowing how to build applications is not a necessary pre-condition for understanding and measuring web performance.
Server-side website programming - Learn web development
learning pathway getting started with server-side programming is usually easier than client-side development, because dynamic websites tend to perform a lot of very similar operations (retrieving data from a database and displaying it in a page, validating user-entered data and saving it in a database, checking user permissions and logging users in, etc.), and are constructed using web frameworks that make th...
Routing in Ember - Learn web development
at each url, the template that corresponds to the specific path ("active", "completed", or "index"), will render the <todolist /> component.
Working with Svelte stores - Learn web development
nds } } $: onmessagechange($alert, ms) // whenever the alert store or the ms props changes run onmessagechange ondestroy(()=> cleartimeout(timeout)) // make sure we clean-up the timeout </script> and update the alert.svelte markup section like so: {#if visible} <div on:click={() => visible = false}> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 20 20"><path d="m12.432 0c1.34 0 2.01.912 2.01 1.957 0 1.305-1.164 2.512-2.679 2.512-1.269 0-2.009-.75-1.974-1.99c9.789 1.436 10.67 0 12.432 0zm8.309 20c-1.058 0-1.833-.652-1.093-3.524l1.214-5.092c.211-.814.246-1.141 0-1.141-.317 0-1.689.562-2.502 1.117l-.528-.88c2.572-2.186 5.531-3.467 6.801-3.467 1.057 0 1.233 1.273.705 3.23l-1.391 5.352c-.246.945-.141 1.271.106 1.271.317 0 1.357-.392 2.379-1.207l.6.814c12.
Styling Vue components with CSS - Learn web development
enter; } [class*="__lg"] { display: inline-block; width: 100%; font-size: 1.9rem; } [class*="__lg"]:not(:last-child) { margin-bottom: 1rem; } @media screen and (min-width: 620px) { [class*="__lg"] { font-size: 2.4rem; } } .visually-hidden { position: absolute; height: 1px; width: 1px; overflow: hidden; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px); clip-path: rect(1px, 1px, 1px, 1px); white-space: nowrap; } [class*="stack"] > * { margin-top: 0; margin-bottom: 0; } .stack-small > * + * { margin-top: 1.25rem; } .stack-large > * + * { margin-top: 2.5rem; } @media screen and (min-width: 550px) { .stack-small > * + * { margin-top: 1.4rem; } .stack-large > * + * { margin-top: 2.8rem; } } /* end global styles */ #app { background...
Introduction to cross browser testing - Learn web development
this may involve writing different code paths that reproduce functionality in different ways aimed at different browsers, or using a polyfill to mimic any missing support using javascript or other technologies, or using a library that allows you to write a single bit of code and then does different things in the background depending on what the browser supports.
Handling common JavaScript problems - Learn web development
loadscript() looks like this: function loadscript(src, done) { const js = document.createelement('script'); js.src = src; js.onload = function() { done(); }; js.onerror = function() { done(new error('failed to load script ' + src)); }; document.head.appendchild(js); } this function creates a new <script> element, then sets its src attribute to the path we specified as the first argument ('polyfills.js' when we called it in the code above).
Git and GitHub - Learn web development
it is also preferrable that you have some basic terminal knowledge, so for example moving between directories, creating files, and modifying the system path.
Deploying our app - Learn web development
if you want finer control over what you add, then use git add -p for an interactive process, or add individual files using git add path/to/file.
omni.ja (formerly omni.jar)
zip -0dxqr omni.ja path/to/omni/* will not work.
Gecko info for Windows accessibility vendors
drawing on other w3c standards like xml schema, xpath, and xml events, xforms tries to address some of the limitations with the current html forms model.
Adding a new event
otherwise, you need to specify the path to the header file in dom/bindings/bindings.conf.
Creating a Language Pack
pre-build steps in the .mozconfig, you want to have mk_add_options moz_objdir=@topsrcdir@/obj-firefox-build ac_add_options --disable-compile-environment ac_add_options --with-l10n-base=../l10n-central # path relative to moz_objdir ac_add_options --enable-application=[browser or mail] the given path should have your localization directory as child (i.e., a subdirectory ab-cd where ab-cd is your locale code).
Debugging JavaScript
you can also start the browser console when you launch firefox, by launching firefox from the command line and passing --jsconsole as a flag: /path/to/firefox --jsconsole log to the browser console using the standard console api after importing console.jsm: let console = (cu.import("resource://gre/modules/console.jsm", {})).console; console.log("hello from firefox code"); error console this is obsolete and is no longer enabled in firefox by default.
Debugging on Windows
these instructions apply to visual studio 10 on windows 7; other software versions likely need to have file paths adjusted.
Makefiles - Best practices and suggestions
use variable assignments, autogen paths and dynamic file gathering.
Updating NSPR or NSS in mozilla-central
moz_arg_with_bool(system-nss, [ --with-system-nss use system installed nss], _use_system_nss=1 ) if test -n "$_use_system_nss"; then am_path_nss(3.16.1, [moz_native_nss=1], [ac_msg_error([you don't have nss installed or your version is too old])]) fi commit the update: $ hg commit -a in order to eliminate any problems related to how nss and nspr are built differently in firefox than they are standalone, you should push your commit to try first.
Windows SDK versions
(this was certainly the case for 64 bit windows 7 on a late 2008 macbook pro.) warning: due to a bug in windows 7 sdk, if you get "sdksetup encountered an error: expecting path %systemroot% to represent a valid system volume" error you may require to set environmental variable %windir% to something like "c:\windows" instead of "%systemroot%".
The Firefox codebase: CSS Guidelines
porting your stylesheets, it's best to import the content css before the theme css, that way the theme values get to override the content values (which is probably what you want), and you're going to want them both after the global values, so your imports will look like this: <?xml-stylesheet href="chrome://global/skin/global.css" type="text/css"?> <?xml-stylesheet href="chrome://browser/content/path/module.css" type="text/css"?> <?xml-stylesheet href="chrome://browser/skin/path/module.css" type="text/css"?> [1] -moz-appearance is tricky.
Limitations of chrome scripts
this means that if you need to write code that works before firefox 38 and on both multiprocess and non-multiprocess variants, you need to implement both paths: test whether topframeelement is null if it is, you're running in single-process firefox, and should use the old way if it isn't, you're running in multiprocess firefox and should use the new way from firefox 38 onwards, the topframeelement approach always works.
Performance best practices for Firefox front-end engineers
knowing the path they will take through the various layers of the browser engine will help you optimize your code to avoid pitfalls.
mozbrowsericonchange
details the details property returns an anonymous javascript object with the following properties: href a domstring representing the path to the new icon.
ChromeWorker
addons that wish to use file:// urls must first register a resource replacement path, using code like this: var fileuri = services.io.newfileuri(file); services.io.getprotocolhandler('resource').
Embedding Tips
the simplepersist() function takes a string url and a string file path.
Geckoview-Junit Tests
for example: <class1>#<test1> <class2> <class3>#<test2> <class3>#<test3> to run the tests specified in the file: mozilla-central$ mach geckoview-junit --test-filters-file <path-to-filter-file> disabling one failing test there is no manifest listing the geckoview junit tests.
How to add a build-time test
in <tt>yourmoduledir/tests_type/makefile.in</tt> change depth, module, and xpcshell_tests appropriately: depth should be a relative path pointing to <tt>mozilla/</tt>, e.g.
How to get a stacktrace with WinDbg
(more details are available at using the mozilla symbol server.) .sympath srv*c:\symbols*http://symbols.mozilla.org/firefox;srv*c:\symbols*http://msdl.microsoft.com/download/symbols .symfix+ c:\symbols .reload /f now wait for the symbols to download.
How to implement a custom autocomplete search component
the component uses the autocompletesearchparam attribute or searchparam property to allow the developer to define the default directory otherwise only paths beginning with / or ~/ will be autocompleted.
Introduction to Layout in Mozilla
l reflow recursively descend to target recovering reflow state child rs.reason set to incremental incremental reflow process reflow “normally” at target frame child rs.reason set based on rc’s type incremental reflow propagate damage to frames later “in the flow” incremental reflow multiple reflow commands are batched nsreflowpath maintains a tree of target frames amortize state recovery and damage propagation cost painting as reflow proceeds through the frame hierarchy, areas are invalidated via nsiviewmanager::updateview unless immediate, invalid areas are coalesced and processed asynchronously via os expose event native expose event dispatched to widget; widget delegates to the view manager view man...
Code Samples
components.utils.import("resource://gre/modules/addonmanager.jsm"); addonmanager.getaddonbyid("yourextensionid", function(addon) { var addonlocation = addon.getresourceuri("").queryinterface(components.interfaces.nsifileurl).file.path; }); accessing file and version information components.utils.import("resource://gre/modules/addonmanager.jsm"); addonmanager.getaddonbyid("my-addon@foo.com", function(addon) { alert("my extension's version is " + addon.version); alert("did i remember to include that file.txt file in my xpi?
OSFile.jsm
shared components os.path and os.constants.path manipulation of paths os.file.error representation of file-related errors os.file.info representation of file information (size, creation date, etc.) os.file.directoryiterator.entry file information obtained while visiting a directory ...
Promise.jsm
while you may still import this module from the above paths, the recommended way for loading it is through the add-on sdk loader.
Task.jsm
}); exception handling components.utils.import("resource://gre/modules/osfile.jsm") components.utils.import("resource://gre/modules/task.jsm") task.spawn(function* () { let currentdir = yield os.file.getcurrentdirectory(); let path = os.path.join(currentdir, ".mozconfig"); try { let info = yield os.file.stat(path); console.log("the .mozconfig file is " + info.size + " bytes long."); } catch (ex if ex instanceof os.file.error && ex.becausenosuchfile) { console.log("you don't have .mozconfig in " + currentdir); } }).then(null, components.utils.reporterror); in this example, if the promise returned by os.fi...
JavaScript code modules
downloadlastdir.jsm supplies the path to the directory into which the last download occurred.
Localizing with Mozilla Translator
for the last two options, you should be able to adjust your current mt product paths so you can keep using it just like with cvs.
Patching a Localization
hg diff > path/to/patchfile ...
Release phase
your .hg/hgrc file shoud look like this (add the emphasized line): [paths] default = hg.mozilla.org/releases/l10n-central/x-testing default-push = ssh://hg.mozilla.org/releases/l10n-central/x-testing if you haven't already cloned the remote repository, enter this command: hg clone ssh://hg.mozilla.org/releases/l10n-central/x-testing mercurial will let you know that it's cloning the repository: destination directory: x-testing requesting all changes adding changes...
Writing localizable code
use a good chrome directory structure for a particular module mod, a target path jar:ab-cd.jar!/locale/ab-cd/mod/foo.dtd has been widely tested and is a good place for your files referenced as chrome://mod/locale/foo.dtd.
Mozilla Framework Based on Templates (MFBT)
its code resides in the mfbt/ source directory, but headers within it should be included using paths like "mozilla/standardinteger.h".
Fonts for Mozilla 2.0's MathML engine
finally, include the mathml-fonts/resource/mathml.css style sheet in your web pages, for example by adding the following rule to the default style sheet of your web site: @import url('/path/to/resource/mathml.css'); browsers have default font-families in their user agent stylesheets.
Mozilla DOM Hacking Guide
the part about componentregistrar is designed to allow external modules (in this case xpath) to be included in domclassinfo and as such benefit from the javascript benefits it provides.
Mozilla Port Blocking
37 time 42 name 43 nicname 53 domain 77 priv-rjs 79 finger 87 ttylink 95 supdup 101 hostriame 102 iso-tsap 103 gppitnp 104 acr-nema 109 pop2 110 pop3 111 sunrpc 113 auth 115 sftp 117 uucp-path 119 nntp 123 ntp 135 loc-srv / epmap 139 netbios 143 imap2 179 bgp 389 ldap 465 smtp+ssl 512 print / exec 513 login 514 shell 515 printer 526 tempo 530 courier 531 chat 532 netnews 540 uucp ...
Investigating leaks using DMD heap scan mode
$logdir should end in a path separator.
Memory reporting
each reporter implements a collectreports function which takes a nsimemoryreportercallback argument; for each measurement the reporter must pass in several values, including: a path (which identifies the report); an amount (the most important thing); a unit (most commonly bytes, but sometimes a unitless count or percentage); a description of what is measured.
Profiling with the Gecko Profiler and Local Symbols on Windows
generate the breakpad symbol files by running ./mach buildsymbols: https://developer.mozilla.org/en/building_firefox_with_debug_symbols#breakpad_symbol_files this will have created symbols under $objdir/dist/ , named after the binary name, architecture and version, so something like "firefox-40.0a1.en-us-win32.crashreporter-symbols.zip" point talos to this zipfile by passing its path to the --symbolspath flag.
browser.dom.window.dump.file
type:string default value:none exists by default: no application support: gecko 1.9.2 (firefox 3.6 / thunderbird 3.1 / fennec 1.0) status: active; last updated 2012-03-18 introduction: pushed to nightly on 2009-04-24 bugs: bug 489938 values the value holds the file system path for the file in which the content of the window.dump() calls get written, e.g.
Patches and pushes
for example: hg ci -m "bug 654321, copied the comment from the doc without reading, r=nobody" path-to-changed-files close the bug, copying the url to your change in the closing comment.
Research and prep
ensure that your suggestions follow these parameters: search there are typically five search plug-ins listed for firefox desktop (only four for firefox mobile): generic search the default option should expose the quickest path to the best result on the world wide web for the user (indexing a large portion of the global www).
Debugging out-of-memory problems
note: replace "/storage/emulated/0/download/" in the reported file path with the device's download path (e.g.
About NSPR
the goal in this area is to provide a migration path between ipv4 and ipv6.
PR_Access
syntax #include <prio.h> prstatus pr_access( const char *name, praccesshow how); parameters the function has the following parameters: name the pathname of the file whose accessibility is to be determined.
PR_FreeLibraryName
frees memory allocated by nspr for library names and path names.
PR_RmDir
description pr_rmdir removes the directory specified by the pathname name.
An overview of NSS Internals
as a result, when searching for a trust path from (a) to a trusted anchor (root) certificate (z), the set of candidate issuer certificates might have different issuer names (referring to the second or higher issuer level).
Building NSS
ideally, also install gyp and ninja and put them on your path.
Cryptography functions
t mxr 3.2 and later pk11_paramfromiv mxr 3.2 and later pk11_paramfromalgid mxr 3.2 and later pk11_paramtoalgid mxr 3.2 and later pk11_pbekeygen mxr 3.2 and later pk11_privdecryptpkcs1 mxr 3.9.3 and later pk11_protectedauthenticationpath mxr 3.4 and later pk11_pubdecryptraw mxr 3.2 and later pk11_pubderive mxr 3.2 and later pk11_pubderivewithkdf mxr 3.9 and later pk11_pubencryptpkcs1 mxr 3.9.3 and later pk11_pubencryptraw mxr 3.2 and later pk11_pubunwrapsymkey ...
Encrypt Decrypt MAC Keys As Session Objects
message and exit */ static void usage(const char *progname) { fprintf(stderr, "\nusage: %s -c -d [-z ] " "[-p | -f ] -i -o \n\n", progname); fprintf(stderr, "%-20s specify 'a' for encrypt operation\n\n", "-c "); fprintf(stderr, "%-20s specify 'b' for decrypt operation\n\n", " "); fprintf(stderr, "%-20s specify db directory path\n\n", "-d "); fprintf(stderr, "%-20s specify db password [optional]\n\n", "-p "); fprintf(stderr, "%-20s specify db password file [optional]\n\n", "-f "); fprintf(stderr, "%-20s specify noise file name [optional]\n\n", "-z "); fprintf(stderr, "%-21s specify an input file name\n\n", "-i "); fprintf(stderr, "%-2...
Encrypt and decrypt MAC using token
message and exit */ static void usage(const char *progname) { fprintf(stderr, "\nusage: %s -c -d [-z ] " "[-p | -f ] -i -o \n\n", progname); fprintf(stderr, "%-20s specify 'a' for encrypt operation\n\n", "-c "); fprintf(stderr, "%-20s specify 'b' for decrypt operation\n\n", " "); fprintf(stderr, "%-20s specify db directory path\n\n", "-d "); fprintf(stderr, "%-20s specify db password [optional]\n\n", "-p "); fprintf(stderr, "%-20s specify db password file [optional]\n\n", "-f "); fprintf(stderr, "%-20s specify noise file name [optional]\n\n", "-z "); fprintf(stderr, "%-21s specify an input file name\n\n", "-i "); fprintf(stderr, "%-2...
Build instructions for JSS 4.3.x
note, on windows platforms it is best to have java_home set to a directory path that doest not have spaces.
NSS_3.11.10_release_notes.html
bug 291384: certutil -k behavior doesn't match usage bug 374247: modutil -disable command not disabling modules' slots bug 384459: certification path validation fails when authority key identifier extension contains key identifier bug 385946: can't import certificate into cert database in fips mode (certutil).
NSS_3.12.1_release_notes.html
bug 430916: add sustaining asserts bug 431805: leak in nssarena_destroy() bug 431929: memory leaks on error paths in devutil.c bug 432303: replace pkix_pl_memcpy with memcpy bug 433177: fix the gcc compiler warnings in lib/util and lib/freebl bug 433437: vfychain ignores the -a option bug 433594: crash destroying ocsp cert id [[@ cert_destroyocspcertid ] bug 434099: nss relies on unchecked pkcs#11 object attribute values bug 434187: fix the gcc compiler warnings in nss/lib bug 434398: libpkix ...
NSS_3.12.2_release_notes.html
bug 459359: forwardbuilderstate object is leaked when aia path incorrect bug 459481: nss build problem with gcc 3.4.6 on os/2 documentation for a list of the primary nss documentation pages on mozilla.org, see nss documentation.
NSS 3.12.4 release notes
bug 497217: the first random value ever generated by the rng should be discarded bug 498163: assert if profile path contains cyrillic chars.
NSS 3.12.6 release notes
bug 527759: add multiple roots to nss (single patch) bug 528741: pkix_hash throws a null-argument exception on empty strings bug 530907: the peerid argument to ssl_setsockpeerid should be declared const bug 531188: decompression failure with https://livechat.merlin.pl/ bug 532417: build problem with spaces in path names bug 534943: clean up the makefiles in lib/ckfw/builtins bug 534945: lib/dev does not need to include headers from lib/ckfw bug 535669: move common makefile code in if and else to the outside bug 536023: der_utctimetotime and der_generalizedtimetotime ignore all bytes after an embedded null bug 536474: add support for logging pre-master secrets ...
NSS 3.14 release notes
applications may use this callback to inform libpkix whether or not candidate certificate chains meet application-specific security policies, allowing libpkix to continue discovering certificate paths until it can find a chain that satisfies the policies.
NSS 3.16.4 release notes
the inclusion of the intermediate certificate is a temporary measure to allow those sites to function, by allowing them to find a trust path to another 2048-bit root ca certificate.
NSS 3.40 release notes
this is a c++ library for building certification paths.
NSS 3.46 release notes
s-kw bug 1571316 - curve25519_32.c:280: undefined reference to `pr_assert' when building nss 3.45 on armhf-linux bug 1516593 - client to generate new random during renegotiation bug 1563258 - fips.sh fails due to non-existent "resp" directories bug 1561598 - remove -wmaybe-uninitialized warning in pqg.c bug 1560806 - increase softoken password max size to 500 characters bug 1568776 - output paths relative to repository in nss coverity bug 1453408 - modutil -changepw fails in fips mode if password is an empty string bug 1564727 - use a pss spki when possible for delegated credentials bug 1493916 - fix ppc64 inline assembler for clang bug 1561588 - remove -wmaybe-uninitialized warning in p7env.c bug 1561548 - remove -wmaybe-uninitialized warning in pkix_pl_ldapdefaultclient.c bug 151...
Enc Dec MAC Output Public Key as CSR
"[-p | -f ] -s -r -i -o \n\n", progname); fprintf(stderr, "%-20s specify 'g' for generating rsa keypair for wrapping\n\n", "g"); fprintf(stderr, "%-20s specify 'e' for encrypt operation\n\n", "e"); fprintf(stderr, "%-20s specify 'd' for decrypt operation\n\n", "d"); fprintf(stderr, "%-20s specify db directory path\n\n", "-d "); fprintf(stderr, "%-20s specify db password [optional]\n\n", "-p "); fprintf(stderr, "%-20s specify db password file [optional]\n\n", "-f "); fprintf(stderr, "%-20s specify noise file name [optional]\n\n", "-z "); fprintf(stderr, "%-21s specify subject\n\n", "-s "); fprintf(stderr, "%-21s specify ...
Encrypt Decrypt_MAC_Using Token
*/ static void usage(const char *progname) { fprintf(stderr, "\nusage: %s -c -d [-z ] " "[-p | -f ] -i -o \n\n", progname); fprintf(stderr, "%-20s specify 'a' for encrypt operation\n\n", "-c "); fprintf(stderr, "%-20s specify 'b' for decrypt operation\n\n", " "); fprintf(stderr, "%-20s specify db directory path\n\n", "-d "); fprintf(stderr, "%-20s specify db password [optional]\n\n", "-p "); fprintf(stderr, "%-20s specify db password file [optional]\n\n", "-f "); fprintf(stderr, "%-20s specify noise file name [optional]\n\n", "-z "); fprintf(stderr, "%-21s specify an input file name\n\n", "-i "); fprintf(stderr, "%-2...
Initialize NSS database - sample 2
/* * print a usage message and exit */ static void usage(const char *progname) { fprintf(stderr, "\nusage: %s -d [-p ]" " [-f ]\n\n", progname); fprintf(stderr, "%-15s specify a db directory path\n\n", "-d "); fprintf(stderr, "%-15s specify a plaintext password\n\n", "-p "); fprintf(stderr, "%-15s specify a password file\n\n", "-f "); exit(-1); } /* * initslotpassword */ char * initslotpassword(pk11slotinfo *slot, prbool retry, void *arg) { file *input; file *output; char *p0 = null; char *p1 = null; ...
EncDecMAC using token object - sample 3
y = 0, mackey = 1, iv = 2, mac = 3, pad = 4 } headertype; /* * print usage message and exit */ static void usage(const char *progname) { fprintf(stderr, "\nusage: %s -c -d [-z ] " "[-p | -f ] -i -o \n\n", progname); fprintf(stderr, "%-20s specify 'a' for encrypt operation\n\n", "-c "); fprintf(stderr, "%-20s specify 'b' for decrypt operation\n\n", " "); fprintf(stderr, "%-20s specify db directory path\n\n", "-d "); fprintf(stderr, "%-20s specify db password [optional]\n\n", "-p "); fprintf(stderr, "%-20s specify db password file [optional]\n\n", "-f "); fprintf(stderr, "%-20s specify noise file name [optional]\n\n", "-z "); fprintf(stderr, "%-21s specify an input file name\n\n", "-i "); fprintf(stderr, "%-21s specify an output file name\n\n", "-o "); fprintf(stderr, "%-7s for encrypt, it takes...
NSS sources building testing
in order to run the tools, you should set your system environment to use the libraries of your build from the "lib" directory, e.g., using the ld_library_path or dyld_library_path environment variable.
nss tech note2
if the environment variable nss_output_file is set, its value will be used as the path name of the file to which the final output will be written.
nss tech note6
for example, on 32-bit solaris sparc for nss 3.11, say shlibsign -v -i libsoftokn3.so shlibsign -v -i libfreebl_32int64_3.so shlibsign -v -i libfreebl_32fpu_3.soshlibsign -v -i libfreebl_32int_3.so (you need to set ld_library_path appropriately and specify the correct pathnames of the libraries.) option 1 is simpler and highly preferred.
NSS functions
t mxr 3.2 and later pk11_paramfromiv mxr 3.2 and later pk11_paramfromalgid mxr 3.2 and later pk11_paramtoalgid mxr 3.2 and later pk11_pbekeygen mxr 3.2 and later pk11_privdecryptpkcs1 mxr 3.9.3 and later pk11_protectedauthenticationpath mxr 3.4 and later pk11_pubdecryptraw mxr 3.2 and later pk11_pubderive mxr 3.2 and later pk11_pubderivewithkdf mxr 3.9 and later pk11_pubencryptpkcs1 mxr 3.9.3 and later pk11_pubencryptraw mxr 3.2 and later pk11_pubunwrapsymkey ...
troubleshoot.html
building nss having /usr/ucb/bin in the path before /usr/ccs/bin breaks the build on 64-bit solaris.
NSS_3.12.3_release_notes.html
op error reporting (was: pk11_createcontextbysymkey returns null bug 456406: slot list leaks in symkeyutil bug 461085: rfe: export function cert_comparecerts bug 462293: crash on fork after softoken is dlclose'd on some unix platforms in nss 3.12 bug 463342: move some headers to freebl/softoken bug 463452: sql db creation does not set files protections to 0600 bug 463678: need to add rpath to 64-bit libraries on hp-ux bug 464088: option to build nss without dbm (handy for wince) bug 464223: certutil didn't accept certificate request to sign.
Necko Architecture
urls provide getting/setting of paths, hosts, ports, filenames, etc.
Necko Interfaces Overview
scheme, host, path, ...) per protocol implementation necko provides uri impl's for common uri formats (see nsstandardurl, nssimpleuri) nsichannel : nsirequest represents a logical connection to the resource identified by a nsiuri per protocol implementation single use (ie.
Rhino downloads archive
if you would like to use e4x you need to add xbean.jar from xmlbeans distribution to your class path.
Rhino FAQ
you've likely missed placing the security.properties file in your class path at org.mozilla.javascript.resources.
Scripting Java
make sure your .jar or .class file is on you classpath then you may import them into your javascript application.
Rhino serialization
(it might be possible to save the java bytecodes in an array and then load the class upon deserialization, but at best that would eat up a lot of memory for just this feature.) one way around this is to compile the functions using the jsc tool: $ cat f.js function f() { return 3; } $ java -classpath js.jarorg.mozilla.javascript.tools.jsc.main f.js $ cat test2.js loadclass("f"); serialize(f, "f.ser"); g = deserialize("f.ser"); print(g()); $ java -classpath 'js.jar;.'org.mozilla.javascript.tools.shell.main test2.js 3 now the function f is compiled to a java class, but that class is then made available in the classpath so serialization works.
Rhino shell
readfile(path [, charactercoding]) read given file and convert its bytes to a string using the specified character coding or default character coding if explicit coding argument is not given.
Creating JavaScript jstest reftests
additionally, it loads every shell.js and broswer.js file in the subdirectories on the path from js/src/tests to the location of your test.
GCIntegration - SpiderMonkey Redirect 1
at the end of the gc, if the pointer refers to an object that is not reachable via some other path, then it will be nulled out or dropped in some way.
Hacking Tips
external programs such as iongraph, dot, and your png viewer are search into the path, otherwise custom one can either be configured with environment variables (gdb_iongraph, gdb_dot, gdb_pngviewer) before starting gdb, or with gdb parameters (set iongraph-bin <path>, set dot-bin <path>, set pngviewer-bin <path>) within gdb.
Bytecode Descriptions
exceptions are handled separately; but all those success paths are written as bytecode, and each one needs to run the finally block before continuing with whatever they were doing.
Exact Stack Rooting
if the extra overhead of exact rooting does end up adding an unacceptable cost to a specific code path that is not mitigated by a faster gc, there are some tricks you can use to get better performance at the cost of more complex code.
Property cache
if a property with the same name is ever added to an object anywhere along the search path, then this cache entry becomes invalid: the property described by this property cache entry has been shadowed.
Introduction to the JavaScript shell
from a bash console when using a pre-compiled binary, try <path to your firefox's run-mozilla.sh>/run-mozilla.sh ./js -- that worked for me] if you'd like to run the javascript code in the file foo.js, you can use this command: js foo.js to run foo.js then drop into the interactive shell, do this: js -f foo.js -i reference note: because the javascript shell is used as a test environment for the javascript engine, the available options and built-in f...
JS::PersistentRooted
if there is any path from that referent back to the js object, then the c++ object containing the persistentrooted will not be destructed, and the whole blob of objects will not be freed, even if there are no references to them from the outside.
JS_DumpHeap
if this is non-null, js_dumpheap only dumps paths in the object graph leading to the specified thing.
Parser API
source string default: null a description of the input source; typically a filename, path, or url.
Running Parsemark
a typical run can be done like so: cd js/src/tests python parsemark.py /path/to/baseline/js /path/to/parse-tests-dir/ -q > /tmp/baseline.json python parsemark.py /path/to/current/js /path/to/parse-tests-dir/ -q > /tmp/current.json python compare_bench.py /tmp/current.json /tmp/baseline.json note: unfortunately the comparisons done are very noisy and not reliable!
compare-locales
you pass the path to the toml file and the parent dir of the localizations as first arguments, followed by the locale codes of the locales you want to compare.
Redis Tips
keyspace design here are some things i keep in mind when creating keys: keys are like urls and should read like nice urls keys are like urls with paths separated by a colon, ':' (this is convention only) use a common prefix for all keys in your app (like a domain) be careful about possible name collisions key names should make it obvious what the values are for redis data structures are like program variables; how would you structure your data types in your program?
Embedded Dialog API
its promptservice dialogs can be switched between default and overridden by moving the override dll into or out of the library search path.
History Service Design
history service provides the basics to create such adaptive search paths, allowing for a better browsing experience through a common interface.
Using the Places annotation service
you should not use any characters in your annotation names that are not valid as part of an html path.
XPCOM changes in Gecko 2.0
xpt files the path of any xpt files must be listed explicitly in a manifest using an interfaces directive: interfaces components/mycomponent.xpt javascript components the registration information for javascript components is no longer located in the component itself; instead, it's located in the manifest.
Component Internals
it includes the location and search paths of all type library files on the system.
Creating XPCOM components
weblock programming interface defining the weblock interface in xpidl the xpidl syntax scriptable interfaces subclassing nsisupports the web locking interface implementing weblock declaration macros 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 ...
How to build a binary XPCOM component using Visual Studio
the command executes xpidl.exe twice, like this: {path_to_geckosdk}\bin\xpidl.exe -m header -i..\gecko-sdk\idl {your_idl_file} {path_to_geckosdk}\bin\xpidl.exe -m typelib -i..\gecko-sdk\idl {your_idl_file} the generated h file actually has a skeleton implementation (commented out).
Components.utils.Sandbox
a recommended value for this property is an absolute path to the script responsible for creating the sandbox.
Components.utils.importGlobalProperties
var domfile = services.appshell.hiddendomwindow.file('/path/to/file'); xpcom components some objects have an xpcom alternative, which typically allows more flexibility then the dom version here is an example of how to use the dom xmlhttprequest through xpcom interface of nsixmlhttprequest: var oreq = cc["@mozilla.org/xmlextras/xmlhttprequest;1"].createinstance(ci.nsixmlhttprequest); ...
nsDirectoryService
for instance, it can give you the path of the system's temporary directory, desktop directory, current working directory, and so on.
Standard XPCOM components
for instance, it can give you the path of the system's temporary directory, desktop directory, current working directory, and so on.nslocalfilea component implementing nsilocalfile.
Core XPCOM functions
ns_newlocalfilethe ns_newlocalfile function creates an instance of nsilocalfile that provides a platform independent representation of a file path.ns_newnativelocalfilethe ns_newnativelocalfile function creates an instance of nsilocalfile that provides a platform independent representation of a file path.ns_reallocreallocates a block of memory using the xpcom memory manager.ns_shutdownxpcomthe ns_shutdownxpcom function terminates use of xpcom in the calling process.nsresultthe nsresult data type is a strongly-typed enum used to represent a ...
nsICommandLineRunner
this is used to resolve file and uri paths.
nsIComponentManager
function startup(params, areason) { if (services.vc.compare(services.appinfo.platformversion, "10.0") < 0) components.manager.addbootstrappedmanifestlocation(params.installpath); } function shutdown(params, areason) { if (services.vc.compare(services.appinfo.platformversion, "10.0") < 0) components.manager.removebootstrappedmanifestlocation(params.installpath); } ...
nsICookie
path autf8string the path pertaining to the cookie.
nsICrashReporter
minidumppath nsilocalfile get or set the path on the local system to which minidumps will be written when a crash happens.
nsICryptoHash
the following example shows how to compute the sha256 hash of a file: // hardcoded here for convenience var path = "c:\\windows\\notepad.exe"; var f = components.classes["@mozilla.org/file/local;1"] .createinstance(components.interfaces.nsilocalfile); f.initwithpath(path); var istream = components.classes["@mozilla.org/network/file-input-stream;1"] .createinstance(components.interfaces.nsifileinputstream); // open for reading istream.init(f, 0x01, 0444, 0); var ch =...
nsIDirectoryServiceProvider
__definegetter__("currdir", function getcurrdir() { return components.classes["@mozilla.org/file/directory_service;1"] .getservice(components.interfaces.nsidirectoryserviceprovider) .getfile("curworkd",{}).path; }); test it with to see the magic happen.
nsIDynamicContainer
it can use the property bag on every result node to store data associated with each item, such as a full path on disk.
nsIFileView
odifiedcolumn" label="date" flex="1"/> <treecol id="size" label="size" flex="1"/> </treecols> <treechildren/> </tree> <script> var dir="/home/"; //the directory to be opened var ftree = document.getelementbyid("ftree"); //the xul tree element var lfile = components.classes["@mozilla.org/file/local;1"] .createinstance(components.interfaces.nsilocalfile); lfile.initwithpath(dir); // open the directory var fview = components.classes["@mozilla.org/filepicker/fileview;1"] .createinstance(components.interfaces.nsifileview); //create an instance of the component tview = fview.queryinterface(components.interfaces.nsitreeview); //get the nsitreeview interface fview.setdirectory(lfile.queryinterface(components.interfaces.nsifile)); //set the directory...
nsIINIParserFactory
example obtaining a parser object to obtain a parser for an ini file, you can use code that looks like this: to get an nsiiniparser instance for an ini file, you may use the following code: // create an nsilocalfile var cl = "@mozilla.org/file/local;1"; var interf = components.interfaces.nsilocalfile; var file = components.classes[cl].createinstance(interf); // init the file with the path to your ini file var path = "c:\\temp\\example.ini"; file.initwithpath(path); // create the nsiiniparserfactory var cl = "@mozilla.org/xpcom/ini-parser-factory;1"; var interf = components.interfaces.nsiiniparserfactory; var inifact = components.manager.getclassobjectbycontractid(cl,interf); // get the iniparser for the ini file var iniparser = inifact.createiniparser(file); see also nsiinip...
nsILocalFileMac
note: if the path of the cfurl is /a/b/c, at least a/b must exist beforehand.
nsILoginInfo
for logins obtained from html forms, this field is the action attribute from the form element, with the path removed (for example, "https://www.site.com").
nsIMemoryMultiReporter
attributes attribute type description explicitnonheap print64 the sum of all of this multi-reporter's measurements that have a path that starts with "explicit" and are of the kind kind_nonheap.
nsIMemoryReporterManager
each code area is identified by a unique path string, which is displayed in about:memory.
nsIMessenger
returns the actual file path (including the filename).
nsIMsgProtocolInfo
defaultlocalfilepath nsilocalfile the default path under which all server data for this account type will be stored.
nsIProcess
example // create an nsifile for the executable var file = components.classes["@mozilla.org/file/local;1"] .createinstance(components.interfaces.nsifile); file.initwithpath("c:\\myapp.exe"); // create an nsiprocess var process = components.classes["@mozilla.org/process/util;1"] .createinstance(components.interfaces.nsiprocess); process.init(file); // run the process.
nsIProfile
nativeprofiledir the pathname of the directory to use as the profile directory; if you specify null, a new folder will be created in the default profiles directory.
nsIWebProgressListener
*/ let mm = window.getgroupmessagemanager("browsers"); mm.loadframescript("chrome://path/to/some/example-framescript.js", true); mm.addmessagelistener("myaddonmessage", (message) => { let data = message.data; let browser = message.target; let outerwindowid = data.outerwindowid; // browser is now the <xul:browser> that saw the web progress activity // occur.
nsIWinAppHelper
the path is passed to helper.exe as the /uninstalllog parameter.
nsIXMLHttpRequest
you only want this if your url is to a zip file or some file you want to download and make a nsiarraybufferinputstream out of it or something xhr.send(null); } xhr('https://www.gravatar.com/avatar/eb9895ade1bd6627e054429d1e18b576?s=24&d=identicon&r=pg&f=1', data => { services.prompt.alert(null, 'xhr success', data); var file = os.path.join(os.constants.path.desktopdir, "test.png"); var promised = os.file.writeatomic(file, new uint8array(data)); promised.then( function() { alert('succesfully saved image to desktop') }, function(ex) { alert('failed in saving image to desktop') } ); }); ...
nsIXPConnect
awantnativewrappers whether xpconnect should produce native wrappers for scripts whose paths begin with this prefix.
nsIZipEntry
issynthetic boolean use this attribute to determine whether this item is an actual zip entry or is one synthesized for part of a real entry's path.
XPCOM Interface Reference
ntnsidomnshtmldocumentnsidomnavigatordesktopnotificationnsidomnodensidomofflineresourcelistnsidomorientationeventnsidomparsernsidomprogresseventnsidomserializernsidomsimplegestureeventnsidomstoragensidomstorage2nsidomstorageeventobsoletensidomstorageitemnsidomstoragelistnsidomstoragemanagernsidomstoragewindownsidomuserdatahandlernsidomwindownsidomwindow2nsidomwindowinternalnsidomwindowutilsnsidomxpathevaluatornsidomxpathexceptionnsidomxpathexpressionnsidomxpathresultnsidomxulcontrolelementnsidomxulelementnsidomxullabeledcontrolelementnsidomxulselectcontrolelementnsidomxulselectcontrolitemelementnsidatasignatureverifiernsidebugnsidebug2nsidevicemotionnsidevicemotiondatansidevicemotionlistenernsidialogcreatornsidialogparamblocknsidictionarynsidirindexnsidirindexlistenernsidirindexparsernsidirect...
XPCOM Interface Reference by grouping
nsiaccessiblestates nsiaccessibletable nsiaccessibletext nsiaccessibletreecache nsiaccessiblevalue nsiaccessnode nsisyncmessagesender script nsiscriptableunescapehtml nsiscriptableunicodeconverter nsiscripterror nsiscripterror2 stylesheet nsistylesheetservice url nsiuri nsiurl util nsidomserializer nsidomxpathevaluator nsidomxpathexception nsidomxpathexpression nsidomxpathresult xslt nsixsltexception nsixsltprocessor download nsidownload nsidownloadmanager nsidownloadprogresslistener element internal nsiworker nsiworkerglobalscope nsiworkermessageevent nsiworkermessageport nsiworkerscope tree nsitreeboxobject ...
Using nsIDirectoryService
on platforms which use path environment variables, you will need to set one of these paths to the /bin directory.
xpidl
MozillaTechXPIDLxpidl
for testing purposes, or one-off interface compilation, xpidl can be run from the command line: usage: ./xpidl -m mode [-w] [-v] [-t version number] [-d filename.pp] [-i path] [-o basename | -e filename.ext] filename.idl -a emit annotations to typelib -w turn on warnings (recommended) -v verbose mode (nyi) -t create a typelib of a specific version number -i add entry to start of include path for ``#include "nsithing.idl" -o use basename (e.g.
Index
as an example, i received the following inquiry, and i decided to follow my usual path and document what i do: 88 styling the folder pane the folder pane in thunderbird is predominantly controlled by code in folderpane.js.
Finding the code for a feature
as an example, i received the following inquiry, and i decided to follow my usual path and document what i do: hello i would like to add colours and tags to specific emails...by using nsimsgtagservice, can this be done?
Mozilla
import paths).
URLs - Plugins
to post a file, set the flag file to true, the buffer buf to the path name string for a file, and len to the length of the path string.
Color vision simulation - Firefox Developer Tools
contrast sensitivity loss can be caused by cataracts, glaucoma, diabetic retinopathy, and other disorders of the retina; it can be age-related, congenital, or due to an injury.
Use a source map - Firefox Developer Tools
the comment's syntax is like this: //# sourcemappingurl=http://example.com/path/to/your/sourcemap.map in the video above we load https://mdn.github.io/devtools-examples/sourcemaps-in-console/index.html.
Debugger-API - Firefox Developer Tools
showing how many objects different call paths allocate.
Dominators - Firefox Developer Tools
node b is said to dominate node a if every path from the root to a passes through b: if any of node a's dominators are freed, then node a itself becomes eligible for garbage collection.
Network request details - Firefox Developer Tools
request information the following information is shown only when the section is expanded: scheme: the scheme used in the url host: the server involved in the request filename: the full path to the file requested address: the ip address of the host the following information is shown in both the collapsed and the expanded states: status: the http response code for the request.
How to - Firefox Developer Tools
css flexbox inspector: examine flexbox layoutscss grid inspector: examine grid layoutsedit css filtersedit shape paths in cssedit fontsexamine event listenersexamine and edit cssexamine and edit htmlexamine and edit the box modelinspect and select colorsopen the inspectorreposition elements in the pageselect an elementselect and highlight elementsuse the inspector apiuse the inspector from the web consoleview background imagesvisualize transformswork with animations ...
Cookies - Firefox Developer Tools
path — the path property of the cookie.
IndexedDB - Firefox Developer Tools
key — the keypath property of the object store.
AnalyserNode.fftSize - Web APIs
bytetimedomaindata(dataarray); // draw an oscilloscope of the current audio source function draw() { drawvisual = requestanimationframe(draw); analyser.getbytetimedomaindata(dataarray); canvasctx.fillstyle = 'rgb(200, 200, 200)'; canvasctx.fillrect(0, 0, width, height); canvasctx.linewidth = 2; canvasctx.strokestyle = 'rgb(0, 0, 0)'; canvasctx.beginpath(); var slicewidth = width * 1.0 / bufferlength; var x = 0; 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; } canvasctx.lineto(canvas.width, canvas.height/2); ...
AnalyserNode.getByteTimeDomainData() - Web APIs
// draw an oscilloscope of the current audio source function draw() { drawvisual = requestanimationframe(draw); analyser.getbytetimedomaindata(dataarray); canvasctx.fillstyle = 'rgb(200, 200, 200)'; canvasctx.fillrect(0, 0, width, height); canvasctx.linewidth = 2; canvasctx.strokestyle = 'rgb(0, 0, 0)'; const slicewidth = width * 1.0 / bufferlength; let x = 0; canvasctx.beginpath(); for(var i = 0; i < bufferlength; i++) { const v = dataarray[i]/128.0; const y = v * height/2; if(i === 0) canvasctx.moveto(x, y); else canvasctx.lineto(x, y); x += slicewidth; } canvasctx.lineto(width, height/2); canvasctx.stroke(); }; draw(); specifications specification status comment web audio apithe definition of 'getby...
AnalyserNode.getFloatTimeDomainData() - Web APIs
sole.log(bufferlength); var dataarray = new float32array(bufferlength); canvasctx.clearrect(0, 0, width, height); function draw() { drawvisual = requestanimationframe(draw); analyser.getfloattimedomaindata(dataarray); canvasctx.fillstyle = 'rgb(200, 200, 200)'; canvasctx.fillrect(0, 0, width, height); canvasctx.linewidth = 2; canvasctx.strokestyle = 'rgb(0, 0, 0)'; canvasctx.beginpath(); var slicewidth = width * 1.0 / bufferlength; var x = 0; for(var i = 0; i < bufferlength; i++) { var v = dataarray[i] * 200.0; var y = height/2 + v; if(i === 0) { canvasctx.moveto(x, y); } else { canvasctx.lineto(x, y); } x += slicewidth; } canvasctx.lineto(canvas.width, canvas.height/2); canvasctx.stroke(); }; draw(); parameters array ...
AnalyserNode - Web APIs
"oscilloscope"); var canvasctx = canvas.getcontext("2d"); // draw an oscilloscope of the current audio source function draw() { requestanimationframe(draw); analyser.getbytetimedomaindata(dataarray); canvasctx.fillstyle = "rgb(200, 200, 200)"; canvasctx.fillrect(0, 0, canvas.width, canvas.height); canvasctx.linewidth = 2; canvasctx.strokestyle = "rgb(0, 0, 0)"; canvasctx.beginpath(); var slicewidth = canvas.width * 1.0 / bufferlength; var x = 0; for (var i = 0; i < bufferlength; i++) { var v = dataarray[i] / 128.0; var y = v * canvas.height / 2; if (i === 0) { canvasctx.moveto(x, y); } else { canvasctx.lineto(x, y); } x += slicewidth; } canvasctx.lineto(canvas.width, canvas.height / 2); canvasctx.stroke(); } draw(); ...
BaseAudioContext.createAnalyser() - Web APIs
bytetimedomaindata(dataarray); // draw an oscilloscope of the current audio source function draw() { drawvisual = requestanimationframe(draw); analyser.getbytetimedomaindata(dataarray); canvasctx.fillstyle = 'rgb(200, 200, 200)'; canvasctx.fillrect(0, 0, width, height); canvasctx.linewidth = 2; canvasctx.strokestyle = 'rgb(0, 0, 0)'; canvasctx.beginpath(); var slicewidth = width * 1.0 / bufferlength; var x = 0; 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; } canvasctx.lineto(canvas.width, canvas.height/2); ...
rssi - Web APIs
this is used to compute the path loss as this.txpower - this.rssi.
txPower - Web APIs
this is used to compute the path loss as this.txpower - this.rssi.
Using the CSS Typed Object Model - Web APIs
notice that the value returned is the absolute path to the image — this is returned even if the original url() value was relative.
CanvasRenderingContext2D.fillRect() - Web APIs
this method draws directly to the canvas without modifying the current path, so any subsequent fill() or stroke() calls will have no effect on it.
CanvasRenderingContext2D.fillText() - Web APIs
this method draws directly to the canvas without modifying the current path, so any subsequent fill() or stroke() calls will have no effect on it.
CanvasRenderingContext2D.getLineDash() - Web APIs
const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.setlinedash([10, 20]); console.log(ctx.getlinedash()); // [10, 20] // draw a dashed line ctx.beginpath(); ctx.moveto(0, 50); ctx.lineto(300, 50); ctx.stroke(); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.getlinedash' in that specification.
CanvasRenderingContext2D.getTransform() - Web APIs
</canvas> css canvas { border: 1px solid black; } javascript const canvases = document.queryselectorall('canvas'); const ctx1 = canvases[0].getcontext('2d'); const ctx2 = canvases[1].getcontext('2d'); ctx1.settransform(1, .2, .8, 1, 0, 0); ctx1.fillrect(25, 25, 50, 50); let storedtransform = ctx1.gettransform(); console.log(storedtransform); ctx2.settransform(storedtransform); ctx2.beginpath(); ctx2.arc(50, 50, 50, 0, 2 * math.pi); ctx2.fill(); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.gettransform' in that specification.
CanvasRenderingContext2D.globalAlpha - Web APIs
anvas.getcontext('2d'); // draw background ctx.fillstyle = '#fd0'; ctx.fillrect(0, 0, 75, 75); ctx.fillstyle = '#6c0'; ctx.fillrect(75, 0, 75, 75); ctx.fillstyle = '#09f'; ctx.fillrect(0, 75, 75, 75); ctx.fillstyle = '#f30'; ctx.fillrect(75, 75, 75, 75); ctx.fillstyle = '#fff'; // set transparency value ctx.globalalpha = 0.2; // draw transparent circles for (let i = 0; i < 7; i++) { ctx.beginpath(); ctx.arc(75, 75, 10 + 10 * i, 0, math.pi * 2, true); ctx.fill(); } screenshotlive sample specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.globalalpha' in that specification.
CanvasRenderingContext2D.lineDashOffset - Web APIs
html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.setlinedash([4, 16]); // dashed line with no offset ctx.beginpath(); ctx.moveto(0, 50); ctx.lineto(300, 50); ctx.stroke(); // dashed line with offset of 4 ctx.beginpath(); ctx.strokestyle = 'red'; ctx.linedashoffset = 4; ctx.moveto(0, 100); ctx.lineto(300, 100); ctx.stroke(); result the line with a dash offset is drawn in red.
CanvasRenderingContext2D.lineWidth - Web APIs
html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.linewidth = 15; ctx.beginpath(); ctx.moveto(20, 20); ctx.lineto(130, 130); ctx.rect(40, 40, 70, 70); ctx.stroke(); result more examples for more examples and explanation about this property, see applying styles and color in the canvas tutorial.
CanvasRenderingContext2D.miterLimit - Web APIs
playable code <canvas id="canvas" width="400" height="200" class="playable-canvas"></canvas> <div class="playable-buttons"> <input id="edit" type="button" value="edit" /> <input id="reset" type="button" value="reset" /> </div> <textarea id="code" class="playable-code"> ctx.beginpath(); ctx.moveto(0,0); ctx.linewidth = 15; ctx.lineto(100, 100); ctx.stroke();</textarea> var canvas = document.getelementbyid("canvas"); var ctx = canvas.getcontext("2d"); var textarea = document.getelementbyid("code"); var reset = document.getelementbyid("reset"); var edit = document.getelementbyid("edit"); var code = textarea.value; function drawcanvas() { ctx.clearrect(0, 0, canvas.width, c...
CanvasRenderingContext2D.setTransform() - Web APIs
</canvas> css canvas { border: 1px solid black; } javascript const canvases = document.queryselectorall('canvas'); const ctx1 = canvases[0].getcontext('2d'); const ctx2 = canvases[1].getcontext('2d'); ctx1.settransform(1, .2, .8, 1, 0, 0); ctx1.fillrect(25, 25, 50, 50); let storedtransform = ctx1.gettransform(); console.log(storedtransform); ctx2.settransform(storedtransform); ctx2.beginpath(); ctx2.arc(50, 50, 50, 0, 2 * math.pi); ctx2.fill(); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.settransform' in that specification.
CanvasRenderingContext2D.strokeRect() - Web APIs
this method draws directly to the canvas without modifying the current path, so any subsequent fill() or stroke() calls will have no effect on it.
CanvasRenderingContext2D.strokeStyle - Web APIs
(the red channel has a fixed value.) <canvas id="canvas" width="150" height="150"></canvas> var ctx = document.getelementbyid('canvas').getcontext('2d'); for (let i = 0; i < 6; i++) { for (let j = 0; j < 6; j++) { ctx.strokestyle = `rgb( 0, ${math.floor(255 - 42.5 * i)}, ${math.floor(255 - 42.5 * j)})`; ctx.beginpath(); ctx.arc(12.5 + j * 25, 12.5 + i * 25, 10, 0, math.pi * 2, true); ctx.stroke(); } } the result looks like this: screenshotlive sample specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.strokestyle' in that specification.
CanvasRenderingContext2D.strokeText() - Web APIs
this method draws directly to the canvas without modifying the current path, so any subsequent fill() or stroke() calls will have no effect on it.
CanvasRenderingContext2D.textAlign - Web APIs
html <canvas id="canvas"></canvas> javascript const canvas = document.getelementbyid('canvas'); canvas.width = 350; const ctx = canvas.getcontext('2d'); const x = canvas.width / 2; ctx.beginpath(); ctx.moveto(x, 0); ctx.lineto(x, canvas.height); ctx.stroke(); ctx.font = '30px serif'; ctx.textalign = 'left'; ctx.filltext('left-aligned', x, 40); ctx.textalign = 'center'; ctx.filltext('center-aligned', x, 85); ctx.textalign = 'right'; ctx.filltext('right-aligned', x, 130); result direction-dependent text alignment this example demonstrates the two direction-dependent values of the...
CanvasRenderingContext2D.textBaseline - Web APIs
anvas" width="550" height="500"></canvas> javascript const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); const baselines = ['top', 'hanging', 'middle', 'alphabetic', 'ideographic', 'bottom']; ctx.font = '36px serif'; ctx.strokestyle = 'red'; baselines.foreach(function (baseline, index) { ctx.textbaseline = baseline; const y = 75 + index * 75; ctx.beginpath(); ctx.moveto(0, y + 0.5); ctx.lineto(550, y + 0.5); ctx.stroke(); ctx.filltext('abcdefghijklmnop (' + baseline + ')', 0, y); }); result specifications specification status comment html living standardthe definition of 'canvasrenderingcontext2d.textbaseline' in that specification.
Transformations - Web APIs
the current clipping path, which we'll see in the next section.
Canvas API - Web APIs
const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.fillstyle = 'green'; ctx.fillrect(10, 10, 150, 100); result reference htmlcanvaselement canvasrenderingcontext2d canvasgradient canvasimagesource canvaspattern imagebitmap imagedata renderingcontext textmetrics offscreencanvas path2d imagebitmaprenderingcontext note: the interfaces related to the webglrenderingcontext are referenced under webgl.
Clients.openWindow() - Web APIs
examples // send notification to os if applicable if (self.notification.permission === 'granted') { const notificationobject = { body: 'click here to view your messages.', data: { url: self.location.origin + '/some/path' }, // data: { url: 'http://example.com' }, }; self.registration.shownotification('you\'ve got messages!', notificationobject); } // notification click event listener self.addeventlistener('notificationclick', e => { // close the notification popout e.notification.close(); // get all the window clients e.waituntil(clients.matchall({ type: 'window' }).then(clientsarr => { // i...
Clients - Web APIs
WebAPIClients
addeventlistener('notificationclick', event => { event.waituntil(async function() { const allclients = await clients.matchall({ includeuncontrolled: true }); let chatclient; // let's see if we already have a chat window open: for (const client of allclients) { const url = new url(client.url); if (url.pathname == '/chat/') { // excellent, let's use it!
console - Web APIs
WebAPIConsole
stack traces the console object also supports outputting a stack trace; this will show you the call path taken to reach the point at which you call console.trace().
ConvolverNode - Web APIs
let audioctx = new window.audiocontext(); async function createreverb() { let convolver = audioctx.createconvolver(); // load impulse response from file let response = await fetch("path/to/impulse-response.wav"); let arraybuffer = await response.arraybuffer(); convolver.buffer = await audioctx.decodeaudiodata(arraybuffer); return convolver; } ...
DeprecationReportBody - Web APIs
sourcefile a string containing the path to the source file where the deprecated feature was used, if known, or null otherwise.
How to create a DOM tree - Web APIs
dom trees can be queried using xpath expressions, converted to strings or written to a local or remote files using xmlserializer (without having to first convert to a string), posted to a web server (via xmlhttprequest), transformed using xslt, xlink, converted to a javascript object through a jxon algorithm, etc.
Element: mousedown event - Web APIs
s.addeventlistener('mousemove', e => { if (isdrawing === true) { drawline(context, x, y, e.offsetx, e.offsety); x = e.offsetx; y = e.offsety; } }); window.addeventlistener('mouseup', e => { if (isdrawing === true) { drawline(context, x, y, e.offsetx, e.offsety); x = 0; y = 0; isdrawing = false; } }); function drawline(context, x1, y1, x2, y2) { context.beginpath(); context.strokestyle = 'black'; context.linewidth = 1; context.moveto(x1, y1); context.lineto(x2, y2); context.stroke(); context.closepath(); } result specifications specification status ui eventsthe definition of 'mousedown' in that specification.
Element: mousemove event - Web APIs
s.addeventlistener('mousemove', e => { if (isdrawing === true) { drawline(context, x, y, e.offsetx, e.offsety); x = e.offsetx; y = e.offsety; } }); window.addeventlistener('mouseup', e => { if (isdrawing === true) { drawline(context, x, y, e.offsetx, e.offsety); x = 0; y = 0; isdrawing = false; } }); function drawline(context, x1, y1, x2, y2) { context.beginpath(); context.strokestyle = 'black'; context.linewidth = 1; context.moveto(x1, y1); context.lineto(x2, y2); context.stroke(); context.closepath(); } result specifications specification status ui eventsthe definition of 'mousemove' in that specification.
Element: mouseup event - Web APIs
s.addeventlistener('mousemove', e => { if (isdrawing === true) { drawline(context, x, y, e.offsetx, e.offsety); x = e.offsetx; y = e.offsety; } }); window.addeventlistener('mouseup', e => { if (isdrawing === true) { drawline(context, x, y, e.offsetx, e.offsety); x = 0; y = 0; isdrawing = false; } }); function drawline(context, x1, y1, x2, y2) { context.beginpath(); context.strokestyle = 'black'; context.linewidth = 1; context.moveto(x1, y1); context.lineto(x2, y2); context.stroke(); context.closepath(); } result specifications specification status ui eventsthe definition of 'mouseup' in that specification.
Fetch API - Web APIs
WebAPIFetch API
the fetch() method takes one mandatory argument, the path to the resource you want to fetch.
File.File() - Web APIs
WebAPIFileFile
name a usvstring representing the file name or the path to the file.
Using files from web applications - Web APIs
this is just the file name, and does not include any path information.
File.fileName - Web APIs
WebAPIFilefileName
for security reasons the path is excluded from this property.
File - Web APIs
WebAPIFile
file.prototype.webkitrelativepath read only returns the path the url of the file is relative to.
FileError - Web APIs
WebAPIFileError
path_exists_err 12 the file or directory with the same path already exists.
FileException - Web APIs
path_exists_err 12 the file or directory with the same path already exists.
FileReader.readAsBinaryString() - Web APIs
example var canvas = document.createelement('canvas'); var height = 200; var width = 200; canvas.width = width; canvas.height = height; var ctx = canvas.getcontext('2d'); ctx.strokestyle = '#090'; ctx.beginpath(); ctx.arc(width/2, height/2, width/2 - width/10, 0, math.pi*2); ctx.stroke(); canvas.toblob(function (blob) { var reader = new filereader(); reader.onload = function () { console.log(reader.result); } reader.readasbinarystring(blob); }); specifications specification status comment file apithe definition of 'readasbinarystring' in that specification.
FileSystemEntry.getParent() - Web APIs
fileerror.not_found_err the specified path could not be found.
FileSystemEntry.name - Web APIs
the read-only name property of the filesystementry interface returns a usvstring specifying the entry's name; this is the entry within its parent directory (the last component of the path as indicated by the fullpath property).
HTMLCanvasElement.mozFetchAsStream() - Web APIs
also uses netutil.jsm var canvas = document.getelementbyid('canvas'); var d = canvas.width; ctx = canvas.getcontext('2d'); ctx.beginpath(); ctx.moveto(d / 2, 0); ctx.lineto(d, d); ctx.lineto(0, d); ctx.closepath(); ctx.fillstyle = 'yellow'; ctx.fill(); var netutilcallback = function() { return function(result) { if (!components.issuccesscode(result)) { alert('failed to create icon'); } else { alert('succesfully made'); } }; } var mfascallback = function(iconname) { return fun...
HTMLHyperlinkElementUtils - Web APIs
htmlhyperlinkelementutils.pathname this is a usvstring containing an initial '/' followed by the path of the url.
HTMLIFrameElement.referrerPolicy - Web APIs
this policy will leak origins and paths from tls-protected resources to insecure origins.
HTMLMediaElement: abort event - Web APIs
bubbles no cancelable no interface event event handler property onabort examples const video = document.queryselector('video'); const videosrc = 'https://path/to/video.webm'; video.addeventlistener('abort', () => { console.log(`abort loading: ${videosrc}`); }); const source = document.createelement('source'); source.setattribute('src', videosrc); source.setattribute('type', 'video/webm'); video.appendchild(source); specifications specification status html living standard living standard html5 recommendation ...
HTMLMediaElement: error event - Web APIs
bubbles no cancelable no interface event event handler property onerror examples const video = document.queryselector('video'); const videosrc = 'https://path/to/video.webm'; video.addeventlistener('error', () => { console.error(`error loading: ${videosrc}`); }); video.setattribute('src', videosrc); specifications specification status html living standard living standard html5 recommendation ...
HTMLScriptElement.referrerPolicy - Web APIs
this policy will leak origins and paths from tls-protected resources to insecure origins.
Using microtasks in JavaScript with queueMicrotask() - Web APIs
the microtask will execute, as always, when the javascript execution path reaches the top level, just before running callbacks.
The HTML DOM API - Web APIs
canvasgradient canvaspattern canvasrenderingcontext2d imagebitmap imagebitmaprenderingcontext imagedata offscreencanvas offscreencanvasrenderingcontext2d path2d textmetrics media interfaces the media interfaces provide html access to the contents of the media elements: <audio> and <video>.
Recommended Drag Types - Web APIs
meprimitive.value.queryinterface(components.interfaces.nsisupportsstring).data; console.log("target filename is = " + name); var dirprimitive = {}; atransferable.gettransferdata('application/x-moz-file-promise-dir', dirprimitive, datasize); var dir = dirprimitive.value.queryinterface(components.interfaces.nsilocalfile); console.log("target folder is = " + dir.path); var file = cc['@mozilla.org/file/local;1'].createinstance(components.interfaces.nsilocalfile); file.initwithpath(dir.path); file.appendrelativepath(name); console.log("output final path is =" + file.path); // now you can write or copy the file yourself… } } } see also html drag and drop api (overview) drag operations dragging and dropping mul...
IDBCursor.source - Web APIs
WebAPIIDBCursorsource
within each iteration we log the source of the cursor, which will log our idbobjectstore object to the console, something like this: idbobjectstore {autoincrement: false, transaction: idbtransaction, indexnames: domstringlist, keypath: "albumtitle", name: "rushalbumlist"…} the cursor does not require us to select the data based on a key; we can just grab all of it.
IDBCursor.update() - Web APIs
WebAPIIDBCursorupdate
dataerror the underlying object store uses in-line keys and the property in the value at the object store's key path does not match the key in this cursor's position.
IDBCursorSync - Web APIs
setting this attribute can raise an idbdatabaseexception with the following codes: data_err if the underlying object store uses in-line keys and the property at the key path does not match the key in this cursor's position.
IDBDatabase.onabort - Web APIs
dbopenrequest.onupgradeneeded = function(event) { var db = event.target.result; db.onerror = function() { note.innerhtml += '<li>error opening database.</li>'; }; db.onabort = function() { note.innerhtml += '<li>database opening aborted!</li>'; }; // create an objectstore for this database var objectstore = db.createobjectstore("todolist", { keypath: "tasktitle" }); // define what data items the objectstore will contain objectstore.createindex("hours", "hours", { unique: 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 }); ob...
IDBDatabase.onerror - Web APIs
dbopenrequest.onupgradeneeded = function(event) { var db = this.result; db.onerror = function(event) { note.innerhtml += '<li>error opening database.</li>'; }; db.onabort = function(event) { note.innerhtml += '<li>database opening aborted!</li>'; }; // create an objectstore for this database var objectstore = db.createobjectstore("todolist", { keypath: "tasktitle" }); // define what data items the objectstore will contain objectstore.createindex("hours", "hours", { unique: 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 }); ob...
IDBDatabase.onversionchange - Web APIs
request.onupgradeneeded = function(event) { var db = event.target.result; db.onerror = function(event) { note.innerhtml += '<li>error opening database.</li>'; }; db.onabort = function(event) { note.innerhtml += '<li>database opening aborted!</li>'; }; // create an objectstore for this database var objectstore = db.createobjectstore("todolist", { keypath: "tasktitle" }); // define what data items the objectstore will contain objectstore.createindex("hours", "hours", { unique: 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 }); ob...
IDBDatabase - Web APIs
ion number has been // submitted via the window.indexeddb.open line above dbopenrequest.onupgradeneeded = function(event) { var db = event.target.result; db.onerror = function(event) { note.innerhtml += '<li>error loading database.</li>'; }; // create an objectstore for this database using // idbdatabase.createobjectstore var objectstore = db.createobjectstore("todolist", { keypath: "tasktitle" }); // define what data items the objectstore will contain objectstore.createindex("hours", "hours", { unique: 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 }); ob...
IDBIndex.multiEntry - Web APIs
the multientry read-only property of the idbindex interface returns a boolean value that affects how the index behaves when the result of evaluating the index's key path yields an array.
IDBIndex.objectStore - Web APIs
the current object store is logged to the console: it should be returned something like this: idbobjectstore { name: "contactslist", keypath: "id", indexnames: domstringlist[7], transaction: idbtransaction, autoincrement: false } finally, we iterate through each record, and insert the data into an html table.
IDBIndexSync - Web APIs
direction) raises (idbdatabaseexception); void openobjectcursor (in optional idbkeyrange range, in optional unsigned short direction) raises (idbdatabaseexception); any put (in any value, in optional any key) raises (idbdatabaseexception); void remove (in any key) raises (idbdatabaseexception); attributes attribute type description keypath readonly domstring the key path of this index.
IDBObjectStore.add() - Web APIs
the object store uses in-line keys but no key generator, and the object store's key path does not yield a valid key.
IDBObjectStore.deleteIndex() - Web APIs
ew version number has been submitted via the // window.indexeddb.open line above //it is only implemented in recent browsers dbopenrequest.onupgradeneeded = function(event) { var db = this.result; db.onerror = function(event) { note.innerhtml += '<li>error loading database.</li>'; }; // create an objectstore for this database var objectstore = db.createobjectstore("todolist", { keypath: "tasktitle" }); // define what data items the objectstore will contain objectstore.createindex("hours", "hours", { unique: 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 }); ...
IDBObjectStore.put() - Web APIs
the object store uses in-line keys but no key generator, and the object store's key path does not yield a valid key.
IDBOpenDBRequest.onblocked - Web APIs
version number has been submitted via the // window.indexeddb.open line above //it is only implemented in recent browsers request.onupgradeneeded = function(event) { var db = event.target.result; db.onerror = function(event) { note.innerhtml += '<li>error loading database.</li>'; }; // create an objectstore for this database var objectstore = db.createobjectstore("todolist", { keypath: "tasktitle" }); ...
IDBOpenDBRequest.onupgradeneeded - Web APIs
var store = db.createobjectstore("books", {keypath: "isbn"}); var titleindex = store.createindex("by_title", "title", {unique: true}); var authorindex = store.createindex("by_author", "author"); } if (event.oldversion < 2) { // version 2 introduces a new index of books by year.
IDBOpenDBRequest - Web APIs
w version number has been // submitted via the window.indexeddb.open line above // it is only implemented in recent browsers dbopenrequest.onupgradeneeded = function(event) { var db = this.result; db.onerror = function(event) { note.innerhtml += '<li>error loading database.</li>'; }; // create an objectstore for this database var objectstore = db.createobjectstore("todolist", { keypath: "tasktitle" }); // define what data items the objectstore will contain objectstore.createindex("hours", "hours", { unique: 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 }); ...
ImageBitmap - Web APIs
imagebitmap provides an asynchronous and resource efficient pathway to prepare textures for rendering in webgl.
install - Web APIs
for installations, these pairs are the xpinstall confirm dialog display name and the path of the xpi, respectively.
Timing element visibility with the Intersection Observer API - Web APIs
after that, the code paths converge once again.
InterventionReportBody - Web APIs
sourcefile a string containing the path to the source file where the intervention occurred, if known, or null otherwise.
MouseEvent.region - Web APIs
WebAPIMouseEventregion
<canvas id="canvas"></canvas> <script> var canvas = document.getelementbyid("canvas"); var ctx = canvas.getcontext("2d"); ctx.beginpath(); ctx.arc(70, 80, 10, 0, 2 * math.pi, false); ctx.fill(); ctx.addhitregion({id: "circle"}); canvas.addeventlistener("mousemove", function(event){ if(event.region) { console.log("hit region: " + event.region); } }); </script> ...
msPlayToPreferredSourceUri - Web APIs
msplaytopreferredsourceuri is a read/write property which gets or sets the path to the preferred media source.
PaintWorklet.registerPaint - Web APIs
/* checkboardworklet.js */ class checkerboardpainter { paint(ctx, geom, properties) { // use `ctx` as if it was a normal canvas const colors = ['red', 'green', 'blue']; const size = 32; for(let y = 0; y < geom.height/size; y++) { for(let x = 0; x < geom.width/size; x++) { const color = colors[(x + y) % colors.length]; ctx.beginpath(); ctx.fillstyle = color; ctx.rect(x * size, y * size, size, size); ctx.fill(); } } } } // register our class under a specific name registerpaint('checkerboard', checkerboardpainter); the first step in using a paintworket is defining the paint worklet using the registerpaint() function, as done above.
PaintWorklet - Web APIs
class checkerboardpainter { paint(ctx, geom, properties) { // use `ctx` as if it was a normal canvas const colors = ['red', 'green', 'blue']; const size = 32; for(let y = 0; y < geom.height/size; y++) { for(let x = 0; x < geom.width/size; x++) { const color = colors[(x + y) % colors.length]; ctx.beginpath(); ctx.fillstyle = color; ctx.rect(x * size, y * size, size, size); ctx.fill(); } } } } // register our class under a specific name registerpaint('checkerboard', checkerboardpainter); load a paintworklet the following example demonstrates loading the above worklet from its js file and does so by feature detection.
Pointer Lock API - Web APIs
tcontent = "x position: " + x + ", y position: " + y; if (!animation) { animation = requestanimationframe(function() { animation = null; canvasdraw(); }); } } the canvasdraw() function draws the ball in the current x and y positions: function canvasdraw() { ctx.fillstyle = "black"; ctx.fillrect(0, 0, canvas.width, canvas.height); ctx.fillstyle = "#f00"; ctx.beginpath(); ctx.arc(x, y, radius, 0, degtorad(360), true); ctx.fill(); } iframe limitations pointer lock can only lock one iframe at a time.
Request.cache - Web APIs
WebAPIRequestcache
// in reality; this would be a function that takes a path and a // reference to the controller since it would need to change the value let controller = new abortcontroller(); fetch("some.json", {cache: "only-if-cached", mode: "same-origin", signal: controller.signal}) .catch(e => e instanceof typeerror && e.message === "failed to fetch" ?
Request.destination - Web APIs
the destination is used by the user agent to, for example, help determine which set of rules to follow for cors purposes, or how to navigate any complicated code paths that affect how specific types of request get handled.
Response.clone() - Web APIs
WebAPIResponseclone
example in our fetch response clone example (see fetch response clone live) we create a new request object using the request() constructor, passing it a jpg path.
Response.headers - Web APIs
WebAPIResponseheaders
example in our fetch response example (see fetch response live) we create a new request object using the request() constructor, passing it a jpg path.
Response.ok - Web APIs
WebAPIResponseok
example in our fetch response example (see fetch response live) we create a new request object using the request() constructor, passing it a jpg path.
Response.status - Web APIs
WebAPIResponsestatus
example in our fetch response example (see fetch response live) we create a new request object using the request() constructor, passing it a jpg path.
Response.statusText - Web APIs
example in our fetch response example (see fetch response live) we create a new request object using the request() constructor, passing it a jpg path.
Response.type - Web APIs
WebAPIResponsetype
example in our fetch response example (see fetch response live) we create a new request object using the request() constructor, passing it a jpg path.
Response.url - Web APIs
WebAPIResponseurl
example in our fetch response example (see fetch response live) we create a new request object using the request() constructor, passing it a jpg path.
SVGAnimationElement: beginEvent event - Web APIs
bubbles no cancelable no interface timeevent event handler property onbegin examples animated circle <svg xmlns="http://www.w3.org/2000/svg" width="300px" height="100px"> <title>svg smil animate with path</title> <circle cx="0" cy="50" r="50" fill="blue" stroke="black" stroke-width="1"> <animatemotion path="m 0 0 h 300 z" dur="5s" repeatcount="indefinite" /> </circle> </svg> <hr> <ul> </ul> ul { height: 100px; border: 1px solid #ddd; overflow-y: scroll; padding: 10px 30px; } let svgelem = document.queryselector('svg'); let animateelem = document.queryselector('an...
SVGAnimationElement: endEvent event - Web APIs
bubbles no cancelable no interface timeevent event handler property onend examples animated circle <svg xmlns="http://www.w3.org/2000/svg" width="300px" height="100px"> <title>svg smil animate with path</title> <circle cx="0" cy="50" r="50" fill="blue" stroke="black" stroke-width="1"> <animatemotion path="m 0 0 h 300 z" dur="5s" repeatcount="indefinite" /> </circle> </svg> <hr> <button>stop animation</button> <ul> </ul> ul { height: 100px; border: 1px solid #ddd; overflow-y: scroll; padding: 10px 30px; } let svgelem = document.queryselector('svg'); let animate...
SVGAnimationElement: repeatEvent event - Web APIs
bubbles no cancelable no interface timeevent event handler property onrepeat examples animated circle <svg xmlns="http://www.w3.org/2000/svg" width="300px" height="100px"> <title>svg smil animate with path</title> <circle cx="0" cy="50" r="50" fill="blue" stroke="black" stroke-width="1"> <animatemotion path="m 0 0 h 300 z" dur="5s" repeatcount="indefinite" /> </circle> </svg> <hr> <ul> </ul> ul { height: 100px; border: 1px solid #ddd; overflow-y: scroll; padding: 10px 30px; } let svgelem = document.queryselector('svg'); let animateelem = document.queryselector('an...
SVGMarkerElement - Web APIs
svg path segment interface the svgmarkerelement interface corresponds to the marker element.
SVGTextContentElement - Web APIs
it is inherited by various text-related interfaces, such as svgtextelement, svgtspanelement, svgtrefelement, svgaltglyphelement and svgtextpathelement.
Service Worker API - Web APIs
service worker concepts and usage a service worker is an event-driven worker registered against an origin and a path.
SpeechRecognition.serviceURI - Web APIs
syntax var myserviceuri = myspeechrecognition.serviceuri; myspeechrecognition.serviceuri = 'path/to/my/service/'; value a domstring representing the uri of the speech recognition service.
TextMetrics - Web APIs
mheightdescent', 'actualboundingboxdescent', 'fontboundingboxdescent']; const baselines = [...baselinesabovealphabetic, ...baselinesbelowalphabetic]; ctx.font = '25px serif'; ctx.strokestyle = 'red'; baselines.foreach(function (baseline, index) { let text = 'abcdefghijklmnop (' + baseline + ')'; let textmetrics = ctx.measuretext(text); let y = 50 + index * 50; ctx.beginpath(); ctx.filltext(text, 0, y); let liney = y - math.abs(textmetrics[baseline]); if (baselinesbelowalphabetic.includes(baseline)) { liney = y + math.abs(textmetrics[baseline]); } ctx.moveto(0, liney); ctx.lineto(550, liney); ctx.stroke(); }); result measuring text width when measuring the x-direction of a piece of text, the sum of actualboundingboxleft and actualboundingboxr...
URL API - Web APIs
WebAPIURL API
let addr = new url("/docs/web/api/url_api"); let host = addr.host; let path = addr.pathname; the snippet above creates a url object for the article you're reading right now, then fetches the host and pathname properties.
WebGL best practices - Web APIs
hardware often has hyper-optimized or even specialized instructions for builtins, and the compiler can't reliably replace your custom builtin-replacements with the special builtin codepaths.
Viewpoints and viewers: Simulating cameras in WebXR - Web APIs
for 3d gps solutions, the camera is positioned to show the area around the user, with the majority of the display showing the area ahead of the user's path of motion.
Inputs and input sources - Web APIs
this space's native origin is located at the point from which the target ray is emitted (such as the front tip of the controller, or the end of a gun barrel if the controller is being rendered as a gun, for example), and the space's orientation vector extends outward along the path of the target ray.
Rendering and the WebXR frame animation callback - Web APIs
two of the most common are handling of user inputs and performing updates to the positions of objects (or the viewer) based on known factors, such as those user control states or known animation paths of the objects in the scene.
Visualizations with Web Audio API - Web APIs
ce 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.
Using the Web Storage API - Web APIs
function populatestorage() { localstorage.setitem('bgcolor', document.getelementbyid('bgcolor').value); localstorage.setitem('font', document.getelementbyid('font').value); localstorage.setitem('image', document.getelementbyid('image').value); setstyles(); } the populatestorage() function sets three items in local storage — the background color, font, and image path.
window.location - Web APIs
WebAPIWindowlocation
location.assign("http://www.mozilla.org"); // or location = "http://www.mozilla.org"; example #2: force reloading the current page from the server location.reload(true); example #3 consider the following example, which will reload the page by using the replace() method to insert the value of location.pathname into the hash: function reloadpagewithhash() { var initialpage = location.pathname; location.replace('http://example.com/#' + initialpage); } example #4: display the properties of the current url in an alert dialog: function showloc() { var olocation = location, alog = ["property (typeof): value", "location (" + (typeof olocation) + "): " + olocation ]; for (var sprop in olocation...
Window.pkcs11 - Web APIs
WebAPIWindowpkcs11
syntax objref = window.pkcs11 example window.pkcs11.addmodule(smod, secpath, 0, 0); notes see nsidompkcs11 for more information about how to manipulate pkcs11 objects.
Window.screenLeft - Web APIs
WebAPIWindowscreenLeft
t; initialtop = window.screentop + canvaselem.offsettop; function positionelem() { let newleft = window.screenleft + canvaselem.offsetleft; let newtop = window.screentop + canvaselem.offsettop; let leftupdate = initialleft - newleft; let topupdate = initialtop - newtop; ctx.fillstyle = 'rgb(0, 0, 0)'; ctx.fillrect(0, 0, width, height); ctx.fillstyle = 'rgb(0, 0, 255)'; ctx.beginpath(); ctx.arc(leftupdate + (width/2), topupdate + (height/2) + 35, 50, degtorad(0), degtorad(360), false); ctx.fill(); pelem.textcontent = 'window.screenleft: ' + window.screenleft + ', window.screentop: ' + window.screentop; window.requestanimationframe(positionelem); } window.requestanimationframe(positionelem); also in the code we include a snippet that detects whether screenleft is s...
Window.screenTop - Web APIs
WebAPIWindowscreenTop
t; initialtop = window.screentop + canvaselem.offsettop; function positionelem() { let newleft = window.screenleft + canvaselem.offsetleft; let newtop = window.screentop + canvaselem.offsettop; let leftupdate = initialleft - newleft; let topupdate = initialtop - newtop; ctx.fillstyle = 'rgb(0, 0, 0)'; ctx.fillrect(0, 0, width, height); ctx.fillstyle = 'rgb(0, 0, 255)'; ctx.beginpath(); ctx.arc(leftupdate + (width/2), topupdate + (height/2) + 35, 50, degtorad(0), degtorad(360), false); ctx.fill(); pelem.textcontent = 'window.screenleft: ' + window.screenleft + ', window.screentop: ' + window.screentop; window.requestanimationframe(positionelem); } window.requestanimationframe(positionelem); also in the code we include a snippet that detects whether screenleft is s...
Window.screenX - Web APIs
WebAPIWindowscreenX
t; initialtop = window.screentop + canvaselem.offsettop; function positionelem() { let newleft = window.screenleft + canvaselem.offsetleft; let newtop = window.screentop + canvaselem.offsettop; let leftupdate = initialleft - newleft; let topupdate = initialtop - newtop; ctx.fillstyle = 'rgb(0, 0, 0)'; ctx.fillrect(0, 0, width, height); ctx.fillstyle = 'rgb(0, 0, 255)'; ctx.beginpath(); ctx.arc(leftupdate + (width/2), topupdate + (height/2) + 35, 50, degtorad(0), degtorad(360), false); ctx.fill(); pelem.textcontent = 'window.screenleft: ' + window.screenleft + ', window.screentop: ' + window.screentop; window.requestanimationframe(positionelem); } window.requestanimationframe(positionelem); these work in exactly the same way as screenx/screeny.
Window.screenY - Web APIs
WebAPIWindowscreenY
t; initialtop = window.screentop + canvaselem.offsettop; function positionelem() { let newleft = window.screenleft + canvaselem.offsetleft; let newtop = window.screentop + canvaselem.offsettop; let leftupdate = initialleft - newleft; let topupdate = initialtop - newtop; ctx.fillstyle = 'rgb(0, 0, 0)'; ctx.fillrect(0, 0, width, height); ctx.fillstyle = 'rgb(0, 0, 255)'; ctx.beginpath(); ctx.arc(leftupdate + (width/2), topupdate + (height/2) + 35, 50, degtorad(0), degtorad(360), false); ctx.fill(); pelem.textcontent = 'window.screenleft: ' + window.screenleft + ', window.screentop: ' + window.screentop; window.requestanimationframe(positionelem); } window.requestanimationframe(positionelem); these work in exactly the same way as screenx/screeny.
Worker.prototype.postMessage() - Web APIs
main thread code: var myworker = new chromeworker(self.path + 'myworker.js'); function handlemessagefromworker(msg) { console.log('incoming message from worker, msg:', msg); switch (msg.data.atopic) { case 'do_sendmainarrbuff': sendmainarrbuff(msg.data.abuf) break; default: throw 'no atopic on incoming message to chromeworker'; } } myworker.addeventlistener('message', handlemessagefromworke...
Worker - Web APIs
WebAPIWorker
creating a worker is done by calling the worker("path/to/worker/script") constructor.
WorkerGlobalScope.importScripts() - Web APIs
these paths are relative to html document base url.
WorkerGlobalScope.location - Web APIs
llowing in a document served at localhost:8000 console.log(location); inside a worker (which would basically be the equivalent of self.console.log(self.location);, as these are being called on the worker scope, which can be referenced with workerglobalscope.self), you will get a workerlocation object written to the console — something like the following: workerlocation {hash: "", search: "", pathname: "/worker.js", port: "8000", hostname: "localhost"…} hash: "" host: "localhost:8000" hostname: "localhost" href: "http://localhost:8000/worker.js" origin: "http://localhost:8000" pathname: "/worker.js" port: "8000" protocol: "http:" search: "" __proto__: workerlocation you could use this location object to return more information about the document's location, as you mi...
WorkerLocation - Web APIs
urlutilsreadonly.pathname read only is a domstring containing an initial '/' followed by the path of the url of the script executed in the worker.
Resources - Web APIs
at ibm developerworks xslt tutorial at zvon.org xpath tutorial at zvon.org using the mozilla javascript interface to do xsl transformations at mozilla.org mozilla.org's xslt project page, which includes a frequently encountered issues section.
Accessibility: What users can do to browse more safely - Accessibility
grayscale is enabled when the color filters button is toggled "on" see also accessibilty accessibility learning path web accessibility for seizures and physical reactions color blindness discussion: "what is the “grayscale” setting for in accessibility options?" contributors many, many thanks to eric eggert from knowbility; for his discussions and huge help on this topic.
Keyboard-navigable JavaScript widgets - Accessibility
non-native controls native html elements that are interactive, like <a>, <input> and <select>, are already accessible by keyboards, so to use one of them is the fastest path to make components work with keyboards.
Web Accessibility: Understanding Colors and Luminance - Accessibility
see also mdn accessibilty accessibility learning path color <color> web accessibility for seizures and physical reactions color blindness discussions (general) what is the “grayscale” setting for in accessibility options?
Operable - Accessibility
path-based or multi-point gestures are not required to operate any functionality.
Perceivable - Accessibility
otherwise, screenreaders may try to read out the filepath, etc.
font-display - CSS: Cascading Style Sheets
formal definition related at-rule@font-faceinitial valueautocomputed valueas specified formal syntax [ auto | block | swap | fallback | optional ] examples specifying fallback font-display @font-face { font-family: examplefont; src: url(/path/to/fonts/examplefont.woff) format('woff'), url(/path/to/fonts/examplefont.eot) format('eot'); font-weight: 400; font-style: normal; font-display: fallback; } specifications specification status comment css fonts module level 4the definition of 'font-display' in that specification.
CSS Masking - CSS: Cascading Style Sheets
reference properties clip clip-path clip-rule mask mask-border mask-border-mode mask-border-outset mask-border-repeat mask-border-slice mask-border-source mask-border-width mask-clip mask-composite mask-image mask-mode mask-origin mask-position mask-repeat mask-size mask-type specifications specification status comment css masking module level 1 candidate recommendation scalable vector graphics (svg) 1.1 (second edition)the definition of 'mask' in that specification.
The stacking context - CSS: Cascading Style Sheets
element with any of the following properties with value other than none: transform filter perspective clip-path mask / mask-image / mask-border element with a isolation value isolate.
Basic Shapes - CSS: Cascading Style Sheets
another useful resource is clippy - a tool for creating shapes for clip-path, as the values for basic shapes are the same as those used for clip-path.
CSS Shapes - CSS: Cascading Style Sheets
reference properties shape-image-threshold shape-margin shape-outside data types <basic-shape> guides overview of css shapes shapes from box values basic shapes shapes from images edit shape paths in css — firefox developer tools external resources a list of css shapes resources css shapes 101 creating non-rectangular layouts with css shapes how to use css shapes in your web design how to get started with css shapes what i learned in one weekend with css shapes css vs.
Cookbook template - CSS: Cascading Style Sheets
recipe change the path to the example below to point to your merged example.
Mozilla CSS extensions - CSS: Cascading Style Sheets
art [superseded by the standard version border-inline-start] -moz-border-start-color [superseded by the standard version border-inline-start-color] -moz-border-start-style [superseded by the standard version border-inline-start-style] -moz-border-start-width [superseded by the standard version border-inline-start-width] -moz-box-sizing [prefixed version still accepted] c clip-path [applying to more than svg] -moz-column-count [prefixed version still accepted] -moz-column-fill [prefixed version still accepted] -moz-column-gap [prefixed version still accepted] -moz-column-width [prefixed version still accepted] -moz-column-rule [prefixed version still accepted] -moz-column-rule-width [prefixed version still accepted] -moz-column-rule-style [prefixed ve...
WebKit CSS extensions - CSS: Cascading Style Sheets
-timing-function b -webkit-backface-visibility -webkit-background-clip -webkit-background-origin -webkit-background-size -webkit-border-bottom-left-radius -webkit-border-bottom-right-radius -webkit-border-image -webkit-border-radius -webkit-border-top-left-radius -webkit-border-top-right-radius -webkit-box-decoration-break -webkit-box-shadow -webkit-box-sizing c -webkit-clip-path -webkit-column-count -webkit-column-fill -webkit-column-gap -webkit-column-rule -webkit-column-rule-color -webkit-column-rule-style -webkit-column-rule-width -webkit-column-span -webkit-column-width -webkit-columns f -webkit-filter -webkit-flex -webkit-flex-basis -webkit-flex-direction -webkit-flex-flow -webkit-flex-grow -webkit-flex-shrink -webkit-flex-wrap -webkit-font-fe...
box-decoration-break - CSS: Cascading Style Sheets
the specified value will impact the appearance of the following properties: background border border-image box-shadow clip-path margin padding syntax /* keyword values */ box-decoration-break: slice; box-decoration-break: clone; /* global values */ box-decoration-break: initial; box-decoration-break: inherit; box-decoration-break: unset; the box-decoration-break property is specified as one of the keyword values listed below.
shape-margin - CSS: Cascading Style Sheets
the world was fashioned the square on the hypotenuse was equal to the sum of the squares on the other two sides of a right triangle, and it will be so after this world is dead; and the inhabitant of mars, if he exists, probably knows its truth as we know it.</section> css section { max-width: 400px; } .shape { float: left; width: 150px; height: 150px; background-color: maroon; clip-path: polygon(0 0, 150px 150px, 0 150px); shape-outside: polygon(0 0, 150px 150px, 0 150px); shape-margin: 20px; } result specifications specification status comment css shapes module level 1the definition of 'shape-margin' in that specification.
CSS: Cascading Style Sheets
WebCSS
this module provides a gentle beginning to your path towards css mastery with the basics of how it works, what the syntax looks like, and how you can start using it to add styling to html.
Demos of open web technologies
le videos 3d graphics webgl web audio fireworks ioquake3 (source code) escher puzzle (source code) kai 'opua (source code) virtual reality the polar sea (source code) sechelt fly-through (source code) css css zen garden css floating logo "mozilla" paperfold css blockout rubik's cube pure css slides planetarium (source code) loader with blend modes text reveal with clip-path ambient shadow with custom properties luminiscent vial css-based single page application (source code) transformations impress.js (source code) games ioquake3 (source code) kai 'opua (source code) web apis notifications api html5 notifications (source code) web audio api web audio fireworks oscope.js - javascript oscilloscope html5 web audio showcase (source code)...
exsl:node-set() - EXSLT
WebEXSLTexslnode-set
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes exsl:node-set() returns a node-set from a result tree fragment, which is what you get when you look at the xsl:variable instead of its select attribute to fetch a variable's value.
exsl:object-type() - EXSLT
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes exsl:object-type() returns a string that indicates the type of the specified object.
Common (exsl) - EXSLT
WebEXSLTexsl
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the exslt common package provides basic functions that expand upon the capabilities of xslt.
math:highest() - EXSLT
WebEXSLTmathhighest
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes math:highest() returns the node in the specified node-set with the highest value (where the highest value calculated using math:max()).
math:lowest() - EXSLT
WebEXSLTmathlowest
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes math:lowest() returns the node in the specified node-set with the lowest value (where the lowest value calculated using math:min()).
math:max() - EXSLT
WebEXSLTmathmax
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes math:max() returns the maximum value of a node-set.
math:min() - EXSLT
WebEXSLTmathmin
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes math:min() returns the minimum value of a node-set.
Math (math) - EXSLT
WebEXSLTmath
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the exslt math package provides functions for working with numeric values and comparing nodes.
regexp:match() - EXSLT
WebEXSLTregexpmatch
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes regexp:match() performs regular expression matching on a string, returning the submatches found as a result.
regexp:replace() - EXSLT
WebEXSLTregexpreplace
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes regexp:replace() replaces the portions of a string that match a given regular expression with the contents of another string.
regexp:test() - EXSLT
WebEXSLTregexptest
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes regexp:test() tests to see whether a string matches a specified regular expression.
Regular expressions (regexp) - EXSLT
WebEXSLTregexp
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the exslt regular expressions package provides functions that allow testing, matching, and replacing text using javascript style regular expressions.
set:difference() - EXSLT
WebEXSLTsetdifference
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes set:difference() returns the difference between two node-sets.
set:distinct() - EXSLT
WebEXSLTsetdistinct
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes set:distinct() returns a subset of the nodes in the specified node-set, returning only nodes with unique string values.
set:has-same-node() - EXSLT
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes set:has-same-node() determines whether two node-sets have any nodes in common.
set:intersection() - EXSLT
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes set:intersection() returns the intersection of two node-sets.
set:leading() - EXSLT
WebEXSLTsetleading
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes set:leading() returns the nodes in one node-set that come before the first node in the other node-set.
set:trailing() - EXSLT
WebEXSLTsettrailing
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes set:trailing() returns the nodes in one node-set that come after the first node in the other node-set.
Sets (set) - EXSLT
WebEXSLTset
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the exslt sets package offers functions that let you perform set manipulation.
str:concat() - EXSLT
WebEXSLTstrconcat
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes str:concat() returns a string containing all the string values in a node-set concatenated together.
str:split() - EXSLT
WebEXSLTstrsplit
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes str:split() splits a string using a pattern string to determine where the splits should occur, returning a node-set containing the resulting strings.
str:tokenize() - EXSLT
WebEXSLTstrtokenize
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes str:tokenize() splits a string using a set of characters as delimiters that determine where the splits should occur, returning a node-set containing the resulting strings.
Strings (str) - EXSLT
WebEXSLTstr
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the exslt strings package provides functions that allow the manipulation of strings.
EXSLT
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes exslt is a set of extensions to xslt.
Event reference
mozbrowsermanifestchange firefox os browser api-specific sent when the path to the app manifest changes, in the case of a browser <iframe> with an open web app embedded in it.
Cross-browser audio basics - Developer guides
src contains the path to the audio file to be loaded (relative or absolute).
Audio and Video Delivery - Developer guides
note that just setting the src attribute to an empty string will actually cause the browser to treat it as though you're setting a video source to a relative path.
Separate sites for mobile and desktop - Developer guides
examples most of the major web applications you see in the wild have chosen this path, including facebook, youtube, digg, and flickr.
Parsing and serializing XML - Developer guides
xpath a technology for creating strings that contain addresses for specific portions of an xml document, and locating xml nodes based on those addresses.
Printing - Developer guides
<link href="/path/to/print.css" media="print" rel="stylesheet" /> using media queries to improve layout detecting print requests some browsers (including firefox 6 and later and internet explorer) send beforeprint and afterprint events to let content determine when printing may have occurred.
<audio>: The Embed Audio element - HTML: Hypertext Markup Language
WebHTMLElementaudio
in a similar manner to the <img> element, we include a path to the media we want to embed inside the src attribute; we can include other attributes to specify information such as whether we want it to autoplay and loop, whether we want to show the browser's default audio controls, etc.
<blockquote>: The Block Quotation element - HTML: Hypertext Markup Language
the connection topology is limited to a single point-to-point path for each carrier, used with standard carriers, but many carriers can be used without significant interference with each other, outside of early spring.
<button>: The Button element - HTML: Hypertext Markup Language
WebHTMLElementbutton
example <button name="favorite"> <svg aria-hidden="true" viewbox="0 0 10 10"><path d="m7 9l5 8 3 9v6l1 4h3l1-3 1 3h3l7 6z"/></svg> add to favorites </button> if you want to visually hide the button's text, an accessible way to do so is to use a combination of css properties to remove it visually from the screen, but keep it parseable by assistive technology.
<del>: The Deleted Text element - HTML: Hypertext Markup Language
WebHTMLElementdel
del::before, del::after { clip-path: inset(100%); clip: rect(1px, 1px, 1px, 1px); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; } del::before { content: " [deletion start] "; } del::after { content: " [deletion end] "; } some people who use screen readers deliberately disable announcing content that creates extra verbosity.
<input type="button"> - HTML: Hypertext Markup Language
WebHTMLElementinputbutton
document.documentelement.scrolltop : document.body.scrolltop); } canvas.onmousedown = function() { pressed = true; }; canvas.onmouseup = function() { pressed = false; } clearbtn.onclick = function() { ctx.fillstyle = 'rgb(0,0,0)'; ctx.fillrect(0,0,width,height); } function draw() { if(pressed) { ctx.fillstyle = colorpicker.value; ctx.beginpath(); ctx.arc(curx, cury-85, sizepicker.value, degtorad(0), degtorad(360), false); ctx.fill(); } requestanimationframe(draw); } draw(); specifications specification status comments html living standardthe definition of '<input type="button">' in that specification.
<ins> - HTML: Hypertext Markup Language
WebHTMLElementins
ins::before, ins::after { clip-path: inset(100%); clip: rect(1px, 1px, 1px, 1px); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; } ins::before { content: " [insertion start] "; } ins::after { content: " [insertion end] "; } some people who use screen readers deliberately disable announcing content that creates extra verbosity.
<mark>: The Mark Text element - HTML: Hypertext Markup Language
WebHTMLElementmark
mark::before, mark::after { clip-path: inset(100%); clip: rect(1px, 1px, 1px, 1px); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; } mark::before { content: " [highlight start] "; } mark::after { content: " [highlight end] "; } some people who use screen readers deliberately disable announcing content that creates extra verbosity.
<object> - HTML: Hypertext Markup Language
WebHTMLElementobject
codebasehtml 4 onlyobsolete since html5 the base path used to resolve relative uris specified by classid, data, or archive.
<s> - HTML: Hypertext Markup Language
WebHTMLElements
s::before, s::after { clip-path: inset(100%); clip: rect(1px, 1px, 1px, 1px); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; } s::before { content: " [start of stricken text] "; } s::after { content: " [end of stricken text] "; } some people who use screen readers deliberately disable announcing content that creates extra verbosity.
<video>: The Video Embed element - HTML: Hypertext Markup Language
WebHTMLElementvideo
in a similar manner to the <img> element, we include a path to the media we want to display inside the src attribute; we can include other attributes to specify information such as video width and height, whether we want it to autoplay and loop, whether we want to show the browser's default video controls, etc.
Preloading content with rel="preload" - HTML: Hypertext Markup Language
you will also need to specify: the path to the resource in the href attribute.
Using the application cache - HTML: Hypertext Markup Language
the cache manifest file referencing a cache manifest file the manifest attribute in a web application can specify either the relative path of a cache manifest file or an absolute url.
HTTP authentication - HTTP
the .htaccess file typically looks like this: authtype basic authname "access to the staging site" authuserfile /path/to/.htpasswd require valid-user the .htaccess file references a .htpasswd file in which each line consists of a username and a password separated by a colon (:).
Evolution of HTTP - HTTP
http/0.9 is extremely simple: requests consist of a single line and start with the only possible method get followed by the path to the resource (not the url as both the protocol, server, and port are unnecessary once connected to the server).
Browser detection using the user agent - HTTP
support could have been added to other browsers at any time, but this code would have continued choosing the inferior path.
Cross-Origin Resource Sharing (CORS) - HTTP
WebHTTPCORS
it does not include any path information, but only the server name.
Compression in HTTP - HTTP
hop-by-hop compression hop-by-hop compression, though similar to end-to-end compression, differs by one fundamental element: the compression doesn't happen on the resource in the server, creating a specific representation that is then transmitted, but on the body of the message between any two nodes on the path between the client and the server.
Content-Disposition - HTTP
the filename is always optional and must not be used blindly by the application: path information should be stripped, and conversion to the server file system rules should be done.
CSP: referrer - HTTP
this policy will leak origins and paths from tls-protected resources to insecure origins.
Forwarded - HTTP
the forwarded header contains information from the reverse proxy servers that is altered or lost when a proxy is involved in the path of the request.
Set-Cookie2 - HTTP
yntax set-cookie2: <cookie-name>=<cookie-value> set-cookie2: <cookie-name>=<cookie-value>; comment=<value> set-cookie2: <cookie-name>=<cookie-value>; commenturl=<http-url> set-cookie2: <cookie-name>=<cookie-value>; discard set-cookie2: <cookie-name>=<cookie-value>; domain=<domain-value> set-cookie2: <cookie-name>=<cookie-value>; max-age=<non-zero-digit> set-cookie2: <cookie-name>=<cookie-value>; path=<path-value> set-cookie2: <cookie-name>=<cookie-value>; port=<port-number> set-cookie2: <cookie-name>=<cookie-value>; secure set-cookie2: <cookie-name>=<cookie-value>; version=<version-number> // multiple directives are also possible, for example: set-cookie2: <cookie-name>=<cookie-value>; domain=<domain-value>; secure // multiple cookies are seperated by a comma set-cookie2: <cookie-name>=<coo...
SourceMap - HTTP
examples sourcemap: /path/to/file.js.map specifications specification title draft document source map revision 3 proposal ...
TRACE - HTTP
WebHTTPMethodsTRACE
the http trace method performs a message loop-back test along the path to the target resource, providing a useful debugging mechanism.
HTTP request methods - HTTP
WebHTTPMethods
trace the trace method performs a message loop-back test along the path to the target resource.
An overview of HTTP - HTTP
WebHTTPOverview
the path of the resource to fetch; the url of the resource stripped from elements that are obvious from the context, for example without the protocol (http://), the domain (here, developer.mozilla.org), or the tcp port (here, 80).
Proxy servers and tunneling - HTTP
a common way to disclose this information is by using the following http headers: the standardized header: forwarded contains information from the client-facing side of proxy servers that is altered or lost when a proxy is involved in the path of the request.
A typical HTTP session - HTTP
WebHTTPSession
a client request consists of text directives, separated by crlf (carriage return, followed by line feed), divided into three blocks: the first line contains a request method followed by its parameters: the path of the document, i.e.
HTTP
WebHTTP
the cookie can also be set to expire on a certain date, or restricted to a specific domain and path.
Warning: -file- is being assigned a //# sourceMappingURL, but already has one - JavaScript
examples setting source maps setting a source map by using a comment in the file: //# sourcemappingurl=http://example.com/path/to/your/sourcemap.map or, alternatively, you can set a header to your javascript file: x-sourcemap: /path/to/file.js.map ...
Array.prototype.indexOf() - JavaScript
fast-path it.
Error - JavaScript
error.prototype.filename a non-standard mozilla property for the path to the file that raised this error.
EvalError - JavaScript
evalerror.prototype.filename path to file that raised this error.
InternalError - JavaScript
internalerror.prototype.filename path to file that raised this error.
Object.freeze() - JavaScript
an enhancement to deepfreeze() would be to have an internal function that receives a path (e.g.
RangeError - JavaScript
rangeerror.prototype.filename path to file that raised this error.
ReferenceError - JavaScript
referenceerror.prototype.filename path to file that raised this error.
SyntaxError - JavaScript
syntaxerror.prototype.filename path to file that raised this error.
TypeError - JavaScript
typeerror.prototype.filename path to file that raised this error.
URIError - JavaScript
urierror.prototype.filename path to file that raised this error.
WebAssembly.CompileError - JavaScript
webassembly.compileerror.prototype.filename path to file that raised this error.
WebAssembly.LinkError - JavaScript
webassembly.linkerror.prototype.filename path to file that raised this error.
WebAssembly.RuntimeError - JavaScript
webassembly.runtimeerror.prototype.filename path to file that raised this error.
encodeURI() - JavaScript
note how certain characters are used to signify special meaning: http://username:password@www.example.com:80/path/to/file.php?foo=316&bar=this+has+spaces#anchor hence encodeuri() does not encode characters that are necessary to formulate a complete uri.
Lexical grammar - JavaScript
the hashbang comment specifies the path to a specific javascript interpreter that you want to use to execute the script.
Destructuring assignment - JavaScript
function parseprotocol(url) { const parsedurl = /^(\w+)\:\/\/([^\/]+)\/(.*)$/.exec(url); if (!parsedurl) { return false; } console.log(parsedurl); // ["https://developer.mozilla.org/web/javascript", "https", "developer.mozilla.org", "en-us/web/javascript"] const [, protocol, fullhost, fullpath] = parsedurl; return protocol; } console.log(parseprotocol('https://developer.mozilla.org/web/javascript')); // "https" object destructuring basic assignment const user = { id: 42, is_verified: true }; const {id, is_verified} = user; console.log(id); // 42 console.log(is_verified); // true assignment without declaration a variable can be assigned its value with destructuring s...
yield - JavaScript
between the generator's code path, its yield operators, and the ability to specify a new starting value by passing it to generator.prototype.next(), generators offer enormous power and control.
import.meta - JavaScript
such file-specific argument passing may be complementary to that used in the application-wide location.href (with query strings or hash added after the html file path) (or on node.js, through process.argv).
iarc_rating_id - Web app manifests
note: the same code can be shared across multiple participating storefronts, as long as the distributed product remains the same (i.e., doesn’t serve totally different code paths on different storefronts).
icons - Web app manifests
src the path to the image file.
<semantics> - MathML
up> <mo>+</mo> <mi>y</mi> </mrow> <!-- content mathml --> <annotation-xml encoding="mathml-content"> <apply> <plus/> <apply> <power/> <ci>x</ci> <cn type="integer">2</cn> </apply> <ci>y</ci> </apply> </annotation-xml> <!-- annotate an image --> <annotation encoding="image/png" src="some/path/formula.png"/> <!-- annotate tex --> <annotation encoding="application/x-tex"> x^{2} + y </annotation> </semantics> </math> specifications specification status comment mathml 3.0the definition of 'mixing markup languages for mathematical expressions' in that specification.
Recommended Web Performance Timings: How long is too long? - Web Performance
as noted in the description of the critical rendering path, when received, browsers immediately start processing the html, rendering the content as it is received rather than waiting for additional assets to load.
Optimizing startup performance - Web Performance
don't include scripts or stylesheets that don't participate in the critical path in your startup html file.
Performance Monitoring: RUM vs synthetic monitoring - Web Performance
synthetic monitoring involves deploying scripts to simulate the path an end user might take through a web application, reporting back the performance the simulator experiences.
Add to Home screen - Progressive web apps (PWAs)
start_url: provides a path to the asset that should be loaded when the added-to-home screen app is launched.
How to make PWAs installable - Progressive web apps (PWAs)
it contains useful information, such as the app’s title, paths to different-sized icons that can be used to represent the app on an os (such as an icon on the home screen, an entry in the start menu, or an icon on the desktop), and a background color to use in loading or splash screens.
baseline-shift - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following four elements: <altglyph>, <textpath>, <tref>, and <tspan> usage notes value <length-percentage> | sub | super default value 0 animatable yes sub the dominant-baseline is shifted to the default position for subscripts.
color-interpolation - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it only has an effect on the following 29 elements: <a>, <animate>, <animatecolor>, <circle>, <clippath>, <defs>, <ellipse>, <foreignobject>, <g>, <glyph>, <image>, <line>, <lineargradient>, <marker>, <mask>, <missing-glyph>, <path>, <pattern>, <polygon>, <polyline>, <radialgradient>, <rect>, <svg>, <switch>, <symbol>, <text>, <textpath>, <tspan>, and <use> usage notes value auto | srgb | linearrgb default value srgb animatable yes auto indicates that...
color-rendering - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it only has an effect on the following 29 elements: <a>, <animate>, <animatecolor>, <circle>, <clippath>, <defs>, <ellipse>, <foreignobject>, <g>, <glyph>, <image>, <line>, <lineargradient>, <marker>, <mask>, <missing-glyph>, <path>, <pattern>, <polygon>, <polyline>, <radialgradient>, <rect>, <svg>, <switch>, <symbol>, <text>, <textpath>, <tspan>, and <use> html, body, svg { height: 100%; } <svg viewbox="0 0 480 200" xmlns="http://www.w3.org/2000/svg"> <defs> <radialgradient id="gradie...
direction - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it only has effect on shapes and text context elements, including: <altglyph>, <textpath>, <text>, <tref>, and <tspan>.
fill-opacity - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following eleven elements: <altglyph>, <circle>, <ellipse>, <path>, <polygon>, <polyline>, <rect>, <text>, <textpath>, <tref>, and <tspan> html,body,svg { height:100% } <svg viewbox="0 0 400 100" xmlns="http://www.w3.org/2000/svg"> <!-- default fill opacity: 1 --> <circle cx="50" cy="50" r="40" /> <!-- fill opacity as a number --> <circle cx="150" cy="50" r="40" fill-opacity="0.7" /> <!-- fill opacity as a percentage --> <circle cx="250" cy="50" r="4...
font-family - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following eight elements: <altglyph>, <text>, <textpath>, <tref>, and <tspan> html, body, svg { height: 100%; } <svg viewbox="0 0 200 30" xmlns="http://www.w3.org/2000/svg"> <text y="20" font-family="arial, helvetica, sans-serif">sans serif</text> <text x="100" y="20" font-family="monospace">monospace</text> </svg> usage notes value [ <family-name> | <generic-family> ]#where <family-name> = <string> | <custom-ident>+<generi...
font-size-adjust - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following eight elements: <altglyph>, <text>, <textpath>, <tref>, and <tspan> html, body, svg { height: 100%; } <svg width="600" height="80" viewbox="0 0 500 80" xmlns="http://www.w3.org/2000/svg"> <text y="20" font-family="times, serif" font-size="10px"> this text uses the times font (10px), which is hard to read in small sizes.
font-size - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following eight elements: <altglyph>, <text>, <textpath>, <tref>, and <tspan> html, body, svg { height: 100%; } <svg viewbox="0 0 200 30" xmlns="http://www.w3.org/2000/svg"> <text y="20" font-size="smaller">smaller</text> <text x="100" y="20" font-size="2em">2em</text> </svg> usage notes value <absolute-size> | <relative-size> | <length-percentage> default value medium animatable yes for a des...
font-stretch - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following eight elements: <altglyph>, <text>, <textpath>, <tref>, and <tspan> usage notes value <font-stretch-absolute>where <font-stretch-absolute> = normal | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded | <percentage> default value normal animatable yes specifications specification status comment cs...
font-style - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but only has an effect on the following five elements: <altglyph>, <text>, <textpath>, <tref>, and <tspan> html, body, svg { height: 100%; } <svg viewbox="0 0 250 30" xmlns="http://www.w3.org/2000/svg"> <text y="20" font-style="normal">normal font style</text> <text x="150" y="20" font-style="italic">italic font style</text> </svg> usage notes value normal | italic | oblique default value normal animatable yes for a description of the...
font-variant - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following eight elements: <altglyph>, <text>, <textpath>, <tref>, and <tspan> html, body, svg { height: 100%; } <svg viewbox="0 0 250 30" xmlns="http://www.w3.org/2000/svg"> <text y="20" font-variant="normal">normal text</text> <text x="100" y="20" font-variant="small-caps">small-caps text</text> </svg> usage notes value normal | none | [ <common-lig-values> || <discretionary-lig-values> || <historical-lig-values> || <context...
font-weight - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following eight elements: <altglyph>, <text>, <textpath>, <tref>, and <tspan> html, body, svg { height: 100%; } <svg viewbox="0 0 200 30" xmlns="http://www.w3.org/2000/svg"> <text y="20" font-weight="normal">normal text</text> <text x="100" y="20" font-weight="bold">bold text</text> </svg> usage notes value normal | bold | bolder | lighter | <number> default value normal animatable yes for a d...
glyph-orientation-horizontal - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following five elements: <altglyph>, <textpath>, <text>, <tref>, and <tspan> context notes value <angle> default value 0deg animatable no <angle> the value of the angle is restricted to 0, 90, 180, and 270 degrees.
glyph-orientation-vertical - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following five elements: <altglyph>, <textpath>, <text>, <tref>, and <tspan> context notes value auto | <angle> default value auto animatable no auto fullwidth ideographic and fullwidth latin text will be set with a glyph orientation of 0 degrees.
kerning - SVG: Scalable Vector Graphics
WebSVGAttributekerning
as a presentation attribute, it can be applied to any element but it has effect only on the following four elements: <altglyph>, <textpath>, <text>, <tref>, and <tspan> html, body, svg { height: 100%; font: 36px verdana, helvetica, arial, sans-serif; } <svg viewbox="0 0 150 125" xmlns="http://www.w3.org/2000/svg"> <text x="10" y="30" kerning="auto">auto</text> <text x="10" y="70" kerning="0">number</text> <text x="10" y="110" kerning="20px">length</text> </svg> usage notes value auto | <length> ...
lengthAdjust - SVG: Scalable Vector Graphics
four elements are using this attribute: <text>, <textpath>, <tref>, and <tspan> html, body, svg { height: 100%; } <svg width="300" height="150" xmlns="http://www.w3.org/2000/svg"> <g font-face="sans-serif"> <text x="0" y="20" textlength="300" lengthadjust="spacing"> stretched using spacing only.
letter-spacing - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following eight elements: <altglyph>, <text>, <textpath>, <tref>, and <tspan> html, body, svg { height: 100%; } <svg viewbox="0 0 400 30" xmlns="http://www.w3.org/2000/svg"> <text y="20" letter-spacing="2">bigger letter-spacing</text> <text x="200" y="20" letter-spacing="-0.5">smaller letter-spacing</text> </svg> usage notes value normal | <length> default value normal animatable yes for a des...
mask - SVG: Scalable Vector Graphics
WebSVGAttributemask
as a presentation attribute, it can be applied to any element but it has noticeable effects mostly on the following nineteen elements: <a>, <circle>, <clippath>, <ellipse>, <g>, <glyph>, <image>, <line>, <marker>, <mask>, <path>, <pattern>, <polygon>, <polyline>, <rect>, <svg>, <symbol>, <text>, <use> usage notes value see the css property mask default value none animatable yes specifications specification status comment css masking module level 1the definition of 'mask' in that s...
onclick - SVG: Scalable Vector Graphics
WebSVGAttributeonclick
thirty-seven elements are using this attribute: <a>, <altglyph>, <animate>, <animatemotion>, <animatetransform>, <circle>, <defs>, <desc>, <ellipse>, <foreignobject>, <g>, <image>, <line>, <lineargradient>, <marker>, <metadata>, <mpath>, <path>, <pattern>, <polygon>, <polyline>, <radialgradient>, <rect>, <script>, <set>, <stop>, <style>, <svg>, <switch>, <symbol>, <text>, <textpath>, <title>, <tref>, <tspan>, <use>, <view> html, body, svg { height: 100%; margin: 0; } <svg viewbox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"> <circle cx="100" cy="100" r="100" onclick="alert('you have clicked the circle.')" /> </svg> usage notes value <anything> default value none ...
opacity - SVG: Scalable Vector Graphics
WebSVGAttributeopacity
as a presentation attribute, it can be applied to any element but it has effect only on the following elements: <a>, <audio>, <canvas>, <circle>, <ellipse>, <foreignobject>, <g>, <iframe>, <image>, <line>, <marker>, <path>, <polygon>, <polyline>, <rect>, <svg>, <switch>, <symbol>, <text>, <textpath>, <tspan>, <use>, <unknown>, and <video> html, body, svg { height: 100%; } <svg viewbox="0 0 200 100" xmlns="http://www.w3.org/2000/svg"> <defs> <lineargradient id="gradient" x1="0%" y1="0%" x2="0" y2="100%"> <stop offset="0%" style="stop-color:skyblue;" /> <stop offset="100%" style="stop-color:...
paint-order - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following ten elements: <circle>, <ellipse>, <line>, <path>, <polygon>, <polyline>, <rect>, <text>, <textpath>, and <tspan> usage notes value normal | [ fill || stroke || markers ] default value normal animatable yes normal this value indicates that the fill will be painted first, then the stroke, and finally the markers.
pointer-events - SVG: Scalable Vector Graphics
ound(math.random() * 0xffffff) // let's format the color to fit css requirements const fill = '#' + color.tostring(16).padstart(6,'0') // let's apply our color in the // element we actually clicked on e.target.style.fill = fill }) as a presentation attribute, it can be applied to any element but it is mostly relevant only on the following twenty-three elements: <a>, <circle>, <clippath>, <defs>, <ellipse>, <foreignobject>, <g>, <image>, <line>, <marker>, <mask>, <path>, <pattern>, <polygon>, <polyline>, <rect>, <svg>, <switch>, <symbol>, <text>, <textpath>, <tspan>, <use> usage notes value bounding-box | visiblepainted | visiblefill | visiblestroke | visible | painted | fill | stroke | all | none default value visiblepainted animatable yes ...
stroke-dasharray - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element, but it only has effect on the following twelve elements: <altglyph> <circle> <ellipse> <path> <line> <polygon> <polyline> <rect> <text> <textpath> <tref> <tspan> html,body,svg { height:100% } <svg viewbox="0 0 30 10" xmlns="http://www.w3.org/2000/svg"> <!-- no dashes nor gaps --> <line x1="0" y1="1" x2="30" y2="1" stroke="black" /> <!-- dashes and gaps of the same size --> <line x1="0" y1="3" x2="30" y2="3" stroke="black" stroke-dasharray="4" /> <!-- dashes and gaps...
stroke-opacity - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following twelve elements: <altglyph>, <circle>, <ellipse>, <path>, <line>, <polygon>, <polyline>, <rect>, <text>, <textpath>, <tref>, and <tspan> html,body,svg { height:100% } <svg viewbox="0 0 40 10" xmlns="http://www.w3.org/2000/svg"> <!-- default stroke opacity: 1 --> <circle cx="5" cy="5" r="4" stroke="green" /> <!-- stroke opacity as a number --> <circle cx="15" cy="5" r="4" stroke="green" stroke-opacity="0.7" /> <!-- stroke opa...
stroke-width - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it only has effect on shapes and text context elements, including: <altglyph>, <circle>, <ellipse>, <line>, <path>, <polygon>, <polyline>, <rect>, <text>, <textpath>, <tref>, and <tspan> html,body,svg { height:100% } <svg viewbox="0 0 30 10" xmlns="http://www.w3.org/2000/svg"> <!-- default stroke width: 1 --> <circle cx="5" cy="5" r="3" stroke="green" /> <!-- stroke width as a number --> <circle cx="15" cy="5" r="3" stroke="green" stroke-width="3" /> <!-- stroke width as a percentage --> <circle cx="25" cy="5" r="3" stroke="green" stroke-width="2%" /> </svg> usage notes ...
stroke - SVG: Scalable Vector Graphics
WebSVGAttributestroke
as a presentation attribute, it can be applied to any element but it has effect only on the following twelve elements: <altglyph>, <circle>, <ellipse>, <line>, <path>, <polygon>, <polyline>, <rect>, <text>, <textpath>, <tref>, and <tspan> html,body,svg { height:100% } <svg viewbox="0 0 20 10" xmlns="http://www.w3.org/2000/svg"> <!-- simple color stroke --> <circle cx="5" cy="5" r="4" fill="none" stroke="green" /> <!-- stroke a circle with a gradient --> <defs> <lineargradient id="mygradient"> <stop offset="0%" stop-color="gr...
systemLanguage - SVG: Scalable Vector Graphics
35 elements are using this attribute: <a>, <altglyph>, <animate>, <animatecolor>, <animatemotion>, <animatetransform>, <audio>, <canvas>, <circle>, <clippath>, <cursor>, <defs>, <discard>, <ellipse>, <foreignobject>, <g>, <iframe>, <image>, <line>, <mask>, <path>, <pattern>, <polygon>, <polyline>, <rect>, <set>, <svg>, <switch>, <text>, <textpath>, <tref>, <tspan>, <unknown>, <use>, and <video> usage notes value <language-tags> default value none animatable no <language-tags> the value is a set of comma-separated tokens, each of which must be a language-tag value, as defined in bcp 47.
text-decoration - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following five elements: <altglyph>, <text>, <textpath>, <tref>, and <tspan> html, body, svg { height: 100%; } <svg viewbox="0 0 250 50" xmlns="http://www.w3.org/2000/svg"> <text y="20" text-decoration="underline">underlined text</text> <text x="0" y="40" text-decoration="line-through">struck-through text</text> </svg> usage notes value <'text-decoration-line'> || <'text-decoration-style'> || <'text-decoration-color'> ...
text-rendering - SVG: Scalable Vector Graphics
this option will usually cause the user agent to suspend the use of hinting so that glyph outlines are drawn with comparable geometric precision to the rendering of path data.
textLength - SVG: Scalable Vector Graphics
four elements are using this attribute: <text>, <textpath>, <tref>, and <tspan> html, body, svg { height: 100%; } <svg viewbox="0 0 200 60" xmlns="http://www.w3.org/2000/svg"> <text y="20" textlength="6em">small text length</text> <text y="40" textlength="120%">big text length</text> </svg> usage notes value <length-percentage> | <number> default value none animatable yes <length-percentage> ...
unicode-bidi - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following eleven elements: <altglyph>, <textpath>, <text>, <tref>, and <tspan> context notes value normal | embed | isolate | bidi-override | isolate-override | plaintext default value normal animatable no for a description of the values, please refer to the css unicode-bidi property.
word-spacing - SVG: Scalable Vector Graphics
as a presentation attribute, it can be applied to any element but it has effect only on the following five elements: <altglyph>, <text>, <textpath>, <tref>, and <tspan> html, body, svg { height: 100%; } <svg viewbox="0 0 250 50" xmlns="http://www.w3.org/2000/svg"> <text y="20" word-spacing="2">bigger spacing between words</text> <text x="0" y="40" word-spacing="-0.5">smaller spacing between words</text> </svg> usage notes value normal | <length> animatable yes default values normal ...
xlink:arcrole - SVG: Scalable Vector Graphics
sent a "person," but in the context of a particular arc it might have the role of "mother" and in the context of a different arc it might have the role of "daughter." twentytwo elements are using this attribute: <a>, <altglyph>, <animate>, <animatecolor>, <animatemotion>, <animatetransform>, <color-profile>, <cursor>, <feimage>, <filter>, <font-face-uri>, <glyphref>, <image>, <lineargradient>, <mpath>, <pattern>, <radialgradient>, <script>, <set>, <textpath>, <tref>, <use> usage notes value <iri> default value none animatable no <iri> this value specifies an iri reference that identifies some resource that describes the intended property.
xlink:type - SVG: Scalable Vector Graphics
twentytwo elements are using this attribute: <a>, <altglyph>, <animate>, <animatecolor>, <animatemotion>, <animatetransform>, <color-profile>, <cursor>, <feimage>, <filter>, <font-face-uri>, <glyphref>, <image>, <lineargradient>, <mpath>, <pattern>, <radialgradient>, <script>, <set>, <textpath>, <tref>, and <use> usage notes value simple default value simple animatable no simple this value specifies that the referred resource is a simple link.
<altGlyph> - SVG: Scalable Vector Graphics
WebSVGElementaltGlyph
value type: <iri> ; default value: none; animatable: no global attributes core attributes most notably: id lang styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, document element event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, dominant-baseline, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, text-anchor, transform, vector-effect, visibility xlink attributes xlink:href, xlink:type,...
<feComposite> - SVG: Scalable Vector Graphics
%"> <fecomposite in="sourcegraphic" in2="backgroundimage" operator="xor" result="comp"/> </filter> <filter id="arithmeticnoflood" filterunits="objectboundingbox" x="-5%" y="-5%" width="110%" height="110%"> <fecomposite in="sourcegraphic" in2="backgroundimage" result="comp" operator="arithmetic" k1=".5" k2=".5" k3=".5" k4=".5"/> </filter> <path id="blue100" d="m 0 0 l 100 0 l 100 100 z" fill="#00ffff" /> <path id="red100" d="m 0 0 l 0 100 l 100 0 z" fill="#ff00ff" /> <path id="blue50" d="m 0 125 l 100 125 l 100 225 z" fill="#00ffff" fill-opacity=".5" /> <path id="red50" d="m 0 125 l 0 225 l 100 125 z" fill="#ff00ff" fill-opacity=".5" /> <g id="twobluetriangles"> <use xlink:href="#blue100"/> <use xlink:href="#...
<foreignObject> - SVG: Scalable Vector Graphics
global attributes core attributes most notably: id, tabindex styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes, document event attributes, document element event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, a...
<linearGradient> - SVG: Scalable Vector Graphics
value type: <length> ; default value: 0%; animatable: yes global attributes core attributes most notably: id styling attributes class, style event attributes global event attributes, document element event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility xlink attributes xlink:href, xlink:title usage notes categoriesgradie...
<missing-glyph> - SVG: Scalable Vector Graphics
usage context categoriesnonepermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> attributes global attributes core attributes presentation attributes class style specific attributes d horiz-adv-x vert-origin-x vert-origin-y vert-adv-y dom interface this element implements the svgmissingglyphelement interface.
<radialGradient> - SVG: Scalable Vector Graphics
value type: <iri> ; default value: none; animatable: yes global attributes core attributes most notably: id styling attributes class, style event attributes global event attributes, document element event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility xlink attributes xlink:href, xlink:title usage notes categoriesgradie...
<tspan> - SVG: Scalable Vector Graphics
WebSVGElementtspan
value type: <length>|<percentage> ; default value: none; animatable: yes global attributes core attributes most notably: id, tabindex styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, dominant-baseline, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, text-anchor, transform, vector-effect, visibility aria attributes aria-activedescendant, a...
<use> - SVG: Scalable Vector Graphics
WebSVGElementuse
global attributes core attributes most notably: id, tabindex styling attributes class, style conditional processing attributes most notably: requiredextensions, systemlanguage event attributes global event attributes, graphical event attributes presentation attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, a...
Filter effects - SVG: Scalable Vector Graphics
ult="specout"/> <fecomposite in="sourcegraphic" in2="specout" operator="arithmetic" k1="0" k2="1" k3="1" k4="0" result="litpaint"/> <!-- merge offsetblur + litpaint --> <femerge> <femergenode in="offsetblur"/> <femergenode in="litpaint"/> </femerge> </filter> </defs> <!-- graphic elements --> <g filter="url(#myfilter)"> <path fill="none" stroke="#d90000" stroke-width="10" d="m50,66 c-50,0 -50,-60 0,-60 h100 c50,0 50,60 0,60z" /> <path fill="#d90000" d="m60,56 c-30,0 -30,-40 0,-40 h80 c30,0 30,40 0,40z" /> <g fill="#ffffff" stroke="black" font-size="45" font-family="verdana" > <text x="52" y="52">svg</text> </g> </g> </svg> step 1 <fegaussianblur in="sourcealpha"...
SVG Tutorial - SVG: Scalable Vector Graphics
WebSVGTutorial
introducing svg from scratch introduction getting started positions basic shapes paths fills and strokes gradients patterns texts basic transformations clipping and masking other content in svg filter effects svg fonts svg image tag tools for svg svg and css the following topics are more advanced and hence should get their own tutorials.
How to fix a website with blocked mixed content - Web security
however, in some cases, the path may just be incorrect to the media in question.
Tutorials
this module provides a gentle beginning to your path towards css mastery with the basics of how it works, what the syntax looks like, and how you can start using it to add styling to html.
Web Components
event.composedpath: returns the event’s path (objects on which listeners will be invoked).
xml:base - XML: Extensible Markup Language
WebXMLxml:base
<html> <head> <base href="https://mydomain.com"> <style> .link { stroke: #999; stroke-opacity: .6; } marker#arrow { fill: black; } </style> </head> <body> <svg width="100%" height="100%" xml:base=""> <defs> <marker id="arrow" viewbox="0 -5 10 10" refx="0" refy="0" markerwidth="20" markerheight="20" orient="auto"> <path d="m0,-5l10,0l0,5"></path> </marker> </defs> <line x1="100" y1="100" x2="333" y2="333" marker-start="url(#arrow)" class="link"></line> </svg> </body> </html> imagine a svg with font references.
Common XSLT Errors - XSLT: Extensible Stylesheet Language Transformations
specifically: the namespace:: axis in xpath expressions.
<xsl:apply-imports> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:apply-imports> element is fairly arcane, used mostly in complex stylesheets.
<xsl:attribute-set> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:attribute-set> element creates a named set of attributes, which can then be applied as whole to the output document, in a manner similar to named styles in css.
<xsl:attribute> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:attribute> element creates an attribute in the output document, using any values that can be accessed from the stylesheet.
<xsl:call-template> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:call-template> element invokes a named template.
<xsl:choose> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementchoose
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:choose> element defines a choice among a number of alternatives.
<xsl:comment> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementcomment
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:comment> element writes a comment to the output document.
<xsl:copy> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementcopy
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:copy> element transfers a shallow copy (the node and any associated namespace node) of the current node to the output document.
<xsl:decimal-format> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:decimal-format> element defines the characters and symbols that are to be used in converting numbers into strings using theformat-number( ) function.
<xsl:element> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementelement
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:element> element creates an element in the output document.
<xsl:fallback> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementfallback
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:fallback> element specifies what template to use if a given extension (or, eventually, newer version) element is not supported.
<xsl:import> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementimport
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:import> element is a top-level element that serves to import the contents of one stylesheet into another stylesheet.
<xsl:include> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementinclude
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:include> element merges the contents of one stylesheet with another.
<xsl:message> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementmessage
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:message> element outputs a message (to the javascript console in ns) and optionally terminates execution of the stylesheet.
<xsl:namespace-alias> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:namespace-alias> element is a rarely used device that maps a namespace in the stylesheet to a different namespace in the output tree.
<xsl:otherwise> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:otherwise> element is used to define the action that should be taken when none of the <xsl:when> conditions apply.
<xsl:output> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementoutput
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:output> element controls the characteristics of the output document.
<xsl:preserve-space> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:preserve-space> element defines the elements in the source document for which whitespace should be preserved.
<xsl:processing-instruction> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:processing-instruction> element writes a processing instruction to the output document.
<xsl:strip-space> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:strip-space> element defines the elements in the source document for which whitespace should be removed.
<xsl:template> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementtemplate
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:template> element defines an output producing template.
<xsl:text> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementtext
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:text> element writes literal text to the output tree.
<xsl:transform> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:transform> element is exactly equivalent to the <xsl:stylesheet> element.
<xsl:when> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementwhen
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:when> element always appears within an <xsl:choose> element, acting like a case statement.
For Further Reading - XSLT: Extensible Stylesheet Language Transformations
http://www.amazon.com/gp/product/0596004206 digital websites world wide web consortium the w3c homepage: http://www.w3.org/ the main xsl page: http://www.w3.org/style/xsl/ the version 1.0 recommendation for xslt: http://www.w3.org/tr/xslt archive of public style (css and xslt) discussions: http://lists.w3.org/archives/public/www-style/ the version 1.0 recommendation for xpath: http://www.w3.org/tr/xpath the world wide web consortium is the body that publishes recommendations for a number of web-based technologies, many of which become the de-facto standard.
Web technology for developers
emos of open web technologiesdeveloper guidesexsltevent referencehtml: hypertext markup languagehttpjavascriptmathmlopensearch description formatprivacy, permissions, and information securityprogressive web apps (pwas)svg: scalable vector graphicstutorialsweb apisweb componentsweb performanceweb app manifestsweb media technologiesweb securityweb technology referencexml: extensible markup languagexpathxslt: extensible stylesheet language transformations ...