\documentclass{article}
\usepackage{ulem}
\usepackage{graphicx}
\usepackage{hyperref}
\pagestyle{headings}
\begin{document}
\section{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".

\begin{itemize}
\item Create the Ajax Handler Class:


\end{itemize}
\begin{itemize}
\item Create the Application folder:


\end{itemize}
\begin{itemize}
\item cd skeleton/lib/Ajax


\item mkdir Application


\end{itemize}
\begin{itemize}
\item Create a new file named "Handler.php" inside the skeleton/lib/Ajax/Application folder.<br />
The Handler.php will contain the Skeleton\_Ajax\_Application\_Handler Class.<br />
Add the following content to this file:


\end{itemize}

\noindent\rule{\textwidth}{1pt}
<pre><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></pre>
The argument of the helloAjax function is called "name".<br />
To access the arguments you have to call "\$this->vars->NAME\_OF\_THE\_ARGUMENT".<br />
In this example we store the value of "name" in a variable \$data:<br />
\$data = \$this->vars->name;<br />
Then we create a new string saying "Hello \$data" and return this new string.

\begin{itemize}
\item Load the Skeleton\_Ajax\_Application\_Handler Class:<br />
Open the skeleton/lib/Ajax/Application.php file and add the following line to the \_init() function:


\end{itemize}

\noindent\rule{\textwidth}{1pt}
\section{\$this->addHandler('Skeleton\_Ajax\_Application\_Handler');}
\begin{itemize}
\item Call the helloAjax function via javascript:


\end{itemize}
\begin{itemize}
\item Create the skeleton/js folder:


\end{itemize}
\begin{itemize}
\item cd skeleton


\item mkdir js


\end{itemize}
\begin{itemize}
\item Create the skeleton/js/skeleton.js file with the following content:


\end{itemize}

\noindent\rule{\textwidth}{1pt}
<a href="https://wiki.horde.org/SkeletonCore">SkeletonCore</a> = \{

<pre><code>onDomLoad: function\textbackslash\{\}(\textbackslash\{\})
\textbackslash\{\}\{
    var myName = 'Foobar';
    [HordeCore](HordeCore).doAction\textbackslash\{\}('helloAjax', \textbackslash\{\}\{name: Object.toJSON\textbackslash\{\}(myName\textbackslash\{\})\textbackslash\{\}\}, \textbackslash\{\}\{callback: function\textbackslash\{\}(result\textbackslash\{\}) \textbackslash\{\}\{
        console.log\textbackslash\{\}('Ajax answer: ' + result\textbackslash\{\});
    \textbackslash\{\}\}\textbackslash\{\}\}\textbackslash\{\});
\textbackslash\{\}\}
</code></pre>
\section{\}<br />
document.observe('dom:loaded', <a href="https://wiki.horde.org/SkeletonCore">SkeletonCore</a>.onDomLoad.bind(<a href="https://wiki.horde.org/SkeletonCore">SkeletonCore</a>));}
The "myName" variable holds the string we want to send to the helloAjax funtion.<br />
The helloAjax function is called by "<a href="https://wiki.horde.org/HordeCore">HordeCore</a>.doAction".<br />
<a href="https://wiki.horde.org/HordeCore">HordeCore</a>.doAction takes three arguments:<br />
1). Name of the Ajax function:<br />
the helloAjax function we created in step 1.

2). Argument list (in json format) of the Ajax function:<br />
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:<br />
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.

\begin{itemize}
\item Load the skeleton.js file.<br />
Open the skeleton/list.php file and add the following line after "\$page\_output->addScriptFile('tables.js', 'horde');":


\end{itemize}

\noindent\rule{\textwidth}{1pt}
<pre><code>
\$page\_output->addScriptFile('skeleton.js');
</code></pre>

\noindent\rule{\textwidth}{1pt}
\begin{itemize}
\item Test if everything works:<br />
Access the skeleton app in your browser and open the console. If everything worked you'll see the following message: Ajax answer: Hello Foobar


\end{itemize}
\section{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

Pre-requisite<br />
We have a working git checkout of a 5.2 or master installation of horde with some authentication and prefs backend working and the migrations inplace.<br />
If your setup did not involve editing install\_dev.conf, you probably have something else and I cannot guarantee this walkthrough will work for you without adopting some parts.

Let's generate a fresh application called boneyard

<pre><code>
maintaina:/srv/git/horde5-webmail/horde \# php framework/bin/horde-generate-module boneyard "Ralf Lang <lang@b1-systems.de>"
Started new Module in /srv/git/horde5-webmail/horde/boneyard!

Register the new Module with a file in the config/registry.d directory:

<?php
\$this->applications['boneyard'] = array('name' => \_("Boneyard"));
</code></pre>
We put a file with this oneliner into the directory as advised

maintaina:/srv/git/horde5-webmail/horde \# vim horde/config/registry.d/boneyard.php

Now let's re-run the script generating the links for the git checkout installation

<pre><code>
maintaina:/srv/git/horde5-webmail/horde \# php framework/bin/install\_dev
EMPTYING old web directory /srv/www/vhosts.d/horde.ralf-lang.de

LINKING horde
Setting static directory permissions...
LINKING applications to web directory /srv/www/vhosts.d/horde.ralf-lang.de
LINKING sam
LINKING luxor
[.. snip ..]
LINKING pastie
LINKING ingo
LINKING boneyard
LINKING hvview
LINKING sesha
LINKING passwd
LINKING operator
LINKING nag
LINKING gollem
LINKING jonah
LINKING sueporter
LINKING ulaform

LINKING framework
[ INFO ] Source directory: /srv/git/horde5-webmail/horde/framework
[ INFO ] Framework destination directory:
/srv/www/vhosts.d/horde.ralf-lang.de/libs
[ INFO ] Horde directory: /srv/www/vhosts.d/horde.ralf-lang.de
[ INFO ] Create symbolic links: Yes

[ INFO ] Package(s) to install: ALL (129 packages)
[ INFO ] Installing package ActiveSync
[.. snip ..]
[ INFO ] Installing package xxhash
</code></pre>
Now boneyard is set up in your web-accessible dir.<br />
Let's make the config dir web-writeable

<pre><code>
chown wwwrun:www /srv/www/vhosts.d/horde.ralf-lang.de/boneyard/config
</code></pre>
This is for SUSE - debian or redhat may have different user/group for the web server.

Next go to \$yourdomain/admin/config/ the admin panel and generate the conf.php file by clicking on the "boneyard" entry and then the "create boneyard config" button.<br />
At this point, we do not care about the actual contents of this config - the defaults are just fine.

If you only see "horde" and some library names, you most probably have not edited registry.local.php to contain something like:

<pre><code>
<?php
// By default, applications are assumed to live within the base Horde
// directory (e.g. their fileroot/webroot will be automatically determined
// by appending the application name to Horde's 'fileroot'/'webroot' setting.
// If your applications live in a different base directory, defining these
// variables will change the default directory without the need to change
// every application's 'fileroot'/'webroot' settings.
\$app\_fileroot = '/srv/www/vhosts.d/horde.ralf-lang.de/';
</code></pre>
Now "Boneyard" should appear in your horde topbar with some bogus buttons and content

Let's create the structure of a "dynamic" application

\begin{itemize}
\item lib/Ajax.php - The Boneyard Ajax base class to load locale- and setting-dependent content into the browser's javascript


\item lib/Ajax/Application/Handler/Example.php - A handler for Ajax requests to load data from the server -- we skip that for now


\item lib/View/Sidebar.php - Boneyard\_View\_Sidebar - a sidebar for the dynamic view


\item template/dynamic/sidebar.html.php - The template used by the sidebar view


\item template/dynamic/index.inc - The main template of the dynamic view


\item template/dynamic/example1.inc - One of our two example views in this demo


\item template/dynamic/example2.inc - One of our two example views in this demo


\item js/boneyard.js - The <a href="https://wiki.horde.org/BoneyardCore">BoneyardCore</a> object which contains the main click handler etc


\end{itemize}
We also need to touch the index.php file to enable the dynamic view and the lib/Application.php file to advertise that dynamic view exists.

See <a href="https://github.com/ralflang/horde-boneyard">https://github.com/ralflang/horde-boneyard</a> to view the code in detail.

\end{document}
