Add Japanese document (#1186)

* Fixed invalid url link.

* Update docs/features/side-navigation.md

Co-Authored-By: Suzana Dirla <dirla.silvia.suzana@gmail.com>

* Initial japanese translation.
This commit is contained in:
Yuuki Ebihara
2019-09-10 20:46:48 +09:00
committed by Suzana Dirla
parent 21ffcaf013
commit d67f95cfff
66 changed files with 3974 additions and 0 deletions

View File

@@ -0,0 +1,19 @@
---
Title: 入門
Github only: true
---
# 入門
Alfresco Content Application で開発を開始する方法を学びます。
## コンテンツ
- [前提条件](/getting-started/prerequisites)
- [ソースからビルド](/getting-started/building-from-source)
- [国際化 (i18n)](/getting-started/internationalization)
- [CORS](/getting-started/cors)
- [シングルサインオン](/getting-started/sso)
- [設定](/getting-started/configuration)
- [ナビゲーション](/getting-started/navigation)
- [Docker](/getting-started/docker)

View File

@@ -0,0 +1,41 @@
---
Title: ソースからビルド
---
# ソースからビルド
Content App は [Angular CLI](https://cli.angular.io) をベースとしており、CLI でサポートされているすべてのコマンド、ジェネレーター、およびブループリントを使用できます。
## ビルドの前提条件
- [Node.js](https://nodejs.org/ja/) LTS
- (オプション) [Angular CLI](https://cli.angular.io/) 7.3.4 以降
> Angular CLI ライブラリはすでにセットアップの一部です。
> CLI コマンドを個別に使用する場合にのみ、グローバル (推奨) ツールとしてインストールすることをお勧めします。
## クローンと実行
次のコマンドを使用してプロジェクトのクローンを作成し、依存関係をインストールして実行します。
```sh
git clone https://github.com/Alfresco/alfresco-content-app.git
cd alfresco-content-app
npm install
npm start
```
アプリケーションはデフォルトでポート `4200` で実行され、プロジェクトがコンパイルされるとデフォルトのブラウザで自動的に開きます。
## プロキシ設定
Content App は、ローカル開発サーバのプロキシ設定を提供します。これにより、CORS とネイティブ認証ダイアログを使用して特定のシナリオに対処できます。
プロジェクトのルートディレクトリにある `proxy.conf.js` ファイルの中に設定があります。
**注:** プロキシ設定は `npm start` スクリプトでアプリケーションを実行するたびに自動的に適用されます。
設定を変更するたびにアプリケーションを再起動する必要があります。
## 単体テストの実行
[Karma](https://karma-runner.github.io) を介して単体テストを実行するには、`npm test` を実行します。

View File

@@ -0,0 +1,152 @@
---
Title: 設定
---
# 設定
Alfresco Content Application は、Content Application と ADF コンポーネントの動作をカスタマイズするために使用できるグローバル設定ファイル `app.config.json` のサポートを提供します。
## サーバの設定
Content Application が起動したら、Alfresco Content Services サーバの場所と、ファイル共有 URL を確認する必要があります。
### Content Services アドレス
"ecmHost" プロパティを使用すると、動的または静的形式を使用してサーバのアドレスを設定できます。
#### 動的アドレス
以下の例は、開発環境で最も一般的な動的形式を示しています:
```json
{
"ecmHost": "http://{hostname}{:port}",
...
}
```
上記の構成では、ACS と Alfresco Content Application を同じサーバとポートで実行していることを前提としており、
同じ統合構成ファイルを持つ異なるサーバに展開できます。
たとえば、ルートアプリケーションとして Alfresco Content Application をホストしている `localhost:4200` のプロキシサーバと、
ACS リポジトリの `localhost:4200/alfresco` のプロキシサーバです。
実行時に、アプリケーションは自動的に "{hostname}" の値を元のホスト名に置き換えます。
オプションで、ローカルマシンの "4200" など、元のポートの値が存在する場合はポート 80 の値をスキップしてそれを使用することもできます。
#### 静的アドレス
または、必要に応じて、ACS サーバの静的アドレスを提供できます:
```json
{
"ecmHost": "http://localhost:4200",
...
}
```
### 共有ファイルのアドレス
"baseShareUrl" プロパティは、ユーザーが共有ファイルにアクセスするアドレスを作成する方法をアプリケーションに指示します。
```json
{
"baseShareUrl": "{protocol}//{hostname}{:port}/#/preview/s"
}
```
## アプリケーションの設定
アプリケーションのデフォルトの動作を置き換えるために変更できる多くの設定があります。
### アプリケーション名
次のブロックでは、アプリケーションの名前を変更できます。
```json
{
...,
"application": {
"name": "Alfresco Example Content Application"
}
}
```
`application.name` キーの値は、実行時に `[ページタイトル] - [アプリケーション名]` の形式ですべてのブラウザタブタイトルに追加されます。
例: "個人ファイル - Alfresco サンプルコンテンツアプリケーション"
### アプリケーションロゴ
Alfresco コンテンツアプリケーションの左上隅に表示されるデフォルトのロゴは変更できます:
1. カスタムロゴ画像ファイルを[アプリ名]/src/assets/images フォルダに配置します。表示された画像は自動的にサイズ変更され、極端な幅/高さの画像は寸法を保持できない場合があります。
2. app.config.json ファイルで、application.logo の値にカスタムロゴ画像の名前を含むように設定します: "logo": "/assets/images/[カスタムロゴ画像ファイル名].[拡張子]"
```json
{
...,
"application": {
"logo": "/assets/images/alfresco-logo-white.svg"
}
}
```
### ヘッダーの背景色
"headerColor" キーの色コードを指定することにより、ヘッダーの背景色を変更できます:
```json
{
...,
"headerColor": "#2196F3"
}
```
### 制限されたコンテンツ
"files.excluded" パスでルールのリストを設定または拡張することにより、ユーザーが特定のタイプのファイルおよびフォルダーをアップロードすることを制限できます。
デフォルトでは、アプリケーションには以下のルールがあらかじめ定義されています:
```json
{
...,
"files": {
"excluded": [
".DS_Store",
"desktop.ini",
"thumbs.db",
".git"
]
},
...
}
```
**Tip:** サポートされているルールの詳細については、ADF [Upload Service](https://www.alfresco.com/abn/adf/docs/core/services/upload.service/) のドキュメントをご覧ください。
### ページネーション設定
アプリケーション内のすべてのドキュメントリストに適用されるページネーションのデフォルト設定を変更できます。
```json
{
...,
"pagination": {
"supportedPageSizes": [
25,
50,
100
]
},
...
}
```
## カスタム設定
アプリケーション設定ファイルに情報を保存し、ADF が提供する `AppConfigService` サービスを使用して実行時にアクセスできます。
**Tip:** 利用可能なアプリケーション構成機能および API の詳細については、
ADF の [App Config Service](https://www.alfresco.com/abn/adf/docs/core/services/app-config.service/) のドキュメントを参照してください。

View File

@@ -0,0 +1,29 @@
---
Title: CORS
---
# CORS
Alfresco Content Application には、開発における CORS 関連の問題に対処するための Angular CLI のプロキシ設定が付属しています。
また、Docker イメージには、アプリケーションをローカルで開発およびデバッグするときに CORS に必要な Nginx 設定が含まれています。
## Chrome の回避策
Chrome ブラウザでは、CORS を切り替えることができる次のプラグインを使用できます:
[Allow-Control-Allow-Origin](https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi)
## Firefox の回避策
Firefox ブラウザの場合、次のプラグインを使用できます: [CORS Everywhere](https://addons.mozilla.org/en-Gb/firefox/addon/cors-everywhere/)
## Safari の回避策
Safari で開発またはテストしている場合は、"Develop" メニューを使用して CORS モードを切り替えることができます。
CORS 設定を変更するたびに、ページをリロードする必要があることに注意してください。
![](../images/safari-develop-menu.png)
## あわせて参照
- [CORS の使用](https://www.html5rocks.com/en/tutorials/cors/)

View File

@@ -0,0 +1,32 @@
---
Title: Docker
---
# Docker
ACA には ACS 6.0 Community 版が事前構成されています。
アプリケーションは2つのモードで実行されます:
- Development (最新のソースコードを実行し、アプリケーションのビルドが必要)
- Preview (最新の公開されたコンテナー、マスターブランチで実行)
## Development モード
ACS イメージと共に、Docker イメージにパッケージ化されたアプリケーションのローカルインスタンスを実行します:
```sh
npm run build
npm run start:docker
```
コンテナ内から提供される場合、ACA は `4000` ポートで実行されます。
次のコマンドを使用して、すべてのコンテナを停止します:
```sh
npm run stop:docker
```
アプリケーションを開発し、デフォルトのポート (4200) で実行することもできます。
これは、同じ docker コンテナを自動的に使用します。

View File

@@ -0,0 +1,141 @@
---
Title: 国際化
---
# 国際化 (i18n)
コンテンツアプリケーションは、次の言語のサポートを提供します:
- ドイツ語 (`de`)
- 英語 (`en`)
- スペイン語 (`es`)
- フランス語 (`fr`)
- イタリア語 (`it`)
- 日本語 (`ja`)
- ノルウェー語 (`nb`)
- オランダ語 (`nl`)
- ブラジルポルトガル語 (`pt-BR`)
- ロシア語 (`ru`)
- 簡体字中国語 (`zh-CN`)
- アラビア語 (`ar`)
- チェコ語 (`cs`)
- デンマーク語 (`da`)
- フィンランド語 (`fi`)
- ポーランド語 (`pl`)
- スウェーデン語 (`sv`)
デフォルトの言語は英語ですが、現在のブラウザの言語は、アプリケーションの起動時に自動的にデフォルトの言語として使用されます。
## ユーザ定義言語
ユーザが設定に保存されるカスタム言語を設定できるようにすることができます。
メインアプリケーションメニューには、すでに [ADF 言語メニュー](https://www.alfresco.com/abn/adf/docs/core/components/language-menu.component/) コンポーネントが統合され、サポートされる項目が事前に入力されています。
デフォルトの言語セットを変更するには、`app.config.json` ファイルを編集し、アイテムを追加または削除します:
```json
{
...,
"languages": [
{
"key": "de",
"label": "ドイツ語"
},
{
"key": "en",
"label": "英語"
},
{
"key": "es",
"label": "スペイン語"
},
...
]
}
```
ファイルは次の場所にあります: `/src/app.config.json`
## カスタム言語
カスタム言語を追加するには、新しい "JSON" ファイルを "/src/assets/i18n" フォルダに追加します。
たとえば、"ドイツ語" の "de.json" など、ターゲット言語の名前を指定します。
デフォルトの "en.json" ファイルに基づいてリソース文字列を翻訳します。
新しく作成したファイルにコンテンツをコピーし、英語の値を翻訳されたテキストに置き換えることができます。
```json
{
"APP": {
"SIGN_IN": "Anmelden",
"SIGN_OUT": "Abmelden",
"NEW_MENU": {
"LABEL": "Neu",
"MENU_ITEMS": {
"CREATE_FOLDER": "Ordner erstellen",
"UPLOAD_FILE": "Datei hochladen",
"UPLOAD_FOLDER": "Ordner hochladen"
},
...
}
},
...
}
```
Content Application は、プロジェクトのビルド時にファイルを自動的にバンドルします。
ブラウザの言語設定を変更してページを再読み込みすることにより、ロケールをテストできます。
オプションで、`app.config.json` ファイルを更新することにより、新しく追加された言語で [ADF 言語メニューコンポーネント](https://www.alfresco.com/abn/adf/docs/core/components/language-menu.component/) を拡張できます。
## ADF の翻訳のカスタマイズ
Content Application のカスタム言語ファイルを作成することに加えて、
ADF リソースの翻訳を提供することもできます。
`/src/assets/i18n/<lang>.json` ファイルは、ADF 言語ファイルの1つの構造を反映します:
- ADF Core ([en.json](https://github.com/Alfresco/alfresco-ng2-components/blob/master/lib/core/i18n/en.json))
- ADF Content Services ([en.json](https://github.com/Alfresco/alfresco-ng2-components/blob/master/lib/content-services/i18n/en.json))
- ADF Process Services ([en.json](https://github.com/Alfresco/alfresco-ng2-components/blob/master/lib/process-services/i18n/en.json))
- ADF Insights ([en.json](https://github.com/Alfresco/alfresco-ng2-components/blob/master/lib/insights/i18n/en.json))
実行時には、アプリケーションレベルの文字列が最も優先されます。
つまり、必要に応じて ADF リソース文字列の値を置き換えることができます。
たとえば、ADF に同梱されている "Create Folder" ダイアログのタイトルを変更してみましょう。
`/src/assets/i18n/en.json` ファイルを変更し、次の例のように "CORE" セクションを追加します:
```json
{
"APP": {
...
},
"CORE": {
"FOLDER_DIALOG": {
"CREATE_FOLDER_TITLE": "Custom title"
}
}
}
```
ここで、アプリケーションを実行して "New > Create Folder" メニューをクリックすると、
ダイアログのタイトルは次のようになります:
![](../images/aca-i18n-01.png)
## 言語ピッカー
`app.config.json` ファイルで内部言語ピッカーを有効にできます:
```json
{
...,
"languagePicker": true,
...
}
```
![](../images/aca-i18n-02.png)

View File

@@ -0,0 +1,213 @@
---
Title: ナビゲーション
---
# ナビゲーション
Alfresco Content Application は、次のナビゲーションリンクを提供します:
- 個人用ファイル
- ファイルライブラリ
- 共有
- 最近使用したファイル
- お気に入り
- ゴミ箱
サイドナビゲーションは、`app.config.json` を編集してリンクの外観をカスタマイズするサポートを提供します。
## カスタマイズ
ナビゲーション設定は、スキーマのような配列とオブジェクトをサポートします。オブジェクトを定義すると、ナビゲーションがリンクの異なるグループ間の視覚的な区切り文字をレンダリングするのに役立ちます。
```json
{
"navigation": {
"main": [
...
],
"secondary": [
...
]
}
}
```
![](../images/navigation-01.png)
```json
{
"navigation": [
{ ... },
{ ... },
...
]
}
```
![](../images/navigation-02.png)
### アイコンとテキストをカスタマイズする
`icon` - サポートされる値は、[Material Design](https://material.io/icons) アイコンライブラリの任意のものです。定義されていない場合、リンクはラベルの値のみをレンダリングします。
`title` - 指定された値でネイティブブラウザのツールチップをレンダリングするようにリンクに指示します。文字列または国際化定義の参照が可能です。定義されていない場合、リンクにはツールチップが表示されません。
`label` - リンクの視覚的な名前を表します。文字列または国際化定義の参照が可能です。
**注意:** ` "route": { "url": "/..." } ` の値を変更すると、これらはアプリケーションルーティングシステムにマッピングされるため、ナビゲーションに影響します。
### カスタムテキスト (i18n)
ナビゲーションリンクの `title``label` を変更するには、`/src/assets/i18n/en.json` にある `BROWSE` エントリの下の値を編集します
```json
"APP" : {
...
"BROWSE": {
"PERSONAL": {
"TITLE": "Personal Files",
"SIDENAV_LINK": {
"LABEL": "Personal Files",
"TOOLTIP": "View your Personal Files"
}
},
...
}
}
```
国際化の詳細については、[国際化 (i18n)](/getting-started/internationalization) セクションを参照してください。
## ユーザー定義のナビゲーション
アプリケーションにカスタムナビゲーションリンクを追加するには、最初にコンポーネントを作成する必要があります。
`src/app/components/custom-page/custom-page.component.ts`
```js
import { Component } from '@angular/core';
@Component({
template: `
<h4>{{ title }}</h4>
`
})
export class CustomPage {
title = 'My Custom Page'
}
```
コンポーネントを ```app.module.ts``` に登録します
```javascript
...
import { CustomPage } from './components/custom-page/custom-page.component';
@NgModule({
...
declarations: [
...,
CustomPage
],
...
})
```
`app.config.json` で、カスタムページを指すリンクエントリを定義します
```json
{
...,
"navigation": [
"main": [ ... ],
"secondary": [ ... ],
"custom": [
{
"icon": "work",
"label": "Link",
"title": "My custom link",
"route": {
"url": "/custom-route"
}
}
]
]
}
```
これは ngrx ストアアクションを使用して宣言することもできます:
```json
{
...,
"navigation": [
"main": [ ... ],
"secondary": [ ... ],
"custom": [
{
"icon": "work",
"label": "Link",
"title": "My custom link",
"click": {
"action": "NAVIGATE_ROUTE",
"payload": "custom-route"
}
}
]
]
}
```
`app.routes.ts` の `/custom-route` を `LayoutComponent` 定義の子としてマッピングします。
```js
import { CustomPage } from './components/custom-page/custom-page.component.ts';
...
{
path: '',
component: LayoutComponent,
children: [
...,
{
path: 'custom-route',
component: CustomPage
}
]
}
...,
```
![](../images/navigation-03.png)
### カスタムコンポーネントのレンダリング
ナビゲーション定義は、動的にレンダリングされるカスタムコンポーネントもサポートします。このスキーマは次のとおりです:
```json
"navbar": [
{
"id": "app.navbar.primary",
"items": [
...
{
"id": "custom-component",
"component": "custom-menu-item"
}
...
]
}
]
```
コンポーネントは app モジュールの下で entryComponents として宣言する必要があることに注意してください。
カスタムページのコンテンツの詳細については、[ドキュメントリストのレイアウト](/features/document-list-layout) セクションを参照してください。

View File

@@ -0,0 +1,16 @@
---
Title: 前提条件
---
# 前提条件
このアプリケーションは、Alfresco からの最新リリースを使用します:
- [Alfresco ADF (3.3.0)](https://community.alfresco.com/community/application-development-framework/pages/get-started)
- [Alfresco Content Services (6.1)](https://www.alfresco.com/platform/content-services-ecm)
もしくは [Alfresco Community Edition (6.1 - General Availability 201901)](https://www.alfresco.com/products/community/download)
**注:** ソースコードからローカルにビルドするには、[Node.js](https://nodejs.org/ja/) (LTS) もインストールする必要があります。
アプリケーションは最新の [REST API](https://docs.alfresco.com/5.2/pra/1/topics/pra-welcome.html) を使用して開発されているため、
Alfresco Content プラットフォームの最新バージョンが必要です。

View File

@@ -0,0 +1,59 @@
---
Title: シングルサインオン
---
# シングルサインオン
Basic 認証に加えて、Content Application を以下で使用できます:
- [Keycloak](https://www.keycloak.org/)
- [Identity Service](https://docs.alfresco.com/identity1.0/concepts/identity-overview.html)
- Kerberos
アプリケーションには、シングルサインオン (別名 SSO) セットアップの適切なデフォルトが含まれています。
設定は `app.config.json` ファイルの中にあり、次のようになります:
```json
{
"providers": "ECM",
"authType": "BASIC",
"oauth2": {
"host": "http://localhost:4200/auth/realms/alfresco",
"clientId": "alfresco",
"scope": "openid",
"secret": "",
"implicitFlow": true,
"silentLogin": true,
"redirectSilentIframeUri": "./assets/silent-refresh.html",
"redirectUri": "/",
"redirectUriLogout": "/logout"
}
}
```
Basic 認証から SSO モードに切り替えるには、`authType` プロパティ値を `OAUTH` に変更します。
また、デフォルトの設定では、事前に設定された `alfresco` クライアントがあることを前提としています。
http://localhost:4200/#/settings ページで認証モードを試すことができます:
![認証設定](../images/aca-sso-settings.png)
## Kerberos
追加の Kerberos 機能のサポートを有効にするには、
`app.config.json` ファイルで `withCredentials` フラグを有効にしてください:
```json
{
"auth": {
"withCredentials": true
}
}
```
`withCredentials` フラグを有効にすると、ログインプロセスは完全に Kerberos によって処理されるため、
アプリケーションはユーザーをログイン画面にリダイレクトしません。
## あわせて参照
ADF Login コンポーネントと設定オプションの詳細については、[Login](https://www.alfresco.com/abn/adf/docs/core/components/login.component/#single-sign-on-sso) のドキュメントを参照してください。