Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

examples is a top level dir

git-svn-id: http://svn.php.net/repository/pear/packages/HTML_AJAX/trunk@199133 c90b9560-bf6c-de11-be94-00142212c4b1
  • Loading branch information...
commit a4fb3748262ef9c6cc7d4992d0144bf5fbb12acb 1 parent 4502a17
Joshua Eichorn authored
View
13 docs/examples/README
@@ -1,13 +0,0 @@
-These examples cover basic AJAX usage
-
-3 front end examples are provided
-proxyless_usage.php - Using HTML_AJAX in standalone mode, possible doesn't require PHP or any backend HTML_AJAX classes
-proxy_usage_inline_javascript.php - Single file proxy style usage
-proxy_usage_server.php - Multi-file proxy usage, either server file could be used with this example
-
-2 server examples are provided
-server.php - Basic server operation, serving ajax calls and client lib requests
-auto_server.php - Advanced server operation, only create php classes as needed
-
-Other Example files:
-test_speed.php - A basic setup for measuring the speed of calls
View
47 docs/examples/auto_server.php
@@ -1,47 +0,0 @@
-<?php
-/**
- * Advanced usage of HTML_AJAX_Server
- * Allows for a single server to manage exporting a large number of classes without high overhead per call
- * Also gives a single place to handle setup tasks especially useful if session setup is required
- *
- * The server responds to ajax calls and also serves the js client libraries, so they can be used directly from the PEAR data dir
- * 304 not modified headers are used when server client libraries so they will be cached on the browser reducing overhead
- *
- * @category HTML
- * @package AJAX
- * @author Joshua Eichorn <josh@bluga.net>
- * @copyright 2005 Joshua Eichorn
- * @license http://www.opensource.org/licenses/lgpl-license.php LGPL
- * @version Release: @package_version@
- * @link http://pear.php.net/package/HTML_AJAX
- */
-
- // include the server class
-include 'HTML/AJAX/Server.php';
-
-
-// extend HTML_AJAX_Server creating our own custom one with init{ClassName} methods for each class it supports calls on
-class TestServer extends HTML_AJAX_Server {
- // this flag must be set to on init methods
- var $initMethods = true;
-
- // init method for the test class, includes needed files an registers it for ajax
- function initTest() {
- include 'test.class.php';
- $this->registerClass(new test());
- }
-
- // init method for the test class, includes needed files an registers it for ajax
- function initTest2() {
- include 'test2.class.php';
- $this->registerClass(new test2());
- }
-
-}
-
-// create an instance of our test server
-$server = new TestServer();
-
-// handle requests as needed
-$server->handleRequest();
-?>
View
55 docs/examples/behavior_test.html
@@ -1,55 +0,0 @@
-<!DOCTYPE html
-PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
-"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
-<head>
- <title>
- How to use behavior.js
- </title>
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
- <script src="cssQuery-p.js" type="text/javascript"></script>
- <script src="behavior.js" type="text/javascript"></script>
-<script type="text/javascript">
-Behavior.register(
- ".alert",
- function(element) {
- element.onclick = function(){
- alert('I alert on click');
- }
- }
- );
-
- Behavior.register(
- ".annoy",
- function(element) {
- element.onmouseout = function(){
- alert('I alert on mouseout, very annoying');
- }
- }
- );
-
- Behavior.register(
- ".red",
- function(element) {
- element.onmouseover = function(){
- element.style.backgroundColor = 'red';
- }
- }
- );
-</script>
-</head>
-
-<body>
- <div style="border: 1px solid black; width: 50%; margin: 5em">
- <div class="alert">
- I am a div that alerts when you click on me - notice I just have class="alert" to make it work :)
- </div>
- <div class="annoy">
- I am a div that alerts when you mouseover me - class="annoy" makes it work
- </div>
- <div class=" alert red">
- I am a div that alerts when you click on me and the background turns red on mouseover - class="alert red"
- </div>
- </div>
-</body>
-</html>
View
154 docs/examples/proxy_usage_inline_javascript.php
@@ -1,154 +0,0 @@
-<?php
-/**
- * Example of Using HTML_AJAX in proxy operation
- *
- * All AJAX calls are handled by this same file and the proxy js is outputed in a js block directly in this script
- * This is a use case very similar to Sajax (Sajax registers functions not objects)
- *
- * The only needed interaction is creation of a new object from the proxy defintion, all AJAX calls happen transparently from
- *
- * If you want to perform async calls a callback object must be passed to the constructor of the object
- *
- * The client JavaScript library is provided by server.php, you could also copy HTML_AJAX.js (all js files combined) or the seperate js files into your webroot
- * from the PEAR data dir and src them directly
- *
- * This example also registers a custom error handler, without this handler errors float out of the app as an Exception
- *
- * An example debugging event listener is also shown
- *
- * @category HTML
- * @package AJAX
- * @author Joshua Eichorn <josh@bluga.net>
- * @copyright 2005 Joshua Eichorn
- * @license http://www.opensource.org/licenses/lgpl-license.php LGPL
- * @version Release: @package_version@
- * @link http://pear.php.net/package/HTML_AJAX
- */
-
-// include the main HTML_AJAX class
-include 'HTML/AJAX.php';
-
-// our simple test class
-include 'test.class.php';
-
-
-
-// create an instance of HTML_AJAX
-$ajax = new HTML_AJAX();
-// register an instance of the test class
-$ajax->registerClass(new test());
-
-// handle and ajax call, if one is made die, else continue processing
-if ($ajax->handleRequest()) {
- die();
-}
-?><html>
-<head>
-
-<!-- the entire client library can be retreived in one call using the all keyword, or each piece can be requested like below -->
-<script type='text/javascript' src="server.php?client=Main"></script>
-<script type='text/javascript' src="server.php?client=Dispatcher"></script>
-<script type='text/javascript' src="server.php?client=HttpClient"></script>
-<script type='text/javascript' src="server.php?client=Request"></script>
-<script type='text/javascript' src="server.php?client=JSON"></script>
-
-<script type='text/javascript'>
-<?php
- // generate proxy definition javascript for all registered class
- echo $ajax->generateJavascriptClient();
-?>
-
-// definition of the callback javascript class, used to handle async requests
-function callback() {}
-callback.prototype = {
- echo_string: function(result) {
- document.getElementById('target').innerHTML = result;
- },
- slow_echo_string: function(result) {
- document.getElementById('target').innerHTML = result;
- },
- error_test: function(result) {
- document.getElementById('target').innerHTML = result;
- }
-}
-
-// function used to clear out the target div
-function clearTarget() {
- document.getElementById('target').innerHTML = 'clear';
- document.getElementById('eventLog').innerHTML = 'clear';
- document.getElementById('error').innerHTML = 'clear';
-}
-
-// register a custom error handler
-HTML_AJAX.onError = function(e) {
- msg = "\n\n";
- for(var i in e) {
- msg += i + ':' + e[i] +"\n";
- }
- document.getElementById('error').innerHTML += msg;
-}
-
-// register custom event handlers, but lets keep the old ones so we still have that automatic loading message
-var onOpen = HTML_AJAX.onOpen;
-var onLoad = HTML_AJAX.onLoad;
-
-HTML_AJAX.onOpen = function(request) {
- onOpen();
- document.getElementById('eventLog').innerHTML += "Open: "+request.className+'::'+request.methodName+"\n";
-}
-HTML_AJAX.onSend = function(request) {
- document.getElementById('eventLog').innerHTML += "Send: "+request.className+'::'+request.methodName+"\n";
-}
-HTML_AJAX.onProgress = function(request) {
- document.getElementById('eventLog').innerHTML += "Progress: "+request.className+'::'+request.methodName+"\n";
-}
-HTML_AJAX.onLoad = function(request) {
- onLoad();
- document.getElementById('eventLog').innerHTML += "Load: "+request.className+'::'+request.methodName+"\n";
-}
-
-</script>
-</head>
-<body>
-<script type="text/javascript">
-// create a proxy in sync mode
-var syncProxy = new test();
-// create a proxy in async mode
-var asyncProxy = new test(new callback());
-
-// run a sync call and set its results to the target div
-function syncCall() {
- document.getElementById('target').innerHTML = syncProxy.echo_string("I'm a sync call");
-}
-
-// run a sync call, callback class will handle its results
-function asyncCall() {
- asyncProxy.echo_string("I'm a async call");
-}
-
-// run a sync call, callback class will handle its results
-// the purpose of this slow call is to show off the built in loading messaging
-function slowAsyncCall() {
- asyncProxy.slow_echo_string("I'm a slow async call");
-}
-
-// run a sync call, callback class will handle its results
-function serverErrorExample() {
- asyncProxy.error_test("I'm an error generated by trigger error in test.class.php");
-}
-</script>
-<ul>
- <li><a href="javascript:clearTarget()">Clear Target</a></li>
- <li><a href="javascript:syncCall()">Run Sync Echo call</a></li>
- <li><a href="javascript:asyncCall();">Run Async Echo call</a></li>
- <li><a href="javascript:slowAsyncCall();">Run Slow Async Echo call (sleep on server to emulate slow processing)</a></li>
- <li><a href="javascript:serverErrorExample();">Run a call where an error is generated on the server</a></li>
-</ul>
-<div style="white-space: pre; padding: 1em; margin: 1em; width: 300px; height: 400px; border: solid 2px black; overflow: auto; float: right;" id="error">Error Target</div>
-
-<div style="white-space: pre; padding: 1em; margin: 1em; width: 500px; height: 300px; border: solid 2px black; overflow: auto;" id="target">Target</div>
-
-<div style="white-space: pre; padding: 1em; margin: 1em; width: 500px; height: 400px; border: solid 2px black; overflow: auto;" id="eventLog">Event Log
-</div>
-</body>
-</html>
View
73 docs/examples/proxy_usage_server.php
@@ -1,73 +0,0 @@
-<?php
-/**
- * Example of Using HTML_AJAX in proxy operation
- *
- * All AJAX calls are handled by the auto_server.php file, server.php could also be used, the differences between the two are covered in those files
- * This is a use case very similar to JPSpan (JPSpan only has a server.php equivalent)
- *
- * The only needed interaction is creation of a new object from the proxy defintion, all AJAX calls happen transparently from there
- *
- * If you want to perform async calls a callback object must be passed to the constructor of the object
- *
- * The client JavaScript library is provided by auto_server.php, you could also copy HTML_AJAX.js (all js files combined) or the seperate js files into your webroot
- * from the PEAR data dir and src them directly. You can use multiple includes of the component files or use the all flag to get them all at once.
- *
- * @category HTML
- * @package AJAX
- * @author Joshua Eichorn <josh@bluga.net>
- * @copyright 2005 Joshua Eichorn
- * @license http://www.opensource.org/licenses/lgpl-license.php LGPL
- * @version Release: @package_version@
- * @link http://pear.php.net/package/HTML_AJAX
- */
-
-?><html>
-<head>
-
-<!-- These two calls can be combined into one call if wanted, but its not recomended since it will hurt caching as you might want stubs of multiple classes -->
-<script type='text/javascript' src="auto_server.php?client=all"></script>
-<!-- Stub is passed the class you want the proxy definition for, you can also use all to get every registered class but that create those auto server
- has to instanciate every class where here only the class used on this page has to be instanciated -->
-<script type='text/javascript' src="auto_server.php?stub=test"></script>
-
-<script type='text/javascript'>
-// definition of the callback javascript class, used to handle async requests
-function callback() {}
-callback.prototype = {
- echo_string: function(result) {
- document.getElementById('target').innerHTML = result;
- }
-}
-
-// function used to clear out the target div
-function clearTarget() {
- document.getElementById('target').innerHTML = 'clear';
-}
-</script>
-</head>
-<body>
-<script type="text/javascript">
-// create a proxy in sync mode
-var syncProxy = new test();
-// create a proxy in async mode
-var asyncProxy = new test(new callback());
-
-// run a sync call and set its results to the target div
-function syncCall() {
- document.getElementById('target').innerHTML = syncProxy.echo_string("I'm a sync call");
-}
-
-// run a sync call, callback class will handle its results
-function asyncCall() {
- asyncProxy.echo_string("I'm a async call");
-}
-</script>
-<ul>
- <li><a href="javascript:clearTarget()">Clear Target</a></li>
- <li><a href="javascript:syncCall()">Run Sync Echo call</a></li>
- <li><a href="javascript:asyncCall();">Run Async Echo call</a></li>
-</ul>
-
-<div style="white-space: pre; padding: 1em; margin: 1em; width: 600px; height: 300px; border: solid 2px black; overflow: auto;" id="target">Target</div>
-</body>
-</html>
View
111 docs/examples/proxyless_usage.php
@@ -1,111 +0,0 @@
-<?php
-/**
- * Example of Using HTML_AJAX in proxyless operation
- *
- * This is the simplest way to use HTML_AJAX if your just using grab and replace functions you don't even need a server
- * You need every javascript file except JSON which is optional and is only needed if your using that encoding
- *
- * The proxyless api is provided by Main.js
- *
- * There are 3 main methods and 2 properties to the proxyless api, they all exist as static methods on HTML_AJAX
- * HTML_AJAX.grab(url)
- * HTML_AJAX.replace(id,url) or HTML_AJAX.replace(id,class,method,arg1,arg2,etc)
- * HTML_AJAX.call(class,method,callback,arg1,arg2,etc)
- *
- * HTML_AJAX.defaultServerUrl = 'serverurl';
- * HTML_AJAX.defaultEncoding = 'Null';
- *
- * The api is demonstrated below, server.php is used for call examples and to load the needed js files
- *
- * @category HTML
- * @package AJAX
- * @author Joshua Eichorn <josh@bluga.net>
- * @copyright 2005 Joshua Eichorn
- * @license http://www.opensource.org/licenses/lgpl-license.php LGPL
- * @version Release: @package_version@
- * @link http://pear.php.net/package/HTML_AJAX
- */
-?>
-<html>
-<head>
-
-<script type='text/javascript' src="server.php?client=main"></script>
-<script type='text/javascript' src="server.php?client=dispatcher"></script>
-<script type='text/javascript' src="server.php?client=HttpClient"></script>
-<script type='text/javascript' src="server.php?client=Request"></script>
-<script type='text/javascript' src="server.php?client=json"></script>
-
-</head>
-<body>
-<script type="text/javascript">
-function clearTarget() {
- document.getElementById('target').innerHTML = 'clear';
-}
-
-
-// Grab is the simplest usage of HTML_AJAX you use it to perform a request to a page and get its results back
-// It can be used in either Sync mode where it returns directory or with a call back, both methods are shown below
-var url = 'README';
-function grabSync() {
- document.getElementById('target').innerHTML = HTML_AJAX.grab(url);
-}
-
-function grabAsync() {
- HTML_AJAX.grab(url,grabCallback);
-}
-
-function grabCallback(result) {
- document.getElementById('target').innerHTML = result;
-}
-
-
-// replace can operate either against a url like grab or against a remote method
-// if its going to be used against a remote method defaultServerUrl needs to be set to a url that is exporting the class its trying to call
-// note that replace currently always works using Sync AJAX calls, an option to perform this with Async calls may become an option at some further time
-// both usages are shown below
-
-HTML_AJAX.defaultServerUrl = 'server.php';
-
-function replaceUrl() {
- HTML_AJAX.replace('target',url);
-}
-
-function replaceFromMethod() {
- HTML_AJAX.replace('target','test','echo_string','Im a method call replacement');
-}
-
-
-// call is used to call a method on a remote server
-// you need to set HTML_AJAX.defaultServerUrl to use it
-// you might also want to set HTML_AJAX.defaultEncoding, options are Null and JSON, the server will autodetect this encoding from your content type
-// but the return content type will be based on whatever the servers settings are
-// You can use call in either Sync or Async mode depending on if you pass it a callback function
-
-function callSync() {
- HTML_AJAX.defaultEncoding = 'JSON'; // set encoding to no encoding method
- document.getElementById('target').innerHTML = HTML_AJAX.call('test','echo_string',false,'Im text that was echoed');
- HTML_AJAX.defaultEncoding = 'Null'; // return it to default which is Null
-}
-
-function callAsync() {
- HTML_AJAX.call('test','echo_string',callCallback,'Im text that was echoed Async');
-}
-
-function callCallback(result) {
- document.getElementById('target').innerHTML = result;
-}
-
-</script>
-<ul>
- <li><a href="javascript:clearTarget()">Clear Target</a></li>
- <li><a href="javascript:grabSync()">Run Sync Grab Example</a></li>
- <li><a href="javascript:grabAsync()">Run Async Grab Example</a></li>
- <li><a href="javascript:replaceUrl()">Replace with content from a url</a></li>
- <li><a href="javascript:replaceFromMethod()">Replace with content from a method call</a></li>
- <li><a href="javascript:callSync()">Sync Call</a></li>
- <li><a href="javascript:callAsync()">ASync Call</a></li>
-</ul>
-
-<div style="white-space: pre; padding: 1em; margin: 1em; width: 600px; height: 300px; border: solid 2px black; overflow: auto;" id="target">Target</div>
-</body>
-</html>
View
35 docs/examples/server.php
@@ -1,35 +0,0 @@
-<?php
-/**
- * Simplest possible usage of HTML_AJAX_Server
- *
- * The server responds to ajax calls and also serves the js client libraries, so they can be used directly from the PEAR data dir
- * 304 not modified headers are used when server client libraries so they will be cached on the browser reducing overhead
- *
- * @category HTML
- * @package AJAX
- * @author Joshua Eichorn <josh@bluga.net>
- * @copyright 2005 Joshua Eichorn
- * @license http://www.opensource.org/licenses/lgpl-license.php LGPL
- * @version Release: @package_version@
- * @link http://pear.php.net/package/HTML_AJAX
- */
-
- // include the server class
-include 'HTML/AJAX/Server.php';
-
-// include the test class will be registering
- include 'test.class.php';
-
-// create our new server
-$server = new HTML_AJAX_Server();
-
-// register an instance of the class were registering
-$test =& new test();
-$server->registerClass($test);
-
-// handle different types of requests possiblities are
-// ?client=all - request for all javascript client files
-// ?stub=classname - request for proxy stub for given class, can be combined with client but this may hurt caching unless stub=all is used
-// ?c=classname&m=method - an ajax call, server handles serialization and handing things off to the proper method then returning the results
-$server->handleRequest();
-?>
View
30 docs/examples/test.class.php
@@ -1,30 +0,0 @@
-<?php
-/**
- * Test class used in other examples
- * Constructors and private methods marked with _ are never exported in proxies to JavaScript
- *
- * @category HTML
- * @package AJAX
- * @author Joshua Eichorn <josh@bluga.net>
- * @copyright 2005 Joshua Eichorn
- * @license http://www.opensource.org/licenses/lgpl-license.php LGPL
- * @version Release: @package_version@
- * @link http://pear.php.net/package/HTML_AJAX
- */
-class test {
- function test() {
- }
- function _private() {
- }
- function echo_string($string) {
- return $string;
- }
- function slow_echo_string($string) {
- sleep(2);
- return $string;
- }
- function error_test($string) {
- trigger_error($string);
- }
-}
-?>
View
25 docs/examples/test2.class.php
@@ -1,25 +0,0 @@
-<?php
-/**
- * Test class used in other examples
- *
- * @category HTML
- * @package AJAX
- * @author Joshua Eichorn <josh@bluga.net>
- * @copyright 2005 Joshua Eichorn
- * @license http://www.opensource.org/licenses/lgpl-license.php LGPL
- * @version Release: @package_version@
- * @link http://pear.php.net/package/HTML_AJAX
- */
-class test2 {
- function echo_string($string) {
- return $string;
- }
- function slow_echo_string($string) {
- sleep(2);
- return $string;
- }
- function error_test($string) {
- trigger_error($string);
- }
-}
-?>
View
91 docs/examples/test_speed.php
@@ -1,91 +0,0 @@
-<?php
-/**
- * Simple speed test using the null serializer, possibly useful in comparing overhead when tested on local host
- *
- *
- * @category HTML
- * @package AJAX
- * @author Joshua Eichorn <josh@bluga.net>
- * @copyright 2005 Joshua Eichorn
- * @license http://www.opensource.org/licenses/lgpl-license.php LGPL
- * @version Release: @package_version@
- * @link http://pear.php.net/package/HTML_AJAX
- */
- include 'HTML/AJAX.php';
-
- include 'test.class.php';
-
-
-
- $ajax = new HTML_AJAX();
- $ajax->serializer = "Null";
- $ajax->unserializer = "Null";
- $ajax->registerClass(new test());
-
- if ($ajax->handleRequest()) {
- die();
- }
-?><html>
-<head>
-
-<script type='text/javascript' src="server.php?client=all&stub=all"></script>
-</head>
-<body>
-<script type="text/javascript">
-var t = new test();
-var t2 = new test({echo_string: function(){ endCall('Async Echo'); totalA(); }});
-
-var time1;
-var total = 0;
-var count = 0;
-
-function speedTest() {
-
- document.getElementById('target').innerHTML += "10 Sync Calls\n";
- for(var i = 0; i < 10; i++) {
- startCall();
- t.echo_string('Test');
- endCall('Sync Echo');
- }
- document.getElementById('target').innerHTML += "Total: "+total+"\n\n\n";
- total = 0;
-
- document.getElementById('target').innerHTML += "10 Async Calls\n";
- count = 0;
- for(var i = 0; i < 10; i++) {
- setTimeout("runAsync();",500*i);
- }
- total = 0;
-
-}
-function totalA() {
- count++;
- if (count == 10) {
- document.getElementById('target').innerHTML += "Total: "+total+"\n";
- }
-}
-function runAsync() {
- startCall();
- t2.echo_string('Test');
-}
-function startCall() {
- time1 = new Date();
-}
-function endCall(name) {
- var time = 0;
-
- var time2 = new Date();
-
- time = time2.getTime() - time1.getTime();
- total += time;
-
- document.getElementById('target').innerHTML += name+":"+time+"\n";
-}
-
-
-</script>
-<a href="javascript:speedTest()">Start Speed Test</a>
-<pre id="target">
-</pre>
-</body>
-</html>
View
5 docs/todo
@@ -1,5 +0,0 @@
-Autodetect encoding on client and server using Content-type
-Finish up basic usage docs
-Error handling setup in javascript
-Passing php errors to javascript
-Event handling setup in javascript
Please sign in to comment.
Something went wrong with that request. Please try again.