Photo Tools in All Thumbs, Traditional and Journal views

darryldarryl Registered Users Posts: 997 Major grins
edited September 26, 2008 in SmugMug Support
In contrast to my last rant, a tiny easy request.

All of the (Bulk) Photo Tools: Rotation, Edit Captions, Delete Photos, should be accessible from these styles that do not have a primary photo in them.

As it stands, *none* of the Photo Tools are available in these styles (unless you count "arrange mode" in Traditional or All Thumbs.)

Easy, right? :-}

Comments

  • dmcdmc Registered Users Posts: 427 Major grins
    edited October 30, 2006
    darryl wrote:
    In contrast to my last rant, a tiny easy request.

    All of the (Bulk) Photo Tools: Rotation, Edit Captions, Delete Photos, should be accessible from these styles that do not have a primary photo in them.

    As it stands, *none* of the Photo Tools are available in these styles (unless you count "arrange mode" in Traditional or All Thumbs.)

    Easy, right? :-}

    I thought it would be easy too...
    http://www.dgrin.com/showpost.php?p=343774&postcount=379
  • AndyAndy Registered Users Posts: 50,016 Major grins
    edited October 30, 2006
    darryl wrote:
    In contrast to my last rant, a tiny easy request.

    All of the (Bulk) Photo Tools: Rotation, Edit Captions, Delete Photos, should be accessible from these styles that do not have a primary photo in them.

    As it stands, *none* of the Photo Tools are available in these styles (unless you count "arrange mode" in Traditional or All Thumbs.)

    Easy, right? :-}
    Hi daryl, thanks for the feature request. For now, you'll have to click the photo to get it in a single image view. I'll make sure that JT sees this though!
  • AndyAndy Registered Users Posts: 50,016 Major grins
    edited October 30, 2006
    Hey, a little birdie told me to say "stay tuned" you might see something interesting soon thumb.gif
  • devbobodevbobo Registered Users, Retired Mod Posts: 4,339 SmugMug Employee
    edited October 30, 2006
    Andy wrote:
    Hey, a little birdie told me to say "stay tuned" you might see something interesting soon <img src="https://us.v-cdn.net/6029383/emoji/thumb.gif&quot; border="0" alt="" >
    function addPhotoTools() {
      if (!YD.hasClass(document.body,'loggedIn'))
        return;
    
      if (!YD.hasClass(document.body,'traditional') && !YD.hasClass(document.body,'allthumbs') && !YD.hasClass(document.body,'journal'))
      return;
    
      re = /photos\/(\d+)/;
      oPhotos = YD.getElementsByClassName('photo', 'div');
    
      for (i=0; i < oPhotos.length;i++) {
        re.exec(oPhotos[i].innerHTML);
    oID = RegExp.$1;
        oEl = document.createElement('div');
    oEl.innerHTML = "<form method=\"get\" name=\"image_tools"+ oID +"\" action=\"/photos/tools.mg\"><input type=\"hidden\" name=\"ImageID\" value=\""+ oID +"\"><input type=\"hidden\" name=\"Type\" value=\"Album\"><select name=\"tool\" onChange=\"document.image_tools" + oID + ".submit();\"><option value=\"\">&lt; photo tools &gt;</option><option>-----------------------</option><option value=\"rotatebulk\">Rotate Photos</option><option value=\"newcrop\">Crop Photo</option><option value=\"newthumb\">Zoom Thumbnail</option>option value=\"color\">Color Effects</option><option value=\"colorbulk\">Color Effects (Bulk)</option><option>-----------------------</option><option value=\"highlight\">Feature Photo</option><option value=\"unhighlight\">Remove Featured Photo</option><option value=\"thisisme\">This Is Me! (Bio Photo)</option><option>-----------------------</option><option value=\"caption\">Edit this Caption/Keywords</option><option value=\"bulkcaption\">Edit Captions/Keywords (Bulk)</option><option>-----------------------</option><option value=\"coordinates\">Edit Geography</option><option>-----------------------</option><option value=\"sort\">Sort Gallery</option><option value=\"move\">Arrange this Photo</option><option value=\"dragndrop\">Drag &amp; Drop Photos</option><option value=\"newnewbulkmove\">Arrange Photos</option><option value=\"bulkmove\">Arrange Photos (Expert)</option><option value=\"splitbulk\">Move Photos</option><option value=\"bulkmovegallery\">Move Photos (Expert)</option><option>-----------------------</option><option value=\"makecopy\">Make 2nd Copy</option><option value=\"replace\">Replace Photo</option><option value=\"delete\">Delete this Photo</option><option value=\"newbulkdelete\">Delete Photos (Bulk)</option></select></form>";
        oPhotos[i].appendChild(oEl);
      }
    }
    YE.addListener(window, "load", addPhotoTools); 
    
    David Parry
    SmugMug API Developer
    My Photos
  • AndyAndy Registered Users Posts: 50,016 Major grins
    edited October 30, 2006
    devbobo wrote:
    function addPhotoTools() {
      if (!YD.hasClass(document.body,'loggedIn'))
        return;
    
      if (!YD.hasClass(document.body,'traditional') && !YD.hasClass(document.body,'allthumbs') && !YD.hasClass(document.body,'journal'))
      return;
    
      re = /photos\/(\d+)/;
      oPhotos = YD.getElementsByClassName('photo', 'div');
    
      for (i=0; i < oPhotos.length;i++) {
        re.exec(oPhotos[i].innerHTML);
    oID = RegExp.$1;
        oEl = document.createElement('div');
    oEl.innerHTML = "<form method=\"get\" name=\"image_tools"+ oID +"\" action=\"/photos/tools.mg\"><input type=\"hidden\" name=\"ImageID\" value=\""+ oID +"\"><input type=\"hidden\" name=\"Type\" value=\"Album\"><select name=\"tool\" onChange=\"document.image_tools" + oID + ".submit();\"><option value=\"\">&lt; photo tools &gt;</option><option>-----------------------</option><option value=\"rotatebulk\">Rotate Photos</option><option value=\"newcrop\">Crop Photo</option><option value=\"newthumb\">Zoom Thumbnail</option>option value=\"color\">Color Effects</option><option value=\"colorbulk\">Color Effects (Bulk)</option><option>-----------------------</option><option value=\"highlight\">Feature Photo</option><option value=\"unhighlight\">Remove Featured Photo</option><option value=\"thisisme\">This Is Me! (Bio Photo)</option><option>-----------------------</option><option value=\"caption\">Edit this Caption/Keywords</option><option value=\"bulkcaption\">Edit Captions/Keywords (Bulk)</option><option>-----------------------</option><option value=\"coordinates\">Edit Geography</option><option>-----------------------</option><option value=\"sort\">Sort Gallery</option><option value=\"move\">Arrange this Photo</option><option value=\"dragndrop\">Drag &amp; Drop Photos</option><option value=\"newnewbulkmove\">Arrange Photos</option><option value=\"bulkmove\">Arrange Photos (Expert)</option><option value=\"splitbulk\">Move Photos</option><option value=\"bulkmovegallery\">Move Photos (Expert)</option><option>-----------------------</option><option value=\"makecopy\">Make 2nd Copy</option><option value=\"replace\">Replace Photo</option><option value=\"delete\">Delete this Photo</option><option value=\"newbulkdelete\">Delete Photos (Bulk)</option></select></form>";
        oPhotos[i].appendChild(oEl);
      }
    }
    YE.addListener(window, "load", addPhotoTools); 
    


    w000000t <img src="https://us.v-cdn.net/6029383/emoji/clap.gif&quot; border="0" alt="" > <img src="https://us.v-cdn.net/6029383/emoji/clap.gif&quot; border="0" alt="" > <img src="https://us.v-cdn.net/6029383/emoji/bowdown.gif&quot; border="0" alt="" >

    add this, too, to your css:


    .traditional #photos select {width: 150px;}

    #allthumbs .photo {padding-bottom: 10px;
    padding-top: 10px;
    }
    .allthumbs #photos select {width: 100px;
    margin-top: 5px;
    }

    it's just right for journal.


    53333632-L.gif

    Devbobo to the RESQUOOOOOOOOOOOOOOO
  • AndyAndy Registered Users Posts: 50,016 Major grins
    edited October 30, 2006
    Dev, I wonder if dmc is sending you a bottle of wine or something right about now lol3.gif
  • dmcdmc Registered Users Posts: 427 Major grins
    edited October 31, 2006
    Andy wrote:
    Dev, I wonder if dmc is sending you a bottle of wine or something right about now lol3.gif

    hey Dev, nice job! that's a pretty handy solution (photo tools menu for each pic), I like it. :D told you it would be easy... for Devbobo that is! thanks bowdown.gif

    ok, i'm impressed... but can you let me choose how many pics are served up on a journal page mwink.gif

    or how about, when I click on a pic in journal view, instead of single image view, I see the pic in Critique style (where the exif data shows) that'd be cool..

    or how about .... ahh, just let me know if you need something to work on, I have lots of ideas. thumb.gif
  • devbobodevbobo Registered Users, Retired Mod Posts: 4,339 SmugMug Employee
    edited October 31, 2006
    dmc wrote:
    or how about, when I click on a pic in journal view, instead of single image view, I see the pic in Critique style (where the exif data shows) that'd be cool..

    you mean something like this ??
    function hackCritique() {
      if (!YD.hasClass(document.body,'critique'))
        return;
    
      oEl = YD.get('albumTitle');
      oEl.innerHTML = "<a href='/homepage/templatechange.mg?TemplateID=9&origin="+ window.location + "'>" + oEl.innerHTML + "</a>";
    }
    
    function hackJournal() {
      if (!YD.hasClass(document.body,'journal'))
        return;
    
      var re = /href="((http:\/\/\S*)?\/gallery\/\d+\/\d\/\d+\/(Large|Medium|Small))"/;
      oPhotos = YD.getElementsByClassName('photo', 'div');
      for (i=0; i < oPhotos.length;i++) {
    
        oPhotos[i].innerHTML = oPhotos[i].innerHTML.replace(re,"href='/homepage/templatechange.mg?TemplateID=12&origin=$1'");
      }
    }
    
    YE.onAvailable('albumTitle', hackCritique);
    YE.addListener(window, "load", hackJournal); 
    
    David Parry
    SmugMug API Developer
    My Photos
  • dmcdmc Registered Users Posts: 427 Major grins
    edited October 31, 2006
    devbobo wrote:
    you mean something like this ??

    Dev, this is great.... when someone wants to see more detail about a pic in my Journal Large, they click on it and they see the pic in Critique view which displays the the exif details, and smug loupe, etc. Just what I wanted. thumb.gif It does have a few quirks though...

    First problem is that I limit most of my Galleries to Journal (which I have hacked to be Journal Large). Your "Critique hack" doesn't work when the gallery is forced into Journal view. If I change it to Viewer controlled, it does work, but with a couple issues.

    When I am viewing pics in Journal, I decide to click on a pic, and I see that pic in Critique.... nice! So I hit the "back" key and I am back in Journal.... so far so good. Now when I hit the link that takes me to the next Journal Page, I end up back in Critique style again! something not quite right there...

    My preference would be to also remove the "next/prev" pic links in Critique mode so the user has to hit the brower's "back" to get back to the Journal. (I already do this in Single image view and it keeps people from clicking on a journal pic, then once they are in Single image view, they start hitting Next, Next, Next instead of going back to the Journal.) Since my journal already shows Large pics, there is no reason to click on the pic unless you want to see exif data, or leave a comment (which nobody will ever see in Journal))

    Anyway, this is exacly what I was looking for though... hopefully we can get it to work when the gallery's style is set to Journal!

    Thanks again Dev :D
  • devbobodevbobo Registered Users, Retired Mod Posts: 4,339 SmugMug Employee
    edited October 31, 2006
    ok, here's a 2nd attempt using a slightly different method..and trying to play nice with people's cookies :D

    function checkStyle() {
      if (readCookie('Template') != '9' && readCookie('Template') != '12') {
        document.cookie = "oTemplate=" + readCookie('Template') + "; expires=Thu, 07-Jan-2010 00:00:01 GMT; path=/; domain=.smugmug.com";
        window.location.href = "/homepage/templatechange.mg?TemplateID=9&origin=" + window.location.href;
      }
    }
    
    checkStyle();
    
    function hackCritique() {
      if (!YD.hasClass(document.body,'critique'))
        return;
      document.cookie = "Template=" + readCookie('oTemplate') + "; expires=Thu, 07-Jan-2010 00:00:01 GMT; path=/; domain=.smugmug.com";
    return;
      oEl = YD.get('albumTitle');
      oEl.innerHTML = "<a href='/homepage/templatechange.mg?TemplateID=9&origin="+ window.location + "'>" + oEl.innerHTML + "</a>";
    }
    
    function hackJournal() {
      if (!YD.hasClass(document.body,'journal'))
        return;
    
      document.cookie = "Template=" + readCookie('oTemplate') + "; expires=Thu, 07-Jan-2010 00:00:01 GMT; path=/; domain=.smugmug.com";
    
      var re = /href="((http:\/\/\S*)?\/gallery\/\d+\/\d\/\d+\/(Large|Medium|Small))"/;
      oPhotos = YD.getElementsByClassName('photo', 'div');
      for (i=0; i < oPhotos.length;i++) {
    
        oPhotos[i].innerHTML = oPhotos[i].innerHTML.replace(re,"href='/homepage/templatechange.mg?TemplateID=12&origin=$1'");
      }
    }
    
    YE.onAvailable('albumTitle', hackCritique);
    YE.addListener(window, "load", hackJournal); 
    
    David Parry
    SmugMug API Developer
    My Photos
  • dmcdmc Registered Users Posts: 427 Major grins
    edited November 1, 2006
    devbobo wrote:
    ok, here's a 2nd attempt using a slightly different method..and trying to play nice with people's cookies :D

    thanks Dev, I gave it a try... still a bit quirky though.

    still doesn't do anything if the gallery style is set to Journal. So I changed a gallery to viewer controlled so I could test the new code.

    I Clicked on the gallery, I see pics in Journal (page 1). I clicked on one of the pics, I see the pic in Critique, great. I hit the back key, I see the same Journal page, but it is back at the top again (normally, it scrolls down to where I was) ok so far.

    But when I selected a new gallery Page, I got a blank page.... then I noticed the stlye chooser was blank... so I chose "smugmug" and the gallery came back in "smugmug". Now if I select different gallery pages, it seems to alternate between Journal and smugmug styles.... headscratch.gif

    not sure how much you want to work on this...(probably should move this to the customization forum) I think it would be a great feature, but I need it to work on gallery's that have their style set to Journal before I could use it (assuming the quirks are resolved).

    I really do like seeing the pic in critique mode when I click on an image though.... nice seeing the exif data right there.
  • devbobodevbobo Registered Users, Retired Mod Posts: 4,339 SmugMug Employee
    edited November 1, 2006
    dmc,

    yes you will have to leave the galleries as user-controlled...this is because the style changer code only works if it's set to user-controlled. But in saying that...the code automatically sets the style to journal, so there should be no need to actually force it to journal...make sense ?

    not show about the other quirkyness, I only tried a small number of functions.

    I am going to be away for a few days...i will have another look when i get back.

    David
    David Parry
    SmugMug API Developer
    My Photos
  • dmcdmc Registered Users Posts: 427 Major grins
    edited November 1, 2006
    devbobo wrote:
    ...I am going to be away for a few days...i will have another look when i get back.
    David
    thumb.gif
  • darryldarryl Registered Users Posts: 997 Major grins
    edited November 15, 2007
    Man, I totally forgot that I requested this, and found it while doing a search to see if I could do a !YD.hasClass.

    It works like a dream, although all of the double-quotes in the innerHTML for the <photo tools> form need to be escaped (oh crap, there they are when you do a reply). Well, let me see if I can get that to show up properly just on the page. Oof, that was a bunch of work. But I think I fixed a typo in the original code too (a missing < before one of the options). Guess I'm the only one using this code. :-}
    function addPhotoTools() {
      if (!YD.hasClass(document.body,'loggedIn'))
        return;
    
      if (!YD.hasClass(document.body,'traditional') && !YD.hasClass(document.body,'allthumbs') && !YD.hasClass(document.body,'journal'))
      return;
    
      re = /photos\/(\d+)/;
      oPhotos = YD.getElementsByClassName('photo', 'div');
    
      for (i=0; i < oPhotos.length;i++) {
        re.exec(oPhotos[i].innerHTML);
        oID = RegExp.$1;
        oEl = document.createElement('div');
        oEl.innerHTML = "&lt;form method=\\"get\\" name=\\"image_tools"+ oID +"\\" action=\\"/photos/tools.mg\\">&lt;input type=\\"hidden\\" name=\\"ImageID\\" value=\\""+ oID +"\\">&lt;input type=\\"hidden\\" name=\\"Type\\" value=\\"Album\\">&lt;select name=\\"tool\\" onChange=\\"document.image_tools" + oID + ".submit();\\">&lt;option value=\\"\\">&amp;lt; photo tools &amp;gt;&lt;/option>&lt;option>-----------------------&lt;/option>&lt;option value=\\"rotatebulk\\">Rotate Photos&lt;/option>&lt;option value=\\"newcrop\\">Crop Photo&lt;/option>&lt;option value=\\"newthumb\\">Zoom Thumbnail&lt;/option>&lt;option value=\\"color\\">Color Effects&lt;/option>&lt;option value=\\"colorbulk\\">Color Effects (Bulk)&lt;/option>&lt;option>-----------------------&lt;/option>&lt;option value=\\"highlight\\">Feature Photo&lt;/option>&lt;option value=\\"unhighlight\\">Remove Featured Photo&lt;/option>&lt;option value=\\"thisisme\\">This Is Me! (Bio Photo)&lt;/option>&lt;option>-----------------------&lt;/option>&lt;option value=\\"caption\\">Edit this Caption/Keywords&lt;/option>&lt;option value=\\"bulkcaption\\">Edit Captions/Keywords (Bulk)&lt;/option>&lt;option>-----------------------&lt;/option>&lt;option value=\\"coordinates\\">Edit Geography&lt;/option>&lt;option>-----------------------&lt;/option>&lt;option value=\\"sort\\">Sort Gallery&lt;/option>&lt;option value=\\"move\\">Arrange this Photo&lt;/option>&lt;option value=\\"dragndrop\\">Drag &amp; Drop Photos&lt;/option>&lt;option value=\\"newnewbulkmove\\">Arrange Photos&lt;/option>&lt;option value=\\"bulkmove\\">Arrange Photos (Expert)&lt;/option>&lt;option value=\\"splitbulk\\">Move Photos&lt;/option>&lt;option value=\\"bulkmovegallery\\">Move Photos (Expert)&lt;/option>&lt;option>-----------------------&lt;/option>&lt;option value=\\"makecopy\\">Make 2nd Copy&lt;/option>&lt;option value=\\"replace\\">Replace Photo&lt;/option>&lt;option value=\\"delete\\">Delete this Photo&lt;/option>&lt;option value=\\"newbulkdelete\\">Delete Photos (Bulk)&lt;/option></select></form>";
        oPhotos[i].appendChild(oEl);
      }
    }
    YE.addListener(window, "load", addPhotoTools); 
    

    Ah, ok, *now* the above code is cut-and-pasteable into your Javascript. And from Andy, this into your CSS:
    .traditional #photos select {width: 150px;}
    
    #allthumbs .photo {padding-bottom: 10px;
    padding-top: 10px;
    }
    .allthumbs #photos select {width: 100px;
    margin-top: 5px;
    }
    
  • darryldarryl Registered Users Posts: 997 Major grins
    edited November 15, 2007
    In case you're wondering what the heck this does. Here's the Before shot:
  • darryldarryl Registered Users Posts: 997 Major grins
    edited November 15, 2007
    And here's the After shot. Yeah!
  • birchfieldbirchfield Registered Users Posts: 67 Big grins
    edited November 16, 2007
    cheers for this clap.gif

    been looking for a way to see the tools in traditional view for ages!
  • darryldarryl Registered Users Posts: 997 Major grins
    edited September 26, 2008
    Feh -- I think adding albumkeys and imagekeys broke this hack. Bummer.
Sign In or Register to comment.