i18n-element
Version:
I18N Base Element for lit-html and Polymer
393 lines (375 loc) • 13.8 kB
HTML
<!-- temporary HTML --><html><head><link rel="import" href="../../../i18n-element.html"><!-- start of innerHTML --><template id="simple-attribute-element" basepath="simple-attribute-element/" localizable-text="embedded">
<style attr="This is not extracted">
google-chart {
width: 300px;
}
</style>
<div id="outer-div">
<div id="ordinary-div" attr="This is not targeted for extraction">{{text.ordinary-div}}</div>
<input id="standard-input" placeholder="{{model.standard-input.placeholder}}">
<input placeholder="{{model.outer-div:input_2.placeholder}}">
<paper-input id="paper-input-element" label="{{model.paper-input-element.label}}" error-message="{{model.paper-input-element.error-message}}" placeholder="{{model.paper-input-element.placeholder}}" value="this is not a target">
</paper-input>
<paper-input label="{{model.outer-div:paper-input_4.label}}" error-message="{{model.outer-div:paper-input_4.error-message}}" placeholder="{{model.outer-div:paper-input_4.placeholder}}" value="this is not a target">
</paper-input>
<google-chart type="pie" id="pie-chart" options="{{model.pie-chart.options}}" cols="{{model.pie-chart.cols}}" rows="{{model.pie-chart.rows}}">
</google-chart>
<google-chart id="column-chart" type="column" options="{{model.column-chart.options}}" data="{{model.column-chart.data}}">
</google-chart>
<text-attribute-element id="custom-attr" custom-text-attr1="{{model.custom-attr.custom-text-attr1}}" custom-text-attr2="{{model.custom-attr.custom-text-attr2}}" custom-text-attr3="{{model.custom-attr.custom-text-attr3}}" out-of-scope-attr="out of scope attr">
</text-attribute-element>
<text-attribute-element id="selective-attr" boolean-attr="" empty-attr="" string-attr="abc" custom-text-attr4$="{{i18nFormat(model.selective-attr.custom-text-attr4.0,text.ordinary-div,text.ordinary-div,text.ordinary-div,text.ordinary-div)}}" custom-text-attr5$="[[text.ordinary-div]]{{model.selective-attr.custom-text-attr5.1}}{{or('',text.ordinary-div)}}{{model.selective-attr.custom-text-attr5.3}}[[text.ordinary-div]]" i18n-target="{{i18nFormat(model.selective-attr.i18n-target.0,text.ordinary-div,text.ordinary-div)}}" i18n-target2="{{model.selective-attr.i18n-target2.0}}{{or('',text.ordinary-div)}}{{model.selective-attr.i18n-target2.2}}[[text.ordinary-div]]">
</text-attribute-element>
<text-attribute-element id="selective-attr2" boolean-attr="" boolean-attr2="" string-attr="aaa" i18n-target="{{model.selective-attr2.i18n-target}}">
</text-attribute-element>
<text-attribute-element id="selective-attr3" i18n-target6="{{model.selective-attr3.i18n-target6}}">
</text-attribute-element>
<text-attribute-element id="selective-attr4" boolean-attr="" i18n-target6="{{model.selective-attr4.i18n-target6}}" i18n-target7="unmatching i18n-target4 attribute">
</text-attribute-element>
<text-attribute-element id="selective-attr5" string-attr="xxx" i18n-target7="unmatching i18n-target7 attribute">
</text-attribute-element>
<span id="test-json-data-1">{{model.json-data-id.attr1}}</span>
<span id="test-json-data-2">{{model.json-data-id.i18n-target-attr}}</span>
<span id="test-json-data-3">{{model.template_2:json-data_1.attr1}}</span>
<span id="test-json-data-4">{{model.template_2:json-data_1.i18n-target-attr}}</span>
</div>
<template>
<json-data id="json-data-id" attr1="{{model.json-data-id.attr1}}" i18n-target-attr="{{model.json-data-id.i18n-target-attr}}"></json-data>
<json-data attr1="{{model.template_2:json-data_1.attr1}}" i18n-target-attr="{{model.template_2:json-data_1.i18n-target-attr}}"></json-data>
</template>
<template id="localizable-text">
<json-data>
{
"meta": {},
"model": {
"standard-input": {
"placeholder": "standard HTML5 attribute"
},
"outer-div:input_2": {
"placeholder": "standard HTML5 attribute without id"
},
"paper-input-element": {
"label": "paper-input label",
"error-message": "paper-input error message",
"placeholder": "paper-input placeholder"
},
"outer-div:paper-input_4": {
"label": "paper-input label without id",
"error-message": "paper-input error message without id",
"placeholder": "paper-input placeholder without id"
},
"pie-chart": {
"options": {
"title": "Distribution of days in 2001H1"
},
"cols": [
{
"label": "Month",
"type": "string"
},
{
"label": "Days",
"type": "number"
}
],
"rows": [
[
"Jan",
31
],
[
"Feb",
28
],
[
"Mar",
31
],
[
"Apr",
30
],
[
"May",
31
],
[
"Jun",
30
]
]
},
"column-chart": {
"options": {
"title": "Inventory"
},
"data": [
[
"Year",
"Things",
"Stuff"
],
[
"2004",
1000,
400
],
[
"2005",
1170,
460
],
[
"2006",
660,
1120
],
[
"2007",
1030,
540
]
]
},
"custom-attr": {
"custom-text-attr1": "custom text attribute 1",
"custom-text-attr2": "custom text attribute 2",
"custom-text-attr3": "custom text attribute 3"
},
"selective-attr": {
"custom-text-attr4": [
"{1} custom-text-attr4 attribute with param {2} and param {3} {4}",
"{{text.ordinary-div}}",
"{{text.ordinary-div}}",
"[[text.ordinary-div]]",
"{{text.ordinary-div}}"
],
"custom-text-attr5": [
"[[text.ordinary-div]]",
" custom-text-attr5 attribute with param ",
"{{or('',text.ordinary-div)}}",
" and param ",
"[[text.ordinary-div]]"
],
"i18n-target": [
"i18n-target attribute with param {1} and param {2}",
"{{text.ordinary-div}}",
"[[text.ordinary-div]]"
],
"i18n-target2": [
"i18n-target2 attribute with param ",
"{{or('',text.ordinary-div)}}",
" and param ",
"[[text.ordinary-div]]"
]
},
"selective-attr2": {
"i18n-target": "i18n-target attribute 2"
},
"selective-attr3": {
"i18n-target6": "i18n-target6 attribute 2"
},
"selective-attr4": {
"i18n-target6": "i18n-target6 attribute 3"
},
"json-data-id": {
"attr1": "this attr1 is extracted",
"i18n-target-attr": "this attribute is also extracted"
},
"template_2:json-data_1": {
"attr1": "this attr1 without id is extracted",
"i18n-target-attr": "this attribute without id is also extracted"
}
},
"ordinary-div": "text 1"
}
</json-data>
</template>
</template><!-- end of innerHTML --></head><body><dom-module id="simple-attribute-element"><template localizable-text="embedded">
<style attr="This is not extracted">
google-chart {
width: 300px;
}
</style>
<div id="outer-div">
<div id="ordinary-div" attr="This is not targeted for extraction">{{text.ordinary-div}}</div>
<input id="standard-input" placeholder="{{model.standard-input.placeholder}}">
<input placeholder="{{model.outer-div:input_2.placeholder}}">
<paper-input id="paper-input-element" label="{{model.paper-input-element.label}}" error-message="{{model.paper-input-element.error-message}}" placeholder="{{model.paper-input-element.placeholder}}" value="this is not a target">
</paper-input>
<paper-input label="{{model.outer-div:paper-input_4.label}}" error-message="{{model.outer-div:paper-input_4.error-message}}" placeholder="{{model.outer-div:paper-input_4.placeholder}}" value="this is not a target">
</paper-input>
<google-chart type="pie" id="pie-chart" .options="{{parts.0}}" .cols="{{parts.1}}" .rows="{{parts.2}}">
</google-chart>
<google-chart id="column-chart" type="column" .options="{{parts.3}}" .data="{{parts.4}}">
</google-chart>
<text-attribute-element id="custom-attr" custom-text-attr1="{{model.custom-attr.custom-text-attr1}}" custom-text-attr2="{{model.custom-attr.custom-text-attr2}}" custom-text-attr3="{{model.custom-attr.custom-text-attr3}}" out-of-scope-attr="out of scope attr">
</text-attribute-element>
<text-attribute-element id="selective-attr" boolean-attr="" empty-attr="" string-attr="abc" custom-text-attr4$="{{i18nFormat(model.selective-attr.custom-text-attr4.0,parts.5,parts.6,parts.7,parts.8)}}" custom-text-attr5$="{{i18nFormat(model.selective-attr.custom-text-attr5.0,parts.9,parts.10,parts.11)}}" i18n-target="{{i18nFormat(model.selective-attr.i18n-target.0,parts.12,parts.13)}}" i18n-target2="{{i18nFormat(model.selective-attr.i18n-target2.0,parts.14,parts.15)}}">
</text-attribute-element>
<text-attribute-element id="selective-attr2" boolean-attr="" boolean-attr2="" string-attr="aaa" i18n-target="{{model.selective-attr2.i18n-target}}">
</text-attribute-element>
<text-attribute-element id="selective-attr3" i18n-target6="{{model.selective-attr3.i18n-target6}}">
</text-attribute-element>
<text-attribute-element id="selective-attr4" boolean-attr="" i18n-target6="{{model.selective-attr4.i18n-target6}}" i18n-target7="unmatching i18n-target4 attribute">
</text-attribute-element>
<text-attribute-element id="selective-attr5" string-attr="xxx" i18n-target7="unmatching i18n-target7 attribute">
</text-attribute-element>
<span id="test-json-data-1">{{parts.16}}</span>
<span id="test-json-data-2">{{parts.17}}</span>
<span id="test-json-data-3">{{parts.18}}</span>
<span id="test-json-data-4">{{parts.19}}</span>
</div>
<template>
<json-data id="json-data-id" attr1="{{model.json-data-id.attr1}}" i18n-target-attr="{{model.json-data-id.i18n-target-attr}}"></json-data>
<json-data attr1="{{model.template_2:json-data_1.attr1}}" i18n-target-attr="{{model.template_2:json-data_1.i18n-target-attr}}"></json-data>
<json-data id="pie-chart-options">{{text.pie-chart-options}}</json-data>
<json-data id="pie-chart-cols">{{text.pie-chart-cols}}</json-data>
<json-data id="pie-chart-rows">{{text.pie-chart-rows}}</json-data>
<json-data id="column-chart-options">{{text.column-chart-options}}</json-data>
<json-data id="column-chart-data">{{text.column-chart-data}}</json-data>
</template>
<template id="localizable-text">
<json-data>
{
"meta": {},
"model": {
"standard-input": {
"placeholder": "standard HTML5 attribute"
},
"outer-div:input_2": {
"placeholder": "standard HTML5 attribute without id"
},
"paper-input-element": {
"label": "paper-input label",
"error-message": "paper-input error message",
"placeholder": "paper-input placeholder"
},
"outer-div:paper-input_4": {
"label": "paper-input label without id",
"error-message": "paper-input error message without id",
"placeholder": "paper-input placeholder without id"
},
"custom-attr": {
"custom-text-attr1": "custom text attribute 1",
"custom-text-attr2": "custom text attribute 2",
"custom-text-attr3": "custom text attribute 3"
},
"selective-attr": {
"custom-text-attr4": [
"{1} custom-text-attr4 attribute with param {2} and param {3} {4}",
"{{parts.5}}",
"{{parts.6}}",
"{{parts.7}}",
"{{parts.8}}"
],
"custom-text-attr5": [
"{1} custom-text-attr5 attribute with param {2} and param {3}",
"{{parts.9}}",
"{{parts.10}}",
"{{parts.11}}"
],
"i18n-target": [
"i18n-target attribute with param {1} and param {2}",
"{{parts.12}}",
"{{parts.13}}"
],
"i18n-target2": [
"i18n-target2 attribute with param {1} and param {2}",
"{{parts.14}}",
"{{parts.15}}"
]
},
"selective-attr2": {
"i18n-target": "i18n-target attribute 2"
},
"selective-attr3": {
"i18n-target6": "i18n-target6 attribute 2"
},
"selective-attr4": {
"i18n-target6": "i18n-target6 attribute 3"
},
"json-data-id": {
"attr1": "this attr1 is extracted",
"i18n-target-attr": "this attribute is also extracted"
},
"template_2:json-data_1": {
"attr1": "this attr1 without id is extracted",
"i18n-target-attr": "this attribute without id is also extracted"
}
},
"ordinary-div": "text 1",
"pie-chart-options": {
"title": "Distribution of days in 2001H1"
},
"pie-chart-cols": [
{
"label": "Month",
"type": "string"
},
{
"label": "Days",
"type": "number"
}
],
"pie-chart-rows": [
[
"Jan",
31
],
[
"Feb",
28
],
[
"Mar",
31
],
[
"Apr",
30
],
[
"May",
31
],
[
"Jun",
30
]
],
"column-chart-options": {
"title": "Inventory"
},
"column-chart-data": [
[
"Year",
"Things",
"Stuff"
],
[
"2004",
1000,
400
],
[
"2005",
1170,
460
],
[
"2006",
660,
1120
],
[
"2007",
1030,
540
]
]
}
</json-data>
</template>
</template></dom-module><!-- end of dom-module id="simple-attribute-element" -->
</body></html>