Button always visible and same size even when zooming

ActivePresenter Support Questions
10

Hi Michael,

Below is the code for multiple buttons, you just need to update the array of button names.

var $zoomNode = $('.ap-slides', prez.container),
  zoomTransform = 'none',
  buttonNames = ['Button_4', 'Button_6'],	// plz update this array
  firstButton = prez.object(buttonNames[0]),// cache to check slide change
  $buttonNodes = [];

// cache button jQuery object for faster speed
for (var i = 0; i < buttonNames.length; ++i)  
  $buttonNodes.push($(prez.object(buttonNames[i]).node));

prez.invertZoom = function(force) {
  if (prez.object(buttonNames[0]) != firstButton) {
    // slide changed, should not update buttons anymore
    return;
  }
  // update buttons
  var currentZoomTransform = $zoomNode.css('transform');
  if (currentZoomTransform != zoomTransform || force === true) {
    zoomTransform = currentZoomTransform;
    var zoomMatrixData = zoomTransform.split(/\s*[(),]\s*/).slice(1, -1);
    var scale = 1, x = 0, y = 0;
    var buttonCSS = {
      transformOrigin: '',
      transform: ''
    };
    if (zoomMatrixData.length == 6) { // matrix(a, b, c, d, tx, ty)
      scale = 1 / zoomMatrixData[0];
      if (scale != 1) {
        x = -zoomMatrixData[4];
        y = -zoomMatrixData[5];
        buttonCSS.transform = 'scale(' + scale + ', ' + scale + ') translate(' + x + 'px, ' + y + 'px)';
      }
    }
	
    for (var i = 0; i < $buttonNodes.length; ++i) {
      var $buttonNode = $buttonNodes[i];
      if (scale != 1)
        buttonCSS.transformOrigin = -parseFloat($buttonNode.css('left')) + 'px ' + -parseFloat($buttonNode.css('top')) +'px';
      $buttonNode.css(buttonCSS);
    }
  }
  // request update button in next animation frame
  requestAnimationFrame(prez.invertZoom);
};

requestAnimationFrame(prez.invertZoom);