[plugin] [ORPHAN] ebl_image_edit v1.0

uli · 2012-05-29 13:59:22

Eric, I had a chance to try the interim version:

Thumbnail dimensions are now reliably saved in the DB, that’s awesome, thanks!

What I’m wishing for for creating thumbnails (cropping works OK at this) is that selecting a menu entry would suffice. At the moment I have to enter thumbnail dimensions into the text inputs, simply selecting a menu entry doesn’t seem to make an impact. Thanks!

BTW: The jQuery (or CSS?) part of the new jcrop version doesn’t work reliably, on my browsers all crop area handles are displayed on one spot. Replacing the new jcrop version with that from the last ebl_image_edit reliably solves that problem.

THE BLUE DRAGON · 2012-09-24 06:13:32

Hi Eric!
this plugin is currently broken in TXP v4.5 due to some changes of selectors/HTML structure, if I’m not wrong this is the piece of code that need to be changed:

   $("#list td:first img").attr('id','mainImg'); // Give our image an ID
    $("#list td:first").attr('id','mainImgTD'); // name the table to make it easier to find.

    $('#image-thumbnail td:first img').attr('id','thumb'); // Give our thumbnail image an ID
    $('#image-thumbnail td:first').attr('id','thumbTD'); // name the TD that contains the image so we can swap it out.

    if(! $('#thumbTD').length ) {  $("#list td:eq(1)").attr('id','thumbTD');  }

    $('#mainImgTD').prepend('<div id="eblcropui"></div>');

I will try play with it in an hour and will see.

Last edited by THE BLUE DRAGON (2012-09-24 06:15:23)

THE BLUE DRAGON · 2012-09-24 10:02:07

Here what you need to get it work on TXP v4.5

1.
Edit plugin code, replace:

   $("#list td:first img").attr('id','mainImg'); // Give our image an ID
    $("#list td:first").attr('id','mainImgTD'); // name the table to make it easier to find.

    $('#image-thumbnail td:first img').attr('id','thumb'); // Give our thumbnail image an ID
    $('#image-thumbnail td:first').attr('id','thumbTD'); // name the TD that contains the image so we can swap it out.

    if(! $('#thumbTD').length ) {  $("#list td:eq(1)").attr('id','thumbTD');  }

    $('#mainImgTD').prepend('<div id="eblcropui"></div>');

with:

   $("#image_container .fullsize-image img").attr('id','mainImg'); // Give our image an ID

    $('.thumbnail-edit img').attr('id','thumb'); // Give our thumbnail image an ID
    $('.thumbnail-edit').attr('id','thumbTD'); // name the TD that contains the image so we can swap it out.

    if(! $('#thumbTD').length ) {  $(".thumbnail-upload").attr('id','thumbTD');  }

    $('#image_container').prepend('<div id="eblcropui"></div>');

2.
replace:

                   $('#thumbTD').empty().append('<img src="$tmbsrc?' + rand +'" id="thumb" />');

with:

                   $('#thumbTD #thumb').remove();
                    $('#thumbTD').prepend('<img src="$tmbsrc?' + rand +'" id="thumb" class="content-image" />');

3.
Download the newest version of jCrop http://deepliquid.com/content/Jcrop_Download.html
You need 2 files from it:

jquery.Jcrop.min.js
jquery.Jcrop.css

Replace the old files with the new ones
Copy them to the “jcrop” folder under “textpattern/”
(which comes with the ebl plugin zip file)
rename jquery.Jcrop.min.js file to jquery.Jcrop.pack.js

Done!
(Ctrl+F5 in the image editing page and you good to go)

Tested on TXP v4.5.1 with Hive theme.

Last edited by THE BLUE DRAGON (2012-09-24 10:16:19)

THE BLUE DRAGON · 2012-09-24 10:20:47

I just added another step to the temporary fix above:

replace:

                   $('#thumbTD').empty().append('<img src="$tmbsrc?' + rand +'" id="thumb" />');

with:

                   $('#thumbTD #thumb').remove();
                    $('#thumbTD').prepend('<img src="$tmbsrc?' + rand +'" id="thumb" class="content-image" />');

This one is for keeping the thumbnail image look and not removing the new delete button next to it.

uli · 2012-09-24 11:12:47

Just need to express how grateful I am for what you’re giving back to the TXP community, Gil. Thanks! (!!!) :)

debeo · 2012-09-24 21:51:58

Thanx alot Gil! It works like a charm:)

TheEric · 2012-10-04 03:59:08

Adios

gfdesign · 2012-11-16 22:10:15

I miss this plugin for 4.5.2, it doesn’t work fine with me in a clean installation.
Is there any other option ?
Thanks

P/d: I mean, it works but appears the same image without ratio aspect inside selection (previously, it didn’t do it)

Last edited by gfdesign (2012-11-16 22:44:43)

THE BLUE DRAGON · 2012-11-17 08:23:37

gfdesign wrote:

I miss this plugin for 4.5.2, it doesn’t work fine with me in a clean installation.
Is there any other option ?
Thanks

P/d: I mean, it works but appears the same image without ratio aspect inside selection (previously, it didn’t do it)

Did you made the changes I mentioned here that need to be made for it to work on TXP v4.5 ?

TheEric · 2012-11-17 18:57:06

I set up a github repo for this at https://github.com/elimegrover/EBL-image-edit

It’s set to public, and any changes to this plugin should be placed there. I will still, intermittently, be working on it. I figured it would be best to utilize social-aspects of code to progress this plugin along. I still wish to retain my original naming convention for this plugin since it was originally my idea and concept.

{FIXED my link}

Last edited by TheEric (2012-11-17 22:31:07)

gfdesign · 2012-11-17 22:31:25

THE BLUE DRAGON dijo:

Did you made the changes I mentioned here that need to be made for it to work on TXP v4.5 ?

Yes, I did it, but I get this (the same image without ratio aspect inside selection):

I didn’t try in a online server, just in a local enviroment using XAMPP (You can see error I get in top)
Anyway, thanks for your reply, I’ll try again in a new clean installation.

Last edited by gfdesign (2012-11-17 22:37:19)

superfly · 2012-11-23 14:05:08

I fixed the epl_image_edit Plugin for my TXP v4.5 Installation. I use the Default “Hive” Admin Theme!

Here’s how to:

Search the Plugin Code for the jQuery Init Function

$("#list td:first img").attr('id','mainImg'); // Give our image an ID
$("#list td:first").attr('id','mainImgTD'); // name the table to make it easier to find.
$('#image-thumbnail td:first img').attr('id','thumb'); // Give our thumbnail image an ID
$('#image-thumbnail td:first').attr('id','thumbTD'); // name the TD that contains the image so we can swap it out.

And replace it with the following

$(".fullsize-image .content-image").attr('id','mainImg'); // Give our image an ID
$(".fullsize-image").attr('id','mainImgTD'); // name the table to make it easier to find.
$('.thumbnail-edit .content-image').attr('id','thumb'); // Give our thumbnail image an ID
$('.thumbnail-edit').attr('id','thumbTD'); // name the TD that contains the image so we can swap it out.
$('#mainImgTD').toggleClass('fullsize-image');

Worked so far for me, good luck!

Last edited by superfly (2012-11-23 14:11:33)

Textpattern CMS

Textpattern CMS support forum

#205 2012-05-29 13:59:22

Re: [plugin] [ORPHAN] ebl_image_edit v1.0

#206 2012-09-24 06:13:32

Re: [plugin] [ORPHAN] ebl_image_edit v1.0

#207 2012-09-24 10:02:07

Re: [plugin] [ORPHAN] ebl_image_edit v1.0

#208 2012-09-24 10:20:47

Re: [plugin] [ORPHAN] ebl_image_edit v1.0

#209 2012-09-24 11:12:47

Re: [plugin] [ORPHAN] ebl_image_edit v1.0

#210 2012-09-24 21:51:58

Re: [plugin] [ORPHAN] ebl_image_edit v1.0

#211 2012-10-04 03:59:08

Re: [plugin] [ORPHAN] ebl_image_edit v1.0

#212 2012-11-16 22:10:15

Re: [plugin] [ORPHAN] ebl_image_edit v1.0

#213 2012-11-17 08:23:37

Re: [plugin] [ORPHAN] ebl_image_edit v1.0

#214 2012-11-17 18:57:06

Re: [plugin] [ORPHAN] ebl_image_edit v1.0

#215 2012-11-17 22:31:25

Re: [plugin] [ORPHAN] ebl_image_edit v1.0

#216 2012-11-23 14:05:08

Re: [plugin] [ORPHAN] ebl_image_edit v1.0

Board footer