view/theme/frio/templates/jot.tpl

   1
   2 {{* The button to open the jot - in This theme we move the button with js to the second nav bar *}}
   3 <button class="btn btn-sm btn-main pull-right" id="jotOpen" onclick="jotShow(); return false;"><i class="fa fa-pencil-square-o fa-2x"></i></button>
   4
   5
   6 <div id="jot-content">
   7         <form id="profile-jot-form" action="{{$action}}" method="post">
   8                 <div id="profile-jot-wrapper">
   9                         <div>
  10                                 <div id="character-counter" class="grey jothidden text-info pull-left"></div>
  11                                 <!--<div id="profile-jot-desc" class="jothidden pull-right">&nbsp;</div>-->
  12                         </div>
  13
  14                         <div id="profile-jot-banner-end"></div>
  15
  16                         {{* The hidden input fields which submit important values with the post *}}
  17                         <input type="hidden" name="type" value="{{$ptyp}}" />
  18                         <input type="hidden" name="profile_uid" value="{{$profile_uid}}" />
  19                         <input type="hidden" name="return" value="{{$return_path}}" />
  20                         <input type="hidden" name="location" id="jot-location" value="{{$defloc}}" />
  21                         <input type="hidden" name="coord" id="jot-coord" value="" />
  22                         <input type="hidden" name="post_id" value="{{$post_id}}" />
  23                         <input type="hidden" name="preview" id="jot-preview" value="0" />
  24                         <input type="hidden" name="post_id_random" value="{{$rand_num}}" />
  25                         {{if $notes_cid}}
  26                         <input type="hidden" name="contact_allow[]" value="<{{$notes_cid}}>" />
  27                         {{/if}}
  28                         <div id="jot-title-wrap"><input name="title" id="jot-title" class="jothidden jotforms form-control" type="text" placeholder="{{$placeholdertitle}}" title="{{$placeholdertitle}}" value="{{$title}}" style="display:block;" /></div>
  29                         {{if $placeholdercategory}}
  30                         <div id="jot-category-wrap"><input name="category" id="jot-category" class="jothidden jotforms form-control" type="text" placeholder="{{$placeholdercategory}}" title="{{$placeholdercategory}}" value="{{$category}}" /></div>
  31                         {{/if}}
  32
  33                         {{* The jot text field in which the post text is inserted *}}
  34                         <div id="jot-text-wrap">
  35                         <textarea rows="2" cols="64" class="profile-jot-text form-control" id="profile-jot-text" name="body" onFocus="jotTextOpenUI(this);" onBlur="jotTextCloseUI(this);" style="min-width:100%; max-width:100%;">{{if $content}}{{$content}}{{else}}{{$share}}{{/if}}</textarea>
  36                         </div>
  37
  38                         <ul id="profile-jot-submit-wrapper" class="jothidden nav nav-pills">
  39                                 {{* uncomment the button for "wall-immage-upload" because we have integrated it directly in the jot modal
  40                                 <li><a href="#" id="wall-image-upload" title="{{$upload}}"><i class="fa fa-picture-o"></i></a></li>
  41                                 *}}
  42                                 <li><a href="#" onclick="return false;" id="wall-file-upload"  title="{{$attach}}"><i class="fa fa-paperclip"></i></a></li>
  43                                 <li><a id="profile-link"  ondragenter="return linkdropper(event);" ondragover="return linkdropper(event);" ondrop="linkdrop(event);" onclick="jotGetLink(); return false;" title="{{$weblink}}"><i class="fa fa-link"></i></a></li>
  44                                 <li><a id="profile-video" onclick="jotVideoURL();return false;" title="{{$video}}"><i class="fa fa-film"></i></a></li>
  45                                 <li><a id="profile-audio" onclick="jotAudioURL();return false;" title="{{$audio}}"><i class="fa fa-music"></i></a></li>
  46                                 <li><a id="profile-location" onclick="jotGetLocation();return false;" title="{{$setloc}}"><i class="fa fa-map-marker"></i></a></li>
  47                                 <!-- TODO: waiting for a better placement
  48                                 <li><a id="profile-nolocation" onclick="jotClearLocation();return false;" title="{{$noloc}}">{{$shortnoloc}}</a></li>
  49                                 -->
  50
  51                                 <li class="pull-right"><button class="btn btn-primary" id="jot-submit" type="submit" id="profile-jot-submit" name="submit" ><i class="fa fa-slideshare fa-fw"></i> {{$share}}</button></li>
  52                                 <div id="profile-rotator-wrapper" style="display: {{$visitor}};" >
  53                                         <img id="profile-rotator" src="images/rotator.gif" alt="{{$wait}}" title="{{$wait}}" style="display: none;" />
  54                                 </div>
  55                                 <div id="profile-jot-plugin-wrapper">
  56                                         {{$jotplugins}}
  57                                 </div>
  58                         </ul>
  59                 </div>
  60
  61                 <div id="profile-jot-acl-wrapper" style="display: none;">
  62                         {{$acl}}
  63                 </div>
  64
  65                 <div id="jot-preview-content" style="display:none;"></div>
  66
  67                 <div id="jot-fbrowser-wrapper" style="display: none"></div>
  68
  69                 {{if $content}}<script>initEditor();</script>{{/if}}
  70         </form>
  71 </div>
  72
  73
  74 {{* The jot modal - We use a own modal for the jot and not the standard modal
  75 from the page template. This is because the special structure of the jot
  76 (e.g.jot navigation tabs in the modal titel area).
  77 The in the frio theme the jot will loaded regulary and is hidden by default.)
  78 The js function jotShow() loads the jot into the modal. With this structure we
  79 can load different content into the jot moadl (e.g. the item edit jot)
  80 *}}
  81 <div id="jot-modal" class="modal fade" role="dialog">
  82         <div class="modal-dialog">
  83                 <div class="modal-content">
  84
  85                         <div class="modal-header">
  86                                 <button type="button" class="close" data-dismiss="modal">&times;</button>
  87                                 <!--<h4 class="modal-title">Modal Header</h4>-->
  88                                 {{* The Jot navigation menu (text input, permissions, preview, filebrowser) *}}
  89                                 <ul class="nav nav-tabs hidden-xs jot-nav" role="menubar" data-tabs="tabs">
  90                                         {{* Mark the first list entry as active because it is the first which is active after opening
  91                                                 the modal. Changing of the activity status is done by js in jot.tpl-header *}}
  92                                         <li class="active" role="menuitem"><a id="jot-text-lnk" onclick="jotActive(); return false;">{{$message}}</a></li>
  93                                         {{if $acl}}<li role="menuitem"><a id="jot-perms-lnk" onclick="aclActive();return false;">{{$shortpermset}}</a></li>{{/if}}
  94                                         {{if $preview}}<li role="menuitem"><a id="jot-preview-lnk" onclick="previewActive();return false;">{{$preview}}</a></li>{{/if}}
  95                                         <li role="menuitem"><a id="jot-preview-link" onclick="fbrowserActive(); return false;">{{$browser}}</a></li>
  96                                 </ul>
  97
  98                                 <div class="dropdown  hidden-lg hidden-md hidden-sm" role="menubar" data-tabs="tabs">
  99                                         <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown"> JOT
 100                                         <span class="caret"></span></button>
 101                                         <ul class="dropdown-menu nav nav-pills">
 102                                                 {{* mark the first list entry as active because it is the first which is active after opening
 103                                                 the modal. Changing of the activity status is done by js in jot.tpl-header *}}
 104                                                 <li class="active" role="menuitem"><a id="jot-text-lnk-mobile" onclick="jotActive(); return false;">{{$message}}</a></li>
 105                                                 {{if $acl}}<li role="menuitem"><a id="jot-perms-lnk-mobile" onclick="aclActive();return false;"{{$shortpermset}}</a></li>{{/if}}
 106                                                 {{if $preview}}<li role="menuitem"><a id="jot-preview-lnk-mobile" onclick="previewActive();return false;">{{$preview}}</a></li>{{/if}}
 107                                         </ul>
 108                                 </div>
 109                         </div>
 110
 111
 112                         <div id="jot-modal-body" class="modal-body">
 113
 114
 115 <!-- End Modal -->
 116                         </div>
 117                 </div>
 118         </div>
 119 </div>
 120
 121
 122 <script>
 123         $('iframe').load(function() {
 124                 this.style.height = this.contentWindow.document.body.offsetHeight + 'px';
 125         });
 126
 127         // insert new object with value to aStr
 128         // function jotTextOpenUI does make use of it
 129         aStr.share = "{{$share}}";
 130 </script>
 131