add search feature + improved document interface

bin/setup.sh

@@ -61,6 +61,8 @@ echo "-> psycopg2"
 echo "-> pillow"
 pip install psycopg2
 pip install pillow
+pip install beautifulsoup4
+
 echo
 echo
 

doc/database/pod-create-database-and-user.sh

@@ -1,7 +1,7 @@
 #!/bin/bash
-POD_DB_USER='pod_master'
-POD_DB_USER_PASSWORD='pod_master_password'
-POD_DB_NAME='pod'
+POD_DB_USER='pod_protov1_dev'
+POD_DB_USER_PASSWORD='pod_protov1_dev_password'
+POD_DB_NAME='pod_protov1_dev'
 
 # DB_HOST='127.0.0.1'
 # DB_PORT='5432'

pboard/development.ini

@@ -60,7 +60,7 @@ beaker.session.validate_key = 3283411b-1904-4554-b0e1-883863b53080
 # in development
 
 #sqlalchemy.url = postgres://pboard:pboard@127.0.0.1:5432/pboarddb
-sqlalchemy.url = postgres://pod_master:pod_master_password@127.0.0.1:5432/pod
+sqlalchemy.url = postgres://pod_protov1_dev:pod_protov1_dev_password@127.0.0.1:5432/pod_protov1_dev
 #echo shouldn't be used together with the logging module.
 sqlalchemy.echo = false
 sqlalchemy.echo_pool = false

pboard/pboard.egg-info/SOURCES.txt

@@ -54,6 +54,7 @@ pboard/public/img/glyphicons.png
 pboard/public/img/turbogears_logo.png
 pboard/public/img/turbogears_logo_big.png
 pboard/public/img/under_the_hood_blue.png
+pboard/public/javascript/pod.js
 pboard/public/javascript/external/bootstrap-datetimepicker.min.js
 pboard/public/javascript/external/bootstrap-wysiwyg.js
 pboard/public/javascript/external/bootstrap.js
@@ -90,21 +91,16 @@ pboard/public/javascript/external/google-code-prettify/lang-yaml.js
 pboard/public/javascript/external/google-code-prettify/prettify.js
 pboard/public/javascript/external/google-code-prettify/run_prettify.js
 pboard/templates/__init__.py
-pboard/templates/__init__.pyc
+pboard/templates/about.mak
 pboard/templates/dashboard.mak
 pboard/templates/document.mak
-pboard/templates/document.mak~
 pboard/templates/error.mak
 pboard/templates/index.mak
-pboard/templates/index.mak~
 pboard/templates/login.mak
-pboard/templates/master.html
 pboard/templates/master.mak
 pboard/templates/pod.mak
-pboard/templates/pod.mak~
 pboard/templates/simple_mako.mak
 pboard/templates/debug/__init__.py
-pboard/templates/debug/__init__.pyc
 pboard/templates/debug/environ.mak
 pboard/templates/debug/iconset.mak
 pboard/templates/debug/identity.mak

pboard/pboard/controllers/root.py

@@ -106,18 +106,18 @@ class RootController(BaseController):
     @expose('pboard.templates.dashboard')
     @require(predicates.in_group('user', msg=l_('Please login to access this page')))
     def dashboard(self):
-      loCurrentUser   = pld.PODStaticController.getCurrentUser()
-      loApiController = pld.PODUserFilteredApiController(loCurrentUser.user_id)
+        loCurrentUser   = pld.PODStaticController.getCurrentUser()
+        loApiController = pld.PODUserFilteredApiController(loCurrentUser.user_id)
 
-      loLastModifiedNodes = loApiController.getLastModifiedNodes(10)
-      loWhatsHotNodes     = loApiController.getNodesByStatus('hot', 5)
-      loActionToDoNodes   = loApiController.getNodesByStatus('actiontodo', 5)
-      return dict(last_modified_nodes=loLastModifiedNodes, whats_hot_nodes=loWhatsHotNodes, action_to_do_nodes = loActionToDoNodes)
+        loLastModifiedNodes = loApiController.getLastModifiedNodes(10)
+        loWhatsHotNodes     = loApiController.getNodesByStatus('hot', 5)
+        loActionToDoNodes   = loApiController.getNodesByStatus('actiontodo', 5)
+        return dict(last_modified_nodes=loLastModifiedNodes, whats_hot_nodes=loWhatsHotNodes, action_to_do_nodes = loActionToDoNodes)
 
 
     @expose('pboard.templates.document')
     @require(predicates.in_group('user', msg=l_('Please login to access this page')))
-    def document(self, node=0, came_from=lurl('/')):
+    def document(self, node=0, came_from=lurl('/'), highlight=''):
         """show the user dashboard"""
         loCurrentUser   = pld.PODStaticController.getCurrentUser()
         loApiController = pld.PODUserFilteredApiController(loCurrentUser.user_id)
@@ -125,7 +125,7 @@ class RootController(BaseController):
         # loRootNodeList   = pbm.DBSession.query(pbmd.PBNode).filter(pbmd.PBNode.parent_id==None).order_by(pbmd.PBNode.node_order).all()
         loRootNodeList = loApiController.buildTreeListForMenu(pbmd.PBNodeStatus.getVisibleIdsList())
         liNodeId         = int(node)
-        
+
         loCurrentNode    = None
         loNodeStatusList = None
         try:
@@ -133,12 +133,12 @@ class RootController(BaseController):
           loCurrentNode    = loApiController.getNode(liNodeId)
         except Exception as e:
           flash(_('Document not found'), 'error')
-        
+
         # FIXME - D.A - 2013-11-07 - Currently, the code build a new item if no item found for current user
         # the correct behavior should be to redirect to setup page
         if loCurrentNode is not None and "%s"%loCurrentNode.node_id!=node:
           redirect(tg.url('/document/%i'%loCurrentNode.node_id))
-          
+
         if loCurrentNode is None:
           loCurrentNode = loApiController.getNode(0) # try to get an item
           if loCurrentNode is not None:
@@ -150,5 +150,22 @@ class RootController(BaseController):
             pm.DBSession.flush()
             redirect(tg.url('/document/%i'%loCurrentNode.node_id))
 
-        return dict(root_node_list=loRootNodeList, current_node=loCurrentNode, node_status_list = loNodeStatusList)
+        return dict(
+            root_node_list=loRootNodeList,
+            current_node=loCurrentNode,
+            node_status_list = loNodeStatusList,
+            keywords = highlight
+        )
+
+    @expose('pboard.templates.search')
+    @require(predicates.in_group('user', msg=l_('Please login to access this page')))
+    def search(self, keywords=''):
+        loCurrentUser   = pld.PODStaticController.getCurrentUser()
+        loApiController = pld.PODUserFilteredApiController(loCurrentUser.user_id)
+
+        loFoundNodes = loApiController.searchNodesByText(keywords.split())
+
+        return dict(search_string=keywords, found_nodes=loFoundNodes)
+
+
 

pboard/pboard/lib/dbapi.py

@@ -9,6 +9,7 @@ from sqlalchemy import Table, ForeignKey, Column
 from sqlalchemy.types import Unicode, Integer, DateTime, Text
 from sqlalchemy.orm import relation, synonym
 from sqlalchemy.orm import joinedload_all
+import sqlalchemy as sqla
 
 from pboard.model import DeclarativeBase, metadata, DBSession
 from pboard.model import data as pbmd
@@ -90,6 +91,28 @@ class PODUserFilteredApiController(object):
     return DBSession.query(pbmd.PBNode).options(joinedload_all("_lAllChildren")).filter(pbmd.PBNode.owner_id.in_(liOwnerIdList)).order_by(pbmd.PBNode.updated_at.desc()).limit(piMaxNodeNb).all()
 
 
+  def searchNodesByText(self, plKeywordList, piMaxNodeNb=100):
+    """
+    Returns a list of nodes order by type, nodes which contain at least one of the keywords
+    """
+    liOwnerIdList = self._getUserIdListForFiltering()
+
+    loKeywordFilteringClauses = []
+    for keyword in plKeywordList:
+        loKeywordFilteringClauses.append(pbmd.PBNode.data_label.ilike('%'+keyword+'%'))
+        loKeywordFilteringClauses.append(pbmd.PBNode.data_content.ilike('%'+keyword+'%'))
+
+    loKeywordFilteringClausesAsOr = sqla.or_(*loKeywordFilteringClauses) # Combine them with or to a BooleanClauseList
+
+    loResultsForSomeKeywords = DBSession.query(pbmd.PBNode).options(joinedload_all("_lAllChildren"))\
+        .filter(loKeywordFilteringClausesAsOr)\
+        .filter(pbmd.PBNode.owner_id.in_(liOwnerIdList))\
+        .order_by(sqla.desc(pbmd.PBNode.node_type))\
+        .limit(piMaxNodeNb)\
+        .all()
+
+    return loResultsForSomeKeywords
+
   def getNodesByStatus(self, psNodeStatus, piMaxNodeNb=5):
     liOwnerIdList = self._getUserIdListForFiltering()
     return DBSession.query(pbmd.PBNode).options(joinedload_all("_lAllChildren")).filter(pbmd.PBNode.owner_id.in_(liOwnerIdList)).filter(pbmd.PBNode.node_status==psNodeStatus).order_by(pbmd.PBNode.updated_at).limit(piMaxNodeNb).all()

pboard/pboard/model/data.py

@@ -6,6 +6,7 @@ import datetime as datetimeroot
 from datetime import datetime
 from hashlib import sha256
 
+import bs4
 from sqlalchemy import Table, ForeignKey, Column, Sequence
 from sqlalchemy.types import Unicode, Integer, DateTime, Text, LargeBinary
 from sqlalchemy.orm import relation, synonym, relationship
@@ -263,21 +264,44 @@ class PBNode(DeclarativeBase):
     return self.getChildrenOfType([PBNodeType.Comment], PBNode.getSortingKeyBasedOnDataDatetime, True)
 
   def getIconClass(self):
+    if self.node_type==PBNodeType.Data and self.getStaticChildNb()>0:
+      return PBNode.getIconClassForNodeType('folder')
+    else:
+      return PBNode.getIconClassForNodeType(self.node_type)
+
+  def getBreadCrumbNodes(self):
+    loNodes = []
+    if self._oParent!=None:
+      loNodes = self._oParent.getBreadCrumbNodes()
+      loNodes.append(self._oParent)
+    return loNodes
+
+  def getContentWithHighlightedKeywords(self, plKeywords, psPlainText):
+    if len(plKeywords)<=0:
+      return psPlainText
+
+    lsPlainText = psPlainText
+
+    for lsKeyword in plKeywords:
+      lsPlainText = re.sub('(?i)(%s)' % lsKeyword, '<strong>\\1</strong>', lsPlainText)
+
+    return lsPlainText
+
+
+  @classmethod
+  def getIconClassForNodeType(cls, psIconType):
     laIconClass = dict()
     laIconClass['node']   = 'fa fa-folder-open'
     laIconClass['folder'] = 'fa fa-folder-open'
     laIconClass['data']   = 'fa fa-file-text-o'
 
-    laIconClass['file']   = 'fa fa-file-text-o'
+    laIconClass['file']   = 'fa fa-paperclip'
     laIconClass['event']  = 'fa fa-calendar'
     laIconClass['contact'] = 'fa fa-user'
     laIconClass['comment'] = 'fa fa-comments-o'
+    return laIconClass[psIconType]
+
 
-    if self.node_type==PBNodeType.Data and self.getStaticChildNb()>0:
-      return laIconClass['folder']
-    else:
-      return laIconClass[self.node_type]
-      
   def getUserFriendlyNodeType(self):
     laNodeTypesLng = dict()
     laNodeTypesLng['node']   = 'Document' # FIXME - D.A. - 2013-11-14 - Make text translatable
@@ -304,7 +328,7 @@ class PBNode(DeclarativeBase):
   def getFormattedTime(self, poDateTime, psDateTimeFormat = '%H:%M'):
     return poDateTime.strftime(psDateTimeFormat)
 
-  def getStatus(self):
+  def getStatus(self) -> PBNodeStatusItem:
     loStatus = PBNodeStatus.getStatusItem(self.node_status)
     if loStatus.status_id!='automatic':
       return loStatus
@@ -328,6 +352,17 @@ class PBNode(DeclarativeBase):
       lsTruncatedLabel = self.data_label
     return lsTruncatedLabel
 
+  def getTruncatedContentAsText(self, piCharNb):
+    lsPlainText = ''.join(bs4.BeautifulSoup(self.data_content).findAll(text=True))
+    lsTruncatedContent = ''
+    
+    liMaxLength = int(piCharNb)
+    if len(lsPlainText)>liMaxLength:
+      lsTruncatedContent = lsPlainText[0:liMaxLength-1]+'…'
+    else:
+      lsTruncatedContent = lsPlainText
+    return lsTruncatedContent
+
   def getTagList(self):
     loPattern = re.compile('(^|\s|@)@(\w+)')
     loResults = re.findall(loPattern, self.data_content)

pboard/pboard/public/css/style.css

@@ -122,8 +122,10 @@ body { padding-top: 60px; }
   position:fixed;
   left:0;
   top:0;
-  z-index:0 !important;
+  z-index:2001 !important;
   background-color:white;
+
+  padding: 0.5em 0.5em 0.5em 0.5em;
   
   filter: alpha(opacity=90); /* internet explorer */
   -khtml-opacity: 0.9;      /* khtml, old safari */
@@ -132,9 +134,9 @@ body { padding-top: 60px; }
 }
 
 .full-size-overlay-inner {
-  margin: 3.5em 0.5em 0.5em 0.5em;
+  margin: 0.5em 1em 0.5em 0em;
   overflow: auto;
-  max-height: 85%;
+  max-height: 90%;
 }
 
 
@@ -181,3 +183,10 @@ tr:Hover td div.pod-toolbar {
 }
 
 .navbar .nav > li > a.pod-do-not-display { display: none; }
+
+/* SEARCH RESULTS SCREEN */
+
+div.search-result-item > h5 {
+  margin-bottom: 0;
+}
+

pboard/pboard/public/javascript/pod.js

@@ -6,6 +6,7 @@
       $('.pod-toggle-full-screen-button > i').removeClass('fa-compress')
       $('.pod-toggle-full-screen-button > i').addClass('fa-expand')
     } else {
+      // Toggle from normal to fullscreen
       $(outerWidgetId).addClass('full-size-overlay');
       $(innerWidgetId).addClass('full-size-overlay-inner');
       $('.pod-toggle-full-screen-button > i').removeClass('fa-expand')
@@ -94,16 +95,18 @@
     $("#current-document-content-edit-button" ).click(function() {
       $("#current-document-content" ).css("display", "none");
       $("#current-document-content-edit-form" ).css("display", "block");
+      $("#current-document-toobar").css("display", "none");
     });
     $("#current-document-content" ).dblclick(function() {
       $("#current-document-content" ).css("display", "none");
       $("#current-document-content-edit-form" ).css("display", "block");
     });
-    $("#current-document-content-edit-cancel-button" ).click(function() {
+    $("#current-document-content-edit-cancel-button, #current-document-content-edit-cancel-button-top" ).click(function() {
       $("#current-document-content" ).css("display", "block");
       $("#current-document-content-edit-form" ).css("display", "none");
+      $("#current-document-toobar").css("display", "block");
     });
-    $('#current-document-content-edit-save-button').on('click', function(e){
+    $('#current-document-content-edit-save-button, #current-document-content-edit-save-button-top').on('click', function(e){
       // We don't want this to act as a link so cancel the link action
       e.preventDefault();
       $('#current_node_textarea_wysiwyg').cleanHtml();

pboard/pboard/templates/document.mak

@@ -7,15 +7,19 @@ pod :: document ${current_node.getTruncatedLabel(40)} [#${current_node.node_id}
 
 <%def name="node_treeview_for_set_parent_menu(node_id, node_list, indentation=-1)">
   % if indentation==-1:
-    <li><a href="${tg.url('/api/set_parent_node?node_id=%i&new_parent_id=0'%(current_node.node_id))}">${_('Home')}</a>
+    <li>
+      <a href="${tg.url('/api/set_parent_node?node_id=%i&new_parent_id=0'%(current_node.node_id))}">
+        <i class="fa fa-file-text-o"></i> ${_('Home')}
+      </a>
       ${node_treeview_for_set_parent_menu(node_id, node_list, 0)}
     </li>
   % else:
     % if len(node_list)>0:
-      <ul>
+      <ul style="list-style: none;">
       % for new_parent_node in node_list:
         <li>
-          <a href="${tg.url('/api/set_parent_node?node_id=%i&new_parent_id=%i'%(node_id, new_parent_node.node_id))}">${new_parent_node.getTruncatedLabel(40-indentation*2)}</a>
+          <a href="${tg.url('/api/set_parent_node?node_id=%i&new_parent_id=%i'%(node_id, new_parent_node.node_id))}"><i class="fa fa-file-text-o"></i> ${new_parent_node.getTruncatedLabel(40-indentation*2)}
+          </a>
           ${node_treeview_for_set_parent_menu(node_id, new_parent_node.getStaticChildList(), indentation+1)}
         </li>
       % endfor
@@ -82,6 +86,20 @@ pod :: document ${current_node.getTruncatedLabel(40)} [#${current_node.node_id}
     % endif
 </%def>
 
+#######
+##
+## HERE COMES THE BREADCRUMB
+##
+  <div class="row">
+<ul class="breadcrumb span12">
+  <li><span class="divider"> / Documents /</span></li>
+  % for breadcrumb_node in current_node.getBreadCrumbNodes():
+    <li><a href="${tg.url('/document/%s'%(breadcrumb_node.node_id))}">${breadcrumb_node.getTruncatedLabel(30)}</a> <span class="divider">/</span></li>
+  % endfor
+  <li class="active">${current_node.data_label}</li>
+</ul>
+  </div>
+
   <div class="row">
     <div id='application-left-panel' class="span3">
       <div>
@@ -89,107 +107,203 @@ pod :: document ${current_node.getTruncatedLabel(40)} [#${current_node.node_id}
       </div>
     </div>
     <div id='application-main-panel' class="span9">
-    % if current_node.parent_id!=None and current_node.parent_id!=0:
-      <div class="btn-group">
-        <a class="btn " href="${tg.url('/document/%i'%current_node.parent_id)}" title="${_("Go to parent document")}"><i class="fa fa-hand-o-left"></i></a>
-      </div>
-    % endif
-      <div class="btn-group">
-        <button class="btn"  data-toggle="dropdown" href="#">${_("Change status")}</button>
-        <a class="btn dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
-        <ul class="dropdown-menu">
-        % for node_status in node_status_list:
-          % if node_status.status_id==current_node.getStatus().status_id:
-          <li title="${h.getExplanationAboutStatus(node_status.status_id, current_node.getStatus().status_id)}">
-            <a class="${node_status.css}" href="#"  style="color: #999;">
-              <i class="${node_status.icon_id}"></i> ${node_status.label}
-            </a>
-          </li>
-          % else:
-          <li title="${h.getExplanationAboutStatus(node_status.status_id, current_node.getStatus().status_id)}">
-            <a class="${node_status.css}" href="${tg.url('/api/edit_status?node_id=%i&node_status=%s'%(current_node.node_id, node_status.status_id))}">
-              <i class="${node_status.icon_id}"></i> ${node_status.label}
-            </a>
-          </li>
-          % endif
-        % endfor
-        </ul>
-      </div>
-      <div class="btn-group">
-        ${POD.EditButton('current-document-content-edit-button', True)}
-        <a class="btn" href="#" data-toggle="dropdown"><i class="icon-g-move"></i> ${_('Move to')} <span class="caret"></span></a>
-        <ul class="dropdown-menu">
-          ${node_treeview_for_set_parent_menu(current_node.node_id, root_node_list)}
-        </ul>
-
-        <a href='${tg.url('/api/edit_status?node_id=%i&node_status=%s'%(current_node.node_id, 'deleted'))}' id='current-document-force-delete-button' class="btn" onclick="return confirm('${_('Delete current document?')}');"><i class="fa fa-trash-o"></i> ${_('Delete')}</a>
-        
-      </div>
 
       <div class="row">
         <div id='application-document-panel' class="span5">
-          <p>
-            <div id='current-document-content' class="">
-              <h3 id="current-document-title">#${current_node.node_id} - ${current_node.data_label}
-                <span class="label ${current_node.getStatus().css}" href="#">${current_node.getStatus().label}</a>
-              
-              </h3>
-              ${current_node.getContentWithTags()|n}
+          <div id='current-document-content' class="">
+######
+##
+## CURRENT DOCUMENT TOOLBAR - START
+##
+            <div id="current-document-toobar">
+              <div class="btn-group">
+          % if current_node.parent_id!=None and current_node.parent_id!=0:
+                ${POD.EditButton('current-document-content-edit-button', True)}
+          % endif
+      ##        </div>
+      ##        <div class="btn-group">
+                <button class="btn btn-small"  data-toggle="dropdown" href="#"> 
+                  <i class="fa  fa-signal"></i>
+                  ${_("Change status")}
+                </button>
+                <a class="btn btn-small dropdown-toggle" data-toggle="dropdown" href="#">
+                  <span class="caret"></span>
+                </a>
+                <ul class="dropdown-menu">
+                % for node_status in node_status_list:
+                  % if node_status.status_id==current_node.getStatus().status_id:
+                  <li title="${h.getExplanationAboutStatus(node_status.status_id, current_node.getStatus().status_id)}">
+                    <a class="${node_status.css}" href="#"  style="color: #999;">
+                      <i class="${node_status.icon_id}"></i> ${node_status.label}
+                    </a>
+                  </li>
+                  % else:
+                  <li title="${h.getExplanationAboutStatus(node_status.status_id, current_node.getStatus().status_id)}">
+                    <a class="${node_status.css}" href="${tg.url('/api/edit_status?node_id=%i&node_status=%s'%(current_node.node_id, node_status.status_id))}">
+                      <i class="${node_status.icon_id}"></i> ${node_status.label}
+                    </a>
+                  </li>
+                  % endif
+                % endfor
+                </ul>
+              </div>
+              <div class="btn-group">
+                <button class="btn btn-small btn-success"  data-toggle="dropdown" href="#">
+                  <i class="fa fa-plus"></i> ${_('Add')}
+                </button>
+                <a class="btn btn-small dropdown-toggle" data-toggle="dropdown" href="#"><span class="caret"></span></a>
+                <ul class="dropdown-menu">
+                
+                  <li>
+                    <div class="btn-success strong" ><strong><i class="fa fa-magic"></i> Add New...</strong><br/></div>
+                    <div class="pod-grey"><i>create a totally new item...</i></div>
+                  </li>
+
+                  <li><a><i class="fa fa-file-text-o"></i> Document</a></li>
+                  <li><a><i class="fa fa-paperclip"></i> File</a></li>
+                  <li><a><i class="fa fa-calendar"></i> Event</a></li>
+                  <li><a><i class="fa fa-user"></i> Contact</a></li>
+                  <li><a><i class="fa fa-comments-o"></i> Comment</a></li>
+
+                  <li class="divider" role="presentation"></li>
+
+                  <li>
+                    <div class="btn-warning strong" ><strong><i class="fa fa-link"></i> Add Existing...</strong><br/></div>
+                    <div class="pod-grey"><i>link to an existing item...</i></div>
+                  </li>
+                  <li><a><i class="fa fa-file-text-o"></i> Document</a></li>
+                  <li><a><i class="fa fa-paperclip"></i> File</a></li>
+                  <li><a><i class="fa fa-calendar"></i> Event</a></li>
+                  <li><a><i class="fa fa-user"></i> Contact</a></li>
+                  <li><a><i class="fa fa-comments-o"></i> Comment</a></li>
+
+                </ul>
+              </div>
+              <div class="btn-group ">
+                <a
+                  class="btn btn-small btn-warning"
+                  href="#"
+                  data-toggle="dropdown"
+                  title="${_('Move to')}"
+                  ><i class="fa fa-arrows"></i></a>
+                <ul class="dropdown-menu">
+                  <li >
+                    <div class="btn-warning strong" ><strong><i class="fa fa-magic"></i> ${_("Move the document...")}</strong><br/></div>
+                    <div class="pod-grey"><i>move the document to...</i></div>
+                  </li>
+                  ${node_treeview_for_set_parent_menu(current_node.node_id, root_node_list)}
+                </ul>
+                <a
+                  class="btn btn-small btn-danger"
+                  href='${tg.url('/api/edit_status?node_id=%i&node_status=%s'%(current_node.node_id, 'deleted'))}'
+                  id='current-document-force-delete-button' onclick="return confirm('${_('Delete current document?')}');"
+                  title="${_('Delete')}"
+                  ><i class="fa fa-trash-o"></i></a>
+              </div>
+            </div>
+##
+## CURRENT DOCUMENT TOOLBAR - END
+##
+######
+
+######
+##
+## CURRENT DOCUMENT CONTENT - START
+##
+            <h3 id="current-document-title">#${current_node.node_id} - ${current_node.data_label}
+              <span class="label ${current_node.getStatus().css}" href="#">${current_node.getStatus().label}</a>
+            </h3>
+            % if len(keywords)>0 and keywords!='':
+                ${current_node.getContentWithHighlightedKeywords(keywords.split(), current_node.getContentWithTags())|n}
+            % else:
+                ${current_node.getContentWithTags()|n}
+            % endif
+          </div>
+          <form style='display: none;' id="current-document-content-edit-form" method='post' action='${tg.url('/api/edit_label_and_content')}'>
+            <div>
+              ${POD.CancelButton('current-document-content-edit-cancel-button-top', True)}
+              ${POD.SaveButton('current-document-content-edit-save-button-top', True)}
             </div>
-            <form style='display: none;' id="current-document-content-edit-form" method='post' action='${tg.url('/api/edit_label_and_content')}'>
+            <div style="padding: 0.5em 0 0 0">
               <input type='hidden' name='node_id' value='${current_node.node_id}'/>
               <input type="hidden" name='data_content' id="current_node_textarea" />
               <input type='text' name='data_label' value='${current_node.data_label}' class="span4" placeholder="document title" />
+            </div>
+            <div>
               ${POD.RichTextEditor('current_node_textarea_wysiwyg', current_node.data_content)}
+            </div>
+            <div class="pull-right">
               ${POD.CancelButton('current-document-content-edit-cancel-button', True)}
               ${POD.SaveButton('current-document-content-edit-save-button', True)}
-
-
-            </form>
-          </p>
+            </div>
+          </form>
         </div>
         ## FIXME - D.A - 2013-11-07 - The following div should be span4 instead of span3 but some bug make it impossible
         <div id='application-metadata-panel' class="span4">
           <div class="tabbable">
             <ul class="nav nav-tabs">
-                ## FIXME - D.A. - 2013-11-07 - TO REMOVE OR TO REACTIVATE  <li class="active"><a href="#tags" data-toggle="tab" title="${_('Tags')}"><i class='icon-g-tags'></i></a></li>
-                <li class="active"><a href="#events" data-toggle="tab" title="History"><i class="pod-dark-grey fa fa-calendar"></i>${POD.ItemNb(current_node.getEvents())}</a></li>
-                <li><a href="#contacts" data-toggle="tab" title="Contacts"><i class="pod-dark-grey fa fa-user"></i>${POD.ItemNb(current_node.getContacts())}</a></li>
-                <li><a href="#comments" data-toggle="tab" title="Comments"><i class="pod-dark-grey fa fa-comments-o"></i>${POD.ItemNb(current_node.getComments())}</a></li>
-                <li><a href="#files" data-toggle="tab" title="Files"><i class="pod-dark-grey fa  fa-file-text-o"></i>${POD.ItemNb(current_node.getFiles())}</a></li>
+                <li><a href="#subdocuments" data-toggle="tab" title="${_('Subdocuments')}"><i class='pod-dark-grey fa fa-file-text-o'></i>
+                
+                ${POD.ItemNb(current_node.getChildren())}</a></li>
+                
+                <li class="active"><a href="#events" data-toggle="tab" title="${_('Calendar')}"><i class="pod-dark-grey fa fa-calendar"></i>${POD.ItemNb(current_node.getEvents())}</a></li>
+                <li><a href="#contacts" data-toggle="tab" title="${_('Address book')}"><i class="pod-dark-grey fa fa-user"></i>${POD.ItemNb(current_node.getContacts())}</a></li>
+                <li><a href="#comments" data-toggle="tab" title="${_('Comment thread')}"><i class="pod-dark-grey fa fa-comments-o"></i>${POD.ItemNb(current_node.getComments())}</a></li>
+                <li><a href="#files" data-toggle="tab" title="${_('Attachments')}"><i class="pod-dark-grey fa  fa-paperclip"></i>${POD.ItemNb(current_node.getFiles())}</a></li>
+                
+                <li class="pull-right"><a href="#accessmanagement" data-toggle="tab" title="${_('Access Management')}"><i class="pod-dark-grey fa fa-key"></i>${POD.ItemNb(current_node.getFiles())}</a></li>
+                 
             </ul>
             <div class="tab-content">
                 ################################
                 ##
-                ## PANEL SHOWING LIST OF TAGS
+                ## PANEL SHOWING LIST OF SUB DOCUMENTS
                 ##
                 ################################
-                <!-- DEBUG - D.A. - 2013-11-07 - Not using tags for th moment
-                <div class="tab-pane" id="tags">
-                  <div class="well">
-                    <p>
-                      <i>
-                        ${_('Tags are automatically extracted from document content:')}
-                        <ul>
-                          <li>${_('<code>@visible_keyword</code> is a visible keyword generating a tag.')|n}</li>
-                          <li>
-                            ${_('<code>@invisible_keyword</code> is an <u>invisible</u> keyword generating a tag.')|n}</li>
-                        </ul>
-                      </i>
-                    </p>
-                    % for tag in current_node.getTagList():
-                      ${POD.Badge(tag)}
+                <!-- DEBUG - D.A. - 2013-11-07 - Not using tags for th moment -->
+                <div class="tab-pane" id="subdocuments">
+                % if len(current_node.getChildren())<=0:
+                  <p class="pod-grey">
+                    ${_("There is currently no child documents.")}<br/>
+                  </p>
+                  <p>
+                    <a class="btn btn-success btn-small" href="${tg.url('/api/create_document?parent_id=%i'%current_node.node_id)}">
+                      <i class="fa fa-plus"></i> ${_("Add one")}
+                    </a>
+                  </p>
+                % else:
+                  <p>
+                    <a class="btn btn-success btn-small" href="${tg.url('/api/create_document?parent_id=%i'%current_node.node_id)}">
+                      <i class="fa fa-plus"></i> ${_("Add new document")}
+                    </a>
+                  </p>
+
+                  <div>
+                    % for subnode in current_node.getChildren():
+                      <p style="list-style-type:none;">
+                        <i class="fa-fw ${subnode.getIconClass()}"></i>
+                          <a href="${tg.url('/document/%i'%subnode.node_id)}">
+                            ${subnode.data_label}
+                          </a>
+                      </p>
                     % endfor
                   </div>
+                % endif
                 </div>
-                -->
+                
                 ################################
                 ##
                 ## PANEL SHOWING LIST OF EVENTS
                 ##
                 ################################
                 <div class="tab-pane active" id="events">
-                  ${POD.AddButton('current-document-add-event-button', True, _(' Add event'))}
+                % if len(current_node.getEvents())<=0:
+                  <p class="pod-grey">${_("The calendar is empty.")}<br/></p>
+                  <p>${POD.AddButton('current-document-add-event-button', True, _(' Add first event'))}</p>
+                % else:
+                  <p>${POD.AddButton('current-document-add-event-button', True, _(' Add an event'))}</p>
+                % endif
+                
                   <form style='display: none;' id='current-document-add-event-form' action='${tg.url('/api/create_event')}' method='post' class="well">
                     <input type="hidden" name='parent_id' value='${current_node.node_id}'/>
                     <fieldset>
@@ -225,9 +339,7 @@ pod :: document ${current_node.getTruncatedLabel(40)} [#${current_node.node_id}
                     </fieldset>
                   </form>
 
-                % if len(current_node.getEvents())<=0:
-                  <p><i>${_('No history for the moment.')}</i></p>
-                % else:
+                % if len(current_node.getEvents())>0:
                   <table class="table table-striped table-hover table-condensed">
                     <thead>
                       <tr>
@@ -261,9 +373,14 @@ pod :: document ${current_node.getTruncatedLabel(40)} [#${current_node.node_id}
                 ##
                 ##############################
                 <div class="tab-pane" id="contacts">
-                
+                % if len(current_node.getContacts())<=0:
+                  <p class="pod-grey">${_("The address book is empty.")}<br/></p>
+                  <p>${POD.AddButton('current-document-add-contact-button', True, _(' Add first contact'), True)}</p>
+                % else:
+                  <p>${POD.AddButton('current-document-add-contact-button', True, _(' Add a contact'))}</p>
+                % endif
+
                   <!-- ADD CONTACT FORM -->
-                  ${POD.AddButton('current-document-add-contact-button', True, _(' Add contact'))}
                   <form style='display: none;' id='current-document-add-contact-form' action='${tg.url('/api/create_contact')}' method='post' class="well">
                     <input type="hidden" name='parent_id' value='${current_node.node_id}'/>
                     <fieldset>
@@ -306,8 +423,14 @@ pod :: document ${current_node.getTruncatedLabel(40)} [#${current_node.node_id}
                 ##
                 ################################
                 <div class="tab-pane" id="comments">
+                % if len(current_node.getComments())<=0:
+                  <p class="pod-grey">${_("The comment thread is empty.")}<br/></p>
+                  <p>${POD.AddButton('current-document-add-comment-button', True, _('Add first comment'), True)}</p>
+                % else:
+                  <p>${POD.AddButton('current-document-add-comment-button', True, _('Add a comment'))}</p>
+                % endif
+
                   <!-- ADD COMMENT FORM -->
-                  ${POD.AddButton('current-document-add-comment-button', True, _(' Add comment'))}
                   <form style='display: none;' id='current-document-add-comment-form' action='${tg.url('/api/create_comment')}' method='post' class="well">
                     <input type="hidden" name='parent_id' value='${current_node.node_id}'/>
                     <fieldset>
@@ -327,9 +450,7 @@ pod :: document ${current_node.getTruncatedLabel(40)} [#${current_node.node_id}
                   </form>
 
                   <!-- LIST OF COMMENTS -->
-                % if len(current_node.getComments())<=0:
-                  <p><i>${_('No comments.')}</i></p>
-                % else:
+                % if len(current_node.getComments())>0:
                   <table class="table table-striped table-hover table-condensed">
                     % for comment in current_node.getComments():
                       <tr title="Last updated: ${comment.updated_at}">
@@ -354,8 +475,14 @@ pod :: document ${current_node.getTruncatedLabel(40)} [#${current_node.node_id}
                 ##
                 ################################
                 <div class="tab-pane" id="files">
+                % if len(current_node.getFiles())<=0:
+                  <p class="pod-grey">${_("There is currently no attachment.")}<br/></p>
+                  <p>${POD.AddButton('current-document-add-file-button', True, _(' Attach first file'))}</p>
+                % else:
+                  <p>${POD.AddButton('current-document-add-file-button', True, _(' Attach a file'))}</p>
+                % endif
+
                   <!-- ADD FILE FORM -->
-                  ${POD.AddButton('current-document-add-file-button', True, _(' Add file'))}
                   <form style='display: none;' id='current-document-add-file-form' enctype="multipart/form-data" action='${tg.url('/api/create_file')}' method='post' class="well">
                     <input type="hidden" name='parent_id' value='${current_node.node_id}'/>
                     <fieldset>
@@ -378,35 +505,42 @@ pod :: document ${current_node.getTruncatedLabel(40)} [#${current_node.node_id}
                   </form>
 
                   <!-- LIST OF FILES -->
-                % if len(current_node.getFiles())<=0:
-                  <p><i>${_('No files.')}</i></p>
-                % else:
-                  <table class="table table-striped table-hover table-condensed">
+                  <div>
+                % if len(current_node.getFiles())>0:
                     % for current_file in current_node.getFiles():
-                      <tr title="Last updated: ${current_file.updated_at}">
-                        <td>
-                          <a href="${tg.url('/api/get_file_content/%s'%(current_file.node_id))}" title="${_("Download file")}">
-                            <i class="fa fa-2x fa-file-text-o"></i>
-                          </a>
-                          ## FIXME - SHOW THUMBNAIL WHEN IT WILL BE OK<img src="${tg.url('/api/get_file_content_thumbnail/%s'%(current_file.node_id))}" class="img-polaroid">
-                        </td>
-                        <td>
-                          <b>${current_file.data_label}</b>
-                          <a class="pull-right" href="${tg.url('/api/get_file_content/%s'%(current_file.node_id))}" title="${_("Download file")}">
-                            <i class="fa fa-download"></i>
-                          </a>
-                          <a class="pull-right" href="${tg.url('/document/%i'%current_file.node_id)}" title="${_("Edit title or comment")}"><i class="fa fa-edit"></i></a>
-
-                          <br/>
-                          <p>
-                            ${current_file.data_content|n}
-                          </p>
-                        </td>
-                      </tr>
+                      <p style="list-style-type:none; margin-bottom: 0.5em;">
+                        <i class="fa fa-paperclip"></i>
+                        <a
+                          href="${tg.url('/document/%i'%current_file.node_id)}"
+                          title="${_('View the attachment')}: ${current_file.data_label}"
+                        >
+                          ${current_file.getTruncatedLabel(50)}
+                        </a>
+                        <a
+                          class="pull-right"
+                          href="${tg.url('/api/get_file_content/%s'%(current_file.node_id))}"
+                          title="${_('View the attachment')}"
+                        >
+                          <i class="fa fa-download"></i>
+                        </a>
+                      </p>
                     % endfor
-                  </table>
                 % endif
+                  </div>
                 </div>
+                
+                
+                ################################
+                ##
+                ## PANEL SHOWING ACCESS MANAGEMENT
+                ##
+                ################################
+                <div class="tab-pane" id="accessmanagement">
+                  blabla
+                </div>
+                
+                
+                
               </div>
             </div>
           </div>

pboard/pboard/templates/master.mak

@@ -212,13 +212,13 @@
               
             % endif
           </ul>
+          <form class="navbar-search pull-right form-search" action="${tg.url('/search')}">
+            <div class="input-append">
+              <input name="keywords" type="text" class="span2 search-query" placeholder="Search" value="${context.get('search_string', '')}">
+              <button title="${_('Search')}" class="btn" type="submit"><i class="fa fa-search"></i></button>
+            </div>
+          </form>
 
-          #####################
-          ## FIXME - D.A. - 2013-11-07 - Make search available
-          ## 
-          ## <form class="navbar-search pull-right" action="">
-          ##   <input type="text" class="search-query span2" placeholder="Search">
-          ## </form>
         </div><!-- /.nav-collapse -->
       </div><!-- /.container -->
     </div><!-- /.navbar-inner -->

pboard/pboard/templates/pod.mak

@@ -1,18 +1,55 @@
+<%def name="IconCssClass(psNodeType)" >
+  % if psNodeType=='data':
+    fa fa-file-text-o
+  % elif  psNodeType=='folder':
+    fa fa-folder-open
+  % elif  psNodeType=='node':
+    fa fa-file-text-o
+  % elif  psNodeType=='file':
+    fa fa-paperclip
+  % elif  psNodeType=='event':
+    fa fa-calendar
+  % elif  psNodeType=='contact':
+    fa fa-user
+  % elif  psNodeType=='comment':
+    fa fa-comments-o
+  % endif
+</%def>
+
+<%def name="DocumentTypeLabel(psNodeType)" ><%
+  labels = dict()
+  labels['data'] = 'document'
+  labels['folder'] = 'folder'
+  labels['node'] = 'node'
+  labels['file'] = 'file'
+  labels['event'] = 'event'
+  labels['contact'] = 'contact'
+  labels['comment'] = 'comment'
+  return labels[psNodeType]
+%></%def>
+
+<%def name="DocumentUrl(piNodeId, psHighlight)" >${tg.url('/document/%i?highlight=%s'%(piNodeId, psHighlight))}</%def>
+<%def name="DocumentUrlWithAnchor(piNodeId, psHighlight, psAnchor)" >${tg.url('/document/%i?highlight=%s#%s'%(piNodeId, psHighlight, psAnchor))}</%def>
+
 <%def name="Button(piId, pbWithLabel, psButtonCssClass, psButtonTitle, psButtonIcon, psButtonLabel)" >
   <button id='${piId}' type="button" class="${psButtonCssClass}" title="${psButtonTitle}"><i class="${psButtonIcon}"></i>${'' if (pbWithLabel==False) else ' %s'%(psButtonLabel)}</button>
 </%def>
 
 <%def name="SaveButton(piId, pbWithLabel=False)" >
-  ${Button(piId, pbWithLabel, 'btn btn-success', _('Save'), ' icon-g-ok-2 icon-g-white', _('Save'))}
+  ${Button(piId, pbWithLabel, 'btn btn-small btn-success', _('Save'), ' icon-g-ok-2 icon-g-white', _('Save'))}
 </%def>
 <%def name="EditButton(piId, pbWithLabel=False)" >
-  ${Button(piId, pbWithLabel, 'btn', _('Edit'), 'icon-g-edit', _('Edit'))}
+  ${Button(piId, pbWithLabel, 'btn btn-small', _('Edit'), 'fa fa-edit', _('Edit'))}
 </%def>
 <%def name='CancelButton(piId, pbWithLabel=False)'>
-  ${Button(piId, pbWithLabel, 'btn ', _('Cancel'), 'icon-g-ban', _('Cancel'))}
+  ${Button(piId, pbWithLabel, 'btn btn-small', _('Cancel'), 'icon-g-ban', _('Cancel'))}
 </%def>
-<%def name='AddButton(piId, pbWithLabel=False, psLabel=None)'>
-  ${Button(piId, pbWithLabel, 'btn', psLabel or _('New'), 'icon-g-circle-plus', psLabel or _('New'))}
+<%def name='AddButton(piId, pbWithLabel=False, psLabel=None, pbIsCallToAction=True)'>
+% if pbIsCallToAction:
+  ${Button(piId, pbWithLabel, 'btn btn-small btn-success', psLabel or _('New'), 'fa fa-plus', psLabel or _('New'))}
+% else:
+  ${Button(piId, pbWithLabel, 'btn btn-small', psLabel or _('New'), 'fa fa-plus', psLabel or _('New'))}
+% endif
 </%def>
 <%def name='Badge(psLabel, psCssClass="")'>
   <span class='badge ${psCssClass}'>${psLabel}</span>
@@ -41,15 +78,23 @@
 <%def name='RichTextEditorToolbar(psRichTextEditorNodeId, psMenuOptions="styles|boldanditalic|lists|justifiers|links|images|undoredo|fullscreen")'>
       <div class="btn-toolbar" data-role="${psRichTextEditorNodeId}-toolbar" data-target="${psRichTextEditorNodeId}">
       % if psMenuOptions.find('styles')>=0:
+      
         <div class="btn-group">
-          <a class="btn" data-edit="formatBlock p"   title="Normal paragraph">§</h1></a></li>
-          <a class="btn" data-edit="formatBlock pre" title="Fixed width (code)">C</h1></a>
-          <a class="btn" data-edit="formatBlock h1"  title="Title - level 1">h1</a>
-          <a class="btn" data-edit="formatBlock h2"  title="Title - level 2">h2</a>
-          <a class="btn" data-edit="formatBlock h3"  title="Title - level 3">h3</a>
-          <a class="btn" data-edit="formatBlock h4"  title="Title - level 4">h4</a>
-          <a class="btn" data-edit="formatBlock h5"  title="Title - level 5">h5</a>
-          <a class="btn" data-edit="formatBlock h6"  title="Title - level 6">h6</a>
+          <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
+            <i class="fa fa-font"></i>
+            <span class="caret"></span>
+          </a>
+          <ul class="dropdown-menu">
+          <!-- dropdown menu links -->
+            <li><a data-edit="formatBlock p"   title="Normal paragraph"><p style="margin: 0">text body</p></a></li>
+            <li><a data-edit="formatBlock pre" title="Fixed width (code)"><pre style="margin: 0">quote</pre></a></li>
+            <li><a data-edit="formatBlock h1"  title="Title - level 1"><h1 style="margin: 0">heading 1</h1></a></li>
+            <li><a data-edit="formatBlock h2"  title="Title - level 2"><h2 style="margin: 0">heading 2</h2></a></li>
+            <li><a data-edit="formatBlock h3"  title="Title - level 3"><h3 style="margin: 0">heading 3</h3></a></li>
+            <li><a data-edit="formatBlock h4"  title="Title - level 4"><h4 style="margin: 0">heading 4</h4></a></li>
+            <li><a data-edit="formatBlock h5"  title="Title - level 5"><h5 style="margin: 0">heading 5</h5></a></li>
+            <li><a data-edit="formatBlock h6"  title="Title - level 6"><h6 style="margin: 0">heading 6</h6></a></li>
+          </ul>
         </div>
       % endif
       % if psMenuOptions.find('boldanditalic')>=0:
@@ -76,22 +121,30 @@
           <a class="btn" data-edit="justifyfull" title="Justify (Ctrl/Cmd+J)"><i class="fa fa-align-justify"></i></a>
         </div>
       % endif
-      % if psMenuOptions.find('links')>=0:
-        <div class="btn-group">
-          <a class="btn dropdown-toggle" data-toggle="dropdown" title="Hyperlink"><i class="fa fa-link"></i></a>
-          <div class="dropdown-menu input-append">
-            <input class="span2" placeholder="URL" type="text" data-edit="createLink"/>
-            <button class="btn" type="button">Add</button>
-          </div>
-          <a class="btn" data-edit="unlink" title="Remove Hyperlink"><i class="fa fa-cut"></i></a>
-        </div>
-      % endif
-      % if psMenuOptions.find('images')>=0:
-        <div class="btn-group">
-          <a class="btn" title="Insert picture (or just drag & drop)" id="pictureBtn"><i class="fa fa-picture-o"></i></a>
-          <input type="file" data-role="magic-overlay" data-target="#pictureBtn" data-edit="insertImage" />
-        </div>
-      % endif
+#######
+##
+## LINK MENU ; NOT WORKING FOR NOW (links are auto-generated at render time)
+##
+##      % if psMenuOptions.find('links')>=0:
+##        <div class="btn-group">
+##          <a class="btn dropdown-toggle" data-toggle="dropdown" title="Hyperlink"><i class="fa fa-link"></i></a>
+##          <div class="dropdown-menu input-append">
+##            <input class="span2" placeholder="URL" type="text" data-edit="createLink"/>
+##            <button class="btn" type="button">Add</button>
+##          </div>
+##          <a class="btn" data-edit="unlink" title="Remove Hyperlink"><i class="fa fa-cut"></i></a>
+##        </div>
+##      % endif
+#######
+##
+## IMAGES MENU ; NOT WORKING FOR NOW
+##
+##      % if psMenuOptions.find('images')>=0:
+##        <div class="btn-group">
+##          <a class="btn" title="Insert picture (or just drag & drop)" id="pictureBtn"><i class="fa fa-picture-o"></i></a>
+##          <input type="file" data-role="magic-overlay" data-target="#pictureBtn" data-edit="insertImage" />
+##        </div>
+##      % endif
       % if psMenuOptions.find('undoredo')>=0:
         <div class="btn-group">
           <a class="btn" data-edit="undo" title="Undo (Ctrl/Cmd+Z)"><i class="fa fa-undo"></i></a>
@@ -122,9 +175,9 @@
 
 <%def name='RichTextEditor(psRichTextEditorNodeId, psRichTextEditorContent="", psMenuOptions="styles|boldanditalic|lists|justifiers|links|images|undoredo|fullscreen")'>
   <div id="${psRichTextEditorNodeId}-widget" class="rich-text-editor-widget">
+    ${RichTextEditorToolbar(psRichTextEditorNodeId, psMenuOptions)}
     <div id="${psRichTextEditorNodeId}-widget-inner" class="rich-text-editor-widget-inner">
       <div id="${psRichTextEditorNodeId}-alert-container"></div>
-      ${RichTextEditorToolbar(psRichTextEditorNodeId, psMenuOptions)}
       <div id="${psRichTextEditorNodeId}" class="pod-rich-text-zone pod-input-like-shadow">
         ${psRichTextEditorContent|n}
       </div>

pboard/pboard/templates/search.mak

@@ -0,0 +1,134 @@
+<%inherit file="local:templates.master"/>
+<%namespace name="POD" file="pboard.templates.pod"/>
+
+<%def name="title()">
+pod :: your dashboard
+</%def>
+
+<div class="row">
+  <div class="span6">
+    <form class="form-search" action="${tg.url('/search')}">
+      <div class="input-append">
+        <input name="keywords" type="text" class="span2 search-query" placeholder="Search" value="${context.get('search_string', '')}">
+        <button title="${_('Search again')}" class="btn" type="submit"><i class="fa fa-search"></i></button>
+      </div>
+    </form>
+  </div>
+</div>
+<div class="row">
+  <div class="span6">
+    <p>
+      <i class="pod-blue fa fa-search"></i>
+      ${_("Results")}
+      <span class="badge badge-info">${len(found_nodes)}  result(s)</span> 
+      % for keyword in search_string.split():
+        <span class="label">${keyword}</span>
+      % endfor
+    </p>
+  </div>
+</div>
+<div class="row">
+  <div class="span6">
+#######
+## SHOW RESULT FILTERING TOOLBAR
+    <span>Filter results:</span>
+    <div class="btn-group search-result-toogle-buttons" data-toggle="buttons-checkbox">
+      % for data_type in ('file', 'event', 'data', 'contact', 'comment'):
+        <button
+            id="search-result-toogle-button-${data_type}"
+            class="btn search-result-dynamic-toogle-button"
+            title="Show/hide ${POD.DocumentTypeLabel(data_type)} results"
+        >
+          <i class=" ${POD.IconCssClass(data_type)}"></i>
+          <sup style="color: #5BB75B;"><i class="fa fa-check"></i></sup>
+        </button>
+      % endfor
+    </div>
+  </div>
+</div>
+<script>
+
+$('.search-result-toogle-buttons > button.search-result-dynamic-toogle-button').addClass('active');
+
+
+
+$('#search-result-toogle-button-file').click(function () {
+  $('.search-result-file').toggle();
+  $('#search-result-toogle-button-file > sup').toggle();
+});
+$('#search-result-toogle-button-event').click(function () {
+  $('.search-result-event').toggle();
+  $('#search-result-toogle-button-event > sup').toggle();
+});
+$('#search-result-toogle-button-data').click(function () {
+  $('.search-result-data').toggle();
+  $('#search-result-toogle-button-data > sup').toggle();
+});
+$('#search-result-toogle-button-contact').click(function () {
+  $('.search-result-contact').toggle();
+  $('#search-result-toogle-button-contact > sup').toggle();
+});
+$('#search-result-toogle-button-comment').click(function () {
+  $('.search-result-comment').toggle();
+  $('#search-result-toogle-button-comment > sup').toggle();
+});
+</script>
+
+% if found_nodes==None or len(found_nodes)<=0:
+#######
+## No result view
+<div class="row">
+  <p class="alert">
+    <i class="fa  fa-exclamation-triangle"></i>
+    ${_("No data found for keywords:")} <i>${search_string}</i>
+  </p>
+</div>
+% else:
+#######
+## Standard result view
+##  <hr/>
+
+<div class="row">
+  <div class="span12">
+  % for result_id, node in enumerate(found_nodes):
+  
+    <div class="row">
+      <div class="span5 search-result-item search-result-${node.node_type}">
+
+        <h5 title="${node.data_label}">
+    % if node.node_type=='data' or node.parent_id==None:
+          <a href="${POD.DocumentUrl(node.node_id, search_string)}">
+    % else:
+          <a href="${POD.DocumentUrlWithAnchor(node.parent_id, search_string, 'tab-%ss'%node.node_type)}">
+    % endif
+            <i class="${node.getIconClass()}"></i>
+            ${node.data_label}
+            <span class="label ${node.getStatus().css} pull-right" title="${node.getStatus().label}">
+              <i class="${node.getStatus().icon}"></i>
+              
+              
+            <span>
+          </a>
+        </h5>
+## Now show the breakcrumb in a google-like manner
+        <div>
+    % for parent_node in node.getBreadCrumbNodes():
+          <a style="color: #468847;" href="${POD.DocumentUrl(parent_node.node_id, search_string)}" title="${parent_node.data_label}">${parent_node.getTruncatedLabel(30)}</a>
+          <span style="color: #468847;" >/</span>
+    % endfor
+
+            <a style="color: #468847;" href="${POD.DocumentUrl(node.node_id, search_string)}" title="${node.data_label}">
+              ${node.getTruncatedLabel(30)}
+            </a>
+        </div>
+        <div class="row">
+          <p class="span5">${node.getContentWithHighlightedKeywords(search_string.split(), node.getTruncatedContentAsText(200))|n}</p>
+        </div>
+##      <hr/>
+      </div>
+    </div>
+  % endfor
+  </div>
+% endif
+</div>
+