BUG 0000 User Experience (single app option added) 2nd commit

- dynamic screen width detection to collapse or not the breadcrumb for single apps interface
- fixed webkit compatibilities on css
- fixed draft apps titles on list

workflow/engine/skinEngine/simplified/css/topbar.css

@@ -479,6 +479,11 @@ div.topbar ul li.account a.menu {
 div.topbar ul li a.menu:hover {
   background-color: rgba(255,255,255,.1);
 }
+
+div.topbar ul li a.active {
+  background-color: rgba(255,255,255,.1);
+}
+
 div.topbar ul li a.menu span.menu-label {
 }
 div.topbar ul li a.menu span.menu-label:after {

workflow/engine/skinEngine/uxs/css/style.css

@@ -715,13 +715,15 @@ form.formDefault .FormTitle,form.formDefault .FormSubTitle{
 }
 form.formDefault .FormTitle
 {
-	-moz-border-bottom-colors: none;
+  -moz-border-bottom-colors: none;
   -moz-border-image: none;
   -moz-border-left-colors: none;
   -moz-border-right-colors: none;
   -moz-border-top-colors: none;
+  background: linear-gradient(#829AA8, #405A6A) repeat scroll 0 0 transparent;
   background: -moz-linear-gradient(#829AA8, #405A6A) repeat scroll 0 0 transparent;
-  background: -webkit-linear-gradient(#829AA8,#405A6A);
+  /*background: -webkit-linear-gradient(#829AA8,#405A6A);*/
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#829aa8), to(#405a6a)); /* Webkit */
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#829aa8',endColorstr='#405a6a');
   border-color: #677C89 #677C89 #6B808D;
   border-radius: 5px 5px 0 0;
@@ -737,7 +739,8 @@ form.formDefault .FormTitle
 form.formDefault .FormSubTitle
 {
   background: -moz-linear-gradient(#FAFAFA, #E0E0E0) repeat scroll 0 0 transparent;
-  background: -webkit-linear-gradient(#FAFAFA,#E0E0E0);
+  /*background: -webkit-linear-gradient(#FAFAFA,#E0E0E0);*/
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#FAFAFA), to(#E0E0E0)); /* Webkit */
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FAFAFA',endColorstr='#E0E0E0');
   border-top-left-radius: 1px;
   border-top-right-radius: 1px;

workflow/engine/templates/home/applications.html

@@ -1,6 +1,5 @@
 {foreach from=$cases key=id item=APP}
 <li class="postitem">
-  <!-- <span class="messages-link"></span> -->
   <span class="commentnumber">
     #{$APP.APP_NUMBER}
   </span>
@@ -18,7 +17,12 @@
       <a href="../cases/cases_Open?APP_UID={$APP.APP_UID}&DEL_INDEX={$APP.DEL_INDEX}&action=todo">{$APP.APP_TITLE}</a>
     </cite>
   </p>
-  <p class="time">From {$APP.APP_DEL_PREVIOUS_USER}, send at {$APP.DEL_DELEGATE_DATE}<!-- February 8th, 2009 at 5:38 am --></p>
+  <p class="time">
+    {if $APP.APP_DEL_PREVIOUS_USER != ''}
+    From {$APP.APP_DEL_PREVIOUS_USER}, send at
+    {/if}
+    {$APP.DEL_DELEGATE_DATE}
+  </p>
   <p>{$APP.APP_PRO_TITLE}
   <br/>{$APP.APP_TAS_TITLE}</p>
   

workflow/engine/templates/home/index.html

@@ -58,6 +58,20 @@
       }
     });
   }
+
+  /*function setActive(o) 
+  {
+    if (o.id == 'inboxOp') {
+      o.setAttribute('class', 'active');
+    }
+    else {
+      o.setAttribute('class', ''); 
+    }
+  }*/
+
+  //$("div.topbar ul li a").
+
+ 
   </script>
   {/literal}
 
@@ -73,28 +87,28 @@
 
           <ul class="nav primary-nav">
             <li class="account">
-              <a class="menu user-actions" href="#" onclick="redirect('home/appList?t=todo')" title="My Inbox">
-                <img alt="A99679add21e8b0704ea5f0fb569572c_mini" src="/images/simplified/in-set-grey.png"  />
+              <a class="menu user-actions active" href="#" onclick="redirect('home/appList?t=todo');" title="My Inbox">
+                <img alt="" src="/images/simplified/in-set-grey.png" id="inboxOp" />
                 <!-- <span class="menu-label screen-name">new cases</span> -->
               </a>
             </li>
 
             {if $canStartCase neq false}
             <li class="account">
-              <a class="menu user-actions" href="#" onclick="redirect('home/appList?t=draft')" title="My Drafts">
-                <img alt="A99679add21e8b0704ea5f0fb569572c_mini" src="/images/simplified/folder-grey.png"  />
+              <a class="menu user-actions" href="#" onclick="redirect('home/appList?t=draft');" title="My Drafts">
+                <img alt="" src="/images/simplified/folder-grey.png"  />
               </a>
             </li>
             
             <li class="account">
-              <a class="menu user-actions" href="#">
-                <img alt="A99679add21e8b0704ea5f0fb569572c_mini" src="/images/simplified/plus-set-grey.png"  title="New Case"/>
+              <a class="menu user-actions" href="#" title="New Case" id="_new">
+                <img alt="" src="/images/simplified/plus-set-grey.png"/>
               </a>
 
               <ul class="menu-dropdown" style="width: 360px">
                 {foreach from=$processList key=id item=proc}
                 <li>
-                  <a href="#" onclick="appStart('{$proc.uid}', '{$proc.value}')" accesskey="s" id="settings_link">{$proc.value}</a>
+                  <a href="#" onclick="appStart('{$proc.uid}', '{$proc.value}')" accesskey="s" title="" id="settings_link">{$proc.value}</a>
                 </li>
                 {/foreach}
               </ul>
@@ -168,6 +182,13 @@
         });
 
       })
+
+     
+      $('ul.primary-nav').children('li').children('a').click(function(i, el){
+        $('ul.primary-nav').children('li').children('a').attr('class', 'menu user-actions');
+        $(this).attr('class', 'menu user-actions active');
+      });
+
     });
   </script>
   {/literal}

workflow/engine/templates/home/indexSingle.html

@@ -92,8 +92,9 @@
 
   {literal}
   <script type="text/javascript">
+    console.log($(window).width());
     $(document).ready(function() {
-      $('#breadcrumbs-1').xBreadcrumbs({ collapsible: true });
+      $('#breadcrumbs-1').xBreadcrumbs({ collapsible: ($(window).width() < 500 ?  true : false)});
     });
   </script>
   {/literal}