I have 2 different dropdowns, and I need to get first dropdown value in PHP whenever second one is triggered. Is there any phery::getValue() or something to get .val() in PHP to use in function.

Hey!

Probably it's me being dumb, but I can't figure out how to do this: I have an <a> element made like this:

<?=Phery::link_to($title, 'list', 'id' => 'el-'.(string)$list['_id'], 'args' => ['tid' => (string)$list['_id'], 'status' => 'closed']])?>

What I want to do is inserting some random stuff to the document when I click on this <a> tag. That part works fine. But then I want to change the data-phery-args' status argument to 'open', so when I click this <a> tag next time it removes the stuff that I've just added before.

My problem is even though I update the tag like this (it updates it!):

->attr('data-phery-args', Phery::args($args), '#el-'.$data['tid'].'');

next time the click it it still posts 'status' => 'closed'.

How can I update the args parameter so it posts the updated data on the next click, not the initial one?

Thanks!

Hi
If you have a fragment in your url ajax requests aren't properly formed
http://phery-php-ajax.net/demo.php#random
try "Retry on timeout"
It seems the getTime() is not added to the request
hence the second request fails with a 404
mh

phery.on()'s synopsis reads:
phery.on(event, cb)

As shown in the example, there is another way to call with a single argument:
phery.on(events)

It might be a good idea to link to jQuery's .on(): https://api.jquery.com/on/

After clicking on "See the PHP code" in the RESTful section of demo.php, the region of code shown is inaccurate. It is offset by 3 lines too low. We see the end of the preceding function, and we miss the last lines of the good one. This happens with 2.7.3.

By the way, this demo refers to fields defined in other demo-s. It would be easier to understand if this was avoided.

When using this approach to chain / stack responses easily in PHP:

$response = PheryResponse::factory(); //Note that no selector is used
$response->add(PheryResponse::factory('#element')->html('elementContentGoesHere');
$response->add($this->processSomeStuffAndReturnAPheryResponse());

The result is an empty object: {} when returned to the client.

When using a dummy selector, it works though:

$response = PheryResponse::factory(__FUNCTION__); //Note that a dummy selector is used
$response->add(PheryResponse::factory('#element')->html('elementContentGoesHere');
$response->add($this->processSomeStuffAndReturnAPheryResponse());

It seems that a (last) selector had to be set for the PheryResponse::add() function to work properly. Is this intended? When removing the check for a 'lastSelector' in PheryResponse::__call(), it works properly, but I can not oversee the implications of this for other functionality since the documentation of that function states:

"To reach this magically called functions, the jquery() selector must be called prior to any jquery specific call"

What is the rationale for this condition? No need to reach anything to add it, right?

PheryResponse::merge()
Merging does work when no selectors are involved, since it does not go 'through' the PheryResponse::__call() method, only the order is reverted, so I would prefer to use the PheryResponse::add(), or am expecting the wrong behaviour here?

$response = PheryResponse::factory();
$response->merge(PheryResponse::factory('#element')->html('elementContentGoesHere');
$response->merge($this->processSomeStuffAndReturnAPheryResponse());

demo.php is very useful but very hard to follow. After trying to understand the first examples, I went to those under HTML titles. At this point I thought each demo was in its own section. But I realized that was not the case about 10 minutes after getting to the Selects section. When you click on the first selects, new selects appear, which means you get 5 selects in the same section. As there was no explanation of the example, I struggled to understand what these were meant to demonstrate. I only realized there was a second Toggle PHP code 10 minutes or more after starting to analyze the section.

Solutions

Visual

A low-cost solution would be to either:

1. ensure each demo is under its own heading
2. put a border on a block containing the demo

Structural

A solution involving more work, but which would IMO be quite better, would be to split demos in several files, turning the main file into an index. A 2000+-line demo file is not great. It is manageable with Firebug and searches, but it would be easier if each demo (or each few demos) had their own file.

When trying to install the https://github.com/pheryjs/phery/tree/3.0.0-alpha1 branch using Composer like this:

{
    "require": {
        "phery/phery": "dev-3.0.0-alpha1"
    }
}

A composer install results in:

No composer.lock file present. Updating dependencies to latest instead of installing from lock file. See https://getcomposer.org/install for more information.
Loading composer repositories with package information
Updating dependencies
Lock file operations: 1 install, 0 updates, 0 removals
  - Locking phery/phery (dev-3.0.0-alpha1 8276dcc)
Writing lock file
Installing dependencies from lock file (including require-dev)
Package operations: 1 install, 0 updates, 0 removals
  - Installing phery/phery (dev-3.0.0-alpha1 8276dcc): Extracting archive
1 package suggestions were added by new dependencies, use `composer suggest` to see details.
Generating autoload files

As you can see a commit 8276dcc is installed. Apparent the tag https://github.com/pheryjs/phery/releases/tag/3.0.0-alpha.1 is installed. Note that the name of this tag is 3.0.0-alpha.1, I think the alpha.1 suffix is not supported.

So when trying to install branch 3.0.0-alpha1 in fact, tag 3.0.0-alpha.1 is installed.

To circumvent this, one can specify a specific commit to install, for example 56aacf1 :

{
    "require": {
        "phery/phery": "dev-3.0.0-alpha1#56aacf17016f3b100364d968a0417171d575f8d4"
    }
}

But it might be better to prevent this kind of workarounds. I am willing to spend some time to get this library up-to-date for PHP: add PHPStan for static analysis, increase strictness / typing, etc. However, we are still not using JQuery 3.0.

#53 (comment) suggests that in that case the https://github.com/pheryjs/phery/tree/3.0.0-alpha1 should be used. Maybe replace the "alpha1" suffix with "beta"? Or "RC1"?

The README's Documentation section starts with:

It's really simple as:

<?php
    require_once 'vendor/autoload.php';
    use Phery\Phery;
    Phery::instance()
    ->set(array(
        'function_name' => function($data){
                return
                    PheryResponse::factory()
                        ->jquery('<div/>', array('text' => 'text content'))
                        ->appendTo('body')
                        ->call('func', 'list', true);
        }
    ))->process();
?>
<!doctype html>
<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
        <script src="phery.js"></script>
        <script>
            function func(name, override){
                /* function */
            }
        </script>
    </head>
    <body>
        <?php echo Phery::link_to('Click me', 'function_name'); ?>
    </body>
</html>

When clicking a link with data-phery-remote, it will automatically call the "function_name" callback, that will return a response and apply everything automagically

I suppose "It's really simple as:" is supposed to read "It's really as simple as:". If so, considering that the README seems to be targeting new users, this is quite misleading. The example refers to 2 previously undiscussed classes and 8 previously undiscussed methods. It contains a statement which chains 3 methods, which embeds a statement which chains 4 different methods.

Someone who doesn't master jQuery would have a hard time understanding what the above is meant to do. Someone who doesn't know what autoloading is would notice that vendor/autoload.php does not exist and have trouble getting the code to work.

The explanation paragraph refers to data-phery-remote, which has not been defined before. It is also incorrect; only links with a data-phery-remote attribute set to "function_name" will call the function-name callback.

If "It" refers to Phery, I do not think Phery.js - with its PHP API having tens of functions, its JavaScript API and a DOM interface - will be considered simple by many. If "It" means accomplishing what the example does using Phery.js, then it may look simple for someone who masters Phery.js indeed, but that is a minority of the audience.

I recommend to avoid suggesting that Phery is simple. I also recommend to keep the example as simple as possible. And finally I recommend to explain what the example is meant to do.

Because the get_magic_quotes_gpc was removed in PHP 8, phery won't work anymore, without recreating this function.
IMO it would be better to check if the function exists in Phery.php at line 659.

To update the possible options of a TimePicker, I am trying to get this JavaScript into a PheryResponse:

$("#timepickerId").pickatime("picker").set("disable", [12,13,14]);

or

$("#timepickerId").pickatime("picker").disable([12,13,14]);

I only managed this in an "ugly" way:

return PheryResponse::factory()->script('$("#timepickerId").pickatime("picker").set("disable", [12,13,14]);');

But I was looking to something like:

$disabledHours = array(13,14,15);
return PheryResponse::factory('timepickerId')->pickatime('picker')->disable($disabledHours);
return PheryResponse::factory('timepickerId')->pickatime('picker')->set('disable', $disabledHours);

This will generate a JavaScript error at this line:

TypeError: self.$current is undefined
if (typeof self.$current[cmd['c']] === 'function') {

Would it be possible? Or... Any pointers are welcome 😄

I fail to understand the title for demo "Call to a function that returns an animate() with a callback and executes before and after callbacks", using the following function:

function the_one_with_expr($data)
{
    return
        PheryResponse::factory('.test2')
        ->css(array('backgroundColor' => 'red', 'color' => '#fff'))
        ->html('<pre>'. strip_tags($data['new-onthefly-var']) . '</pre>')
        ->show()
        ->merge(thisone($data));
}

What does "an animate()" mean?

First, thanks for being so helpful before...

I was wondering if you could post a sample on how to use the subscribe feature. I'm developing a small social network and I'd like to publish/broadcast to the user I'm friending. i.e. I have an icon in the toolbar I'd like to change to a flag when a new friend request is made. e.g. I make a friend request and my friend recieves a notification of this request, it doesn't have to show a message, all I need to do is change the icon to a flag.

Hope this makes sense and again thanks for a great library...

phery is sweet.

I wish to construct an linkto but with an image tag. User clicks icon and things happen (specifically a form is generated and displayed through a jquery window).

This:

    <?php echo phery::link_to("<img src='/Graphics/colorPanel.18x18.png' align='right' />", 'test2', array('confirm' => 'Are  you sure?', 'tag' => 'a', 'args' => array('align =' => 'right','href =' => 'alert(\"test\");'))); ?>     

doesn't work. I get my icon but also the "a" tag is output. I tried this:

    <?php echo phery::link_to("nada", 'test2', array('confirm' => 'Are you sure?', 'tag' => 'img', 'src= ' => '/Graphics/colorPanel.18x18.png', ... 

which fails.

It appears the linkto method may need some work do do this, unless there's a work around that someone might suggest?

Just wondering/looking for confirmation, would it be possible to have PHP send back an attachment as 'response' to a Phery request?

For example, I have a HTML form which is used to configure a certain download. After submitting/POSTing the form using Phery, the user should be presented a file download.

Experimented a bit and simply sending out some headers instead of returning the Phery response does not work.

$attachmentFilename = sprintf('%s-%s.xml', 'fileName', strftime('%Y%m%d-%H%M%S', time()));
$content = '<root><someXML/></root>;
header("Content-Type: application/xml");
header("Content-Transfer-Encoding: binary");
header(sprintf('Content-Disposition: attachment; filename=%s', $attachmentFilename));
header(sprintf('Content-Length: %d', mb_strlen($content, '8bit')));

echo $content;

I googled around a bit and the most common work around is redirect the user to a specific URL which deals with pushing the attachment, for example: domain.ext/file-controller/download/file/$temporaryFilename.ext

@pocesar, can you confirm that sending out an attachment triggering a "save as" dialog is not possible with Phery (as it uses $.ajax in the background to submit the requests)..?

Numerous periods (".") are missing from the README. For example, 3 periods are missing in the section on phery.remote():

Calls an AJAX function directly, without binding to any existing elements, the DOM element is created and removed on-the-fly If directCall is false, it will return a jQuery a element, if not, it will return an jqXHR object

function_name: string, name of the alias defined in Phery::instance()->set() inside PHP
args: object or array or variable, the best practice is to pass an object, since it can be easily accessed later through PHP, but any kind of parameter can be passed, from strings, ints, floats, and can also be null (won't be passed through ajax)
attr: object, set any additional information about the DOM element, usually for setting another href to it. eg: {href: '/some/other/url?p=1'}
direct_call: boolean, defaults to true, setting this to false, will return the created DOM element (invisible to the user) and can have events bound to it, but will be removed right after the response is processed

phery
.remote('remote', {'key':'value'}, {'href': '/new/url'}, false)
.on({
    'phery:done': function(){
        $('body').append($(this));
    }
})
.phery('remote');

When setting direct_call to false, the returned element can be reused many times, using phery('remote'), to explicitly remove it, you need to call phery('remove')

If you wish to remove it as soon as the call ends, pass in the attr parameter, the temp option:

> phery.remote('remote', {'id': 1}, {'temp': true}, false).phery('remote');

If direct_call is undefined or true (the default) the element is removed and cleaned after each remote call.

There should be periods:
Before "If directCall"
After "jqXHR object"
After "to call phery('remove')"

Problem 1
    - Installation request for phery/phery ~2.5.6 -> satisfiable by phery/phery[2.5.6].
    - phery/phery 2.5.6 requires ext-jquery >=1.8 -> the requested PHP extension jquery is missing from your system

What is the ext-jquery extension?

The documentation of phery.remote() starts with:

Calls an AJAX function directly, without binding to any existing elements, the DOM element is created and removed on-the-fly

I do not see which DOM element this refers to (I am looking for a function to manually invoke a Phery PHP function from JavaScript).

Hi!
Im having a problem with click event.
Is there a possibility to disallow click trigger before the first event is finished.
Problem is if guest clicks fast for example 3 times, then phery ajax function will run 3 times in queue.

In jQuery there are .stop(true, true) and .one() for these kind of issues. But how can I disallow this behaviour with phery?

Since PSR-0 is marked as deprecated, support for PSR-4 which involves namespaces and per-file classes would be nice.

While working at #17 in a separate branch, some inconsistencies were identified in the package name:

• name on Packagist is phery/phery
• name in composer.json is phery/phery.js

So what is it? I guess it would be phery/phery.

Additionally you might want to condsider to move the package away from your personal GitHub account to its own 'phery' organization on GitHub. Also see this motivation.

I am currently looking at Phery to replace Xajax.

Using Xajax we used something like: xajaxJavascriptFunctionName("stringArgument", 2, $("#elementId").data());

Notice the last parameter, this would assemble an array of all HTML5 data attributes of a specific HTML element at runtime and hand them over to the PHP function invoked at the backend.

How would this be possible with Phery, after some experiments I am wondering what would be considered a best practice?

I tried (no success):

<button data-phery-remote="pheryFunctionName" data-phery-target="/ajax/process" data-phery-args=$("#elementId").data();>Submit request with runtime arguments</button>

Then tried (works, but obviously two requests are fired to /ajax/process)

<button data-phery-remote="pheryFunctionName" data-phery-target="/ajax/process" data-phery-args="staticArgument" onclick="$(this).phery().remote($('#elementId').data());">Submit request with runtime arguments using onclick</button>

Then tried to append the run-time arguments (to potentially used static arguments) before firing the request:

<button data-phery-remote="pheryFunctionName" data-phery-target="/ajax/process" data-phery-args="staticArgument" onclick="$(this).phery().append_args($('#elementId').data());">Submit request with appended runtime arguments using onclick()</button>

The last approach seems to work, but is this the advised way to realise sending over 'runtime' values as arguments to the PHP backend? It is not 'unobtrusive' anymore. Maybe I am looking for some kind of unobtrusive data-phery-args-appender="$('#elementId').data()" or `data-phery-args-setter="$('#elementId').data()", but did not find it...

demo.php has a fixed zone bottom right to display exceptions. By default that zone only contains a "Clear" item allowing to clear exceptions. It is therefore... unclear what this item does until exceptions appear.

Solution

The ideal would be to hide this item until a first exception appears.

A simpler solution would be to relabel to something like "Clear exceptions (if any)".

When trying to load a script URL like

 $response->getScript('test.js');

The HTML response does not contain ANY reference to 'test.js'. How is this supposed to work?

This works:

$response->include_script($files)

But I would like to be able to use a callback function that is called when the script is loaded, which getScript() provides:

 $response->getScript('jqueryMaskLibrary.js', new PheryFunction('console.log("mask library is loaded, please go ahead and use it");');

This isn't really an issue but more of a question... Please tell me how I can do this... Really urgent please!!!

func1()
{
$response = PheryResponse::factory();
$r = $this->func2();
//I need the Json results here...
$response->jquery('.main)->html($contents');

return $response;
}

func2()
{
$response = PheryResponse::factory();
$response->getJSON($url);
return $response;
}

demo.php contains:

The package (2.7.2) does not contain a colorbox/ directory, therefore this causes 404 errors when loading the page.

Recent activity in this repo confused me. Our application which uses Phery does NOT support jQuery 3.0 yet, but has been using Phery 3.0.0 alpha 1 for a while.

2176ce7 seem to start with only supporting jQuery 3.0 in Phery 3.0.0 alpha 2, but this seems to have also landed in 3.0.0 alpha 1...

Is there a way to have a "stable" 3.0.0 alpha 1 with support for jQuery < 3.0? (so can the commit be reverted for tagged version 3.0.0 alpha 1?

For some reason, when trying to pass an array of integers, booleans and strings to PHP using Phery, they all end up to be strings:

<input type="text"
  id="elementID"
  value="10" 
  data-parameter-integer="10"
  data-parameter-boolean-true="true"
  data-parameter-boolean-false="false"
  data-parameter-string="string" />

$("#elementID").change(function() {
    console.log($(this).data()); //Shows an object
    phery.remote("remoteFunction", $(this).data() );
} );

When outputting the parameters received by PHP, this results in:

array(4) {
  ["parameterInteger"] => string(2) "10"
  ["parameterBooleanTrue"] => string(4) "true"
  ["parameterBooleanFalse"] => string(5) "false"
  ["parameterString"] => string(6) "string"
}

The phery.remote() and jquery.data() documentation clearly indicate this approach should work and the parameter types should be preserved in PHP. Any idea why the values are converted to string? Maybe because they are sent as POST / application/x-www-form-urlencoded? I had a look at the involved functions.per_data() function, and that seems to be responsible to do what I expect...

UPDATE
All values that are sent using GET/POST are strings. Is there a way to force Phery to use JSON to ensure the data types of the submitted values do not get lost?

The documentation for Phery::set() reads:

set( array $functions )

Sets the functions to respond to the ajax call. For security reasons, these functions should not be reacheable through POST/GET requests. These will be set only for AJAX requests as it will only be set in case of an ajax request, to save resources.

You may set the config option "set_always_available" to true to always register the functions regardless of if it's an AJAX function or not going on.

The answer/process function, should have the following structure:

function func($ajax_data, $callback_data, $phery){
  $r = new PheryResponse; // or PheryResponse::factory();

  // Sometimes the $callback_data will have an item called 'submit_id',
  // is the ID of the calling DOM element.
  // if (isset($callback_data['submit_id'])) {  }
  // $phery will be the current phery instance that called this callback

  $r->jquery('#id')->animate(...);
  return $r; //Should always return the PheryResponse unless you are dealing with plain text
}

Parameters

$functions
array
$functions An array of functions to register to the instance.

array(
  'function1' => 'function',
  'function2' => array($this, 'method'),
  'function3' => 'StaticClass::name',
  'function4' => array(new ClassName, 'method'),
  'function5' => function($data){}
);

Returns
Phery

Which ajax call this refers to is unclear. The description of $functions suggests the elements should be functions, but that is not always the case, as seen in the first 3 elements. This also fails to specify that the array must be string-indexed. This is mentioned in the README's take on that function, which uses the synopsis "Phery::instance()->set(array $functions)":

Register the functions that will be triggered by AJAX calls. The key is the function alias, the value is the function itself.

<?php
    function outside($ajax_data, $callback_data){
        return PheryResponse::factory();
    }

    class classy {
        function inside($ajax_data, $callback_data){
            return PheryResponse::factory();
        }

        static function inside_static($ajax_data, $callback_data){
            return PheryResponse::factory();
        }
    }

    $class = new classy();

    Phery::instance()->set(array(
        'alias' => function(){
            return PheryResponse::factory();
        },
        'outside' => 'outside',
        'class' => array($class, 'inside'),
        'class' => 'classy::inside_static',
        'namespaced' => 'namespaced\function'
    ));
?>

Callback/response function comprises of:

<?php
    function func($ajax_data, $callback_data, $phery_instance){
        // $ajax_data = data coming from browser, via AJAX
        //
        // $callback_data = can have anything you specify, plus additional information, like **submit_id** that
        // comes automatically from the AJAX request, containing the ID of the calling DOM element, if has an id="" set
        //
        // $phery_instance = the current instance of Phery
        //
        return PheryResponse::factory(); // In most cases, you'll want to return a PheryResponse object
    }
?>

I do not know what the last sentence was meant to read, but it is invalid as it stands. Either a whole comprises parts, or a whole is comprised of parts. x cannot "comprise of" y. French has 2 distinct verbs for that ("est constitué de" vs "comprend").

Demo 1 ("Using HTML 'b' tag, chain commands for css() and animate(), id #special2") has a "See the PHP code" link, like others, which displays:

    function data($ajax_data, $callback_data, Phery $phery)
    {
        return
            PheryResponse::factory($callback_data['submit_id']) // submit_id will have #special2
            ->merge('scrollTop')
            ->data('testing', array('nice' => 'awesome'))
            ->jquery('div.test2')
            ->css(array('backgroundColor' => '#f5a'))
            ->animate(array(
                    'width' => "70%",
                    'opacity' => 0.8,
                    'marginLeft' => "0.6in",
                    'fontSize' => "1em",
                    'borderWidth' => "10px"
                ), 1500, 'linear', PheryFunction::factory(
<<<JSON
    function(){
        $(this).append("<br>yes Ive finished animating and fired from inside PHP as an animate() completion callback using PheryFunction rawr!");
    }
JSON
        ));
    }

The label is misleading, because the code shown is incomplete. The "merge('scrollTop')" call invokes a response defined on line 37:
PheryResponse::factory('html,body')->scrollTop(0)->set_response_name('scrollTop');

Solutions

This could be solved by adding the scrollTop definition to the code shown, but I would recommend to just get rid of that call by integrating the results in the demos using scrollTop. The first demo is currently a challenge to understand as a first demo, chaining no less than 6 calls. It took me a few tens of minutes to develop a fair understanding. And it is unclear to the reader what scrollTop does in the first demo, since it may very well have no effect when running the first demo.

At the very least, the call could be split into a different statement.

Suddenly I realised that docs have no clue how to declare a GET method when generating link_to().

Tried to reverse searching the source .js, but it didnt help. I see that it contains processing of method parameter but I somehow dont understand how to declare it.

To stimulate adoption and increase ease of installation during development, a bower.json file would be useful.

Personally I use https://packagist.org/packages/fxp/composer-asset-plugin to make sure I can include this in my composer.json: bower-asset/phery to have the files as defined in bower.json installed in a public/assets folder.

Hi!
First of all, thank you for the this amazing library!
I have a problem with one of my loop.
I want to run PHP function for each element I have in one specific container. But the attribute(id) will come from every element data-id value. Is this somehow possible with phery? With ->each() I can only use JSON function and no PHP for each element.

->each(PheryFunction::factory(
<<<JSON
function(i, el){
var user_id = $(this).attr('data-id');
var output = HERE SHOULD BE THE PHP FUNCTION WHICH USES user_id
}
JSON
)

Can you help me?

The demo titled "Trigger event 'test' on both divs (and a green on-the-fly div appended at the bottom)" does not append a div, but a li (list item).

Note that this example is not easy to follow; it operates both at the very top and at the bottom and at the bottom - in fact, at the bottom of the list. It would be best to separate this from the other demos.

Hello,

In the readme you want people to use jQuery 1.5 but in phery.js you still use livequery. The live method is added since jQuery 1.3.

Why do you keep the plugin?

The README does not really document which arguments are received by callbacks for phery.on(): https://github.com/pheryjs/phery#pheryonevent-cb

For example, nothing is said of the status argument of fail's callback.

phery.js contains some documentation of the events and their callbacks. The types of the callback arguments are specified there.

The fifth demo, which calls a JS function passing data from PHP, is called:

Call to an existing javascript function an array of integers

This should read:

Pass to an existing javascript function an array of integers

or:

Pass an array of integers to an existing javascript function

To stimulate adoption and increase ease of deployment during production, registration of the Javascript files at a CDN like http://www.cdnjs.com is useful.

In phery 2.7.3, the version is declared as 2.7.2. This can be seen in Phery.php:
* @version 2.7.2

This is also visible in the version 3 branch.
The repository should not contain the version. It should be defined when building packages.

Hey,

it's not really an issue, just a question: I'm using a plugin for html5 pushstate event and such and then I'm loading the page via ajax. Is there any way to replace this ajax request with a Phery request so I can build the whole page with Phery? I haven't really got the time to run through the whole code, but basically the only thing I want is loading an url with ajax but on server side it would act like it was a Phery request (like if I had clicked on a link or something).

Thanks!

The demo titled "On-purpose 404 ajax call" appears to be broken. When clicking on "Trigger global fail and change background to red", nothing visible happens that I can see.

Firebug does not allow tracing the fail event's callback, but it is executed. $loading does get the error class added, however $loading does not show.

The first demo contains:

Using HTML 'b' tag, chain commands for css() and animate(), id #special2
Test data and check it on callback phery:always
See the PHP code

The first line is the demo's title. The second line must be clicked to launch the demo. The last line must be clicked to toggle display of PHP code.
The last line's appearance makes it clear that it is clickable. This is unfortunately not the case with the second line, which in fact has the same appearance as the first line, which is not clickable. It could be argued that since the label is imperative, the reader should understand that it can be clicked, but:

1. The first line is also imperative, and is not designed to be clicked
2. "Test data" could be interpreted as a noun phrase, since "test" can be an adjective. This is particularly likely since "data" is never discussed. This could be avoided by putting "data" in italics, or by substituting "data" with "the data function".

Note that while it is clearer how to launch for most of the following examples, there are several more complex cases at the end where it is not clear for the user what should be done to see the demonstration.

Currently, one can do

$parameters = new stdClass();
$parameters->foo = 'bar';
$parameters->min = 0;
$parameters->max = 10;

PheryResponse::factory('#elementId')->javascriptFunction($parameters);

The PheryResponse::typeCast() function will take care of encoding the provided $parameters object to JSON and hand them over the the client-side. Great!

Limitation
However, when trying to handover JavaScript functions/statements, this approach will (obviously) fail:

$parameters = new stdClass();
$parameters->callbackFunction = 'function() { console.log(this); }'

The string 'function() { console.log(this); }' will treated as a normal string and can not be used. This is a known limitation/feature of JSON, also described here:

• http://stackoverflow.com/questions/1745248/php-json-encode-and-javascript-functions
• http://web.archive.org/web/20080828165256/http://solutoire.com/2008/06/12/sending-javascript-functions-over-json/

Workaround
The workaround for now is to use the name of function that is already defined in JavaScript:

$parameters = new stdClass();
$parameters->callbackFunction = 'functionToInvokeAvailableInJavaScript'

Possible approach / suggestion
The Zend Framework came up with a way to wrap such statements. in a Zend\Json\Expr object and encode it with a flag to detect such expressions. Maybe this approach can be researched / adopted by Phery. I am not aware of other libraries that provide this functionality.