bux
/
tracim_v2


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173
							<!DOCTYPE html>
<html>
  <head>
    <meta charset='utf-8' />
    <meta name="viewport" content="width=device-width, user-scalable=no">
    <title>Tracim</title>
    <link rel='shortcut icon' href='favicon.ico'>

    <link rel="stylesheet" type="text/css" href="/font/font-awesome-4.7.0/css/font-awesome.css">
    <link href="https://fonts.googleapis.com/css?family=Quicksand:300,400,500,700" rel="stylesheet">
    <!--
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
    -->
    <link rel="stylesheet" type="text/css" href="/dev/bootstrap-4.0.0-beta.css">
  </head>
  <body>
    <div id='content'></div>

    <script src='/tracim.vendor.bundle.js'></script>
    <script src='/tracim.app.entry.js'></script>

    <!--
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>
    -->

    <script src='/app/pageHtml.app.js'></script>
    <script src='/app/thread.app.js'></script>

    <script src="/dev/jquery-3.2.1.js"></script>
    <script src="/dev/popper-1.12.3.js"></script>
    <script src="/dev/bootstrap-4.0.0-beta.2.js"></script>

    <script type='text/javascript'>
      const pageHtml = new appPageHtml()

      /*
        app: {
          content: {id, type, title, status}, // version and/or text are useless for Tracim, only useful for app
          appConfig: {name, componentLeft, componentRight, customClass, icon}
        }
      */
      GLOBAL_renderApp = app => {
        switch (app.appConfig.name) {
          case 'PageHtml':
            pageHtml.renderApp('appContainer', app); break
          case 'Thread':
            appThread.renderApp('appContainer', app); break
        }
      }

      GLOBAL_dispatchEvent = (type, data) => {
        var event = new CustomEvent('appCustomEvent', {type, data})
        document.dispatchEvent(event)
      }

      GLOBAL_unmountApp = appName => {
        switch (appName) {
          case 'PageHtml':
            // pageHtml.hideApp('appContainer'); break
            GLOBAL_dispatchEvent('PageHtml_hideApp', {})
          case 'Thread':
            appThread.hideApp('appContainer'); break
        }
      }

      // only usefull if plugin doesn't handle fileContent himself
      GLOBAL_handleRequireRedraw = () => {
        var rez = pluginA.destroyPlugin('plugin')
        if (rez) GLOBAL_drawPlugin('redraw')
        else console.log('Erreur, failed at destroying plugin')
      }
    </script>

    <script type='text/javascript'>
      if (window.matchMedia("(min-width:1200px)").matches) {

        var jsScript = document.createElement("script");
        jsScript.type = "text/javascript";
        jsScript.src = "https://cloud.tinymce.com/stable/tinymce.min.js?apiKey=dfdhxdokxj2wagzkbxfgysgh86d6rr9m3dln0172vo3shipc";

        jsScript.onload = function() {
          function base64EncodeAndTinyMceInsert (files) {
            for (var i = 0; i < files.length; i++) {
              if (files[i].size > 1000000)
                files[i].allowed = confirm(files[i].name + " fait plus de 1mo et peut prendre du temps à insérer, voulez-vous continuer ?")
            }

            for (var i = 0; i < files.length; i++) {
              if (files[i].allowed !== false && files[i].type.match('image.*')) {
                var img = document.createElement('img')

                var fr = new FileReader()

                fr.readAsDataURL(files[i])

                fr.onloadend = function (e) {
                  img.src = e.target.result
                  tinymce.activeEditor.execCommand('mceInsertContent', false, img.outerHTML)
                }
              }
            }
          }

          // HACK: The tiny mce source code modal contain a textarea, but we
          // can't edit it (like it's readonly). The following solution
          // solve the bug: https://stackoverflow.com/questions/36952148/tinymce-code-editor-is-readonly-in-jtable-grid
          $(document).on('focusin', function(e) {
            if ($(e.target).closest(".mce-window").length) {
              e.stopImmediatePropagation();
            }
          });

          tinymce.init({
            selector: 'textarea',
            height: 130,
            // width: 530,
            menubar: false,
            resize: false,
            plugins: [
              'advlist autolink lists link image charmap print preview anchor textcolor',
              'searchreplace visualblocks code fullscreen',
              'insertdatetime media table contextmenu paste code help'
            ],
            toolbar: 'insert | formatselect | bold italic underline strikethrough forecolor backcolor | link | alignleft aligncenter alignright alignjustify  | numlist bullist outdent indent  | table | code ',
            content_css: [
              '//fonts.googleapis.com/css?family=Lato:300,300i,400,400i',
              '//www.tinymce.com/css/codepen.min.css'
            ],
            setup: function ($editor) {
              //////////////////////////////////////////////
              // add custom btn to handle image by selecting them with system explorer
              $editor.addButton('customInsertImage', {
                icon: 'mce-ico mce-i-image',
                title: 'Image',
                onclick: function () {
                  var hiddenTinyMceInput = $('#hidden_tinymce_fileinput')

                  if (hiddenTinyMceInput.length > 0) hiddenTinyMceInput.remove()

                  fileTag = document.createElement('input')
                  fileTag.id = 'hidden_tinymce_fileinput'
                  fileTag.type = 'file'
                  $('body').append(fileTag)

                  hiddenTinyMceInput.on('change', function () {
                    base64EncodeAndTinyMceInsert($(this)[0].files)
                  })

                  hiddenTinyMceInput.click()
                }
              })

              //////////////////////////////////////////////
              // Handle drag & drop image into TinyMce by encoding them in base64 (to avoid uploading them somewhere and keep saving comment in string format)
              $editor
                .on('drag dragstart dragend dragover dragenter dragleave drop', function (e) {
                  e.preventDefault()
                  e.stopPropagation()
                })
                .on('drop', function(e) {
                  base64EncodeAndTinyMceInsert(e.dataTransfer.files)
                })
            }
          });
        }
        document.getElementsByTagName("body")[0].appendChild(jsScript);
      }
    </script>
  </body>
</html>