ウィジェットを翻訳
Application Mashup (WireCloud) course @ https://fiware-academy.readthedocs.io/
画面の切り替えは ← と → です。詳細情報は h です
Presenter Notes
ウィジェットを翻訳
ウィジェット・メタデータの翻訳
Presenter Notes
ウィジェット・メタデータの翻訳
XML テンプレートを使用
XML テンプレートを使用すると、WireCloud プラットフォームでユーザに表示される
いくつかのフィールドの翻訳が可能になります。この翻訳は、ウィジェットの
デフォルト言語を指定する default 属性を持つ translations ノードを
追加するテンプレートに含めることができます。翻訳対象のすべての言語について、
Traslations ノードには lang 属性を使用して言語を指定する translation
ノードが含まれています。
フィールドを翻訳するには、フィールドの値の内側に MSG_translationName
パターン (translationName が翻訳識別子として使用されている)
を使用するだけです。翻訳パターンを追加したら、translation ノードに
(翻訳名と name 属性を一致させる) msg ノードを追加する必要があります。
これらの msg 要素は、翻訳パターンを置き換えるために使用される文字列を
提供します。
Presenter Notes
ウィジェット・メタデータの翻訳
XML テンプレートを使用
翻訳を追加する前後の config.xml ファイルの構造は以下のようになります :
<widget xmlns="http://wirecloud.conwet.fi.upm.es/ns/macdescription/1" vendor="CoNWeT" name="weather-example" version="1.0">
<details>
<title>Weather Widget Example</title>
<authors>aarranz</authors>
<email>aarranz@conwet.com</email>
<image>images/catalogue.png</image>
<smartphoneimage>images/catalogue_iphone.png</smartphoneimage>
<description>Example of widget for the Wirecloud Plaftorm.</description>
<doc>doc/index.html</doc>
</details>
<wiring>
<outputendpoint name="location_coord" type="text" label="Forecast location" description="This event is launched when the user clicks on the location name of current forecast." friendcode="location"/>
<inputendpoint name="coord" type="text" label="Show forecast by coord" description="Shows the weather forecast for a given location (a latitude longitude coordinate)." friendcode="location"/>
</wiring>
<contents src="weather.html" contenttype="text/html" charset="utf-8"/>
<rendering height="24" width="6"/>
</widget>
Presenter Notes
ウィジェット・メタデータの翻訳
Using XML templates
最終結果 (メイン) :
<widget xmlns="http://wirecloud.conwet.fi.upm.es/ns/macdescription/1" vendor="CoNWeT" name="weather-example" version="1.0">
<details>
<title>__MSG_displayName__</title>
<authors>aarranz</authors>
<email>aarranz@conwet.com</email>
<image>images/catalogue.png</image>
<smartphoneimage>images/catalogue_iphone.png</smartphoneimage>
<description>__MSG_description__</description>
<doc>doc/index.html</doc>
</details>
<wiring>
<outputendpoint name="location_coord" type="text" label="__MSG_eventLabel__" description="__MSG_eventDescription__" friendcode="location"/>
<inputendpoint name="coord" type="text" label="__MSG_slotLabel__" description="__MSG_slotDescription__" friendcode="location"/>
</wiring>
<contents src="weather.html" contenttype="text/html" charset="utf-8"/>
<rendering height="24" width="6"/>
...
Presenter Notes
ウィジェット・メタデータの翻訳
Using XML templates
最終結果 (翻訳) :
...
<translations default="en">
<translation lang="en">
<msg name="displayName">Weather Widget Example</msg>
<msg name="description">Example of widget for the Wirecloud Plaftorm.</msg>
<msg name="eventDescription">This event is launched when the user clicks on the location name of current forecast.</msg>
<msg name="slotDescription">Shows the weather forecast for a given location (a latitude longitude coordinate).</msg>
<msg name="slotLabel">Show forecast by coord</msg>
<msg name="eventLabel">Forecast location</msg>
</translation>
<translation lang="es">
<msg name="displayName">Ejemplo de widget del tiempo</msg>
<msg name="description">Ejemplo de un widget para la plataforma Wirecloud.</msg>
<msg name="eventDescription">Este evento se lanza cuando el usuario hace click en el nombre de la ubicación de la previsión actual.</msg>
<msg name="slotDescription">Muestra las previsiones meteorológicas para una ubicación dada (coordenadas en latitud y longitud).</msg>
<msg name="slotLabel">Muestra las prevesiones por coordenadas</msg>
<msg name="eventLabel">Ubicación de la previsión</msg>
</translation>
</translations>
</widget>
Presenter Notes
ウィジェット・メタデータの翻訳
RDF テンプレートを使用
RDF 記述内の翻訳は、RDF リテラルの lang 属性の使用に基づいています。 フィールドを翻訳するために、翻訳されるすべての言語のテンプレートに含まれ、 その言語を lang 属性で指定します。
Presenter Notes
ウィジェット・メタデータの翻訳
RDF テンプレートを使用
翻訳なしの RDF (xml) 記述の構造 :
...
<wire:Widget rdf:about="http://wirecloud.conwet.fi.upm.es/ns/weather-example">
<dcterms:title>weather-example</dcterms:title>
<dcterms:description>Example of widget for the Wirecloud Plaftorm.</dcterms:description>
<wire:displayName>Weather Widget Example</wire:displayName>
<dcterms:creator>
<foaf:Person>
<foaf:name>aarranz</foaf:name>
</foaf:Person>
</dcterms:creator>
<usdl-core:versionInfo>1.0</usdl-core:versionInfo>
<wire:hasImageUri rdf:resource="images/catalogue.png"/>
<wire:hasiPhoneImageUri rdf:resource="images/catalogue_iphone.png"/>
...
Presenter Notes
ウィジェット・メタデータの翻訳
RDF テンプレートを使用
翻訳を含む RDF (xml) 記述の構造 :
...
<wire:Widget rdf:about="http://wirecloud.conwet.fi.upm.es/ns/weather-example">
<dcterms:title>weather-example</dcterms:title>
<dcterms:description xml:lang="en">Example of widget for the Wirecloud Plaftorm.</dcterms:description>
<dcterms:description xml:lang="es">Ejemplo de un widget para la plataforma Wirecloud.</dcterms:description>
<wire:displayName xml:lang="en">Weather Widget Example</wire:displayName>
<wire:displayName xml:lang="es">Ejemplo de widget del tiempo</wire:displayName>
<dcterms:creator>
<foaf:Person>
<foaf:name>aarranz</foaf:name>
</foaf:Person>
</dcterms:creator>
<usdl-core:versionInfo>1.0</usdl-core:versionInfo>
<wire:hasImageUri rdf:resource="images/catalogue.png"/>
<wire:hasiPhoneImageUri rdf:resource="images/catalogue_iphone.png"/>
...
Presenter Notes
ウィジェット・メタデータの翻訳
RDF テンプレートを使用
翻訳のない RDF (turtle) 記述の構造 :
...
<http://wirecloud.conwet.fi.upm.es/ns/weather-example>
a wire:Widget ;
dcterms:title "weather-example" ;
wire:displayName "Weather Widget Example" ;
dcterms:description "Example of widget for the Wirecloud Plaftorm." ;
dcterms:creator _:b1 ;
usdl-core:versionInfo "1.0" ;
wire:hasImageUri <images/catalogue.png> ;
wire:hasiPhoneImageUri <images/catalogue_iphone.png> ;
...
Presenter Notes
ウィジェット・メタデータの翻訳
RDF テンプレートを使用
翻訳付きの RDF (turtle) 記述の構造 :
...
<http://wirecloud.conwet.fi.upm.es/ns/weather-example>
a wire:Widget ;
dcterms:title "weather-example" ;
wire:displayName "Weather Widget Example"@en ;
wire:displayName "Ejemplo de widget del tiempo"@es ;
dcterms:description "Example of widget for the Wirecloud Plaftorm."@en ;
dcterms:description "Ejemplo de un widget para la plataforma Wirecloud."@es ;
dcterms:creator _:b1 ;
usdl-core:versionInfo "1.0" ;
wire:hasImageUri <images/catalogue.png> ;
wire:hasiPhoneImageUri <images/catalogue_iphone.png> ;
...
Presenter Notes
ウィジェットを翻訳
ウィジェットの内容を翻訳
Presenter Notes
ウィジェットの内容を翻訳
ウィジェットのコンテンツは、JavaScript とプラットフォームのコンテキストに アクセスするためのサポートを使用して翻訳する必要があります。現在使用されている 言語を知るためには、プラットフォームのコンテキスト・サポートが必要です :
MashupPlatform.context.get('language');
Presenter Notes
Thanks!