<!--task_list_group
	<dl class="task-list [%=group.css%]">
    	<dt class="task-group">[%=group.title%]</dt>
    </dl>

-->
<!--group_list_empty_feedback
	<div class="feedback notification">[%=resource_string('feedback.contacts.index.chooseacontact')%]</div>
-->
<!--contact_note
	<dd rel="[%=note.id%]">
<dl>
    [%
    var user = get_user(note.createdBy);
    %]
    <dd class="note-meta">
        <span class="">
            <a href="/profile/[%=user.id%]">[%=user_fullname(user)%]</a>
        </span>
        <em>
            <abbr class="published updated timeago" title="[%=note.createdAt%]">[%=note.createdAt%]</abbr>
        </em>
    </dd>
    <dd class="note-actions ">
        <ul>
        <li id="edit-action"><a href="" >[%=resource_string('action.contacts.index.edit')%]</a></li>
        <li id="delete-action"><a href="">[%=resource_string('action.contacts.index.delete')%]</a></li>
        <li id="confirm-action"><a href="" >[%=resource_string('action.contacts.index.done')%]</a></li>
        <li id="cancel-action"><a href="">[%=resource_string('action.contacts.index.cancel')%]</a></li>
        </ul>
    </dd>
    <dd class="note-info">
        <img alt="" src="/api/users/[%=user.id%]/avatar" class="photo avatar _hide"/>
    </dd>
    <dd class="note-body" id="view-box">
        [%=parse_note_body(note.body)%]
    </dd>

    <dd class="note-body" id="edit-box">
        <span class="Field"><textarea>[%=parse_note_body(note.body)%]</textarea></span>
    </dd>
	<dd style="clear:both!important;"></dd>
</dl>
</dd>

-->

<!--contact_task
	[%
        var usr=get_user(task.assignedTo);
    %]
    <dd class="task" rel="[%=task.id%]">
        <dl>
            <dd class="check-mark"><input type="checkbox" class="task-checkbox" [%=(task.complete=='true')?'checked=\'checked\'':''%] value="16"/></dd>
            <dd class="left-item-panel"><strong class="assignee">[%=user_fullname(usr)%]</strong>&nbsp;-&nbsp;[%=task.title%]</dd>
            <dd class="right-item-panel"><strong class="type">[%=lookup_task_type(taskTypes.taskType,task.type).name%]</strong>&nbsp;-&nbsp;<strong class="due-date">[%=$.timeago(task.dueOn)%]</strong></dd>
        </dl>
    </dd>
-->


    <div class="Tabs">
        <ul>
            <li><a href="#contact-detail">[%=resource_string('action.contacts.index.detailstab')%]</a></li>
            <li><a href="#contact-notes">[%=resource_string('action.contacts.index.notestab')%]</a></li>
            <li><a href="#contact-tasks">[%=resource_string('action.contacts.index.taskstab')%]</a></li>
        </ul>
    </div>


    <div id="contact-detail" class="contact-information contact-tab-panel hide">
      [%

      with(contact){
          var j=0;

          if(info!=''){
            %]<dl><dt>[%=resource_string('label.contacts.index.details.information')%]</dt>[%
              /* Show First */
              %]
              <dd>[%=info%]</dd>
              </dl>[%
          }
          if(emailAddresses!=null){
              %]<dl><dt>[%=resource_string('label.contacts.index.details.email')%]</dt>[%
              /* Show First */
              %]<dd><strong>[%=emailAddresses.emailAddress[0].type.value%]</strong> : <a href="mailto:[%=emailAddresses.emailAddress[0].email%]">[%=emailAddresses.emailAddress[0].email%]</a></dd>[%


              if(emailAddresses.emailAddress.length>1){
                  /* Show Others */
                  $.each(emailAddresses.emailAddress,function(i,n){
                      if(i!=0){
                          %]<dd>[%=n.type.value%] : <a href="mailto:[%=n.email%]">[%=n.email%]</a></dd>[%
                      }

                  });

              }
              %]</dl>[%
          }

          if(phoneNumbers!=null){
                  %]<dl><dt>[%=resource_string('label.contacts.index.details.phone')%]</dt>[%
                  /* Show First */
                  %]<dd><strong>[%=phoneNumbers.phoneNumber[0].type.value%]</strong> : <a href="callto://[%=phoneNumbers.phoneNumber[0].number%]">[%=phoneNumbers.phoneNumber[0].number%]</a></dd>[%
                   if(phoneNumbers.phoneNumber.length>1){
                      /* Show Others */
                      $.each(phoneNumbers.phoneNumber,function(i,n){
                          if(i!=0){
                          %]<dd>[%=n.type.value%] : <a href="callto://[%=n.number%]">[%=n.number%]</a></dd>[%
                          }

                      });

                  }
                  %]</dl>[%
              }

              if(websites!=null){
                  %]<dl><dt>[%=resource_string('label.contacts.index.details.website')%]</dt>[%
                  /* Show First */
                  %]<dd><strong>[%=websites.website[0].type.value%]</strong> : <a href="http://[%=websites.website[0].url%]" target="blank">[%=websites.website[0].url%]</a></dd>[%
                  if(websites.website.length>1){
                    /* Show Others */
                    $.each(websites.website,function(i,n){
                        if(i!=0){
                        %]<dd>[%=n.type.value%] : <a href="http://[%=n.url%]" target="blank">[%=n.url%]</a></dd>[%
                        }

                    });
                }
                  %]</dl>[%
              }

              if(addresses!=null){
                  %]<dl><dt>[%=resource_string('label.contacts.index.details.address')%]</dt>[%
                  /* Show First */
                  %]<dd><strong>[%=addresses.address[0].type.value%]</strong> : [%=addresses.address[0].street%]</dd>[%
                   if(addresses.address.length>1){

                      /* Show Others */
                      $.each(addresses.address,function(i,n){
                          if(i!=0){
                          %]<dd>[%=n.type.value%] : [%=n.street%]</dd>[%
                          }

                      });

                  }
                   %]</dl>[%
              }

      }
      %]
    </div>


    <div id="contact-notes" class="contact-tab-panel hide">
        <div id="id-add-note-container" class="show-hide " rel="id-add-note-panel">
            <div id="id-add-note-panel" class="_hide">
                <h2 class="title hide"><span>[%=resource_string('action.contacts.index.addnote')%]</span></h2>
                <form action="/api/notes" id="add-note-form">
                    <span class="Field">
                        <textarea id="add-note-body" class="expanding"/>
                    </span>
                    <div class="Actions">
                        <ul>
                            <li><input type="button" value="[%=resource_string('action.contacts.index.addnote')%]" id="add-note-action"/></li>
                        </ul>
                    </div>
                </form>
            </div>
        </div>
        <div class="" id="contact-notes-list">
            [%
                var _groups=group_notes(notes);

                $.each(_groups,function(i,n){
                    var _class=(n.notes.length==0)?'hide':'';

                    %]<dl class="note-list [%=n.css%] [%=_class%]">
                        <dt class="note-group">[%=n.title%]</dt>
                    [%
                    
                        if(n.notes.length!=0 && n.notes[0]!=null){
							
                            $.each(n.notes,function(ii,nn){
                            %]
                            [%=render_partial('contact_note',{note:nn})%]

                            [%
                            });
                        }
                    %]
                    </dl>
                    [%
                });
            %]
        </div>

    </div>




    <div id="contact-tasks" class="contact-tab-panel hide">
        <div id="id-add-task-container" class="show-hide " rel="id-add-note-panel">
            <div id="id-add-task-panel" class="_hide">
                <form action="/api/task" id="add-task-form">
                    <span class="Field ClearedField">
                        <input type="text" id="add-task-title" name="description"/>
                    </span>

					<fieldset style="clear:both;">
                    <span class="Field">
                        <label>Type</label>
                        <select name="taskType">
                        [%
                            $.each(taskTypes.taskType,function(o,p){
                        %]
                            <option value="[%=p.id%]">[%=p.name%]</option>
                        [%
                            });
                        %]
                        </select>
                    </span>

                    <span class="Field">
                        <label>Assigned To</label>
                        <select name="assignTo">
                        [%
                            $.each(users.user,function(o,p){
                        %]
                            <option value="[%=p.id%]">[%=user_fullname(p)%]</option>
                        [%
                            });
                        %]</select>
                    </span>

                    <span class="Field">
                        <label>Due</label>
                        <input type="text" name="due"/>
                    </span>
				</fieldset>
                    <div class="Actions">
                        <ul>
                            <li><input type="button" value="[%=resource_string('action.contacts.index.addtask')%]" id="add-task-action"/></li>
                        </ul>
                    </div>
                </form>
            </div>
    </div>

        <div id="contact-tasks-list">

        
        </div>
    </div>