Advanced search  

News:

cpg1.5.48 Security release - upgrade mandatory!
The Coppermine development team is releasing a security update for Coppermine in order to counter a recently discovered vulnerability. It is important that all users who run version cpg1.5.46 or older update to this latest version as soon as possible.
[more]

Pages: 1 ... 3 4 5 6 [7] 8   Go Down

Author Topic: Flikr style image annotations  (Read 202126 times)

0 Members and 2 Guests are viewing this topic.

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Flikr style image annotations
« Reply #120 on: August 03, 2009, 05:50:48 pm »

I can't seem to drag the square all the way to the right side, or the lower side of the image (it stops about 20px or so from the right or the bottom sides)

In lib/photonotes.js, find
Code: [Select]
                this.maxRight = currentNote.container.element.offsetWidth - 30;
                this.maxBottom = currentNote.container.element.offsetHeight - 19;
and replace with
Code: [Select]
                this.maxRight = currentNote.container.element.offsetWidth - 2;
                this.maxBottom = currentNote.container.element.offsetHeight - 2;
Logged

bitcloud

  • Coppermine frequent poster
  • ***
  • Offline Offline
  • Posts: 117
Re: Flikr style image annotations
« Reply #121 on: August 04, 2009, 05:14:37 am »

cheers for the help,

unfortunately, that value doesn't seem to affect the outcome (even if I set it outrageously high, or as a positive integer, i have the same result...)
is there somewhere else i could be looking?

is there some CSS perhaps?
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Flikr style image annotations
« Reply #122 on: August 04, 2009, 10:40:14 am »

The change does exactly what you asked for. Maybe you have to clean your browser cache.
Logged

asas

  • Coppermine newbie
  • Offline Offline
  • Posts: 10
Re: Flikr style image annotations
« Reply #123 on: August 04, 2009, 04:56:13 pm »

In lib/photonotes.js, delete
Code: [Select]
editArea.appendChild(editAreaText);

In codebase.php, find
Code: [Select]
$sql = "SELECT * FROM {$CONFIG['TABLE_PREFIX']}notes WHERE pid = {$CURRENT_PIC_DATA['pid']}";and replace with
Code: [Select]
$sql = "SELECT *, u.user_name AS note FROM {$CONFIG['TABLE_PREFIX']}notes n INNER JOIN {$CONFIG['TABLE_USERS']} u ON n.user_id = u.user_id WHERE n.pid = {$CURRENT_PIC_DATA['pid']}";

In codebase.php, find
Code: [Select]
$html = '<div class="Photo fn-container" id="PhotoContainer">' . $html . '</div>';and replace with
Code: [Select]
       $html = '<div class="Photo fn-container" id="PhotoContainer">' . $html . '</div>';

        $sql = "SELECT u.user_name, u.user_id FROM {$CONFIG['TABLE_PREFIX']}notes n INNER JOIN {$CONFIG['TABLE_USERS']} u ON n.user_id = u.user_id WHERE n.pid = {$CURRENT_PIC_DATA['pid']}  ORDER BY posx, posy";
        $result = cpg_db_query($sql);
        $profile_links = "";
        while($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
            $profile_links .= "<a href=\"profile.php?uid={$row['user_id']}\">{$row['user_name']}</a> ";
        }
        if ($profile_links != "") {
     $html .= "
         <div style=\"clear: both; padding-top: 10px;\">
                    $profile_links
         </div>
            ";
        }


Just curious what this is supposed to do? I applied it and nothing happens. Is it supposed to link the person being tagged to their profile? and as a note, my gallery is bridged to SMF.

Thanks a lot
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Flikr style image annotations
« Reply #124 on: August 04, 2009, 05:47:49 pm »

Just curious what this is supposed to do? I applied it and nothing happens. Is it supposed to link the person being tagged to their profile? and as a note, my gallery is bridged to SMF.
That are the code changes for this request.

I haven't tested it in a bridged gallery. I think it doesn't work for you because of this query:
Quote
SELECT *, u.user_name AS note FROM {$CONFIG['TABLE_PREFIX']}notes n INNER JOIN {$CONFIG['TABLE_USERS']} u ON n.user_id = u.user_id WHERE n.pid = {$CURRENT_PIC_DATA['pid']}
Logged

asas

  • Coppermine newbie
  • Offline Offline
  • Posts: 10
Re: Flikr style image annotations
« Reply #125 on: August 04, 2009, 06:07:21 pm »

That are the code changes for this request.

I haven't tested it in a bridged gallery. I think it doesn't work for you because of this query:

Perfect, thanks a lot.

So I replace the bolded parts with the right table names and prefixes (SMF bridge), do you think it will work? or is there more to it? I know you haven't tested it, but I just want to see what you think.

Thanks a lot,
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Flikr style image annotations
« Reply #126 on: August 04, 2009, 06:13:58 pm »

So I replace the bolded parts with the right table names and prefixes (SMF bridge)
Make sure the plugin works without my modifications. If it does, you just have to change the mentioned SQL query.
Logged

sjthespian

  • Guest
Re: Flikr style image annotations
« Reply #127 on: August 04, 2009, 07:58:15 pm »

Make sure the plugin works without my modifications. If it does, you just have to change the mentioned SQL query.

I was able to get it working with Joomla with the following changes:
Change the first select statement to read:
Code: [Select]
                $sql = "SELECT *, u.name AS note FROM {$CONFIG['TABLE_PREFIX']}notes n INNER JOIN jos_users u ON n.user_id = u.id WHERE n.pid = {$CURRENT_PIC_DATA['pid']}";

And I also had to add "$row['params'] = ''; before the line $notes[] = $row, as I had some newline separated data in the annoations that was causing errors in the javascript.

The second SELECT statment should then read:
Code: [Select]
                $sql = "SELECT u.name AS user_name, u.id AS user_id FROM {$CONFIG['TABLE_PREFIX']}notes n INNER JOIN jos_users u ON n.user_id = u.id WHERE n.pid = {$CURRENT_PIC_DATA['pid']}  ORDER BY posx, posy";
The above will tag the image with the user's real name, use "u.username" in both SELECT statements if you prefer having the username.

The next thing I want to do if I can figure out a decent way to do it is to provide a list of users instead of a free-form text box, so people aren't restricted to just tagging themselves in pictures.
Logged

bitcloud

  • Coppermine frequent poster
  • ***
  • Offline Offline
  • Posts: 117
Re: Flikr style image annotations
« Reply #128 on: August 05, 2009, 02:44:50 am »

Cheers eenemeenemuu... still getting that problem though.

 I'll put it online in the next few days and give you a look...
Logged

heartsy

  • Coppermine newbie
  • Offline Offline
  • Posts: 18
Re: Flikr style image annotations
« Reply #129 on: September 03, 2009, 08:22:44 am »

Is there a way to make the yellow box (the area you selected for mouseover) to not show up? I want it there when you edit or add your annotations, so you can see to drag it to appropiate size, but after that I would like it to disappear. Like photo tags on myspace or facebook, when you mouseover the area selected, just the little info note pops up, without the yellow frame around your selected area.
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Flikr style image annotations
« Reply #130 on: September 03, 2009, 08:27:05 am »

Like photo tags on myspace or facebook, when you mouseover the area selected, just the little info note pops up, without the yellow frame around your selected area.
Please attach a screenshot, as I don't know how it looks in myspace/facebook.
Logged

heartsy

  • Coppermine newbie
  • Offline Offline
  • Posts: 18
Re: Flikr style image annotations
« Reply #131 on: September 03, 2009, 09:00:12 am »

Sure... on the attached photo you can see my mouse is on the image.. and you see the little note with the person's name on it.. but you don't see the selected area's frame.
Logged

heartsy

  • Coppermine newbie
  • Offline Offline
  • Posts: 18
Re: Flikr style image annotations
« Reply #132 on: September 03, 2009, 09:03:00 am »

actually I guess you can't see my mouse..or cursor rather.. but it was on there, not sure why it didn't show up in the printscreen.
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Flikr style image annotations
« Reply #133 on: September 03, 2009, 09:36:15 am »

It's not as trivial as I thought. When I disable the box you cannot add new notes. You have to try some changes in photonotes.js. Have a look at the functions hide(all)note(texts), show(all)note(texts), createelements.
Logged

heartsy

  • Coppermine newbie
  • Offline Offline
  • Posts: 18
Re: Flikr style image annotations
« Reply #134 on: September 03, 2009, 06:57:11 pm »

ok I'll try that.. cuz yeah when I made that first .fn-area transparent... the resize square disappeared to. Apparently it was still there kind of, I had the cursor show the things to resize, but no actual corners or squares so you could see where to drag and resize. Kept the edit box no problem, I mean you could still add your tag, and that was visible, just made it almost impossible to select the area you wanted.
Logged

heartsy

  • Coppermine newbie
  • Offline Offline
  • Posts: 18
Re: Flikr style image annotations
« Reply #135 on: September 03, 2009, 07:29:25 pm »

I found it... in the photonotes.js file just as you said... there's a part that says...

Code: [Select]
PhotoNote.prototype.ShowNoteText = function()
{
    if(!this.container.editing)
    {
        this.container.HideAllNoteTexts();
        this.container.DisableAllNotes();
        this.EnableNote();

        this.gui.ElementRect.style.border='0px solid #D4D82D'; // <---this line originally had 1px for border.
        this.gui.ElementRect.style.margin='0';
        this.gui.ElementNote.style.display='block';

that change removed the yellow box all together.. and you still have the lil square corners to drag and move as you wish to select your area, just no line connecting them. If that makes any sense.

Just figured I'd post my findings in case someone else wanted to remove the selection border.

[Edit GauGau] Added bbcode tag "code" to the posting to make it better readable and easier for others to copy and paste. Please use bbcode where applicable [/Edit]
« Last Edit: September 10, 2009, 10:27:59 am by Joachim Müller »
Logged

Djtale

  • Coppermine newbie
  • Offline Offline
  • Posts: 3
Re: Flikr style image annotations
« Reply #136 on: December 09, 2009, 02:44:29 pm »

Hello.

instead of writing a note, is it possible to show a dropdown list (for example, a list of members) and select what we want as a note in this list ?

Thank you.
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Flikr style image annotations
« Reply #137 on: December 09, 2009, 03:20:29 pm »

That's of course possible and will be in the cpg1.5.x version of this plugin. But it's easy to code this yourself. Just display a select instead of the button.
Logged

Djtale

  • Coppermine newbie
  • Offline Offline
  • Posts: 3
Re: Flikr style image annotations
« Reply #138 on: December 09, 2009, 03:51:25 pm »

That's of course possible and will be in the cpg1.5.x version of this plugin. But it's easy to code this yourself. Just display a select instead of the button.

Hi andré.
I see that you've already doen a similar modification. Do I have to edit the css or the php file to replace the rectangle in which i write the note by a select box ?
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Flikr style image annotations
« Reply #139 on: December 09, 2009, 06:38:02 pm »

My modification creates a select box that passes the selected value to the edit box. If you want to have that select box next to the note, you have to edit the photonotes.js file.
Logged
Pages: 1 ... 3 4 5 6 [7] 8   Go Up
 

Page created in 0.026 seconds with 19 queries.