Retrieving data from database and automatize php scripts while using PhantomJS

Question 1

I am currently working on a project where I am trying to retrieve values from a table in a SQL database and insert them into a webpage. This is all on the server side, Linux. The only unique value is the ID, and depending on the number of the ID the webpage will change accordingly.

For example:

ID: 1, Color: Red.

ID: 2, Color: Blue.

If the ID value 1 is retrieved, the background color will change to red. And if ID 2 is retrieved, the background color is blue.

The question is, is there a way to trigger this background color change using PHP and/or Javascript?

Question2

Now, when question 1 is answered, we have our webpage background color changed to a desired color. The next thing would be to take an image of our newly changed website. This will be done with PhantomJS (later on this will be made into a video, but that problem is solved).

Is it possible to make all of this automatized? So that when the webpage has changed background color, the Go.php will start running?

Thanks in advance!

Relevant to Question 1

Retrieves data from database

Takeinfo.php

<?php
$dbhost = 'localhost';
$dbuser = 'User';
$dbpass = 'Password';
$conn = mysql_connect($dbhost, $dbuser, $dbpass);
if(! $conn )
{
  die('Could not connect: ' . mysql_error());
}
$sql = 'SELECT id, color FROM thevariables;

mysql_select_db(TheDatabse);
$retval = mysql_query( $sql, $conn );
if(! $retval )
{
  die('Could not get data: ' . mysql_error());
}
while($row = mysql_fetch_array($retval, MYSQL_ASSOC))
{
    echo "ID :{$row['id']}  <br> ".
         "Color :{$row['color']}  <br> ".
         "--------------------------------<br>";
} 
echo "Fetched data successfully\n";
mysql_close($conn);
?>

Relevant to Question 2

Go.php will initiate run.sh, which in turn starts PhantomJS and proceeds to run runscript.js.

go.php

<?php 
echo shell_exec('sh gogo.sh');
 ?>

run.sh

phantomjs runscript.js

runscript.js

var page = require('webpage').create();
page.viewportSize = { width: 640, height: 480 };

page.open('index.html', function () {
  setTimeout(function() {
    page.render('TheScreenshot.png', { format: "png" });
    phantom.exit();
  }, 666);
});