JSFiddle - React, Tailwind, and code Playground

by Kishore Sahasranaman

HTML

<button class="btn-front">.btn-front</button>
<button class="btn-right">.btn-right</button>
<button class="btn-back">.btn-back</button>
<button class="btn-left">.btn-left</button>

JavaScript

var reqPos = 0,
    curPos = 0;

function viewRotate(curPos, reqPos){
  var curPos = reqPos;
  console.log('1 ' + reqPos + curPos);

  if(curPos === 0 && reqPos === 12) {

    for(var j = 0; j < reqPos; j++){
      curPos++;
    }
    curPos = reqPos;
  }
  else if (curPos === 0 && reqPos === 24) {

    for(var j = 0; j < reqPos; j++){
      curPos++;
    }
    curPos = reqPos;
  }
  else if (curPos === 0 && reqPos === 36) {
    for(var j = 0; j < reqPos; j++){
      curPos++;
    }
    curPos = reqPos;
  }
}
$('.btn-front').click(function(){
    viewRotate(curPos, 0);
    console.log(reqPos);
});

$('.btn-right').click(function(){
    viewRotate(curPos, 12);
    console.log(reqPos);
});

$('.btn-back').click(function(){
    viewRotate(curPos, 24);
    console.log(reqPos);
});

$('.btn-left').click(function(){
    viewRotate(curPos, 36);
    console.log(reqPos);
});