Re: ZMSMediaPlayer - Galerie

Reth Zürcher <[email protected]> Mon, 12 Aug 2013 23:42:56 -0700 (PDT)
Newsgroups	gmane.comp.cms.zms.devel
Message-ID	<[email protected]>
---1879531-1233163510-1376376176=:90039
Content-Type: text/plain; charset=iso-8859-1
Content-Transfer-Encoding: quoted-printable

You're right. I should have put that a bit differently. I didn't mean auto =
crop but auto resize. I think there are ways to make the gallery look alrig=
ht even when they have different formats.=20

The thing is, that we really need it to be as easy to handle as possible an=
d i see two problems with the current gallery. It might be confusing to som=
e customers that it doesn't work with the sitemap open and yeah the croppin=
g of course.

Are there any good ajax galleries you know of?








________________________________
 From: Niels Dettenbach <[email protected]>
To: [email protected]=20
Sent: Friday, August 9, 2013 4:53 PM
Subject: Re: [zms-developers] ZMSMediaPlayer - Galerie
=20

Am Mittwoch, 7. August 2013, 06:36:02 schrieben Sie:
> The ZMSMediaPlayer is really a great extension for ZMS.=20
>=20
> I'd love to use the "Galerie" also but there is just one thing I don't li=
ke
> about it. It's that you *have to* crop the thumbnails yourself. I tried t=
o
> modify the code so that it does that automatically, just like the medium
> one - but i failed greatly. Is there any hints you could give me?
hmm,
withour any coding afaik you can "prepare" a ZIP where all the variants of =
a=20
gallery image (thumbnail / preview / full) are still in by filename convent=
ion=20
- but this is not practical for typical end users.

Automatical "cropping" (not as resoizing/scaling) makes no sense as it is=20
nearly impossible to write some code which is able to recognize the right=20
content focus on any image like or nearly like as a human.

It makes much sense to crop any thumbnail in the gallery by hand as it does=
=20
not seems nice if you have preview images with different length/side=20
proportions and are not able to tell a program wheer and how some image has=
 be=20
be cropped automatically (except very specialized applications with images =
of=20
a defined size and content placements).=20

The only exception is if you just have images which has all the same length=
/=20
height proportion - i.e. quadratical - then you can use autoamtical resizin=
g=20
of the whole image content to get same proportioned images.

Otherwise it could makes sense to use another Ajax gallery solution (whioch=
=20
not optical relys on same proportioned images) and implement it as ZMS obje=
ct=20
which is more suitable for images with different length/height proportions.=
=20
I've fiddeled different ones att, because my users / customers had very=20
different requirements for their "galleries" regarding handling/usage and=20
layout rules.


hth
cheers,

Niels

--=20
---
Niels Dettenbach
Syndicat IT & Internet
http://www.syndicat.com
PGP: https://syndicat.com/pub_key.asc
---
---1879531-1233163510-1376376176=:90039
Content-Type: text/html; charset=ISO-8859-1
Content-Transfer-Encoding: 7bit




<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
</head>







<body style="background-color: #fff;">
<span style="display:none">&nbsp;</span>

<!--~-|**|PrettyHtmlStartT|**|-~-->
<div id="ygrp-mlmsg" style="position:relative;">
  <div id="ygrp-msg" style="z-index: 1;">
<!--~-|**|PrettyHtmlEndT|**|-~-->

    <div id="ygrp-text" >
      
      
      <p><div style="color:#000;background-color:#fff;font-family:times new roman, new york, times, serif;font-size:12pt;">You're right. I should have put that a bit differently. I didn't mean auto crop but auto resize. I think there are ways to make the gallery look alright even when they have different formats. <br><br>The thing is, that we really need it to be as easy to handle as possible and i see two problems with the current gallery. It might be confusing to some customers that it doesn't work with the sitemap open and yeah the cropping of course.<br><br>Are there any good ajax galleries you know of?<br><br><br><br><br><div><span><br></span></div><div><br></div>  <div style="font-family: times new roman, new york, times, serif;font-size: 12pt;"> <div style="font-family: times new ro
 man, new york, times, serif;font-size: 12pt;"> <div dir="ltr"> <hr size="1">  <font face="Arial" size="2"> <b><span style="font-weight:bold;">From:</span></b>
 Niels Dettenbach &lt;[email protected]&gt;<br> <b><span style="font-weight: bold;">To:</span></b> [email protected] <br> <b><span style="font-weight: bold;">Sent:</span></b> Friday, August 9, 2013 4:53 PM<br> <b><span style="font-weight: bold;">Subject:</span></b> Re: [zms-developers] ZMSMediaPlayer - Galerie<br> </font> </div> <div class="y_msg_container"><br>
Am Mittwoch, 7. August 2013, 06:36:02 schrieben Sie:<br>&gt; The ZMSMediaPlayer is really a great extension for ZMS. <br>&gt; <br>&gt; I'd love to use the "Galerie" also but there is just one thing I don't like<br>&gt; about it. It's that you *have to* crop the thumbnails yourself. I tried to<br>&gt; modify the code so that it does that automatically, just like the medium<br>&gt; one - but i failed greatly. Is there any hints you could give me?<br>hmm,<br>withour any coding afaik you can "prepare" a ZIP where all the variants of a <br>gallery image (thumbnail / preview / full) are still in by filename convention <br>- but this is not practical for typical end users.<br><br>Automatical "cropping" (not as resoizing/scaling) makes no sense as it is <br>nearly impossible to write some code whi
 ch is able to recognize the right <br>content focus on any image like or nearly like as a human.<br><br>It makes much sense to crop any thumbnail in the gallery by hand
 as it does <br>not seems nice if you have preview images with different length/side <br>proportions and are not able to tell a program wheer and how some image has be <br>be cropped automatically (except very specialized applications with images of <br>a defined size and content placements). <br><br>The only exception is if you just have images which has all the same length/ <br>height proportion - i.e. quadratical - then you can use autoamtical resizing <br>of the whole image content to get same proportioned images.<br><br>Otherwise it could makes sense to use another Ajax gallery solution (whioch <br>not optical relys on same proportioned images) and implement it as ZMS object <br>which is more suitable for images with different length/height proportions. <br>I've fiddeled different one
 s att, because my users / customers had very <br>different requirements for their "galleries" regarding handling/usage and <br>layout
 rules.<br><br><br>hth<br>cheers,<br><br>Niels<br><br>-- <br> ---<br> Niels Dettenbach<br> Syndicat IT &amp; Internet<br> http://www.syndicat.com<br> PGP: <a href="https://syndicat.com/pub_key.asc" target="_blank">https://syndicat.com/pub_key.asc</a><br> ---<br> <br><br><br><br><br><br></div> </div> </div>  </div></p>

    </div>
     

    <!--~-|**|PrettyHtmlStart|**|-~-->
    <div style="color: #fff; height: 0;">__._,_.___</div>

        
  
  
    <table cellspacing=4px style="margin-top: 20px; margin-bottom: 10px;">
      <tbody>
        <tr>
          <td style="font-size: 12px; font-family: arial; font-weight: bold; padding: 7px 5px 5px; color: #FFF; background-color: #F2F2F2; border: 1px solid #EAEAEA "  >
                          <a style="text-decoration: none; color: #2D50FD" href="http://groups.yahoo.com/group/zms-developers/post;_ylc=X3oDMTJwODltZnNxBF9TAzk3MzU5NzE0BGdycElkAzg0NzA4MjEEZ3Jwc3BJZAMxNzA3MjgxOTQyBG1zZ0lkAzM4NjAEc2VjA2Z0cgRzbGsDcnBseQRzdGltZQMxMzc2Mzc2MTc3?act=reply&messageNum=3860">Reply via web post</a>
                      </td>
          <td style="font-size: 12px; font-family: arial; padding: 7px 5px 5px; color: #FFF; background-color: #F2F2F2; border: 1px solid #EAEAEA; " >
            <a href="mailto:[email protected]?subject=Re%3A%20%5Bzms-developers%5D%20ZMSMediaPlayer%20-%20Galerie" style="text-decoration: none; color: #2D50FD;">
              Reply to sender            </a> 
          </td>
          <td style="font-size: 12px; font-family: arial; padding: 7px 5px 5px; color: #FFF; background-color: #F2F2F2; border: 1px solid #EAEAEA; ">
            <a href="mailto:[email protected]?subject=Re%3A%20%5Bzms-developers%5D%20ZMSMediaPlayer%20-%20Galerie" style="text-decoration: none; color: #2D50FD">
              Reply to group            </a> 
          </td>
          <td style="font-size: 12px; font-family: arial; padding: 7px 5px 5px; color: #FFF; background-color: #F2F2F2; border: 1px solid #EAEAEA; " >
            <a href="http://groups.yahoo.com/group/zms-developers/post;_ylc=X3oDMTJlNXFkc3E0BF9TAzk3MzU5NzE0BGdycElkAzg0NzA4MjEEZ3Jwc3BJZAMxNzA3MjgxOTQyBHNlYwNmdHIEc2xrA250cGMEc3RpbWUDMTM3NjM3NjE3Nw--" style="text-decoration: none; color: #2D50FD">Start a New Topic</a>
          </td>
          <td style="font-size: 12px; font-family: arial; padding: 7px 5px 5px; color: #2D50FD; background-color: #F2F2F2; border: 1px solid #EAEAEA; " >
                            <a href="http://groups.yahoo.com/group/zms-developers/message/3858;_ylc=X3oDMTM0dmdrZnZpBF9TAzk3MzU5NzE0BGdycElkAzg0NzA4MjEEZ3Jwc3BJZAMxNzA3MjgxOTQyBG1zZ0lkAzM4NjAEc2VjA2Z0cgRzbGsDdnRwYwRzdGltZQMxMzc2Mzc2MTc3BHRwY0lkAzM4NTg-" style="text-decoration: none; color: #2D50FD;">Messages in this topic</a>
                (3)
                      </td>
        </tr>
      </tbody>
    </table>

        
<!------- Start Nav Bar ------>

<!-- |**|begin egp html banner|**| -->
<div id="ygrp-vital" style="background-color: #f2f2f2; font-family: Verdana; font-size: 10px; margin-bottom: 10px; padding: 10px;">
      <span id="vithd" style="font-weight: bold; color: #333; text-transform: uppercase; ">Recent Activity:</span>

    <ul style="list-style-type: none; margin: 0; padding: 0; display: inline;">
                                                    </ul>
    
  <div style="clear: both; padding-top: 2px; color: #1e66ae;">
    <a href="http://groups.yahoo.com/group/zms-developers;_ylc=X3oDMTJlZ2hqdTVpBF9TAzk3MzU5NzE0BGdycElkAzg0NzA4MjEEZ3Jwc3BJZAMxNzA3MjgxOTQyBHNlYwN2dGwEc2xrA3ZnaHAEc3RpbWUDMTM3NjM3NjE3Nw--" style="text-decoration: none;">Visit Your Group</a>
  </div>
</div>


  
<div id="ft" style="font-family: Arial; font-size: 11px; margin-top: 5px; padding: 0 2px 0 0; clear: both;">
  <a href="http://groups.yahoo.com/;_ylc=X3oDMTJkYjcxbmlrBF9TAzk3NDc2NTkwBGdycElkAzg0NzA4MjEEZ3Jwc3BJZAMxNzA3MjgxOTQyBHNlYwNmdHIEc2xrA2dmcARzdGltZQMxMzc2Mzc2MTc3" style="float: left;"><img src="http://l.yimg.com/a/i/us/yg/logo/us.gif" height="15" width="137" alt="Yahoo! Groups" style="border: 0;"/></a>
  <div style="color: #747575; float: right;">Switch to: <a href="mailto:[email protected]?subject=Change Delivery Format: Traditional" style="text-decoration: none;">Text-Only</a>, <a href="mailto:[email protected]?subject=Email Delivery: Digest" class="margin-rt" style="text-decoration: none;">Daily Digest</a> &bull; <a href="mailto:[email protected]?subject=Unsubscribe" style="text-decoration: none;">Unsubscribe</a> &bull; <a href="http://docs.yahoo.com/info/terms/" style="text-decoration: none;">Terms of Use</a> &bull; <a href="mailto:[email protected]?subject=Feedback on the redesigned individual mail v1" style="text-decoration: none;">Send us Feedback </a></div>
</div>

<!-- |**|end egp html banner|**| -->

  </div> <!-- ygrp-msg -->

  <!-- Sponsor -->
  <!-- |**|begin egp html banner|**| -->
  <div id="ygrp-sponsor" style="width:160px; float:right; clear:none; margin:0 0 25px 0; background: #fff;">

<!-- Start Recommendations -->
<div id="ygrp-reco">
     </div>
<!-- End Recommendations -->



  </div>   <!-- |**|end egp html banner|**| -->

  <div style="clear:both; color: #FFF; font-size:1px;">.</div>
</div>

  <img src="http://geo.yahoo.com/serv?s=97359714/grpId=8470821/grpspId=1707281942/msgId=3860/stime=1376376177" width="1" height="1"> <br>

<div style="color: #fff; height: 0;">__,_._,___</div>
<!--~-|**|PrettyHtmlEnd|**|-~-->

</body>

<!--~-|**|PrettyHtmlStart|**|-~-->
<head>
  <style type="text/css">
  <!--
  #ygrp-mkp {
  border: 1px solid #d8d8d8;
  font-family: Arial;
  margin: 10px 0;
  padding: 0 10px;
}

#ygrp-mkp hr {
  border: 1px solid #d8d8d8;
}

#ygrp-mkp #hd {
  color: #628c2a;
  font-size: 85%;
  font-weight: 700;
  line-height: 122%;
  margin: 10px 0;
}

#ygrp-mkp #ads {
  margin-bottom: 10px;
}

#ygrp-mkp .ad {
  padding: 0 0;
}

#ygrp-mkp .ad p {
  margin: 0;
}

#ygrp-mkp .ad a {
  color: #0000ff;
  text-decoration: none;
}
  #ygrp-sponsor #ygrp-lc {
  font-family: Arial;
}

#ygrp-sponsor #ygrp-lc #hd {
  margin: 10px 0px;
  font-weight: 700;
  font-size: 78%;
  line-height: 122%;
}

#ygrp-sponsor #ygrp-lc .ad {
  margin-bottom: 10px;
  padding: 0 0;
}

  #actions {
    font-family: Verdana;
    font-size: 11px;
    padding: 10px 0;
  }

  #activity {
    background-color: #e0ecee;
    float: left;
    font-family: Verdana;
    font-size: 10px;
    padding: 10px;
  }

  #activity span {
    font-weight: 700;
  }

  #activity span:first-child {
    text-transform: uppercase;
  }

  #activity span a {
    color: #5085b6;
    text-decoration: none;
  }

  #activity span span {
    color: #ff7900;
  }

  #activity span .underline {
    text-decoration: underline;
  }

  .attach {
    clear: both;
    display: table;
    font-family: Arial;
    font-size: 12px;
    padding: 10px 0;
    width: 400px;
  }

  .attach div a {
    text-decoration: none;
  }

  .attach img {
    border: none;
    padding-right: 5px;
  }

  .attach label {
    display: block;
    margin-bottom: 5px;
  }

  .attach label a {
    text-decoration: none;
  }
  
  blockquote {
    margin: 0 0 0 4px;
  }

  .bold {
    font-family: Arial;
    font-size: 13px;
    font-weight: 700;
  }

  .bold a {
    text-decoration: none;
  }

  dd.last p a {
    font-family: Verdana;
    font-weight: 700;
  }

  dd.last p span {
    margin-right: 10px;
    font-family: Verdana;
    font-weight: 700;
  }

  dd.last p span.yshortcuts {
    margin-right: 0;
  }

  div.attach-table div div a {
    text-decoration: none;
  }

  div.attach-table {
    width: 400px;
  }

  div.file-title a, div.file-title a:active, div.file-title a:hover, div.file-title a:visited {
    text-decoration: none;
  }

  div.photo-title a, div.photo-title a:active, div.photo-title a:hover, div.photo-title a:visited {
    text-decoration: none;
  }

  div#ygrp-mlmsg #ygrp-msg p a span.yshortcuts {
    font-family: Verdana;
    font-size: 10px;
    font-weight: normal;
  }

  .green {
    color: #628c2a;
  }

  .MsoNormal {
    margin: 0 0 0 0;
  }

  o {
    font-size: 0;
  }

  #photos div {
    float: left;
    width: 72px;
  }

  #photos div div {
    border: 1px solid #666666;
    height: 62px;
    overflow: hidden;
    width: 62px;
  }

  #photos div label {
    color: #666666;
    font-size: 10px;
    overflow: hidden;
    text-align: center;
    white-space: nowrap;
    width: 64px;
  }

  #reco-category {
    font-size: 77%;
  }

  #reco-desc {
    font-size: 77%;
  }

  .replbq {
    margin: 4px;
  }

  #ygrp-actbar div a:first-child {
   /* border-right: 0px solid #000;*/
    margin-right: 2px;
    padding-right: 5px;
  }

  #ygrp-mlmsg {
    font-size: 13px;
    font-family: Arial, helvetica,clean, sans-serif;
    *font-size: small;
    *font: x-small;
  }

  #ygrp-mlmsg table {
    font-size: inherit;
    font: 100%;
  }

  #ygrp-mlmsg select, input, textarea {
    font: 99% Arial, Helvetica, clean, sans-serif;
  }

  #ygrp-mlmsg pre, code {
    font:115% monospace;
    *font-size:100%;
  }

  #ygrp-mlmsg * {
    line-height: 1.22em;
  }

  #ygrp-mlmsg #logo {
    padding-bottom: 10px;
  }


  #ygrp-msg p a {
    font-family: Verdana;
  }

  #ygrp-msg p#attach-count span {
    color: #1E66AE;
    font-weight: 700;
  }

  #ygrp-reco #reco-head {
    color: #ff7900;
    font-weight: 700;
  }

  #ygrp-reco {
    margin-bottom: 20px;
    padding: 0px;
  }

  #ygrp-sponsor #ov li a {
    font-size: 130%;
    text-decoration: none;
  }

  #ygrp-sponsor #ov li {
    font-size: 77%;
    list-style-type: square;
    padding: 6px 0;
  } 

  #ygrp-sponsor #ov ul {
    margin: 0;
    padding: 0 0 0 8px;
  }

  #ygrp-text {
    font-family: Georgia;
  }

  #ygrp-text p {
    margin: 0 0 1em 0;
  }

  #ygrp-text tt {
    font-size: 120%;
  }

  #ygrp-vital ul li:last-child {
    border-right: none !important; 
  } 
  -->
  </style>
</head>

<!--~-|**|PrettyHtmlEnd|**|-~-->
</html>
<!-- end group email -->


---1879531-1233163510-1376376176=:90039--