rachael.fulcher
12/10/2018 - 6:37 AM

Move controls into the aggregate - Minimal style

.okeReviews.okeReviews--theme .is-okeReviews-reviewsWidget-medium .okeReviews-reviewsAggregate,
.okeReviews.okeReviews--theme .is-okeReviews-reviewsWidget-large .okeReviews-reviewsAggregate {
    display: flex
}
.okeReviews.okeReviews--theme .okeReviews-reviewsAggregate-primary {
    display: block
}
.okeReviews.okeReviews--theme .is-okeReviews-reviewsWidget-large .okeReviews-reviewsAggregate-primary {
    display: flex;
    justify-content: space-between
}
.okeReviews.okeReviews--theme .okeReviews-reviewsWidget-header-controls-writeReview,
.okeReviews.okeReviews--theme .okeReviews-reviews-controls-select,
.okeReviews.okeReviews--theme .okeReviews-reviews-controls-select .okeReviews-select,
.okeReviews.okeReviews--theme .okeReviews-select-input {
    width: 100%
}
.okeReviews.okeReviews--theme .okeReviews-reviewsWidget-header-controls-writeReview {
    margin-bottom: 1em;
    text-align: center;
    display: block
}
window.okeReviewsWidgetOnInit = function() {
  setupWidget();
  
  var observer = new MutationObserver(function(records) {
    setupWidget();
  });

  var reviewMainElement = document.querySelector('.js-okeReviews-reviews-main');
  observer.observe(reviewMainElement, {
    childList: true
  });
}

function setupWidget() {
  createHolderDiv();
  moveDiv('.js-okeReviews-writeReview','.okeReviews-reviewsAggregate-controls');
  moveDiv('.okeReviews-reviews-controls-select','.okeReviews-reviewsAggregate-controls');
  moveDiv('.okeReviews-reviewsAggregate-recommends','.okeReviews-reviewsAggregate-side-inner');
}

function moveDiv(targetSelector, destinationSelector, prepend) {
  var destination = document.querySelector(destinationSelector);
  var objectToMove = document.querySelector(targetSelector);
  if (objectToMove && destination) {
    prepend ? destination.prepend(objectToMove) : destination.append(objectToMove);
  }
}

function createHolderDiv() {
  var existingHolderDiv = document.querySelector('.okeReviews-reviewsAggregate-controls');
  if (!existingHolderDiv) {
    var aggregateControlDiv = document.createElement("div");
    var destination = document.querySelector('.okeReviews-reviewsAggregate-primary');
    aggregateControlDiv.setAttribute('class','okeReviews-reviewsAggregate-controls');
    if (destination) {
      destination.append(aggregateControlDiv);
    }
  }
}