Can't pass php variable to javascript in Eclipse IDE

I need to init some js variable by passing php variable to <some javascript>.js file, in my php project under Eclipe Luna IDE (PDT)

When I'm trying to do:

if (typeof strPreviewImg == 'undefined') {
            strPreviewImg = <?php echo(plugin_dir_url( __FILE__ )."images/vpreview_center.png"); ?>;
}

I've got following errors from Eclipse:

Multiple markers at this line - Syntax error, insert ": Expression" to complete Expression - Syntax error on token "<", invalid Expression - Syntax error on tokens, delete these tokens

When I'm trying to use quotes:

if (typeof strPreviewImg == 'undefined') {
                strPreviewImg = "<?php echo(plugin_dir_url( __FILE__ ).\"images/vpreview_center.png\"); ?>";
    }

Whole php expression is passed as string to my HTML code:

<video poster="<?php echo(plugin_dir_url( __FILE__ ).'images/vpreview_center.png)'; ?>">

So, am I doing something wrong or there's some Eclipse PDT issue?

Thanks

Solution

i have deducted from your use of plugins_dir_url() that you are using WordPress.

in WordPress, after using wp_enqueue_script() to register a script handle, you can "localize" data to be accessible globally on the client side.

with WordPress/PHP:

<?php
$args = array(
    'var1'  =>  'value 1',
    'var2'  =>  'value 2'
);
wp_localize_script( 'your_handle', 'your_cdata', $args );
?>

results in cdata in your document's <head>

<head>
<script type='text/javascript'>
/* <;![CDATA[ */
var your_cdata = {"var1":"value 1","var2":"value 2"};
/* ]]> */
</script>
</head>

then your javascript can use:

alert(your_cdata.var1);
alert(your_cdata.var2);

OPTIONALLY you can use PHP to serve Javascript files by setting your src URL to a PHP file:

<script type="text/javascript" src="url_to_your_php_file.php" /></script>

or with $_GET variables

<script type="text/javascript" src="url_to_your_php_file.php?var1=value1" /></script>

then in "your_php_file.php":

<?php
header( 'content-type: text/javascript' );
// possible database query here using $_GET[$var1]
$value = 'some value';
?>
function name() {
    var example1 = '<?php echo '"' . $value . '"'; ?>';
    var example2 = '<?php echo '"some other data"'; ?>';
    alert( example1 + ' / ' + example2 );
}
<?php
// and even do further includes to additional files (php, js, etc)
@include 'local_path_to_some_other_file.js';
exit;
?>

LASTLY you can replicate the WordPress example yourself:

<head>
<script type='text/javascript'>
/* <![CDATA[ */
var your_cdata = {
    "var1":<?php echo '"value 1"'; ?>,
    "var2":<?php echo '"value 2"'; ?>
};
/* ]]> */
</script>

note the use of single quotes enclosing double quotes. this makes the double quotes part of the output.