Shout: Continue working on destination edit form

This won't work until ajax.php is fully implemented and the remaining JS bugs are quashed.  But this is close to working....

diff --git a/shout/ajax.php b/shout/ajax.php
new file mode 100644 (file)
index 0000000..27b93f9
--- /dev/null
+++ b/shout/ajax.php
@@ -0,0 +1,44 @@
+<?php
+/**
+ * ajax.php defines an set of brower procedure mechanisms
+ * for the Shout application.
+ *
+ * Copyright 2010 Alkaloid Networks LLC (http://projects.alkaloid.net)
+ *
+ * See the enclosed file COPYING for license information (BSD). If you
+ * did not receive this file, see
+ * http://www.opensource.org/licenses/bsd-license.php.
+ *
+ * @author  Ben Klang <ben@alkaloid.net>
+ * @since   Shout 0.1
+ * @package Shout
+ */
+
+// Need to load Horde_Util:: to give us access to Horde_Util::getPathInfo().
+require_once dirname(__FILE__) . '/lib/Application.php';
+$action = basename(Horde_Util::getPathInfo());
+if (empty($action)) {
+    // This is the only case where we really don't return anything, since
+    // the frontend can be presumed not to make this request on purpose.
+    // Other missing data cases we return a response of boolean false.
+    exit;
+}
+
+try {
+    new Shout_Application();
+} catch (Horde_Exception $e) {
+    /* Handle session timeouts when they come from an AJAX request. */
+    if (($e->getCode() == Horde_Registry::AUTH_FAILURE) &&
+        ($action != 'LogOut')) {
+        //FIXME: The below is certain to break since it relies on classes I did
+        //       not yet copy from IMP.
+        $notification = Horde_Notification::singleton();
+        $shout_notify = $notification->attach('status', array('viewmode' => 'dimp'), 'Shout_Notification_Listener_Status');
+        $notification->push(str_replace('&amp;', '&', Horde_Auth::getLogoutUrl(array('reason' => Horde_Auth::REASON_SESSION))), 'shout.timeout', array('content.raw'));
+        Horde::sendHTTPResponse(Horde::prepareResponse(null, $shout_notify), 'json');
+        exit;
+    }
+
+    Horde_Auth::authenticateFailure('shout', $e);
+}
+

diff --git a/shout/templates/extensions/list.inc b/shout/templates/extensions/list.inc
index 0915a53..5ac07ed 100644 (file)
--- a/shout/templates/extensions/list.inc
+++ b/shout/templates/extensions/list.inc
@@ -37,7 +37,7 @@
             </td>
             <td style="width: 35%;">
                 <?php
-                $attrs = array('onclick' => 'javascript:destinations("' . $extension . '");',
+                $attrs = array('onclick' => 'javascript:destinfo("' . $extension . '");',
                                'id' => 'destX' . $extension . 'toggle');
                 echo Horde::img('tree/plusonly.png', _("Destinations"), $attrs,
                                 $registry->getImageDir('horde'));
@@ -54,21 +54,27 @@
                 }
                 ?>
                 </span>
-
-                <form method="post"
-                      action="<?php echo Horde::applicationUrl('extensions.php'); ?>">
-                <div class="extensionDestinations" id="destX<?php echo $extension; ?>">
-                    <input type="hidden" name="extension" value="<?php echo $extension; ?>">
+                <div class="extensionDestinations" id="destX<?php echo $extension; ?>info">
                     <?php
                     foreach ($info['devices'] as $device) {
-                        echo Horde::img('shout.png') . "&nbsp;" . $device . "<br>\n";
+                        echo Horde::img('shout.png') .
+                             "&nbsp;" . $device . "<br>\n";
                     }
                     foreach ($info['numbers'] as $number) {
-                        echo Horde::img('telephone-pole.png') . "&nbsp;" . $number . "<br>\n";
+                        echo Horde::img('telephone-pole.png') .
+                             "&nbsp;" . $number . "<br>\n";
                     }
                     ?>
+                    <form method="post"
+                      action="<?php echo Horde::applicationUrl('extensions.php'); ?>"
+                      id="destX<?php echo $extension; ?>form">
+                    </form>
+                    <a class="addDest"
+                       id="destX<?php echo $extension; ?>addDest"
+                       href="#" onclick="javascript:addDest('<?php echo $extension; ?>')">
+                       Add more destinations...
+                    </a>
                 </div>
-                </form>
             </td>
             <td style="width: 45%">
                 <?php echo $info['email']; ?>
@@ -83,17 +89,77 @@
 <script type="text/javascript">
 <!--
 
+var device_image = "<?php echo $registry->getImageDir() . '/shout.png'; ?>";
+var number_image = "<?php echo $registry->getImageDir() . '/telephone-pole.png'; ?>";
+
+var destinations = new Array();
 <?php
 foreach ($extensions as $extension => $info)
 {
+    echo "destinations[${extension}] = {";
+    if (count($info['devices'])) {
+        echo 'devices: ["' . implode('","', $info['devices']) . '"],';
+    }
+    if (count($info['numbers'])) {
+        echo 'numbers: ["' . implode('","', $info['numbers']) . '"],';
+    }
+    echo "};\n";
+
     echo "contract('${extension}');\n";
 }
 ?>
 
-function destinations(exten)
-{    
+var destX101 = {
+    numbers: []
+}
+
+function resetDestInfo(exten)
+{
+    while ((e = $('destX'+exten+'info').childNodes[0]) != null) {
+        $('destX'+exten+'info').removeChild(e);
+    }
+
+    destinations[exten]['devices'].each(function(s) {
+        e = document.createElement('img');
+        e.src = device_image;
+        t = document.createTextNode(" "+s);
+        b = document.createElement('br');
+        $('destX'+exten+'info').appendChild(e);
+        $('destX'+exten+'info').appendChild(t);
+        $('destX'+exten+'info').appendChild(b);
+    });
+
+
+    destinations[exten]['numbers'].each(function(s) {
+        e = document.createElement('img');
+        e.src = number_image;
+        t = document.createTextNode(" "+s);
+        b = document.createElement('br');
+        $('destX'+exten+'info').appendChild(e);
+        $('destX'+exten+'info').appendChild(t);
+        $('destX'+exten+'info').appendChild(b);
+    });
+
+    form = document.createElement('form');
+    form.method = 'post';
+    form.action = '#';
+    form.id = 'destX'+exten+'form';
+    $('destX'+exten+'info').appendChild(form);
+
+    a = document.createElement('a');
+    a.id = 'destX'+exten+'addDest';
+    a.class = 'addDest';
+    a.href='#';
+    a.onclick='addDest('+exten+')';
+    t = document.createTextNode('Add more destinations...');
+    a.appendChild(t);
+    $('destX'+exten+'info').appendChild(a);
+}
+
+function destinfo(exten)
+{
     // Use the summary icons span as our state key
-    if ($("destX" + exten + "summary").style.display == 'none') {
+    if ($('destX' + exten + 'summary').style.display == 'none') {
         // Icons hidden, we are expanded
         contract(exten);
     } else {
@@ -104,15 +170,33 @@ function destinations(exten)
 function expand(exten)
 {
     $('destX'+exten+'summary').hide();
-    $('destX'+exten).show();
-    $("destX" + exten + "toggle").src = '<?php echo $registry->getImageDir('horde') . '/tree/minusonly.png'; ?>';
+    $('destX'+exten+'info').show();
+    $('destX' + exten + 'toggle').src = '<?php echo $registry->getImageDir('horde') . '/tree/minusonly.png'; ?>';
 }
 
 function contract(exten)
 {
     $('destX'+exten+'summary').show();
-    $('destX'+exten).hide();
-    $("destX" + exten + "toggle").src = '<?php echo $registry->getImageDir('horde') . '/tree/plusonly.png'; ?>';
+    $('destX'+exten+'info').hide();
+    $('destX' + exten + 'toggle').src = '<?php echo $registry->getImageDir('horde') . '/tree/plusonly.png'; ?>';
+}
+
+function processForm(event)
+{
+    Event.stop(event);
+    alert(event.target.childNodes);
+}
+
+function addDest(exten)
+{
+    //$('destX'+exten+'addDest').hide();
+    e = document.createElement('input');
+    e.type = "text";
+    e.length = 10;
+    $('destX'+exten+'form').appendChild(e);
+    $('destX'+exten+'form').focusFirstElement();
+    Event.observe($('destX'+exten+'form'), 'submit', function(event) {processForm(event);});
 }
+
 // -->
 </script>