expo-33 date validation on period modal window

templates/client/accounts/feed.html

@@ -74,15 +74,16 @@
         </form>
     </div>
 
+    </div>
+
     {% include 'includes/exposition/exposition_list.html' with object_list=object_list %}
 
     {% include 'includes/catalog_paginator.html' with page_obj=page_obj %}
-{% endblock %}
-{% block scripts %}
-        <script src="{% static 'client/js' %}{% if debug %}/{% else %}_min/{% endif %}_modules/page.events.feed{% if debug %}{% else %}.min{% endif %}.js"></script>
-        <!--<script src="{% static 'client/js/_modules/block.search.js' %}"></script>-->
 
-        <script>
+<script src="{% static 'client/js' %}{% if debug %}/{% else %}_min/{% endif %}_modules/page.events.feed{% if debug %}{% else %}.min{% endif %}.js"></script>
+<!--<script src="{% static 'client/js/_modules/block.search.js' %}"></script>-->
+
+<script>
     EXPO.events.feed.init({
         bodyId:'events-filter-wrap',
         formId: 'filter-block-form',
@@ -94,14 +95,14 @@
         applyButtonId:'apply-filter-button',
         place:{
             id:'filter-pwPlace',
-                   /**/ selectedItemTemplate:'filter-csb-selected',
+            selectedItemTemplate:'filter-csb-selected',
             ajaxUrl:'http://{{ request.get_host }}/search-form/',
             autoCompleteUrl:'http://{{ request.get_host }}/search-form/autocomplete/',
             getParentUrl:'http://{{ request.get_host }}/search-form/get-parent/',
-                    /**/autoCompleteId:'filter-place-complete-block',
+            autoCompleteId:'filter-place-complete-block',
-                    /**/filterInputId:'filter-place-filter-input',
+            filterInputId:'filter-place-filter-input',
             modalTrigger:'filter-place-modal-trigger',
-                    /**/selectedItemsContainer:'filter-csb-selected-items',
+            selectedItemsContainer:'filter-csb-selected-items',
             clearAllButtonClass:'clear-all-button',
             applyBtnClass:'modal-approve',
             tagsBoxId:'filter-places-tags',
@@ -117,15 +118,15 @@
         },
         subject:{
             id:'filter-pwSubj',
-                    /**/selectedItemTemplate:'filter-subj-selected',
+            selectedItemTemplate:'filter-subj-selected',
-                    /**/autoCompleteId:'filter-subj-complete-block',
+            autoCompleteId:'filter-subj-complete-block',
             ajaxUrl:'http://{{ request.get_host }}/search-form/',
             autoCompleteUrl:'http://{{ request.get_host }}/search-form/autocomplete/',
-                    /**/filterInputId:'filter-subj-fliter-input',
+            filterInputId:'filter-subj-fliter-input',
             modalTrigger:'fiter-subj-modal-trigger',
             getParentUrl:'http://{{ request.get_host }}/search-form/get-parent/',
-                    /**/selectedItemsContainer:'filter-csb-subj-selected-items',
+            selectedItemsContainer:'filter-csb-subj-selected-items',
-                    /**/subjectTriggerWrapId:'filter-subj-checks',
+            subjectTriggerWrapId:'filter-subj-checks',
             //switched by default
             defaultOn:['f-s-exhibition-check','f-s-conference-check'],
             clearAllButtonClass:'clear-all-button',
@@ -163,5 +164,8 @@
 
         }
     });
-        </script>
+</script>
+
 {% endblock %}
+
+

templates/client/popups/period.html

@@ -7,11 +7,11 @@
     <div class="pw-body clearfix">
         <div class="pw-form search_form" >
             <div class="pwf-line period">
-                <div class="pwf-field">
+                <div class="pwf-field ">
                     <label for="dateFrom">{% trans 'с' %}</label>
                     {{ search_form.fr }}
                 </div>
-                <div class="pwf-field">
+                <div class="pwf-field ">
                     <label for="dateTo">{% trans 'по' %}</label>
                     {{ search_form.to }}
                 </div>

templates/client/static_client/css/main.css

@@ -11112,18 +11112,9 @@ hr + .rq-note {
 
 @media only screen and (min-width: 1260px) {
 
-	/*.page-wrap > header .logo,
-	.page-wrap .layout .layout-wrap aside {
-		width: 21%;
-	}
-
-	.page-wrap .layout.mp-announces .layout-wrap .mcl {
-		width: 73.1%;
-	}*/
 
 	.header-body .header-top {
-		padding-right: 510
+		padding-right: 510px;
-		px;
 	}
 
 	.header-body .header-top .ht-main {
@@ -11608,7 +11599,7 @@ hr + .rq-note {
 
 
 .map_info_block { width: 100%;font-family: 'dindisplay_pro', sans-serif;}
-.map_info_block tr th { text-align: left; vertical-align: top; width: 15%; font-weight: 500px; color: #a2a2a2; font-size: 14px; padding: 9px 0 0 0;}
+.map_info_block tr th { text-align: left; vertical-align: top; width: 15%; font-weight: 500; color: #a2a2a2; font-size: 14px; padding: 9px 0 0 0;}
 .map_info_block tr td { text-align: left; vertical-align: top; border-bottom: 1px dotted #ccc; padding: 8px 0; font-size: 16px; color: #424242; font-weight: 500;}
 .map_info_block tr td.width_1 { width: 35%;}
 .map_info_block tr td p { padding: 1px 0; margin: 0 0 0 0;}
@@ -12128,8 +12119,6 @@ hr + .rq-note {
 		color: #ff6600;
 	}
 		.events-filter .col{
-			/*width: 48%;*/
-			/*float: left;*/
 			margin-left: 2%;
 			-moz-box-sizing: border-box;
 			box-sizing: border-box;
@@ -12258,6 +12247,11 @@ hr + .rq-note {
 	.in-search-form .clear-all-button:active, .search-form-wrap .clear-all-button:active{
 		background-position: -385px  -89px;
 	}
+	.in-search-form .pw-period .pwf-field.err input{
+		border-width: 2px;
+		border-color: #D80000;
+	}
+
 /******************************\
 # form validation
 \******************************/

templates/client/static_client/js/_modules/block.search.js

@@ -1626,6 +1626,12 @@ if (EXPO.searchBlock){
 						thatVal,
 						thatValInt,
 						bfr;
+
+					/**
+					 * check if it is a valid date
+					 */
+					if (self.validate()){
+						$(it).parent('.pwf-field').removeClass('err');
 						if(itId == self.opt.dateFrom){
 							thatId = $dateTo[0].getAttribute('id');
 							thatVal = $dateTo[0].value;
@@ -1634,6 +1640,9 @@ if (EXPO.searchBlock){
 							thatVal = $dateFrom[0].value;
 						}
 						thatValInt = Date.parse(thatVal);
+						/**
+						 * swap values between date fields
+						 */
 						if(thatValInt > itValInt &&  thatValInt != 0 && thatValInt){
 							bfr = document.getElementById(itId).value;
 							document.getElementById(itId).value = document.getElementById(thatId).value;
@@ -1643,7 +1652,7 @@ if (EXPO.searchBlock){
 							document.getElementById(thatId).value = document.getElementById(itId).value;
 							document.getElementById(itId).value = bfr;
 						}
-
+					}
 
 				};
 			this.$dateFrom = $dateFrom;
@@ -1711,6 +1720,37 @@ if (EXPO.searchBlock){
 				this.$dateTo.val('');
 				this.$modalTrigger.text(this.$modalTrigger.attr('data-default'));
 
+			},
+			/**
+			 * checks input fields to have valid date values, if not - adds err class to its container
+			 * @returns {boolean}
+			 */
+			validate: function () {
+				var	toVal = this.$dateTo.val(),
+					fromVal = this.$dateFrom.val(),
+					toValArr = toVal.split('.'),
+					fromValArr = fromVal.split('.'),
+					timestamps =[],
+					validationResult = true;
+				timestamps[0] = Date.parse(toValArr[1]+'.'+toValArr[0]+'.'+toValArr[2]);
+				timestamps[1] = Date.parse(fromValArr[1]+'.'+fromValArr[0]+'.'+fromValArr[2]);
+
+				if (!timestamps[0] && $.trim(toVal) != ''){
+					this.$dateTo.parent('.pwf-field').addClass('err');
+					validationResult = false;
+				}else{
+					this.$dateTo.parent('.pwf-field').removeClass('err');
+				}
+
+				if (!timestamps[1] && $.trim(fromVal) != ''){
+					this.$dateFrom.parent('.pwf-field').addClass('err');
+					validationResult = false;
+				}else{
+					this.$dateFrom.parent('.pwf-field').removeClass('err');
+
+				}
+				return validationResult;
+
 			},
 			applyHandler: function (it) {
 			}
@@ -1970,10 +2010,7 @@ if (EXPO.searchBlock){
 						if ( item.cat != currentCategory && item.cat) {
 							ul.append( "<li class='ui-autocomplete-category'>" + item.cat + "</li>" );
 							currentCategory = item.cat;
-						}/*else if(item.url){
+						}
-						 ul.append( "<li class='ui-menu-item'><a class='complete-link' href="+item.url+" >" + item.label + "</a></li>" );
-
-						 }*/
 						that._renderItemData( ul, item );
 					});
 				}
@@ -2059,8 +2096,11 @@ if (EXPO.searchBlock){
 			this.modalWindow = new common.Modal(self.settings.modal);
 
 			this.periodModal.applyHandler = function () {
+				if(this.validate()){
 					$waiter.show();
 					$(self.DOMform).submit();
+				}
+
 			};
 			this.placesModal.applyHandler = function () {
 				$waiter.show();
@@ -2079,6 +2119,7 @@ if (EXPO.searchBlock){
 				self.modalWindow.open();
 				return false;
 			});
+
 			// заполнение полей предыдущими значениями
 			$(function () {
 				if(self.previousSearch){