Javascript returns php array incorrectly for jssor slider

Question

I have a working installation of the jssor slider. The way it changes the images is determined by transition strings in the code. There are hundreds of transitions available and I am trying to write code to load those in as picked by the user. I have a php function that finds the picked transition and that is then used in the javascript.

The problem is that it doesn't work. As far as I can tell, it looks like the returned array is not being decoded correctly.

The file I am using to store the transitions has content like this:

    fade = {$Duration:800,$Opacity:2}
    bounce_down = {$Duration:1000,y:1,$Easing:$Jease$.$InBounce,$Opacity:2}

My php code is:

    function GetTransitions() {
      $picked = array(0 => 'bounce_down'); //just to show what was picked

      $xsisitons = array();
      $xit = parse_ini_file('transitions.ini');

      foreach ($xit as $key => $data) { 
        if (in_array($key, $picked)) {
            $xsisitons[] = $data; 
        }
      } 
      return json_encode($xsisitons);
    }

    $jsondata = GetTransitions(); 

The relevant part of the javascript is

    <script>
     jQuery(document).ready(function ($) {

     var xsitions = <?php echo $jsondata; ?>

     console.log(xsitions);

     var _SlideshowTransitions = [
            xsitions
            ];

If I paste the transition string directly into the above _SlideshowTransitions, the transition works. But if it is loaded as shown, the transition fails.

The output of the console.log is

    ["{$Duration:1000,y:1,$Easing:$Jease$.$InBounce,$Opacity:2}"] 

That's different from the original string since it is enclosed in [" "]. Assuming that is the problem, how do I return the correct string? Or can someone see some other problem with the code.

Answer 1

Please try json_decode to decode the string $data you read from ini file.

function GetTransitions() {
  $picked = array(0 => 'bounce_down'); //just to show what was picked

  $xsisitons = array();
  $xit = parse_ini_file('transitions.ini');

  foreach ($xit as $key => $data) { 
    if (in_array($key, $picked)) {
        $xsisitons[] = json_decode($data); 
    }
  } 
  return json_encode($xsisitons);
}

Answer 2

Please try to join the array items.

function GetTransitions() {
  $picked = array(0 => 'bounce_down'); //just to show what was picked

  $xsisitons = array();
  $xit = parse_ini_file('transitions.ini');

  foreach ($xit as $key => $data) { 
    if (in_array($key, $picked)) {
        $xsisitons[] = $data; 
    }
  } 
  return '[' . join(',', $xsisitons) . ']';
}