Search completed in 1.00 seconds.
591 results for "template":
Your results are loading. Please wait...
Template literals (Template strings) - JavaScript
template literals are string literals allowing embedded expressions.
... they were called "template strings" in prior editions of the es2015 specification.
... syntax `string text` `string text line 1 string text line 2` `string text ${expression} string text` tag`string text ${expression} string text` description template literals are enclosed by the backtick (` `) (grave accent) character instead of double or single quotes.
...And 23 more matches
<template>: The Content Template element - HTML: Hypertext Markup Language
WebHTMLElementtemplate
the html content template (<template>) element is a mechanism for holding html that is not to be rendered immediately when a page is loaded but may be instantiated subsequently during runtime using javascript.
... think of a template as a content fragment that is being stored for subsequent use in the document.
... while the parser does process the contents of the <template> element while loading the page, it does so only to ensure that those contents are valid; the element's contents are not rendered, however.
...And 11 more matches
nsIXULTemplateBuilder
the nsitemplatebuilder interface controls the display of elements using a xul template element and is automatically attached to an element containing a datasources attribute.
... a template builder, given an input source of data, a template, and a reference point, generates a list of results from the input, and copies part of the template for each result.
... templates may generate content recursively, using the same template, but with the previous iteration's results as the reference point.
...And 41 more matches
nsIXULTemplateQueryProcessor
content/xul/templates/public/nsixultemplatequeryprocessor.idlscriptable a query processor takes a template query and generates results for it given a datasource and a reference point.
... there is a one-to-one relationship between a template builder and a query processor.
... the template builder creates the query processor, and there is no other means to retrieve it.
...And 34 more matches
Templates - Archive of obsolete content
to allow the creation of elements based on rdf data, you need to provide a simple template which will be duplicated for each element that is created.
... the template is created using the template element.
...the template element should be placed inside the container that will contain the constructed elements.
...And 24 more matches
Using templates and slots - Web Components
this article explains how you can use the <template> and <slot> elements to create a flexible template that can then be used to populate the shadow dom of a web component.
... the truth about templates when you have to reuse the same markup structures repeatedly on a web page, it makes sense to use some kind of a template rather than repeating the same structure over and over again.
... this was possible before, but it is made a lot easier by the html <template> element (which is well-supported in modern browsers).
...And 23 more matches
Template Builder Interface - Archive of obsolete content
if so, a template builder will be created for the element and attached to the element.
...both types of builders implement the nsixultemplatebuilder interface, while the tree builder also implements the nsixultreebuilder interface.
...templates can only be used in xul documents, however, there is no requirement that the templates generate xul elements.
...And 22 more matches
Grid template areas - CSS: Cascading Style Sheets
this method involves placing our items using named template areas, and we will find out exactly how this method works.
... we can also define an area by giving it a name and then specify the location of that area in the value of the grid-template-areas property.
... .wrapper { display: grid; grid-template-columns: repeat(9, 1fr); grid-auto-rows: minmax(100px, auto); grid-template-areas: "hd hd hd hd hd hd hd hd hd" "sd sd sd main main main main main main" "ft ft ft ft ft ft ft ft ft"; } * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; max-width: 940px; margin: 0 aut...
...And 22 more matches
Template Logging - Archive of obsolete content
« previous debugging problems with a template can be difficult as many problems are logic errors that are often not possible to determine automatically.
... for example, if you spell a value wrong, no data may be returned, but the template system won't know that that this was because of a spelling error, or simply that there shouldn't be any data anyway.
... fortunately, some debugging and logging support is provided with templates that may help.
...And 18 more matches
Additional Template Attributes - Archive of obsolete content
« previousnext » referencing templates all the templates used so far have had the template placed inside the root element with the datasources attribute.
... however, you may use the template attribute to refer to a template located elsewhere within the document.
... this allows you to share the same template among two different parts of the user interface.
...And 12 more matches
Building Menus With Templates - Archive of obsolete content
« previousnext » menus may be generated using a template in the same manner as other elements.
...this means that a menu created with a template will not have any of the generated items until the user opens the menu, or a script opens the menu.
...it is very simple to create a menu using a template.
...And 8 more matches
XML Templates - Archive of obsolete content
when an xml source is desired, specify a querytype attribute on the root node of the template to the value xml.
... this indicates to the template builder that an xml source is being used as that the queries use syntax that is specific to xml.
... an example: <listbox datasources="people.xml" ref="*" querytype="xml"> <template> ...
...And 7 more matches
XUL Template Primer - Bindings - Archive of obsolete content
see xul:template guide for up to date documentation.
... overview this document expands on the xul template primer by introducing the <bindings> element in the extended xul template syntax.
... <?xml version="1.0"?> <?xml-stylesheet href="chrome://global/skin" type="text/css"?> <window xmlns:html="http://www.w3.org/1999/xhtml" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" align="vertical"> <vbox datasources="friends.rdf" ref="urn:root"> <template> <rule> <conditions> <content uri="?uri"/> <triple subject="?uri" predicate="http://home.netscape.com/nc-rdf#friends" object="?friends"/> <member container="?friends" child="?friend"/> <triple subject="?friend" predicate="http://home.netscape.com/nc-rdf#name" object="?name"/...
...And 7 more matches
Trees and Templates - Archive of obsolete content
« previousnext » the following describes how to use a template with a tree.
... adding datasources to trees when using a tree, you will often use a template to build its content, to handle a large amount of hierarchial data.
... using a template with a tree uses very much the same syntax as with other elements.
...And 6 more matches
grid-template - CSS: Cascading Style Sheets
the grid-template css property is a shorthand property for defining grid columns, rows, and areas.
... constituent properties this property is a shorthand for the following css properties: grid-template-areas grid-template-columns grid-template-rows syntax /* keyword value */ grid-template: none; /* grid-template-rows / grid-template-columns values */ grid-template: 100px 1fr / 50px 1fr; grid-template: auto 1fr / auto 1fr auto; grid-template: [linename] 100px / [columnname1] 30% [columnname2] 70%; grid-template: fit-content(100px) / fit-content(40%); /* grid-template-areas grid-template-rows / grid-template-column values */ grid-template: "a a a" "...
...b b b"; grid-template: "a a a" 20% "b b b" auto; grid-template: [header-top] "a a a" [header-bottom] [main-top] "b b b" 1fr [main-bottom] / auto 1fr auto; /* global values */ grid-template: inherit; grid-template: initial; grid-template: unset; values none is a keyword that sets all three longhand properties to none, meaning there is no explicit grid.
...And 6 more matches
Template and Tree Listeners - Archive of obsolete content
« previousnext » there are several listeners (or observers) used during the template build process, each used for different purposes.
... these each implement a different xpcom interface, as listed below: nsixulbuilderlistener - used to listen to template rebuilds.
... listening for template rebuilds the first of these is the simplest and involves two methods, willrebuild and didrebuild.
...And 5 more matches
SQLite Templates - Archive of obsolete content
« previousnext » templates may use a datasource that is retrieved from an sqlite database, such as those used by the mozstorage api.
...to do this, set the querytype attribute on the root node of the template to the value storage.
... <listbox datasources="profile:userdata.sqlite" ref="*" querytype="storage"> <template> <query> select name from myfriends </query> <action> <listitem uri="?" label="?name"/> </action> </template> </listbox> the query returns the list of values from the 'name' column in the table 'myfriends'.
...And 4 more matches
Using Recursive Templates - Archive of obsolete content
« previousnext » you may recall that templates generate content recursively.
... after the data is generated, each result is used as the new reference point for a nested iteration of the template.
...<groupbox type="menu" datasources="people.xml" ref="*" querytype="xml"> <template> <query expr="*"/> <action> <vbox uri="?" class="indent"> <label value="?name"/> </vbox> </action> </template> </groupbox> in this simplified example, the xpath expression just gets the list of child elements of the reference node.
...And 4 more matches
nsIXULTemplateResult
content/xul/templates/public/nsixultemplateresult.idlscriptable a single result generated from a template query.
... mayprocesschildren boolean true if the template builder may use this result as the reference point for additional recursive processing of the template.
... the template builder will reprocess the template using this result as the reference point and generate output content that is expected to be inserted as children of the output generated for this result.
...And 4 more matches
<xsl:template> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementtemplate
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:template> element defines an output producing template.
... syntax <xsl:template match=pattern name=name mode=name priority=number> <xsl:param> [optional] template </xsl:template> required attributes none.
... optional attributes match specifies a pattern that determines the elements for which this template should be used.
...And 4 more matches
HTMLTemplateElement - Web APIs
the htmltemplateelement interface enables access to the contents of an html <template> element.
...aco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmlelement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#d4dde4" fill="none"/><line x1="501" y1="25" x2="509" y2="25" stroke="#d4dde4"/><line x1="509" y1="25" x2="509" y2="90" stroke="#d4dde4"/><line x1="509" y1="90" x2="492" y2="90" stroke="#d4dde4"/><a xlink:href="/docs/web/api/htmltemplateelement" target="_top"><rect x="301" y="65" width="190" height="50" fill="#f4f7f8" stroke="#d4dde4" stroke-width="2px" /><text x="396" y="94" font-size="12px" font-family="consolas,monaco,andale mono,monospace" fill="#4d4e53" text-anchor="middle" alignment-baseline="middle">htmltemplateelement</text></a></svg></div> a:hover text { fill: #0095dd; pointer-events: all;} properties this in...
... content read only a read-only documentfragment which contains the dom subtree representing the <template> element's template contents.
...And 2 more matches
template - Archive of obsolete content
« xul reference home template type: id for template generated elements, this attribute may optionally be placed on the root node (the element with the datasources attribute) to refer to a template that exists elsewhere in the xul code.
... this template attribute should be set to the id of the template element.
... this might be used to share a single template between multiple trees or menus.
... if this attribute is not specified, there should be a template element directly inside the node.
template - Archive of obsolete content
« xul reference home [ examples | attributes | properties | methods | related ] used to declare a template for rule-based construction of elements.
...if not specified, the variable specified in the uri attribute of the content tag in the template's first rule is used.
...if not specified, the variable specified in the uri attribute in the action body of the template's first rule is used.
...rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
grid-template-areas - CSS: Cascading Style Sheets
the grid-template-areas css property specifies named grid areas, establishing the cells in the grid and assigning them names.
... syntax /* keyword value */ grid-template-areas: none; /* <string> values */ grid-template-areas: "a b"; grid-template-areas: "a b b" "a c d"; /* global values */ grid-template-areas: inherit; grid-template-areas: initial; grid-template-areas: unset; values none the grid container doesn’t define any named grid areas.
...rmal definition initial valuenoneapplies togrid containersinheritednocomputed valueas specifiedanimation typediscrete formal syntax none | <string>+ examples specifying named grid areas html <section id="page"> <header>header</header> <nav>navigation</nav> <main>main area</main> <footer>footer</footer> </section> css #page { display: grid; width: 100%; height: 250px; grid-template-areas: "head head" "nav main" "nav foot"; grid-template-rows: 50px 1fr 30px; grid-template-columns: 150px 1fr; } #page > header { grid-area: head; background-color: #8ca0ff; } #page > nav { grid-area: nav; background-color: #ffa08c; } #page > main { grid-area: main; background-color: #ffff64; } #page > footer { grid-area: foot;...
... background-color: #8cffa0; } result specifications specification status comment css grid layoutthe definition of 'grid-template-areas' in that specification.
grid-template-columns - CSS: Cascading Style Sheets
the grid-template-columns css property defines the line names and track sizing functions of the grid columns.
... syntax /* keyword value */ grid-template-columns: none; /* <track-list> values */ grid-template-columns: 100px 1fr; grid-template-columns: [linename] 100px; grid-template-columns: [linename1] 100px [linename2 linename3]; grid-template-columns: minmax(100px, 1fr); grid-template-columns: fit-content(40%); grid-template-columns: repeat(3, 200px); grid-template-columns: subgrid; /* <auto-track-list> values */ grid-template-columns: 200px repeat(auto-fill, 100px) 300px; grid-template-columns: minmax(100px, max-content) repeat(auto-fill, 200px) 20%; gri...
...d-template-columns: [linename1] 100px [linename2] repeat(auto-fit, [linename3 linename4] 300px) 100px; grid-template-columns: [linename1 linename2] 100px repeat(auto-fit, [linename1] 300px) [linename3]; /* global values */ grid-template-columns: inherit; grid-template-columns: initial; grid-template-columns: unset; values none indicates that there is no explicit grid.
...percentage> | <flex> | min-content | max-content | auto<inflexible-breadth> = <length> | <percentage> | min-content | max-content | auto<fixed-breadth> = <length-percentage>where <length-percentage> = <length> | <percentage> examples specifying grid column sizes html <div id="grid"> <div id="areaa">a</div> <div id="areab">b</div> </div> css #grid { display: grid; width: 100%; grid-template-columns: 50px 1fr; } #areaa { background-color: lime; } #areab { background-color: yellow; } result specifications specification status comment css grid layoutthe definition of 'grid-template-columns' in that specification.
grid-template-rows - CSS: Cascading Style Sheets
the grid-template-rows css property defines the line names and track sizing functions of the grid rows.
... syntax /* keyword value */ grid-template-rows: none; /* <track-list> values */ grid-template-rows: 100px 1fr; grid-template-rows: [linename] 100px; grid-template-rows: [linename1] 100px [linename2 linename3]; grid-template-rows: minmax(100px, 1fr); grid-template-rows: fit-content(40%); grid-template-rows: repeat(3, 200px); grid-template-rows: subgrid; /* <auto-track-list> values */ grid-template-rows: 200px repeat(auto-fill, 100px) 300px; grid-template-rows: minmax(100px, max-content) repeat(auto-fill, 200px) 20%; grid-template-rows: [linename1] 1...
...00px [linename2] repeat(auto-fit, [linename3 linename4] 300px) 100px; grid-template-rows: [linename1 linename2] 100px repeat(auto-fit, [linename1] 300px) [linename3]; /* global values */ grid-template-rows: inherit; grid-template-rows: initial; grid-template-rows: unset; this property may be specified as: either the keyword value none or a <track-list> value or an <auto-track-list> value.
...-percentage> | <flex> | min-content | max-content | auto<inflexible-breadth> = <length> | <percentage> | min-content | max-content | auto<fixed-breadth> = <length-percentage>where <length-percentage> = <length> | <percentage> examples specifying grid row sizes html <div id="grid"> <div id="areaa">a</div> <div id="areab">b</div> </div> css #grid { display: grid; height: 100px; grid-template-rows: 30px 1fr; } #areaa { background-color: lime; } #areab { background-color: yellow; } result specifications specification status comment css grid layoutthe definition of 'grid-template-rows' in that specification.
Template Guide - Archive of obsolete content
basics of xul templates introduction rule compilation rdf template syntax result generation rdf query syntax actions recursive generation simple example bindings additional navigation filtering static content simple query syntax containment properties xml template syntax xml templates xml assignments sql template syntax sqlite templates common template syntax attribute substitution multiple rules using recursive templates building menus with templates special condition tests multiple queries using multiple queries to generate more results building trees with templates building trees building hierarchical trees template modifications template builder interface template and tree listeners rdf modifications additional topics sorting r...
...esults additional template attributes template logging xml namespaces alternative approaches javascript templates xuljsdatasource: a component for extensions, which bring a "javascript template syntax".
... it allows to use javascript objects as a data source for xul templates.
Mozilla Framework Based on Templates (MFBT)
the mozilla framework based on templates ("mfbt") is the central repository for macros, functions, and data structures used throughout mozilla code, including in the javascript engine.
... rangedptr.h implements rangedptr, a smart pointer template whose value may be manipulated only within a range specified at construction time, and which may be dereferenced only at valid locations in that range.
... refptr.h implements various smart pointer templates to simplify reference counting of values of particular classes.
HTMLTemplateElement.content - Web APIs
the htmltemplateelement.content property returns a <template> element's template contents (a documentfragment).
... syntax var documentfragment = templateelement.content example var templateelement = document.queryselector("#foo"); var documentfragment = templateelement.content.clonenode(true); specifications specification status comment html living standardthe definition of 'htmltemplateelement interface' in that specification.
... living standard html5the definition of 'htmltemplateelement interface' in that specification.
Cookbook template - CSS: Cascading Style Sheets
note: this is a template page for a css cookbook page.
... please use this as a raw template when you create a new cookbook page.
... comment in italics are information about how to use part of the template.
<xsl:apply-templates> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:apply-templates> element selects a set of nodes in the input tree and instructs the processor to apply the proper templates to them.
... syntax <xsl:apply-templates select=expression mode=name> <xsl:with-param> [optional] <xsl:sort> [optional] </xsl:apply-templates> required attributes none.
... type instruction, appears within a template.
<xsl:call-template> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:call-template> element invokes a named template.
... syntax <xsl:call-template name=name> <xsl:with-param> [optional] </xsl:call-template> required attribute name specifies the name of the template you wish to invoke.
... type instruction, appears within a template.
Tamarin Acceptance Test Template - Archive of obsolete content
this is the test template for tamarin acceptance tests (placed in test/acceptance/feature_name): /* -*- mode: js; c-basic-offset: 4; indent-tabs-mode: nil; tab-width: 4 -*- */ /* vi: set ts=4 sw=4 expandtab: (add to ~/.vimrc: set modeline modelines=5) */ /* ***** begin license block ***** * version: mpl 1.1/gpl 2.0/lgpl 2.1 * * the contents of this file are subject to the mozilla public license version * 1.1 (the "license"); you may not use this file except in compliance with * the license.
template.container - Archive of obsolete content
if not specified, the variable specified in the uri attribute of the content tag in the template's first rule is used.
Index - Archive of obsolete content
655 tamarin acceptance test template this is the test template for tamarin acceptance tests (placed in test/acceptance/feature_name): 656 actionscript performance tests performance tests for tamarin are located in the test/performance directory.
... 696 anonymous content a binding can specify an anonymous content template using the content element.
... this template describes a content tree that will be generated around the bound element during binding attachment.
...And 70 more matches
Index - Archive of obsolete content
ArchiveMozillaXULIndex
362 template xul attributes, xul reference no summary!
... 363 template.container xul attributes, xul reference no summary!
...the xul template guide has lots of detailed information on using xul templates.
...And 60 more matches
nss tech note1
the main non-streaming apis for these two decoders have an identical prototype : secstatus sec_asn1decodeitem(prarenapool *pool, void *dest, const sec_asn1template *t, secitem *item); secstatus sec_quickderdecodeitem(prarenapool* arena, void* dest, const sec_asn1template* templateentry, secitem* src); here is a description of the arguments : secitem* src† is a structure containing a pointer to the binary data to be decoded, as well as its size.
... const sec_asn1template* templateentry is a pointer to one or more decoder templates.
... the number of required templates is determined by the type of the first template.when multiple templates are required, the pointer must point to a null-terminated array of templates.
...And 37 more matches
RDF in Mozilla FAQ - Archive of obsolete content
second, and more importantly, the rdf model is used along with xul templates as an abstract "api" for displaying information.
...} alternatively, some datasources have "special" rdf-friendly contractids that make it easy to instantiate the datasource using either the nsirdfserivce's getdatasource() method or the datasources attribute on a xul template.
...for example, the following xul fragment illustrates how to add the bookmarks service as a datasource into a xul template.
...And 25 more matches
Rule Compilation - Archive of obsolete content
« previousnext » query a xul template is made up of a query and a series of rules.
...the exact syntax is dependent on the type of datasource used in the template.
...a query is declared with the query tag (new to ff3; ff2 only worked with rdf datasources and had no query tag), which you would place directly inside the <template>.
...And 20 more matches
Grids - Learn web development
.container { display: grid; grid-template-columns: 200px 200px 200px; } add the 2nd declaration to your css rule, then reload the page, and you should see that the items have rearranged themselves one into each cell of the created grid.
...rgin: 2em auto; font: .9em/1.2 arial, helvetica, sans-serif; } .container > div { border-radius: 5px; padding: 10px; background-color: rgb(207,232,220); border: 2px solid rgb(79,185,227); } <div class="container"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> <div>six</div> <div>seven</div> </div> .container { display: grid; grid-template-columns: 200px 200px 200px; } flexible grids with the fr unit in addition to creating grids using lengths and percentages, we can use the fr unit to flexibly size grid rows and columns.
... .container { display: grid; grid-template-columns: 1fr 1fr 1fr; } you should now see that you have flexible tracks.
...And 17 more matches
Static Content - Archive of obsolete content
instead it will be what is called static content in a template.
... the static content is any content that is a sibling of the template element.
... this content is displayed as is without affecting the generated content from the template.
...And 16 more matches
Creating our first Vue component - Learn web development
vue components are written as a combination of javascript objects that manage the app's data and an html-based template syntax that maps to the underlying dom structure.
... create the component's template section by adding <template></template> to the top of the file.
... create a <script></script> section below your template section.
...And 16 more matches
Basic Concepts of grid layout - CSS: Cascading Style Sheets
grid tracks we define rows and columns on our grid with the grid-template-columns and grid-template-rows properties.
... i can add to our earlier example by adding the grid-template-columns property, then defining the size of the column tracks.
... <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> </div> .wrapper { display: grid; grid-template-columns: 200px 200px 200px; } * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } the fr unit tracks can be defined using any length unit.
...And 16 more matches
Introduction - Archive of obsolete content
next » a xul template is a means of producing a block of content for each result from some query or query-like operation.
...the template syntax allows for different rules to generate different content based on particular criteria as well as set attribute values from returned results.
...effectively, xul templates are the xul way of doing databinding.
...And 15 more matches
RDF Modifications - Archive of obsolete content
« previousnext » one of the most useful aspects of using templates with rdf datasources is that when the rdf datasource changes, for instance a new triple is added, or a triple is removed, the template updates accordingly, adding or removing result output as needed.
...this involves a third type of observer involved in a template builder, an nsirdfobserver, used to listen for modifications to the rdf datasource.
...the template builder uses these notifcations to update the template as necessary based on the new or removed information.
...And 15 more matches
XUL element attributes - Archive of obsolete content
this will be set by the template builder as needed.
...when generating content from a template this is used to determine which resources from the datasource are containers and thus can have child nodes and which ones are not containers.
... datasources type: space separated list of datasource uris a space-separated list of datasources that an element's template will use for content generation.
...And 14 more matches
Getting started with Vue - Learn web development
vue components are written as a combination of javascript objects that manage the app's data and an html-based template syntax that maps to the underlying dom structure.
...most of the time, vue components are written using a special html template syntax.
... index.html: this is the template for your app.
...And 13 more matches
Index - XSLT: Extensible Stylesheet Language Transformations
WebXSLTIndex
an instruction, on the other hand, is associated with a template.
... a stylesheet may include several templates.
...an lre also appears in a template.
...And 13 more matches
React interactivity: Editing, filtering, conditional rendering - Learn web development
add the following line just inside the top of your todo(props) { … } component definition: const [isediting, setediting] = usestate(false); next, we're going to rethink the <todo /> component — from now on, we want it to display one of two possible “templates", rather than the single template it's used so far: the "view" template, when we are just viewing a todo; this is what we’ve used in rest of the tutorial so far.
... the "editing" template, when we are editing a todo.
... copy this block of code into the todo() function, beneath your usestate() hook but above the return statement: const editingtemplate = ( <form classname="stack-small"> <div classname="form-group"> <label classname="todo-label" htmlfor={props.id}> new name for {props.name} </label> <input id={props.id} classname="todo-text" type="text" /> </div> <div classname="btn-group"> <button type="button" classname="btn todo-cancel"> cancel <span classname="visually-hidden">renaming {props.name}</span> </button> <button type="submit" classname="btn btn__primary todo-edit"> save <span classname="visually-hidden">new name for {props.name}</span> </button> </div> </form> ); const ...
...And 12 more matches
Layout using named grid lines - CSS: Cascading Style Sheets
in previous guides we’ve looked at placing items by the lines created by defining grid tracks and also how to place items using named template areas.
... naming lines when defining a grid you can assign some or all of the lines in your grid a name when you define your grid with the grid-template-rows and grid-template-columns properties.
... .wrapper { display: grid; grid-template-columns: [main-start] 1fr [content-start] 1fr [content-end] 1fr [main-end]; grid-template-rows: [main-start] 100px [content-start] 100px [content-end] 100px [main-end]; } once the lines have names, we can use the name to place the item rather than the line number.
...And 12 more matches
Filtering - Archive of obsolete content
for example, you wish the user to be able to select a value from a list, and the template results should be filtered based on that value.
... this can be done by modifying the dom nodes inside the query and rebuilding the template.
...whether a triple or member is added or removed, the template must be rebuilt by calling the rebuild method.
...And 11 more matches
Building Trees - Archive of obsolete content
« previousnext » the most common element to use with a template is the tree.
... you can use a template with a tree just like any other template.
... however, since templates are often used with trees—especially with large amounts of data—the template system supports a special builder just for creating trees.
...And 10 more matches
Multiple Queries - Archive of obsolete content
« previousnext » so far, every template has contained only a single query, even for recursive content.
...the following is the basic structure of a template with multiple queries: <listbox datasources="..." ref="..."> <queryset> <query> ...
...here is an example using an rdf datasource: <hbox id="photoslist" datasources="template-guide-photos3.rdf" ref="http://www.xulplanet.com/rdf/myphotos"> <template> <queryset> <query> <content uri="?start"/> <member container="?start" child="?photo"/> <triple subject="?photo" predicate="http://purl.org/dc/elements/1.1/title" object="canal"/> </query> <action> <button uri="?photo" image="?phot...
...And 10 more matches
Realizing common layouts using CSS Grid Layout - CSS: Cascading Style Sheets
we will look at an example using grid-template-areas, a typical 12-column flexible grid system, and also a product listing using auto-placement.
... a responsive layout with 1 to 3 fluid columns using grid-template-areas many websites are a variation of this type of layout, with content, sidebars, a header and a footer.
... i am going to create this layout using the named template areas that we learned about in the guide grid template areas.
...And 10 more matches
Index
MozillaTechXPCOMIndex
rick potts wrote a templated-based generic factory (nsfactory<t>) that simplifies the factory creation process that just requires writing a createinstance() method.
... 1110 nsixulbuilderlistener interfaces, interfaces:scriptable, xpcom, xpcom interface reference called after a template builder has rebuilt its content.
... 1113 nsixultemplatebuilder interfaces, xpcom, xpcom api reference, xpcom interface reference, xul the nsitemplatebuilder interface controls the display of elements using a xul template element and is automatically attached to an element containing a datasources attribute.
...And 9 more matches
Auto-placement in CSS Grid Layout - CSS: Cascading Style Sheets
* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 10px; } <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> </div> default rules for auto-placement as you can see with the above example, if you create a grid all child items will lay themselves out one into each grid cell.
...if you have created additional rows using the grid-template-rows property then grid will continue placing items in these rows.
... border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> </div> .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 10px; grid-auto-rows: 100px; } you can use minmax() in your value for grid-auto-rows enabling the creation of rows that are a minimum size but then grow to fit content if it is taller.
...And 9 more matches
Line-based placement with CSS Grid - CSS: Cascading Style Sheets
* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 100px); } <div class="wrapper"> <div class="box1">one</div> <div class="box2">two</div> <div class="box3">three</div> <div class="box4">four</div> </div> positioning items by line number we can use line-based placement to control where these items sit on the grid.
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 100px); } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } <div class="wrapper"> <div class="box1">one</div> <div class="box2">two</div> <div class="box3">three</div> <div class="box4">four</div> </div> .box1 { grid-column-st...
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 100px); } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } <div class="wrapper"> <div class="box1">one</div> <div class="box2">two</div> <div class="box3">three</div> <div class="box4">four</div> </div> .box1 { grid-column: 1...
...And 9 more matches
How to implement a custom XUL query processor component - Archive of obsolete content
the xul template guide has lots of detailed information on using xul templates.
... xul provides template query processors for rdf, xml and sql (mozstorage).
...custom query processors are xpcom components, must implement the nsixultemplatequeryprocessor interface and follow some conventions for when registering the component.
...And 8 more matches
Result Generation - Archive of obsolete content
« previousnext » rdf in this section, we'll look at generating template output using rdf datasources.
...templates provide a means of navigating around using only arrows with specific labels.
...rel:relateditem rdf:resource="http://www.xulplanet.com/rdf/b"/> <rel:relateditem rdf:resource="http://www.xulplanet.com/rdf/c"/> <rel:relateditem rdf:resource="http://www.xulplanet.com/rdf/d"/> </rdf:description> <rdf:description rdf:about="http://www.xulplanet.com/rdf/c"> <rel:relateditem rdf:resource="http://www.xulplanet.com/rdf/d"/> </rdf:description> </rdf:rdf> for a xul template query, you first need to select a starting point in the rdf graph.
...And 8 more matches
Special Condition Tests - Archive of obsolete content
templates have a means of allowing a rule to match only if the generated content would be inserted inside an element with a particular tag name.
...this is useful for recursive templates, since the inner iterations may use different content.
... it's most useful to distinguish between the outer and inner levels during template generation.
...And 8 more matches
Vue conditional rendering: editing existing todos - Learn web development
vue components are written as a combination of javascript objects that manage the app's data and an html-based template syntax that maps to the underlying dom structure.
... copy the following code into that file: <template> <form class="stack-small" @submit.prevent="onsubmit"> <div> <label class="edit-label">edit name for &quot;{{label}}&quot;</label> <input :id="id" type="text" autocomplete="off" v-model.lazy.trim="newlabel" /> </div> <div class="btn-group"> <button type="button" class="btn" @click="oncancel"> cancel <span class="visually-hidden">editing {{label}}</s...
...pan> </button> <button type="submit" class="btn btn__primary"> save <span class="visually-hidden">edit for {{label}}</span> </button> </div> </form> </template> <script> export default { props: { label: { type: string, required: true }, id: { type: string, required: true } }, data() { return { newlabel: this.label }; }, methods: { onsubmit() { if (this.newlabel && this.newlabel !== this.label) { this.$emit("item-edited", this.newlabel); } }, oncancel() { this.$emit("edit-cancelled"); } } }; </script> <style scoped> .edit-label { font-family: arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #0b0c...
...And 8 more matches
Creating a Microsummary - Archive of obsolete content
add the xslt transform sheet to the generator by including it within a <template> element: <?xml version="1.0" encoding="utf-8"?> <generator xmlns="http://www.mozilla.org/microsummaries/0.1" name="firefox download count"> <template> <transform xmlns="http://www.w3.org/1999/xsl/transform" version="1.0"> </transform> </template> </generator> note that while microsummary generators can include arbitrary xslt, including xslt that produces rich text outpu...
... specifying the output type since the xslt transform sheet will generate a text microsummary, we should indicate this with the xslt <output> element: <?xml version="1.0" encoding="utf-8"?> <generator xmlns="http://www.mozilla.org/microsummaries/0.1" name="firefox download count"> <template> <transform xmlns="http://www.w3.org/1999/xsl/transform" version="1.0"> <output method="text"/> </transform> </template> </generator> using a simple xslt <template> the xslt processor transforms documents by comparing each xslt <template> element in the transform sheet to a set of nodes in the document.
... when a <template>'s match attribute matches a node, the processor performs the transformations specified by the content of the element.
...And 7 more matches
Anonymous Content - Archive of obsolete content
introduction a binding can specify an anonymous content template using the content element.
... this template describes a content tree that will be generated around the bound element during binding attachment.
...when a new binding is attached, the bindings in its explicit 'inherits' chain are checked to see if any have anonymous content templates.
...And 7 more matches
Actions - Archive of obsolete content
« previousnext » the content to generate in a template is specified using the <xul:action> element which should either be the next sibling of the <xul:query> element (if no rules need be specified) or be a direct child of a <xul:rule> element.
...<vbox datasources="http://www.xulplanet.com/ds/sample.rdf" ref="http://www.xulplanet.com/rdf/a"> <template> <query> <content uri="?start"/> <triple subject="?start" predicate="http://www.xulplanet.com/rdf/relateditem" object="?relateditem"/> </query> <action> <button uri="?relateditem" label="?relateditem"/> </action> </template> </vbox> in this example, we omit the <xul:rule> element around the <xul:action> as it is optional when we want to generate content unconditionally.
... instead, the action element is placed directly inside the <xul:template> element after the query is defined.
...And 7 more matches
Advanced Rules - Archive of obsolete content
rule conditions when a tree, menu or other element with a datasource generates content, the template builder first finds the resource referred to by the ref attribute.
...it serves as a placeholder as the template builder iterates through the resources.
...the root resource is the one specified by the ref attribute on the element containing the template.
...And 7 more matches
Server-side web frameworks - Learn web development
templates are often used to create html, but can also create other types of document.
... for example, the django template system allows you to specify variables using a "double-handlebars" syntax (e.g.
...the template system also provides support for expressions (with syntax: {% expression %}), which allow templates to perform simple operations like iterating list values passed into the template.
...And 7 more matches
Generating HTML - Web APIs
</xsl:stylesheet version="1.0"> a template matching the root node of the xml document is created and used to create the basic structure of the html page.
... <xsl:template match="/"> <html> <head> <title> <xsl:value-of select="/myns:article/myns:title"/> </title> <style type="text/css"> .mybox {margin:10px 155px 0 50px; border: 1px dotted #639ace; padding:0 5px 0 5px;} </style> </head> <body> <p class="mybox"> <span class="title"> <xsl:value-of select="/myns:article/myns:title"/> </span> </br> authors: <br /> <xsl:apply-templates select="/myns:article/myns:authors/myns:author"/> </p> <p class="mybox"> <xsl:apply-templates select="//myns:body"/> </p> </body> </html> </xsl:template> ...
... three more xsl:template's are needed to complete the example.
...And 7 more matches
XUL Questions and Answers - Archive of obsolete content
there are several options for displaying graphics and animation in xul: <html:canvas> svg <xul:image> (static images or animated gif; support for apng is planned) plugins templates with non-rdf datasources?
... support for non-rdf datasources for xul template is planned (bug 321170): xml datasources (bug 321171) storage (sqlite) datasources (bug 321172) when loading an xslt stylesheet into an xml i get the error: "error loading stylesheet: an xslt stylesheet load was blocked for security reasons." that error is from a security check that has been put up to safeguard against cross-site-scripting attacks.
... can a xul template be used for rss?
...And 6 more matches
Handling text — strings in JavaScript - Learn web development
template literals another type of string syntax that you may come across is template literals (sometimes referred to as template strings).
... to turn a standard string literal into a template literal, you have to replace the quote marks (' ', or " ") with backtick characters (` `).
... so, taking a simple example: let song = 'fight the youth'; would be turned into a template literal like so: song = `fight the youth`; if we want to concatenate strings, or include expression results inside them, traditional strings can be fiddly to write: let score = 9; let highestscore = 10; let output = 'i like the song "' + song + '".
...And 6 more matches
Ember Interactivity: Footer functionality, conditional rendering - Learn web development
along the way, we'll learn about using conditional rendering in our templates.
... finally, we need to make use of this new functionality in our footer.hbs template.
...we need to wire up the todo.hbs template to the service, so that checking the relevant checkbox changes the state of each todo.
...And 6 more matches
Routing in Ember - Learn web development
an ember application has a default "application" route, which is tied to the app/templates/application.hbs template.
... because that application template is the entry point to our todo app, we'll need to make some changes to allow for routing.
... to adjust our old way of rendering the todolist app, we'll first need to replace the todolist component invocation from the application template with an {{outlet}} call, which means "any sub-route will be rendered in place here".
...And 6 more matches
Adding a new todo form: Vue events, methods, and models - Learn web development
vue components are written as a combination of javascript objects that manage the app's data and an html-based template syntax that maps to the underlying dom structure.
... add a blank <template> and a <script> tag like before: <template></template> <script> export default {}; </script> let's add in an html form that lets you enter a new todo item and submit it into the app.
...update your template as follows: <template> <form> <label for="new-todo-input"> what needs to be done?
...And 6 more matches
Mail composition back end
pizzarro <rhp@netscape.com> contents overview sending messages nsimsgsend sending listener interfaces nsimsgsendlistener nsimsgcopyservicelistener copy operations copy to sent folder drafts templates "send later" sending unsent messages sending unsent messages listener quoting sample programs overview i've done considerable work in the past few weeks reorganizing the mail composition back end, so i thought it would be helpful to put together a small doc on the new interfaces and how one can use them.
...a "sent" folder) as well as the ability to store messages for features like "drafts" and "templates".
...the mode of delivery can also be specified for the "send later", "drafts" and "templates" operations.
...And 6 more matches
Box alignment in CSS Grid Layout - CSS: Cascading Style Sheets
auto normal start end center stretch baseline first baseline last baseline * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } .wrapper { display: grid; grid-template-columns: repeat(8, 1fr); grid-gap: 10px; grid-auto-rows: 100px; grid-template-areas: "a a a a b b b b" "a a a a b b b b" "c c c c d d d d" "c c c c d d d d"; align-items: start; } .item1 { grid-area: a; } .item2 { grid-area: b; } .item3 { grid-area: c; } .item4 { grid-area: d; } <div class="wrapper"> <div class="item1">item 1</div> <div class="item2">item 2</...
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } .wrapper { display: grid; grid-template-columns: repeat(8, 1fr); grid-gap: 10px; grid-auto-rows: 100px; grid-template-areas: "a a a a b b b b" "a a a a b b b b" "c c c c d d d d" "c c c c d d d d"; } .item1 { grid-area: a; } .item2 { grid-area: b; align-self: start; } .item3 { grid-area: c; align-self: end; } .item4 { grid-area: d; align-self: center; } <div class="wrapper"> <div class="item1">it...
...the first item in the example demonstrates this default alignment: * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } .wrapper { display: grid; grid-template-columns: repeat(8, 1fr); grid-gap: 10px; grid-auto-rows: 100px; grid-template-areas: "a a a a b b b b" "a a a a b b b b" "c c c c d d d d" "c c c c d d d d"; } .item1 { grid-area: a; } .item2 { grid-area: b; justify-self: start; } .item3 { grid-area: c; justify-self: end; } .item4 { grid-area: d; justify-self: center; } <div class="wrapper"> <div class="ite...
...And 6 more matches
grid - CSS: Cascading Style Sheets
WebCSSgrid
constituent properties this property is a shorthand for the following css properties: grid-auto-columns grid-auto-flow grid-auto-rows grid-template-areas grid-template-columns grid-template-rows syntax /* <'grid-template'> values */ grid: none; grid: "a" 100px "b" 1fr; grid: [linename1] "a" 100px [linename2]; grid: "a" 200px "b" min-content; grid: "a" minmax(100px, max-content) "b" 20%; grid: 100px / 200px; grid: minmax(400px, min-content) / repeat(auto-fill, 50px); /* <'grid-template-rows'> / [ auto-flow && dense?
.../ <'grid-template-columns'> values */ grid: auto-flow / 200px; grid: auto-flow dense / 30%; grid: auto-flow 300px / repeat(3, [line1 line2 line3] 200px); grid: auto-flow dense 40% / [line1] minmax(20em, max-content); /* global values */ grid: inherit; grid: initial; grid: unset; values <'grid-template'> defines the grid-template including grid-template-columns, grid-template-rows and grid-template-areas.
... <'grid-template-rows'> / [ auto-flow && dense?
...And 6 more matches
String.raw() - JavaScript
the static string.raw() method is a tag function of template literals.
...(but it is not identical; see explanations in this issue.) it's used to get the raw string form of template strings, that is, substitutions (e.g.
... syntax string.raw(callsite, ...substitutions) string.raw`templatestring` parameters callsite well-formed template call site object, like { raw: ['foo', 'bar', 'baz'] }.
...And 6 more matches
An Interview With Douglas Bowman of Wired News - Archive of obsolete content
wired news redesign in a nutshell driven by xhtml 1.0 transitional and css; allows centralized control over layout and appearance for thousands of pages; simple markup allows for rapid changes to templates; average page weight dropped by almost half; page layout accomplished with simple css positioning; vastly increased accessibility without special coding or user agent detection.
...the visual design of wired news and the vignette templates were all sorely stale, and we had no significant effort invested into either for more than two years.
...technically, with the print media css file, we didn't have to generate a separate print template for stories.
...And 5 more matches
Building Hierarchical Trees - Archive of obsolete content
« previousnext » a template may be used to generate hierarchical trees.
...each level of the tree is created using a successive iteration of the template build process.
...or, with more complex xpath expressions, a template could display a tree where the hierarchy wasn't directly like the xml document.
...And 5 more matches
Drawing graphics - Learn web development
getting the canvas context and final setup we need to do one final thing before we can consider our canvas template finished.
... ok, our template is done and it's time to move on.
... first of all, take a copy of your newly coded canvas template (or make a local copy of 1_canvas_template.html if you didn't follow the above steps).
...And 5 more matches
Accessibility in React - Learn web development
the <todo /> component will switch templates, as we designed, and you'll see a form that lets us edit the name of the task.
... when we switch between templates in our <todo /> component, we completely remove the elements that were there before to replace them with something else.
... focusing between templates when a user toggles a <todo/> template from viewing to editing, we should focus on the <input> used to rename it; when they toggle back from editing to viewing, we should move focus back to the "edit" button.
...And 5 more matches
Relationship of grid layout to other layout methods - CSS: Cascading Style Sheets
border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> </div> .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); } a simple question to ask yourself when deciding between grid or flexbox is: do i only need to control the layout by row or column – use a flexbox do i need to control the layout by row and column – use a grid content out or layout in?
...rder-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } <div class="wrapper"> <div class="box1">one</div> <div class="box2">two</div> <div class="box3">three</div> </div> .wrapper { display: grid; grid-template-columns: repeat(3,1fr); align-items: end; grid-auto-rows: 200px; } .box1 { align-self: stretch; } .box2 { align-self: start; } the fr unit and flex-basis we have already seen how the fr unit works to assign a proportion of available space in the grid container to our grid tracks.
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> </div> .wrapper { display: grid; grid-template-columns: repeat(auto-fill, 200px); } a flexible number of tracks this isn’t quite the same as flexbox.
...And 5 more matches
Web Components
html templates: the <template> and <slot> elements enable you to write markup templates that are not displayed in the rendered page.
... if required, define an html template using <template> and <slot>.
... again use regular dom methods to clone the template and attach it to your shadow dom.
...And 5 more matches
Compiling a New C/C++ Module to WebAssembly - WebAssembly
using a custom html template sometimes you will want to use a custom html template.
...copy it into a sub-directory called html_template inside your previous new directory.
... now navigate into your new directory (again, in your emscripten compiler environment terminal window), and run the following command: emcc -o hello2.html hello2.c -o3 -s wasm=1 --shell-file html_template/shell_minimal.html the options we've passed are slightly different this time: we've specified -o hello2.html, meaning that the compiler will still output the javascript glue code and .html.
...And 5 more matches
Local Storage - Archive of obsolete content
you'll still need to understand at least a little about rdf when you read the documentation about templates.
... templates templates are a very powerful tool in firefox.
... handling templates can also be complicated, but it is worth the effort if you need to display long lists or trees with complex data.
...And 4 more matches
RDF Query Syntax - Archive of obsolete content
each statement is placed as a direct child of the <query> element within the template.
... <vbox datasources="http://www.xulplanet.com/ds/sample.rdf" ref="http://www.xulplanet.com/rdf/a"> <template> <query> <content uri="?start"/> <triple subject="?start" predicate="http://www.xulplanet.com/rdf/relateditem" object="?relateditem"/> </query> <rule> ...
... </rule> </template> </vbox> this query has two statements, each specified with a different tag.
...And 4 more matches
Sorting Results - Archive of obsolete content
when the reference node is an rdf seq container and the results are in that container, however, the template builder orders the results in the order the items appear in the seq.
...in this case, the natural order of the results will just be the order that the template builder generates the results.
...content sorting for content builders (templates that do not use flags="dont-build-content"), sorting is done by placing the sort and sortdirection attributes on the root node of the template.
...And 4 more matches
Client-Server Overview - Learn web development
you would repeat a lot of code across each page (the basic page template, structure, etc.), and if you wanted to change anything about the page structure — like add a new "related products" section for example — then you'd have to change every page individually.
...when receiving an http get request for a product, the server determines the product id, fetches the data from the database, and then constructs the html page for the response by inserting the data into an html template.
... using html templates makes it very easy to change the html structure, because this only needs to be done in one place, in a single template, and not across potentially thousands of static pages.
...And 4 more matches
Bytecode Descriptions
the new object has the shape of the template object script->getobject(baseobjindex).
...for jsop::newobject, the new object has a group based on the allocation site (or a new group if the template's group is a singleton).
... for jsop::newobjectwithgroup, the new object has the same group as the template object.
...And 4 more matches
Subgrid - CSS: Cascading Style Sheets
level 2 of the css grid layout specification includes a subgrid value for grid-template-columns and grid-template-rows.
... if you set the value subgrid on grid-template-columns, grid-template-rows or both, instead of creating a new track listing the nested grid uses the tracks defined on the parent.
... for example, if you use grid-template-columns: subgrid and the nested grid spans three column tracks of the parent, the nested grid will have three column tracks of the same size as the parent grid.
...And 4 more matches
OpenSearch description format
opensearch description file the xml file that describes a search engine follows the basic template below.
...searchdescription xmlns="http://a9.com/-/spec/opensearch/1.1/" xmlns:moz="http://www.mozilla.org/2006/browser/search/"> <shortname>[snk]</shortname> <description>[search engine full name and summary]</description> <inputencoding>[utf-8]</inputencoding> <image width="16" height="16" type="image/x-icon">[https://example.com/favicon.ico]</image> <url type="text/html" template="[searchurl]"> <param name="[key name]" value="{searchterms}"/> <!-- other params if you need them… --> <param name="[other key name]" value="[parameter value]"/> </url> <url type="application/x-suggestions+json" template="[suggestionurl]"/> <moz:searchform>[https://example.com/search]</moz:searchform> </opensearchdescription> shortname a short name for the search engine.
...the template attribute indicates the base url for the search query.
...And 4 more matches
XSLT elements reference - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElement
an instruction, on the other hand, is associated with a template.
... a stylesheet may include several templates.
...an lre also appears in a template.
...And 4 more matches
cfx - Archive of obsolete content
--templatedir=templatedir the cfx run command constructs the add-on using a extension template which you can find under the sdk root, in app-extension.
... use the --templatedir option to specify a different template.
... templatedir may be specified as a full path or as a path relative to the current directory.
...And 3 more matches
RDF Datasource How-To - Archive of obsolete content
in fact, you can convert rdf to an arbitrary content model using xul templates.
...following xul fragment illustrates how to instantiate a tree control whose body is "rooted" to a resource (http://foo.bar.com/) that your datasource describes: <window xmlns:html="http://www.w3.org/1999/xhtml" xmlns:rdf="http://www.w3.org/tr/wd-rdf-syntax#" xmlns="http://www.mozilla.org/keymaster/gat...re.is.only.xul"> <tree datasources="rdf:my-datasource" ref="http://foo.bar.com/"> <template> <treechildren> <treeitem uri="..."> <treerow> <treecell> <text value="rdf:http://home.netscape.com/nc-rdf#name" /> </treecell> <treecell> <text value="rdf:http://home.netscape.com/nc-rdf#url" /> </treecell> </treerow> </treeitem> </treechildren> </template> <treehe...
... <template>...</template>.
...And 3 more matches
Additional Navigation - Archive of obsolete content
ember has been evaluated: (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/palace.jpg) (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/canal.jpg) (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/obselisk.jpg) when evaluating the triple, the template builder will iterate over the three potential results found so far.
...another thing that you cannot have is a triple where both variables would be unknown as in the following: <query> <content uri="?start"/> <member container="?start" child="?photo"/> <triple subject="?category" predicate="http://purl.org/dc/elements/1.1/title" object="?title"/> </query> in this case when the template builder gets to the triple, neither the ?category nor the ?title variables can be filled in so the builder doesn't know what to generate.
...this will allow us to associate additional properties to each category and more easily navigate the graph in a template.
...And 3 more matches
Getting started with Svelte - Learn web development
also see the following for more information: "what is npm" on nodejs.org "introducing npx" on the npm blog "the easiest way to get started with svelte" on the svelte blog creating your first svelte app the easiest way to create a starter app template is to just download the starter template application.
... you can do that by visiting sveltejs/template on github or you can avoid having to download and unzip it and just use degit.
... to create your starter app template, run the following terminal commands: npx degit sveltejs/template moz-todo-svelte cd moz-todo-svelte npm install npm run dev note: degit doesn't do any kind of magic — it just lets you download and unzip the latest version of a git repo's contents.
...And 3 more matches
Styling Vue components with CSS - Learn web development
vue components are written as a combination of javascript objects that manage the app's data and an html-based template syntax that maps to the underlying dom structure.
...since vue templates are valid html, this is done in the same way to how you might do it in plain html — by adding a class="" attribute to the element.
... update your todoform template so that it looks like this: <template> <form @submit.prevent="onsubmit"> <h2 class="label-wrapper"> <label for="new-todo-input" class="label__lg"> what needs to be done?
...And 3 more matches
Mail and RDF
this allows exposure of mailnews-specific data to user interface using rdf templates.
...this allows each template-based widget to maintain view/window-specific data with each datasource.
...in the document's onload= handler the datasources are attached to their respective widgets by setting the database property on each rdf template's parent element.
...And 3 more matches
CSS grids, logical values, and writing modes - CSS: Cascading Style Sheets
it then moves onto the next line, creating a new row track, and fills in more items: * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } .wrapper { display: grid; grid-template-columns: repeat(3, 100px); grid-template-rows: repeat(2, 100px); grid-gap: 10px; } <div class="wrapper"> <div class="item1">item 1</div> <div class="item2">item 2</div> <div class="item3">item 3</div> <div class="item4">item 4</div> <div class="item5">item 5</div> </div> if we add writing-mode: vertical-lr to the grid container, we can see that the block and inline axis are n...
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } .wrapper { writing-mode: vertical-lr; display: grid; grid-template-columns: repeat(3, 100px); grid-template-rows: repeat(2, 100px); grid-gap: 10px; } <div class="wrapper"> <div class="item1">item 1</div> <div class="item2">item 2</div> <div class="item3">item 3</div> <div class="item4">item 4</div> <div class="item5">item 5</div> </div> logical values for alignment with the block and inline axis able to change direction, the logical value...
...urs once we've flipped the grid onto the side, like this: * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } .wrapper { writing-mode: vertical-lr; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 100px); grid-gap: 10px; } .item1 { grid-column: 1 / 4; align-self: start; } .item2 { grid-column: 1 / 3; grid-row: 2 / 4; align-self: start; } .item3 { grid-column: 3; grid-row: 2 / 4; align-self: end; justify-self: end; } <div class="wrapper"> <div class="item1">item 1</div> <div class="item2"...
...And 3 more matches
Connecting to Remote Content - Archive of obsolete content
first you need to create an xslt stylesheet that acts as a template.
... this template will transform the xml you receive (in our case, the example xml document above) and convert it into xul.
... the xslt tutorial contains details for building these templates.
...And 2 more matches
Microsummary XML grammar reference - Archive of obsolete content
example the microsummary generator created in the creating a microsummary tutorial: <?xml version="1.0" encoding="utf-8"?> <generator xmlns="http://www.mozilla.org/microsummaries/0.1" name="firefox download count"> <template> <transform xmlns="http://www.w3.org/1999/xsl/transform" version="1.0"> <output method="text"/> <template match="/"> <value-of select="id('download-count')"/> <text> fx downloads</text> </template> </transform> </template> <pages> <include>http://(www\.)?spreadfirefox\.com/(index\.php)?</include> </pages> </generator> namespace the namespace ur...
...i for microsummary generator xml documents is: http://www.mozilla.org/microsummaries/0.1 all elements in a microsummary generator document should be in this namespace except the descendants of the <template> element, which should be in the xslt namespace: http://www.w3.org/1999/xsl/transform the <generator> element the <generator> element is the root tag for all microsummary generators, and should contain the remainder of the xml code describing the generator.
... child elements: <template> (required) defines how to transform pages into their microsummaries.
...And 2 more matches
Multiple Rules - Archive of obsolete content
note that only the first rule, in the order that the rules appear in the template, that matches for a result is used, not all of them that match.
...it also allows a common technique where the last rule in a template has no conditions, allowing all remaining results that didn't match earlier rules to match this last rule.
... a multiple rule template looks like the following: <hbox id="photoslist" datasources="template-guide-photos3.rdf" ref="http://www.xulplanet.com/rdf/myphotos"> <template> <query> <content uri="?start"/> <member container="?start" child="?photo"/> <triple subject="?photo" predicate="http://purl.org/dc/elements/1.1/title" object="?title"/> </query> <rule> <where subject="?title" rel="equals" value="canal"/> <action> <button uri="?photo" image="?photo" label="view" orient="vertical"/> </action> </rule> <rule> <action> <image uri="?photo" src="?photo"/> </action> </rule> </template> </hbox> this template contains a query with two rules.
...And 2 more matches
Recursive Generation - Archive of obsolete content
« previousnext » in the previous example, the template builder generated an extra set of two buttons for the second row.
...after generating content, the template builder always repeats the generation for inner levels as far as it can go.
...here is the content that was generated after one iteration: <vbox datasources="http://www.xulplanet.com/ds/sample.rdf" ref="http://www.xulplanet.com/rdf/a"> <template> <query> <content uri="?start"/> <triple subject="?start" predicate="http://www.xulplanet.com/rdf/relateditem" object="?relateditem"/> </query> <action> <hbox uri="?relateditem"> <button label="?start"/> <button label="?relateditem"/> </hbox> </action> </template> <hbox id="http://www.xulplanet.com/rdf/b"> ...
...And 2 more matches
Simple Query Syntax - Archive of obsolete content
at its simplest, the simple query syntax is equivalent to the following: <query> <content uri="?start"/> <member container="?start" child="?photo"/> </query> the template builder uses the simple query syntax whenever a template does not have a <query> element.
...here is what it might look like: <template> <vbox class="box-padded" uri="rdf:*"> <image src="rdf:*"/> <label value="rdf:http://purl.org/dc/elements/1.1/title"/> </vbox> </template> there is no <query> or <action> element used.
... instead, the builder uses a default query, and the action is placed directly inside the <template> element.
...And 2 more matches
treeitem - Archive of obsolete content
in a template condition, you should use a treeitem instead of a content element when the dont-build-content flag is specified.
...this will be set by the template builder as needed.
...this will be set by the template builder as needed.
...And 2 more matches
Grid Lines - MDN Web Docs Glossary: Definitions of Web-related terms
* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 100px); } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> </div> .wrapper { display: grid; grid-template-columns: repeat(3, 1fr);...
... grid-template-rows: 100px 100px; } lines can be addressed using their line number.
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 100px); } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } <div class="wrapper"> <div class="item">item</div> </div> .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: 100px 100px; } .item { gri...
...And 2 more matches
Index - MDN Web Docs Glossary: Definitions of Web-related terms
class is a template definition of an object's properties and methods, the "blueprint" from which other more specific instances of the object are drawn.
... 179 grid css, css grid, glossary a css grid is defined using the grid value of the display property; you can define columns and rows on your grid using the grid-template-rows and grid-template-columns properties.
...it is defined by the grid-template-columns property or in the shorthand grid or grid-template properties.
...And 2 more matches
Ember interactivity: Events, classes and state - Learn web development
the @action decorator declares that the function is an "action", meaning it's a type of function that will be invoked from an event that occurred in the template.
... and just like before, the add() function that will be called from the template gets annotated with the @action decorator to bind it to the class instance.
... first of all, the service needs to be injected into the template via the @inject decorator, which we’ll rename to @service for semantic clarity.
...And 2 more matches
Ember resources and troubleshooting - Learn web development
the intentional minimalism forces certain decisions, and allows for more consistent code, while keeping the template more structural rather than having them filled with bespoke logic.
... more concretely, using mut allows for template-only settings functions to be declared: <checkbox @value={{this.somedata}} @ontoggle={{fn (mut this.somedata) (not this.somedata)}} /> whereas, without mut, a component class would be needed: import component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; import { action } from '@ember/object'; export default class example extends component { @tracked somedata =...
... false; @action setdata(newvalue) { this.somedata = newvalue; } } which would then be called in the template like so: <checkbox @data={{this.somedata}} @onchange={{this.setdata}} /> due to the conciseness of using mut, it may be desireable to reach for it.
...And 2 more matches
TypeScript support in Svelte - Learn web development
creating a svelte typescript project from scratch you can start a new svelte typescript project using the standard template.
... all you have to do is run the following terminal commands (run them somewhere where you are storing your svelte test projects — it creates a new directory): npx degit sveltejs/template svelte-typescript-app cd svelte-typescript-app node scripts/setuptypescript.js this creates a starter project that includes typescript support, which you can then modify as you wish.
... go to the root directory of the project and enter these commands: npx degit sveltejs/template/scripts scripts # download script file to a scripts folder node scripts/setuptypescript.js # run it converted to typescript.
...And 2 more matches
FC_GenerateKeyPair
name fc_generatekeypair - generate a new public/private key pair syntax ck_rv fc_generatekeypair( ck_session_handle hsession, ck_mechanism_ptr pmechanism, ck_attribute_ptr ppublickeytemplate, ck_ulong uspublickeyattributecount, ck_attribute_ptr pprivatekeytemplate, ck_ulong usprivatekeyattributecount, ck_object_handle_ptr phpublickey, ck_object_handle_ptr phprivatekey ); parameters hsession [in] session handle.
...ppublickeytemplate [in] pointer to the public key template.
... uspublickeyattributecount [in] number of attributes in the public key template.
...And 2 more matches
GC Rooting Guide
this is a template class where the template parameter is the type of the gc thing it contains.
...within spidermonkey, it is suggested that these are used in preference to the template class (gecko uses the template versions): template class typedef js::rooted<js::value> js::rootedvalue js::rooted<jsobject*> js::rootedobject js::rooted<jsstring*> js::rootedstring js::rooted<jsscript*> js::rootedscript js::rooted<jsid> js::rootedid for example, instead of this: jsobject* localobj = js_getobjectofsomesort(cx); you would write this: js::rootedobject localobj(cx, js_getobjec...
... similarly to js::rooted<t>, there are typedefs available for the main types: template class typedef js::handle<js::value> js::handlevalue js::handle<jsobject*> js::handleobject js::handle<jsstring*> js::handlestring js::handle<jsscript*> js::handlescript js::handle<jsid> js::handleid you should use js::handle<t> for all function parameters taking gc thing pointers (except out-parameters, which are described ...
...And 2 more matches
nsIXULBuilderListener
content/xul/templates/public/nsixulbuilderlistener.idlscriptable this object is a listener that will be notified when a template builder rebuilds its content.
... inherits from: nsisupports last changed in gecko 1.7 method overview void didrebuild(in nsixultemplatebuilder abuilder); void willrebuild(in nsixultemplatebuilder abuilder); methods didrebuild() called after a template builder has rebuilt its content.
... void didrebuild( in nsixultemplatebuilder abuilder ); parameters abuilder the template builder that has rebuilt the content.
...And 2 more matches
CSS Grid Layout and Progressive Enhancement - CSS: Cascading Style Sheets
the ie/edge (≤15) version of the specification is prefixed with an -ms prefix and the properties implemented in ie/edge (≤15) are as follows: grid-template-columns as -ms-grid-columns grid-template-rows as -ms-grid-rows grid-row-start as -ms-grid-row grid-column-start as -ms-grid-column align-self as -ms-grid-row-align justify-self as -ms-grid-column-align the ie version has additional properties not required in the new specification of -ms-grid-column-span and -ms-grid-row-span.
... this version does not include auto-placement capability, or grid template areas.
... the float no longer applies, and i can use the css box alignment property align-self to align my content to the end of the container: * {box-sizing: border-box;} img { max-width: 100%; display: block; } .media { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; max-width: 400px; display: grid; grid-template-columns: 1fr 2fr; grid-template-areas: "img content"; margin-bottom: 1em; } .media::after { content: ""; display: block; clear: both; } .media .image { float: left; width: 150px; margin-right: 20px; } .media .text { padding: 10px; align-self: end; } <div class="media"> <div class="image"><img src="https://udn.realityripple.com/samples/89/f993f273dd.pn...
...And 2 more matches
Grammar and types - JavaScript
in es2015, template literals are also available.
... template literals are enclosed by the back-tick (`) (grave accent) character instead of double or single quotes.
... template strings provide syntactic sugar for constructing strings.
...And 2 more matches
Text formatting - JavaScript
multi-line template literals template literals are string literals allowing embedded expressions.
... template literals are enclosed by the back-tick (` `) (grave accent) character instead of double or single quotes.
... template literals can contain place holders.
...And 2 more matches
<xsl:if> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementif
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:if> element contains a test attribute and a template.
... if the test evaluates to true, the template is processed.
... syntax <xsl:if test=expression> template </xsl:if> required attributes test contains an xpath expression that can be evaluated (using the rules defined for boolean( ) if necessary) to a boolean value.
...And 2 more matches
Appendix E: DOM Building and Insertion (HTML & XUL) - Archive of obsolete content
json templating jsontodom.namespaces = { html: "http://www.w3.org/1999/xhtml", xul: "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" }; jsontodom.defaultnamespace = jsontodom.namespaces.html; function jsontodom(jsontemplate, doc, nodes) { function namespace(name) { var reelemnameparts = /^(?:(.*):)?(.*)$/.exec(name); return { namespace: jsontodom.namespaces[reelemnameparts[1]], shortname: reelemnameparts[2] }; } // note that 'elemnameorarray' is: either the full element name (eg.
...tag.apply(null, childelem) : doc.createtextnode(childelem)); } }); return elem; } return tag.apply(null, jsontemplate); } in the above, the namespaces object defines the namespace prefixes which can be used in the given dom tree.
... text], ["span", { class: "stuff" }, "stuff"]]], document, nodes)); alert(nodes.link); function addentrytopopup(menupopup, doc, chromewindow) { var newitem = doc.createelement("menuitem"); newitem.setattribute("value", "testvalue"); newitem.setattribute("label", "another popup menu item"); menupopup.appendchild(newitem); }; var jsontemplatebtn = ["xul:toolbarbutton", { id: "mytestbutton", class: "toolbarbutton-1", type: "menu", label: "test button label", tooltiptext: "test button tooltip", removable: true, key: "mytestbutton123" }, [ "menupopup", { onpopupshowing: function(event) { addentrytopo...
...pup(this, document, window); } }, null ] ]; var capturednodes = {}; var toolbox = doc.getelementbyid("navigator-toolbox"); var palette = toolbox.palette; var domfragment = jsontodom(jsontemplatebtn, document, capturednodes); palette.appendchild(domfragment); alert("capturednodes contains any created nodes that have optionally been captured (for later convenient javascript access) by giving them a 'key' attribute; for example: " + capturednodes.mytestbutton123); another example this here is another example of using jsontodom but in the html scope, a complex form is created with ease.
Bindings - Archive of obsolete content
to do this all we need to do is add the necessary data to the rdf datasource and add another <triple> element to the template's statements.
...the syntax is as follows: <template> <query> ...
... </action> </rule> </template> the description triple has been changed to a binding element, but the attributes are the same.
...the template builder examines bindings after the query has generated results.
Multiple Rule Example - Archive of obsolete content
<vbox id="photoslist" align="start" datasources="template-guide-photos5.rdf" ref="http://www.xulplanet.com/rdf/myphotos"> <template> <rule> <conditions> <content uri="?start"/> <member container="?start" child="?photo"/> <triple subject="?photo" predicate="http://purl.org/dc/elements/1.1/title" object="?title"/> <triple subject="?photo" predicate="http://pu...
...start"/> <member container="?start" child="?photo"/> <triple subject="?photo" predicate="http://purl.org/dc/elements/1.1/title" object="?phototitle"/> </conditions> <action> <vbox uri="?photo" class="box-padded"> <label value="?phototitle"/> <image src="?photo"/> </vbox> </action> </rule> </template> </vbox> in this example, the first rule matches only those photos with title, description, and date properties.
...you can use different variables if it makes sense in the context of the template or the data, although in this example it would seem more reasonable to use the same variable name.
...although the builder actually generates mutliple matches for one resource, in many cases it isn't necessary to be aware of this detail when creating templates.
XPCOM Examples - Archive of obsolete content
we can use this as in the following example: example 1 : source <toolbox> <menubar id="windowlist-menubar"> <menu label="window"> <menupopup id="window-menu" datasources="rdf:window-mediator" ref="nc:windowmediatorroot"> <template> <rule> <menuitem uri="rdf:*" label="rdf:http://home.netscape.com/nc-rdf#name"/> </rule> </template> </menupopup> </menu> </menubar> </toolbox> a window menu will be created with a list of all the open windows.
...in the earlier example, we generated the list of windows and added it to a menu via a template.
... the template generates an id attribute on each menuitem element.
... the example below shows how we might do this: <toolbox> <menubar id="windowlist-menubar"> <menu label="window" oncommand="switchfocus(event.target);"> <menupopup id="window-menu" datasources="rdf:window-mediator" ref="nc:windowmediatorroot"> <template> <rule> <menuitem uri="rdf:*" label="rdf:http://home.netscape.com/nc-rdf#name"/> </rule> </template> </menupopup> </menu> </menubar> </toolbox> <script> function switchfocus(elem) { var mediator = components.classes["@mozilla.org/rdf/datasource;1?name=window-mediator"].getservice(); mediator.queryinterface(components.interfaces.nsiwindowdatasource); var resource ...
Visual typescript game engine - Game development
appusebroadcaster: boolean = false; /** * possible variant by default : * "register", "login" */ private startuphtmlform: string = "register"; private gamelist: any[]; /** * implement default gameplay variable's */ private defaultgameplaylevelname: string = "level1"; private autostartgameplay: boolean = true; start the dependency system from app.ts the first game template is platformer.
... ├── package.json ├── package-lock.json ├── webpack.config.js ├── tsconfig.json ├── tslint.json ├── launch.json ├── workplace.code-workspace logo.png license ├── build/ (this is auto generated) | ├── externals/ | ├── templates/ | ├── imgs/ | ├── styles/ | | └── favicon.ico | ├── visualjs2.js | ├── app.html ├── src/ | ├── style/ | | ├── styles.css | ├── libs/ | | ├── class/ | | | ├── networking/ | | | | ├── rtc-multi-connection/ | | | | | ├── filebufferreader.js | | | | | ├── rtc...
... ├── user-profile.html | | ├── store.html | | ├── broadcaster.html | ├── index.html | ├── app-icon.ts | └── app.ts └── server/ | ├── package.json | ├── package-lock.json | ├── server-config.js | ├── database/ | | ├── database.js | | ├── common/ | | ├── email/ | | | ├── templates/ | | | | ├── confirmation.html.js | | | ├── nocommit.js (no commited for now) | | └── data/ (ignored - db system folder) | ├── rtc/ | | ├── server.ts | | ├── connector.ts | | ├── self-cert/ server part installed database: mongodb@3.1.8 -no typescript here, we need to keep state clear no.
... if you wanna insert some new html page just define it intro webpack.config.js : plugins : [ new htmlwebpackplugin({ filename: '/templates/mygamelobby.html', template: 'src/html-components/mygamelobby.html' }), ...
Supporting older browsers - Learn web development
for example, take a look at the page for grid-template-columns.
... * {box-sizing: border-box;} .wrapper { background-color: rgb(79,185,227); padding: 10px; max-width: 400px; display: grid; grid-template-columns: 1fr 1fr 1fr; } .item { float: left; border-radius: 5px; background-color: rgb(207,232,220); padding: 1em; } <div class="wrapper"> <div class="item">item one</div> <div class="item">item two</div> <div class="item">item three</div> </div> note: the clear property also has no effect once the cleared item becomes a grid item, so you could have a layout with a cleared ...
... * {box-sizing: border-box;} .wrapper { background-color: rgb(79,185,227); padding: 10px; max-width: 400px; display: grid; grid-template-columns: 1fr 1fr 1fr; } .item { float: left; border-radius: 5px; background-color: rgb(207,232,220); padding: 1em; width: 33.333%; } <div class="wrapper"> <div class="item">item one</div> <div class="item">item two</div> <div class="item">item three</div> </div> to deal with this issue we need to have a way to detect if grid is supported and therefore if it will override t...
... * {box-sizing: border-box;} .wrapper { background-color: rgb(79,185,227); padding: 10px; max-width: 400px; display: grid; grid-template-columns: 1fr 1fr 1fr; } .item { float: left; border-radius: 5px; background-color: rgb(207,232,220); padding: 1em; width: 33.333%; } @supports (display: grid) { .item { width: auto; } } <div class="wrapper"> <div class="item">item one</div> <div class="item">item two</div> <div class="item">item three</div> </div> support for feature queries is very good across ...
Sending form data - Learn web development
this uses the flask framework for rendering the templates, handling the form data submission, etc.
... from flask import flask, render_template, request app = flask(__name__) @app.route('/', methods=['get', 'post']) def form(): return render_template('form.html') @app.route('/hello', methods=['get', 'post']) def hello(): return render_template('greeting.html', say=request.form['say'], to=request.form['to']) if __name__ == "__main__": app.run() the two templates referenced in the above code are as follows (these need to be in a subdirectory called templates in the same directory as the python-example.py file, if you try to run the example yourself): form.html: the same form as we saw above in the the post method section but with the action set to {{ url_for('hello') }}.
... this is a jinja2 template, which is basically html but can contain calls to the python code that is running the web server contained in curly braces.
... greeting.html: this template just contains a line that renders the two bits of data passed to it when it is rendered.
Introduction to client-side frameworks - Learn web development
angular is a component-based framework which uses declarative html templates.
... at build time, transparently to developers, the framework's compiler translates the templates to optimized javascript instructions.
...template literal strings make it easy to write strings of html that represent what the final element would look like.
...in the context of static site generators, these components are called templates.
Rendering a list of Vue components - Learn web development
vue components are written as a combination of javascript objects that manage the app's data and an html-based template syntax that maps to the underlying dom structure.
...this is a built-in vue directive that lets us include a loop inside of our template, repeating the rendering of a template feature for each item in an array.
... uniqueid('todo-'), label: 'learn vue', done: false }, { id: uniqueid('todo-'), label: 'create a vue project with the cli', done: true }, { id: uniqueid('todo-'), label: 'have fun', done: true }, { id: uniqueid('todo-'), label: 'create a to-do list', done: false } ] }; } }; now, add the v-for directive and key attribute to the <li> element in your app.vue template, like so: <ul> <li v-for="item in todoitems" :key="item.id"> <to-do-item label="my todo item" :done="true"></to-do-item> </li> </ul> when you make this change, every javascript expression between the <li> tags will have access to the item value in addition to the other component attributes.
...your app.vue template should now look like this: <template> <div id="app"> <h1>my to-do list</h1> <ul> <li v-for="item in todoitems" :key="item.id"> <to-do-item :label="item.label" :done="item.done" :id="item.id"></to-do-item> </li> </ul> </div> </template> when you look at your rendered site, it should look the same, but our refactor now means that our id is being taken from the ...
Index
when using the asn.1 parser(s), a template definition is passed to the parser, which will analyze the asn.1 data stream accordingly.
... the templates are usually closely aligned to definitions found in rfc documents.
...you must know which data you are expecting, and use the correct template for parsing, based on the context of your software's interaction.
... 317 troubleshoot.html newsgroup: mozilla.dev.tech.crypto 318 nss release notes template the nss team has released network security services (nss) 3.xx, which is a minor release.
FC_CopyObject
syntax ck_rv fc_copyobject( ck_session_handle hsession, ck_object_handle hobject, ck_attribute_ptr ptemplate, ck_ulong uscount, ck_object_handle_ptr phnewobject ); parameters hsession [in] session handle.
...ptemplate [in] object template.
... uscount [in] number of attributes in the template.
... description fc_copyobject creates a copy of an object using the attributes specified in the template.
FC_CreateObject
syntax ck_rv fc_createobject( ck_session_handle hsession, ck_attribute_ptr ptemplate, ck_ulong ulcount, ck_object_handle_ptr phobject ); parameters hsession [in] session handle.
... ptemplate [in] object template.
... ulcount [in] number of attributes in the template.
... description fc_createobject creates an object using the attributes specified in the template.
XSLT Basic Example - Web APIs
an xslt stylesheet starts with the xsl:stylesheet element, which contains all the templates used to create the final output.
... the example in figure 1 has two templates - one that matches the root node and one that matches author nodes.
... the template that matches the root node outputs the article's title and then says to process all templates (via apply-templates) that match author nodes which are children of the authors node.
...bar</author> </authors> <body>this is my article text.</body> </article> xsl stylesheet (example.xsl) : <?xml version="1.0"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/xsl/transform"> <xsl:output method="text"/> <xsl:template match="/"> article - <xsl:value-of select="/article/title"/> authors: <xsl:apply-templates select="/article/authors/author"/> </xsl:template> <xsl:template match="author"> - <xsl:value-of select="." /> </xsl:template> </xsl:stylesheet> browser output : article - my article authors: - mr.
<xsl:param> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementparam
when used inside an <xsl:template> element, the parameter is local to that template.
... in this case it must be the first child element of the template.
... syntax <xsl:param name=name select=expression> template </xsl:param> required attributes name names the parameter.
... type instruction, can appear as a top-level element or within a template.
<xsl:with-param> - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:with-param> element sets the value of a parameter to be passed into a template.
... syntax <xsl:with-param name=name select=expression> template </xsl:with-param> required attributes name gives this parameter a name.
...if the element contains a template, this attribute is ignored.
... type subinstruction, always appears within an <xsl:apply-templates> or an <xsl:call-template> element.
Storing annotations - Archive of obsolete content
the panel has three new files associated with it: a content-script which builds the panel content a simple html file used as a template for the panel's content a simple css file to provide some basic styling.
... annotation list content script here's the annotation list's content script: self.on("message", function onmessage(storedannotations) { var annotationlist = $('#annotation-list'); annotationlist.empty(); storedannotations.foreach( function(storedannotation) { var annotationhtml = $('#template .annotation-details').clone(); annotationhtml.find('.url').text(storedannotation.url) .attr('href', storedannotation.url); annotationhtml.find('.url').bind('click', function(event) { event.stoppropagation(); event.preventdefault(); self.postmessage(storedannotation.url); }); annotationhtml.find('.selection-text') ...
... annotation list html and css here's the html for the annotation list: <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>saved annotations</title> <link rel="stylesheet" type="text/css" href="annotation-list.css" /> </head> <body> <div id="annotation-list"> </div> <div id="template"> <div class="annotation-details"> <a class="url"></a> <div class="selection-text"></div> <div class="annotation-text"></div> </div> </div> </body> </html> here's the corresponding css: #annotation-list .annotation-details { padding: 10px; margin: 10px; border: solid 3px #eee; background-color: white; } #annotation-list .url, .selection-text, .annotation-text {...
Displaying web content in an extension without security issues - Archive of obsolete content
so in the simplest case you would have: <iframe type="content" src="data:text/html,%3chtml%3e%3cbody%3e%3c/body%3e%3c/html%3e"/> but usually you don’t want to start with an empty document, you would rather want to load some template into the frame: var request = new xmlhttprequest(); request.open("get", "chrome://foo/content/template.html", false); request.send(null); frame.setattribute("src", "data:text/html," + encodeuricomponent(request.responsetext)); that way you can have the template in your extension but still strip it off all privileges when it is loaded in a frame.
...for example, your template document might have this code: <style type="text/css"> #entrytemplate { display: none; } </style> <div id="entrytemplate"> <div class="title"></div> <div class="description"></div> </div> now to insert a new entry in the document you would do the following: var template = doc.getelementbyid("entrytemplate"); var entry = template.clonenode(true); entry.removeattribute("id"); entry.geteleme...
...ntsbyclassname("title")[0].textcontent = title; entry.getelementsbyclassname("description")[0].textcontent = description; template.parentnode.appendchild(entry); the important difference here is that the result will always have the same structure as the template tag.
Adding sidebars - Archive of obsolete content
trees are specially powerful when combined with data templates, a topic that will be covered later on.
...even handling the construction of a tree using javascript and dom functions can become very convoluted, which is why trees are better used along with templates.
... this topic will be covered later when we look at different kinds of datasources and templates.
Firefox addons developer guide - Archive of obsolete content
these should use the previous, next, and prevnext templates to add quick routes to get from chapter to chapter.
... if you use the interface template when mentioning interfaces by name, mdc will automatically format them and generate links to their documentation, like this: nsiconsoleservice.
... these articles are all tagged as covering firefox 3.1 using the fx_minversion_header template, but i don't think that's the case.
MCD, Mission Control Desktop, AKA AutoConfig - Archive of obsolete content
t_startup", true); lockpref("mail.server.server2.max_cached_connections", 5); //lockpref("mail.server.server2.name", "jehan.procaccia@int-evry.fr"); lockpref("mail.server.server2.type", "imap"); lockpref("mail.server.server2.username", env_user); //smtp lockpref("mail.identity.id1.smtpserver", "smtp1"); lockpref("mail.identity.id1.stationery_folder", "imap://" + env_user + "@imap-int.int-evry.fr/templates"); lockpref("mail.identity.id1.tmpl_folder_picker_mode", "0"); lockpref("mail.identity.id1.valid", true); //smtp general lockpref("mail.smtp.defaultserver", "smtp1"); lockpref("mail.smtpserver.smtp1.auth_method", 0); lockpref("mail.smtpserver.smtp1.hostname", "smtp-int.int-evry.fr"); lockpref("mail.smtpserver.smtp1.port", 25); lockpref("mail.smtpserver.smtp1.try_ssl", 0); lockpref("mail.smtpser...
..."mail.identity.id1.draft_folder", "imap://" + env_user + "@imap-int.int-evry.fr/drafts"); lockpref("mail.identity.id1.drafts_folder_picker_mode", "0"); lockpref("mail.identity.id1.fcc_folder", "imap://" + env_user + "@imap-int.int-evry.fr/sent"); lockpref("mail.identity.id1.fcc_folder_picker_mode", "0"); lockpref("mail.identity.id1.stationery_folder", "imap://" + env_user + "@imap-int.int-evry.fr/templates"); lockpref("mail.identity.id1.tmpl_folder_picker_mode", "0"); lockpref("mail.identity.id1.valid", true); lockpref("mail.identity.id1.overrideglobal_pref", true); lockpref("mail.server.server1.download_on_biff", true); lockpref("mail.server.server1.login_at_startup", true); lockpref("mail.server.server1.username", env_user); lockpref("mail.server.server1.delete_model", 0); //smtp lockpref("mail...
..."mail.identity.id1.draft_folder", "imap://" + env_user + "@imap-int.int-evry.fr/drafts"); lockpref("mail.identity.id1.drafts_folder_picker_mode", "0"); lockpref("mail.identity.id1.fcc_folder", "imap://" + env_user + "@imap-int.int-evry.fr/sent"); lockpref("mail.identity.id1.fcc_folder_picker_mode", "0"); lockpref("mail.identity.id1.stationery_folder", "imap://" + env_user + "@imap-int.int-evry.fr/templates"); lockpref("mail.identity.id1.tmpl_folder_picker_mode", "0"); lockpref("mail.identity.id1.valid", true); lockpref("mail.identity.id1.overrideglobal_pref", true); lockpref("mail.server.server1.download_on_biff", true); lockpref("mail.server.server1.login_at_startup", true); lockpref("mail.server.server1.username", env_user); lockpref("mail.server.server1.delete_model", 0); //smtp defaultpref("m...
Windows stub installer - Archive of obsolete content
add an <component>.jst install script template file.
... the jst extension stands for javascript template indicating this is a template for the final install.js for the <component>.xpi.
... add a [component <component>]</component> section to the config.ini template file named config.it found at: <http://lxr.mozilla.org/seamonkey/sou...dows/config.it>.
Using XPInstall to Install Plugins - Archive of obsolete content
a complete template of an xpi package is also presented in this section.
...the pieces all come together in the template below.
... an xpinstall template we have provided you with a template for an install script which you might want to open in another tab or window.
datasources - Archive of obsolete content
« xul reference home datasources type: space separated list of datasource uris a space-separated list of datasources that an element's template will use for content generation.
...the element should have a template element as a child.
... for rdf templates, the specified datasources are combined into a single composite datasource which holds the data from all of the datasources.
Attribute Substitution - Archive of obsolete content
for instance, if the template contained: <description><textnode value="?description"/></description> the resulting generated content might be: <description>view from the top of the tower looking east of the doges palace</description> note that the textnode has been replaced with the substituted value attribute.
...recall that the template builder doesn't load the datasource before processing a template.
...thus, if you use a variable set in a binding, you must ensure the datasource is loaded before the template is built, or just rebuild the template.
Containment Properties - Archive of obsolete content
<vbox datasources="template-guide-ex1.rdf" ref="http://www.xulplanet.com/rdf/a" containment="http://www.xulplanet.com/rdf/relateditem"> <template> <rule> <label uri="rdf:*" value="rdf:*"/> </rule> </template> </vbox> instead of iterating over a container, this example iterates over a specific predicate.
...the containment attribute also applies to member tests when using the extended template syntax.
...<vbox datasources="template-guide-ex3.rdf" ref="http://www.xulplanet.com/rdf/a" containment="http://www.xulplanet.com/rdf/relateditem"> <template> <query> <content uri="?start"/> <member container="?start" child="?child"/> </query> <action> <label uri="?child" value="?child"/> </action> </template> </vbox> try this example.
Namespaces - Archive of obsolete content
xml namespaces can be used in xul templates by binding the namespace uri and prefix to the template element.
...g xml document containing a list of people: <people xmlns="www.example.com/people"> <person name="napoleon bonaparte" gender="male"/> <person name="cleopatra" gender="female"/> <person name="julius caesar" gender="male"/> <person name="ferdinand magellan" gender="male"/> <person name="laura secord" gender="female"/> </people> <listbox datasources="people.xml" ref="*" querytype="xml"> <template xmlns:ns="www.example.com/people"> <query expr="ns:person"/> <action> <listitem uri="?" label="?ns:name"/> </action> </template> </listbox> once added to the template element the namespaces can then be referenced inside temple rule elements too, this works both in rdf and xml templates.
... <listbox datasources="people.xml" ref="*" querytype="xml"> <template xmlns:ns="www.example.com/people"> <query expr="ns:person"/> <rule ns:gender="male"> <label uri="?" label="?ns:name"/> </action> </template> </listbox> ...
Simple Example - Archive of obsolete content
« previousnext » let's look a more useful example, this time for a template that will show a list of photos.
...a template which displays this information is very simple to create.
...first, we set the datasources and ref attributes as needed: <vbox datasources="template-guide-ex2.rdf" ref="http://www.xulplanet.com/rdf/myphotos"> this time, we need to use a new statement, the member condition as well as a triple.
Using Multiple Queries to Generate More Results - Archive of obsolete content
<template> <queryset> <query> <content uri="?start"/> <member container="?start" child="?item"/> </query> <rule> <binding subject="?item" predicate="http://purl.org/dc/elements/1.1/title" object="?title"/> <action> <label uri="?item" value="?title" class="header"/> </action> </rule> </queryset> <queryset> <query> <content uri="?start"/> ...
... <triple subject="?start" predicate="http://www.xulplanet.com/rdf/people" object="?people"/> <member container="?people" child="?item"/> </query> <rule> <binding subject="?item" predicate="http://purl.org/dc/elements/1.1/title" object="?title"/> <action> <label uri="?item" value="?title"/> </action> </rule> </queryset> </template> you can view the example.
... <vbox datasources="people.xml" ref="*" querytype="xml"> <template> <queryset> <query expr="group[@name='male']/*"/> <action> <checkbox uri="?" label="?name"/> </action> </queryset> <queryset> <query expr="group[@name='female']/*"/> <action> <label uri="?" value="?name"/> </action> </queryset> </template> </vbox> « previousnext » ...
RDF Datasources - Archive of obsolete content
example 1 : source <tree flex="1" datasources="rdf:history" ref="nc:historyroot"> <treecols> <treecol id="name" label="name" flex="1"/> <treecol id="url" label="url" flex="1"/> <treecol id="date" label="date" flex="1"/> </treecols> <template> <rule> <treechildren> <treeitem uri="rdf:*"> <treerow> <treecell label="rdf:http://home.netscape.com/nc-rdf#name"/> <treecell label="rdf:http://home.netscape.com/nc-rdf#url"/> <treecell label="rdf:http://home.netscape.com/nc-rdf#date"/> </treerow> </treeitem> </treechildren> </rule> </template> </tree> othe...
...the rdf file is fairly large and can be viewed separately: source rdf example 2 : source view <tree flex="1" width="200" height="200" datasources="animals.rdf" ref="http://www.some-fictitious-zoo.com/all-animals"> <treecols> <treecol id="name" label="name" primary="true" flex="1"/> <treecol id="species" label="species" flex="1"/> </treecols> <template> <rule> <treechildren> <treeitem uri="rdf:*"> <treerow> <treecell label="rdf:http://www.some-fictitious-zoo.com/rdf#name"/> <treecell label="rdf:http://www.some-fictitious-zoo.com/rdf#species"/> </treerow> </treeitem> </treechildren> </rule> </template> </tree> here, the data has been generated from the file.
...example 3 : source view <window id="example-window" title="history list" xmlns:animals="http://www.some-fictitious-zoo.com/rdf#" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> <button label="click here to see the mammals the zoo has" type="menu" datasources="animals.rdf" ref="http://www.some-fictitious-zoo.com/mammals"> <template> <rule animals:specimens="0"></rule> <rule> <menupopup> <menuitem uri="rdf:*" label="rdf:http://www.some-fictitious-zoo.com/rdf#name"/> </menupopup> </rule> </template> </button> </window> in this case only the mammals are desired, so we select the uri of the mammals list.
XUL Reference - Archive of obsolete content
preferences prefpane prefwindow progressmeter query queryset radio radiogroup resizer richlistbox richlistitem row rows rule scale script scrollbar scrollbox scrollcorner separator spacer spinbuttons splitter stack statusbar statusbarpanel stringbundle stringbundleset tab tabbrowser (firefox-only starting with firefox 3/gecko 1.9) tabbox tabpanel tabpanels tabs template textnode textbox textbox (firefox autocomplete) textbox (mozilla autocomplete) timepicker titlebar toolbar toolbarbutton toolbargrippy toolbaritem toolbarpalette toolbarseparator toolbarset toolbarspacer toolbarspring toolbox tooltip tree treecell treechildren treecol treecols treeitem treerow treeseparator triple vbox where window wizard wizardpage categorical l...
...ws window wizard wizardpage titlebar window structure --- menus and popups --- toolbars toolbar toolbarbutton toolbargrippy toolbaritem toolbarpallete toolbarseperator toolbarspring tabs and grouping tab tabbox tabpanel tabpanels tabs controls --- text and images label caption image lists --- trees --- layout --- templates --- scripting --- helper elements other xul lists dialog overlay page window wizard wizardpage preference preferences prefpane prefwindow browser tabbrowser editor iframe titlebar resizer statusbar statusbarpanel dialogheader notification notificationbox menubar menu menuitem menuseparator menupopup panel tooltip popupset toolbar toolbarbutton ...
...ete) timepicker description label image listbox listitem listcell listcol listcols listhead listheader richlistbox richlistitem tree treecell treechildren treecol treecols treeitem treerow treeseparator box hbox vbox bbox deck stack grid columns column rows row scrollbox action assign binding bindings conditions content member param query queryset rule template textnode triple where script commandset command broadcaster broadcasterset observes key keyset stringbundle stringbundleset arrowscrollbox dropmarker grippy scrollbar scrollcorner spinbuttons all attributes all properties all methods attributes defined for all xul elements style classes event handlers deprecated/defunct markup ...
assign - Archive of obsolete content
« xul reference home [ examples | attributes | properties | methods | related ] for xml templates, specifies an additional variable to assign a value to.
... var type: string for the xul assign attribute, this is the variable to assign the value to; otherwise it's a reference to a template variable such as "?name".
...rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
textnode - Archive of obsolete content
« xul reference home [ examples | attributes | properties | methods | related ] normally when substituting rdf resources in template rules, you place the rdf property name inside an attribute value preceded with rdf:.
...this element does nothing outside of a template.
...rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
E4X for templating - Archive of obsolete content
e4x can be used for creating templates for dynamic content.
... while it may be obvious after a study of the basics of e4x that it can be used for this purpose, if one adds a few common purpose functions (especially along with the convenience of javascript 1.8 expression closures), the templates can function more dynamically, offering the power and readability of templating languages such as smarty for php (though admittedly without the currently wider cross-browser support of xslt or the strictly-xml approach of phptal or seethrough templating).
...scription>{elems[0]}</description>, function _else () <label>no data</label> )} note that the simple xmllist() constructor (<></>) may be useful to still be able to use an expression closure (i.e., without needing return statements and braces): {_if(elems.length(), function () <> <markup/> <markup/> </>)} note that, while it is convenient to store such e4x in separate file templates (to be eval()d at a later time, taking into account security considerations, such as escaping with the above), e4x content using such functions can also be easily serialized inline (and then perhaps converted to the dom) as needed: var list = <>{_if(elems.length(), function () <> <markup/> <markup/> </>)}</>.toxmlstring(); iterating functions such as the following foreach (which...
Grid Areas - MDN Web Docs Glossary: Definitions of Web-related terms
i have named these with the grid-area property and then laid them out on the grid using grid-template-areas.
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } .wrapper { display: grid; grid-template-columns: repeat(3,1fr); grid-template-rows: 100px 100px; grid-template-areas: "a a b" "a a b"; } .item1 { grid-area: a; } .item2 { grid-area: b; } <div class="wrapper"> <div class="item1">item</div> <div class="item2">item</div> </div> learn more property reference grid-template-columns grid-template-rows grid-auto-rows grid-auto-columns grid-template-areas grid-area f...
...urther reading css grid layout guide: basic concepts of grid layout css grid layout guide: grid template areas definition of grid areas in the css grid layout specification ...
Grid Tracks - MDN Web Docs Glossary: Definitions of Web-related terms
they are defined in the explicit grid by using the grid-template-columns and grid-template-rows properties or the shorthand grid or grid-template properties.
... track sizing in the explicit grid when defining grid tracks using grid-template-columns and grid-template-rows you may use any length unit, and also the flex unit, fr which indicates a portion of the available space in the grid container.
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } .wrapper { display: grid; grid-template-columns: 200px 1fr 3fr; } <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> </div> track sizing in the implicit grid tracks created in the implicit grid are auto-sized by default, however you can define a size for these tracks using the grid-auto-rows and grid-auto-columns properties.
Introduction to CSS layout - Learn web development
in addition to using display: grid, we are also defining some row and column tracks on the parent using the grid-template-rows and grid-template-columns properties respectively.
... grid example 1 * {box-sizing: border-box;} .wrapper > div { border-radius: 5px; background-color: rgb(207,232,220); padding: 1em; } .wrapper { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 100px 100px; grid-gap: 10px; } <div class="wrapper"> <div class="box1">one</div> <div class="box2">two</div> <div class="box3">three</div> <div class="box4">four</div> <div class="box5">five</div> <div class="box6">six</div> </div> once you have a grid, you can explicitly place your items on it, rather than relying o...
... grid example 2 * {box-sizing: border-box;} .wrapper > div { border-radius: 5px; background-color: rgb(207,232,220); padding: 1em; } .wrapper { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 100px 100px; grid-gap: 10px; } .box1 { grid-column: 2 / 4; grid-row: 1; } .box2 { grid-column: 1; grid-row: 1 / 3; } .box3 { grid-row: 2; grid-column: 3; } <div class="wrapper"> <div class="box1">one</div> <div class="box2">two</div> <div class="box3">three</div> </div> note: these two examples are ju...
Beginner's guide to media queries - Learn web development
@media screen and (min-width: 40em) { article { display: grid; grid-template-columns: 3fr 1fr; column-gap: 20px; } nav ul { display: flex; } nav li { flex: 1; } } this css gives us a two-column layout inside the article, of the article content and related information in the aside element.
... @media screen and (min-width: 70em) { main { display: grid; grid-template-columns: 3fr 1fr; column-gap: 20px; } article { margin-bottom: 0; } footer { border-top: 1px solid #ccc; margin-top: 2em; } } open step 3 in the browser, or view the source.
...card 1</h2> <p>...</p> </li> <li> <h2>card 2</h2> <p>...</p> </li> <li> <h2>card 3</h2> <p>...</p> </li> <li> <h2>card 4</h2> <p>...</p> </li> <li> <h2>card 5</h2> <p>...</p> </li> </ul> .grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 20px; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); } .grid li { border: 1px solid #666; padding: 10px; } open the grid layout example in the browser, or view the source.
Client-side storage - Learn web development
most major modern web sites are dynamic — they store data on the server using some kind of database (server-side storage), then run server-side code to retrieve needed data, insert it into static page templates, and serve the resulting html to the client to be displayed by the user's browser.
... basic syntax let's show you how: first, go to our web storage blank template on github (open this in a new tab).
... open our web storage blank template again, but this time in a different browser to the one you've got this tutorial open in!
Ember app structure and componentization - Learn web development
the landing page html of our application is defined in app/templates/application.hbs.
...mand into your terminal: ember generate component header these will generate some new files, as shown in the resulting terminal output: installing component create app/components/header.hbs skip app/components/header.js tip to add a class, run `ember generate component-class header` installing component-test create tests/integration/components/header-test.js header.hbs is the template file where we’ll include the html structure for just that component.
...by default, generate component generates template-only components, because in large applications, template-only components end up being the majority of the components.
Using Vue computed properties - Learn web development
vue components are written as a combination of javascript objects that manage the app's data and an html-based template syntax that maps to the underlying dom structure.
... computed: { listsummary() { const numberfinisheditems = this.todoitems.filter(item =>item.done).length return `${numberfinisheditems} out of ${this.todoitems.length} items completed` } } now we can add {{listsummary}} directly to our template; we'll add this inside an <h2> element, just above our <ul>.
... add the described <h2> and update the <ul> inside your app's template as follows: <h2 id="list-summary">{{listsummary}}</h2> <ul aria-labelledby="list-summary" class="stack-large"> <li v-for="item in todoitems" :key="item.id"> <to-do-item :label="item.label" :done="item.done" :id="item.id"></to-do-item> </li> </ul> you should now see the list summary in your app, and the total number of items update as you add more todo items!
An overview of NSS Internals
when using the asn.1 parser(s), a template definition is passed to the parser, which will analyze the asn.1 data stream accordingly.
... the templates are usually closely aligned to definitions found in rfc documents.
...you must know which data you are expecting, and use the correct template for parsing, based on the context of your software's interaction.
Enc Dec MAC Using Key Wrap CertReq PKCS10 CSR
(arena, sizeof(certcertificaterequest)); if (!certreq) { rv = secfailure; goto cleanup; } certreq->arena = arena; /* since cert request is a signed data, must decode to get the inner data */ port_memset(&signeddata, 0, sizeof(signeddata)); rv = sec_asn1decodeitem(arena, &signeddata, sec_asn1_get(cert_signeddatatemplate), &reqder); if (rv) { rv = secfailure; goto cleanup; } rv = sec_asn1decodeitem(arena, certreq, sec_asn1_get(cert_certificaterequesttemplate), &signeddata.data); if (rv) { rv = secfailure; goto cleanup; } rv = cert_verifysigneddatawithpublickeyinfo(&signeddata, &certreq->subjectpublickey...
...pr_fprintf(pr_stderr, "could not set signature algorithm id.\n%s\n", port_errortostring(rv)); goto cleanup; } /* we only deal with cert v3 here */ *(cert->version.data) = 2; cert->version.len = 1; der.len = 0; der.data = null; dummy = sec_asn1encodeitem (arena, &der, cert, sec_asn1_get(cert_certificatetemplate)); if (!dummy) { pr_fprintf(pr_stderr, "could not encode certificate.\n"); goto cleanup; } result = (secitem *) port_arenazalloc (arena, sizeof (secitem)); if (result == null) { pr_fprintf(pr_stderr, "could not allocate item for certificate data.\n"); goto cleanup; } rv = sec_dersigndata(arena, result, der.data, der.len, privkey, a...
...estattributes(cr); if (exthandle == null) { port_freearena (arena, pr_false); rv = secfailure; goto cleanup; } cert_finishextensions(exthandle); cert_finishcertificaterequestattributes(cr); /* der encode the request */ encoding = sec_asn1encodeitem(arena, null, cr, sec_asn1_get(cert_certificaterequesttemplate)); if (encoding == null) { pr_fprintf(pr_stderr, "der encoding of request failed\n"); rv = secfailure; goto cleanup; } /* sign the request */ signalgtag = sec_getsignaturealgorithmoidtag(keytype, hashalgtag); if (signalgtag == sec_oid_unknown) { pr_fprintf(pr_stderr, "unknown key or hash type\n"); rv = secfailure; goto cle...
sample2
{ rv = secfailure; goto cleanup; } certreq = (certcertificaterequest*) port_arenazalloc (arena, sizeof(certcertificaterequest)); if (!certreq) { rv = secfailure; goto cleanup; } certreq->arena = arena; /* since cert request is a signed data, must decode to get the inner data */ port_memset(&signeddata, 0, sizeof(signeddata)); rv = sec_asn1decodeitem(arena, &signeddata, sec_asn1_get(cert_signeddatatemplate), &reqder); if (rv) { rv = secfailure; goto cleanup; } rv = sec_asn1decodeitem(arena, certreq, sec_asn1_get(cert_certificaterequesttemplate), &signeddata.data); if (rv) { rv = secfailure; goto cleanup; } rv = cert_verifysigneddatawithpublickeyinfo(&signeddata, &certreq->subjectpublickeyinfo, null /* wincx */); if (reqder.data) { secitem_freeitem(&reqder, pr_false); } cleanup: if (rv) { pr_fprintf...
...leanup; } rv = secoid_setalgorithmid(arena, &cert->signature, algid, 0); if (rv != secsuccess) { pr_fprintf(pr_stderr, "could not set signature algorithm id.\n%s\n", port_errortostring(rv)); goto cleanup; } /* we only deal with cert v3 here */ *(cert->version.data) = 2; cert->version.len = 1; der.len = 0; der.data = null; dummy = sec_asn1encodeitem (arena, &der, cert, sec_asn1_get(cert_certificatetemplate)); if (!dummy) { pr_fprintf(pr_stderr, "could not encode certificate.\n"); goto cleanup; } result = (secitem *) port_arenazalloc (arena, sizeof (secitem)); if (result == null) { pr_fprintf(pr_stderr, "could not allocate item for certificate data.\n"); goto cleanup; } rv = sec_dersigndata(arena, result, der.data, der.len, privkey, algid); if (rv != secsuccess) { pr_fprintf(pr_stderr, "could not si...
...f(stderr, "out of memory"); rv = secfailure; goto cleanup; } exthandle = cert_startcertificaterequestattributes(cr); if (exthandle == null) { port_freearena (arena, pr_false); rv = secfailure; goto cleanup; } cert_finishextensions(exthandle); cert_finishcertificaterequestattributes(cr); /* der encode the request */ encoding = sec_asn1encodeitem(arena, null, cr, sec_asn1_get(cert_certificaterequesttemplate)); if (encoding == null) { pr_fprintf(pr_stderr, "der encoding of request failed\n"); rv = secfailure; goto cleanup; } /* sign the request */ signalgtag = sec_getsignaturealgorithmoidtag(keytype, hashalgtag); if (signalgtag == sec_oid_unknown) { pr_fprintf(pr_stderr, "unknown key or hash type\n"); rv = secfailure; goto cleanup; } rv = sec_dersigndata(arena, &result, encoding->data, encoding->len,...
nss tech note2
display verbose information, including template values, array values, etc.
...for example, 1024[805ef10]: c_findobjectsinit 1024[805ef10]: hsession = 0x1000001 1024[805ef10]: ptemplate = 0xbffff410 1024[805ef10]: ulcount = 3 1024[805ef10]: cka_label = localhost.nyc.rr.com [20] 1024[805ef10]: cka_token = ck_true [1] 1024[805ef10]: cka_class = cko_certificate [4] 1024[805ef10]: rv = 0x0 1024[805ef10]: c_findobjects 1024[805ef10]: hsession = 0x1000001 1024[805ef10]: phobject = 0x806d810 1024[805ef10]: ulmaxobjectcount = 16 1024[805ef10]: pulobjectcount = 0xbffff38c 1024[805ef10]: *pulobjectcount = 0x1 1024[805ef10]: phobject[0] = 0xf6457d04 1024[805ef10]: rv = 0x0 1024[805ef10]: c_findobjectsfina...
...l 1024[805ef10]: hsession = 0x1000001 1024[805ef10]: rv = 0x0 1024[805ef10]: c_getattributevalue 1024[805ef10]: hsession = 0x1000001 1024[805ef10]: hobject = 0xf6457d04 1024[805ef10]: ptemplate = 0xbffff2d0 1024[805ef10]: ulcount = 2 1024[805ef10]: cka_token = 0 [1] 1024[805ef10]: cka_label = 0 [20] 1024[805ef10]: rv = 0x0 1024[805ef10]: c_getattributevalue 1024[805ef10]: hsession = 0x1000001 1024[805ef10]: hobject = 0xf6457d04 1024[805ef10]: ptemplate = 0xbffff2d0 1024[805ef10]: ulcount = 2 1024[805ef10]: cka_token = ck_true [1] 1024[805ef10]: cka_label = localhost.nyc.rr.com [20] 1024[805ef10]: rv = 0x0 4.
FC_DeriveKey
name fc_derivekey - derive a key from a base key syntax ck_rv fc_derivekey( ck_session_handle hsession, ck_mechanism_ptr pmechanism, ck_object_handle hbasekey, ck_attribute_ptr ptemplate, ck_ulong usattributecount, ck_object_handle_ptr phkey ); parameters hsession [in] session handle.
...ptemplate [in] pointer to the list of attributes for the new key.
... usattributecount [in] number of attributes in the template.
FC_FindObjectsInit
syntax ck_rv fc_findobjectsinit( ck_session_handle hsession, ck_attribute_ptr ptemplate, ck_ulong uscount ); parameters hsession [in] session handle.
... ptemplate [in] pointer to template.
... uscount [in] number of attributes in the template.
FC_GenerateKey
name fc_generatekey - generate a new key syntax ck_rv fc_generatekey( ck_session_handle hsession, ck_mechanism_ptr pmechanism, ck_attribute_ptr ptemplate, ck_ulong ulcount, ck_object_handle_ptr phkey ); parameters hsession [in] session handle.
...ptemplate [in] pointer to the template for the new key.
... ulcount [in] number of attributes in the template.
FC_GetAttributeValue
syntax ck_rv fc_getattributevalue( ck_session_handle hsession, ck_object_handle hobject, ck_attribute_ptr ptemplate, ck_ulong uscount ); parameters hsession [in] session handle.
...ptemplate [in, out] pointer to template.
... uscount [in] number of attributes in the template.
FC_SetAttributeValue
syntax ck_rv fc_setattributevalue( ck_session_handle hsession, ck_object_handle hobject, ck_attribute_ptr ptemplate, ck_ulong uscount ); parameters hsession [in] session handle.
...ptemplate [in, out] pointer to template.
... uscount [in] number of attributes in the template.
FC_UnwrapKey
name fc_unwrapkey - unwrap a key syntax ck_rv fc_unwrapkey( ck_session_handle hsession, ck_mechanism_ptr pmechanism, ck_object_handle hunwrappingkey, ck_byte_ptr pwrappedkey, ck_ulong uswrappedkeylen, ck_attribute_ptr ptemplate, ck_ulong usattributecount, ck_object_handle_ptr phkey ); parameters hsession [in] session handle.
...ptemplate [in] pointer to the list of attributes for the unwrapped key.
... usattributecount [in] number of attributes in the template.
Detailed XPCOM hashtable guide
nsthashtable nsthashtable is a c++ template that wraps pldhash.
... the template parameter is the entry class.
... nsbasehashtable and friends: nsdatahashtable, nsinterfacehashtable, and nsclasshashtable these c++ templates provide a high-level interface for using hashtables that hides most of the complexities of pldhash.
nsIDOMXULElement
builder nsixultemplatebuilder read only.
... retrives the element's template builder, if it has a template.
...returns the template builder's database, if it is an rdf template.
nsIMicrosummaryGenerator
microsummaries generated by xslt templates need page content, while those which represent the actual microsummary do not.
...generatemicrosummary() generate a microsummary by processing the generator template against the page content.
... return value the text result of processing the template.
WebIDL bindings
tionhandling aexceptionhandling = ereportexceptions); int16_t somemethod(const nsastring& somestring, errorresult& rv, exceptionhandling aexceptionhandling = ereportexceptions); }; class myothercallback : public callbackinterface { public: int16_t dosomething(nsinode& somenode, errorresult& rv, exceptionhandling aexceptionhandling = ereportexceptions); template<typename t> int16_t dosomething(const t& thisobj, nsinode& somenode, errorresult& rv, exceptionhandling aexceptionhandling = ereportexceptions); }; and these c++ function declarations on the implementation of myinterface: already_addrefed<mycallback> getfoo(); void setfoo(mycallback&); already_addrefed<mycallback> getbar(); void setbar(mycallback*); a consumer of mycallback ...
...this second call method is a template on the type of the first argument, so the this value can be passed in in whatever form is most convenient, as long as it's either a type that can be wrapped by xpconnect or a webidl interface type.
...bar; }; will lead to this c++ class declaration, in the mozilla::dom namespace: class mycallback : public callbackfunction { public: int32_t call(myinterface& arg1, bool arg2, errorresult& rv, exceptionhandling aexceptionhandling = ereportexceptions); template<typename t> int32_t call(const t& thisobj, myinterface& arg1, bool arg2, errorresult& rv, exceptionhandling aexceptionhandling = ereportexceptions); }; and these c++ function declarations in the myinterface class: already_addrefed<mycallback> getfoo(); void setfoo(mycallback&); already_addrefed<mycallback> getbar(); void setbar(mycallback*); a consumer of mycallback would be able t...
Web-based protocol handlers - Web APIs
the url template, used as the handler.
...firefox displays a prompt in the notification bar area: note:the url template supplied when registering must be of the same domain as the webpage attempting to perform the registration or the registration will fail.
...the browser extracts the href from the activated link, combines it with the url template supplied during handler registration and performs an http get on the url.
::slotted() - CSS: Cascading Style Sheets
WebCSS::slotted
the ::slotted() css pseudo-element represents any element that has been placed into a slot inside an html template (see using templates and slots for more information).
... in this demo we use a simple template with three slots: <template id="person-template"> <div> <h2>personal id card</h2> <slot name="person-name">name missing</slot> <ul> <li><slot name="person-age">age missing</slot></li> <li><slot name="person-occupation">occupation missing</slot></li> </ul> </div> </template> a custom element — <person-details> — is defined like so: customelements.define('pers...
...on-details', class extends htmlelement { constructor() { super(); let template = document.getelementbyid('person-template'); let templatecontent = template.content; const shadowroot = this.attachshadow({mode: 'open'}); let style = document.createelement('style'); style.textcontent = 'div { padding: 10px; border: 1px solid gray; width: 200px; margin: 10px; }' + 'h2 { margin: 0 0 10px; }' + 'ul { margin: 0; }' + 'p { margin: 10px 0; }' + '::slotted(*) { color: gray; font-family: sans-serif; } '; shadowroot.appendchild(style); shadowroot.appendchild(templatecontent.clonenode(true)); } }) you'll see that when filling the style element w...
Recipe: Media objects - CSS: Cascading Style Sheets
by using grid-template-areas to achieve the layout, i can see the pattern in the css.
... an option for the pattern is to flip it to switch the image to the other side — this is done by adding the media-flip class, which defines a flipped grid template causing the layout to be mirrored.
... relevant resources on mdn css grid layout progressive enhancement and grid layout using grid template areas fit-content grid-template-areas ...
repeat() - CSS: Cascading Style Sheets
WebCSSrepeat
this function can be used in the css grid properties grid-template-columns and grid-template-rows.
...treating each track as its maximal track sizing function (each independant value used to define grid-template-rows or grid-template-columns), if that is definite.
... </div> </div> css #container { display: grid; grid-template-columns: repeat(2, 50px 1fr) 100px; grid-gap: 5px; box-sizing: border-box; height: 200px; width: 100%; background-color: #8cffa0; padding: 10px; } #container > div { background-color: #8ca0ff; padding: 5px; } result specifications specification status comment css grid layoutthe definition of 'repeat()' in that specification.
Separate sites for mobile and desktop - Developer guides
conceptually simple, this is the easiest option to add to an existing site, especially if you are using a cms or web application that supports templates.
...if you are using a cms, it is possible to arrange your site templates in a way that minimizes this duplication.
... however any time that there is a difference between the mobile and desktop templates, there is a potential source of complication in your code.
<slot> - HTML: Hypertext Markup Language
WebHTMLElementslot
examples <template id="element-details-template"> <style> details {font-family: "open sans light", helvetica, arial, sans-serif } .name {font-weight: bold; color: #217ac0; font-size: 120% } h4 { margin: 10px 0 -8px 0; background: #217ac0; color: white; padding: 2px 6px; border: 1px solid #cee9f9; border-radius: 4px; } .attributes { margin-left: 22px; font-si...
...tributes p { margin-left: 16px; font-style: italic } </style> <details> <summary> <code class="name">&lt;<slot name="element-name">need name</slot>&gt;</code> <i class="desc"><slot name="description">need description</slot></i> </summary> <div class="attributes"> <h4>attributes</h4> <slot name="attributes"><p>none</p></slot> </div> </details> <hr> </template> note: you can see this complete example in action at element-details (see it running live).
... in addition, you can find an explanation at using templates and slots.
<xsl:apply-imports> - XSLT: Extensible Stylesheet Language Transformations
import precedence requires that template rules in main stylesheets have higher precedence than template rules in imported stylesheets.
... sometimes, however, it is useful to be able to force the processor to use a template rule from the (lower precedence) imported stylesheet rather than an equivalent rule in the main stylesheet.
... type instruction, appears within a template.
<xsl:attribute> - XSLT: Extensible Stylesheet Language Transformations
but it may be after or inside elements that won't be part of the output (like <xsl:choose> or <xsl:apply-templates> etc.).
... syntax <xsl:attribute name=name namespace=uri> template </xsl:attribute> required attributes name specifies the name of the attribute to be created in the output document.
... type instruction, appears within a template or an <xsl:attribute-set> element.
<xsl:fallback> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementfallback
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:fallback> element specifies what template to use if a given extension (or, eventually, newer version) element is not supported.
... syntax <xsl:fallback> template </xsl:fallback> required attributes none.
... type instruction, appears within a template.
<xsl:stylesheet> - XSLT: Extensible Stylesheet Language Transformations
default-collation specifies the default collation used by all xpath expressions appearing in attributes or text value templates that have the element as an ancestor, unless overridden by another default-collation attribute on an inner element.
... default-mode defines the default value for the mode attribute of all <xsl:template> and <xsl:apply-templates> elements within its scope.
... expand-text determines whether descendant text nodes of the element are treated as text value templates.
<xsl:variable> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementvariable
because xslt permits no side-effects, once the value of the variable has been established, it remains the same until the variable goes out of scope syntax <xsl:variable name=name select=expression > template </xsl:variable> required attributes name gives the variable a name.
...if the element contains a template, this attribute is ignored.
...if it occurs within a template, the variable is local in scope, accessible only within the template in which it appears.
An Overview - XSLT: Extensible Stylesheet Language Transformations
in essence, an xslt stylesheet is a set of rules, called templates, which declare that any node that matches this specific pattern should be manipulated in this specific way and end up in this specific position in the result tree.
... potential conflicts in template matching are resolved by using a set of cascading precedence rules.
... in general, a more specific template rule takes precedence over a less specific one and, other things being equal, a template rule that appears later in the document takes precedence over one that appears earlier.
Using the WebAssembly JavaScript API - WebAssembly
next, let’s create a simple html file called index.html in the same directory as your wasm file (can use our simple template if you haven’t got one easily available).
... create another new simple html page (copy our simple template) and call it memory.html.
... create a new copy of our html template in the same directory and call it table.html.
Creating custom Firefox extensions with the Mozilla build system - Archive of obsolete content
note that before actually building anything, the mozilla build system invokes a configuration process that generates the actual makefiles used for the build from makefile templates called makefile.in.
... the actual makefiles tend to be very similar or identical to the templates, but the extra flexibility gained from having the makefiles generated dynamically is one of the things that makes the build system so powerful.
Appendix: What you should know about open-source software licenses - Archive of obsolete content
if you are using the gpl or lgpl, use the declaration at the end of the license’s full text as a template and insert that.
... gpl license declaration template if you develop a new program, and you want it to be of the greatest possible use to the public, the best way to achieve this is to make it free software that everyone can redistribute and change under these terms.
Index of archived content - Archive of obsolete content
cellmap table cellmap - border collapse table layout regression tests table layout strategy tamarin abcasm tamarin acceptance testing abc assembler tests actionscript acceptance tests tamarin acceptance test template actionscript performance tests cmdline tests running tamarin acceptance tests running tamarin performance tests tamarin build system documentation tamarin releases tamarin-central rev 703:2cee46be9ce0 ...
...installers) mac stub installer unix stub installer windows stub installer learn xpi installer scripting by example installer script using xpinstall to install plugins install script template xpinstall api reference examples file.macalias file.windowsshortcut install.adddirectory install.addfile installtrigger.installchrome installtrigger.startsoftwareupdate trigg...
Dehydra Object Reference - Archive of obsolete content
.template template object the template from which this class was instantiated, if applicable.
... .isexplicit boolean flag true for constructors declared using the c++ explicit keyword template objects property type description .name string the name of the template, for example "nscomptr".
Binding Attachment and Detachment - Archive of obsolete content
when a binding is attached, the following events occur: if required, anonymous content is cloned from the binding's content template and inserted around the bound element.
...therefore new binding definitions can be generated dynamically or the anonymous content templates for bindings can be altered and used by the bound document.
Mac stub installer - Archive of obsolete content
add an <component>.jst install script template file (the jst extension stands for javascript template indicating this is a template for the final install.js for the <component>.xpi.
... add a [componentx] section to the config.ini template file named config.ini_tmpl found at: <http://lxr.mozilla.org/seamonkey/sou...onfig.ini_tmpl>.
Unix stub installer - Archive of obsolete content
add an <component>.jst install script template file (the jst extension stands for javascript template indicating this is a template for the final install.js for the <component>.xpi.
... add a [componentx] section to the config.ini template file named config.it found at: <http://lxr.mozilla.org/seamonkey/sou...unix/config.it>.
uri - Archive of obsolete content
ArchiveMozillaXULAttributeuri
« xul reference home uri type: string for template-generated content, the attribute should be placed on the element where content generation should begin.
... thus, it should be placed on an element that is a descendant of a template.
builder - Archive of obsolete content
« xul reference builder type: nsixultemplatebuilder for content generated from a template, this is the xpcom object that is responsible for generating the content.
... for scripts it is only necessary in case you want to force the template content to be regenerated.
Introduction to XBL - Archive of obsolete content
the template has two bindings, one called binding1 and the other called binding2.
...note the namespace on the bindings element in the template above.
bindings - Archive of obsolete content
more information is available in the template guide.
...rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width object type: string the object of the element.
content - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width propiedades tag type: tag name this may be set to a tag name.
... if set, the conditions will only match if the template builder is parsing content for an element directly inside this tag.
query - Archive of obsolete content
ArchiveMozillaXULquery
« xul reference home [ examples | attributes | properties | methods | related ] used to specify the query for a template.
...rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
rule - Archive of obsolete content
ArchiveMozillaXULrule
« xul reference home [ examples | attributes | properties | methods | related ] a rule is used in a template.
... when no query element is used in a template, a default query is used and the simple query syntax may be used for rdf datasources.
tree - Archive of obsolete content
ArchiveMozillaXULtree
even though the template uses treeitem elements to define the content, dom nodes for these elements are not created.
... dont-test-empty: for template generated content, the builder will not check that a container is empty.
where - Archive of obsolete content
ArchiveMozillaXULwhere
« xul reference home [ examples | attributes | properties | methods | related ] indicate a condition that must match for a template result to be used.
...rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
ant script to assemble an extension - Archive of obsolete content
the final build blogmark.xpi"> <zip destfile="blogmark-${version}.xpi"> <zipfileset dir="." includes="chrome/blogmark.jar" /> <zipfileset dir="." includes="install.rdf" /> </zip> </target> everything inside the chrome directory is zipped into chrome/blogmark.jar <target name="createjar" depends="templates" description="assemble the jar"> <jar destfile="chrome/blogmark.jar"> <fileset dir="chrome/"> <include name="**/*"/> <exclude name="**/*~"/> <exclude name="**/*.tpl.*"/> <exclude name="blogmark.jar"/> </fileset> ...
... </jar> </target> <target name="templates" description="generate files from templates."> <copy file="chrome/content/blogmark/contents.rdf.tpl.xml" tofile="chrome/content/blogmark/contents.rdf" overwrite="true"> <filterchain> <replacetokens> <token key="version" value="${version}"/> <token key="description" value="${description}"/> </replacetokens> </filterchain> </copy> <copy file="chrome/content/blogmark/about.xul.tpl.xml" tofile="chrome/content/blogmark/about.xul" ...
background-size - Archive of obsolete content
if so, feel free to change the en/css_reference/property_template and all css property pages ; ) start with -webkit-background-size and investigate support of contain and cover keywords and "omitted second value" behavior.
...but we need facts, rather than assumptions.] btw, some time ago i'v listed opera in the property template table and removed netscape because netscape is gecko based and opera has a global market share of > 2% (> 40% in some european countries).
Plug-in Development Overview - Gecko Plugin API Reference
also, the windows version information for the plug-in dll will be used to determines the mime types, file extensions, file open template, plug-in name, and description.
... for this the version stamp of the embedded resource of the plug-in dll should contain the following set of string/value pairs: mimetype: for mime types fileextents: for file extensions fileopenname: for file open template productname: for plug-in name filedescription: for description language: for language in use in the mime types and file extensions strings, multiple values are separated by the "|" character, for example: video/quicktime|audio/aiff|image/jpeg the version stamp will be loaded only if it has been created with the language set to "us english" and the character set to "windows multilingual" in your development environment.
Grid - MDN Web Docs Glossary: Definitions of Web-related terms
a css grid is defined using the grid value of the display property; you can define columns and rows on your grid using the grid-template-rows and grid-template-columns properties.
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } .wrapper { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 100px 100px; } <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> <div>six</div> <div>seven</div> <div>eight</div> </div> ...
Grid Column - MDN Web Docs Glossary: Definitions of Web-related terms
it is defined by the grid-template-columns property or in the shorthand grid or grid-template properties.
... learn more property reference grid-template-columns grid-auto-columns grid grid-template further reading css grid layout guide: basic concepts of grid layout ...
Grid container - MDN Web Docs Glossary: Definitions of Web-related terms
the direct children can now lay themselves out on any explicit grid defined using grid-template-columns and grid-template-rows, or on the implicit grid created when an item is placed outside of the explicit grid.
... learn more property reference grid-template-columns grid-template-rows grid-auto-columns grid-auto-rows grid grid-template further reading css grid layout guide: basic concepts of grid layout ...
Grid Row - MDN Web Docs Glossary: Definitions of Web-related terms
it is defined by the grid-template-rows property or in the shorthand grid or grid-template properties.
... learn more property reference grid-template-rows grid-auto-rows grid grid-template further reading css grid layout guide: basic concepts of grid layout ...
Creating fancy letterheaded paper - Learn web development
in this assessment we'll challenge you to create an online template to achieve such a look.
... project brief you have been given the files needed to create a letterheaded paper template.
Organizing your CSS - Learn web development
.comment { display: grid; grid-template-columns: 1fr 3fr; } .comment img { border: 1px solid grey; } .comment .content { font-size: .8rem; } .list-item { display: grid; grid-template-columns: 1fr 3fr; border-bottom: 1px solid grey; } .list-item .content { font-size: .8rem; } in oocss, you would create one pattern called media that would have all of the common css for both patterns — a base class for things that are g...
... .media { display: grid; grid-template-columns: 1fr 3fr; } .media .content { font-size: .8rem; } .comment img { border: 1px solid grey; } .list-item { border-bottom: 1px solid grey; } in your html the comment would need both the media and comment classes applied: <div class="media comment"> <img /> <div class="content"></div> </div> the list-item would have media and list-item applied: <ul> <li class="media list-item"> <img /> <div class="content"></div> </li> </ul> the work that nicole sullivan did in describing this approach and promoting it means that even people who are not strictly following an oocss ap...
What is a web server? - Learn web development
for example, to produce the final webpages you see in the browser, the application server might fill an html template with content from a database.
...typically, these kinds of sites are composed of only a few html templates and a giant database, rather than thousands of static html documents.
HTML table basics - Learn web development
LearnHTMLTablesBasics
you can find the stylesheet here, and you can also find an html template that applies the stylesheet — these together will give you a good starting point for experimenting with html tables.
... first of all, make a local copy of blank-template.html and minimal-table.css in a new directory on your local machine.
Assessment: Structuring planet data - Learn web development
starting point to start the assessment, make local copies of blank-template.html, minimal-table.css, and planets-data.txt in a new directory in your local computer.
... open your copy of blank-template.html, and start the table off by giving it an outer container, a table header, and a table body.
Graceful asynchronous programming with Promises - Learn web development
first of all, download our simple html template and the sample image file that we'll fetch.
... download a fresh copy of our page template, and again put a <script> element just before the closing </body> tag.
Cooperative asynchronous JavaScript: Timeouts and intervals - Learn web development
grab a basic html template (such as this one).
... apply the following css to the html template (in whatever way you prefer).
Test your skills: Strings - Learn web development
we want you to change the value of the string as follows: change it from a regular string literal into a template literal.
... replace the four asterisks with four template literal placeholders.
Introduction to the server side - Learn web development
on a dynamic website html pages are normally created by inserting data from a database into placeholders in html templates (this is a much more efficient way of storing large amounts of content than using static websites).
...for "dynamic requests" the server interprets the request, reads required information from the database (3), combines the retrieved data with html templates (4), and sends back a response containing the generated html (5,6).
Getting started with Ember - Learn web development
designers and other non-developers can contribute to page templates without any knowledge of javascript, and interactivity can be added later.
... this language also enables lighter asset payloads due to compiling the templates into a "byte code" that can be parsed faster than javascript.
Framework main features - Learn web development
given this handlebars template: <header> <h1>hello, {{subject}}!</h1> </header> and this data: { subject: "world" } handlebars will build html like this: <header> <h1>hello, world!</h1> </header> typescript typescript is a superset of javascript, meaning it extends javascript — all javascript code is valid typescript, but not the other way around.
...it is not a virtual dom nor an incremental dom; it is a separate process through which ember's templates are transpiled into a kind of "byte code" that is easier and faster to read than javascript.
Deployment and next steps - Learn web development
a look behind the svelte compilation process by default, when you create a new app with npx degit sveltejs/template my-svelte-project, svelte will use rollup as the module bundler.
... note: there is also an official template for using webpack and also many community-maintained plugins for other bundlers.
Dynamic behavior in Svelte: working with variables and props - Learn web development
we've turned our static markup into a dynamic template ready to display the tasks from our component's state.
... turning static markup into a live template.
Focus management with Vue refs - Learn web development
vue components are written as a combination of javascript objects that manage the app's data and an html-based template syntax that maps to the underlying dom structure.
... beforemount() — runs after your template is compiled, but before your component is rendered to the actual dom.
Vue resources - Learn web development
vue components are written as a combination of javascript objects that manage the app's data and an html-based template syntax that maps to the underlying dom structure.
...only what you return from this function is available in your <template>s.
Creating MozSearch plugins
s="http://www.mozilla.org/2006/browser/search/"> <shortname>yahoo</shortname> <description>yahoo search</description> <inputencoding>utf-8</inputencoding> <image width="16" height="16">data:image/x-icon;base64,r0lgodlheaaqajecap8aaaaaap///waaach5baeaaaialaaaaaaqabaaaaipli+py+0nogquybdened2khkffwuamezmpzsfmaihphrrguum/ft+uwaaow==</image> <url type="application/x-suggestions+json" method="get" template="http://ff.search.yahoo.com/gossip?output=fxjson&amp;command={searchterms}" /> <url type="text/html" method="get" template="http://search.yahoo.com/search"> <param name="p" value="{searchterms}"/> <param name="ei" value="utf-8"/> <mozparam name="fr" condition="pref" pref="yahoo-fr" /> </url> <searchform>http://search.yahoo.com/</searchform> </searchplugin> let's say the user chooses to u...
...cok9armhbzaw0aecibhkalc0mdy7x9abna3obazxiaa6ikecglmvqhwwyjyul2d4v2cpg8vzswx7ghyaaak7aoif7saboqcmn4ha3ahfsidtgpq%2fvlz8p4mskj2w9h8ggbjevxvhdo4fquqg%2fkdypqcg4h8luiacnq%2fsobmyi8basajfpcj1aaeejwvqqlpabxmh5bjjqi0gi9dtaagdbbccavlkgmq7ykczxpcqxquzhaeccj4xgml493ug21zd%2badaxh0wlm4a9mzpxjkjiiawtar5pqmalacabquulttbgccagcnnzgabbgamj5thwgvjlaaaaabjru5erkjggg%3d%3d</image> <url type="text/html" method="get" template="http://developer.mozilla.org/en/docs/special:search?search={searchterms}"/> <searchform>http://developer.mozilla.org/en/docs/special:search</searchform> </searchplugin> notice in this case that instead of using <param> to define parameters to the search engine, they're simply embedded inside the template url.
Overview of Mozilla embedding APIs
nscomtypeinfo<interface-type>::getiid() this template helper class allows easy access to an interface's nsiid.
... typically the ns_get_iid(...) macro is used instead of using the nscomtypeinfo template directly.
IPDL Type Serialization
each type specializes ipc::paramtraits as follows: namespace ipc { template <> struct paramtraits<mytype> { typedef mytype paramtype; static void write(message* amsg, const paramtype& aparam) { // implement serialization here } static bool read(const message* amsg, void** aiter, paramtype* aresult) { // implement deserialization here.
...most structures can be serialized in this manner: struct examplestruct { int i; nscstring j; int k[4]; }; namespace ipc { template <> struct paramtraits<examplestruct> { typedef examplestruct paramtype; static void write(message* amsg, const paramtype& aparam) { writeparam(amsg, aparam.i); writeparam(amsg, aparam.j); for (int i = 0; i < 4; ++i) writeparam(amsg, aparam.k[i]); } static bool read(const message* amsg, void** aiter, paramtype* aresult) { if (!readparam(amsg, aiter, &(aresult->i...
Localizing with Koala
creating a new project create a new koala project by going to file > new > new project from template...
...choose "koala" in the templates list.
Creating localizable web applications
good: require_once('templates/footer.php'); if it's not possible to remove the app logic code, you should consider using gettext.
...might be also helpful for headers and footers, if you're not using templates to display them.
L20n Javascript API
ctx.linkresource('../locale/strings.l20n'); ctx.linkresource(template: function) add a resource identified by a url to the context instance.
...the function passed to linkresource (called a template function) takes one argument which is the code of the current locale, which needs to be first registered with registerlocales.
JSS FAQ
MozillaProjectsNSSJSSJSS FAQ
seful: org/mozilla/jss/asn1/integer.java org/mozilla/jss/asn1/sequence.java org/mozilla/jss/asn1/set.java org/mozilla/jss/pkcs10/certificationrequest.java org/mozilla/jss/pkcs12/pfx.java org/mozilla/jss/pkix/cert/certificate.java org/mozilla/jss/pkix/cmmf/certrepcontent.java org/mozilla/jss/pkix/crmf/certreqmsg.java org/mozilla/jss/pkix/crmf/certtemplate.java org/mozilla/jss/pkix/primitive/name.java org/mozilla/jss/provider/javax/crypto/jsssecretkeyfactoryspi.java org/mozilla/jss/util/utf8converter.java org/mozilla/jss/util/base64inputstream.java jss/samples/pqggen.java jss/samples/pkcs12.java if i don't call setcipherpolicy, is the domestic policy used by default?
... import java.io.bytearrayinputstream; [...] certificate cert = (certificate) asn1util.decode( certificate.gettemplate(),x509cert.getencoded() ); how do i convert org.mozilla.jss.pkix.cert to org.mozilla.jss.crypto.x509certificate?
Enc Dec MAC Output Public Key as CSR
(arena, sizeof(certcertificaterequest)); if (!certreq) { rv = secfailure; goto cleanup; } certreq->arena = arena; /* since cert request is a signed data, must decode to get the inner data */ port_memset(&signeddata, 0, sizeof(signeddata)); rv = sec_asn1decodeitem(arena, &signeddata, sec_asn1_get(cert_signeddatatemplate), &reqder); if (rv) { rv = secfailure; goto cleanup; } rv = sec_asn1decodeitem(arena, certreq, sec_asn1_get(cert_certificaterequesttemplate), &signeddata.data); if (rv) { rv = secfailure; goto cleanup; } rv = cert_verifysigneddatawithpublickeyinfo(&signeddata, &certreq->subjectpublickeyinfo, null /...
...ertificaterequestattributes(cr); if (exthandle == null) { port_freearena (arena, pr_false); rv = secfailure; goto cleanup; } cert_finishextensions(exthandle); cert_finishcertificaterequestattributes(cr); /* der encode the request */ encoding = sec_asn1encodeitem(arena, null, cr, sec_asn1_get(cert_certificaterequesttemplate)); if (encoding == null) { pr_fprintf(pr_stderr, "der encoding of request failed\n"); rv = secfailure; goto cleanup; } /* sign the request */ signalgtag = sec_getsignaturealgorithmoidtag(keytype, hashalgtag); if (signalgtag == sec_oid_unknown) { pr_fprintf(pr_stderr, "unknown key or hash type\n"); rv = secfailure; goto cleanup; ...
nss tech note4
extensions++; } } an example custom cert extension struct _mycertextdata { secitem version; secitem streetaddress; secitem phonenum; secitem rfc822name; secitem id; secitem maxusers; }; typedef struct _mycertextdata mycertextdata; /* template used for decoding the extension */ const sec_asn1template mycertexttemplate[] = { { sec_asn1_sequence, 0, null, sizeof( mycertextdata ) }, { sec_asn1_integer, offsetof(mycertextdata, version) }, { sec_asn1_octet_string, offsetof( mycertextdata, streetaddress ) }, { sec_asn1_octet_string, offsetof( mycertextdata, phonenum ) }, ...
... }; static const secitem myoiditem = { (secitemtype) 0, (unsigned char *)myoid, sizeof(myoid) }; secitem myextvalue; mycertextdata data; secstatus rv = cert_findcertextensionbyoid(cert, &myoiditem, &myextvalue); if (rv == secsuccess) { sec_asn1decodercontext * context = sec_asn1decoderstart(null, &data, mycertexttemplate); rv = sec_asn1decoderupdate( context, (const char *)(myextvalue.data), myextvalue.len); if (rv == secsuccess) { /* now you can extract info from secitem fields of your extension data structure */ /* see "misc helper functions" below */ .......
nss tech note7
struct myrsapublickey { secitem m_modulus; secitem m_exponent; } inpubkey; secitem derpubkey; seckeypublickey *pubkey; const sec_asn1template myrsapublickeytemplate[] = { { sec_asn1_sequence, 0, null, sizeof(myrsapublickey) }, { sec_asn1_integer, offsetof(myrsapublickey,m_modulus), }, { sec_asn1_integer, offsetof(myrsapublickey,m_exponent), }, { 0, } }; prarenapool *arena; /* * point inpubkey.m_modulus and m_exponent at the data, and * then set their types to unsigned integers.
... */ inpubkey.m_modulus.type = siunsignedinteger; inpubkey.m_exponent.type = siunsignedinteger; arena = port_newarena(der_default_chunksize); sec_asn1encodeitem(arena, &derpubkey, &inpubkey, myrsapublickeytemplate); pubkey = seckey_importderpublickey(&derpubkey, ckk_rsa); port_freearena(arena, pr_false); public keys may be extracted from certificates.
FC_WrapKey
hwrappingkey [in] pointer to the public key template.
... hkey [in] number of attributes in the public key template.
sslerr.html
e ocsp response contains out-of-date information." sec_error_digest_not_found -8059 "the cms or pkcs #7 digest was not found in signed message." sec_error_unsupported_message_type -8058 "the cms or pkcs #7 message type is unsupported." sec_error_module_stuck -8057 "pkcs #11 module could not be removed because it is still in use." sec_error_bad_template -8056 "could not decode asn.1 data.
... specified template was invalid." sec_error_crl_not_found -8055 "no matching crl was found." sec_error_reused_issuer_and_serial -8054 "you are attempting to import a cert with the same issuer/serial as an existing cert, but that is not the same cert." sec_error_busy -8053 "nss could not shutdown.
JIT Optimization Outcomes
cantinlinenativenotemplateobj unable to inline function call.
... cannot inline a native constructor (e.g., new array) because no template object was cached by the baseline compiler.
JSConstDoubleSpec
syntax template<typename t> struct jsconstscalarspec { const char *name; t val; /* uint8_t flags; // obsolete from jsapi 35 uint8_t spare[3]; // obsolete from jsapi 35 */ }; typedef jsconstscalarspec<double> jsconstdoublespec; typedef jsconstscalarspec<int32_t> jsconstintegerspec; // added in spidermonkey 38 name type description val double or int32_t value for the double or integer.
...js_defineconstintegers bug 1066020 - changed to template, and removed flags and spare ...
XPCOM hashtable guide
the template specialization to use depends on the data type and the key type.
...set) nsthashtable simple types (numbers, booleans, etc) nsdatahashtable structs or classes (nsstring, custom defined structs or classes that are not reference-counted) nsclasshashtable reference-counted concrete classes nsrefptrhashtable interface pointers nsinterfacehashtable each of these classes is a template with two parameters.
nsAutoRefTraits
nsautoreftraits<t> is a template class describing traits of resources held by objects of class nsautoref<t> and/or nscountedref<t>.
...for example: ns_specialize_template class nsautoreftraits<prfiledesc> : public nspointerreftraits<prfiledesc> { public: static void release(prfiledesc *ptr) { pr_close(ptr); } }; or ns_specialize_template class nsautoreftraits<fcpattern> : public nspointerreftraits<fcpattern> { public: static void release(fcpattern *ptr) { fcpatterndestroy(ptr); } static void addref(fcpattern *ptr) { fcpatternreference(ptr); } }; nsautoreftraits is described in xpcom/base/nsautore...
XPCOM glue classes
this class is typically used to represent unicode character arrays.nsastring (external)class declarationnsastring_internalclass declarationnsautorefnsautoref<t> is a template class implementing an object that holds a handle to a resource that must be released, typically on destruction of the object.</t>nsautoreftraitsnsautoreftraits<t> is a template class describing traits of resources held by objects of class nsautoref<t> and/or nscountedref<t>.</t>nsautostringclass declarationnsautostring (external)class declarationnscautostringclass declarationnscautostring (extern...
...al)class declarationnscomptrthis utility class simplifies managing xpcom interface references from c++ code.nscountedrefnscountedref<t> is a template class implementing an object that takes a strong reference to a reference-counted resource that must be released, typically on destruction of the object.</t>nscstringclass declarationnscstring externalclass declarationnscstringcontainer (external)class declaration nscstringencodingthe nscstringencoding enumeration describes the set of character encodings understood by the ns_cstringtoutf16 and ns_utf16tocstring functions.nsdependentcstringclass declarationnsdependentcstring externalclass declarationnsdependentcsubstringclass declarationnsdependentcsubstring externalclass declarationnsdependentstringclass declarationnsdependentstring externalclass...
nsIXULSortService
content/xul/templates/public/nsixulsortservice.idlscriptable a service used to sort the contents of a xul widget.
...asorthints one or more hints as to how to sort: ascending: sort the contents in ascending order descending: sort the contents in descending order comparecase: perform case sensitive comparisons integer: treat values as integers, non-integers are compared as strings twostate: do not allow the natural (unordered state) see also nsixultemplatequeryprocessor ...
nsMsgFolderFlagType
const nsmsgfolderflagtype imapotheruser = 0x00200000; /// whether this is the template folder const nsmsgfolderflagtype templates = 0x00400000; /// this folder is one of your personal folders that is shared with other users const nsmsgfolderflagtype personalshared = 0x00800000; /// this folder is an imap \\noselect folder const nsmsgfolderflagtype imapnoselect = 0x01000000; /// this folder created offline const nsmsgfolderflagtype createdoffline = 0x...
...es const nsmsgfolderflagtype checknew = 0x20000000; /// this folder is for spam messages const nsmsgfolderflagtype junk = 0x40000000; /// this folder is in favorites view const nsmsgfolderflagtype favorite = 0x80000000; /// special-use folders const nsmsgfolderflagtype specialuse = inbox|drafts|trash|sentmail| templates|junk|archive|queue; /** @} */ }; ...
Reference Manual
because a few key routines are factored out into a common non-template base class, the actual underlying pointer is stored as an nsisupports* (except in debug builds where nscap_feature_debug_ptr_types is turned on).
...however, the routines that would normally be factored into a base class now must become template-specific inlines.
Plug-in Development Overview - Plugins
also, the windows version information for the plug-in dll will be used to determines the mime types, file extensions, file open template, plug-in name, and description.
... for this the version stamp of the embedded resource of the plug-in dll should contain the following set of string/value pairs: mimetype: for mime types fileextents: for file extensions fileopenname: for file open template productname: for plug-in name filedescription: for description language: for language in use in the mime types and file extensions strings, multiple values are separated by the "|" character, for example: video/quicktime|audio/aiff|image/jpeg the version stamp will be loaded only if it has been created with the language set to "us english" and the character set to "windows multilingual" in your development environment.
Basic usage of canvas - Web APIs
our code snippet from above becomes something like this: var canvas = document.getelementbyid('tutorial'); if (canvas.getcontext) { var ctx = canvas.getcontext('2d'); // drawing code here } else { // canvas-unsupported code here } a skeleton template here is a minimalistic template, which we'll be using as a starting point for later examples.
... here is how a template would look in action.
Element.slot - Web APIs
WebAPIElementslot
a slot is a placeholder inside a web component that users can fill with their own markup (see using templates and slots for more information).
... examples in our simple-template example (see it live), we create a trivial custom element example called <my-paragraph> in which a shadow root is attached and then populated using the contents of a template that contains a slot named my-text.
Index - Web APIs
WebAPIIndex
1938 htmltemplateelement api, html dom, htmltemplateelement, interface, reference, web components the htmltemplateelement interface enables access to the contents of an html <template> element.
... 1939 htmltemplateelement.content api, html dom, htmltemplateelement, property, reference, web components the htmltemplateelement.content property returns a <template> element's template contents (a documentfragment).
Intersection Observer API - Web APIs
threshold example <template id="boxtemplate"> <div class="samplebox"> <div class="label topleft"></div> <div class="label topright"></div> <div class="label bottomleft"></div> <div class="label bottomright"></div> </div> </template> <main> <div class="contents"> <div class="wrapper"> </div> </div> </main> .contents { position: absolute; width: 700px; height: 1725px; } .wrapper { po...
... let thresholdsets = [ [], [0.5], [0.0, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1.0], [0, 0.25, 0.5, 0.75, 1.0] ]; for (let i=0; i<=1.0; i+= 0.01) { thresholdsets[0].push(i); } // add each box, creating a new observer for each for (let i=0; i<4; i++) { let template = document.queryselector("#boxtemplate").content.clonenode(true); let boxid = "box" + (i+1); template.queryselector(".samplebox").id = boxid; wrapper.appendchild(document.importnode(template, true)); // set up the observer for this box observeroptions.threshold = thresholdsets[i]; observers[i] = new intersectionobserver(intersectioncallback, observeroptions); observe...
Introduction - Web APIs
transformations in xslt are based on rules that consist of templates.
... each template matches (using xpath) a certain fragment of the input xml document and then applies the substitution part on that fragment to create the new resulting document.
::part() - CSS: Cascading Style Sheets
WebCSS::part
custom-element::part(foo) { /* styles to apply to the `foo` part */ } syntax ::part( <ident>+ ) examples html <template id="tabbed-custom-element"> <style type="text/css"> *, ::before, ::after { box-sizing: border-box; padding: 1rem; } :host { display: flex; } </style> <div part="tab active">tab 1</div> <div part="tab">tab 2</div> <div part="tab">tab 3</div> </template> <tabbed-custom-element></tabbed-custom-element> css tabbed-custom-element::part(tab) { color: #0c0c0dcc; border-bottom: transparent solid 2px; } tabbed-custom-element::part(tab):hover { background-color: #0c0c0d19; border-color: #0c0c0d33; } tabbed-custom-element::part(tab):hover:active { back...
...ground-color: #0c0c0d33; } tabbed-custom-element::part(tab):focus { box-shadow: 0 0 0 1px #0a84ff inset, 0 0 0 1px #0a84ff, 0 0 0 4px rgba(10, 132, 255, 0.3); } tabbed-custom-element::part(active) { color: #0060df; border-color: #0a84ff !important; } javascript let template = document.queryselector("#tabbed-custom-element"); globalthis.customelements.define(template.id, class extends htmlelement { constructor() { super(); this.attachshadow({ mode: "open" }); this.shadowroot.appendchild(template.content); } }); result specifications specification status comment shadow partsthe definition of '::part' in that specification.
CSS Grid Layout and Accessibility - CSS: Cascading Style Sheets
we can also position items using line-based placement of grid template areas, without considering their location in the source.
... * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 100px; } .box1 { grid-column: 1; grid-row: 2; } <div class="wrapper"> <div class="box box1"><a href="">one</a></div> <div class="box box2"><a href="">two</a></div> <div class="box box3"><a href="">three</a></div> <div class="box box4"><a href="">four</a></div> <div class="box box5"><a href="">five</a></div> </div> the specification ...
CSS Grid Layout - CSS: Cascading Style Sheets
v { border: 2px solid rgb(233,171,88); border-radius: 5px; background-color: rgba(233,171,88,.5); padding: 1em; color: #d9480f; } html <div class="wrapper"> <div class="one">one</div> <div class="two">two</div> <div class="three">three</div> <div class="four">four</div> <div class="five">five</div> <div class="six">six</div> </div> css .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 10px; grid-auto-rows: minmax(100px, auto); } .one { grid-column: 1 / 3; grid-row: 1; } .two { grid-column: 2 / 4; grid-row: 1 / 3; } .three { grid-column: 1; grid-row: 2 / 5; } .four { grid-column: 3; grid-row: 3; } .five { grid-column: 2; grid-row: 4; } .six { grid-column: 3; grid-row: 4; } reference css properties grid-temp...
...late-columns grid-template-rows grid-template-areas grid-template grid-auto-columns grid-auto-rows grid-auto-flow grid grid-row-start grid-column-start grid-row-end grid-column-end grid-row grid-column grid-area row-gap column-gap gap css functions repeat() minmax() fit-content() css data types <flex> glossary entries grid grid lines grid tracks grid cell grid area gutters grid axis grid row grid column guides basic concepts of grid layout relationship of grid layout to other layout methods layout using line-based placement grid template areas layout using named grid lines auto-placement in css grid layout box alignment in css grid layout css grid, logical values and writing modes css grid layout and accessibility css grid and progres...
grid-area - CSS: Cascading Style Sheets
WebCSSgrid-area
the grid-area property can also be set to a <custom-ident> which acts as a name for the area, which can then be placed using grid-template-areas.
...] | [ span && [ <integer> | <custom-ident> ] ] examples setting grid areas html <div id="grid"> <div id="item1"></div> <div id="item2"></div> <div id="item3"></div> </div> css #grid { display: grid; height: 100px; grid-template: repeat(4, 1fr) / 50px 100px; } #item1 { background-color: lime; grid-area: 2 / 2 / auto / span 3; } #item2 { background-color: yellow; } #item3 { background-color: blue; } result specifications specification status comment css grid layoutthe definition of 'grid-area' in that specification.
grid-auto-columns - CSS: Cascading Style Sheets
if a grid item is positioned into a column that is not explicitly sized by grid-template-columns, implicit grid tracks are created to hold it.
...adth> = <length-percentage> | <flex> | min-content | max-content | auto<inflexible-breadth> = <length> | <percentage> | min-content | max-content | autowhere <length-percentage> = <length> | <percentage> examples setting grid column size html <div id="grid"> <div id="item1"></div> <div id="item2"></div> <div id="item3"></div> </div> css #grid { height: 100px; display: grid; grid-template-areas: "a a"; grid-gap: 10px; grid-auto-columns: 200px; } #grid > div { background-color: lime; } result specifications specification status comment css grid layoutthe definition of 'grid-auto-columns' in that specification.
grid-auto-rows - CSS: Cascading Style Sheets
if a grid item is positioned into a row that is not explicitly sized by grid-template-rows, implicit grid tracks are created to hold it.
...k-breadth> = <length-percentage> | <flex> | min-content | max-content | auto<inflexible-breadth> = <length> | <percentage> | min-content | max-content | autowhere <length-percentage> = <length> | <percentage> examples setting grid row size html <div id="grid"> <div id="item1"></div> <div id="item2"></div> <div id="item3"></div> </div> css #grid { width: 200px; display: grid; grid-template-areas: "a a"; grid-gap: 10px; grid-auto-rows: 100px; } #grid > div { background-color: lime; } result specifications specification status comment css grid layoutthe definition of 'grid-auto-rows' in that specification.
EXSLT
for example, to use the regular expressions package: <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/xsl/transform" xmlns:regexp="http://exslt.org/regular-expressions"> <xsl:template match="/"> ...
... </xsl:template> </xsl:stylesheet> common the exslt common package provides basic functions that expand upon the capabilities of xslt.
Content categories - Developer guides
, <figure>, <footer>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <header>, <hgroup>, <hr>, <i>, <iframe>, <img>, <input>, <ins>, <kbd>, <keygen>, <label>, <main>, <map>, <mark>, <math>, <menu>, <meter>, <nav>, <noscript>, <object>, <ol>, <output>, <p>, <picture>, <pre>, <progress>, <q>, <ruby>, <s>, <samp>, <script>, <section>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <svg>, <table>, <template>, <textarea>, <time>, <ul>, <var>, <video>, <wbr> and text.
... the script-supporting elements are: <script> <template> transparent content model if an element has a transparent content model, then its contents must be structured such that they would be valid html 5, even if the transparent element were removed and replaced by the child elements.
<dl>: The Description List element - HTML: Hypertext Markup Language
WebHTMLElementdl
permitted content either: zero or more groups each consisting of one or more <dt> elements followed by one or more <dd> elements, optionally intermixed with <script> and <template> elements.
... or: one or more <div> elements, optionally intermixed with <script> and <template> elements.
<menu> - HTML: Hypertext Markup Language
WebHTMLElementmenu
permitted content if the element is in the list menu state: flow content, or alternatively, zero or more occurrences of <li>, <script>, and <template>.
... (list menu is the default state, unless the parent element is a <menu> in the context menu state.) if the element is in the context menu state: zero or more occurrences, in any order, of <menu> (context menu state only), <menuitem>, <hr>, <script>, and <template>.
Classes - JavaScript
classes are a template for creating objects.
... mix-ins abstract subclasses or mix-ins are templates for classes.
SyntaxError: unterminated string literal - JavaScript
examples multiple lines you can't split a string across multiple lines like this in javascript: var longstring = 'this is a very long string which needs to wrap across multiple lines because otherwise my code is unreadable.'; // syntaxerror: unterminated string literal instead, use the + operator, a backslash, or template literals.
...that form looks like this: var longstring = 'this is a very long string which needs \ to wrap across multiple lines because \ otherwise my code is unreadable.'; another possibility is to use template literals, which are supported in ecmascript 2015 environments: var longstring = `this is a very long string which needs to wrap across multiple lines because otherwise my code is unreadable.`; ...
String - JavaScript
this last form specifies a template literal: with this form you can interpolate expressions.
... string.raw() returns a string created from a raw template string.
Progressive web app structure - Progressive web apps (PWAs)
first of all it generates the content based on this template: var template = "<article>\n\ <img src='data/img/slug.jpg' alt='name'>\n\ <h3>#pos.
.../twitter.com/twitter'>@twitter</a></li>\n\ <li><span>website:</span> <a href='http://website/'>website</a></li>\n\ <li><span>github:</span> <a href='https://github'>github</a></li>\n\ <li><span>more:</span> <a href='http://js13kgames.com/entries/slug'>js13kgames.com/entries/slug</a></li>\n\ </ul>\n\ </article>"; var content = ''; for(var i=0; i<games.length; i++) { var entry = template.replace(/pos/g,(i+1)) .replace(/slug/g,games[i].slug) .replace(/name/g,games[i].name) .replace(/author/g,games[i].author) .replace(/twitter/g,games[i].twitter) .replace(/website/g,games[i].website) .replace(/github/g,games[i].github); entry = entry.replace('<a href=\'http:///\'></a>','-'); content += entry; }; document.getelementbyid('conten...
Mobile first - Progressive web apps (PWAs)
to make my simple example i created a sample app structure from a mozilla mortar template.
... built-in features of the mortar template mortar templates contain a number of built-in features.
Structural overview of progressive web apps - Progressive web apps (PWAs)
the first thing it does is to generate the app's displayed content using the following template: var template = "<article>\n\ <img src='data/img/slug.jpg' alt='name'>\n\ <h3>#pos.
...er'> @twitter</a></li>\n\ <li><span>website:</span> <a href='http://website/'>website</a></li>\n\ <li><span>github:</span> <a href='https://github'>github</a></li>\n\ <li><span>more:</span> <a href='http://js13kgames.com/entries/slug'> js13kgames.com/entries/slug</a></li>\n\ </ul>\n\ </article>"; var content = ''; for(var i=0; i<games.length; i++) { var entry = template.replace(/pos/g,(i+1)) .replace(/slug/g,games[i].slug) .replace(/name/g,games[i].name) .replace(/author/g,games[i].author) .replace(/twitter/g,games[i].twitter) .replace(/website/g,games[i].website) .replace(/github/g,games[i].github); entry = entry.replace('<a href=\'http:///\'></a>','-'); content += entry; }; document.getelementbyid('conten...
href - SVG: Scalable Vector Graphics
WebSVGAttributehref
value <url> default value none animatable yes example html, body, svg { height: 100%; } <svg viewbox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"> <image href="/files/2917/fxlogo.png" x="0" y="0" height="100" width="100"/> </svg> lineargradient for <lineargradient>, href defines url referring to a template gradient element; to be valid, the reference must be to a different <lineargradient> or <radialgradient> element.
... value <url> default value none animatable yes radialgradient for <radialgradient>, href defines url referring to a template gradient element; to be valid, the reference must be to a different <lineargradient> or <radialgradient> element.
<linearGradient> - SVG: Scalable Vector Graphics
value type: <transform-list> ; default value: identity transform; animatable: yes href this attribute defines a reference to another <lineargradient> element that will be used as a template.
... value type: <length> ; default value: 100%; animatable: yes xlink:href an <iri> reference to another <lineargradient> element that will be used as a template.
<pattern> - SVG: Scalable Vector Graphics
WebSVGElementpattern
value type: <length>|<percentage>; default value: 0; animatable: yes href this attribute reference a template pattern that provides default values for the <pattern> attributes.
... value type: <length>|<percentage> ; default value: 0; animatable: yes xlink:href deprecated since svg 2 this attribute reference a template pattern that provides default values for the <pattern> attributes.
<radialGradient> - SVG: Scalable Vector Graphics
value type: <transform-list> ; default value: identity transform; animatable: yes href this attribute defines a reference to another <lineargradient> element that will be used as a template.
... value type: pad|reflect|repeat ; default value: pad; animatable: yes xlink:href an <iri> reference to another <lineargradient> element that will be used as a template.
position - XPath
<xsl:template match="//a[position() = 5]"> <!-- this template matches the fifth a element anywhere in the document.
... --> </xsl:template> <xsl:template match="//div[@class='foo']/bar[position() = 1]"> <!-- this template matches the first bar element that is a child of a div element with a class attribute equal to "foo" --> </xsl:template> defined xpath 1.0 4.1 gecko support supported.
<xsl:comment> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementcomment
syntax <xsl:comment> template </xsl:comment> required attributes none.
... type instruction, appears within a template.
<xsl:copy> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementcopy
syntax <xsl:copy use-attribute-sets=list-of-names> template </xsl:copy> required attributes none.
... type instruction, appears within a template.
<xsl:element> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementelement
syntax <xsl:element name=name namespace=uri use-attribute-sets=list-of-names > template </xsl:element> required attributes name specifies the desired name of the output element.
... type instruction, appears within a template.
<xsl:for-each> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementfor-each
syntax <xsl:for-each select=expression> <xsl:sort> [optional] template </xsl:for-each> required attributes select uses an xpath expression to select nodes to be processed.
... type instruction, appears within a template.
<xsl:message> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementmessage
syntax <xsl:message terminate="yes" | "no" > template </xsl:message> required attributes none.
... type instruction, appears within a template.
<xsl:otherwise> - XSLT: Extensible Stylesheet Language Transformations
syntax <xsl:otherwise> template </xsl:otherwise> required attributes none.
... type subinstruction, must appear as the last child of an <xsl:choose> element, within a template.
<xsl:processing-instruction> - XSLT: Extensible Stylesheet Language Transformations
syntax <xsl:processing-instruction name=name> template </xsl:processing-instruction> required attributes name specifies the name of this processing instruction.
... type instruction, appears within a template.
<xsl:sort> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementsort
xslt/xpath reference: xslt elements, exslt functions, xpath functions, xpath axes the <xsl:sort> element defines a sort key for nodes selected by <xsl:apply-templates> or <xsl:for-each> and determines the order in which they are processed.
... type subinstruction, always appears as a child of <xsl:for-each>, where it must appear before the template proper or of <xsl:apply-templates>.
The Netscape XSLT/XPath Reference - XSLT: Extensible Stylesheet Language Transformations
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 (supported) xsl:import (mostly supported) xsl:include (supported) xsl:key (supported) xsl:mes...
...sage (supported) xsl:namespace-alias (not supported) xsl:number (partially supported) xsl:otherwise (supported) xsl:output (partially supported) xsl:param (supported) xsl:preserve-space (supported) xsl:processing-instruction xsl:sort (supported) xsl:strip-space (supported) xsl:stylesheet (partially supported) xsl:template (supported) xsl:text (partially supported) xsl:transform (supported) xsl:value-of (partially supported) xsl:variable (supported) xsl:when (supported) xsl:with-param (supported) axes ancestor ancestor-or-self attribute child descendant descendant-or-self following following-sibling namespace (not supported) parent preceding preceding-sibling self functions boolean() (supported) ceiling() (supported) concat() (supported) c...
Transforming XML with XSLT - XSLT: Extensible Stylesheet Language Transformations
xslt/xpath reference elements xsl:apply-imports (supported) xsl:apply-templates (supported) xsl:attribute (supported) xsl:attribute-set (supported) xsl:call-template (supported) xsl:choose (supported) xsl:comment (supported) xsl:copy (supported) xsl:copy-of (supported) xsl:decimal-format (supported) xsl:element (supported) xsl:fallback (not supported) xsl:for-each (supported) xsl:if (supported) xsl:import (mostly supported) xsl:include (supported) xsl:key (su...
...pported) xsl:message (supported) xsl:namespace-alias (not supported) xsl:number (partially supported) xsl:otherwise (supported) xsl:output (partially supported) xsl:param (supported) xsl:preserve-space (supported) xsl:processing-instruction xsl:sort (supported) xsl:strip-space (supported) xsl:stylesheet (partially supported) xsl:template (supported) xsl:text (partially supported) xsl:transform (supported) xsl:value-of (partially supported) xsl:variable (supported) xsl:when (supported) xsl:with-param (supported) axes ancestor ancestor-or-self attribute child descendant descendant-or-self following following-sibling namespace (not supported) parent preceding preceding-sibling self functions boolean() (supported) ceiling() (supported) concat() (supported) co...
Basic Example - XSLT: Extensible Stylesheet Language Transformations
</myns:body> </myns:article> figure 5 : xslt stylesheet <?xml version="1.0"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/xsl/transform" xmlns:myns="http://devedge.netscape.com/2002/de"> <xsl:output method="html" /> <xsl:template match="/"> <html> <head> <title> <xsl:value-of select="/myns:article/myns:title"/> </title> <style type="text/css"> .mybox {margin:10px 155px 0 50px; border: 1px dotted #639ace; padding:0 5px 0 5px;} </style> </head> <body> <p class="mybox"> <span class="title"> <xsl:value-of select="/myns...
...:article/myns:title"/> </span> <br /> authors: <br /> <xsl:apply-templates select="/myns:article/myns:authors/myns:author"/> </p> <p class="mybox"> <xsl:apply-templates select="//myns:body"/> </p> </body> </html> </xsl:template> <xsl:template match="myns:author"> -- <xsl:value-of select="." /> <xsl:if test="@company"> :: <b> <xsl:value-of select="@company" /> </b> </xsl:if> <br /> </xsl:template> <xsl:template match="myns:body"> <xsl:copy> <xsl:apply-templates select="@*|node()"/> </xsl:copy> </xsl:template> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply-templates select="@*|node()"/> </xsl:copy> </xsl:template> </xsl:styleshee...
self - Archive of obsolete content
it is most useful for data that will be modified or parsed in some way, such as json, xml, plain text, or perhaps an html template.
cfx to jpm - Archive of obsolete content
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.
Displaying annotations - Archive of obsolete content
there are two files associated with the annotation panel: a simple html file to use as a template a simple content script to build the panel's content these files will live in a new subdirectory of data which we'll call annotation.
Getting Started (jpm) - Archive of obsolete content
summary in this tutorial we've built and packaged an add-on using three commands: jpm init to initialize an empty add-on template jpm run to run a new instance of firefox with the add-on installed, so we can try it out jpm xpi to package the add-on into an xpi file for distribution these are the three main commands you'll use when developing sdk add-ons.
Getting started (cfx) - Archive of obsolete content
summary in this tutorial we've built and packaged an add-on using three commands: cfx init to initialize an empty add-on template cfx run to run a new instance of firefox with the add-on installed, so we can try it out cfx xpi to package the add-on into an xpi file for distribution these are the three main commands you'll use when developing sdk add-ons.
Embedding SVG - Archive of obsolete content
notice the template and example use xhtml to handle the namespacing.
Preferences - Archive of obsolete content
} examples github - gist :: _ff-addon-template-bootstrapprefsskeleton - this gist here is a fully working example of a fully funcitonal preferences skeleton, it uses the observer example from above.
SVG General - Archive of obsolete content
svg template here is a basic markup template to start building an svg document: <svg xmlns="http://www.w3.org/2000/svg"> <!-- svg elements go here --> </svg> note: it is recommended that you do not use dtd's with svg documents.
Handling Preferences - Archive of obsolete content
in the past we have used this directory to store xslt files for xml transformations and local storage template files (more on this later).
Setting Up a Development Environment - Archive of obsolete content
most xul tools and plugins you'll find online are merely templates that generate the folder structure for the project, and that's not much help.
The Box Model - Archive of obsolete content
for instance, templates don't allow you to set the internal text in a description element in a way that it wraps properly.
Supporting search suggestions in search plugins - Archive of obsolete content
(this means that a suggestion-supporting engine plugin will have two <url> elements, the other one being the main text/html search url.) for example, the yahoo search plugin has this <url> entry: <url type="application/x-suggestions+json" template="http://ff.search.yahoo.com/gossip?output=fxjson&command={searchterms}"/> if the user types "fir" into the search bar, then pauses, firefox inserts "fir" in place of {searchterms} and queries that url: <url type="application/x-suggestions+json" template="http://ff.search.yahoo.com/gossip?output=fxjson&command=fir"/> the results are used to construct the suggestion list box.
Search Extension Tutorial (Draft) - Archive of obsolete content
</image> <url type="application/x-suggestions+json" template="https://api.example.com/suggestions"> <param name="q" value="{searchterms}"/> </url> <url type="text/html" method="get" template="https://www.example.com/search"> <param name="q" value="{searchterms}"/> <param name="source" value="search-box"/> </url> <url type="application/x-moz-keywordsearch" method="get" template="https://www.example.com/search"> ...
Adding preferences to an extension - Archive of obsolete content
« previousnext » override chrome://myaddon/content/options.xul chrome://myaddon/content/oldoptions.xul application={ec8030f7-c20a-464f-9b0e-13a3a9e97384} appversion<=6.* examples github - gist :: _ff-addon-template-bootstrapprefsskeleton - this gist here is a fully working example of a fully funcitonal preferences skeleton, it uses the observer example from above.
CSS3 - Archive of obsolete content
css grid layout candidate recommendation add a grid layout to the css display property and several new css properties to control it: grid, grid-area, grid-auto-columns, grid-auto-flow, grid-auto-position, grid-auto-rows, grid-column, grid-column-start, grid-column-end, grid-row, grid-row-start, grid-row-end, grid-template, grid-template-areas, grid-template-rows, and grid-template-columns.
Install.js - Archive of obsolete content
there is a different sample install.js template located at http://downloads.mozdev.org/xsidebar/mods/.
JXON - Archive of obsolete content
moreover, all algorithms are equally lossless for the contemplated nodes.
MMgc - Archive of obsolete content
myobject* myobject = new (gc) myobject(); dwb/drc/drcwb there are several smart pointer templates which must be used in your c++ code to work properly with mmgc.
How Mozilla finds its configuration files - Archive of obsolete content
if you use the userd system from the lll project, you can generate this automatically with the user's personal values by using this template file prefs.js.tmpl n.b.
Protecting Mozilla's registry.dat file - Archive of obsolete content
rem ================================================== rem mozilla rem ================================================== attrib -r -s "%userprofile%\application data\mozilla" >nul 2>nul attrib -r -s "%userprofile%\application data\mozilla\registry.dat" >nul 2>nul mkdir "%userprofile%\application data" >nul 2>nul mkdir "%userprofile%\application data\mozilla" >nul 2>nul copy /b \\server\netlogon\template\"application data"\mozilla\registry.dat "%userprofile%\application data\mozilla" >nul 2>nul attrib +r +s "%userprofile%\application data\mozilla" >nul 2>nul attrib +r +s "%userprofile%\application data\mozilla\registry.dat" >nul 2>nul regedit /s \\server\netlogon\reg\quicklaunch.reg >nul 2>nul ...
Compiling The npruntime Sample Plugin in Visual Studio - Archive of obsolete content
build create a new project in visual studio for a win32 gui library (dll) (in .net 2003: win32 template, then switch to dll in application settings in the following dialog, export symbols too?)(in visual studio 2008, it is visualc++|win32|win32 project, then check dll in the wizard).
Dehydra Function Reference - Archive of obsolete content
process_decl(decl) process_decl is called for every global variable, function, or template declaration.
Drag and Drop JavaScript Wrapper - Archive of obsolete content
you can use the value of a cell, or some resource from an rdf file if the tree is built from a template, as the value of a drag.
Extension Frequently Asked Questions - Archive of obsolete content
use the extension wizard to generate a template to start with.
popChallengeResponse - Archive of obsolete content
"error:internalerror" the software encountered some internal error, such as out of memory challenge-response proof of possession expected input: popodeckeychallcontent ::= sequence of challenge -- one challenge per encryption key certification request (in the -- same order as these requests appear in fullcerttemplates).
Microsummary topics - Archive of obsolete content
for example, the following code snippet installs the microsummary generator from the creating a microsummary tutorial: var generatortext = ' \ <?xml version="1.0" encoding="utf-8"?> \ <generator xmlns="http://www.mozilla.org/microsummaries/0.1" \ name="firefox download count" \ uri="urn:{835daeb3-6760-47fa-8f4f-8e4fdea1fb16}"> \ <template> \ <transform xmlns="http://www.w3.org/1999/xsl/transform" version="1.0"> \ <output method="text"/> \ <template match="/"> \ <value-of select="id(\'download-count\')"/> \ <text> fx downloads</text> \ </template> \ </transform> \ </template> \ <pages> <include>http://(www\.)?spreadfirefox\.com/(index\.php)?</include> </pages...
New Skin Notes - Archive of obsolete content
that'd work, too; you'd mentioned that it was very rarely used --beltzner the category template must be improved, it looks very unpolished comparing to rest of devmo.
Actionscript Acceptance Tests - Archive of obsolete content
the acceptance test template can be found here.
Learn XPI Installer Scripting by Example - Archive of obsolete content
this installer script is relatively short, but it exercises most of the important features of the xpinstall api, and it can easily be used as a template for other more general software installations.
container - Archive of obsolete content
this will be set by the template builder as needed.
containment - Archive of obsolete content
when generating content from a template this is used to determine which resources from the datasource are containers and thus can have child nodes and which ones are not containers.
empty - Archive of obsolete content
this will be set by the template builder as needed.
flags - Archive of obsolete content
dont-test-empty: for template generated content, the builder will not check that a container is empty.
member - Archive of obsolete content
if not specified, the variable specified in the uri attribute in the action body of the template's first rule is used.
querytype - Archive of obsolete content
« xul reference home querytype type: string indicates the type of datasource used in a template.
ref - Archive of obsolete content
ArchiveMozillaXULAttributeref
« xul reference home ref type: uri for template-generated elements, this attribute is used to specify the root rdf node where content generation begins.
sortDirection - Archive of obsolete content
« xul reference home sortdirection type: one of the values below set this attribute to set the direction that template-generated content is sorted.
sortResource - Archive of obsolete content
« xul reference home sortresource type: uri for template-generated content, this specifies the sort key, if you would like the content to be sorted.
var - Archive of obsolete content
ArchiveMozillaXULAttributevar
« xul reference home var type: string for the xul assign attribute, this is the variable to assign the value to; otherwise it's a reference to a template variable such as "?name".
Attribute (XUL) - Archive of obsolete content
rows screenx screeny searchbutton searchsessions searchlabel selected selectedindex seltype setfocus showcaret showcommentcolumn showpopup size sizemode sizetopopup smoothscroll sort sortactive sortdirection sortresource sortresource2 spellcheck src state statedatasource statusbar statustext style subject substate suppressonselect tabindex tabscrolling targets template timeout title toolbarname tooltip tooltiptext tooltiptextnew top type uri useraction validate value var visuallyselected wait-cursor width windowtype wrap wraparound ...
List of commands - Archive of obsolete content
folder cmd_bm_setnewsearchfolder cmd_bm_setpersonaltoolbarfolder cmd_bm_sortfolder cmd_bm_sortfolderbyname cmd_close cmd_closeothertabs cmd_closewindow cmd_copy cmd_copyimage cmd_copylink cmd_cut cmd_delete cmd_editpage cmd_findtypelinks cmd_findtypetext cmd_gotoline cmd_handlebackspace cmd_handleshiftbackspace cmd_minimizewindow cmd_neweditor cmd_neweditordraft cmd_neweditortemplate cmd_newnavigator cmd_newnavigatortab cmd_newtabwithtarget cmd_openhelp cmd_paste - paste a selection from the clipboard cmd_printsetup cmd_quit cmd_redo cmd_savepage cmd_scrollpagedown cmd_scrollpageup cmd_selectall cmd_switchdocumentdirection cmd_switchtextdirection cmd_textzoomenlarge cmd_textzoomreduce cmd_textzoomreset cmd_undo cmd_viewcomponentbar cmd_viewlinktoolbar cmd...
datasources - Archive of obsolete content
in newer versions of mozilla (1.7+), the datasources will be reloaded and the template rebuilt.
tag - Archive of obsolete content
ArchiveMozillaXULPropertytag
if set, the conditions will only match if the template builder is parsing content for an element directly inside this tag.
XML Assignments - Archive of obsolete content
here is an example: <vbox datasources="people.xml" ref="*" querytype="xml"> <template> <query expr="person"> <assign var="?namelength" expr="string-length(@name)"/> <assign var="?siblings" expr="count(../*) - 1"/> </query> <action> <hbox uri="?" align="center"> <button label="?name"/> <label value="?gender"/> <label value="?namelength"/> <label value="?siblings"/> </hbox> </action> </template> </vbox> two a...
Creating a Window - Archive of obsolete content
add the xul template shown at the top of this page to the file and save it.
Introduction to RDF - Archive of obsolete content
the sample below shows a simple rdf template.
Localization - Archive of obsolete content
gspace"/> <menulist id="searchmode"> <menupopup> <menuitem label="&mode.is;"/> <menuitem label="&mode.isnot;"/> </menupopup> </menulist> <spacer class="springspace"/> <menulist id="find-text" flex="1" editable="true" datasources="file:///mozilla/recents.rdf" ref="http://www.xulplanet.com/rdf/recent/all"> <template> <menupopup> <menuitem label="rdf:http://www.xulplanet.com/rdf/recent#label" uri="rdf:*"/> </menupopup> </template> </menulist> </groupbox> </tabpanel> <tabpanel id="optionspanel" orient="vertical"> <checkbox id="casecheck" label="&casesensitive;"/> <checkbox id="wordscheck" label="&matchfilename;"/> </tabpanel> </tabpanels> </tabbox> <...
Skinning XUL Files by Hand - Archive of obsolete content
in short, xul provides the tools for anybody to create interfaces as complex and as attractive as any c++/mfc/visual ide/templates toolkit user's, and it does so in a way that makes these interfaces available on any platform.
XUL Structure - Archive of obsolete content
likewise, xul specific features such as overlays and templates are only available in xul documents.
XUL Tutorial - Archive of obsolete content
ing event handlers more event handlers keyboard shortcuts focus and selection commands updating commands broadcasters and observers document object model document object model modifying a xul interface manipulating lists box objects xpcom interfaces xpcom examples trees trees more tree features tree selection custom tree views tree view details tree box objects rdf and templates introduction to rdf templates trees and templates rdf datasources advanced rules persistent data skins and locales adding style sheets styling a tree modifying the default skin creating a skin skinning xul files by hand localization property files bindings introduction to xbl anonymous content xbl attribute inheritance adding properties adding methods adding event ha...
Accessibility/XUL Accessibility Reference - Archive of obsolete content
overlay page script spacer splitter stringbundle stringbundleset vbox window elements not processed yet: action binding bindings broadcaster broadcasterset conditions content dialog dialogheader editor listcell member observes preference preferences prefpane prefwindow resizer richlistbox richlistitem resizer rule scrollbar scrollbox scrollcorner separator template textnode titlebar toolbar toolbarbutton toolbargrippy toolbaritem toolbarpalette toolbarseparator toolbarset toolbarspacer toolbarspring toolbox tooltip treeseparator triple wizard wizardpage cases to revisit: ...
The Implementation of the Application Object Model - Archive of obsolete content
suppose that a bookmarks folder contains a mailbox folder, a composer page template, and a bookmark.
action - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ,...
arrowscrollbox - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width clicktoscroll type: boolean clicktoscroll, if true, the arrows must be clicked to scroll the scrollbox content.
bbox - Archive of obsolete content
ArchiveMozillaXULbbox
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
binding - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties object type: string the object of the element.
box - Archive of obsolete content
ArchiveMozillaXULbox
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
broadcaster - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
broadcasterset - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
column - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
columns - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
conditions - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
deck - Archive of obsolete content
ArchiveMozillaXULdeck
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties selectedindex type: integer returns the index of the currently selected item.
dropmarker - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessibletype type: integer a value indicating the type of accessibility object for the element.
elements - Archive of obsolete content
e popup popupset preference preferences prefpane prefwindow progressmeter r radio radiogroup resizer richlistbox richlistitem resizer row rows rule s script scrollbar scrollbox scrollcorner separator spacer splitter stack statusbar statusbarpanel stringbundle stringbundleset t tab tabbrowser tabbox tabpanel tabpanels tabs template textnode textbox titlebar toolbar toolbarbutton toolbargrippy toolbaritem toolbarpalette toolbarseparator toolbarset toolbarspacer toolbarspring toolbox tooltip tree treecell treechildren treecol treecols treeitem treerow treeseparator triple v vbox w window wizard wizardpage ...
grid - Archive of obsolete content
ArchiveMozillaXULgrid
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
grippy - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
groupbox - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessibletype type: integer a value indicating the type of accessibility object for the element.
hbox - Archive of obsolete content
ArchiveMozillaXULhbox
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
iframe - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessibletype type: integer a value indicating the type of accessibility object for the element.
keyset - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width disabled type: boolean indicates whether the element is disabled or not.
listcol - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
listcols - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
listhead - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessibletype type: integer a value indicating the type of accessibility object for the element.
listheader - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessibletype type: integer a value indicating the type of accessibility object for the element.
member - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties child type: ?
notificationbox - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties currentnotification type: notification element the currently displayed notification element or null.
observes - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
page - Archive of obsolete content
ArchiveMozillaXULpage
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
param - Archive of obsolete content
ArchiveMozillaXULparam
« xul reference home [ examples | attributes | properties | methods | related ] for sql templates, used to bind values to parameters specified within an sql statement.
popupset - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
preferences - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
progressmeter - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessibletype type: integer a value indicating the type of accessibility object for the element.
queryset - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
resizer - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
row - Archive of obsolete content
ArchiveMozillaXULrow
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
rows - Archive of obsolete content
ArchiveMozillaXULrows
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
script - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
scrollbox - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
scrollcorner - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
separator - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
spacer - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
spinbuttons - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
stack - Archive of obsolete content
ArchiveMozillaXULstack
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
statusbar - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessibletype type: integer a value indicating the type of accessibility object for the element.
stringbundle - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties applocale obsolete since gecko 1.9.1 type: nsilocale returns the xpcom object which holds information about the user's locale.
stringbundleset - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
tabpanel - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
tabpanels - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessible type: nsiaccessible returns the accessibility object for the element.
titlebar - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width note: the allowevents attribute did not work for title bars prior to firefox 3.
toolbargrippy - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessible type: nsiaccessible returns the accessibility object for the element.
toolbaritem - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
toolbarpalette - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
toolbarseparator - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessibletype type: integer a value indicating the type of accessibility object for the element.
toolbarset - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , ...
toolbarspacer - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessibletype type: integer a value indicating the type of accessibility object for the element.
toolbarspring - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessibletype type: integer a value indicating the type of accessibility object for the element.
toolbox - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessible type: nsiaccessible returns the accessibility object for the element.
treecell - Archive of obsolete content
ref type: uri for template-generated elements, this attribute is used to specify the root rdf node where content generation begins.
treechildren - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
treecol - Archive of obsolete content
sortdirection type: one of the values below set this attribute to set the direction that template-generated content is sorted.
treecols - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties accessibletype type: integer a value indicating the type of accessibility object for the element.
treerow - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
treeseparator - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
triple - Archive of obsolete content
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
vbox - Archive of obsolete content
ArchiveMozillaXULvbox
rcs, collapsed, container, containment, context, contextmenu, datasources, dir, empty, equalsize, flags, flex, height, hidden, id, insertafter, insertbefore, left, maxheight, maxwidth, menu, minheight, minwidth, mousethrough, observes, ordinal, orient, pack, persist, popup, position, preference-editable, querytype, ref, removeelement, sortdirection, sortresource, sortresource2, statustext, style, template, tooltip, tooltiptext, top, uri, wait-cursor, width properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, ...
XUL - Archive of obsolete content
template guide a detailed guide on xul templates, which is a means of generating content from a datasource.
Custom app bundles for Mac OS X - Archive of obsolete content
top-level directory info.plist pkginfo see also xulrunner - tips xulrunner - mac faq external links inside application bundles property list key reference xrtemplate ...
XUL Explorer - Archive of obsolete content
double-click or drag-and-drop to insert a snippet file > new allows user to pick any “template” snippet, as well as blank.
Plugins - Archive of obsolete content
writing a plugin for mac os x learn how to write a plugin for mac os x; a template xcode project is provided.
-ms-scroll-translation - Archive of obsolete content
the default css templates for windows apps using javascript, "ui-light.css" and "ui-dark.css", set this property to vertical-to-horizontal by default on the <html> element.
ECMAScript 2015 support in Mozilla - Archive of obsolete content
default parameters (firefox 15) parameters without defaults after default parameters (firefox 26) destructured parameters with default value assignment (firefox 41) arrow functions (firefox 22) generator function (firefox 26) yield (firefox 26) yield* (firefox 27) arguments[@@iterator] (firefox 46) other features binary and octal numeric literals (firefox 25) template strings (firefox 34) object initializer: shorthand property names (firefox 33) object initializer: computed property names (firefox 34) object initializer: shorthand method names (firefox 34) ...
Reference - Archive of obsolete content
--maian 20:24, 25 aug 2005 (pdt) help:custom_templates#template:deprecated_header --nickolay 00:58, 26 aug 2005 (pdt) hmm, that was a bad question.
Visual-js game engine - Game development
file location : starter/templates/paths.js templetes are made from visual-js core also .
Bootstrap - MDN Web Docs Glossary: Definitions of Web-related terms
it supports responsive design and features predefined design templates that you can use out of the box, or customize for your needs with your code.
Class - MDN Web Docs Glossary: Definitions of Web-related terms
class is a template definition of an object's properties and methods, the "blueprint" from which other more specific instances of the object are drawn.
Grid Cell - MDN Web Docs Glossary: Definitions of Web-related terms
* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #ffd8a8; padding: 1em; color: #d9480f; } .wrapper { display: grid; grid-template-columns: repeat(3,1fr); grid-auto-rows: 100px; } <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> </div> learn more property reference grid-template-columns grid-template-rows grid-auto-rows grid-auto-columns further reading css grid layout guide: basic concepts of grid layout definition of grid cells in the ...
Gutters - MDN Web Docs Glossary: Definitions of Web-related terms
* {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; border-radius: 5px; background-color: #fff8f8; padding: 1em; color: #d9480f; } .wrapper { display: grid; grid-template-columns: repeat(3,1.2fr); grid-auto-rows: 45%; grid-column-gap: 20px; grid-row-gap: 20px; } <div class="wrapper"> <div>one</div> <div>two</div> <div>three</div> <div>four</div> <div>five</div> </div> in terms of grid sizing, gaps act as if they were a regular grid track however nothing can be placed into the gap.
Script-supporting element - MDN Web Docs Glossary: Definitions of Web-related terms
there are only two script-supporting elements: <script> and <template>.
Debugging CSS - Learn web development
in the screenshot below the browser does not support the subgrid value of grid-template-columns.
CSS building blocks - Learn web development
in this assessment, we'll challenge you to create an online template to achieve such a look.
Floats - Learn web development
you can follow along by creating a new index.html file on your computer, filling it with a simple html template, and inserting the below code into it at the appropriate places.
Test your skills: Grid Layout - Learn web development
use the grid-area and grid-template-areas properties to lay the items out as shown in the image.
Legacy layout methods - Learn web development
you can follow along by creating a new index.html file on your computer, filling it with a simple html template, and inserting the below code into it at the appropriate places.
Responsive design - Learn web development
.container { display: grid; grid-template-columns: 1fr 1fr 1fr; } note: the grid layout version is even simpler as we can define the columns on the .wrapper: example, source code.
How much does it cost to do something on the Web? - Learn web development
“packaged” hosting when you want to publish a website, you could do everything by yourself: set up a database (if needed), content management system, or cms (like wordpress, dotclear, spip, etc.), upload pre-made or your own templates.
How to structure a web form - Learn web development
to start with, make a local copy of our blank template file and the css for our payment form in a new directory on your computer.
Styling web forms - Learn web development
mat('woff'); font-weight: normal; font-style: normal; } body { font : 1.3rem sans-serif; padding : 0.5em; margin : 0; background : #222; } form { position : relative; width : 740px; height : 498px; margin : 0 auto; padding: 1em; box-sizing: border-box; background : #fff url(background.jpg); /* we create our grid */ display : grid; grid-gap : 20px; grid-template-columns : repeat(2, 1fr); grid-template-rows : 10em 1em 1em 1em; } notice that we've used some css grid and flexbox to lay out the form.
Your first form - Learn web development
before you go any further, make a local copy of our simple html template — you'll enter your form html into here.
Creating hyperlinks - Learn web development
active learning: creating your own example link create an html document using your local code editor and our getting started template.
Getting started with HTML - Learn web development
note: you can also find this basic html template on the mdn learning area github repo.
What’s in the head? Metadata in HTML - Learn web development
active learning: experiment with character encoding to try this out, revisit the simple html template you obtained in the previous section on <title> (the title-example.html page), try changing the meta charset value to iso-8859-1, and add the japanese to your page.
Index - Learn web development
in this assessment we'll challenge you to create an online template to achieve such a look.
Introducing asynchronous JavaScript - Learn web development
if we're running an operation that takes time however, like querying a database and using the results to populate templates, it is better to push this off the main thread and complete the task asynchronously.
Inheritance in JavaScript - Learn web development
in this example, we've used template literals rather than string concatenation to make the code easier to read.
Object-oriented JavaScript for beginners - Learn web development
defining an object template let's consider a simple program that displays information about the students and teachers at a school.
Object prototypes - Learn web development
javascript is often described as a prototype-based language — to provide inheritance, objects can have a prototype object, which acts as a template object that it inherits methods and properties from.
Server-side website programming - Learn web development
displaying all of these using different static pages would be extremely inefficient, so instead such sites display static templates (built using html, css, and javascript), and then dynamically update the data displayed inside those templates when needed, such as when you want to view a different product on amazon.
Starting our Svelte Todo list app - Learn web development
being a compiler, svelte can statically analyze our html templates to provide accessibility warnings when components are being compiled.
Advanced Svelte: Reactivity, lifecycle, accessibility - Learn web development
in our case, our <input> would end up like so — update the component's first label/input pair (inside the edit template) like so: <label for="todo-{todo.id}" class="todo-label">new name for '{todo.name}'</label> <input bind:value={name} bind:this={nameel} use:selectonfocus type="text" id="todo-{todo.id}" autocomplete="off" class="todo-text" /> let's try it out.
Understanding client-side JavaScript frameworks - Learn web development
along the way, we'll learn about using conditional rendering in our templates.
Client-side tooling overview - Learn web development
often linters can be configured to not only report errors, but also report any violations of a specified style guide that you team might be using (for example code that is using the wrong number of spaces for indentation, or using template literals rather than regular string literals).
Mozilla's Section 508 Compliance
the following is provided for informational purposes only and is not a legally binding voluntary product accessibility template (vpat).
Debugging on Mac OS X
select the "cross-platform" tab then under the "other" template group select the "empty" project type.
Experimental features in Firefox
nightly 77 no developer edition 77 no beta 77 no release 77 no preference name layout.css.grid-template-masonry-value.enabled media feature: prefers-contrast the prefers-contrast media feature is used to detect whether the user has specified a preference for higher (or lower) contrast in the presentation of web content.
Security best practices for Firefox front-end engineers
developers are able to avoid tripping the rule by using escaping functions in combination with template strings, for example: bar.innerhtml = escapehtml`<a href='${url}'>about</a>`; in system-privileged chrome code, any kind of remaining scripts will still be removed by our sanitizer.
Following the Android Toasts Tutorial from a JNI Perspective
this is the template that will follow our object of signatures: var my_jenv = null; try { my_jenv = jni.getforthread(); // do the jni work here } finally { if (my_jenv) { jni.unloadclasses(my_jenv); } } the reason we choose my_jenv for a variable name, and not jenv, is because the global privileged window scope of firefox for android has a variable jenv already, and we don't want to mix.
PromiseWorker.jsm
finally, the template code should be added in.
Using JavaScript code modules
examples a template to download and edit is seen here on github - gists - _template-bootstrapjsm.xpi extending resource: urls prior to gecko 2.0, the most common way to load code modules was using resource: urls.
Localizing extension metadata on addons.mozilla.org
create an account and then, using the “basic open-ended question” template, follow the instructions to upload the text of your amo page.
Initial setup
use this bug template when filing your hg account registration bug.
Uplifting a localization from Central to Aurora
this looks something like searching for changes adding changesets adding manifests adding file changes added 22 changesets with 23 changes to 46 files (+1 heads) (run 'hg heads' to see heads, 'hg merge' to merge) ok, let's make sure we're not talking relbranches: hg heads --template '{node} {branches}\n' this is printing something like 5131e147fa50c28ec858c7d9fd1ba201ea2a433b 4da525ed77699794c56081791bd46cc85983f6f8 9bc7e6c58fc091c8cd0e8d9e1dbc7e6f592772a7 gecko20b12_2011022218_relbranch 230e99fada602842d9630e673077ef9f1ab34247 gecko20b12pre_20110216_relbranch 41a4357884d7bcc50e69c71014124d3af2482afe comm20b11_20110203_relbranch 2ec6ad14e7168ebeb999b1e8ae...
Setting up the infrastructure
copy the shell scripts from /addons/trunk/site/app/locale/ to your locale directory: extract-po.sh will be used to extract all english strings from your application's directories specified in source_dirs, merge the resulting template (*.pot) file with the existing (already containing translations) messages.po files for each locale (if they exist) and merge the new messages.po files to messages.mo files.
Mozilla Style System Documentation
, sc->getstyledata(estylestruct_display)); there is also a (non-virtual) method on nsiframe to get the style data from a frame's style context (saving the refcounting needed to get the style context): const nsstyledisplay *display; frame->getstyledata(estylestruct_display, (const nsstylestruct*&)display); however, there are similar typesafe global function templates that (should) compile to the same thing but use the type of the template parameter to pass the correct nsstylestructid parameter.
Profiling with Instruments
official apple documentation instruments user guide instruments user reference instruments help articles instruments help performance overview basic usage select "time profiler" from the "choose a profiling template for:" dialog.
Patches and pushes
2006/browser/search/"> <shortname>yahoo</shortname> <description>yahoo search</description> <inputencoding>utf-8</inputencoding> <image width="16" height="16">data:image/x-icon;base64,r0lgodlheaaqajecap8aaaaaap///waaach5baeaaaialaaaaaaqabaaaaipli+py+0nogquybdened2khkffwuamezmpzsfmaihphrrguum/ft+uwaaow==</image> ***this tag is optional***<url type="application/x-suggestions+json" method="get" template="http://ff.search.yahoo.com/gossip?output=fxjson&amp;command={searchterms}" />*** <url type="text/html" method="get" template="http://search.yahoo.com/search"> <param name="p" value="{searchterms}"/> <param name="ei" value="utf-8"/> <mozparam name="fr" condition="pref" pref="yahoo-fr" /> </url> <searchform>http://search.yahoo.com/</searchform> </searchplugin> create xml files for each ...
PR_PushIOLayer
if the original container was allocated using a different mechanism than used by the runtime, the default calling of the layer's destructor by the runtime will fail pr_createiolayerstub is provided to allocate layer objects and template implementations).
NSS 3.12.6 release notes
entedciphers bug 515279: cert_pkixverifycert considers a certificate revoked if cert_processocspresponse fails for any reason bug 515870: gcc compiler warnings in nss 3.12.4 bug 518255: the input buffer for sgn_update should be declared const bug 519550: allow the specification of an alternate library for sqlite bug 524167: crash in [[@ find_objects_by_template - nsstoken_findcertificatebyissuerandserialnumber] bug 526910: maxresponselength (initialized to pkix_default_max_response_length) is too small for downloading some crls.
NSS 3.12.9 release notes
bug 609068: implement j-pake in freebl bug 607058: crash [@ nss_cms_decoder_work_data] bug 613394: november/december 2010 batch of nss root ca changes bug 610843: need way to recover softoken in child after fork() bug 617492: add pk11_keygenwithtemplate function to pk11wrap (for firefox sync) bug 610162: sha-512 and sha-384 hashes are incorrect for inputs of 512mb or larger when running under windows and other 32-bit platforms (fx 3.6.12 and 4.0b6) bug 518551: vfychain crashes in pkits tests.
NSS_3.12_release_notes.html
case of error bug 426450: pkix_pl_hashtable_remove leaks hashtable key object bug 429230: memory leak in pkix_checkcert function bug 392696: fix copyright boilerplate in all new pkix code bug 300928: integrate libpkix to nss bug 303457: extensions newly supported in libpkix must be marked supported bug 331096: nss softoken must detect forks on all unix-ish platforms bug 390710: certnameconstraintstemplate is incorrect bug 416928: der decode error on this policy extension bug 375019: cache-enable pkix_ocspchecker_check bug 391454: libpkix does not honor nss's override trust flags bug 403682: cert_pkixverifycert never succeeds bug 324744: add generation of policy extensions to certutil bug 390973: add long option names to secu_parsecommandline bug 161326: need api to convert dotted oid format to/fro...
NSS API Guidelines
pointers to user-supplied buffers, and templates, should be checked against null.
FC_FindObjects
ptemplate [out] pointer to location to receive the object handles.
Installing Pork
hg clone http://hg.mozilla.org/rewriting-and-analysis/pork/ cd pork hg clone http://hg.mozilla.org/rewriting-and-analysis/elsa ./configure make building mozilla with mcpp to build mozilla with mcpp to generate annotated .ii files, use the following configure command: ac_cv_visibility_hidden=no cc="gcc34 -save-temps -wp,-w0,-k" cxx="g++ -save-temps -wp,-w0,-k" cppflags=-dns_disable_literal_template $srcdir/configure --enable-debug --disable-optimize --disable-accessibility --enable-application=browser --disable-crashreporter building will probably require disabling warnings_as_errors: make warnings_as_errors= "-wp,-w0,-k" are options that get passed to mcpp.
FOSS
flusspferd - (newer) c++ bindings libjspp - c++ template based library for extending & embedding spidermonkey; works with spidermonkey 1.8.5 and above, has lots of goodies spiderape - the oldest c++ bindings for spidermonkey trixul - (trixul cvs) - trixul xml-based gui toolkit embeds spidermonkey, using javascript to implement logic behind its gui, supporting calls from javascript to c++ objects rust mozjs - rust bindings used by servo gnome gjs - javascript bindings to gnome (broadly, to any li...
SpiderMonkey 1.8.5
bug 614138 introduces a c++ js::anchor<> template class to help tie lexical scope to the conservative gc for cases where the compiler might optimize away important stack/register roots (such as when we access the jschars in a jsstring).
SpiderMonkey 1.8.7
bug 614138 introduces a c++ js::anchor<> template class to help tie lexical scope to the conservative gc for cases where the compiler might optimize away important stack/register roots (such as when we access the jschars in a jsstring).
SpiderMonkey 31
this entailed changing the vast majority of the jsapi from raw types, such as js::value or js::value*, to js::handle and js::mutablehandle template types that encapsulate access to the provided value/string/object or its location.
SpiderMonkey 38
this entailed changing the vast majority of the jsapi from raw types, such as js::value or js::value*, to js::handle and js::mutablehandle template types that encapsulate access to the provided value/string/object or its location.
Web Replay
recording for a lock or atomic can be turned off by specifying recordreplay::behavior::dontpreserve in either the lock's contructor argument or the atomic's template arguments.
Gecko Roles
role_combobox_option a item of list that is shown by combobox role_image_map an image map -- has child links representing the areas role_option an option in a listbox role_rich_option a rich option in a listbox, it can have other widgets as children role_listbox a list of options editor's note: use template role_ to get reference on accessible role.
Creating a Python XPCOM component
generating implementation templates the module xpcom.xpt is used internally to process type information, but it has a nice feature - it can spit out a template for a python implementation of any interface.
Generic factory
rick potts wrote a templated-based generic factory (nsfactory<t>) that simplifies the factory creation process that just requires writing a createinstance() method.
XPCOM array guide
MozillaTechXPCOMGuideArrays
the point of nscomarray is that it's a template, and all the pointers in it must be pointers to the same type; it's nice to be able to use it because you get type-safety and don't have to spend time and code qiing (like you have to with nsiarray).
Avoiding leaks in JavaScript XPCOM components
consider this example from bug 285065: function _filterradiogroup(anode) { switch (anode.localname) { case "radio": return nodefilter.filter_accept; case "template": case "radiogroup": return nodefilter.filter_reject; default: return nodefilter.filter_skip; } } var iterator = this.ownerdocument.createtreewalker(this, nodefilter.show_element, _filterradiogroup, true); while (iterator.nextnode()) radiochildren.push(iterator.currentnode); return this.mradiochil...
How to build an XPCOM component in JavaScript
dule to use this array and xpcomutils: if ("generatensgetfactory" in xpcomutils) var nsgetfactory = xpcomutils.generatensgetfactory(components); // firefox 4.0 and higher else var nsgetmodule = xpcomutils.generatensgetmodule(components); // firefox 3.x so the total simplified version of your component now looks like (of course documentation and comments aren't a bad thing, but as a template something smaller is nice to have): components.utils.import("resource://gre/modules/xpcomutils.jsm"); function helloworld() { } helloworld.prototype = { classdescription: "my hello world javascript xpcom component", classid: components.id("{xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx}"), contractid: "@dietrich.ganx4.com/helloworld;1", queryinterface: xpcomutils.generateqi([comp...
An Overview of XPCOM
writing components in other languages though you do not have access to some of the tools that xpcom provides for c++ developers (such as macros, templates, smart pointers, and others) when you create components in other languages, you may be so comfortable with the language itself that you can eschew c++ altogether and build, for example, python-based xpcom components that can be used from javascript or vice versa.
Using XPCOM Utilities to Make Things Easier
nscomptr is a c++ template class that acts almost exactly like raw pointers, that can be compared and tested, and so on.
Mozilla internal string guide
if you want a number other than 64, use the templated types nsautostringn / nsautocstringn.
How to build a binary XPCOM component using Visual Studio
recap: use the right gecko sdk for your xulrunner release use a microsoft compiler use pre-built glib-1.2.dll & libidl-0.6.dll libraries from wintools.zip download the sample project here is what the folder structure looks like: create a vc++ project visual studio project and file templates (or wizards) for creating xpcom modules and components do not currently exist.
nsAutoRef
nsautoref<t> is a template class implementing an object that holds a handle to a resource that must be released, typically on destruction of the object.
nsCountedRef
nscountedref<t> is a template class implementing an object that takes a strong reference to a reference-counted resource that must be released, typically on destruction of the object.
RefPtr
for example, we have template classes such as owningnullptr that can contain a refptr to an xpcom interface.
getFile
_win_bitbucket_dir "buckt" ns_win_startmenu_dir "strt" same thing as ns_os_desktop_dir ns_win_desktop_directory "deskp" file sys dir which physically stores objects on desktop ns_win_drives_dir "drivs" ns_win_network_dir "netw" ns_win_nethood_dir "neth" ns_win_fonts_dir "fnts" ns_win_templates_dir "tmpls" ns_win_common_startmenu_dir "cmstrt" ns_win_common_programs_dir "cmprgs" ns_win_common_startup_dir "cmstrt" ns_win_common_desktop_directory "cmdeskp" ns_win_appdata_dir "appdata" ns_win_local_appdata_dir "localappdata" ns_win_printhood "prnthd" ns_wi...
nsIMessenger
if false, the message is saved as a template aidentity the identity to use if saving as a template.
nsIMsgCompFields
anization astring otherrandomheaders astring no longer exists - see https://groups.google.com/forum/#!topic/mozilla.dev.apps.thunderbird/s4ofmm8_b28 priority char * receiptheadertype print32 references char * replyto astring securityinfo nsisupports subject astring templatename astring temporaryfiles char * obsolete temporaryfiles obsolete, do not use anymore to astring usemultipartalternative prbool uuencodeattachments prbool methods utility methods prbool checkcharsetconversion ( out char * fallbackcharset ); nsimsgrecipientarray splitrecipients ( in prun...
XPCOM Interface Reference
rkermessageportnsiworkerscopensiwritablepropertybagnsiwritablepropertybag2nsixformsmodelelementnsixformsnsinstanceelementnsixformsnsmodelelementnsixmlhttprequestnsixmlhttprequesteventtargetnsixmlhttprequestuploadnsixpcexceptionnsixpcscriptablensixpconnectnsixsltexceptionnsixsltprocessornsixsltprocessorobsoletensixulappinfonsixulbrowserwindownsixulbuilderlistenernsixulruntimensixulsortservicensixultemplatebuildernsixultemplatequeryprocessornsixultemplateresultnsixulwindownsixmlrpcclientnsixmlrpcfaultnsizipentrynsizipreadernsizipreadercachensizipwriternsmsgfilterfileattribvaluensmsgfolderflagtypensmsgjunkstatusnsmsgkeynsmsglabelvaluensmsgpriorityvaluensmsgruleactiontypensmsgsearchattribnsmsgsearchopnsmsgsearchscopensmsgsearchtermnsmsgsearchtypevaluensmsgsearchvaluensmsgsearchwidgetvaluenspipromptser...
XPCOM Interface Reference by grouping
nsibadcertlistener2 system action nsicancelable application application nsiapplicationupdateservice nsiappshell nsiappshellservice nsiappstartup xul nsixulappinfo nsixulruntime nsixultemplatebuilder nsixultemplatequeryprocessor nsixultemplateresult bookmark livemark nsilivemarkservice nsinavbookmarkobserver nsinavbookmarksservice nsinavhistoryservice browser dom nsiwebbrowser ...
nsMsgMessageFlags
template 0x01000000 indicates whether or not the message is a template.
Getting Started Guide
it is a template class that acts, syntactically, just like an ordinary pointer in c or c++, i.e., you can apply * or -> to it to "get to" what it points at.
Weak reference
neither inheritance, nor templates, nor macros can help automatically forward all the method calls to the real object.
nsCOMPtr versus RefPtr
do_queryobject is templated on the argument type, so it's possible to pass in objects that multiply inherit from nsisupports.
XPCOM
rick potts wrote a templated-based generic factory (nsfactory<t>) that simplifies the factory creation process that just requires writing a createinstance() method.
xpidl
MozillaTechXPIDLxpidl
it generates: c++ header files (.h), with a commented template for full c++ implementation of the interface xpconnect typelib files (.xpt), with runtime type information to dynamically call xpcom objects through xpconnect note: starting in gecko 9.0, xpidl has been replaced with pyxpidl in the gecko sdk.
Index
this allows exposure of mailnews-specific data to user interface using rdf templates.
LDAP Support
it acts as a template, specifying the extra ldap attribute which should be used in the comment field along with how the attribute should be formatted.
Using the Multiple Accounts API
preference: mail.identity.identity.bcc_other_list - comma-seperated list of other addresses to bcc preference: mail.identity.identity.draft_folder - uri of folder to use for drafts preference: mail.identity.identity.stationary_folder - uri of folder to use for stationary (called templates in 4.x) preference: mail.identity.identity.spam_folder - uri of folder to use for spam (i think this is cut) ...
Mozilla
mozilla framework based on templates (mfbt) the mozilla framework based on templates ("mfbt") is the central repository for macros, functions, and data structures used throughout mozilla code, including in the javascript engine.
Debugger.Object - Firefox Developer Tools
errormessagename if the referent is an error created with an engine internal message template this is a string which is the name of the template; undefined otherwise.
DevTools API - Firefox Developer Tools
example here's a basic template for a toolpanel implementation.
CSSStyleSheet.addRule() - Web APIs
usage notes this method is implemented by browsers by constructing a string using the template literal `${selector}{${styleblock}}`, then passing it into the standard insertrule() method.
CustomElementRegistry.get() - Web APIs
examples customelements.define('my-paragraph', class extends htmlelement { constructor() { super(); let template = document.getelementbyid('my-paragraph'); let templatecontent = template.content; const shadowroot = this.attachshadow({mode: 'open'}) .appendchild(templatecontent.clonenode(true)); } }) // return a reference to the my-paragraph constructor let ctor = customelements.get('my-paragraph'); specifications specification status comment html living sta...
Document: DOMContentLoaded event - Web APIs
ddeventlistener('domcontentloaded', dosomething); } else { // `domcontentloaded` has already fired dosomething(); } live example html <div class="controls"> <button id="reload" type="button">reload</button> </div> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents" rows="8" cols="30"></textarea> </div> css body { display: grid; grid-template-areas: "control log"; } .controls { grid-area: control; display: flex; align-items: center; justify-content: center; } .event-log { grid-area: log; } .event-log-contents { resize: none; } label, button { display: block; } #reload { height: 2rem; } js const log = document.queryselector('.event-log-contents'); const reload = document.queryselector('#reload'); reload.adde...
Document.evaluate() - Web APIs
WebAPIDocumentevaluate
result types (merge with template:xpathresultconstants?
Document: readystatechange event - Web APIs
cancelable no interface event event handler property onreadystatechange examples live example html <div class="controls"> <button id="reload" type="button">reload</button> </div> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents" rows="8" cols="30"></textarea> </div> css body { display: grid; grid-template-areas: "control log"; } .controls { grid-area: control; display: flex; align-items: center; justify-content: center; } .event-log { grid-area: log; } .event-log-contents { resize: none; } label, button { display: block; } #reload { height: 2rem; } js const log = document.queryselector('.event-log-contents'); const reload = document.queryselector('#reload'); reload.adde...
DocumentFragment - Web APIs
this interface is also of great use with web components: <template> elements contain a documentfragment in their htmltemplateelement.content property.
Element: compositionend event - Web APIs
, click in the textbox below,<br> then type <kbd>option</kbd> + <kbd>`</kbd>, then <kbd>a</kbd>:</label> <input type="text" id="example" name="example"> </div> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents" rows="8" cols="25"></textarea> <button class="clear-log">clear</button> </div> css body { padding: .2rem; display: grid; grid-template-areas: "control log"; } .control { grid-area: control; } .event-log { grid-area: log; } .event-log-contents { resize: none; } label, button { display: block; } input[type="text"] { margin: .5rem 0; } kbd { border-radius: 3px; padding: 1px 2px 0; border: 1px solid black; } js const inputelement = document.queryselector('input[type="text"]'); const log = document.querysel...
Element: compositionstart event - Web APIs
, click in the textbox below,<br> then type <kbd>option</kbd> + <kbd>`</kbd>, then <kbd>a</kbd>:</label> <input type="text" id="example" name="example"> </div> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents" rows="8" cols="25"></textarea> <button class="clear-log">clear</button> </div> css body { padding: .2rem; display: grid; grid-template-areas: "control log"; } .control { grid-area: control; } .event-log { grid-area: log; } .event-log-contents { resize: none; } label, button { display: block; } input[type="text"] { margin: .5rem 0; } kbd { border-radius: 3px; padding: 1px 2px 0; border: 1px solid black; } js const inputelement = document.queryselector('input[type="text"]'); const log = document.querysel...
Element: compositionupdate event - Web APIs
, click in the textbox below,<br> then type <kbd>option</kbd> + <kbd>`</kbd>, then <kbd>a</kbd>:</label> <input type="text" id="example" name="example"> </div> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents" rows="8" cols="25"></textarea> <button class="clear-log">clear</button> </div> css body { padding: .2rem; display: grid; grid-template-areas: "control log"; } .control { grid-area: control; } .event-log { grid-area: log; } .event-log-contents { resize: none; } label, button { display: block; } input[type="text"] { margin: .5rem 0; } kbd { border-radius: 3px; padding: 1px 2px 0; border: 1px solid black; } js const inputelement = document.queryselector('input[type="text"]'); const log = document.querysel...
Element: error event - Web APIs
examples live example html <div class="controls"> <button id="img-error" type="button">generate image error</button> <img class="bad-img" /> </div> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents" rows="8" cols="30"></textarea> </div> css body { display: grid; grid-template-areas: "control log"; } .controls { grid-area: control; display: flex; align-items: center; justify-content: center; } .event-log { grid-area: log; } .event-log-contents { resize: none; } label, button { display: block; } button { height: 2rem; margin: .5rem; } img { width: 0; height: 0; } js const log = document.queryselector('.event-log-contents'); const badimg...
Element.innerHTML - Web APIs
WebAPIElementinnerHTML
if the element whose contents are being replaced is a <template> element, then the <template> element's content attribute is replaced with the new documentfragment created in step 1.
FileReader: abort event - Web APIs
class="preview" height="200" alt="image preview..."> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents"></textarea> </div> </div> css img.preview { margin: 1rem 0; } .event-log-contents { width: 18rem; height: 5rem; border: 1px solid black; margin: .2rem; padding: .2rem; } .example { display: grid; grid-template-areas: "select log" "preview log"; } .file-select { grid-area: select; } .preview { grid-area: preview; } .event-log { grid-area: log; } .event-log>label { display: block; } .event-log-contents { resize: none; } js const fileinput = document.queryselector('input[type="file"]'); const preview = document.queryselector('img.preview'); const eventlog = d...
FileReader: load event - Web APIs
class="preview" height="200" alt="image preview..."> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents"></textarea> </div> </div> css img.preview { margin: 1rem 0; } .event-log-contents { width: 18rem; height: 5rem; border: 1px solid black; margin: .2rem; padding: .2rem; } .example { display: grid; grid-template-areas: "select log" "preview log"; } .file-select { grid-area: select; } .preview { grid-area: preview; } .event-log { grid-area: log; } .event-log>label { display: block; } .event-log-contents { resize: none; } js const fileinput = document.queryselector('input[type="file"]'); const preview = document.queryselector('img.preview'); const eventlog = d...
FileReader: loadend event - Web APIs
class="preview" height="200" alt="image preview..."> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents"></textarea> </div> </div> css img.preview { margin: 1rem 0; } .event-log-contents { width: 18rem; height: 5rem; border: 1px solid black; margin: .2rem; padding: .2rem; } .example { display: grid; grid-template-areas: "select log" "preview log"; } .file-select { grid-area: select; } .preview { grid-area: preview; } .event-log { grid-area: log; } .event-log>label { display: block; } .event-log-contents { resize: none; } js const fileinput = document.queryselector('input[type="file"]'); const preview = document.queryselector('img.preview'); const eventlog = d...
FileReader: loadstart event - Web APIs
class="preview" height="200" alt="image preview..."> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents"></textarea> </div> </div> css img.preview { margin: 1rem 0; } .event-log-contents { width: 18rem; height: 5rem; border: 1px solid black; margin: .2rem; padding: .2rem; } .example { display: grid; grid-template-areas: "select log" "preview log"; } .file-select { grid-area: select; } .preview { grid-area: preview; } .event-log { grid-area: log; } .event-log>label { display: block; } .event-log-contents { resize: none; } js const fileinput = document.queryselector('input[type="file"]'); const preview = document.queryselector('img.preview'); const eventlog = d...
FileReader: progress event - Web APIs
class="preview" height="200" alt="image preview..."> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents"></textarea> </div> </div> css img.preview { margin: 1rem 0; } .event-log-contents { width: 18rem; height: 5rem; border: 1px solid black; margin: .2rem; padding: .2rem; } .example { display: grid; grid-template-areas: "select log" "preview log"; } .file-select { grid-area: select; } .preview { grid-area: preview; } .event-log { grid-area: log; } .event-log>label { display: block; } .event-log-contents { resize: none; } js const fileinput = document.queryselector('input[type="file"]'); const preview = document.queryselector('img.preview'); const eventlog = d...
HTMLElement: change event - Web APIs
examples <select> element html <label>choose an ice cream flavor: <select class="ice-cream" name="ice-cream"> <option value="">select one …</option> <option value="chocolate">chocolate</option> <option value="sardine">sardine</option> <option value="vanilla">vanilla</option> </select> </label> <div class="result"></div> body { display: grid; grid-template-areas: "select result"; } select { grid-area: select; } .result { grid-area: result; } javascript const selectelement = document.queryselector('.ice-cream'); selectelement.addeventlistener('change', (event) => { const result = document.queryselector('.result'); result.textcontent = `you like ${event.target.value}`; }); result text input element for some elements, including <...
HTMLElement.hidden - Web APIs
appropriate use cases for hidden include: content that isn't yet relevant but may be needed later content that was previously needed but is not any longer content that is reused by other parts of the page in a template-like fashion creating an offscreen canvas as a drawing buffer inappropriate use cases include: hiding panels in a tabbed dialog box hiding content in one presentation while intending it to be visible in others elements that are not hidden must not link to elements which are.
HTMLMediaElement: loadstart event - Web APIs
"> <button type="button">load video</button> <video controls width="250"></video> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents"></textarea> </div> </div> css .event-log-contents { width: 18rem; height: 5rem; border: 1px solid black; margin: .2rem; padding: .2rem; } .example { display: grid; grid-template-areas: "button log" "video log"; } button { grid-area: button; width: 10rem; margin: .5rem 0; } video { grid-area: video; } .event-log { grid-area: log; } .event-log>label { display: block; } js const loadvideo = document.queryselector('button'); const video = document.queryselector('video'); const eventlog = document.queryselector('.event-log-cont...
HTMLMediaElement: progress event - Web APIs
"> <button type="button">load video</button> <video controls width="250"></video> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents"></textarea> </div> </div> css .event-log-contents { width: 18rem; height: 5rem; border: 1px solid black; margin: .2rem; padding: .2rem; } .example { display: grid; grid-template-areas: "button log" "video log"; } button { grid-area: button; width: 10rem; margin: .5rem 0; } video { grid-area: video; } .event-log { grid-area: log; } .event-log>label { display: block; } javascript const loadvideo = document.queryselector('button'); const video = document.queryselector('video'); const eventlog = document.queryselector('.event-...
HTMLSlotElement.assignedNodes() - Web APIs
let slots = this.shadowroot.queryselectorall('slot'); slots[1].addeventlistener('slotchange', function(e) { let nodes = slots[1].assignednodes(); console.log('element in slot "' + slots[1].name + '" changed to "' + nodes[0].outerhtml + '".'); }); here we grab references to all the slots, then add a slotchange event listener to the 2nd slot in the template — which is the one that keeps having its contents changed in the example.
HTMLSlotElement.name - Web APIs
let slots = this.shadowroot.queryselectorall('slot'); slots[1].addeventlistener('slotchange', function(e) { let nodes = slots[1].assignednodes(); console.log('element in slot "' + slots[1].name + '" changed to "' + nodes[0].outerhtml + '".'); }); here we grab references to all the slots, then add a slotchange event listener to the 2nd slot in the template — which is the one that keeps having its contents changed in the example.
HTMLSlotElement: slotchange event - Web APIs
let slots = this.shadowroot.queryselectorall('slot'); slots[1].addeventlistener('slotchange', function(e) { let nodes = slots[1].assignednodes(); console.log('element in slot "' + slots[1].name + '" changed to "' + nodes[0].outerhtml + '".'); }); here we grab references to all the <slot>s, then add a slotchange event listener to the template's second slot — which is the one which has its contents changed in the example.
HTMLSlotElement - Web APIs
let slots = this.shadowroot.queryselectorall('slot'); slots[1].addeventlistener('slotchange', function(e) { let nodes = slots[1].assignednodes(); console.log('element in slot "' + slots[1].name + '" changed to "' + nodes[0].outerhtml + '".'); }); here we grab references to all the slots, then add a slotchange event listener to the 2nd slot in the template — which is the one that keeps having its contents changed in the example.
The HTML DOM API - Web APIs
htmloptionelement htmloutputelement htmlparagraphelement htmlparamelement htmlpictureelement htmlpreelement htmlprogresselement htmlquoteelement htmlscriptelement htmlselectelement htmlslotelement htmlsourceelement htmlspanelement htmlstyleelement htmltablecaptionelement htmltablecellelement htmltablecolelement htmltableelement htmltablerowelement htmltablesectionelement htmltemplateelement htmltextareaelement htmltimeelement htmltitleelement htmltrackelement htmlulistelement htmlunknownelement htmlvideoelement deprecated html element interfaces htmlmarqueeelement obsolete html element interfaces htmlbasefontelement htmlfontelement htmlframeelement htmlframesetelement htmlisindexelement htmlmenuitemelement web app and browser integra...
Timing element visibility with the Intersection Observer API - Web APIs
body { font-family: "open sans", "arial", "helvetica", sans-serif; background-color: aliceblue; } .wrapper { display: grid; grid-template-columns: auto minmax(min-content, 1fr); grid-template-rows: auto minmax(min-content, 1fr); max-width: 700px; margin: 0 auto; background-color: aliceblue; } the site's <body> is configured here to use one of a number of common sans-serif fonts, and to use "aliceblue" as the background color.
Slottable: assignedSlot - Web APIs
examples in our simple-template example (see it live), we create a trivial custom element example called <my-paragraph> in which a shadow root is attached and then populated using the contents of a template that contains a slot named my-text.
A basic 2D WebGL animation example - Web APIs
note the use of a template literal string to insert the correct shader type string into the message that gets generated.
Window.customElements - Web APIs
the customelementregistry.define() method to define and register a new custom element, e.g.: let customelementregistry = window.customelements; customelementregistry.define('my-custom-element', mycustomelement); however, it is usually shortened to something like the following: customelements.define('element-details', class extends htmlelement { constructor() { super(); const template = document .getelementbyid('element-details-template') .content; const shadowroot = this.attachshadow({mode: 'open'}) .appendchild(template.clonenode(true)); } } ); see our web-components-examples repo for more usage examples.
Window: error event - Web APIs
examples live example html <div class="controls"> <button id="script-error" type="button">generate script error</button> <img class="bad-img" /> </div> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents" rows="8" cols="30"></textarea> </div> css body { display: grid; grid-template-areas: "control log"; } .controls { grid-area: control; display: flex; align-items: center; justify-content: center; } .event-log { grid-area: log; } .event-log-contents { resize: none; } label, button { display: block; } button { height: 2rem; margin: .5rem; } img { width: 0; height: 0; } js const log = document.queryselector('.event-log-contents'); window.addev...
Window: load event - Web APIs
WebAPIWindowload event
, but using the onload event handler property: window.onload = (event) => { console.log('page is fully loaded'); }; live example html <div class="controls"> <button id="reload" type="button">reload</button> </div> <div class="event-log"> <label>event log:</label> <textarea readonly class="event-log-contents" rows="8" cols="30"></textarea> </div> css body { display: grid; grid-template-areas: "control log"; } .controls { grid-area: control; display: flex; align-items: center; justify-content: center; } .event-log { grid-area: log; } .event-log-contents { resize: none; } label, button { display: block; } #reload { height: 2rem; } js const log = document.queryselector('.event-log-contents'); const reload = document.queryselector('#reload'); reload.addev...
Web APIs
WebAPI
lorforeignelement htmloutputelement htmlparagraphelement htmlparamelement htmlpictureelement htmlpreelement htmlprogresselement htmlquoteelement htmlscriptelement htmlselectelement htmlshadowelement htmlslotelement htmlsourceelement htmlspanelement htmlstyleelement htmltablecaptionelement htmltablecellelement htmltablecolelement htmltableelement htmltablerowelement htmltablesectionelement htmltemplateelement htmltextareaelement htmltimeelement htmltitleelement htmltrackelement htmlulistelement htmlunknownelement htmlvideoelement hashchangeevent headers history hkdfparams hmacimportparams hmackeygenparams i idbcursor idbcursorsync idbcursorwithvalue idbdatabase idbdatabaseexception idbdatabasesync idbenvironment idbenvironmentsync idbfactory idbfactorysync idbindex idbind...
Accessibility documentation index - Accessibility
14 aria technique template accessibility no summary!
CSS Display - CSS: Cascading Style Sheets
ning items in a flex container controlling ratios of flex items along the main axis cross-browser flexbox mixins mastering wrapping of flex items ordering flex items relationship of flexbox to other layout methods backwards compatibility of flexbox typical use cases of flexbox display: grid basic concepts of grid layout relationship to other layout methods line-based placement grid template areas layout using named grid lines auto-placement in grid layout box alignment in grid layout grids, logical values and writing modes css grid layout and accessibility css grid layout and progressive enhancement realizing common layouts using grids specifications specification status comment css display module level 3the definition of 'display' in that speci...
Using CSS transforms - CSS: Cascading Style Sheets
transform: rotatey(-90deg) translatez(50px); } .top { background: rgba(196, 196, 0, 0.7); transform: rotatex(90deg) translatez(50px); } .bottom { background: rgba(196, 0, 196, 0.7); transform: rotatex(-90deg) translatez(50px); } /* make the layout a little nicer */ section { background-color: #eee; padding: 10px; font-family: sans-serif; text-align: left; display: grid; grid-template-columns: repeat(3, 1fr); } result once you have done this, you can work on the element in the 3d space.
Animatable CSS properties - CSS: Cascading Style Sheets
ip-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-template-columns grid-template-rows height inline-size inset inset-block inset-block-end inset-block-start inset-inline inset-inline-end inset-inline-start left letter-spacing line-clamp line-height margin margin-block-end margin-block-start margin-bottom margin-inline-end margin-inline-start margin-le...
Card - CSS: Cascading Style Sheets
when setting up the single column grid i use the following: .card { display: grid; grid-template-rows: max-content 200px 1fr; } the heading track is set to max-content, which prevents it from stretching.
Grid wrapper - CSS: Cascading Style Sheets
recipe download this example choices made this recipe uses the css grid minmax() function to define the grid track sizes in the grid-template-columns property.
CSS Layout cookbook - CSS: Cascading Style Sheets
see this page for a template and guidelines for writing your own example.
CSS reference - CSS: Cascading Style Sheets
WebCSSReference
t-variant-east-asianfont-variant-ligaturesfont-variant-numericfont-variant-positionfont-variation-settingsfont-variation-settings (@font-face)font-weightfont-weight (@font-face)format()fr<frequency><frequency-percentage>:fullscreenggapgrad<gradient>grayscale()gridgrid-areagrid-auto-columnsgrid-auto-flowgrid-auto-rowsgrid-columngrid-column-endgrid-column-startgrid-rowgrid-row-endgrid-row-startgrid-templategrid-template-areasgrid-template-columnsgrid-template-rowshhzhanging-punctuationheightheight (@viewport)@historical-forms:hoverhsl()hsla()hue-rotate()hyphensi<ident><image>image()image-orientationimage-renderingimage-set()@importin:in-range:indeterminateinheritinitialinline-sizeinsetinset()inset-blockinset-block-endinset-block-startinset-inlineinset-inline-endinset-inline-start<integer>:invalidinv...
Shorthand properties - CSS: Cascading Style Sheets
shorthand properties: animation, background, border, border-bottom, border-color, border-left, border-radius, border-right, border-style, border-top, border-width, column-rule, columns, flex, flex-flow, font, grid, grid-area, grid-column, grid-row, grid-template, list-style, margin, offset, outline, overflow, padding, place-content, place-items, place-self, text-decoration, transition ...
WebKit CSS extensions - CSS: Cascading Style Sheets
ture-settings -webkit-font-kerning -webkit-font-variant-ligatures g-j -webkit-grid -webkit-grid-area -webkit-grid-auto-columns -webkit-grid-auto-flow -webkit-grid-auto-rows -webkit-grid-column -webkit-grid-column-end -webkit-grid-column-gap -webkit-grid-column-start -webkit-grid-gap -webkit-grid-row -webkit-grid-row-end -webkit-grid-row-gap -webkit-grid-row-start -webkit-grid-template -webkit-grid-template-areas -webkit-grid-template-columns -webkit-grid-template-rows h-l -webkit-hyphens -webkit-justify-content -webkit-justify-items -webkit-justify-self -webkit-line-break m -webkit-mask -webkit-mask-clip -webkit-mask-composite -webkit-mask-image -webkit-mask-origin -webkit-mask-position -webkit-mask-repeat -webkit-mask-size o-r -webkit-opacity -we...
align-content - CSS: Cascading Style Sheets
ution> = space-between | space-around | space-evenly | stretch<overflow-position> = unsafe | safe<content-position> = center | start | end | flex-start | flex-end examples css #container { height:200px; width: 240px; align-content: center; /* can be changed in the live sample */ background-color: #8c8c8c; } .flex { display: flex; flex-wrap: wrap; } .grid { display: grid; grid-template-columns: repeat(auto-fill, 50px); } div > div { box-sizing: border-box; border: 2px solid #8c8c8c; width: 50px; display: flex; align-items: center; justify-content: center; } #item1 { background-color: #8cffa0; min-height: 30px; } #item2 { background-color: #a0c8ff; min-height: 50px; } #item3 { background-color: #ffa08c; min-height: 40px; } #item4 { background-color...
align-items - CSS: Cascading Style Sheets
baseline<overflow-position> = unsafe | safe<self-position> = center | start | end | self-start | self-end | flex-start | flex-end examples css #container { height:200px; width: 240px; align-items: center; /* can be changed in the live sample */ background-color: #8c8c8c; } .flex { display: flex; flex-wrap: wrap; } .grid { display: grid; grid-template-columns: repeat(auto-fill, 50px); } div > div { box-sizing: border-box; border: 2px solid #8c8c8c; width: 50px; display: flex; align-items: center; justify-content: center; } #item1 { background-color: #8cffa0; min-height: 30px; } #item2 { background-color: #a0c8ff; min-height: 50px; } #item3 { background-color: #ffa08c; min-height: 40px; } #item4 { background-color...
column-gap (grid-column-gap) - CSS: Cascading Style Sheets
<div></div> <div></div> <div></div> </div> css #flexbox { display: flex; height: 100px; column-gap: 20px; } #flexbox > div { border: 1px solid green; background-color: lime; flex: auto; } result grid layout html <div id="grid"> <div></div> <div></div> <div></div> </div> css #grid { grid-column-gap: 20px; } #grid { display: grid; height: 100px; grid-template-columns: repeat(3, 1fr); grid-template-rows: 100px; column-gap: 20px; } #grid > div { border: 1px solid green; background-color: lime; } result multi-column layout html <p class="content-box"> this is some multi-column text with a 40px column gap created with the css `column-gap` property.
display - CSS: Cascading Style Sheets
WebCSSdisplay
ning items in a flex container controlling ratios of flex items along the main axis cross-browser flexbox mixins mastering wrapping of flex items ordering flex items relationship of flexbox to other layout methods backwards compatibility of flexbox typical use cases of flexbox display: grid basic concepts of grid layout relationship to other layout methods line-based placement grid template areas layout using named grid lines auto-placement in grid layout box alignment in grid layout grids, logical values and writing modes css grid layout and accessibility css grid layout and progressive enhancement realizing common layouts using grids accessibility concerns display: none using a display value of none on an element will remove it from the accessibility tree.
fit-content() - CSS: Cascading Style Sheets
</div> <div>flexible item</div> </div> css #container { display: grid; grid-template-columns: fit-content(300px) fit-content(300px) 1fr; grid-gap: 5px; box-sizing: border-box; height: 200px; width: 100%; background-color: #8cffa0; padding: 10px; } #container > div { background-color: #8ca0ff; padding: 5px; } result specifications specification status comment css box sizing module level 3the definition of 'fit-content()' in that s...
<flex> - CSS: Cascading Style Sheets
it is used in grid-template-columns, grid-template-rows and other related properties.
gap (grid-gap) - CSS: Cascading Style Sheets
WebCSSgap
x; } #flexbox > div { border: 1px solid green; background-color: lime; flex: 1 1 auto; width: 100px; height: 50px; } result grid layout html <div id="grid"> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> </div> css #grid { grid-gap: 20px 5px; } #grid { display: grid; height: 200px; grid-template: repeat(3, 1fr) / repeat(3, 1fr); gap: 20px 5px; } #grid > div { border: 1px solid green; background-color: lime; } result multi-column layout html <p class="content-box"> this is some multi-column text with a 40px column gap created with the css <code>gap</code> property.
grid-auto-flow - CSS: Cascading Style Sheets
m3"></div> <div id="item4"></div> <div id="item5"></div> </div> <select id="direction" onchange="changegridautoflow()"> <option value="column">column</option> <option value="row">row</option> </select> <input id="dense" type="checkbox" onchange="changegridautoflow()"> <label for="dense">dense</label> css #grid { height: 200px; width: 200px; display: grid; grid-gap: 10px; grid-template: repeat(4, 1fr) / repeat(2, 1fr); grid-auto-flow: column; /* or 'row', 'row dense', 'column dense' */ } #item1 { background-color: lime; grid-row-start: 3; } #item2 { background-color: yellow; } #item3 { background-color: blue; } #item4 { grid-column-start: 2; background-color: red; } #item5 { background-color: aqua; } function changegridautoflow() { var grid = document.g...
grid-column-end - CSS: Cascading Style Sheets
] | [ span && [ <integer> | <custom-ident> ] ] examples setting column end for a grid item html <div class="wrapper"> <div class="box1">one</div> <div class="box2">two</div> <div class="box3">three</div> <div class="box4">four</div> <div class="box5">five</div> </div> css .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 100px; } .box1 { grid-column-start: 1; grid-column-end: 4; grid-row-start: 1; grid-row-end: 3; } .box2 { grid-column-start: 1; grid-row-start: 3; grid-row-end: 5; } * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; b...
grid-column-start - CSS: Cascading Style Sheets
] | [ span && [ <integer> | <custom-ident> ] ] examples setting column start for a grid item html <div class="wrapper"> <div class="box1">one</div> <div class="box2">two</div> <div class="box3">three</div> <div class="box4">four</div> <div class="box5">five</div> </div> css .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 100px; } .box1 { grid-column-start: 1; grid-column-end: 4; grid-row-start: 1; grid-row-end: 3; } .box2 { grid-column-start: 1; grid-row-start: 3; grid-row-end: 5; } * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; b...
grid-column - CSS: Cascading Style Sheets
] | [ span && [ <integer> | <custom-ident> ] ] examples setting grid column size and location html <div id="grid"> <div id="item1"></div> <div id="item2"></div> <div id="item3"></div> </div> css #grid { display: grid; height: 100px; grid-template-columns: repeat(6, 1fr); grid-template-rows: 100px; } #item1 { background-color: lime; } #item2 { background-color: yellow; grid-column: 2 / 4; } #item3 { background-color: blue; grid-column: span 2 / 7; } result specifications specification status comment css grid layoutthe definition of 'grid-column' in that specification.
grid-row-end - CSS: Cascading Style Sheets
] | [ span && [ <integer> | <custom-ident> ] ] examples setting row end for a grid item html <div class="wrapper"> <div class="box1">one</div> <div class="box2">two</div> <div class="box3">three</div> <div class="box4">four</div> <div class="box5">five</div> </div> css .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 100px; } .box1 { grid-column-start: 1; grid-column-end: 4; grid-row-start: 1; grid-row-end: 3; } .box2 { grid-column-start: 1; grid-row-start: 3; grid-row-end: 5; } * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; b...
grid-row-start - CSS: Cascading Style Sheets
] | [ span && [ <integer> | <custom-ident> ] ] examples setting row start for a grid item html <div class="wrapper"> <div class="box1">one</div> <div class="box2">two</div> <div class="box3">three</div> <div class="box4">four</div> <div class="box5">five</div> </div> css .wrapper { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 100px; } .box1 { grid-column-start: 1; grid-column-end: 4; grid-row-start: 1; grid-row-end: 3; } .box2 { grid-column-start: 1; grid-row-start: 3; grid-row-end: 5; } * {box-sizing: border-box;} .wrapper { border: 2px solid #f76707; border-radius: 5px; background-color: #fff4e6; } .wrapper > div { border: 2px solid #ffa94d; b...
grid-row - CSS: Cascading Style Sheets
WebCSSgrid-row
] | [ span && [ <integer> | <custom-ident> ] ] examples setting grid row size and location html <div id="grid"> <div id="item1"></div> <div id="item2"></div> <div id="item3"></div> </div> css #grid { display: grid; height: 200px; grid-template-columns: 200px; grid-template-rows: repeat(6, 1fr); } #item1 { background-color: lime; } #item2 { background-color: yellow; grid-row: 2 / 4; } #item3 { background-color: blue; grid-row: span 2 / 7; } result specifications specification status comment css grid layoutthe definition of 'grid-row' in that specification.
justify-items - CSS: Cascading Style Sheets
html <article class="container" tabindex="0"> <span>first child</span> <span>second child</span> <span>third child</span> <span>fourth child</span> </article> css html { font-family: helvetica, arial, sans-serif; letter-spacing: 1px; } article { background-color: red; display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 40px; grid-gap: 10px; width: 300px; justify-items: stretch; } article:hover, article:focus { justify-items: center; } article span { background-color: black; color: white; margin: 1px; text-align: center; } article, span { padding: 10px; border-radius: 7px; } article { margin: 20px; } result specifications specification ...
justify-self - CSS: Cascading Style Sheets
html <article class="container"> <span>first child</span> <span>second child</span> <span>third child</span> <span>fourth child</span> </article> css html { font-family: helvetica, arial, sans-serif; letter-spacing: 1px; } article { background-color: red; display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 40px; grid-gap: 10px; width: 300px; justify-items: stretch; } span:nth-child(2) { justify-self: start; } span:nth-child(3) { justify-self: center; } span:nth-child(4) { justify-self: end; } article span { background-color: black; color: white; margin: 1px; text-align: center; } article, span { padding: 10px; border-radius: 7px; } artic...
minmax() - CSS: Cascading Style Sheets
WebCSSminmax
formal syntax minmax( [ <length> | <percentage> | min-content | max-content | auto ] , [ <length> | <percentage> | <flex> | min-content | max-content | auto ] ) css properties minmax() function can be used within: grid-template-columns grid-template-rows grid-auto-columns grid-auto-rows examples css #container { display: grid; grid-template-columns: minmax(min-content, 300px) minmax(200px, 1fr) 150px; grid-gap: 5px; box-sizing: border-box; height: 200px; width: 100%; background-color: #8cffa0; padding: 10px; } #container > div { background-color: #8ca0ff; padding: 5px; } html <div id="cont...
perspective-origin - CSS: Cascading Style Sheets
transform: rotatey(-90deg) translatez(50px); } .top { background: rgba(196, 196, 0, 0.7); transform: rotatex(90deg) translatez(50px); } .bottom { background: rgba(196, 0, 196, 0.7); transform: rotatex(-90deg) translatez(50px); } /* make the layout a little nicer */ section { background-color: #eee; padding: 10px; font-family: sans-serif; text-align: left; display: grid; grid-template-columns: repeat(3, 1fr); } result specifications specification status comment css transforms level 2the definition of 'perspective-origin' in that specification.
place-items - CSS: Cascading Style Sheets
.style.placeitems = evt.target.value; }); display.addeventlistener('change', function (evt) { container.classname = evt.target.value; }); css #container { height:200px; width: 240px; place-items: center; /* you can change this value by selecting another option in the list */ background-color: #8c8c8c; } .flex { display: flex; flex-wrap: wrap; } .grid { display: grid; grid-template-columns: repeat(auto-fill, 50px); } result specifications specification status comment css box alignment module level 3the definition of 'place-items' in that specification.
place-self - CSS: Cascading Style Sheets
html <article class="container"> <span>first</span> <span>second</span> <span>third</span> <span>fourth</span> </article> css html { font-family: helvetica, arial, sans-serif; letter-spacing: 1px; } article { background-color: red; display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 80px; grid-gap: 10px; width: 300px; } span:nth-child(2) { place-self: start center; } span:nth-child(3) { place-self: center start; } span:nth-child(4) { place-self: end; } article span { background-color: black; color: white; margin: 1px; text-align: center; } article, span { padding: 10px; border-radius: 7px; } article { margin: ...
row-gap (grid-row-gap) - CSS: Cascading Style Sheets
WebCSSrow-gap
css #flexbox { display: flex; flex-wrap: wrap; width: 300px; row-gap: 20px; } #flexbox > div { border: 1px solid green; background-color: lime; flex: 1 1 auto; width: 100px; height: 50px; } result grid layout html <div id="grid"> <div></div> <div></div> <div></div> </div> css #grid { grid-row-gap: 20px; } #grid { display: grid; height: 200px; grid-template-columns: 200px; grid-template-rows: repeat(3, 1fr); row-gap: 20px; } #grid > div { border: 1px solid green; background-color: lime; } result specifications specification status comment css box alignment module level 3the definition of 'row-gap' in that specification.
exsl:object-type() - EXSLT
this function lets authors of named templates and extension functions easily provide flexibility in parameter values.
set:difference() - EXSLT
WebEXSLTsetdifference
the template version of set:difference applies templates to these nodes in set:difference mode, copying the nodes so that a result tree fragment consisting of the nodes is returned.
<content>: The Shadow DOM Content Placeholder element (obsolete) - HTML: Hypertext Markup Language
WebHTMLElementcontent
see also web components <shadow>, <slot>, <template>, <element> ...
<div>: The Content Division element - HTML: Hypertext Markup Language
WebHTMLElementdiv
or (in whatwg html): if the parent is a <dl> element: one or more <dt> elements followed by one or more <dd> elements, optionally intermixed with <script> and <template> elements.
<element>: The Custom Element element (Obsolete) - HTML: Hypertext Markup Language
WebHTMLElementelement
see also web components: <content>, <shadow>, <slot>, and <template> ...
<ol>: The Ordered List element - HTML: Hypertext Markup Language
WebHTMLElementol
permitted content zero or more <li>, <script> and <template> elements.
<tr>: The Table Row element - HTML: Hypertext Markup Language
WebHTMLElementtr
technical summary content categories none permitted content zero or more <td> and/or <th> elements; script-supporting elements (<script> and <template>) are also allowed tag omission start tag is mandatory.
<ul>: The Unordered List element - HTML: Hypertext Markup Language
WebHTMLElementul
permitted content zero or more <li>, <script> and <template> elements.
HTML elements reference - HTML: Hypertext Markup Language
WebHTMLElement
<template> the html content template (<template>) element is a mechanism for holding html that is not to be rendered immediately when a page is loaded but may be instantiated subsequently during runtime using javascript.
slot - HTML: Hypertext Markup Language
for examples, see our using templates and slots guide.
HTML documentation index - HTML: Hypertext Markup Language
WebHTMLIndex
205 <template>: the content template element element, html, html web components, html:flow content, html:metadata content, html:phrasing content, html:script-supporting element, reference, template, web, web components the html content template (<template>) element is a mechanism for holding html that is not to be rendered immediately when a page is loaded but may be instantiated subsequently during ...
Inline elements - HTML: Hypertext Markup Language
cronym> <audio> (if it has visible controls) <b> <bdi> <bdo> <big> <br> <button> <canvas> <cite> <code> <data> <datalist> <del> <dfn> <em> <embed> <i> <iframe> <img> <input> <ins> <kbd> <label> <map> <mark> <meter> <noscript> <object> <output> <picture> <progress> <q> <ruby> <s> <samp> <script> <select> <slot> <small> <span> <strong> <sub> <sup> <svg> <template> <textarea> <time> <u> <tt> <var> <video> <wbr> see also block-level elements html element reference display content categories block and inline layout in normal flow ...
Details of the object model - JavaScript
a prototype-based language has the notion of a prototypical object, an object used as a template from which to get the initial properties for a new object.
JavaScript Guide - JavaScript
defining functions calling functions function scope closures arguments & parameters arrow functions expressions and operators assignment & comparisons arithmetic operators bitwise & logical operators conditional (ternary) operator numbers and dates number literals number object math object date object text formatting string literals string object template literals internationalization regular expressions indexed collections arrays typed arrays keyed collections map weakmap set weakset working with objects objects and properties creating objects defining methods getter and setter details of the object model prototype-based oop creating object hierarchies inheritance promises guarante...
Intl.DateTimeFormat.prototype.formatToParts() - JavaScript
for example by using array.prototype.map(), arrow functions, a switch statement, template literals, and array.prototype.reduce().
Intl.NumberFormat.prototype.formatToParts() - JavaScript
for example by using array.prototype.map(), arrow functions, a switch statement, template literals, and array.prototype.reduce().
Object.prototype.toString() - JavaScript
dog.prototype.tostring = function dogtostring() { const ret = 'dog ' + this.name + ' is a ' + this.sex + ' ' + this.color + ' ' + this.breed; return ret; } or, using es6 template strings: dog.prototype.tostring = function dogtostring() { return `dog ${this.name} is a ${this.sex} ${this.color} ${this.breed}`; } with the preceding code in place, any time thedog is used in a string context, javascript automatically calls the dogtostring() function, which returns the following string: "dog gabby is a female chocolate lab" using tostring() to detect object class tostr...
RegExp.leftContext ($`) - JavaScript
you can not use the shorthand alias with the dot property accessor (regexp.$`), because the parser expects a starting template string in that case and a syntaxerror is thrown.
Lexical grammar - JavaScript
/(?:)/ template literals see also template strings for more information.
typeof - JavaScript
r'; typeof math.ln2 === 'number'; typeof infinity === 'number'; typeof nan === 'number'; // despite being "not-a-number" typeof number('1') === 'number'; // number tries to parse things into numbers typeof number('shoe') === 'number'; // including values that cannot be type coerced to a number typeof 42n === 'bigint'; // strings typeof '' === 'string'; typeof 'bla' === 'string'; typeof `template literal` === 'string'; typeof '1' === 'string'; // note that a number within a string is still typeof string typeof (typeof 1) === 'string'; // typeof always returns a string typeof string(1) === 'string'; // string converts anything into a string, safer than tostring // booleans typeof true === 'boolean'; typeof false === 'boolean'; typeof boolean(1) === 'boolean'; // boolean() will convert va...
Populating the page: how browsers work - Web Performance
this is why it's important for web performance optimization to include everything the browser needs to start rendering a page, or at least a template of the page - the css and html needed for the first render -- in the first 14 kilobytes.
Progressive web apps (PWAs)
oghliner — not only a template but a tool for deploying offline web apps to github pages.
class - SVG: Scalable Vector Graphics
WebSVGAttributeclass
the following is a template for an ebnf grammar describing the <list-of-ts> syntax: list-of-ts ::= t | t, list-of-ts within the svg dom, values of a <list-of-ts> type are represented by an interface specific for the particular type t.
Content type - SVG: Scalable Vector Graphics
the following is a template for an ebnf grammar describing the <list-of-ts> syntax: list-of-ts ::= t | t, list-of-ts within the svg dom, values of a <list-of-ts> type are represented by an interface specific for the particular type t.
<symbol> - SVG: Scalable Vector Graphics
WebSVGElementsymbol
the <symbol> element is used to define graphical template objects which can be instantiated by a <use> element.
<use> - SVG: Scalable Vector Graphics
WebSVGElementuse
--> </svg> the effect is the same as if the nodes were deeply cloned into a non-exposed dom, then pasted where the use element is, much like cloned template elements in html5.
SVG documentation index - SVG: Scalable Vector Graphics
WebSVGIndex
370 <symbol> svg, svg container the <symbol> element is used to define graphical template objects which can be instantiated by a <use> element.
Namespaces crash course - SVG: Scalable Vector Graphics
it's a good idea to use a template that includes all the commonly used namespace declarations when creating new svg files.
lang - XPath
WebXPathFunctionslang
given this fragment of xml: <p xml:lang="en">i went up a floor.</p> <p xml:lang="en-gb">i took the lift.</p> <p xml:lang="en-us">i rode the elevator.</p> and this part of an xsl template: <xsl:value-of select="count(//p[lang('en')])" /> <xsl:value-of select="count(//p[lang('en-gb')])" /> <xsl:value-of select="count(//p[lang('en-us')])" /> <xsl:value-of select="count(//p[lang('de')])" /> the output might be: 3 1 1 0 defined xpath 1.0 4.3 gecko support supported.
not - XPath
WebXPathFunctionsnot
--> </xsl:template> defined xpath 1.0 4.3 gecko support supported.
<xsl:choose> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementchoose
type instruction, appears with a template.
<xsl:copy-of> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementcopy-of
type instruction, appears within a template.
<xsl:number> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementnumber
type instruction, appears within a template.
<xsl:text> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementtext
type instruction, appears within a template.
<xsl:value-of> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementvalue-of
type instruction, appears with a template.
<xsl:when> - XSLT: Extensible Stylesheet Language Transformations
WebXSLTElementwhen
syntax <xsl:when test=expression> template </xsl:when> required attributes test specifies a boolean expression to be evaluated.
Advanced Example - XSLT: Extensible Stylesheet Language Transformations
new content from the transformation document.getelementbyid("example").appendchild(fragment) } // xsl stylesheet: <?xml version="1.0" encoding="utf-8"?> <xsl:stylesheet version="1.0" xmlns="http://www.w3.org/1999/xhtml" xmlns:html="http://www.w3.org/1999/xhtml" xmlns:xsl="http://www.w3.org/1999/xsl/transform"> <xsl:output method="html" indent="yes" /> <xsl:param name="myorder" /> <xsl:template match="/"> <xsl:apply-templates select="/div//div"> <xsl:sort select="." data-type="number" order="{$myorder}" /> </xsl:apply-templates> </xsl:template> <xsl:template match="div"> <xsl:copy-of select="." /> </xsl:template> </xsl:stylesheet> ...