Sir Trevor JS in Laravel 5 project

2.1.0 2015-08-15 09:37 UTC


Integrate the tool Sir Trevor JS in a Laravel 5 project.


========== WARNING!!! ===============

I just cloned this repository for a personal project and in the next days I'll make some changes that may break things. DO NOT USE IT IN PRODUCTION (unless if you are me). I recommend using original author's repository instead (link below).

I plan to release a stable version with a different API in a near future, but right now I cannot tell exactly when I'll do it.


This package is available through Packagist and Composer.

For Laravel 5, use the branch master : "caouecs/sirtrevorjs": "~2.0"


In your app/config/app.php, add in aliases :

'SirTrevorJs' => 'Caouecs\Sirtrevorjs\SirTrevorJs',
'STConverter' => 'Caouecs\Sirtrevorjs\SirTrevorJsConverter'

Service Provider

If you want to use routing, controllers, views directly in your project, in your app/config/app.php, add "Caouecs\Sirtrevorjs\SirtrevorjsServiceProvider" to your list of providers.


To get tweets, this project uses twitter-l4, so you must have a valid developer account of Twitter and add config file of twitter-l4 :

php artisan config:publish thujohn/twitter

and add "Thujohn\Twitter\TwitterServiceProvider" to your list of providers in your app/config/app.php.

Configuration file

Next, you must migrate config :

php artisan vendor:publish caouecs/sirtrevorjs

After installation, the config file is located at app/config/packages/caouecs/sirtrevorjs/sir-trevor-js.php.

You can define :

  • the path for image upload
  • the route for upload image
  • the route for tweet
  • the path of Sir Trevor files
  • the list of block types
  • the language
  • the paths for Eventable.js and Underscore.js
  • the view
  • configuration for blocks
    • soundcloud
    • gettyimages
  • etc...

SirTrevorJs class


For stylesheets :


For scripts, in your Blade files :


Fix for image block

Function to fix a problem with image block when you add a new image :

$text = SirTrevorJs::transformText($text);

Find first image

Get first image in text with findImage method :

string SirTrevorJS::findImage(string $text);

In return, you have url of image or empty string.

Find elements by blocktypes

Get all elements in text, in specified blocktype with find method :

mixed SirTrevorJS::find(string $text, string $blocktype [, string $output = "json"])

In return, you can have :

  • array, if you choose "array" for $output
  • json, if you choose "json" for $output
  • false, if the script doesn't find an occurence of blocktype


This class proposes two things :

  • upload image where you want
  • get tweets

Upload image

This project proposes a system for upload image, nothing to configure, just the directory_upload value in config file.

"directory_upload" => "img/uploads"

The uploader is in SirTrevorJsController class, and the project has a route.php file for it.

Route::any("/sirtrevorjs/upload", array("uses" => "SirTrevorJsController@upload"));


This project proposes a system to get tweets. I use twitter-l4 project.

The installation of twitter-l4 is done by Composer, but you need to configure it ( see Instructions).

The tweet converter is in SirTrevorJsController class, and the project has a route.php file for it.

Route::any("/sirtrevorjs/tweet", array("uses" => "SirTrevorJsController@tweet"));

SirTrevorJsConverter class (or STConverter class)

Convert text from Sir Trevor Js to html :

$convert = new STConverter();

Or via SirTrevorJS class :

{{ SirTrevorJs::render($text) }}

For the moment, the code can convert :