LIL-87 - Улучшение формы входа/регистрации

project/templates/lilcity/index.html

@@ -231,7 +231,7 @@
                       <div id="learner-auth-field-error__password"
                            class="field__error learner-auth-form__field-error"></div>
 
-                      <div id="learner-auth-field-error__all" class="learner-auth-form__field-error"></div>
+                      <div id="learner-auth-field-error__all" class="form__common-error learner-auth-form__field-error"></div>
                     </div>
                     <div class="auth__foot">
                       <button class="auth__btn btn btn_light" tabindex="3">ВОЙТИ</button>
@@ -284,7 +284,7 @@
                          class="field__error learner-registration-form__field-error"></div>
 
                     <div id="learner-registration-field-error__all"
-                         class="learner-registration-form__field-error"></div>
+                         class="form__common-error learner-registration-form__field-error"></div>
                   </div>
                   <div class="auth__foot">
                     <button id="learner-registration-form__submit-button" class="auth__btn btn btn_light">
@@ -318,7 +318,7 @@
                       <div id="password-reset-field-error__email"
                            class="field__error password-reset-form__field-error"></div>
                       <div id="password-reset-field-error__all"
-                           class="password-reset-form__field-error"></div>
+                           class="form__common-error password-reset-form__field-error"></div>
                     </div>
                     <div class="auth__foot">
                       <button class="auth__btn btn btn_light">ОТПРАВИТЬ</button>

web/build/js/app.js

@@ -10873,6 +10873,8 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
             return;
         }
 
+        (0, _jquery2.default)('.form__common-error').hide();
+
         _jquery2.default.ajax(passwordResetForm.attr('action'), {
             method: 'POST',
             data: passwordResetForm.serialize()
@@ -10891,7 +10893,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
                         }
                         var errorMessage = xhr.responseJSON.errors[errorField][0].message;
                         if (errorField === '__all__') {
-                            (0, _jquery2.default)('#password-reset-field-error__all').text(errorMessage);
+                            (0, _jquery2.default)('#password-reset-field-error__all').text(errorMessage).show();
                         } else {
                             (0, _jquery2.default)('#password-reset-field-error__' + errorField).text(errorMessage);
                             (0, _jquery2.default)('#password-reset__' + errorField + '-field').addClass('error');
@@ -10912,14 +10914,15 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
         var authAllowed = true;
         (0, _jquery2.default)('.learner-auth-form__field').removeClass('error');
         (0, _jquery2.default)('.learner-auth-form__field-error').text('');
+        (0, _jquery2.default)('.form__common-error').hide();
 
         var emailValue = (0, _jquery2.default)('#learner-auth-form__email').val();
         if ((0, _isEmpty2.default)(emailValue)) {
-            (0, _jquery2.default)('#learner-auth-field__email').addClass('error');
+            (0, _jquery2.default)('#learner-auth-field__username').addClass('error');
             (0, _jquery2.default)('#learner-auth-field-error__username').text('Укажите почту');
             authAllowed = false;
         } else if (!(0, _isEmail2.default)(emailValue)) {
-            (0, _jquery2.default)('#learner-auth-field__email').addClass('error');
+            (0, _jquery2.default)('#learner-auth-field__username').addClass('error');
             (0, _jquery2.default)('#learner-auth-field-error__username').text('Похоже, вы допустили ошибку в почте');
             authAllowed = false;
         }
@@ -10939,8 +10942,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
             data: authForm.serialize()
         }).done(function (data) {
             if (data.success === true) {
-                alert("DEV - Успешный вход");
+                location.reload();
-                // TODO: Куда редиректить пользователя?
             }
         }).fail(function (xhr) {
             console.log('error', xhr);
@@ -10952,7 +10954,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
                         }
                         var errorMessage = xhr.responseJSON.errors[errorField][0].message;
                         if (errorField === '__all__') {
-                            (0, _jquery2.default)('#learner-auth-field-error__all').text(errorMessage);
+                            (0, _jquery2.default)('#learner-auth-field-error__all').text(errorMessage).show();
                         } else {
                             (0, _jquery2.default)('#learner-auth-field-error__' + errorField).text(errorMessage);
                             (0, _jquery2.default)('#learner-auth-field__' + errorField).addClass('error');
@@ -11007,13 +11009,14 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
             return;
         }
 
+        (0, _jquery2.default)('.form__common-error').hide();
+
         _jquery2.default.ajax(registrationForm.attr('action'), {
             method: 'POST',
             data: registrationForm.serialize()
         }).done(function (data) {
             if (data.success === true) {
-                alert("DEV - Успешная регистрация");
+                location.reload();
-                // TODO: Куда редиректить пользователя?
             }
         }).fail(function (xhr) {
             console.log('error', xhr);
@@ -11025,7 +11028,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
                         }
                         var errorMessage = xhr.responseJSON.errors[errorField][0].message;
                         if (errorField === '__all__') {
-                            (0, _jquery2.default)('#learner-registration-field-error__all').text(errorMessage);
+                            (0, _jquery2.default)('#learner-registration-field-error__all').text(errorMessage).show();
                         } else {
                             (0, _jquery2.default)('#learner-registration-field-error__' + errorField).text(errorMessage);
                             (0, _jquery2.default)('#learner-registration-field__' + errorField).addClass('error');

web/gulp/config.js

@@ -31,7 +31,6 @@ var config = {
         root : destPath,
         html : destPath,
         css  : destPath + '/css',
-        js   : destPath + '/js',
         img  : destPath + '/img',
         fonts: destPath + '/css/fonts',
         lib  : destPath + '/lib'

web/gulp/tasks/build.js

@@ -9,7 +9,6 @@ function build(cb) {
         'svgo',
         'sass',
         'pug',
-        'js',
         'copy',
         cb
     );

web/gulp/tasks/js.js

@@ -8,13 +8,13 @@ reload = browserSync.reload;
 
 
 gulp.task('js', function () {
-    gulp.src(config.src.js+'/**/*.js')
+    /*gulp.src(config.src.js+'/!**!/!*.js')
         .pipe(include())
         // .on('error', function(){notify("Javascript include error");})
         //.pipe(uglify())
         .pipe(babel())
         .pipe(gulp.dest(config.dest.js+'/'))
-        .pipe(reload({stream: true}));
+        .pipe(reload({stream: true}));*/
 });
 
 gulp.task('js:watch', function() {

web/src/js/modules/auth.js

@@ -66,6 +66,8 @@ $(document).ready(function () {
             return;
         }
 
+        $('.form__common-error').hide();
+
         $.ajax(passwordResetForm.attr('action'), {
             method: 'POST',
             data: passwordResetForm.serialize(),
@@ -86,7 +88,7 @@ $(document).ready(function () {
                             }
                             const errorMessage = xhr.responseJSON.errors[errorField][0].message;
                             if (errorField === '__all__') {
-                                $('#password-reset-field-error__all').text(errorMessage);
+                                $('#password-reset-field-error__all').text(errorMessage).show();
                             } else {
                                 $(`#password-reset-field-error__${errorField}`).text(errorMessage);
                                 $(`#password-reset__${errorField}-field`).addClass('error');
@@ -107,14 +109,15 @@ $(document).ready(function () {
         let authAllowed = true;
         $('.learner-auth-form__field').removeClass('error');
         $('.learner-auth-form__field-error').text('');
+        $('.form__common-error').hide();
 
         const emailValue = $('#learner-auth-form__email').val();
         if (isEmpty(emailValue)) {
-            $('#learner-auth-field__email').addClass('error');
+            $('#learner-auth-field__username').addClass('error');
             $('#learner-auth-field-error__username').text('Укажите почту');
             authAllowed = false;
         } else if (!isEmail(emailValue)) {
-            $('#learner-auth-field__email').addClass('error');
+            $('#learner-auth-field__username').addClass('error');
             $('#learner-auth-field-error__username').text('Похоже, вы допустили ошибку в почте');
             authAllowed = false;
         }
@@ -135,8 +138,7 @@ $(document).ready(function () {
         })
             .done(function (data) {
                 if (data.success === true) {
-                    alert("DEV - Успешный вход");
+                    location.reload();
-                    // TODO: Куда редиректить пользователя?
                 }
             })
             .fail(function (xhr) {
@@ -149,7 +151,7 @@ $(document).ready(function () {
                             }
                             const errorMessage = xhr.responseJSON.errors[errorField][0].message;
                             if (errorField === '__all__') {
-                                $('#learner-auth-field-error__all').text(errorMessage);
+                                $('#learner-auth-field-error__all').text(errorMessage).show();
                             } else {
                                 $(`#learner-auth-field-error__${errorField}`).text(errorMessage);
                                 $(`#learner-auth-field__${errorField}`).addClass('error');
@@ -204,14 +206,15 @@ $(document).ready(function () {
             return;
         }
 
+        $('.form__common-error').hide();
+
         $.ajax(registrationForm.attr('action'), {
             method: 'POST',
             data: registrationForm.serialize(),
         })
             .done(function (data) {
                 if (data.success === true) {
-                    alert("DEV - Успешная регистрация");
+                    location.reload();
-                    // TODO: Куда редиректить пользователя?
                 }
             })
             .fail(function (xhr) {
@@ -224,7 +227,7 @@ $(document).ready(function () {
                             }
                             const errorMessage = xhr.responseJSON.errors[errorField][0].message;
                             if (errorField === '__all__') {
-                                $('#learner-registration-field-error__all').text(errorMessage);
+                                $('#learner-registration-field-error__all').text(errorMessage).show();
                             } else {
                                 $(`#learner-registration-field-error__${errorField}`).text(errorMessage);
                                 $(`#learner-registration-field__${errorField}`).addClass('error');

web/src/sass/_common.sass

@@ -3123,6 +3123,14 @@ a.btn
         background: $bg 
         color: $pink 
 
+.form__common-error
+  margin-top: 15px
+  font-size: 14px
+  background: $pink
+  color: #fff
+  padding: 10px
+  display: none
+
 .mobile-hide
   +m
     display: none

web/src/sass/app.sass

@@ -1,5 +1,5 @@
 // done by arturmoroz.com
 @import helpers/all
 @import generated/sprite-svg
-@import lib/owl.carousel
+// @import lib/owl.carousel
 @import common