Info Pages - wysiwyg images

[LeeFoster]

I have modified the wysiwyg editor for info pages to add an image upload option, the default one tries to store the image in the database and it's too big.

This works fine on my 1.0.7.10 site but not on 1.0.7.15. What am I missing that's changed?

My wysiwyg hook file and the photo upload file are below.

includes/hooks/admin/info_pages/wysiwyg.php

Code: Select all

<?php
/*
  Copyright (c) 2020, G Burton

  This work is licensed under a
  Creative Commons Attribution-NonCommercial-NoDerivatives 4.0 International License.

  You should have received a copy of the license along with this work.
  If not, see <http://creativecommons.org/licenses/by-nc-nd/4.0/>.
*/

class hook_admin_info_pages_wysiwyg {

  function listen_injectSiteStart() {
    $editor_scripts = <<<ES
<link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-bs4.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-bs4.min.js"></script>
ES;
    
    return $editor_scripts;
  }
  
  function listen_injectBodyEnd() {
    $editor_script = <<<ES
<script>
$(document).ready(function() {
  $('.editor').summernote({
    height: 300,
    toolbar: [
      ['style', ['bold', 'italic', 'underline', 'strikethrough', 'clear']],
      ['fontsize', ['fontname', 'fontsize', 'style']],
      ['color', ['color']],
      ['para', ['ul', 'ol', 'paragraph']],
	  ['insert', ['link', 'picture', 'video']],
      ['height', ['height']],
      ['table', ['table']],
      ['util', ['undo', 'redo']],
      ['view', ['fullscreen', 'codeview', 'help']],
    ],
	callbacks: {
    onImageUpload: function(files) {
        for(let i=0; i < files.length; i++) {
            $.upload(files[i]);
        }
    }
}
	  });
$.upload = function (file) {
    let out = new FormData();
    out.append('file', file, file.name);

    $.ajax({
        method: 'POST',
        url: 'ext/imageupload/imageupload.php',
        contentType: false,
        cache: false,
        processData: false,
        data: out,
        success: function (img) {
            $('.editor').summernote('insertImage', img);
        },
        error: function (jqXHR, textStatus, errorThrown) {
            console.error(textStatus + " " + errorThrown);
        }
    });
};
});

</script>

ES;
    
    return $editor_script;
  }
  
  
  



}

admin/ext/imageupload/imageupload.php

Code: Select all

<?php
if ($_FILES['file']['name']) {if (!$_FILES['file']['error']){
$name = md5(rand(100, 200));
$ext = explode('.', $_FILES['file']['name']);
$filename = $name . '.' . $ext[1];
$destination = $_SERVER['DOCUMENT_ROOT'] . '/images/infopages/' . $filename; //change this directory
$location = $_FILES["file"]["tmp_name"];
move_uploaded_file($location, $destination);
echo '//witchwindgames.com/images/infopages/' . $filename;
}else{
echo  $message = 'Ooops!  Your upload triggered the following error:  '.$_FILES['file']['error'];
}
} ?>

[burt]

Make sure you have relevant permissions to save the file into the folder it is trying to save to.
Look at hosting account error_log, which might shine a light on the problem.

[LeeFoster]

I've just checked and it is uploading the file, it's not putting it into the text area though.

[ecartz]

admin/ext/imageupload/imageupload.php

Some hosts have trouble with handlers in subdirectories of admin. Perhaps your 1.0.7.10 and 1.0.7.15 sites are configured differently? I mean at the hosting level.

[LeeFoster]

admin/ext/imageupload/imageupload.php

Some hosts have trouble with handlers in subdirectories of admin. Perhaps your 1.0.7.10 and 1.0.7.15 sites are configured differently? I mean at the hosting level.

Both are hosted locally for testing, the 1.0.7.10 store works as it should. The 1.0.7.15 uploads the file but doesn't insert it in the text editor.

I'm guessing the issue is with the callback. I'm going to look into it more today.