initial work for contact page

diff --git a/css/style.css b/css/style.css
index b1cbaaff10d345c6e85f9df0c3319d7b0e444e57..74186dbe2838275d33fec03d8a8e5dc677f2c06b 100644 (file)
--- a/css/style.css
+++ b/css/style.css
@@ -1414,6 +1414,19 @@ ul.dropdown-menu li:hover {
     font-size: 11px;
     color: #bebebe;
 }
+.media-list > li {
+    padding: 10px;
+    border-bottom: 1px solid rgba(238, 238, 238, $contentbg_transp);
+    position: relative;
+/*    border-left: 3px solid rgba(255,255,255,$contentbg_transp);*/
+    border-left: 3px solid rgba(255,255,255,0);
+    font-size: 12px;
+}
+.media-list > li:hover,
+.media-list > li.selected {
+    border-left: 3px solid $link_color;
+    background-color: rgba(247, 247, 247, $contentbg_transp);
+}
 
 /* Forms */
 .form-control {
@@ -1462,7 +1475,9 @@ ul.dropdown-menu li:hover {
 /* PAGES */
 
 /* Profile-page */
-#profile-page, .photos-content-wrapper, .settings-content-wrapper {
+#profile-page, .photos-content-wrapper, .settings-content-wrapper,
+.contacts-content-wrapper, .suggest-content-wrapper, .common-content-wrapper,
+.allfriends-content-wrapper, .match-content-wrapper {
     padding: 15px;
     padding-bottom: 20px;
     margin-bottom: 20px;
@@ -1489,6 +1504,36 @@ ul.dropdown-menu li:hover {
     float: left;
 }
 
+/* contacts page */
+ul.viewcontact_wrapper {
+    margin-left: -15px;
+    margin-right: -15px;
+}
+ul.viewcontact_wrapper > li {
+    padding-left: 15px;
+}
+.contact-wrapper {
+/*    padding: 10px;
+    border-bottom: 1px solid rgba(238, 238, 238, $contentbg_transp);;
+    position: relative;*/
+    /*border-left: 3px solid white;*/
+}
+.contact-wrapper.media {
+    overflow: visible;
+    word-wrap: break-word;
+}
+.contact-entry-desc {
+    color: #555;
+}
+.contact-entry-checkbox {
+    margin-top: -20px;
+}
+.contact-wrapper .media-body .contact-entry-name h4.media-heading {
+    font-weight: bold;
+    color: #777;
+    font-size: 15px;
+}
+
 /*
 * Overwriting for transparency and other colors
 */

diff --git a/templates/contact_template.tpl b/templates/contact_template.tpl
new file mode 100644 (file)
index 0000000..13ca175
--- /dev/null
+++ b/templates/contact_template.tpl
@@ -0,0 +1,59 @@
+
+<div class="contact-wrapper media" id="contact-entry-wrapper-{{$id}}" >
+       
+               <div class="contact-photo-wrapper dropdown pull-left" >
+                       <div class="contact-photo mframe" id="contact-entry-photo-{{$contact.id}}" >
+
+                               <a class="dropdown-toggle" id="contact-photo-menu-{{$contact.id}}" type="button"  data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" >
+                                       <div class="contact-photo-image-wrapper">
+                                               <img class="contact-photo media-object" src="{{$contact.thumb}}" {{$contact.sparkle}} alt="{{$contact.name}}" />
+
+                                               {{* Overlay background on hover the avatar picture *}}
+                                               <div class="contact-photo-overlay">
+                                                       <span class="contact-photo-overlay-content"><i class="fa fa-angle-down"></i></span>
+                                               </div>
+                                       </div>
+                               </a>
+
+
+                               {{if $contact.photo_menu}}
+                               <ul class="contact-photo-menu menu-popup dropdown-menu " id="contact-photo-menu-{{$contact.id}}" role="menu" aria-labelledby="contact-photo-menu-{{$contact.id}}">
+                                       {{foreach $contact.photo_menu as $c}}
+                                       {{if $c.2}}
+                                       <li role="menuitem"><a target="redir" href="{{$c.1}}">{{$c.0}}</a></li>
+                                       {{else}}
+                                       <li role="menuitem"><a href="{{$c.1}}">{{$c.0}}</a></li>
+                                       {{/if}}
+                                       {{/foreach}}
+                               </ul>
+
+                               {{/if}}
+                       </div>
+
+               </div>
+
+               <div class="media-body">
+                       <div class="contact-entry-desc">
+                               <div class="contact-entry-name" id="contact-entry-name-{{$contact.id}}" >
+                                       <h4 class="media-heading">{{$contact.name}}
+                                       {{if $contact.account_type}} <small class="contact-entry-details" id="contact-entry-accounttype-{{$contact.id}}">({{$contact.account_type}})</small>{{/if}}
+                                       </h4>
+                               </div>
+                               {{if $contact.alt_text}}<div class="contact-entry-details" id="contact-entry-rel-{{$contact.id}}" >{{$contact.alt_text}}</div>{{/if}}
+                               {{if $contact.itemurl}}<div class="contact-entry-details" id="contact-entry-url-{{$contact.id}}" >{{$contact.itemurl}}</div>{{/if}}
+                               {{if $contact.tags}}<div class="contact-entry-details" id="contact-entry-tags-{{$contact.id}}" >{{$contact.tags}}</div>{{/if}}
+                               {{if $contact.details}}<div class="contact-entry-details" id="contact-entry-details-{{$contact.id}}" >{{$contact.details}}</div>{{/if}}
+                               {{if $contact.network}}<div class="contact-entry-details" id="contact-entry-network-{{$contact.id}}" >{{$contact.network}}</div>{{/if}}
+                       </div>
+
+                       {{* if !$no_contacts_checkbox *}}
+                       {{if $multiselect}}
+                       <div class="checkbox contact-entry-checkbox pull-right">
+                               <input id="checkbox-{{$contact.id}}" type="checkbox" class="contact-select pull-right" name="contact_batch[]" value="{{$contact.id}}">
+                               <label for="checkbox-{{$contact.id}}"></label>
+                       </div>
+                       {{/if}}
+               </div>
+       
+
+</div>

diff --git a/templates/contacts-template.tpl b/templates/contacts-template.tpl
new file mode 100644 (file)
index 0000000..98a2d62
--- /dev/null
+++ b/templates/contacts-template.tpl
@@ -0,0 +1,98 @@
+
+<div id="contacts" class="standard-page">
+
+       {{$tabs}}
+
+       <h2 class="headding">{{$header}} {{if $total}} ({{$total}}) {{/if}}</h2>
+
+       {{if $finding}}<h4>{{$finding}}</h4>{{/if}}
+
+       <div id="contacts-search-wrapper">
+               <form id="contacts-search-form" class="navbar-form" action="{{$cmd}}" method="get" >
+                       <label for="contacts-search" class="contacts-search-desc">{{$desc}}</label><br/>
+                       <div class="input-group">
+                               <input type="text" name="search" id="contacts-search" class="search-input form-control" onfocus="this.select();" value="{{$search|escape:'html'}}" />
+                               <div class="input-group-btn">
+                                       <button class="btn btn-default" type="submit" name="submit" id="contacts-search-submit" value="{{$submit|escape:'html'}}"><i class="fa fa-search"></i></button>
+                               </div>
+                       </div>
+               </form>
+       </div>
+
+       <hr>
+       <div id="contacts-search-end"></div>
+
+       <form action="{{$baseurl}}/contacts/batch/" method="POST">
+               <ul class="nav nav-pills preferences">
+                       <li class="dropdown pull-right">
+                               <a class="btn btn-link dropdown-toggle" type="button" id="BatchActionDropdownMenuTools" data-toggle="dropdown" aria-expanded="true">
+                                       <i class="fa fa-angle-down"></i>
+                               </a>
+                               <ul class="dropdown-menu pull-right" role="menu" aria-labelledby="BatchActionDropdownMenuTools">
+                               {{foreach $batch_actions as $n=>$l}}
+                                       <li role="presentation">
+                                               <input class="batch-action no-input fakelist" name="{{$n}}" value="{{$l|escape:'html'}}" type="submit">
+                                       </li>
+                               {{/foreach}}
+                               </ul>
+                       </li>
+               </ul>
+               <div class="clear">
+
+               <ul id="viewcontact_wrapper" class="viewcontact_wrapper media-list">
+               {{foreach $contacts as $contact}}
+                       <li>{{include file="contact_template.tpl"}}</li>
+               {{/foreach}}
+               </ul>
+               <div id="contact-edit-end"></div>
+       </form>
+
+       {{$paginate}}
+</div>
+
+<div class="modal" id="PokeModal" tabindex="-1" role="dialog" aria-labelledby="PokeModal" aria-hidden="true">
+       <div class="modal-dialog">
+               <div class="modal-content">
+               </div> <!-- /.modal-content -->
+       </div> <!-- /.modal-dialog -->
+</div> <!-- /.modal -->
+
+<div class="modal" id="MailModal" tabindex="-1" role="dialog" aria-labelledby="MailModal" aria-hidden="true">
+       <div class="modal-dialog">
+               <div class="modal-content">
+               </div> <!-- /.modal-content -->
+       </div> <!-- /.modal-dialog -->
+</div> <!-- /.modal -->
+
+<script>
+ $(document).ready(function() {
+  // replace data target for poke & private Message to make Modal Dialog possible
+  $('li a[href^="{{$baseurl}}/poke/?f"]').attr('data-target','#PokeModal').attr('data-toggle', 'modal');
+  $('li a[href^="{{$baseurl}}/message/new"]').attr('data-target','#MailModal').attr('data-toggle', 'modal');
+ 
+  // javascript dialog to batch actions
+  $(".batch-action").click(function(e){
+    if (confirm($(this).attr('value')+" ?")) {
+     return true;
+    } else {
+     e.preventDefault();
+     return false;
+    }
+  });
+ 
+  // add javascript confirm dialog to "drop" links. Plain html url have "?confirm=1" to show confirmation form, we need to remove it
+  $(".drop").each(function() {
+   $(this).attr('href', $(this).attr('href').replace("confirm=1","") );
+   $(this).click(function(e){
+    if (confirm("{{$contact_drop_confirm}}")) {
+     return true;
+    } else {
+     e.preventDefault();
+     return false;
+    }
+   });
+   
+  });
+ });
+ </script>
+

diff --git a/templates/viewcontact_template.tpl b/templates/viewcontact_template.tpl
new file mode 100644 (file)
index 0000000..0cc1f24
--- /dev/null
+++ b/templates/viewcontact_template.tpl
@@ -0,0 +1,14 @@
+
+{{include file="section_title.tpl"}}
+
+{{$tab_str}}
+
+<ul id="viewcontact_wrapper{{if $id}}-{{$id}}{{/if}}" class="viewcontact_wrapper media-list">
+{{foreach $contacts as $contact}}
+       <li>{{include file="contact_template.tpl"}}</li>
+{{/foreach}}
+</ul>
+<div class="clear"></div>
+<div id="view-contact-end"></div>
+
+{{$paginate}}