Search completed in 1.51 seconds.
Introduction to using XPath in JavaScript - XPath
this document describes the interface for using x
path in javascript internally, in extensions, and from websites.
... mozilla implements a fair amount of the dom 3 x
path, which means that x
path expressions can be run against both html and xml documents.
... the main interface to using x
path is the evaluate function of the document object.
...And 49 more matches
XPath snippets - XPath
this article provides some x
path code snippets—simple examples of how to a few simple utility functions based on standard interfaces from the dom level 3 x
path specification that expose x
path functionality to javascript code.
... node-specific evaluator function the following custom utility function can be used to evaluate x
path expressions on given xml nodes.
... the first argument is a dom node or document object, while the second is a string defining an x
path expression.
...And 15 more matches
Path2D.addPath() - Web APIs
the
path2d.add
path() method of the canvas 2d api adds one
path2d object to another
path2d object.
... syntax void
path.add
path(
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 svg
pathelement.
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 svg
pathelement inherits it.
... syntax var
pathlength = someelement.
pathlength; specifications specification status comment scalable vector graphics (svg) 1.1 (second edition)the definition of 'svg
pathelement.
pathlength' in that specification.
Comparison of CSS Selectors and XPath - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes this article seeks to document the difference between css selectors and x
path for web developers to be able to better choose the right tool for the right job.
... x
path 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
« 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 svg
pathelement 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/svg
pathelement" 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">svg
pathelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} note: in svg 2 the getp...
...athsegatlength() and createsvg
pathseg* 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_close
path = 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
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
found 57 pages: # page tags and summary 1 x
path css selectors, dom, jxon, landing,
path, xml, x
path, xslt x
path stands for xml
path language.
... 2 axes transforming_xml_with_xslt, x
path, x
path_reference, xslt, xslt_reference for further information on using x
path expressions, please see the for further reading section at the end of transforming xml with xslt document.
... also see the 'axes' section in the x
path 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/x
path/nsidomx
pathevaluator.idlscriptable this interface is used to evaluate x
path expressions against a dom node.
... inherits from: nsisupports last changed in gecko 1.7 implemented by: @mozilla.org/dom/x
path-evaluator;1.
... to create an instance, use: var domx
pathevaluator = components.classes["@mozilla.org/dom/x
path-evaluator;1"] .createinstance(components.interfaces.nsidomx
pathevaluator); method overview nsidomx
pathexpression createexpression(in domstring expression, in nsidomx
pathnsresolver resolver) nsidomx
pathnsresolver creatensresolver(in nsidomnode noderesolver); nsisupports evaluate(in domstring expression, in nsidomnode contextnode, in nsidomx
pathnsresolver resolver, in unsigned short type, in nsisupports result) methods createexpression() creates an nsidomx
pathexpression which can then be used for (repeated) evaluations.
...And 14 more matches
Path2D - Web APIs
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/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes x
path stands for xml
path language.
... x
path 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 x
pathexpression, 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.
... x
path 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 svgtext
pathelement interface corresponds to the <text
path> 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/svgtext
pathelement" 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">svgtext
pathelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} constants method t...
...ypes name value description text
path_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 x
pathresult interface represents the results generated by evaluating an x
path expression within the context of a given node.
... since x
path 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 x
pathresult.booleanvalueread only a boolean representing the value of the result if resulttype is boolean_type.
...And 11 more matches
path - SVG: Scalable Vector Graphics
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 <text
path> html, body, svg { height: 100%; } <svg viewbox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"> <
path id="my
path" 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> <text
path 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.
... </text
path> </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
the <clip
path> 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 x
pathevaluator interface executes an x
path expression on the given node or document and returns an x
pathresult.
... syntax x
pathresult x
pathevaluator.evaluate(expression, contextnode, resolver, type, result); parameters expression a domstring representing the x
path expression to be parsed and evaluated.
... resolver optional permits translation of all prefixes, including the xml namespace prefix, within the x
path expression into appropriate namespace uris.
...And 8 more matches
<textPath> - SVG: Scalable Vector Graphics
to render text along the shape of a <
path>, enclose the text in a <text
path> 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="my
path" 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> <text
path href="#my
path"> quick brown fox jumps over the lazy dog.
... </text
path> </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.ispointin
path() method of the canvas 2d api reports whether or not the specified point is contained in the current
path.
... syntax ctx.ispointin
path(x, y [, fillrule]); ctx.ispointin
path(
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 x
pathexpression interface executes an x
path expression on the given node or document and returns an x
pathresult.
... syntax x
pathresult node.evaluate(contextnode, type, result); parameters contextnode a node representing the context to use for evaluating the expression.
...this must be one of the x
pathresult.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>, <clip
path>, <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"> <clip
path id="myclip" clip
pathunits="objectboundingbox"> <circle cx=".5" cy=".5" r=".5" /> </clip
path> <!-- 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 svganimated
pathdata 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 svg
pathseglist animatednormalized
pathseglist svg
pathseglist animated
pathseglist svg
pathseglist normalized
pathseglist svg
pathseglist
pathseglist normative document svg 1.1 (2nd edition) properties this interface also inherits properties from its parent, svg
pathelement.
... name type description animatednormalized
pathseglist svg
pathseglist 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 svg
pathseg types: svg_
pathseg_moveto_abs (m), svg_
pathseg_lineto_abs (l), svg_
pathseg_curveto_cubic_abs (c) and svg_
pathseg_close
path (z).
...And 6 more matches
SVGPathSegList - Web APIs
svg
path segment list interface this interface defines a list of svg
pathseg objects.
... interface overview also implement none methods void clear() svg
pathseg initialize(in svg
pathseg newitem) svg
pathseg getitem(in unsigned long index) svg
pathseg insertitembefore(in svg
pathseg newitem, in unsigned long index) svg
pathseg replaceitem(in svg
pathseg newitem, in unsigned long index) svg
pathseg removeitem(in unsigned long index) svg
pathseg appenditem(in svg
pathseg newitem) properties readonly unsigned long numberofitems normative document svg 1.1 ...
... initialize(in svg
pathseg newitem) svg
pathseg 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
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/x
path/nsidomx
pathexpression.idlscriptable represents a compiled x
path query returned from nsidomx
pathevaluator.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 x
path expression.
... nsisupports evaluate( in nsidomnode contextnode, in unsigned short type, in nsisupports result ); parameters contextnode a dom node to evaluate the x
path expression against.
... type a number that corresponds to one of the type constants of nsidomx
pathresult.
...And 4 more matches
CanvasRenderingContext2D.closePath() - Web APIs
the canvasrenderingcontext2d.close
path() 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.close
path(); 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 composed
path() 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.composed
path(); 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 full
path 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 full
path = filesystementry.full
path; value a usvstring indicating the entry's full
path.
...And 4 more matches
IDBIndex.keyPath - Web APIs
the key
path property of the idbindex interface returns the key
path of the current index.
... syntax var mykey
path = myindex.key
path; 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
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 x
pathexpression which can then be used for (repeated) evaluations of the x
path expression.
... syntax x
pathexpression x
pathevaluator.createexpression(expression, resolver); parameters expression a domstring representing representing the x
path expression to be created.
... resolver optional permits translation of all prefixes, including the xml namespace prefix, within the x
path expression into appropriate namespace uris.
...And 4 more matches
clipPathUnits - SVG: Scalable Vector Graphics
the clip
pathunits attribute indicates which coordinate system to use for the contents of the <clip
path> element.
... only one element is using this attribute: <clip
path> html,body,svg { height:100% } <svg viewbox="0 0 100 100"> <clip
path id="myclip1" clip
pathunits="userspaceonuse"> <circle cx="50" cy="50" r="35" /> </clip
path> <clip
path id="myclip2" clip
pathunits="objectboundingbox"> <circle cx=".5" cy=".5" r=".35" /> </clip
path> <!-- 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> clip
path for <clip
path>, clip
pathunits define the coordinate system in use for the content of the element.
...And 4 more matches
CanvasRenderingContext2D.beginPath() - Web APIs
the canvasrenderingcontext2d.begin
path() 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 key
path read-only property of the idbobjectstore interface returns the key
path of this object store.
... syntax var mykey
path = objectstore.key
path; value any value type.
...after the object store has been created, we log objectstore.key
path to the console.
...And 3 more matches
XPathEvaluator - Web APIs
the x
pathevaluator interface allows to compile and evaluate x
path expressions.
... methods x
pathevaluator.createexpression() creates a parsed x
path expression with resolved namespaces.
... x
pathevaluator.creatensresolver() adapts any dom node to resolve namespaces allowing the x
path 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
the <m
path> 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 svgm
pathelement 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.scroll
pathintoview() method of the canvas 2d api scrolls the current or given
path into view.
... syntax void ctx.scroll
pathintoview(); void ctx.scroll
pathintoview(
path); parameters
path a
path2d
path to use.
... examples using the scroll
pathintoview method this example demonstrates the scroll
pathintoview() method.
...And 2 more matches
SVGClipPathElement - Web APIs
the svgclip
pathelement interface provides access to the properties of <clip
path> 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/svgclip
pathelement" 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">svgclip
pathelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this int...
... svgclip
pathelement.clip
pathunits read only an svganimatedenumeration corresponding to the clip
pathunits attribute of the given <clip
path> element.
...And 2 more matches
SVGPathElement.getPointAtLength() - Web APIs
the svg
pathelement.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 svg
pathelement 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 x
path 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 x
pathevaluator.createexpression().
... methods x
pathexpression.evaluate() evaluates the x
path expression on the given node or document.
...And 2 more matches
XPathResult.iterateNext() - Web APIs
the iteratenext() method of the x
pathresult 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 x
pathresult.
... exceptions type_err in case x
pathresult.resulttype is not unordered_node_iterator_type or ordered_node_iterator_type, an x
pathexception of type type_err is thrown.
...And 2 more matches
XPathResult.resultType - Web APIs
the read-only resulttype property of the x
pathresult interface represents the type of the result, as defined by the type constants.
...this is useful for example, in an x
path expression using the count() function.
...this is useful for example, in an x
path 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
if an x
path expression does not specify an axis, the child axis is understood by default.
... specifications specification status comment x
path 3.1the definition of 'child' in that specification.
... recommendation x
path 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_getlibrary
path(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_setlibrary
path(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/x
path/nsidomx
pathresult.idlscriptable this interface describes an x
path result returned by nsidomx
pathevaluator 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 x
path value.
... constants type constants constant value description any_type 0 used when evaluating an x
path expression; the evaluator will return the most appropriate type.
...see also introduction to using x
path in javascript document object model (dom) level 3 x
path specification nsidomx
pathevaluator document.evaluate nsidomx
pathexception ...
File.webkitRelativePath - Web APIs
the file.webkitrelative
path 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 relative
path = file.webkitrelative
path 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].webkitrelative
path; output.appendchild(item); }; }, false); result specifications specification status comment file and directory entries apithe definition of 'webkitrelative
path' in that specification.
... desktopmobilechromeedgefirefoxinternet exploreroperasafariandroid webviewchrome for androidfirefox for androidopera for androidsafari on iossamsung internetwebkitrelative
pathchrome 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 svgm
pathelement interface corresponds to the <m
path> 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/svgm
pathelement" 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">svgm
pathelement</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 'svgm
pathelement' in that specification.
... scalable vector graphics (svg) 1.1 (second edition)the definition of 'svgm
pathelement' in that specification.
SVGPathElement.getTotalLength() - Web APIs
the svg
pathelement.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 svg
pathelement 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 'svg
pathelement.gettotallength()' in that specification.
XPathEvaluator.createNSResolver() - Web APIs
this method adapts any dom node to resolve namespaces so that an x
path expression can be easily evaluated relative to the context of the node where it appeared within the document.
... syntax x
pathnsresolver x
pathevaluator.creatensresolver(noderesolver); parameters noderesolver a node to be used as a context for namespace resolution.
... return value an x
pathnsresolver 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 x
path specificationthe definition of 'x
pathevaluator.creatensresolver()' in that specification.
XPathException - Web APIs
in the dom x
path api the x
pathexception interface represents exception conditions that can be encountered while performing x
path operations.
... properties x
pathexception.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 x
pathevaluator or contains specialized extension functions or variables not supported by this implementation.
... specifications specification status comment document object model (dom) level 3 x
path specificationthe definition of 'x
pathexception' in that specification.
XPathNSResolver - Web APIs
the x
pathnsresolver interface permits prefix strings in an x
path expression to be properly bound to namespace uri strings.
... the x
pathevaluator interface can construct an implementation of x
pathnsresolver from a node, or the interface may be implemented by any application.
... methods x
pathnsresolver.lookupnamespaceuri() looks up the namespace uri associated to the given namespace prefix.
... specifications specification status comment document object model (dom) level 3 x
path specificationthe definition of 'x
pathnsresolver' in that specification.
XPathResult.booleanValue - Web APIs
the read-only booleanvalue property of the x
pathresult interface returns the boolean value of a result with x
pathresult.resulttype being boolean_type.
... syntax var value = result.booleanvalue; return value the return value is the boolean value of the x
pathresult returned by document.evaluate().
... exceptions type_err in case x
pathresult.resulttype is not boolean_type, an x
pathexception of type type_err is thrown.
... html <div>x
path example</div> <p>text is 'x
path example': <output></output></p> javascript var x
path = "//div/text() = 'x
path example'"; var result = document.evaluate(x
path, document, null, x
pathresult.boolean_type, null); document.queryselector("output").textcontent = result.booleanvalue; result specifications specification status comment document object model (dom) level 3 x
path specificationthe definition of 'x
pathresult.booleanvalue' in that specification.
XPathResult.invalidIteratorState - Web APIs
the read-only invaliditeratorstate property of the x
pathresult interface signifies that the iterator has become invalid.
... it is true if x
pathresult.resulttype is unordered_node_iterator_type or ordered_node_iterator_type and the document has been modified since this result was returned.
... html <div>x
path example</div> <p>iterator state: <output></output></p> javascript var x
path = "//div"; var result = document.evaluate(x
path, document, null, x
pathresult.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 x
path specificationthe definition of 'x
pathresult.invaliditeratorstate' in that specification.
XPathResult.numberValue - Web APIs
the read-only numbervalue property of the x
pathresult interface returns the numeric value of a result with x
pathresult.resulttype being number_type.
... syntax var value = result.numbervalue; return value the return value is the numeric value of the x
pathresult returned by document.evaluate().
... exceptions type_err in case x
pathresult.resulttype is not number_type, an x
pathexception of type type_err is thrown.
... html <div>x
path example</div> <div>number of <div>s: <output></output></div> javascript var x
path = "count(//div)"; var result = document.evaluate(x
path, document, null, x
pathresult.number_type, null); document.queryselector("output").textcontent = result.numbervalue; result specifications specification status comment document object model (dom) level 3 x
path specificationthe definition of 'x
pathresult.numbervalue' in that specification.
XPathResult.singleNodeValue - Web APIs
the read-only singlenodevalue property of the x
pathresult interface returns a node value or null in case no node was matched of a result with x
pathresult.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 x
pathresult returned by document.evaluate().
... exceptions type_err in case x
pathresult.resulttype is not any_unordered_node_type or first_ordered_node_type, an x
pathexception of type type_err is thrown.
... html <div>x
path example</div> <div>tag name of the element having the text content 'x
path example': <output></output></div> javascript var x
path = "//*[text()='x
path example']"; var result = document.evaluate(x
path, document, null, x
pathresult.first_ordered_node_type, null); document.queryselector("output").textcontent = result.singlenodevalue.localname; result specifications specification status comment document object model (dom) level 3 x
path specificationthe definition of 'x
pathresult.singlenodevalue' in that specification.
XPathResult.snapshotItem() - Web APIs
the snapshotitem() method of the x
pathresult 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 x
pathresult.
... exceptions type_err in case x
pathresult.resulttype is not unordered_node_snapshot_type or ordered_node_snapshot_type, an x
pathexception of type type_err is thrown.
... html <div>x
path example</div> <div>tag names of the matched nodes: <output></output></div> javascript var x
path = "//div"; var result = document.evaluate(x
path, document, null, x
pathresult.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 x
path specificationthe definition of 'x
pathresult.snapshotitem()' in that specification.
XPathResult.stringValue - Web APIs
the read-only stringvalue property of the x
pathresult interface returns the string value of a result with x
pathresult.resulttype being string_type.
... syntax var value = result.stringvalue; return value the return value is the string value of the x
pathresult returned by document.evaluate().
... exceptions type_err in case x
pathresult.resulttype is not string_type, an x
pathexception of type type_err is thrown.
... html <div>x
path example</div> <div>text content of the <div> above: <output></output></div> javascript var x
path = "//div/text()"; var result = document.evaluate(x
path, document, null, x
pathresult.string_type, null); document.queryselector("output").textcontent = result.stringvalue; result specifications specification status comment document object model (dom) level 3 x
path specificationthe definition of 'x
pathresult.stringvalue' in that specification.
self - XPath
specifications specification status comment x
path 3.1the definition of 'self' in that specification.
... recommendation x
path 3.0the definition of 'self' in that specification.
... recommendation x
path 2.0the definition of 'self' in that specification.
... recommendation x
path 1.0the definition of 'self' in that specification.
Axes - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes there are thirteen different axes in the x
path specification.
... for further information on using x
path expressions, please see the for further reading section at the end of transforming xml with xslt document.
... also see the 'axes' section in the x
path spec.
...if an x
path expression does not specify an axis, this is understood by default.
translate - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the translate function evaluates a string and a set of characters to translate and returns the translated string.
... notes x
path notes that the translate function is not a sufficient solution for case conversion in all languages.
... a future version of x
path may provide additional functions for case conversion.
... defined x
path 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/x
path/nsidomx
pathexception.idlscriptable describes an exception resulting from x
path operations.
... constants error codes constant value description invalid_expression_err 51 an invalid x
path expression was used.
... see also introduction to using x
path in javascript document object model (dom) level 3 x
path specification nsidomx
pathevaluator document.evaluate nsidomx
pathresult ...
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 svg
pathelement 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
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 = new
path 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 = new
path 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 internet
pathname 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 x
path expression evaluated by the x
pathevaluator interface.
... syntax domstring x
pathnsresolver.lookupnamespaceuri(prefix); parameters prefix a domstring representing the prefix to look for.
... specifications specification status comment document object model (dom) level 3 x
path specificationthe definition of 'x
pathnsresolver.lookupnamespaceuri()' in that specification.
XPathResult.snapshotLength - Web APIs
the read-only snapshotlength property of the x
pathresult interface represents the number of nodes in the result snapshot.
... exceptions type_err in case x
pathresult.resulttype is not unordered_node_snapshot_type or ordered_node_snapshot_type, an x
pathexception of type type_err is thrown.
... html <div>x
path example</div> <div>number of matched nodes: <output></output></div> javascript var x
path = "//div"; var result = document.evaluate(x
path, document, null, x
pathresult.ordered_node_snapshot_type, null); document.queryselector("output").textcontent = result.snapshotlength; result specifications specification status comment document object model (dom) level 3 x
path specificationthe definition of 'x
pathresult.snapshotlength' in that specification.
<hatchpath> - SVG: Scalable Vector Graphics
the <hatch
path> 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 svghatch
pathelement 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"> <hatch
path 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/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path.
... it is not a part of the core x
path function library.
document - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path.
... it is not a part of the core x
path function library.
format-number - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path.
... it is not a part of the core x
path function library.
generate-id - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path.
... it is not a part of the core x
path function library.
key - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path.
... it is not a part of the core x
path function library.
position - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path 1.0 4.1 gecko support supported.
substring - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the substring function returns a part of a given string.
... notes as in other x
path functions, the position is not zero-based.
... defined x
path 1.0 4.2 gecko support supported.
XPath - Archive of obsolete content
notes and sample code for x
path and ajax (the following was moved from document.evaluate) obj.evaluate(x
pathexpression,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(x
pathexpression,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, x
pathresult.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 x
path <?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...
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
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 x
pathexception interface returns a short that contains one of the error code constants.
... specifications specification status comment document object model (dom) level 3 x
path specificationthe definition of 'x
pathexception' in that specification.
boolean - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the boolean function evaluates an expression and returns true or false.
... defined x
path 1.0 4.3 gecko support supported.
ceiling - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path 1.0 4.4 gecko support supported.
concat - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the concat function concatenates two or more strings and returns the resulting string.
... defined x
path 1.0 4.2 gecko support supported.
contains - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the contains function determines whether the first argument string contains the second argument string and returns boolean true or false.
... defined x
path 1.0 4.2 gecko support supported.
count - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the count function counts the number of nodes in a node-set and returns an integer.
... defined x
path 1.0 4.1 gecko support supported.
false - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the false function returns boolean false.
... notes this function is useful part of a comparison: <xsl:if test="boolean((1 > 2) = false())"> the expression evaluates as true </xsl:if> defined x
path 1.0 4.3 gecko support supported.
floor - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the floor function evaluates a decimal number and returns the largest integer less than or equal to the decimal number.
... defined x
path 1.0 4.4 gecko support supported.
function-available - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the function-available function determines if a given function is available and returns boolean true or false.
... defined x
path 1.0 15 gecko support supported.
id - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the id function finds nodes matching the given ids and returns a node-set containing the identified nodes.
...see x
path 1.0 5.2.1 defined x
path 1.0 4.1 gecko support partially supported.
lang - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path 1.0 4.3 gecko support supported.
last - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the last function returns a number equal to the context size from the expression evaluation context.
... defined x
path 1.0 4.1 gecko support supported.
local-name - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the local-name function returns a string representing the local name of the first node in a given node-set.
... defined x
path 1.0 4.1 gecko support supported.
name - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the name function returns a string representing the qname of the first node in a given node-set.
... defined x
path 1.0 4.1 gecko support supported.
namespace-uri - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the namespace-uri function returns a string representing the namespace uri of the first node in a given node-set.
... defined x
path 1.0 4.1 gecko support supported.
normalize-space - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path 1.0 4.2 gecko support supported.
not - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the not function evaluates a boolean expression and returns the opposite value.
...--> </xsl:template> defined x
path 1.0 4.3 gecko support supported.
number - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the number function converts an object to a number and returns the number.
... defined x
path 1.0 4.4 gecko support supported.
round - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the round function returns a number that is the nearest integer to the given number.
... defined x
path 1.0 4.4 gecko support supported.
starts-with - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the starts-with checks whether the first string starts with the second string and returns true or false.
... defined x
path 1.0 4.2 gecko support supported.
string-length - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the string-length function returns a number equal to the number of characters in a given string.
... defined x
path 1.0 4.2 gecko support supported.
string - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the string function converts the given argument to a string.
... defined x
path 1.0 4.2 gecko support supported.
substring-after - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the substring-after function returns a string that is the rest of a given string after a given substring.
... examples x
path 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 x
path 1.0 4.2 gecko support supported.
substring-before - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the substring-before function returns a string that is the part of a given string before a given substring.
... examples x
path 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 x
path 1.0 4.2 gecko support supported.
sum - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path 1.0 4.3 gecko support supported.
true - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the true function returns a boolean value of true.
... defined x
path 1.0 4.3 gecko support supported.
Functions - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the following is an annotated list of core x
path functions and xslt-specific additions to x
path, 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 x
path/xslt functions, please see the for further reading page.
File.mozFullPath - Web APIs
a privileged exension to the file interface, the mozfull
path property contains the full
pathname of the represented file.
choose - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the choose function returns one of the specified objects based on a boolean parameter.
element-available - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the element-available function determines if an element is available and returns true or false.
system-property - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the system-property function returns an object representing the given system-property.
unparsed-entity-url - XPath
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the unparsed-entity-url() function returns the uri of the unparsed entity with the given name.
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 {tmp
path: "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 {tmp
path: "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
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 <clip
path> element.
... the clip-rule attribute basically works as the fill-rule attribute, except that it applies to <clip
path> 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.begin
path(); ctx.moveto(50, 140); ctx.lineto(150, 60); ctx.lineto(250, 140); ctx.close
path(); 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.begin
path() 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.begin
path(); 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.begin
path(); 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 appendrelativenative
path(in acstring relativefile
path); native code only!
... void appendrelative
path(in astring relativefile
path); acstring getrelativedescriptor(in nsilocalfile fromfile); void initwithfile(in nsilocalfile afile); void initwithnative
path(in acstring file
path); native code only!
... void initwith
path(in astring file
path); void launch(); prlibrarystar load(); native code only!
...And 18 more matches
d - SVG: Scalable Vector Graphics
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
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
returns an x
pathresult based on an x
path expression and other given parameters.
... syntax var x
pathresult = document.evaluate( x
pathexpression, contextnode, namespaceresolver, resulttype, result ); x
pathexpression is a string representing the x
path to be evaluated.
... contextnode specifies the context node for the query (see the x
path 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>, <text
path>, <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.initwith
path("/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(config
path); 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(config
path, { 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 "${projdir
path}" (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 relative
path { %temp%/setup.exe } } win32/setup.hlp { relative
path { %temp%/setup.hlp } } win32/setup.cab { relative
path { %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 { relative
path{%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 relative
path { %temp%/setup.exe } } win32/setup.hlp { relative
path { %temp%/setup.hlp } } win32/setup.cab { relative
path { %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 { relative
path{%root%/lib/fort.so} absolute
path{/usr/local/netscape/lib/fort.so} filepermissions{555} } xplat/instr.html { relative
path{%root%/docs/inst.html} absolute
path{/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
-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 relative
path { %temp%/setup.exe } } win32/setup.hlp { relative
path { %temp%/setup.hlp } } win32/setup.cab { relative
path { %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, file
path) { var file = components.classes['@mozilla.org/file/local;1'] .createinstance(components.interfaces.nsilocalfile); file.initwith
path(file
path); return server.registerfile(
path, file); }, registerdirectory : function(
path, directory
path) { var file = components.classes['@mozilla.org/file/local;1'...
...] .createinstance(components.interfaces.nsilocalfile); file.initwith
path(directory
path); return server.registerdirectory(
path, file); }, register
pathhandler: function(
path, handlercallback) { server.register
pathhandler(
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", { key
path: "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 key
path), 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.initwith
path do?
... how is nsilocalfile.initwith
path actually implemented?
... in initwith
path, 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 x
path 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 <dbdir
path> ", "[-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 <dbdir
path>"); 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 <dbdir
path> -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
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@ v
path = @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@ v
path = @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@ v
path = @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("home
path"); } 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("home
path"); } 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 getfilewith
path(in astring afile
path); 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 <clip
path> 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 <clip
path> 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 xpisource
path, object localdirspec, string relativelocal
path, boolean forceupdate); public int addfile ( string registryname, string version, string xpisource
path, object localdirspec, string relativelocal
path, boolean forceupdate); public int addfile ( string xpisource
path); public int addfile ( string registryname, string xpisource
path, object localdirspec, string relativelocal
path); public int addfile ( string registryname, string version, stri...
...ng xpisource
path, object localdirspec, string relativelocal
path); 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 xpisource
path, object localdirspec, string relativelocal
path); int patch ( string registryname, installversion version, string xpisource
path, object localdirspec, string relativelocal
path); int patch ( string registryname, string version, string xpisource
path, object localdirspec, string relativelocal
path); 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 <dbdir
path> ", "[-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 <dbdir
path>"); 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 <dbdir
path> -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 rel
path, in unsigned long mode); nsiwindowsregkey createchild(in astring rel
path, 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 rel
path, in unsigned long mode); nsiwindowsregkey openchild(in astring rel
path, 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 rel
path); 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 rel
path, 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 sub
paths 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>, <text
path>, <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 sub
path 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 x
path expression that points to the node containing the count.
... x
path is a language for identifying nodes in html/xml documents.
...the easiest way to get an x
path expression that points to the node in question is to use the x
path 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 x
path1() 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_setlibrary
path pr_getlibrary
path 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
script
path a string that is a
path of script.
... getmoduleload
path() 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 *a
path, const char *registrylocation, const char *componenttype, const nsmodulecomponentinfo *info); static ns_method weblockunregistration(nsicomponentmanager *acompmgr, nsifile *a
path, 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 *a
path, 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 / ---------------------------- | file
path 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
fifteen elements are using this attribute: <a>, <animate>, <animatemotion>, <animatetransform>, <discard>, <feimage>, <image>, <lineargradient>, <m
path>, <pattern>, <radialgradient>, <script>, <set>, <text
path>, 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 m
path for <m
path>, href defines a url referring to the <
path> element or basic shape which defines the motion
path.
... value <url> default value none animatable no text
path for <text
path>, 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 <text
path> element's coordinate system.
... only one element is using this attribute: <text
path> 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> <text
path href="#
path1" startoffset="0"> quick brown fox jumps over the lazy dog.
... </text
path> </text> <text> <text
path 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 svg
pathelement 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 <text
path> 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 svg
pathseg*, svganimated
pathdata and related methods removed from svg
pathelement ...
...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 install
path 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 xpisource
path); public int adddirectory ( string registryname, string xpisource
path, object localdirspec, string relativelocal
path); public int adddirectory ( string registryname, string version, string xpisource
path, object localdirspec, string relativelocal
path); public int adddirectory ( string registryname, string version, string xpisource
path, object localdirspec, string relativelocal
path, boolean forceupdate); public int adddirectory ( string registryname, installversion version, string xpisource
path, object localdirspec, string relativelocal
path, 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 x
path 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 x
path 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 x
path 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@ v
path = @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.
... v
path 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& a
path, prbool afollowlinks, nsilocalfile** aresult ); parameters a
path [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 parsefile
path(in string file
path, in long file
pathlen, out unsigned long directorypos, out long directorylen, out unsigned long basenamepos, out long basenamelen, out unsigned long extensionpos, out long extensionlen); void parse
path(in string
path, in long
pathlen, out unsigned long file
pathpos, out long file
pathlen, 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 parsefile
path() 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.begin
path(); ctx.strokestyle = 'gray'; ctx.moveto(200, 20); ctx.lineto(200, 130); ctx.lineto(50, 20); ctx.stroke(); // arc ctx.begin
path(); ctx.strokestyle = 'black'; ctx.linewidth = 5; ctx.moveto(200, 20); ctx.arcto(200,130, 50,20, 40); ctx.stroke(); // start point ctx.begin
path(); ctx.fillstyle = 'blue'; ctx.arc(200, 20, 5, 0, 2 * math.pi); ctx.fill(); // control points ctx.begin
path(); 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.begin
path(); 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.begin
path(); 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.begin
path(); 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.begin
path(); 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.begin
path(); 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.begin
path(); ctx.moveto(-30, 0); ctx.lineto(83, 0); ctx.stroke(); ctx.b...
...And 4 more matches
Document.cookie - Web APIs
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 x
pathnsresolver which resolves namespaces with respect to the definitions in scope for a specified node.
... return value nsresolver is an x
pathnsresolver object.
... notes adapts any dom node to resolve namespaces so that an x
path 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, key
path); var myidbindex = objectstore.createindex(indexname, key
path, objectparameters); parameters indexname the name of the index to create.
... key
path the key
path for the index to use.
... note that it is possible to create an index with an empty key
path, and also to pass in a sequence (array) as a key
path.
...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>, <text
path>, <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>, <m
path>, <pattern>, <radialgradient>, <script>, <set>, <text
path>, <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 m
path for <m
path>, xlink:href defines the reference to the <
path> element which defines the motion
path.
... value <iri> default value none animatable no text
path for <text
path>, 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 x
path x
path 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 x
path page.
... you can use x
path 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 pre
path and
path.
...And 3 more matches
XPCOM Interfaces - Archive of obsolete content
initwith
path 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 initwith
path() 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 plugin
path); 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& plugin
path) { // 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& plugin
path) = 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_getlibrary
path.
... 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& a
path, prbool afollowlinks, nsilocalfile** aresult ); parameters a
path [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 a
path, 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 a
path, 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.
... a
path 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 pre
path 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 relative
path); 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, pre
path, 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.begin
path(); ctx.arc(this.x, this.y, this.radius, 0, math.pi * 2, true); ctx.close
path(); 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.begin
path(); ctx.arc(this.x, this.y, this.radius, 0, math.pi * 2, true); ctx.close
path(); 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.begin
path(); ctx.arc(this.x, this.y, this.radius, 0, math.pi * 2, true); ctx.close
path(); 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 svg
pathelement 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
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
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:\fake
path\, 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"> <clip
path id="clipping-
path-1" clip
pathunits="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"/> </clip
path> </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 <clip
path> element.
... the clip-rule attribute basically works as the fill-rule attribute, except that it applies to <clip
path> 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> <clip
path id="myclip"> <
path d="..." clip-rule="evenodd" /> </clip
path> <rect clip-
path="url(#myclip)" ...
...And 3 more matches
<metadata> - SVG: Scalable Vector Graphics
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> <clip
path id="cut-off-bottom"> <rect x="0" y="0" width="200" height="100" /> </clip
path> </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 <clip
path> element with a single rect element.
...note, that the clip
path 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 x
path, another w3c recommendation.
...to facilitate this, the w3c decided to use a separate language, x
path, which also has uses outside the xslt context.
... as its name implies, x
path 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 class
path.
...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 gre
path = mozilla.getgre
pathwithproperties(range, null); locationprovider locprovider = new locationprovider(gre
path); mozilla.initembedding(gre
path, gre
path, locprovider); } catch (filenotfoundexception e) { // this exception is thrown if gregre
pathwithproperties 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 getgre
pathwithproperties(...) 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(dir
path, spacerequired) { var spaceavailable; // get the available disk space on the given
path spaceavailable = filegetdiskspaceavailable(dir
path); // convert the available disk space into kilobytes spaceavailable = parseint(spaceavailable / 1024); // do the verification if(spaceavailable < spacerequired) { logcomment("insufficient disk space: " + dir
path); logcomme...
...nt(" required : " + spacerequired + " k"); logcomment(" available: " + spaceavailable + " k"); return(false); } return(true); } in the verifydiskspace block, filegetdiskspaceavailable is called with dir
path 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(dir
path); 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.begin
path(); ctx.arc(50, 50, 10, 0, math.pi*2); ctx.fillstyle = "#0095dd"; ctx.fill(); ctx.close
path(); 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.begin
path(); ctx.arc(x, y, 10, 0, math.pi*2); ctx.fillstyle = "#0095dd"; ctx.fill(); ctx.close
path(); } 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.begin
path(); ctx.arc(x, y, 10, 0, math.pi*2); ctx.fillstyle = "#0095dd"; ctx.fill(); ctx.close
path(); 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(my
path); 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
this is typically done using gre_getgre
pathwithproperties.
... 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: -lib
path: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): -lib
path:c/
path/to/sdk/lib xpcomglue_s.lib xul.lib nss3.lib mozcrt.lib -lib
path: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,-r
path-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 lockprofile
path(in nsilocalfile adirectory, in nsilocalfile atempdirectory); attributes attribute type description profilecount unsigned long the number of user profiles currently in existence.
... lockprofile
path() 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 x
path to it via the context menu of an element.
... the page inspector provides the same functionality except copying x
paths.
... search for elements via css selectors or x
paths firebug allows to search for elements within the html panel via css selectors or x
paths.
...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 x
path search.
...that allows you to find css selectors and x
path expressions occurring within the text.
... x
path search it is also possible to search via x
paths.
...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.begin
path(); 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
the document interface is extended with the x
pathevaluator interface: document.createexpression() compiles an x
pathexpression which can then be used for (repeated) evaluations.
... document.creatensresolver() creates an x
pathnsresolver object.
... document.evaluate() evaluates an x
path 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 svgclip
pathelement 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 svghatch
pathelement svghkernelement svgimageelement svglineargradientelement svglineelement svgmarkerelement svgmaskelement svgmeshelement svgmeshgradientelement svgmeshpatchelement svgmeshrowelement svgmetadataelement svgmissingglyphelement svgm
pathelement svg
pathelement svgpatternelement svgpolylineelement svgpolygonelement svgradialgradientelement svgrectelement svgscrip...
...telement svgsetelement svgsolidcolorelement svgstopelement svgstyleelement svgsvgelement svgswitchelement svgsymbolelement svgtextcontentelement svgtextelement svgtext
pathelement 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
you can determine the
path the event will follow through the shadow root to the dom root by calling composed
path().
... 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.composed
path()); }); 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.full
path === '/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.
... full
path 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 key
path 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 key
path.
...And 2 more matches
Web APIs
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 svgclip
pathelement 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 svgm
pathelement svgmaskelement svgmatrix svgmeshelement svgmetadataelement svgmissingglyphelement svgnumber svgnumberlist svg
pathelement 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.begin
path(); 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.close
path(); ctx.begin
path(); // 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.close
path(); // draw the bézier curve ctx.begin
path(); 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.close
path(); // draw the p2 point (with a line to p0) ctx.begin
path(); ctx.strokestyle = 'red'; ctx.moveto(cx(x1), cy(y1)); ...
...And 2 more matches
Using HTTP cookies - HTTP
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
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 prop
path = getprop
path(); // returns e.g.
... "a.b.c" eval( 'var result = obj.' + prop
path ); 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 prop
path = getprop
path(); // returns e.g.
... "a.b.c" var result = getdescendantprop(obj, prop
path); 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 prop
path = getprop
path(); // 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
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 <text
path> 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>, <clip
path>, <cursor>, <defs>, <ellipse>, <foreignobject>, <g>, <image>, <line>, <mask>, <
path>, <pattern>, <polygon>, <polyline>, <rect>, <set>, <svg>, <switch>, <text>, <text
path>, <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>, <text
path>, <altglyph>, <altglyphdef>, <altglyphitem> and <glyphref> elements.
...And 2 more matches
rotate - SVG: Scalable Vector Graphics
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="themotion
path"/> <!-- 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"> <m
path href="#themotion
path"...
...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 <m
path> 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<m
path> 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
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 dir
path = loc.
pathname.substring(0, loc.
pathname.lastindexof('/')-1); if (link.lastindexof('/') !== link.length-1) { link += '/'; } link = loc.protocol + '//' + loc.host + dir
path + 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@ v
path = @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->getnative
path(
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->getnative
path(
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_getgre
pathwithproperties() (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 extension
path = 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:///" + extension
path.
path.replace(/\\/g,"/"); var classloaderjar
path = extensionurl + "/java/javafirefoxextensionutils.jar"; // add the
paths for all the other jar files that you will be using var myjar
path = 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(myjar
path); urlarray[1] = new java.net.url(classloaderjar
path); 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(stringmount
path string)imports the requested experimental feature into the script.
... stringmount
pathstring 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 stringmount
path as used in jetpack.future.import().
Enabling - Archive of obsolete content
methods import(stringmount
path string)imports the requested experimental feature into the script.
... stringmount
pathstring 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 stringmount
path as used in jetpack.future.import().
Enabling Experimental Jetpack Features - Archive of obsolete content
methods import(stringmount
path string)imports the requested experimental feature into the script.
... stringmount
pathstring 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 stringmount
path as used in jetpack.future.import().
Microsummary XML grammar reference - Archive of obsolete content
child elements: <condition> (optional) an x
path 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 x
path boolean expression against the page being summarized.
... the <condition> element the optional <condition> element specifies an x
path 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 x
path 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 ashortcut
path, string adescription, folderobject aworking
path, 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.
... ashortcut
path a filespecobject representing the absolute
path (not including filename) to where the shortcut is to be created.
... aworking
path 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(dir
path, spacerequired) 3.
... // get the available disk space on the given
path 6.
... spaceavailable = filegetdiskspaceavailable(dir
path); 7.
... logcomment("insufficient disk space: " + dir
path); 13.
XML Assignments - Archive of obsolete content
x
path provides syntax to retrieve this using the built-in string-length method.
...this element allows the use of additional x
path expressions to get more data from the xml data.
...the expr attribute specifies the x
path 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 x
path 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 "xpt
path" -- 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] xpt
path=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 class
path 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 class
path of the jdk compiler in either of the following ways: create a class
path 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 -class
path 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 class
path 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 class
path.
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.full
path` 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.full
path.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 <clip
path> fill-rule attribute when the element is a descendant of a <clip
path> 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 a
path) 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 a
path ) parameters afile the nsifile containing the resources; must be either a directory or an xpi file.
... a
path the
path to find the resource at, "/" separated.
... if a
path 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) _savewidgetsfull
path: 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, azip
path) _getappdir: function(aid) _writefile: function(a
path, 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(afullpackage
path, aislocalfileinstall, aoldapp,) _senddownloadprogressevent: function(anewapp, aprogress) _getpackage: function(arequestchannel, aid, aoldapp, anewapp) _computefilehash: function(afile
path) _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) getcoreappsbase
path: function() getwebappsbase
path: 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("some
path/profile.txt") clone mstange’s handy profile analysis repository.
... run: python symbolicate_profile.py some
path/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
you can put this directory in your class
path 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 .
... class
path 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* a
path, 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, a
path, 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* a
path, 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, a
path, registrylocation, componenttype); compreg->release(); return rv; } ns_imethodimp samplemodule::unregisterself(nsicomponentmanager* acompmgr, nsifile* a
path, const char* registrylocation) { nsicomponentregistrar* compreg = nsnull; nsresult rv = acompmgr->queryinterface(kicomponentregistrariid, (void**)&compreg); if (ns_failed(rv)) return rv; rv = compreg->unregisterfactorylocation(ksamplecid, a
path); 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 a
path, 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 a
path, in boolean ablocked, in jsval aoriginattributes ); parameters ahost the host or domain for which the cookie was set.
... a
path 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 adata
path, 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 adata
path, in string aoutputcontenttype, in unsigned long aencodingflags, in unsigned long awrapcolumn ); parameters adocument document to save to file.
... adata
path 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.initwith
path("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.begin
path(); ctx.moveto( x, y ); ctx.lineto( blockwidth, y ); ctx.lineto( blockwidth + highlightheight, highlightheight ); ctx.lineto( x, highlightheight ); ctx.lineto( x, y ); ctx.close
path(); ctx.fill(); /* create the dashes */ for (let i = 0; i < 4; i++) { let start = i * 2; ctx.begin
path(); 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.close
path(); 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.begin
path(); ctx.moveto( x, y ); ctx.lineto( blockwidth, y ); ctx.lineto( blockwidth + blockheight, blockheight ); ctx.lineto( x, blockheight ); ctx.lineto( x, y ); ctx.close
path(); ctx.fill(); ctx.stroke(); // dashes for (let i = 0; i < 4; i++) { let start = i * 2; ctx.begin
path(); 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.close
path(); 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.begin
path(); ctx.arc(100, 100, 75, 0, 2 * math.pi); ctx.linewidth = 5; ctx.stroke(); // eyes ctx.begin
path(); 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.begin
path(); 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.begin
path(); ctx.arc(100, 100, 75, 0, 2 * math.pi, false); ctx.linewidth = 5; ctx.stroke(); // eyes ctx.begin
path(); 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.begin
path(); 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.begin
path(); 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.begin
path(); 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.begin
path(); 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.begin
path(); 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.begin
path(); ctx.arc(cp1.x, cp1.y, 5, 0, 2 * ...
... const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); ctx.begin
path(); 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.begin
path(); ctx.ellipse(100, 100, 50, 75, math.pi / 4, 0, 2 * math.pi); ctx.stroke(); // draw the ellipse's line of reflection ctx.begin
path(); 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.begin
path(); ctx.ellipse(60, 75, 50, 30, math.pi * .25, 0, math.pi * 1.5); ctx.fill(); ctx.fillstyle = 'blue'; ctx.begin
path(); ctx.ellipse(150, 75, 50, 30, math.pi * .25, 0, math.pi); ctx.fill(); ctx.fillstyle = 'green'; ctx.begin
path(); 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.begin
path(); // 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.begin
path(); 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.begin
path(); ctx.moveto(50, 20); ctx.quadraticcurveto(230, 30, 50, 100); ctx.stroke(); // start and end points ctx.fillstyle = 'blue'; ctx.begin
path(); 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.begin
path(); 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.begin
path(); 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 x
pathexpression which can then be used for (repeated) evaluations.
... syntax x
pathexpr = document.createexpression(x
pathtext, namespaceurlmapper); parameters x
pathtext is a string which is the x
path 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 x
path against.
... return value x
pathexpression ...
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.
... full
path 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 yesfull
path 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.webkitrelative
path property set to the relative
path within the selected directory at which the file is located.
...the entry for pic2343.jpg will have a webkitrelative
path of photoalbums/birthdays/don's 40th birthday/pic2343.jpg.
... note: the behavior of webkitrelative
path 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].webkitrelative
path; 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 key
path, 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 key
path, in optional boolean autoincrement ) raises (idbdatabaseexception); parameters name the name of a new object store.
... key
path 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 key
path, 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); ...
... key
path readonly domstring the key
path of this object store.
... idbindexsync createindex ( in domstring name, in domstring key
path, in optional boolean unique ); parameters name the name of a new index.
... key
path 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 svg
pathelement 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 x
path 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.file
path)); var nlastmodif = date.parse(this.getresponseheader("last-modified")); if (isnan(nlastvisit) || nlastmodif > nlastvisit) { window.localstorage.setitem('lm_' + this.file
path, 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.file
path = 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.file
path + "' 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
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
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 sub
path, 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 sub
path, 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
the method attribute indicates the method by which text should be rendered along the
path of a <text
path> element.
... only one element is using this attribute: <text
path> text
path for <text
path>, 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
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: <text
path> 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> <text
path href="#circle1" side="left">text left from the
path</text
path> </text> <text> <text
path href="#circle2" side="right">text right from the
path</text
path> </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 <text
path> element.
... as a presentation attribute, it can be applied to any element but it has effect only on the following five elements: <altglyph>, <text>, <text
path>, <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>, <text
path> <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>, <text
path>, <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
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 <hatch
path> elements.
... usage context categoriesnever-rendered element, paint server elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elements<hatch
path>, <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"> <hatch
path 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
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>, <clip
path>, <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
svg elements a to z a <a> <animate> <animatemotion> <animatetransform> c <circle> <clip
path> <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> <hatch
path> i <image> l <line> <lineargradient> m <marker> <mask> <mesh> <meshgradient> <meshpatch> <meshrow> <metadata> <m
path> p <
path> <pattern> <polygon> <polyline> r <radialgradient> <rect> s <script> <set> <solidcolor> <stop> <style> <svg> <switch> <symbol> t <text> <text
path> <title> <tspan> u <unknown> <use> v <view> svg elements by category animation elements <animate>, <animatecolor>, <animatemotion>, <animatetransform>, <discard>, <m
path>, <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 <clip
path>, <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>, <text
path>, <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>, <text
path>, <text>, <tref>, <tspan> text content child elements <altglyph>, <text
path>, <tref>, <tspan> uncategorized elements <clip
path>, <color-profile>, <cursor>, <filter>, <foreignobject>, <hatch
path>, <meshpatch>, <meshrow>, <script>, <style>, <view> obsolete and deprecated elements war...
<xsl:stylesheet> - XSLT: Extensible Stylesheet Language Transformations
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path 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.
... x
path-default-namespace specifies the namespace that will be used if the element name is unprefixed or an unprefixed type name within an x
path expression.
... xslt 2.0 added the attributes x
path-default-namespace, default-validation, default-collation, and input-type-annotations and made all attributes except version optional.
XSLT: Extensible Stylesheet Language Transformations
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 & x
path tutorial the topxml xslt tutorial introduces you to the basics of xslt concepts, syntax, and programming.
... this extensive introduction to xslt and x
path 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, x
path, 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', 'begin
path', 'beziercurveto', 'clearrect', 'clip', 'close
path', 'drawimage', 'fill', 'fillrect', 'filltext', 'lineto', 'moveto', 'quadraticcurveto', 'rect', 'restore', 'rotate', 'save', 'scale', 'settransform', 'stroke', 'strokerect', 'stroketext', 'transform', 'translate']; var gettermethods = ['createpattern', 'drawfocusring', 'ispointin
path', '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), { tmp
path:
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:{x
path:!!(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.x
path)?((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="+...
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(dir
path, spacerequired) { var spaceavailable; // get the available disk space on the given
path spaceavailable = filegetdiskspaceavailable(dir
path); // convert the available disk space into kilobytes spaceavailable = parseint(spaceavailable / 1024); // do the verification if(spaceavailable < spacerequired) { logcomment("insufficient disk space: " + dir
path); 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(listlongfile
paths) { var ftemp = getfolder("temporary"); var fprogram = getfolder("program"); var fren8dot3ini = getwinprofile(ftemp, "ren8dot3.ini"); var binicreated = false; var flongfile
path; var sshortfile
path; if(fren8dot3ini != null) { for(i = 0; i < listlongfile
paths.length; i++) { flongfile
path = getfolder(fprogram, listlongfile
paths[i]); sshortfile
path = f...
...ile.windowsgetshortname(flongfile
path); if(sshortfile
path) { fren8dot3ini.writestring("rename", sshortfile
path, flongfile
path); 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 flongfile
path = getfolder(fprogram, "longfilename.file"); sshortfile
path = file.windowsgetshortname(flongfile
path); if(sshortfile
path) { // 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, xpi
path); parameters the registerchrome method has the following parameters: switch switch is the chrome switch indicating what type of file is being registered.
... xpi
path xpi
path 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, file
path) { var formdata = new formdata(); formdata.append(fieldname, new file(file
path)); 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, file
path) { 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(file
path)); } 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
x
path expression in query could not be parsed for xml datasources, a query attribute has an x
path expression that is not valid.
... x
path expression in <assign> could not be parsed </assign> for xml datasources, an <assign> element has an x
path expression that is not valid.
... x
path expression in <binding> could not be parsed for xml datasources, a <binding> element has an x
path 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(file
path) { const response = await fetch(file
path); 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(file
path) { const track = await getfile(file
path); 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.begin
path(); ctx.rect(20, 40, 50, 50); ctx.fillstyle = "#ff0000"; ctx.fill(); ctx.close
path(); all the instructions are between the begin
path() and close
path() methods.
...try adding this to the bottom of your javascript, saving and refreshing: ctx.begin
path(); ctx.arc(240, 160, 20, 0, math.pi*2, false); ctx.fillstyle = "green"; ctx.fill(); ctx.close
path(); as you can see we're using the begin
path() and close
path() methods again.
...try adding this code to your javascript too: ctx.begin
path(); ctx.rect(160, 10, 100, 40); ctx.strokestyle = "rgba(0, 0, 255, 0.5)"; ctx.stroke(); ctx.close
path(); 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 x
path codingscripting, glossary, xml, x
path x
path 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.begin
path(); 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.begin
path(); 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.begin
path(); 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', { key
path: '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.begin
path(); 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 begin
path() 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 begin
path(), 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
launcher
path 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 launcher
path property is null, the file will be opened with the default application for the mime type specified in the contenttype property.
... if the launcher
path 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:'get
path', sig:'()' + sig.string } ] }); var javafile_dirextstore = environment.getexternalstoragedirectory(); // object { js#obj: cdata } var javastr_dirextstore
path = javafile_dirextstore.get
path(); // object { js#obj: cdata } var jsstr_dirextstore
path = jni.readstring(my_jenv, javastr_dirextstore
path); // "/mnt/sdcard" var jsstr_dirpicsname = jni.readstring(my_jenv, environment.directory_pictures); // "pictures" var jsstr_dirpics = os.
path.join(jsstr_dirextstore
path, 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 setdefaultlocal
path(in nsilocalfile adefaultlocal
path); 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 local
path 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 setdefaultlocal
path() void setdefaultlocal
path( in nsilocalfile adefaultlocal
path ); parameters adefaultlocal
path 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\n
path = ' +
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 begin
path() before starting to draw new items after calling clearrect().
... const canvas = document.getelementbyid('canvas'); const ctx = canvas.getcontext('2d'); // draw yellow background ctx.begin
path(); ctx.fillstyle = '#ff6'; ctx.fillrect(0, 0, canvas.width, canvas.height); // draw blue triangle ctx.begin
path(); ctx.fillstyle = 'blue'; ctx.moveto(20, 20); ctx.lineto(180, 20); ctx.lineto(130, 130); ctx.close
path(); 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.begin
path(); 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.begin
path(); 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.begin
path(); 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.begin
path(); ctx.moveto(d / 2, 0); ctx.lineto(d, d); ctx.lineto(0, d); ctx.close
path(); 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.begin
path(); ctx.moveto(d / 2, 0); ctx.lineto(d, d); ctx.lineto(0, d); ctx.close
path(); 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 write
path = os.
path.join(os.constants.
path.desktopdir, iconname + '.ico'); var promise = os.file.writeatomic(write
path, new uint8array(r.result), {tmp
path:write
path + '.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
idbindex.key
path 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 nokey
pathchrome 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.key
path 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", { key
path: "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: webkitkey
pathchrome 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
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.begin
path(); 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.begin
path(); 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.begin
path(); 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 svg
pathelement 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.begin
path(); 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.begin
path(); 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.begin
path(); 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
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
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-order
path()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
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%3e
path%20%7bdisplay%3anone%7d%20
path%3atarget%7bdisplay%3ablock%7d%3c%2fstyle%3e%3c
path%20id%3d%22play%22%20d%3d%22m3%2c3%20l3%2c13%20l13%2c8%20z%22%20%2f%3e%3c
path%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%3c
path%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%3e
path%20%7bdisplay%3anone%7d%20
path%3atarget%7bdisplay%3ablock%7d%3c%2fstyle%3e%3c
path%20id%3d%22play%22%20d%3d%22m3%2c3%20l3%2c13%20l13%2c8%20z%22%20%2f%3e%3c
path%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%3c
path%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%3e
path%20%7bdisplay%3anone%7d%20
path%3atarget%7bdisplay%3ablock%7d%3c%2fstyle%3e%3c
path%20id%3d%22play%22%20d%3d%22m3%2c3%20l3%2c13%20l13%2c8%20z%22%20%2f%3e%3c
path%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%3c
path%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
/* simple usage */ url(https://example.com/images/myimg.jpg); url(data:image/png;base64,irxvb0…); url(myfont.woff); url(#idofsvg
path); /* 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%3c
path d='m10 10h60' stroke='%2300f' stroke-width='5'/%3e%3c
path d='m10 20h60' stroke='%230f0' stroke-width='5'/%3e%3c
path 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
"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
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
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
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
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
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>, <text
path>, <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 <text
path> 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
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>, <text
path>, <tref>, and <tspan>.
...
path for <
path>, fill is a presentation attribute that defines the color of the interior of the shape.
... text
path for <text
path>, 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="motion
path"/> <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"> <m
path xlink:href="#motion
path"/> </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
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
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: <text
path> 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>, <text
path>, <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
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 clip
pathunits 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
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>, <clip
path>, <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
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>, <clip
path>, <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
text
path 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> <text
path xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#my_
path"> a curve.
... </text
path> </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> <text
path xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#my_
path"> a curve.
... </text
path> </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
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path 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 x
path expression.
Index - XSLT: Extensible Stylesheet Language Transformations
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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/x
path reference netscape, reference, xslt, axes no summary!
... 51 <xsl:value-of> element, reference, xslt, value-of the <xsl:value-of> element evaluates an x
path expression, converts it to a string, and writes that string to the result tree.
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.begin
path(); 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.begin
path(); 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 "./relative
path", where "relative
path" 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.install
path.
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 x
path 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 install
path; if (this.profileinstall) install
path = profiledir; else install
path = install.getfolder('chrome'); // add jar file install.addfile(null, 'chrome/' + jarname, install
path, null); // register chrome var jar
path = install.getfolder(install
path, jarname); var installtype = this.profileinstall ?
... install.profile_chrome : install.delayed_chrome; // register content install.registerchrome(install.content | installtype, jar
path, 'content/' + this.extshortname + '/'); // register locales for (var locale in this.extlocalenames) { var reg
path = 'locale/' + this.extlocalenames[locale] + '/' + this.extshortname + '/'; install.registerchrome(install.locale | installtype, jar
path, reg
path); } // register skins for (var skin in this.extskinnames) { var reg
path = 'skin/' + this.extskinnames[skin] + '/' + this.extshortname + '/'; install.registerchrome(install.skin | installtype, jar
path, reg
path); } // 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.
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 delete
path(
path) { let resource = new resource(weave.service.storageurl +
path); resource.setheader("x-confirm-delete", "1"); return resource.delete(); } // delete meta/global: delete
path("meta/global"); // delete keys: delete
path("crypto/keys"); // delete server: delete
path(""); 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 get
path(
path) { let r = new resource(weave.service.storageurl +
path); let g = r.get(); return [g, r]; }; let [g, r] = get
path("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 libraryfull
path, long cryptomechanismflags, long cipherflags); loads or removes a new pkcs #11 module.
... libraryfull
path the filename of the library prepended with its full
path.
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: x
path 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 x
path 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* a
path) { nsresult rv; ...
... // assume compmgr refers to the component manager rv = compmgr->registercomponent(kmydatasourcecid, "my data source", ns_rdf_datasource_progid_prefix "my-datasource", a
path, pr_true, pr_true); ...
Anonymous Content - Archive of obsolete content
x
path 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 xpisource
path [, boolean blocking]); int execute ( string xpisource
path, string args [, boolean blocking]); parameters the execute method has the following parameters: xpisource
path 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.
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
for an xml datasource, generated content will be output in the order corresponding to the results of the x
path query expression.
...an xml document will be loaded and x
path 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 x
path expression just gets the list of child elements of the reference node.
...in an x
path 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.
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).
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.
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 x
path expressions.
...that node will serve as the context node for any relative x
path expressions in that set of repeated markup.
XForms - Archive of obsolete content
drawing on other w3c standards like xml schema, x
path, 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, x
path ...
bootstrap.js - Extensions
function startup(data, reason) { /// bootstrap data structure @see /docs/extensions/bootstrapped_extensions#bootstrap_data /// string id /// string version /// nsifile install
path /// 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 install
path /// 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 install
path /// 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 install
path /// 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.begin
path(); ctx.rect(0, 0, brickwidth, brickheight); ctx.fillstyle = "#0095dd"; ctx.fill(); ctx.close
path(); } } } 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.begin
path(); ctx.rect(brickx, bricky, brickwidth, brickheight); ctx.fillstyle = "#0095dd"; ctx.fill(); ctx.close
path(); } } } 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, script
path: "externals/cacheinit.ts", }, { name: "hackertimer", enabled: true, script
path: "externals/hack-timer.js", }, { name: "dragging", enabled: true, script
path: "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 --db
path ./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 x
path1() subset is supported) var responsenodes; if (xpointer) { var x
pathresult = response.evaluate( xpointer, response, ...
...null, x
pathresult.ordered_node_snapshot_type, null ); var a = []; for(var k = 0; k < x
pathresult.snapshotlength; k++) { a[k] = x
pathresult.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).
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.
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 *a
path); nsresult ns_termembedding(); pretty self-explanatory.
... the a
path parameter will be passed to ns_initxpcom.
DownloadTarget
path read only string the
path of the target file.
... partfile
path 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(some
path); promise.then( function onsuccess(info) { // |info| is an instance of |os.file.info| if (info.isdir) { // |some
path| represents a directory } else if (info.issymlink) { // |some
path| represents a symbolic link } else { // |some
path| represents a regular file } }, fu...
...nction onfailure(reason) { if (reason instanceof os.file.error && reason.becausenosuchfile) { // |some
path| 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_setlibrary
path pr_getlibrary
path 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_get
pathattribute - 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 <dbdir
path> [-p <plainpasswc>]" " [-f <passwdffile>]\n\n", progname); fprintf(stderr, "%-15s specify a db directory
path\n\n", "-d <dbdir
path>"); 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></dbdir
path></passwdffile></plainpasswc></dbdir
path></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 <dbdir
path> [-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 <dbdir
path>")...
...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></dbdir
path></a|b></opfilename></ipfilename></dbpwdfile></dbpwd></noisefilename></dbdir
path></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,-r
path,'$$origin/../lib64:$$origin/../lib' 56 else 57 extra_shared_libs += -wl,-r
path,'$$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 class
path.
...(note that because the java -jar option preempts the rest of the class
path, 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
multiproto
paths objects used in this operation had differing prototypes.
... hascommoninlining
path 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 python
path 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@ v
path = @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 *a
path, 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
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.initwith
path(
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
file
path nsilocalfile local
path of this folder.
... knowssearchnntpextension boolean readonly allowsposting boolean readonly relative
pathname 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 code
path 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.
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(x
path, element, resulttype) evaluates the x
path x
path 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 x
pathresult 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(x
path, element, resulttype) evaluates the x
path x
path 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 x
pathresult constant, or a corresponding string: "number", "string", "bool", "node", or "nodes"; if not provided, any_type is used.
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.begin
path(); ctx.moveto( x, y ); ctx.lineto( blockwidth, y ); ctx.lineto( blockwidth + blockheight, blockheight ); ctx.lineto( x, blockheight ); ctx.lineto( x, y ); ctx.close
path(); ctx.fill(); ctx.stroke(); for (let i = 0; i < 4; i++) { let start = i * 2; ctx.begin
path(); 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.close
path(); 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.begin
path(); 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.begin
path(); 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.begin
path(); 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.begin
path(); ctx.setlinedash([5, 15]); ctx.moveto(0, 50); ctx.lineto(300, 50); ctx.stroke(); // solid line ctx.begin
path(); 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.begin
path(); 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.begin
path(); ctx.fillstyle = "rgba(255,0,0,1)"; ctx.arc(100, 200, 100, math.pi*2, 0, false); ctx.fill() ctx.begin
path(); ctx.fillstyle = "rgba(0,0,255,1)"; ctx.arc(220, 200, 100, math.pi*2, 0, false); ctx.fill() ctx.begin
path(); ctx.fillstyle = "rgba(0,255,0,1)"; ctx.arc(160, 100, 100, math.pi*2, 0, false); ctx.fill(); ctx.restore(); ctx.begin
path(); ...
...++) { 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.begin
path(); 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.begin
path(); ctx.fi...
CustomEvent - Web APIs
event.deep
path an array of dom nodes through which the event has bubbled.
... event.composed
path() 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 x
path, 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 x
path is much faster.
... (to accommodate explorer, one could call an x
path wrapper instead of the x
path in the function below (as explorer supports x
path 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, x
pathresult.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
event.deep
path an array of dom nodes through which the event has bubbled.
... methods event.composed
path() 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
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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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', { key
path: '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 no
pathname 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, file
path) { const response = await fetch(file
path); 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 file
path = 'dtmf.mp3'; const sample = await getfile(audioctx, file
path); 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.begin
path(); 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.begin
path(); 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
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 x
path, a selection language for trees.
...each template matches (using x
path) 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
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
/* 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
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
x
path x
path 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
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.begin
path(); c.arc(x, y, 10, 0, math.pi*2); c.close
path(); 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
_/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
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
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
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.
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 <text
path> 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
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> <clip
path> <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> <text
path> <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>, <text
path>, <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>, <clip
path>, <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 <text
path> 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>, <text
path>, <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>, <m
path>, <pattern>, <radialgradient>, <script>, <set>, <text
path>, <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>, <text
path>, and <use> scalable vector graphics (svg) 1.1 (second edition)the definition of 'seed' in that specification.
<a> - SVG: Scalable Vector Graphics
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>, <clip
path>, <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
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
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>, <clip
path>, <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
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
="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>, <clip
path>, <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
usage context categoriestext content elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clip
path>, <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
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
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>, <clip
path>, <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
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
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
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
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>, <clip
path>, <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
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/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path expression that specifies the nodes to be processed.
<xsl:copy-of> - XSLT: Extensible Stylesheet Language Transformations
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path expression that specifies what is to be copied.
<xsl:for-each> - XSLT: Extensible Stylesheet Language Transformations
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path expression to select nodes to be processed.
<xsl:if> - XSLT: Extensible Stylesheet Language Transformations
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path expression that can be evaluated (using the rules defined for boolean( ) if necessary) to a boolean value.
<xsl:key> - XSLT: Extensible Stylesheet Language Transformations
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the <xsl:key> element declares a named key which can be used elsewhere in the stylesheet with the key( ) function.
... use specifies an x
path expression that will be used to determine the value of the key for each of the applicable nodes.
<xsl:param> - XSLT: Extensible Stylesheet Language Transformations
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the <xsl:param> element establishes a parameter by name and, optionally, a default value for that parameter.
... optional attributes select uses an x
path expression to provide a default value if none is specified.
<xsl:sort> - XSLT: Extensible Stylesheet Language Transformations
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path expression to specify the nodes to be sorted.
<xsl:value-of> - XSLT: Extensible Stylesheet Language Transformations
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the <xsl:value-of> element evaluates an x
path 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 x
path expression to be evaluated and written to the output tree.
<xsl:variable> - XSLT: Extensible Stylesheet Language Transformations
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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 x
path expression.
Transforming XML with XSLT - XSLT: Extensible Stylesheet Language Transformations
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes an overview the separation of content and presentation is a key design feature of xml.
... xslt/x
path 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...
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", {key
path: "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/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, base
path); 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.
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 plugin
path', 'cfx xpi', 'wget --post-file=pluginname.xpi http://localhost:8888/ || echo>/dev/null' ].join('&&') } }, watch: { xpi: { files: ['plugin
path/**'], 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.
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.
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,x
pathresult.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 x
path expressions.
JS XPCOM - Archive of obsolete content
for example, var nsfile = components.constructor("@mozilla.org/file/local;1", "nsifile", "initwith
path"); var file = new nsfile(file
path); they can also be created and initialized manually: var file = components.classes["@mozilla.org/file/local;1"] .createinstance(components.interfaces.nsifile); file.initwith
path(file
path); 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.initwith
path("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 x
path 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.
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.begin
path(); 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.begin
path(); 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.
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.begin
path(); 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.
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.begin
path(); 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).
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...
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...
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_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_protectedauthentication
path 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...
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.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_protectedauthentication
path 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 r
path 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 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.
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.
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 ...
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.begin
path(); 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.begin
path(); 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.begin
path(); 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.begin
path(); 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.begin
path(); 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.
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.begin
path(); 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.begin
path(); 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.begin
path(); 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.begin
path(); ctx.moveto(0, 50); ctx.lineto(300, 50); ctx.stroke(); // dashed line with offset of 4 ctx.begin
path(); 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.begin
path(); 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.begin
path(); 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.begin
path(); 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.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.begin
path(); 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.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.begin
path(); 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.begin
path(); 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.
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
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
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; } ...
How to create a DOM tree - Web APIs
dom trees can be queried using x
path 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.begin
path(); context.strokestyle = 'black'; context.linewidth = 1; context.moveto(x1, y1); context.lineto(x2, y2); context.stroke(); context.close
path(); } 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.begin
path(); context.strokestyle = 'black'; context.linewidth = 1; context.moveto(x1, y1); context.lineto(x2, y2); context.stroke(); context.close
path(); } 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.begin
path(); context.strokestyle = 'black'; context.linewidth = 1; context.moveto(x1, y1); context.lineto(x2, y2); context.stroke(); context.close
path(); } result specifications specification status ui eventsthe definition of 'mouseup' in that specification.
Fetch API - Web APIs
the fetch() method takes one mandatory argument, the
path to the resource you want to fetch.
IDBCursor.source - Web APIs
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, key
path: "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
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", { key
path: "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", { key
path: "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", { key
path: "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", { key
path: "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", key
path: "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 key
path readonly domstring the key
path of this index.
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", { key
path: "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 }); ...
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", { key
path: "tasktitle" }); ...
IDBOpenDBRequest.onupgradeneeded - Web APIs
var store = db.createobjectstore("books", {key
path: "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", { key
path: "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.
MouseEvent.region - Web APIs
<canvas id="canvas"></canvas> <script> var canvas = document.getelementbyid("canvas"); var ctx = canvas.getcontext("2d"); ctx.begin
path(); 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> ...
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.begin
path(); 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.begin
path(); 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.begin
path(); 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
// 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
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
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
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.
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.
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.begin
path(); 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
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
syntax objref = window.pkcs11 example window.pkcs11.addmodule(smod, sec
path, 0, 0); notes see nsidompkcs11 for more information about how to manipulate pkcs11 objects.
Window.screenLeft - Web APIs
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.begin
path(); 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
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.begin
path(); 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
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.begin
path(); 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
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.begin
path(); 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
creating a worker is done by calling the worker("
path/to/worker/script") constructor.
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.
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
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
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes exsl:object-type() returns a string that indicates the type of the specified object.
Common (exsl) - EXSLT
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the exslt common package provides basic functions that expand upon the capabilities of xslt.
math:highest() - EXSLT
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path 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
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes math:max() returns the maximum value of a node-set.
math:min() - EXSLT
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes math:min() returns the minimum value of a node-set.
Math (math) - EXSLT
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the exslt math package provides functions for working with numeric values and comparing nodes.
regexp:match() - EXSLT
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes regexp:match() performs regular expression matching on a string, returning the submatches found as a result.
regexp:replace() - EXSLT
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes regexp:replace() replaces the portions of a string that match a given regular expression with the contents of another string.
regexp:test() - EXSLT
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes regexp:test() tests to see whether a string matches a specified regular expression.
Regular expressions (regexp) - EXSLT
xslt/x
path reference: xslt elements, exslt functions, x
path functions, x
path axes the exslt regular expressions package provides functions that allow testing, matching, and replacing text using javascript style regular expressions.
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
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.
<button>: The Button element - HTML: Hypertext Markup Language
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
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
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.begin
path(); 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
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
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.
<s> - HTML: Hypertext Markup Language
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
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.
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, full
path] = 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).
<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.
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>, <text
path>, <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>, <clip
path>, <defs>, <ellipse>, <foreignobject>, <g>, <glyph>, <image>, <line>, <lineargradient>, <marker>, <mask>, <missing-glyph>, <
path>, <pattern>, <polygon>, <polyline>, <radialgradient>, <rect>, <svg>, <switch>, <symbol>, <text>, <text
path>, <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>, <clip
path>, <defs>, <ellipse>, <foreignobject>, <g>, <glyph>, <image>, <line>, <lineargradient>, <marker>, <mask>, <missing-glyph>, <
path>, <pattern>, <polygon>, <polyline>, <radialgradient>, <rect>, <svg>, <switch>, <symbol>, <text>, <text
path>, <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>, <text
path>, <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>, <text
path>, <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>, <text
path>, <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>, <text
path>, <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>, <text
path>, <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>, <text
path>, <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>, <text
path>, <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>, <text
path>, <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>, <text
path>, <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>, <text
path>, <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>, <text
path>, <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
as a presentation attribute, it can be applied to any element but it has effect only on the following four elements: <altglyph>, <text
path>, <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>, <text
path>, <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>, <text
path>, <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
as a presentation attribute, it can be applied to any element but it has noticeable effects mostly on the following nineteen elements: <a>, <circle>, <clip
path>, <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
thirty-seven elements are using this attribute: <a>, <altglyph>, <animate>, <animatemotion>, <animatetransform>, <circle>, <defs>, <desc>, <ellipse>, <foreignobject>, <g>, <image>, <line>, <lineargradient>, <marker>, <metadata>, <m
path>, <
path>, <pattern>, <polygon>, <polyline>, <radialgradient>, <rect>, <script>, <set>, <stop>, <style>, <svg>, <switch>, <symbol>, <text>, <text
path>, <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
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>, <text
path>, <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>, <text
path>, 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>, <clip
path>, <defs>, <ellipse>, <foreignobject>, <g>, <image>, <line>, <marker>, <mask>, <
path>, <pattern>, <polygon>, <polyline>, <rect>, <svg>, <switch>, <symbol>, <text>, <text
path>, <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> <text
path> <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>, <text
path>, <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>, <text
path>, <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
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>, <text
path>, <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>, <clip
path>, <cursor>, <defs>, <discard>, <ellipse>, <foreignobject>, <g>, <iframe>, <image>, <line>, <mask>, <
path>, <pattern>, <polygon>, <polyline>, <rect>, <set>, <svg>, <switch>, <text>, <text
path>, <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>, <text
path>, <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'> ...
textLength - SVG: Scalable Vector Graphics
four elements are using this attribute: <text>, <text
path>, <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>, <text
path>, <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>, <text
path>, <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>, <m
path>, <pattern>, <radialgradient>, <script>, <set>, <text
path>, <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>, <m
path>, <pattern>, <radialgradient>, <script>, <set>, <text
path>, <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
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>, <clip
path>, <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
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
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
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.
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.composed
path: returns the event’s
path (objects on which listeners will be invoked).