Add Japanese translated document. #216

Merged
merged 36 commits into from May 28, 2016

Projects

None yet

2 participants

@hypermkt
Contributor
hypermkt commented May 5, 2016 edited

refs : #192

TODO

  • Installation
  • Getting started
  • Validation result structure
  • Validator syntax
  • v-model integration
  • Reset validation results
  • Form validatable elements
  • Validation classses
  • Grouping
  • Error messages
  • Events
  • Lazy initialization
  • Custom validator
  • Validation timing customization
  • Async validation
  • API
  • Self review
  • Ask for review and fix

Reference

@kazupon kazupon added the status:wip label May 5, 2016
@hypermkt hypermkt and 1 other commented on an outdated diff May 5, 2016
docs/ja/installation.md
+## NPM
+
+### 安定版
+
+ $ npm install vue-validator
+
+### 開発版
+
+ $ git clone https://github.com/vuejs/vue-validator.git node_modules/vue-validator
+ $ cd node_modules/vue-validator
+ $ npm install
+ $ npm run build
+
+CommonJS で使用されるとき、明示的に `Vue.use()` 経由でバリデーターをインストールしなければなりません:
+
+> :warning: もし `vue-router` を使用している場合は、 `router#start` の前に `Vue.use()` でインストールしなければなりません。
@hypermkt
hypermkt May 5, 2016 edited Contributor

When I check on my localhost, I can't see the warning icon. Why...

current on my localhost

image

expected

image

@hypermkt
hypermkt May 5, 2016 Contributor

Thanks for the comment. I installed the gitbook plugins as follows.

$ cd vue-validator/docs
$ gitbook install
$ gitbook build

Run to check on localhost.

$ gitbook serve

:warning: was converted into image tag. But I couldn't still see it.
image

The advanced-emoji plugin seems installed successlly on my PC. But the file path on image tag seems different. hmm.

$ ll  _book/gitbook/plugins/gitbook-plugin-advanced-emoji/emojis/ | grep warning
-rw-r--r--  1 hypermkt  staff  3173  5  5 21:52 warning.png
@hypermkt
hypermkt May 5, 2016 Contributor

I checked the README of this plugin and have no idea... hmm.. Let's move forward the translation first!
https://plugins.gitbook.com/plugin/advanced-emoji

@kazupon
kazupon May 5, 2016 Owner

What's gitbook version ?
If 3.0.0-pre, maybe it might be due not to correspond to the latest version.

@hypermkt
hypermkt May 7, 2016 Contributor

I was using 2.1.3. (node v6.0.0 installed by nodebrew) At least I can work on translation even if I can't see the icon on localhost. Thanks for helping!

hypermkt added some commits May 5, 2016
@hypermkt hypermkt Translated Getting Started 9cfe344
@hypermkt hypermkt Copied from jp.vuejs.org repository.
The rule of Japanese textlint should be same with same project.
4dc5ed8
@kazupon
Owner
kazupon commented May 7, 2016

/ping @hypermkt
I fixed en docs.
b48759e

@hypermkt
Contributor
hypermkt commented May 7, 2016

Thanks for letting me know the update!

@hypermkt hypermkt and 1 other commented on an outdated diff May 7, 2016
docs/ja/structure.md
+ touched: true,
+ undefined: false,
+ dirty: true,
+ pristine: false,
+ modified: true,
+ errors: [{
+ validator: 'customValidator', message: 'invalid fieldX'
+ }]
+ },
+}
+```
+
+様々なトップレベルプロパティはバリデーションスコープの中に、そして各フィールドのバリデーション結果は自身それぞれのスコープの中にあります。
+
+## フィールドバリデーションプロパティ
+- `valid`: フィールドが有効化どうか; もし有効なら、`true` を返し、そうでなければ `false` を返します。
@hypermkt
hypermkt May 7, 2016 Contributor

I see the errors by textlink for ;.

$ textlint structure.md

/Users/hypermkt/work/vue-validator/docs/ja/structure.md
  67:24  error  原則として和文ではセミコロン(;)を使用しません。  preset-jtf-style/4.2.8.セミコロン(;)
  71:31  error  原則として和文ではセミコロン(;)を使用しません。  preset-jtf-style/4.2.8.セミコロン(;)
  72:36  error  原則として和文ではセミコロン(;)を使用しません。  preset-jtf-style/4.2.8.セミコロン(;)
  77:31  error  原則として和文ではセミコロン(;)を使用しません。  preset-jtf-style/4.2.8.セミコロン(;)

ただし、文の途中にハイフン- や セミコン; がある場合は、その記号があると理解しづらい訳になる場合は、例外として削除てもよいです。

Maybe I should delete ; this time. It doesn't look natural.

@hypermkt
hypermkt May 8, 2016 Contributor

I got it!

@hypermkt hypermkt and 1 other commented on an outdated diff May 7, 2016
docs/ja/structure.md
@@ -0,0 +1,84 @@
+# バリデーション結果構造
+
+バリデーション結果はこの構造でアクセスできます:
+
+```
+{
+ // top-level validation properties
@hypermkt
hypermkt May 7, 2016 Contributor

I should probably translate the comments, too.

@kazupon
kazupon May 8, 2016 Owner

Thank you!

@hypermkt
hypermkt May 8, 2016 Contributor

I'll translate! I got it!

@hypermkt hypermkt commented on the diff May 7, 2016
docs/ja/syntax.md
+下記の例ではオブジェクトリテラルを使用しています:
+
+```html
+<validator name="validation">
+ <form novalidate>
+ ID: <input type="text" v-validate:id="{ required: true, minlength: 3, maxlength: 16 }"><br />
+ <div>
+ <span v-if="$validation.id.required">ID is required</span>
+ <span v-if="$validation.id.minlength">Your ID is too short.</span>
+ <span v-if="$validation.id.maxlength">Your ID is too long.</span>
+ </div>
+ </form>
+</validator>
+```
+
+オブジェクトリテラルはルールを与えることができます。上記で示すように、 `required` にはルールが必要なく、 **ダミールール**を代わりに指定することができます。
@hypermkt
hypermkt May 7, 2016 Contributor

At first, I couldn't understand the meaning of dummy rule in this part. But I could understand when I write a sample code like this ID: <input type="text" v-validate:id="{ required: we_can_set_here_anything_because_it_is_dummy , minlength: 3, maxlength: 16 }">. It works anyway.

@kazupon
kazupon May 8, 2016 Owner

Be my guest 😺

@hypermkt
Contributor
hypermkt commented May 8, 2016

Just reached half of docs. Let's keep going! 😄

@kazupon
Owner
kazupon commented May 16, 2016

Oh, You're almost there! 😺

@hypermkt
Contributor

😄 Let's keep going!

@hypermkt hypermkt and 1 other commented on an outdated diff May 17, 2016
docs/ja/timing.md
+ <label for="username">username:</label>
+ <!-- 'inital' 属性は対象エレメントの全てのバリデーターに対して適用されます (例えば required, exist) -->
+ <input id="username" type="text" initial="off" v-validate:username="['required', 'exist']">
+ </div>
+ <div class="password-field">
+ <label for="password">password:</label>
+ <!-- 任意の'initial' は `v-validate` バリデーターに適用されます。(例えば required のみ) -->
+ <input id="password" type="password" v-validate:passowrd="{ required: { rule: true, initial: 'off' }, minlength: 8 }">
+ </div>
+ <input type="submit" value="send" v-if="$validation1.valid">
+ </form>
+ </validator>
+</div>
+```
+
+これは非同期的な特徴のバリデーション(サーバーサイドバリデーションのような)を抑制する必要がある場合に便利です。(後ほど説明します)
@hypermkt
hypermkt May 17, 2016 edited Contributor

I'm worried about this translation a little bit. Is this accurate? hmm...

original

This is useful, when you need to suppress the validation (like the server-side validation) with async validation feature (explain later).

@kazupon
kazupon May 18, 2016 edited Owner

sorry, my poor english ... orz
日本語でいうと下記ですね。

これはサーバサイドバリデーションのように非同期にバリデーションする必要がある場合は便利です。
@hypermkt
hypermkt May 18, 2016 Contributor

oh, It sounds natural! Thanks for the comment!

@hypermkt
Contributor

Glad to back to stable. Why did it failed suddenly? hmm.

@kazupon
Owner
kazupon commented May 27, 2016

Oh great!!
LGTM 👍

@hypermkt hypermkt changed the title from [WIP] Add Japanese translated document. to Add Japanese translated document. May 28, 2016
@hypermkt
Contributor
hypermkt commented May 28, 2016 edited

@kazupon
I have finished translating! Could you review?

@kazupon kazupon merged commit a54f11f into kazupon:dev May 28, 2016

1 check passed

ci/circleci Your tests passed on CircleCI!
Details
@kazupon
Owner
kazupon commented May 29, 2016

published japanese translation docs
http://vuejs.github.io/vue-validator/ja/index.html

@hypermkt
Contributor

Ohhhh! It's released finally! Thank you!

@hypermkt hypermkt deleted the hypermkt:add-japanese-document branch May 30, 2016
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment