[dev] [commits] [Wiki] changed: Doc/Dev/HordeAjaxApplications/Example

[Sebastian Birnbach]

As far as I could see Boneyard is a special application of Ajax to Skeleton
as it handles cached views on certain data.
It seemed to me that this exceeds the basic Ajax information exchange and
is directed to something specific.

A basic Ajax example would sure be of great value to application builders.
However IMHO the Ajax example should be kept separate from both Skeleton
and Boneyard.

2018-05-27 18:38 GMT+02:00 Jan Schneider <jan at horde.org>:

> It's indeed a boilerplate, a how-to-create-a-horde-application. For me
> this includes an (optional) ajax interface, so developers should get a
> starting point, including best practices, if they want to start a horde
> application from scratch, whether it has an ajax or traditional interface.
>
> Zitat von Ralf Lang <lang at b1-systems.de>:
>
>
> It depends on how we perceive skeleton.
>> I mostly use it as a startup boilerplate, to be mass-renamed by the
>> app-generation command in git-tools. For this very reason I created a
>> more comprehensive SPA example, boneyard, to show how the bits work
>> together. It's mostly distilled from hermes and kronolith dynamic view.
>>
>> It's a matter of "management decision" if we should have the ajaxy stuff
>> in our default application template. I understand traditional view is
>> being deprecated in H6 so this might make sense.
>>
>> Am 27.05.2018 um 15:02 schrieb Jan Schneider:
>>
>>> Shouldn't we put this as an example right into Skeleton?
>>>
>>> Zitat von Ralf Lang (B1 Systems GmbH) <lang at b1-systems.de>:
>>>
>>> rlang  Wed, 23 May 2018 06:24:59 +0000
>>>>
>>>> Modified page:
>>>> https://wiki.horde.org/Doc/Dev/HordeAjaxApplications/Example
>>>> New Revision:  5
>>>> Change log:  Marc Unger's new howto
>>>>
>>>> @@ -1,4 +1,97 @@
>>>> +++ Ajax Example using the skeleton App:
>>>> +
>>>> +This example uses the skeleton app to create an ajax function
>>>> "helloAjax". This function takes a string as argument and returns a
>>>> new string saying "Hello $string".
>>>> +
>>>> +1. Create the Ajax Handler Class:
>>>> +- Create the Application folder:
>>>> +# cd skeleton/lib/Ajax
>>>> +# mkdir Application
>>>> +
>>>> +- Create a new file named "Handler.php" inside the
>>>> skeleton/lib/Ajax/Application folder.
>>>> +The Handler.php will contain the Skeleton_Ajax_Application_Handler
>>>> Class.
>>>> +Add the following content to this file:
>>>> +------
>>>> +<code>
>>>> +<?php
>>>> +
>>>> +class Skeleton_Ajax_Application_Handler extends
>>>> Horde_Core_Ajax_Application_Handler {
>>>> +
>>>> +    public function helloAjax() {
>>>> +        $data = $this->vars->name;
>>>> +        $answer = 'Hello ' . $data;
>>>> +        return $answer;
>>>> +    }
>>>> +}
>>>> +------
>>>> +</code>
>>>> +The argument of the helloAjax function is called "name".
>>>> +To access the arguments you have to call
>>>> "$this->vars->NAME_OF_THE_ARGUMENT".
>>>> +In this example we store the value of "name" in a variable $data:
>>>> +$data = $this->vars->name;
>>>> +Then we create a new string saying "Hello $data" and return this new
>>>> string.
>>>> +
>>>> +2. Load the Skeleton_Ajax_Application_Handler Class:
>>>> +Open the skeleton/lib/Ajax/Application.php file and add the
>>>> following line to the _init() function:
>>>> +------
>>>> +$this->addHandler('Skeleton_Ajax_Application_Handler');
>>>> +------
>>>> +
>>>> +
>>>> +3. Call the helloAjax function via javascript:
>>>> +- Create the skeleton/js folder:
>>>> +# cd skeleton
>>>> +# mkdir js
>>>> +
>>>> +- Create the skeleton/js/skeleton.js file with the following content:
>>>> +------
>>>> +SkeletonCore = {
>>>> +
>>>> +    onDomLoad: function()
>>>> +    {
>>>> +        var myName = 'Foobar';
>>>> +        HordeCore.doAction('helloAjax', {name:
>>>> Object.toJSON(myName)}, {callback: function(result) {
>>>> +            console.log('Ajax answer: ' + result);
>>>> +        }});
>>>> +    }
>>>> +
>>>> +}
>>>> +document.observe('dom:loaded',
>>>> SkeletonCore.onDomLoad.bind(SkeletonCore));
>>>> +------
>>>> +
>>>> +The "myName" variable holds the string we want to send to the
>>>> helloAjax funtion.
>>>> +The helloAjax function is called by "HordeCore.doAction".
>>>> +HordeCore.doAction takes three arguments:
>>>> +1). Name of the Ajax function:
>>>> +the helloAjax function we created in step 1.
>>>> +
>>>> +2). Argument list (in json format) of the Ajax function:
>>>> +the "name" argument we accessed in step 1 via "$this->vars->name".
>>>> +
>>>> +3). A callback function to access the returned data of the Ajax
>>>> function:
>>>> +the "result" variable holds the "Hello $data" string we returned in
>>>> step 1.
>>>> +
>>>> +Inside the callback we print the content of the "result" variable
>>>> (Hello foobar) to the browser console.
>>>> +
>>>> +
>>>> +4. Load the skeleton.js file.
>>>> +Open the skeleton/list.php file and add the following line after
>>>> "$page_output->addScriptFile('tables.js', 'horde');":
>>>> +------
>>>> +<code>
>>>> +$page_output->addScriptFile('skeleton.js');
>>>> +</code>
>>>> +------
>>>> +
>>>> +5. Test if everything works:
>>>> +Access the skeleton app in your browser and open the console. If
>>>> everything worked you'll see the following message: Ajax answer:
>>>> Hello Foobar
>>>> +
>>>> +
>>>> +
>>>> +++ Pre git split
>>>> +
>>>> +*This below is outdated information. Use the horde git-tool command
>>>> to create a new module*
>>>> +
>>>> +
>>>>  Boneyard - an example of a dynamic "skeleton".
>>>>
>>>>  In this article, I will show you some minimal setup for a "horde5
>>>> dynamic view" application as demonstrated by hermes time tracking and
>>>> kronolith calendar
>>>>
>>>
>>>
>>>
>>>
>
>
> --
> Jan Schneider
> The Horde Project
> https://www.horde.org/
>
> --
> dev mailing list
> Frequently Asked Questions: http://wiki.horde.org/FAQ
> To unsubscribe, mail: dev-unsubscribe at lists.horde.org
>