Shout: Revamp menu selection and editing screens

diff --git a/shout/dialplan.php b/shout/dialplan.php
index f4b8c06..eaeebad 100644 (file)
--- a/shout/dialplan.php
+++ b/shout/dialplan.php
@@ -53,6 +53,7 @@ default:
     $action = 'edit';
     try {
         $destinations = $shout->extensions->getExtensions($curaccount);
+        $soundfiles = $shout->getRecordings();
     } catch (Exception $e) {
         $notification->push(_("Problem getting destination information."));
     }

diff --git a/shout/lib/Ajax/Application.php b/shout/lib/Ajax/Application.php
index 3416163..dda90d8 100644 (file)
--- a/shout/lib/Ajax/Application.php
+++ b/shout/lib/Ajax/Application.php
@@ -126,24 +126,6 @@ class Shout_Ajax_Application extends Horde_Ajax_Application_Base
         return true;
     }
 
-    /**
-     * TODO
-     */
-    public function getMenuActions()
-    {
-        try {
-            $vars = $this->_vars;
-            $shout = $GLOBALS['registry']->getApiInstance('shout', 'application');
-            $account = $_SESSION['shout']['curaccount'];
-            $actions = Shout::getMenuActions();
-            return $actions;
-        } catch (Exception $e) {
-            //FIXME: Create a way to notify the user of the failure.
-            Horde::logMessage($e, 'ERR');
-            return false;
-        }
-    }
-
     public function getActionForm()
     {
         try {
@@ -213,17 +195,6 @@ class Shout_Ajax_Application extends Horde_Ajax_Application_Base
         }
     }
 
-    public function getRecordings()
-    {
-        try {
-            return Shout::getRecordings($_SESSION['shout']['curaccount']);
-        } catch (Exception $e) {
-            //FIXME: Create a way to notify the user of the failure.
-            Horde::logMessage($e->getMessage(), 'ERR');
-            return false;
-        }
-    }
-
     public function responseType()
     {
         return $this->_responseType;

diff --git a/shout/lib/Application.php b/shout/lib/Application.php
index dc7e5c1..c94fb70 100644 (file)
--- a/shout/lib/Application.php
+++ b/shout/lib/Application.php
@@ -157,4 +157,24 @@ class Shout_Application extends Horde_Registry_Application
         return self::$_perms;
     }
 
+
+    public function getRecordings()
+    {
+        $account = $_SESSION['shout']['curaccount'];
+        $rlist = $this->vfs->listFolder($account);
+
+        // In Asterisk, filenames the same basename and different extension are
+        // functionally equivalent.  Asterisk chooses the file based on the least cost
+        // to transcode.  For that reason, we will drop the filename extension when
+        // handling files.
+        $recordings = array();
+        foreach ($rlist as $name => $info) {
+            $name = substr($name, 0, strrpos($name, '.'));
+            $info['name'] = $name;
+            $recordings[$name] = $info;
+        }
+
+        return $recordings;
+    }
+
 }

diff --git a/shout/lib/Shout.php b/shout/lib/Shout.php
index fef60c6..30a40aa 100644 (file)
--- a/shout/lib/Shout.php
+++ b/shout/lib/Shout.php
@@ -218,23 +218,4 @@ class Shout
         return $res;
     }
 
-    static public function getRecordings($account)
-    {
-        $shout = $GLOBALS['registry']->getApiInstance('shout', 'application');
-        $rlist = $shout->vfs->listFolder($account);
-
-        // In Asterisk, filenames the same basename and different extension are
-        // functionally equivalent.  Asterisk chooses the file based on the least cost
-        // to transcode.  For that reason, we will drop the filename extension when
-        // handling files.
-        $recordings = array();
-        foreach ($rlist as $name => $info) {
-            $name = substr($name, 0, strrpos($name, '.'));
-            $info['name'] = $name;
-            $recordings[$name] = $info;
-        }
-
-        return $recordings;
-    }
-
 }

diff --git a/shout/templates/dialplan/edit.inc b/shout/templates/dialplan/edit.inc
index 1296c74..7b6a603 100644 (file)
--- a/shout/templates/dialplan/edit.inc
+++ b/shout/templates/dialplan/edit.inc
@@ -14,17 +14,39 @@
                 <td class="metaStatInfo"><span id="menu.soundfile"></span></td>
             </tr>
         </table>
+        <form id="editMenu">
+        <table class="striped">
+            <tr>
+                <td class="metaStatName">Menu Name</td>
+                <td class="metaStatInfo"><input name="name"></td>
+            </tr>
+            <tr>
+                <td class="metaStatName">Description</td>
+                <td class="metaStatInfo"><input name="description"></td>
+            </tr>
+            <tr>
+                <td class="metaStatName">Sound File</td>
+                <td class="metaStatInfo"><select name="soundfile"></select></td>
+            </tr>
+            <tr>
+                <td><div class="button" onclick="saveMenu()"><?php echo _("Save"); ?></div></td>
+                <td><div class="button" onclick="$('editMenu').hide()"><?php echo _("Cancel"); ?></div></td>
+            </tr>
+        </table>
+        </form>
         <br style="clear:both;">
         <ul id="controls">
         <?php
         $addurl = Horde::applicationUrl('dialplan.php');
         $addurl = Horde_Util::addParameter($addurl, 'action', 'add');
-
         ?>
-        <li class="button"><a href="<?php echo $addurl; ?>">
-            <?php echo Horde::img('add-menu.png'); ?>&nbsp;New Menu
-            </a>
+        <a href="<?php echo $addurl; ?>">
+        <li class="button">
+            <?php echo Horde::img('menu-add.png'); ?>&nbsp;New Menu
         </li>
+        </a>
+        <li class="button" onclick="editMenu()"><?php echo Horde::img('menu-edit.png'); ?>&nbsp;Edit Menu</li>
+        <li class="button" onclick="deleteMenu()"><?php echo Horde::img('menu-delete.png');?>&nbsp;Delete Menu</li>
         </ul>
     </div>
 
@@ -49,18 +71,18 @@
       <div class="digit" id="digit_*" onClick="editAction('star');"><span class="digitLabel">*</span></div>
       <div class="digit" id="digit_0" onClick="editAction('0');"><span class="digitLabel">0</span></div>
       <div class="digit" id="digit_#" onClick="editAction('octothorpe');"><span class="digitLabel">#</span></div>
-      <br style="clear:both;">
-      <div id="defaultAction" onclick="editAction('defaultAction');"><span class="digitLabel">Default Action</span></div>
     </div>
 </div>
 
 <script type="text/javascript">
 <!--
+// TODO: Convert to object
 var ajax_url = '<?php echo Horde::getServiceLink('ajax', 'shout') ?>';
 var curmenu = null;
 var menuInfo = $H();
 var menuActions = $H(<?php echo Horde_Serialize::serialize(Shout::getMenuActions(), Horde_Serialize::JSON, Horde_Nls::getCharset()); ?>);
 var destinations = $H(<?php echo Horde_Serialize::serialize($destinations, Horde_Serialize::JSON, Horde_Nls::getCharset()); ?>);
+var soundfiles = $H(<?php echo Horde_Serialize::serialize($soundfiles, Horde_Serialize::JSON, Horde_Nls::getCharset()); ?>);
 
 function editAction(digit)
 {
@@ -88,7 +110,7 @@ function editAction(digit)
         menuActions.each(function (item) {
             option = document.createElement('option');
             option.value = item.key;
-            if (menuInfo.get('actions')[digit] != null) {
+            if (menuInfo.get(curmenu).actions[digit] != null) {
                 if (item.key == menuInfo.get('actions')[digit].action) {
                     option.selected = "true";
                 }
@@ -101,12 +123,13 @@ function editAction(digit)
         $('selectAction').appendChild(form);
 
         // Cancel button
-        var span = document.createElement('span');
-        span.id = 'cancelAction';
-        span.setAttribute('onclick', 'cancelEdit()');
+        var div = document.createElement('div');
+        div.setAttribute('onclick', 'cancelEdit()');
+        div.className = 'button';
         var text = document.createTextNode('<?php echo _("Cancel"); ?>');
-        span.appendChild(text);
-        $('selectAction').appendChild(span);
+        div.appendChild(text);
+        div.id = 'cancelAction';
+        $('selectAction').appendChild(div);
     }
 
     if ($('selectActionForm').getElements().first().getValue() != '') {
@@ -168,41 +191,6 @@ function cancelEdit()
     $('editActionOverlay').hide();
 }
 
-function changeSoundFile()
-{
-    empty($('editSound'));
-    // FIXME: Add spinner
-    new Ajax.Request(ajax_url + 'getRecordings',
-    {
-        method: 'get',
-        onSuccess: function(r) {
-            var form = document.createElement('form');
-            form.name = 'selectSoundFile';
-            form.id = 'selectSoundFile';
-            var select = document.createElement('select');
-            select.name = 'filename';
-            var recordings = $H(r.responseJSON.response);
-            recordings.each(function (pair) {
-                var option = document.createElement('option');
-                option.value = pair.value.name;
-                var text = document.createTextNode(pair.value.name);
-                option.appendChild(text);
-                select.appendChild(option);
-            });
-            form.appendChild(select);
-            var spacer = document.createTextNode(' ');
-            form.appendChild(spacer);
-            var save = document.createElement('input');
-            save.type = 'submit';
-            save.name = 'save';
-            save.value = '<?php echo _("Save"); ?>';
-            form.appendChild(save);
-            $('editSound').appendChild(form);
-            Event.observe($('selectSoundFile'), 'submit', function(event) {saveSoundFile(event);});
-        }
-    });
-}
-
 function saveSoundFile(event)
 {
     Event.stop(event);
@@ -305,27 +293,21 @@ function refreshMenu()
         p.appendChild(text);
         button.appendChild(p);
     });
+
+    var select = $('editMenu').down('select');
+    empty(select);
+    soundfiles.each(function (item) {
+        var option = document.createElement('option');
+        option.value = item.key;
+        var text = document.createTextNode(item.value.name);
+        option.appendChild(text);
+        select.appendChild(option);
+    })
 }
 
-function getMetaRow(name, value)
+function editMenu()
 {
-    var row;
-    var col;
-    var text;
-    row = document.createElement('tr');
-    col = document.createElement('td');
-    col.className = 'menuStatName';
-    text = document.createTextNode(name);
-    col.appendChild(text);
-    row.appendChild(col);
-
-    col = document.createElement('td');
-    col.className='menuStatValue';
-    text = document.createTextNode(value);
-    col.appendChild(text);
-    row.appendChild(col);
-
-    return row;
+    $('editMenu').show();
 }
 
 function empty(p)
@@ -336,6 +318,7 @@ function empty(p)
 }
 
 $('editActionOverlay').hide();
+$('editMenu').hide();
 new Ajax.Request(ajax_url + 'getMenus',
 {
     method: 'get',
@@ -349,6 +332,7 @@ new Ajax.Request(ajax_url + 'getMenus',
             $('menu.select').appendChild(option);
         })
         refreshMenu();
+        Event.observe($('editMenu'), 'submit', function(event) {saveSoundFile(event);});
     }
 });
 // -->

diff --git a/shout/themes/graphics/add-menu.png b/shout/themes/graphics/add-menu.png
deleted file mode 100755 (executable)
index d5bfa07..0000000
Binary files a/shout/themes/graphics/add-menu.png and /dev/null differ

diff --git a/shout/themes/graphics/menu-add.png b/shout/themes/graphics/menu-add.png
new file mode 100755 (executable)
index 0000000..d5bfa07
Binary files /dev/null and b/shout/themes/graphics/menu-add.png differ

diff --git a/shout/themes/graphics/menu-delete.png b/shout/themes/graphics/menu-delete.png
new file mode 100755 (executable)
index 0000000..3141467
Binary files /dev/null and b/shout/themes/graphics/menu-delete.png differ

diff --git a/shout/themes/graphics/menu-edit.png b/shout/themes/graphics/menu-edit.png
new file mode 100755 (executable)
index 0000000..046811e
Binary files /dev/null and b/shout/themes/graphics/menu-edit.png differ

diff --git a/shout/themes/screen.css b/shout/themes/screen.css
index e3fb6ff..d48ed59 100644 (file)
--- a/shout/themes/screen.css
+++ b/shout/themes/screen.css
@@ -66,6 +66,11 @@ ul {
 }
 
 #controls {
+    margin-left: auto;
+    margin-right: auto;
+}
+
+#controls li {
     float: left;
 }
 
@@ -75,11 +80,8 @@ ul {
 
 #menuInfo {
     float: left;
-    width: 300px;
-}
-
-#menuInfo img:hover {
-    cursor: pointer;
+    width: 340px;
+    position: relative;
 }
 
 .menuStatName {
@@ -153,6 +155,14 @@ ul {
     background-image: url('graphics/transparency.png');
 }
 
+#editMenu
+{
+    width: 100%;
+    position: absolute;
+    top: 0px;
+    left: 0px;
+}
+
 #cancelAction {
     position: absolute;
     bottom: 5px;
@@ -175,6 +185,11 @@ ul {
     margin: 5px;
 }
 
+.button {
+    float:left;
+    margin: 3px;
+}
+
 .button a {
     color: #fff;
 }