pod.mak 6.8KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145
  1. <%namespace name="ICON" file="tracim.templates.widgets.icon"/>
  2. <%def name="ICO_URL(icon_size, icon_path)">${h.IconPath(icon_size, icon_path)|n}</%def>
  3. <%def name="ICO(icon_size, icon_path, title='')"><img src="${h.IconPath(icon_size, icon_path)|n}" alt="" title="${title}"/></%def>
  4. <%def name="ICO_TOOLTIP(icon_size, icon_path, title='')"><span rel="tooltip" data-toggle="tooltip" data-placement="bottom" title="${title}">${ICO(icon_size, icon_path, title)}</span></%def>
  5. <%def name="ICO_BADGED(icon_size, icon_path, title='', css_class='badge')"><span class="${css_class}" rel="tooltip" data-toggle="tooltip" data-placement="bottom" title="${title}">${ICO(icon_size, icon_path, title)}</span></%def>
  6. <%def name="ICO_FA_BADGED(fa_class='fa fa-flag', title='', css_style='')"><i style="${css_style}" class="${fa_class}" rel="tooltip" data-toggle="tooltip" data-placement="bottom" title="${title}"></i></%def>
  7. <%def name="FA(fa_class='fa-flag', title='', css_style='', color='auto')"><i style="color: ${color}; ${css_style}" class="fa ${fa_class}" title="${title}"></i></%def>
  8. <%def name="HELP_MODAL_DIALOG(help_page)"><div id="help-modal-dialog-${help_page}" class="modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true"><div class="modal-dialog"><div class="modal-content"></div></div></div></%def>
  9. <%def name="NO_CONTENT_INFO(message)"><div class="alert alert-warning" role="alert">${ICO(32, 'status/dialog-information')} ${message|n}</div></%def>
  10. <%def name="ICO_ACTION(icon_size, icon_path, title, link_url, current_user, required_profile_id)">
  11. % if current_user.profile.id>=required_profile_id:
  12. <a href="${link_url}">${ICO_TOOLTIP(icon_size, icon_path, title)}</a>
  13. % else:
  14. <span class="tracim-less-visible">${ICO(icon_size, icon_path)}</span>
  15. % endif
  16. </%def>
  17. <%def name="MODAL_DIALOG(css_id, modal_size='')">
  18. <div id="${css_id}" class="modal" tabindex="-1" role="dialog" aria-hidden="true">
  19. <div class="modal-dialog ${modal_size}">
  20. <div class="modal-content">
  21. </div>
  22. </div>
  23. </div>
  24. </%def>
  25. <%def name="TINYMCE_INIT_SCRIPT(selector)">
  26. <script>
  27. function base64EncodeAndTinyMceInsert (files) {
  28. for (var i = 0; i < files.length; i++) {
  29. if (files[i].size > 1000000)
  30. files[i].allowed = confirm(files[i].name + " fait plus de 1mo et peut prendre du temps à insérer, voulez-vous continuer ?")
  31. }
  32. for (var i = 0; i < files.length; i++) {
  33. if (files[i].allowed !== false && files[i].type.match('image.*')) {
  34. var img = document.createElement('img')
  35. var fr = new FileReader()
  36. fr.readAsDataURL(files[i])
  37. fr.onloadend = function (e) {
  38. img.src = e.target.result
  39. tinymce.activeEditor.execCommand('mceInsertContent', false, img.outerHTML)
  40. }
  41. }
  42. }
  43. }
  44. tinymce.init({
  45. menubar:false,
  46. statusbar:true,
  47. plugins: [ "table", "image", "charmap", "fullscreen", "autolink", "colorpicker" ],
  48. language: globalTracimLang === 'en_US' ? 'en' : globalTracimLang, // tinymce does't accept en_US as language, it is its default value named 'en'
  49. skin : 'tracim',
  50. selector:'${selector}',
  51. toolbar: [
  52. "undo redo | bold italic underline strikethrough | bullist numlist outdent indent | table | charmap | styleselect | alignleft aligncenter alignright | fullscreen | customInsertImage",
  53. ],
  54. paste_data_images: true,
  55. table_default_attributes: {
  56. 'class': 'user_content'
  57. },
  58. content_css: '/assets/css/rich-text-area.css',
  59. table_default_styles: {
  60. border: '1px solid #CCC',
  61. borderCollapse: 'collapse',
  62. padding: '20px'
  63. },
  64. table_class_list: [
  65. {title: 'Normal', value: 'user_content'},
  66. {title: 'First row is header', value: 'user_content first_row_headers'},
  67. {title: 'First column is header', value: 'user_content first_column_headers'}
  68. ],
  69. setup: function ($editor) {
  70. //////////////////////////////////////////////
  71. // add custom btn to handle image by selecting them with system explorer
  72. $editor.addButton('customInsertImage', {
  73. icon: 'mce-ico mce-i-image',
  74. title: 'Image',
  75. onclick: function () {
  76. if ($('#hidden_tinymce_fileinput').length > 0) $('#hidden_tinymce_fileinput').remove()
  77. fileTag = document.createElement('input')
  78. fileTag.id = 'hidden_tinymce_fileinput'
  79. fileTag.type = 'file'
  80. $('body').append(fileTag)
  81. $('#hidden_tinymce_fileinput').on('change', function () {
  82. base64EncodeAndTinyMceInsert($(this)[0].files)
  83. })
  84. $('#hidden_tinymce_fileinput').click()
  85. }
  86. })
  87. //////////////////////////////////////////////
  88. // Handle drag & drop image into TinyMce by encoding them in base64 (to avoid uploading them somewhere and keep saving comment in string format)
  89. $editor
  90. .on('drag dragstart dragend dragover dragenter dragleave drop', function (e) {
  91. e.preventDefault()
  92. e.stopPropagation()
  93. })
  94. .on('drop', function(e) {
  95. base64EncodeAndTinyMceInsert(e.dataTransfer.files)
  96. })
  97. }
  98. });
  99. </script>
  100. </%def>
  101. <%def name="FLASH_MSG(css_class='')">
  102. <% flash=tg.flash_obj.render('flash', use_js=False) %>
  103. % if flash:
  104. <div class="" id="flash-message-to-fade-out">
  105. <div id="t-full-app-alert-message-id" class="flashmsg__data ${css_class}">
  106. ${flash|n}
  107. </div>
  108. </div>
  109. ## HACK - D.A. - 2014-10-21
  110. ##
  111. ## The following JS "hack" is intended to make TG2 flash messages compatible with bootstrap alert classes
  112. ## This should disappear as soon as LESS is implemented in the application
  113. ## meaning we'll define a alert-ok style inheriting from alert-info, etc
  114. <script>
  115. $( document ).ready(function() {
  116. $('.alert-ok').removeClass('alert-ok').addClass('alert-info');
  117. $('.alert-error').removeClass('alert-error').addClass('alert-danger');
  118. window.setTimeout(function() {
  119. $("#flash-message-to-fade-out").fadeTo(8000, 0, 'linear', function () {
  120. $(this).hide()
  121. });
  122. }, 2000);
  123. });
  124. </script>
  125. % endif
  126. </%def>