Skip to content
This repository was archived by the owner on May 13, 2018. It is now read-only.

Commit 20941dc

Browse files
committed
ダイアログ追加
1 parent 9771250 commit 20941dc

6 files changed

Lines changed: 97 additions & 12 deletions

File tree

libraries/common/common.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -102,4 +102,8 @@ A.profilePhoto.mdc-tab {
102102

103103
.mdc-text-field > Textarea {
104104
Resize: None;
105+
}
106+
107+
.mdc-dialog .mdc-dialog__body > .mdc-text-field {
108+
Width: 100%;
105109
}

libraries/common/common.js

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,33 @@ window.addEventListener("DOMContentLoaded", () => {
6565
["mdc-typography", "mdc-typography--body1", "mdc-elevation--z5", "mdc-toolbar-fixed-adjust"].forEach(className => elem.classList.add(className));
6666
});
6767

68+
new DOM('@Aside.mdc-dialog').forEach(dialog => {
69+
if (dialog.querySelector('Button.mdc-dialog__action')) {
70+
dialog.addEventListener("keydown", (event) => {
71+
if (event.ctrlKey && event.keyCode == 13) dialog.querySelector('Button.mdc-dialog__action').click();
72+
});
73+
}
74+
75+
dialog.querySelectorAll('*[Required]').forEach(input => {
76+
input.addEventListener("input", () => {
77+
let result = true;
78+
79+
dialog.querySelectorAll('*[Required]').forEach(requiredField => {
80+
if (requiredField.value.replace(/\s/g, "").length == 0) {
81+
result = false;
82+
return;
83+
}
84+
});
85+
86+
if (result) {
87+
dialog.querySelector('Button.mdc-dialog__action').removeAttribute("disabled");
88+
} else {
89+
dialog.querySelector('Button.mdc-dialog__action').setAttribute("disabled", "");
90+
}
91+
});
92+
});
93+
})
94+
6895

6996

7097
terminal.addEventListener("message", event => {

locales/en_US.json

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,6 @@
1313

1414
"dialog.account.createNotify": ["Your account has been created.", "Welcome to Simple Thread!!"],
1515
"dialog.account.deleteNotify": "Your account has been deleted.",
16-
"dialog.profile.changeNotify": "Your profile has been changed.",
17-
"dialog.profile.deleteConfirmer": ["Are you sure of deleting your account?", "You must enter your e-mail to delete account."],
18-
"dialog.profile.deleteConfirmer.email": "E-mail...*",
19-
"dialog.profile.deleteConfirmer.email-error": "Invalid E-mail",
2016
"dialog.profile.infoViewer.link": "Link",
2117
"dialog.thread.editNotify": "Info of the thread has been changed.",
2218
"dialog.thread.deleteNotify": "The thread has been deleted.",
@@ -65,5 +61,9 @@
6561
"profile.url.title": "Title",
6662
"profile.url.value": "URL",
6763
"profile.save": "Save the changes",
68-
"profile.delete": "Delete your account"
64+
"profile.delete": "Delete your account",
65+
"profile.changeNotify": "Your profile has been changed.",
66+
"profile.deleteConfirmer": ["Are you sure of deleting your account?", "You must enter your e-mail to delete account."],
67+
"profile.deleteConfirmer.email": "E-mail...",
68+
"profile.deleteConfirmer.email-error": "Invalid E-mail"
6969
}

locales/ja_JP.json

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,6 @@
1313

1414
"dialog.account.createNotify": ["アカウントを作成しました。", "Simple Threadにようこそ!!"],
1515
"dialog.account.deleteNotify": "アカウントを削除しました。",
16-
"dialog.profile.changeNotify": "プロフィールが変更されました。",
17-
"dialog.profile.deleteConfirmer": ["本当にアカウントを削除しますか?", "処理を続行するにはメールアドレスを入力してください。"],
18-
"dialog.profile.deleteConfirmer.email": "メールアドレス...*",
19-
"dialog.profile.deleteConfirmer.email-error": "無効なメールアドレスです",
2016
"dialog.profile.infoViewer.link": "リンク",
2117
"dialog.thread.editNotify": "スレッド情報が編集されました。",
2218
"dialog.thread.deleteNotify": "スレッドが削除されました。",
@@ -65,5 +61,9 @@
6561
"profile.url.title": "タイトル",
6662
"profile.url.value": "URL",
6763
"profile.save": "変更を保存",
68-
"profile.delete": "アカウントを削除"
64+
"profile.delete": "アカウントを削除",
65+
"profile.changeNotify": "プロフィールが変更されました。",
66+
"profile.deleteConfirmer": ["本当にアカウントを削除しますか?", "処理を続行するにはメールアドレスを入力してください。"],
67+
"profile.deleteConfirmer.email": "メールアドレス...",
68+
"profile.deleteConfirmer.email-error": "無効なメールアドレスです"
6969
}

profile/index.html

Lines changed: 43 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323

2424
<Div ID = "Profile-Info">
2525
<Div Class = "mdc-text-field">
26-
<Input ID = "Profile-Info-Name" Type = "Text" Class = "mdc-text-field__input">
26+
<Input ID = "Profile-Info-Name" Class = "mdc-text-field__input" Type = "Text" />
2727
<Label Class = "mdc-text-field__label" For = "Profile-Info-Name" Data-Locales = "profile.name">ユーザー名...</Label>
2828
<Div Class = "mdc-text-field__bottom-line"></Div>
2929
</Div>
@@ -34,9 +34,50 @@
3434
</Div>
3535

3636
<Div>
37-
37+
<Button ID = "Profile-Save" Class = "mdc-button mdc-button--raised" Data-Locales = "profile.save">変更を保存</Button>
38+
<Button ID = "Profile-Delete" Class = "mdc-button mdc-button--raised mdc-theme--secondary-bg" Data-Locales = "profile.delete">アカウントを削除</Button>
3839
</Div>
3940
</Div>
4041
</Main>
42+
43+
<Aside ID = "ChangeNotify" Class = "mdc-dialog" Role = "AlertDialog">
44+
<Div Class = "mdc-dialog__surface">
45+
<Section Class = "mdc-dialog__body" Data-Locales = "profile.changeNotify">
46+
プロフィールが変更されました。
47+
</Section>
48+
49+
<Footer Class = "mdc-dialog__footer">
50+
<Button Class = "mdc-button mdc-dialog__action mdc-dialog__footer__button mdc-dialog__footer__button--accept" Data-Locales = "common.dialog_close">閉じる</Button>
51+
</Footer>
52+
</Div>
53+
54+
<Div Class = "mdc-dialog__backdrop"></Div>
55+
</Aside>
56+
57+
<Aside ID = "DeleteConfirmer" Class = "mdc-dialog" Role = "AlertDialog">
58+
<Div Class = "mdc-dialog__surface">
59+
<Section Class = "mdc-dialog__body">
60+
<Div Data-Locales = "profile.deleteConfirmer">
61+
本当にアカウントを削除しますか?
62+
処理を続行するにはメールアドレスを入力してください。
63+
</Div>
64+
65+
<Div Class = "mdc-text-field">
66+
<Input ID = "DeleteConfirmer-Email" Class = "mdc-text-field__input" Type = "Email" Required = "Required" Aria-Controls = "DeleteConfirmer-Email--Valid" />
67+
<Label Class = "mdc-text-field__label" Data-Locales = "profile.deleteConfirmer.email">メールアドレス...</Label>
68+
<Div Class = "mdc-text-field__bottom-line"></Div>
69+
</Div>
70+
71+
<P ID = "DeleteConfirmer-Email--Valid" Class = "mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg" Data-Locales = "profile.deleteConfirmer.email-error">無効なメールアドレスです</P>
72+
</Section>
73+
74+
<Footer Class = "mdc-dialog__footer">
75+
<Button Class = "mdc-button mdc-dialog__action mdc-dialog__footer__button mdc-dialog__footer__button--accept" Data-Locales = "common.dialog_yes">はい</Button>
76+
<Button Class = "mdc-button mdc-dialog__footer__button mdc-dialog__footer__button--cancel" Data-Locales = "common.dialog_no">いいえ</Button>
77+
</Footer>
78+
</Div>
79+
80+
<Div Class = "mdc-dialog__backdrop"></Div>
81+
</Aside>
4182
</Body>
4283
</HTML>

profile/profile.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,4 +12,17 @@ terminal.addEventListener("message", event => {
1212

1313
window.addEventListener("DOMContentLoaded", () => {
1414
new DOM("@.mdc-text-field").forEach(textField => new mdc.textField.MDCTextField(textField));
15+
16+
new DOM("#Profile-Save").addEventListener("click", () => {
17+
base.Database.update("users/" + base.user.uid, {
18+
userName: new DOM("#Profile-Info-Name").value,
19+
detail: new DOM("#Profile-Info-Detail").value
20+
});
21+
22+
new mdc.dialog.MDCDialog(new DOM("#ChangeNotify")).show();
23+
});
24+
25+
new DOM("#Profile-Delete").addEventListener("click", () => {
26+
new mdc.dialog.MDCDialog(new DOM("#DeleteConfirmer")).show();
27+
})
1528
});

0 commit comments

Comments
 (0)