// --- Edit Image Change
// --- to display the tr when there is an image uploaded success in dropzone-script-main
let giveFeedbackText = 'Please add image alt text under image info'
function doImageChange(display, alt, feedback){
  let _allDisplay = Array.from(document.querySelectorAll(display));
  let _allAlt = Array.from(document.querySelectorAll(alt));
  let _allFeedback = Array.from(document.querySelectorAll(feedback));
  if(_allDisplay.length > 0){
    _allDisplay.forEach(function(e){
      e.setAttribute('style', 'transform: scale(1)');
      e.classList.add('dis');
    });
  };
  if(_allAlt.length > 0){
    _allAlt.forEach(function(e){
      e.required = true;
    });
  };
};
function doGiveFeedbackOnClick({button: button, field: field, feedbackDiv: feedbackDiv, feedback: feedback, doThis: doThis}){
  // Find the Button
  let _thisButton = Array.from(document.querySelectorAll(button));
  // The field that the button is looking for
  let _thisField = Array.from(document.querySelectorAll(field));
  // The div the feedback will appear in
  let _thisFeedback = Array.from(document.querySelectorAll(feedbackDiv));
  // Give each button the same onClick function
  _thisButton.forEach(function(b){
    if(b.getAttribute('type') == 'Submit'){
      b.addEventListener('click', function(event){
        _thisField.forEach(function(el){
          // Does the field has a value and is required
          // if so run function "doThis" and feedback
          if(!el.value && el.required){
            _thisFeedback.forEach(function(ef){
              ef.innerHTML = feedback
            })
            doThis()
          }
        })
      })
    }
  })
}

//----- JSColor Picker
let inputTarget;
let myColor;
$('.modal').on('hide.bs.modal', function (event) {
    // Modal Hide
    if(inputTarget){
       inputTarget = '';
       myColor = '';
    }
});
//------ End JSColor Picker

//-------------------------------

//------ Mobile Dropdown-Menu
//---Pagenav
let navDropdown = document.querySelectorAll('.pagenav-dropdown .dropdown');
let navDropArray = Array.from(navDropdown)
navDropArray.forEach(function(item){
  let dropToggle = $( item ).find( 'a.dropdown-toggle' );
  let spanInA = dropToggle.find('span');
  let spanInAText = dropToggle.find('span').text();
  let dropDown = $( item ).find( 'ul.dropdown-menu');
  let href = dropToggle.attr( 'href' );
  if(dropToggle[0]){
    $( '.collapse' ).on('show.bs.collapse', function(){
      let changeSpan = spanInA.replaceWith(spanInAText)
      let removehref = dropToggle.removeAttr( 'href' );
      let hovered = false
      dropToggle[0].addEventListener("click", function(event){
        if(hovered){
          $(event.target).attr( 'href', href );
        } else {
          hovered = true
        }
      });
    })
  }
})

//---DropShade
let navDropShade = document.querySelectorAll('.pagenav-dropshade .dropdown');
let navDropShadeArray = Array.from(navDropShade)
navDropShadeArray.forEach(function(item){
  let dropToggle = $( item ).find( 'a.dropdown-toggle' );
  if(dropToggle[0]){
    let href = dropToggle.attr( 'href' );
    $( '.collapse' ).on('show.bs.collapse', function(){
      let removehref = dropToggle.removeAttr( 'href' );
      let hovered = false
      dropToggle[0].addEventListener("click", function(event){
        if(hovered){
          $(event.target).attr( 'href', href );
        } else {
          hovered = true
        }
      });
    })
  }
})
//------ End Mobile Dropdown-Menu