https://owners-interior.com/wp/wp-content/plugins/members-registration/assets/js/member.js?ver=7.1.2

1/**
2 * @class
3 * @desc 会員画面の動作
4 *
5 */
6function Member() {
7  this.formName = document.querySelector(".name");
8  this.formTel = document.querySelector(".tel");
9  this.formMail = document.querySelector(".mail");
10  this.formPass = document.querySelector(".password");
11  this.formMagazine = document.querySelectorAll(".magazine");
12  this.formPostalCode = document.querySelector(".postalCode");
13  this.formAddress = document.querySelector(".address");
14  this.formPref = document.querySelector(".pref");
15  this.formDetail = document.querySelector(".detail");
16  this.formType = document.querySelector(".type");
17  this.formLayout = document.querySelector(".layout");
18  this.formArea = document.querySelector(".area");
19  this.formPark = document.querySelectorAll(".park");
20  this.formNote = document.querySelector(".note");
21  this.formID = document.querySelector(".js-userID");
22  this.duplicateEmail;
23}
24
25/**
26 * @method
27 * @desc フォームの入力画面に関する動作
28 *
29 */
30Member.prototype.createConfirm = function() {
31  var formPassConf = document.querySelector(".conf");
32  var confirmBtn = document.querySelector(".js-createConfirm");
33  var createPanel = document.querySelector(".js-createPanel");
34  var editPanel = document.querySelector(".js-editPanel");
35  var createBtn = document.querySelector(".js-createBtn");
36  var inputPanel = createPanel || editPanel;
37  var confirmWrap = document.querySelector(".js-confirmPanel");
38  var returnCreatePanel = document.querySelector(".js-returnCreatePanel");
39  var _that = this;
40  var maxPasswordLength = 8;
41  var addressPattern = /^[A-Za-z0-9]{1}[A-Za-z0-9_.-]*@{1}[A-Za-z0-9_.-]+.[A-Za-z0-9]+$/;
42  var passwordPattern = /^(?=.*[a-z])(?=.*[0-9])([a-zA-Z0-9]{8,})$/i;
43
44  // 確認画面切り替えの動作
45  confirmBtn.addEventListener("click", function() {
46    // validation
47    if (_that.formName) {
48      if (_that.formPass) {
49        if (_that.formName.value === "" || _that.formTel.value === "" || _that.formMail.value === "" || _that.formPass.value === "" || _that.formPostalCode.value === "" ||  _that.formAddress.value === "") {
50          alert("未入力の項目が存在します");
51          return false;
52        }
53      } else {
54        if (_that.formName.value === "" || _that.formTel.value === "" || _that.formMail.value === "" || _that.formAddress.value === "" || _that.formPostalCode.value === "") {
55          alert("未入力の項目が存在します");
56          return false;
57        }
58      }
59
60      if (!addressPattern.test(_that.formMail.value)) {
61        alert("メールアドレスの形式が不正です");
62        return false;
63      }
64
65      if (_that.duplicateEmail) {
66        alert("既に登録されているメールアドレスです");
67        return false;
68      }
69
70      if (_that.formPass) {
71        if (_that.formPass.value !== formPassConf.value) {
72          alert("パスワードとパスワード確認が一致しません");
73          return false;
74        }
75
76        if (_that.formPass.value.length < maxPasswordLength || formPassConf.value.length < maxPasswordLength) {
77          alert("パスワードは8文字以上で入力してください");
78          return false;
79        }
80
81        if (!passwordPattern.test(_that.formPass.value)) {
82          alert("パスワードは半角英数字8文字以上で入力してください");
83          return false;
84        }
85      }
86    }
87
88    _that.insertConfirmForm();
89
90    createBtn.disabled = false;
91    inputPanel.style.display = "none"
92    confirmWrap.style.display = "block";
93  }, false);
94
95  // 確認画面から登録画面切り替え
96  returnCreatePanel.addEventListener("click", function() {
97    createBtn.disabled = true;
98    inputPanel.style.display = "block";
99    confirmWrap.style.display = "none";
100  }, false);
101
102  // パスワード確認時の処理
103  if(formPassConf) {
104    conf.addEventListener("blur", function() {
105      if (_that.formPass.value !== this.value) alert("パスワードが一致しません");
106    })
107  }
108}
109
110/**
111 * @method
112 * @desc 確認画面にデータを受け渡し
113 *
114 */
115Member.prototype.insertConfirmForm = function() {
116  var confirmName = document.querySelector(".js-confirmName");
117  var confirmTel = document.querySelector(".js-confirmTel");
118  var confirmMail = document.querySelector(".js-confirmMail");
119  var confirmMagazine = document.querySelector(".js-confirmMagazine");
120  var confirmPostalCode = document.querySelector(".js-confirmPostalCode");
121  var confirmAddress = document.querySelector(".js-confirmAddress");
122  var confirmPref = document.querySelector(".js-confirmPref");
123  var confirmDetail = document.querySelector(".js-confirmDetail");
124  var confirmType = document.querySelector(".js-confirmType");
125  var confirmLayout = document.querySelector(".js-confirmLayout");
126  var confirmArea = document.querySelector(".js-confirmArea");
127  var confirmPark = document.querySelector(".js-confirmPark");
128  var confirmNote = document.querySelector(".js-confirmNote");
129
130  if (this.formPref !== null || this.formDetail !== null || this.formType !== null || this.formLayout !== null || this.formArea !== null || this.formPark.length !== 0) {
131    var detailData = this.formDetail.value !== "" ? this.formDetail.value : "未入力";
132    var layoutData = this.formLayout.value !== "" ? this.formLayout.value : "未入力";
133    var areaData = this.formArea.value !== "" ? this.formArea.value : "未入力";
134    var noteData = this.formNote.value !== "" ? this.formNote.value : "未入力"
135    var magazineData;
136    var parkData = "未選択";
137
138    for (var j = 0; j < this.formPark.length; j++) {
139      if (this.formPark[j].checked) parkData = this.formPark[j].value;
140    }
141
142    confirmPref.innerHTML = this.formPref.value;
143    confirmDetail.innerHTML = detailData;
144    confirmType.innerHTML = this.formType.value;
145    confirmLayout.innerHTML = layoutData;
146    confirmArea.innerHTML = areaData;
147    confirmPark.innerHTML = parkData;
148    confirmNote.innerHTML = noteData;
149  }
150
151  if (this.formName) {
152    for (var i = 0; i < this.formMagazine.length; i++) {
153      if (this.formMagazine[i].checked) magazineData = this.formMagazine[i].value;
154    }
155
156    confirmName.innerHTML = this.formName.value;
157    confirmTel.innerHTML = this.formTel.value;
158    confirmMail.innerHTML = this.formMail.value;
159    confirmMagazine.innerHTML = magazineData;
160    confirmPostalCode.innerHTML = this.formPostalCode.value;
161    confirmAddress.innerHTML = this.formAddress.value;
162  }
163}
164
165/**
166 * @method
167 * @desc ログインしているかどうかの判定
168 *
169 */
170Member.prototype.getLogInCookie = function() {
171  var initCookie = document.cookie;
172  var siteCookies = initCookie.split(";");
173  for (var i = 0; i < siteCookies.length; i++) {
174    if (siteCookies[i].match(/member/)) return true;
175  }
176}
177
178/**
179 * @method
180 * @desc ログアウト時にcookie削除
181 *
182 */
183Member.prototype.transitionLogOut = function() {
184  var logOutLink = document.querySelectorAll(".logout");
185  var resetDate = new Date('2000-12-31T23:59:59Z');
186  for (var i = 0; i < logOutLink.length; i++) {
187    logOutLink[i].addEventListener("click", function() {
188      document.cookie = "member=; path=/; expires=" + resetDate.toGMTString();
189      document.cookie = "u_id=; path=/; expires=" + resetDate.toGMTString();
190    }, false)
191  }
192}
193
194/**
195 * @method
196 * @desc ログイン時に各メニューをハンドリング
197 *
198 */
199Member.prototype.handleMemberInfo = function() {
200  var siteHeaderList = document.querySelectorAll("header ul.menu > li");
201  // var siteFooterList = document.querySelectorAll("footer ul > li");
202  var mobileHeaerList = document.querySelectorAll(".vk-mobile-nav ul.menu > li");
203
204
205  this.changeNavMenu(siteHeaderList, "header");
206  // this.changeNavMenu(siteFooterList, "footer");
207  this.changeNavMenu(mobileHeaerList, "mobile");
208}
209
210/**
211 * @method
212 * @desc ログイン時にハンドリングしたメニューの差し替え
213 *
214 */
215Member.prototype.changeNavMenu = function(element, position) {
216  var envPath = this.checkLocationPath();
217
218  for (var i = 0; i < element.length; i++) {
219    var currentHeaderList = element[i];
220    var menuElement = currentHeaderList.querySelector("a");
221    var switchMenuElement = position === "header" ?
222      currentHeaderList.querySelector("strong") :
223      menuElement;
224
225    if (switchMenuElement.innerHTML === "会員登録") {
226      var myPageLinkUrl = menuElement.getAttribute("href").replace("create/", "");
227      menuElement.setAttribute("href", myPageLinkUrl);
228      switchMenuElement.innerHTML = "会員ページ";
229    } else if (switchMenuElement.innerHTML === "ログイン") {
230      menuElement.setAttribute("href", envPath + "/");
231      menuElement.setAttribute("class", "logout");
232      switchMenuElement.innerHTML = "ログアウト";
233      if (position === "header") currentHeaderList.querySelector("span").innerHTML = "LOGOUT";
234    }
235  }
236}
237
238/**
239 * @method
240 * @desc メールアドレス入力の検知
241 *
242 */
243Member.prototype.searchDuplicateEmail = function() {
244  _that = this;
245  if (this.formMail) {
246    this.formMail.addEventListener("change", function() {
247      _that.checkDuplicateEmail(this.value)
248    });
249  }
250}
251
252/**
253 * @method
254 * @desc メールアドレス入力時の重複チェック
255 *
256 * @params {String} address - フォーム入力のメールアドレス
257 */
258Member.prototype.checkDuplicateEmail = function(address) {
259  _that = this;
260  var request = new XMLHttpRequest();
261  request.onreadystatechange = function() {
262    if (request.readyState === 4){
263      if ((200 <= request.status && request.status < 300)){
264        _that.handleDuplicateEmail(request.response);
265      } else {
266        console.log("error");
267      }
268    }
269  }
270
271  var envPath = this.checkLocationPath();
272
273  request.open("POST", envPath + "/wp/wp-admin/admin-ajax.php", false);
274  request.setRequestHeader("content-type", "application/x-www-form-urlencoded ; charset=UTF-8");
275  request.send("action=checkAddressAjax&address=" + address);
276}
277
278/**
279 * @method
280 * @desc 重複判定処理
281 *
282 * @param {number} result - 重複がある場合はuserのIDを返す
283 *
284 */
285Member.prototype.handleDuplicateEmail = function(result) {
286  if (result !== "") { // 新規の場合はIDがあるかないかの判定で問題なし
287    this.duplicateEmail = true;
288    if (this.formID && result === this.formID.value) this.duplicateEmail = false; // 既存の場合は現在のIDと返されるIDが同じの場合はfalseを渡す
289  } else {
290    this.duplicateEmail = false;

291  }
292}
293
294/**
295 * @method
296 * @desc 環境によるパスを設定
297 *
298 * @return {String} - 環境による追加パス
299 */
300Member.prototype.checkLocationPath = function() {
301  var locationPath = location.pathname;
302  var devPath = /^\/kdev\//;
303  var envSearch = locationPath.search(devPath);
304  return envSearch === 0 ? "/kdev" : "";
305}
306
307window.addEventListener("load", function() {
308  var member = new Member()
309  if (member.getLogInCookie()) {
310    member.handleMemberInfo();
311    member.transitionLogOut();
312  }
313  if (document.querySelector(".js-createPanel") || document.querySelector(".js-editPanel")) {
314    member.createConfirm();
315    member.searchDuplicateEmail();
316  }
317}, false);