Mobile webmail wireframe.
authorJan Schneider <jan@horde.org>
Mon, 15 Nov 2010 18:39:19 +0000 (19:39 +0100)
committerJan Schneider <jan@horde.org>
Mon, 15 Nov 2010 22:22:13 +0000 (23:22 +0100)
imp/mobile.php [new file with mode: 0644]
imp/templates/mobile/folders.html.php [new file with mode: 0644]
imp/templates/mobile/head.html.php [new file with mode: 0644]
imp/templates/mobile/mailbox.html.php [new file with mode: 0644]
imp/templates/mobile/message.html.php [new file with mode: 0644]
imp/themes/mobile.css [new file with mode: 0644]

diff --git a/imp/mobile.php b/imp/mobile.php
new file mode 100644 (file)
index 0000000..48c63d5
--- /dev/null
@@ -0,0 +1,30 @@
+<?php
+/**
+ * jQuery Mobile page.
+ *
+ * Copyright 2010 The Horde Project (http://www.horde.org/)
+ *
+ * See the enclosed file COPYING for license information (GPL). If you
+ * did not receive this file, see http://www.fsf.org/copyleft/gpl.html.
+ *
+ * @author   Jan Schneider <jan@horde.org>
+ * @category Horde
+ * @license  http://www.fsf.org/copyleft/gpl.html GPL
+ * @package  IMP
+ */
+
+require_once dirname(__FILE__) . '/lib/Application.php';
+Horde_Registry::appInit('imp', array('impmode' => 'mimp'));
+
+$view = new Horde_View(array('templatePath' => IMP_TEMPLATES . '/mobile'));
+new Horde_View_Helper_Text($view);
+$view->logout = Horde::getServiceLink('logout')->setRaw(false);
+
+$title = _("Mobile Mail");
+
+require $registry->get('templates', 'horde') . '/common-header-mobile.inc';
+echo $view->render('head.html.php');
+echo $view->render('folders.html.php');
+echo $view->render('mailbox.html.php');
+echo $view->render('message.html.php');
+require $registry->get('templates', 'horde') . '/common-footer-mobile.inc';
diff --git a/imp/templates/mobile/folders.html.php b/imp/templates/mobile/folders.html.php
new file mode 100644 (file)
index 0000000..c1b6781
--- /dev/null
@@ -0,0 +1,17 @@
+<div id="folders" data-role="page">
+  <div data-role="header">
+    <a href="<?php echo Horde::getServiceLink('portal', 'horde')?>" class="ui-btn-left"><?php echo _("Portal")?></a>
+    <h1><?php echo _("Folders") ?></h1>
+    <?php if ($this->logout): ?>
+    <a href="<?php echo $this->logout ?>" rel="external" data-theme="e" data-icon="delete" class="ui-btn-right"><?php echo _("Log out") ?></a>
+    <?php endif ?>
+  </div>
+  <div data-role="content">
+    <ul data-role="listview">
+      <li><a href="#mailbox"><img src="themes/graphics/folders/inbox.png" class="ui-li-icon" />Inbox<span class="ui-li-count">99</span></a></li>
+      <li><a href="#mailbox"><img src="themes/graphics/folders/folder.png" class="ui-li-icon" />Another Folder</a></li>
+      <li><a href="#mailbox"><img src="themes/graphics/folders/folder.png" class="ui-li-icon" />&nbsp;&nbsp;Sub folder</a></li>
+      <li><a href="#"><img src="themes/graphics/folders/trash.png" class="ui-li-icon" />Trash</a></li>
+    </ul>
+  </div>
+</div>
diff --git a/imp/templates/mobile/head.html.php b/imp/templates/mobile/head.html.php
new file mode 100644 (file)
index 0000000..9ca38d2
--- /dev/null
@@ -0,0 +1,3 @@
+  <link type="text/css" rel="stylesheet" href="<?php echo $GLOBALS['registry']->get('themesuri', 'imp') ?>/mobile.css" />
+</head>
+<body>
diff --git a/imp/templates/mobile/mailbox.html.php b/imp/templates/mobile/mailbox.html.php
new file mode 100644 (file)
index 0000000..0d0ff51
--- /dev/null
@@ -0,0 +1,20 @@
+<div id="mailbox" data-role="page">
+  <div data-role="header">
+    <h1><?php echo _("Inbox") ?></h1>
+    <?php if ($this->logout): ?>
+    <a href="<?php echo $this->logout ?>" rel="external" data-theme="e" data-icon="delete" class="ui-btn-right"><?php echo _("Log out") ?></a>
+    <?php endif ?>
+  </div>
+  <div data-role="content">
+    <ul data-role="listview">
+      <li>
+         <h3><a href="#message">Subject 1</a></h3>
+         <p class="ui-li-aside">99</p>
+         <p>Sender</p>
+      </li>
+      <li><a href="#message">Another Folder</a></li>
+      <li><a href="#message">Sub folder</a></li>
+      <li><a href="#message">Trash</a></li>
+    </ul>
+  </div>
+</div>
diff --git a/imp/templates/mobile/message.html.php b/imp/templates/mobile/message.html.php
new file mode 100644 (file)
index 0000000..26468eb
--- /dev/null
@@ -0,0 +1,19 @@
+<div id="message" data-role="page">
+  <div data-role="header">
+    <h1>My Subject</h1>
+    <?php if ($this->logout): ?>
+    <a href="<?php echo $this->logout ?>" rel="external" data-theme="e" data-icon="delete" class="ui-btn-right"><?php echo _("Log out") ?></a>
+    <?php endif ?>
+  </div>
+  <div class="ui-body ui-body-c">
+    <strong>My Subject</strong><br>
+    <small>Date, Time</small>
+  </div>
+  <div class="ui-body ui-body-c">
+    <a href="#" style="float:right;margin:0" data-role="button" data-icon="arrow-d" data-iconpos="notext">Show more</a>
+    From: Myself
+  </div>
+  <div data-role="content">
+  Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
+  </div>
+</div>
diff --git a/imp/themes/mobile.css b/imp/themes/mobile.css
new file mode 100644 (file)
index 0000000..1c14ea7
--- /dev/null
@@ -0,0 +1,3 @@
+#message .ui-body-c {
+    border-top-width: 0;
+}