drg_cms 0.6.1.6 → 0.6.1.9

data/app/assets/javascripts/drg_cms/drg_cms.js

@@ -159,7 +159,7 @@ $(function() {
  *  record_name: will replace value of record[name] field on a form with supplied value
  *
  *  msg_error: will display error message.
- *  msg_warn: will display warning message.
+ *  msg_warning: will display warning message.
  *  msg_info: will display informational message.
  *  
  *  popup: will display popup message
@@ -246,11 +246,17 @@ process_json_result = function(json) {
 /**** display popup message ****/
       case 'popup':
         if (selector == 'url') {
-          $('#popup').bPopup({ loadUrl: value });
+          $('#popup').bPopup({ loadUrl: value,
+            transition: 'slideDown', transitionClose: 'slideDown', speed: 300,
+            opacity: 0, position: ['auto', 20],
+            closeClass: 'dc-link' });
         }
         else {
           $('#popup').html(value);
-          $('#popup').bPopup({speed: 650, transition: 'slideUp', position: ['auto',1]});
+          $('#popup').bPopup( {
+            transition: 'slideDown', transitionClose: 'slideDown', speed: 300,
+            opacity: 0, position: ['auto', 20],
+            closeClass: 'dc-link' });
         }
         break;
 
@@ -395,7 +401,7 @@ process_parent_form_updates = function(element) {
 /*****************************************************************
  * Toggle show and hide div
  ******************************************************************/
-dc_toggle_div = function(div) {
+dc_div_toggle = function(div) {
   if ($(div).is(":visible")) {
     $(div).slideUp();
   } else {
@@ -403,17 +409,55 @@ dc_toggle_div = function(div) {
   }
 };
 
+/*****************************************************************
+ * Process simple ajax call
+ ******************************************************************/
+simple_ajax_call = function(url) {
+  $.ajax({
+    url: url,
+    success: function(data) { process_json_result(data); }
+  });
+};
+
 /*****************************************************************
  * Return value of the input field on a form
  ******************************************************************/
-function dc_get_field_value(field_name) {
+function dc_field_get_value(field_name) {
   field_name = field_name.replace('record_', '');
   let field = $('[name="record[' + field_name + ']"]');
   return field.val();
 }
 
+/*****************************************************************
+ * Will process data-fields attribute and add field values as parameters to url
+ ******************************************************************/
+function dc_url_add_params(form, url) {
+  // check if data-fields attribute present
+  let fields = form.getAttribute("data-fields");
+  if (fields === null) return url;
+  // url might already contain ?
+  let form_parms = '?';
+  if (url.match(/\?/)) form_parms = '';
+
+  fields.split(',').forEach( function(field) {
+    let value = dc_field_get_value(field);
+    if (value) form_parms += '&' + field + '=' + value;
+  });
+  return url + form_parms;
+}
+
 /*******************************************************************
- * 
+ * Copy div text to clipboard
+ *******************************************************************/
+function dc_copy_to_clipboard(div) {
+  let copyText = document.getElementById(div).innerText;
+  console.log(copyText);
+  /* Copy the text inside the text field */
+  navigator.clipboard.writeText(copyText);
+}
+
+/*******************************************************************
+ * Events start here
  *******************************************************************/
 $(document).ready( function() {
 /* This could be the way to focus on first input field on document open
@@ -476,7 +520,7 @@ $(document).ready( function() {
   * Popup CMS edit menu option clicked
   *******************************************************************/
   $('.drgcms_popmenu_item').on('click',function(e) {
-    url = e.target.getAttribute("data-url");
+    let url = e.target.getAttribute("data-url");
     $('#iframe_cms').attr('src', url);
 //    $('#iframe_cms').width(1000).height(1000);
 // scroll to top of page and hide menu    
@@ -487,13 +531,22 @@ $(document).ready( function() {
  /*******************************************************************
   * Sort action clicked on cmsedit
   *******************************************************************/
-  $('.drgcms_sort').change( function(e) {
+  $('.dc-sort-select').change( function(e) {
     let table = e.target.getAttribute("data-table");
     let form  = e.target.getAttribute("data-form");
     if (form === null) form = table;
     let sort = e.target.value;
-    e.target.value = null;
-    window.location.href = "/cmsedit?sort=" + sort + "&table=" + table +  "&form_name=" + form;
+//    e.target.value = null;
+    let url = "/cmsedit/run?control=cmsedit.sort&sort=" + sort + "&table=" + table +  "&form_name=" + form;
+    simple_ajax_call(url);
+  });
+
+  /*******************************************************************
+   * Click on field name in result header perform sort action
+   *******************************************************************/
+  $('.dc-result-header span').on('click',function(e) {
+    let url = e.target.getAttribute("data-url");
+    simple_ajax_call(url);
   });
 
   /*******************************************************************
@@ -660,6 +713,14 @@ $(document).ready( function() {
       }
     });
   });
+
+  /*******************************************************************
+   * Click on filter off
+   *******************************************************************/
+  $('.mi-search_off').on('click', function(e) {
+    let url = $(this).parents('.dc-filter').attr("data-url");
+    if (url.length > 5) simple_ajax_call(url);
+  });
   
 /*******************************************************************
  * Process action submit button click. 
@@ -682,33 +743,42 @@ $(document).ready( function() {
     form.submit();
   });
 
-/*******************************************************************
-  Will open a new window with URL specified.
-********************************************************************/
-$('.dc-window-open').on('click', function(e) {
-  // confirmation if required
-  if (confirmation_is_cancled(this)) { return false; }
-
-  let url = this.getAttribute("data-url");
-  let title = this.getAttribute("title");
-  let w = this.getAttribute("data-x") || 1000;
-  let h = this.getAttribute("data-y") || 800;
-  // add fields values from current formto url
-  let fields = this.getAttribute("data-fields");
-  if (fields) {
-    let form_parms = '?';
-    // ? separator already in url
-    if (url.match(/\?/)) { form_parms = ''; }
-    fields.split(',').forEach( function(field) {
-      let value = dc_get_field_value(field);
-      if (value) {form_parms += '&' + field + '=' + value;}
-    });
-    url += form_parms;
-  }
+  /*******************************************************************
+    Will open a new window with URL specified.
+  ********************************************************************/
+  $('.dc-window-open').on('click', function(e) {
+    // confirmation if required
+    if (confirmation_is_cancled(this)) return false;
 
-  let win = popup_window(url, title, window, w, h);
-  win.focus();
-});
+    let url = this.getAttribute("data-url");
+    let title = this.getAttribute("title");
+    let w = this.getAttribute("data-x") || 1000;
+    let h = this.getAttribute("data-y") || 800;
+
+    url = dc_url_add_params(this, url)
+    let win = popup_window(url, title, window, w, h);
+    win.focus();
+  });
+
+  /*******************************************************************
+   Will open a new popup with URL specified.
+   ********************************************************************/
+  $('.dc-popup-open').on('click', function(e) {
+    // confirmation if required
+    if (confirmation_is_cancled(this)) return false;
+
+    let url = this.getAttribute("data-url");
+    let title = this.getAttribute("title");
+    let w = this.getAttribute("data-x") || 1000;
+    let h = this.getAttribute("data-y") || 800;
+
+    url = dc_url_add_params(this, url)
+    $('#popup').bPopup({ loadUrl: url,
+                             transition: 'slideDown', transitionClose: 'slideDown', speed: 300,
+                             opacity: 0, position: ['auto', 20],
+                             closeClass: 'dc-link'
+    });
+  });
 
  /*******************************************************************
  * Animate button on click
@@ -724,20 +794,7 @@ $('.dc-window-open').on('click', function(e) {
     $(this).toggleClass('dc-animate-button'); 
   });
  */
- /*******************************************************************
- * Animate button on click
- *******************************************************************/
-  $('.dc-animate').mousedown( function() {
-    $(this).toggleClass('dc-animate-button');
-  });
-  
- /*******************************************************************
- * Animate button on click
- *******************************************************************/
-  $('.dc-animate').mouseup( function() {
-    $(this).toggleClass('dc-animate-button'); 
-  });
- 
+
  /*******************************************************************
   * App menu option clicked
   *******************************************************************/
@@ -758,7 +815,7 @@ $('.dc-window-open').on('click', function(e) {
 /*******************************************************************
  * Display spinner on link with spinner, submit link
  *******************************************************************/
-  $('.dc-link-spinner').on('click', function(e) {
+  $('.dc-link.spin').on('click', function(e) {
     $('.dc-spinner').show();
   });  
   
@@ -791,7 +848,7 @@ $('.dc-window-open').on('click', function(e) {
   
 /**********************************************************************
  * When filter_field (field name) is selected on filter subform this routine finds 
- * and displays apropriate span with input field.
+ * and displays appropriate span with input field.
  **********************************************************************/
   $('#filter_field').on('change', function() {
     if (this.value.length > 0) { 
@@ -929,11 +986,10 @@ $('.dc-window-open').on('click', function(e) {
   *******************************************************************/
   $('#_record__filter_field').keydown( function(e) {
     if (e.which == '13' || e.which == '9') {
-      var url = $(this).parents('span').attr("data-url");
+      let url = $(this).parents('span').attr("data-url");
       url = url + "&filter_value=" + this.value;
-      location.href = url;
-      return false;      
-    }
+      simple_ajax_call(url);
+    };
   });
 
   /*******************************************************************
@@ -951,7 +1007,7 @@ $('.dc-window-open').on('click', function(e) {
       value = field.val();
     }
     url = url + "&filter_value=" + value;
-    location.href = url;
+    simple_ajax_call(url);
   });
 
  /*******************************************************************
@@ -959,47 +1015,77 @@ $('.dc-window-open').on('click', function(e) {
   *******************************************************************/
   $('#open_drgcms_filter').on('click', function(e) {
     $('#drgcms_filter').bPopup({
-      speed: 650,
-      transition: 'slideDown'
-    });      
+      transition: 'slideDown', transitionClose: 'slideDown', speed: 300,
+      opacity: 0, position: ['auto', 20],
+      closeClass: 'dc-link' });
   });
   
   /*******************************************************************
   * Click on preview selected image
   *******************************************************************/
   $('.dc-image-preview').on('click', function(e) {
-//      var img = $('.img1 img').attr('src');
-      var img = $(this).children(":first").attr('src');
-      $('#dc-image-preview').bPopup({
-            content:'image', //'ajax', 'iframe' or 'image'
-            contentContainer:'#dc-image-preview',
-            loadUrl: img
-        });
+    let img = $(this).children(":first").attr('src');
+    $('#dc-image-preview').bPopup({
+          content: 'image', //'ajax', 'iframe' or 'image'
+          contentContainer: '#dc-image-preview',
+          loadUrl: img,
+          opacity: 0
+    });
   });
   
  /*******************************************************************
-  * 
+  * Set new filter
   *******************************************************************/
-  $('.drgcms_popup_submit').on('click', function(e) {
-    //e.preventDefault();  
-    url = $(this).attr( 'data-url' );
-    field = $('select#filter_field1').val();
-    oper  = $('select#filter_oper').val();
-    location.href = url + '&filter_field=' + field + '&filter_oper=' + oper
-// Still opening in new window
-//    iframe = parent.document.getElementsByTagName("iframe")[0].getAttribute("id");
-//    loc = url + '&filter_field=' + field + '&filter_oper=' + oper
-//    $('#'+iframe).attr('src', loc);
-//    parent.document.getElementById(iframe).src = loc   
+  $('.dc-filter-set').on('click', function(e) {
+    let url = $(this).attr( 'data-url' );
+    let field = $('select#filter_field1').val();
+    let operation  = $('select#filter_oper').val();
+    url = url + '&filter_field=' + field + '&filter_oper=' + operation
+    simple_ajax_call(url);
    });
-   
- /*******************************************************************
-  * Toggle one cmsedit menu level
-  *******************************************************************/
-   $('.cmsedit-top-level-menu').on('click', function(e) {
-     $(e.target).find('ul').toggle('fast');
+
+  /*******************************************************************
+   * Toggle one cmsedit menu level
+   *******************************************************************/
+  $('.cmsedit-top-level-menu div').on('click', function(e) {
+    $(e.target).siblings('ul').toggle('fast');
+    $(e.target).toggleClass('expanded');
+  });
+
+  /*******************************************************************
+   * Toggle result set record menu
+   *
+   * This and additional two event hadlers provide expected behavior of submenus popup and close.
+   *******************************************************************/
+  $('.dc-result-submenu .mi-more_vert').on('click', function(e) {
+    let ul = $(e.target).siblings('ul');
+    // hide last selected menu if not the same
+    if (typeof dc_last_menu_selected !== 'undefined') { dc_last_menu_selected.hide(); }
+    // if menu is past the bottom fix it to bottom
+    let menu_bottom = ul.height() + ul.parent().position().top + 20;
+    if (menu_bottom > $(document).height()) ul.css('bottom', 0);
+    ul.show();
+    dc_last_menu_selected = ul;
    });
-   
+
+  /*******************************************************************
+   * Result record menu has lost focus. Hide menu.
+   *******************************************************************/
+  $('.dc-result-submenu ul').hover(function(e) {
+  },
+    function(e) {
+      dc_last_menu_selected.hide();
+      dc_last_menu_selected = undefined;
+  });
+
+  /*******************************************************************
+   * Result set record menu is left open if action is canceled. Ex. delete confirm. This will hide menu.
+   *******************************************************************/
+  $('.dc-result-submenu ul li').on('click', function(e) {
+    console.log('ups');
+    if (typeof dc_last_menu_selected !== 'undefined') dc_last_menu_selected.hide();
+  });
+
 /*******************************************************************
   * Resize result table columns. For now an idea.
   *******************************************************************/
@@ -1131,14 +1217,14 @@ $('.dc-window-open').on('click', function(e) {
   *******************************************************************/
   $('.dc-result-header .th i').hover( function() {
     old_sort_icon = '';
-    // save old sort icon and replace it with filter icon   
+    // save old sort icon and replace it with filter icon
     $.each( $(this).attr("class").split(/\s+/), 
       function(index, item) { if (item.match('sort')) { old_sort_icon = item}; }
     );
-    $(this).removeClass(old_sort_icon).addClass('fa-filter');
-// bring back old sort icon
-  }, function(){
-    $(this).removeClass('fa-filter').addClass(old_sort_icon);
+    $(this).removeClass(old_sort_icon).addClass('mi-ads_click');
+  // bring back old sort icon
+  }, function() {
+    $(this).removeClass('mi-ads_click').addClass(old_sort_icon);
   });
 
 /*******************************************************************
@@ -1146,6 +1232,8 @@ $('.dc-window-open').on('click', function(e) {
   *******************************************************************/
   $('.dc-result-header .th i').click( function(e) {
     e.preventDefault();
+    if ($(this).hasClass('no-filter')) return;
+
     // additional click will close dialog when visible
     if ($('.filter-popup').is(':visible')) {
       $('.filter-popup').hide();
@@ -1156,7 +1244,7 @@ $('.dc-window-open').on('click', function(e) {
     let field_name = header.attr("data-name");
     $('.filter-popup').attr('data-name', field_name);
     // change popup position and show
-    $('.filter-popup').css({'top':e.pageY+5,'left':e.pageX, 'position':'absolute'});
+    $('.filter-popup').css({'top': e.pageY + 5, 'left': e.pageX, 'position': 'absolute'});
     $('.filter-popup').show();    
   });
   
@@ -1171,7 +1259,7 @@ $('.dc-window-open').on('click', function(e) {
     let field_name = parent.data("name");
     
     url = url + '&filter_field=' + field_name + '&filter_oper=' + operator;
-    window.location.href = url;
+    simple_ajax_call(url);
   });
 
   /*****************************************************************
@@ -1179,14 +1267,14 @@ $('.dc-window-open').on('click', function(e) {
    ******************************************************************/
   $(".dc-handle").click(function() {
     let div = this.getAttribute("data-div");
-    dc_toggle_div(div);
+    dc_div_toggle(div);
   });
 
   /*******************************************************************
    * Show-Hide CMS menu on hamburger click
    *******************************************************************/
   $('#menu-hamburger').on('click', function(e) {
-    $('.cmsedit-container #menu').toggleClass('visible');
+    $('.cmsedit-container #cms-menu').toggleClass('visible');
   });
 
 });