Example #1
0
    public function indexAction()
    {
        $react_source = file_get_contents(__DIR__ . '/../web/js/react.js');
        $app_source = file_get_contents(__DIR__ . '/../web/js/components.js');
        $rjs = new ReactJS($react_source, $app_source);
        $rjs->setComponent('Timer', array('startTime' => time()));
        $output = '
            <html>
            <head>
                <title>Epoch at server</title>
                <script src="/js/react.js"></script>
                <script src="/js/components.js"></script>
            </head>
            <body>
            <h1>Epoch server time</h1>
            <h2>Client side only</h2>
            <div id="client"></div>
            <h2>Server side with a two second client detach</h2>
            <div id="server">' . $rjs->getMarkup() . '</div>
            <script>

            ' . $rjs->getJS("#client") . '

            setTimeout(function(){
                ' . $rjs->getJS("#server") . '
            }, 2000);
            </script>
            </body>
            </html>
        ';
        $response = new Response($output);
        return $response;
    }
Example #2
0
<?php

require __DIR__ . '/../../libs/ReactJS.php';
define('NODE_MODULES', __DIR__ . '/../js/node_modules');
define('JS_DIR', __DIR__ . '/../js/bld');
$config = ['node_modules' => NODE_MODULES, 'js_files' => JS_DIR];
$Layout = new ReactJS($config);
$Layout->page(['layout' => ['component' => 'App', 'require' => JS_DIR . '/app.js', 'static' => true, 'props' => ['title' => 'SSR React PHP!', 'h2' => 'React JS render on server with PHP']], 'app' => ['component' => 'MainComponent', 'require' => JS_DIR . '/mainComponent.js', 'domContainerNode' => '<div id="app"></div>']]);
echo $Layout;
#EOF#
Example #3
0
 public function testShouldPassWithBrowserify()
 {
     $this->app['config']->set('reactjs::basepath', dirname(__FILE__));
     $this->app['config']->set('reactjs::react_src', '');
     $this->app['config']->set('reactjs::src_files', ['/js/bundle.js']);
     $this->app['config']->set('reactjs::react_prefix', 'Application.libs');
     $this->app['config']->set('reactjs::components_prefix', 'Application.components');
     $this->setupErrorHandling();
     $data = ['nome' => 'Luis Henrique', 'email' => '*****@*****.**'];
     ReactJS::component('Person');
     ReactJS::data($data);
     $doc = new DOMDocument();
     $doc->loadHTML(ReactJS::markup());
     $this->assertEquals($data['nome'], $doc->getElementsByTagName('p')->item(0)->getElementsByTagName('span')->item(0)->textContent);
     $this->assertEquals($data['email'], $doc->getElementsByTagName('p')->item(1)->getElementsByTagName('span')->item(0)->textContent);
     $selector = '.xpto';
     $jsMarkup = ReactJS::js($selector);
     $this->assertTrue((bool) strpos($jsMarkup, 'Application.libs.React.render'));
     $this->assertTrue((bool) strpos($jsMarkup, json_encode($data)));
     $this->assertTrue((bool) strpos($jsMarkup, 'document.querySelector("' . $selector . '")'));
 }
Example #4
0
<?php

/**!
 * Copyright (c) 2014, Facebook, Inc.
 * All rights reserved.
 *
 * This source code is licensed under the BSD-style license found in the
 * LICENSE file in the root directory of this source tree. An additional grant
 * of patent rights can be found in the PATENTS file in the same directory.
 */
/**
 * Example of using the ReactJS class
 */
include '../ReactJS.php';
$rjs = new ReactJS(file_get_contents('../../react/build/react.js'), file_get_contents('table.js'));
// app code
// data to be passed to the component
$data = array('data' => array(array(1, 2, 3), array(4, 5, 6), array(7, 8, 9)));
// set the component and its data
// after this you can call getMarkup()/getJS()
// Then you can set another component to render
// and do that as many times as the components you need
// all the while reusing the $rjs instance
$rjs->setComponent('Table', $data);
?>
<!doctype html>
<html>
  <head>
    <title>React page</title>
    <!-- css and stuff -->
  </head>
Example #5
-1
<?php

require __DIR__ . '/../../libs/ReactJS.php';
define('NODE_MODULES', __DIR__ . '/../js/node_modules');
define('JS_DIR', __DIR__ . '/../js/bld');
$config = ['node_modules' => NODE_MODULES, 'js_files' => JS_DIR];
$Layout = new ReactJS($config);
$Layout->entry(['component' => 'App', 'require' => JS_DIR . '/app.js', 'static' => true, 'props' => ['title' => 'SSR React PHP!', 'h2' => 'React JS render on server with PHP']]);
$MainComponent = new ReactJS($config);
$MainComponent->entry(['component' => 'MainComponent', 'require' => JS_DIR . '/mainComponent.js']);
// Render static layout and React components
echo $Layout(['domContainerNode' => '<div id="app"></div>', 'component' => $MainComponent]);
#EOF#
Example #6
-1
<?php

ini_set("v8js.flags", "--harmony");
require './react-php-v8js/ReactJS.php';
$react = file_get_contents('https://fb.me/react-0.13.0.min.js');
$component = file_get_contents('./simple.js');
$rjs = new ReactJS($react, $component);
$rjs->setComponent('Simple');
echo $rjs->getMarkup();
echo "\n\n";
Example #7
-2
 /**
  * Render a ReactJS component
  *
  * @param string $component Name of the component object
  * @param array $props      Associative array of props of the component
  * @param array $options    Associative array of options of rendering
  *
  * @return string
  */
 public function render($component, $props = null, $options = array())
 {
     $options = array_merge($this->defaultOptions, $options);
     $tag = $options['tag'];
     $markup = '';
     // Creates the markup of the component
     if ($options['pre_render'] === true) {
         $markup = $this->react->setComponent($component, $props)->getMarkup();
     }
     // Pass props back to view as value of `data-react-props`
     $props = htmlentities(json_encode($props), ENT_QUOTES);
     // Gets all values that aren't used as options and map it as HTML attributes
     $htmlAttributes = array_diff_key($options, $this->defaultOptions);
     $htmlAttributesString = $this->arrayToHTMLAttributes($htmlAttributes);
     return "<{$tag} data-react-class='{$component}' data-react-props='{$props}' {$htmlAttributesString}>{$markup}</{$tag}>";
 }
Example #8
-13
<?php

require __DIR__ . '/../../libs/ReactJS.php';
$rjs = new ReactJS(['node_modules' => __DIR__ . '/../js/node_modules', 'js_files' => __DIR__ . '/../js/bld']);
$rjs->entry(['component' => 'MainComponent', 'require' => __DIR__ . '/../js/bld/mainComponent.js']);
echo $rjs;
#EOF#