• twitter image
  • facebook image
  • youtube image
  • linkedin image
Language: CMS Made Simple Czech CMS Made Simple France CMS Made Simple Spain CMS Made Simple Hungary CMS Made Simple Russia CMS Made Simple Netherlands

All times are UTC




Post new topic Reply to topic  [ 25 posts ]  Go to page Previous  1, 2
Author Message
 Post subject: Re: use CGSmartImage in news or cgblog summary or detail pag
PostPosted: Thu Oct 13, 2011 5:38 pm 
Offline
Power Poster
Power Poster
User avatar

Joined: Thu Feb 08, 2007 6:11 pm
Posts: 506
Location: Florida
To help with estimating time/cost, I can make the interface in photoshop (all fast and loose) so you can see how an it can ideally be for really non-technical people (if you can use your email, you can update your site). Right. ;-)


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: use CGSmartImage in news or cgblog summary or detail pag
PostPosted: Thu Oct 13, 2011 5:46 pm 
Offline
Power Poster
Power Poster
User avatar

Joined: Thu Feb 08, 2007 6:11 pm
Posts: 506
Location: Florida
Sorry. Since I'm not rolling in the dough at the moment, I'd like to do the following since I dig this idea for the plug into the editor for non-techies (I fall into this category):

Situation one:
Pay you for it
Charge 10.00 for the plug in until it's paid for
Then it's free

Raise the money from the CMSMS userbase and if it's not raised, then don't do it.


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: use CGSmartImage in news or cgblog summary or detail pag
PostPosted: Thu Oct 13, 2011 6:13 pm 
Offline
Power Poster
Power Poster
User avatar

Joined: Thu Feb 08, 2007 6:11 pm
Posts: 506
Location: Florida
Okay scratch that idea about the plugin for the editor.

Here's an email, for reference, from Matt Willcox the developer behind adaptive images:


It turns out that the problem [in firefox] is intermittent (which is why I thought it was fixed but sometimes it isn't).

The short answer is: switch it to FALSE for now, which guarantees that people using Firefox on the desktop will get the right size images every time instead of broken looking mobile resolution images. FF desktop is liekly a far larger audience than mobile for now.

The reason is: there's a race condition in all browsers - and Firefox isn't consistent with how that resolves. The browser is in a race to set a cookie and load all the HTML. Which happens first is what decides whether AI works properly on the very first page load. Webkit always sets the cookie first, so the $mobile_first flag is safe and always honoured. Gecko and Trident don't always set the cookie first, so the $mobile_first needs to be set to false or else you get the issue you see here.

What happens to mobile: depends on the browser the device is running. Most mobile devices seem to run a version of webkit these days, so it should work as expected - the cookie is set before the images are requested and the right sizes get delivered first time. If, for whatever reason, the cookie is not set before the images are requested then the very first page load on the mobile device will request some images that are larger than the display needs. This will mean the initial page load is slower than expected but the display of the images will appear correct. I should stress that this is a very-first page load issue, and as the cookie is set for the domain every subsequent page load will work properly.

What I'm doing about it: I'm looking into ways to detect the browser engine and have AI automatically adjust the $mobile_first setting for browser engines known to suffer from the race condition problem. It already does this for IE.


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: use CGSmartImage in news or cgblog summary or detail pag
PostPosted: Fri Oct 14, 2011 4:20 pm 
Offline
Dev Team Member
Dev Team Member
User avatar

Joined: Tue Oct 19, 2004 6:44 pm
Posts: 8167
Location: Fernie British Columbia, Canada
The issue of 'serving images to devices no larger than they can handle' is simple in principle, but difficult in practice. in principle it's:
a: detect the browsers maximum resolution (if possible)
b: cross-reference that with the sizes that you want to output and output the image (caching would be really nice here).
c: allow the browser to cache the image.

In practice though it's problematic. There are two basic methods:
a: The javascript approach
pros:
it's simple, set a cookie or send the resolution via ajax to the server
cons:
it's problematic and browser dependant. If the cookie (lets say we're using a cookie) is not already sent, then it is set by the javascript. The javascript may not be executed before the images are requested (browsers tend to be asynchronous and do a few things at a time). This could mean that the first time a user on an iphone browses a page he gets the massive images, and since the images are cached on the browser, that's all he gets. Additionally, if the images are resized and cached in the same request that gets the initial HTML for the page (the way CGSmartImage currently behaves) then there may be no resolution data for the program to use to resize the image.


b: Use a web service approach
- on request grab the server details send them to another service to do a database lookup and return the device capabilities.
pros:
- it happens on initial request of the HTML, so that if the data in the web service is up-to-date the rest of the image processing will have the resolution information to play with.
- this request info can be cached for performance purposes so that every request to your page does not have to go to the remote web service.
cons:
- it depends on the accuracy of the web service, and the throughput of your outgoing host (and whatever QOS stuff has been setup).
- it is extra overhead on each request, at least (when using caching) until a reasonable database of your most frequent devices is built up.

Since the goal of CGSmartImage is primarily to improve performance and make image processing simpler, not necessarily to make the 'developers life easier'... if I were to implement adaptive images into CGSmartImage I would probably go with the second approach, and chose a free (and untested by me at this time) web service like: http://www.deviceidentifier.com/

_________________
Follow me on twitter
Please post system information from "Extensions >> System Information" (there is a bbcode option) on all posts asking for assistance.
--------------------
If you can't bother explaining your problem well, you shouldn't expect much in the way of assistance.


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: use CGSmartImage in news or cgblog summary or detail pag
PostPosted: Fri Oct 14, 2011 6:43 pm 
Offline
Dev Team Member
Dev Team Member
User avatar

Joined: Tue Oct 19, 2004 6:44 pm
Posts: 8167
Location: Fernie British Columbia, Canada
For laughs and giggles (and to try to reproduce a problem with CGSmartImage) I installed the Gallery module for the first time (nice module by the way).

I tweaked the foreach loop of the Lytebox Fancybox template like this:

\$1:
{foreach from=$images item=image}
   <div class="img">
   {if $image->isdir}
      <a href="{$image->file}" title="{$image->titlename}">{CGSmartImage src=$image->thumb filter_croptofit=150,150,tc alt="$image->titlename"}</a><br />
      {$image->titlename}
   {else}
   <a class="group" rel="gallery-{$galleryid}" title="{$image->titlename}" href="{CGSmartImage src=$image->file alt=$image->titlename filter_croptofit=800,600,tc alt=$image->titlename notag=1 noembed=1}">{CGSmartImage src=$image->file filter_croptofit=150,150,tc alt=$image->titlename}</a>
   {/if}
   </div>
{/foreach}


And CGSmartImage works well. The advantages to this are:
a: Better thumbnails
- I don't use the gallery thumbnails, CGSmartImage creates them on the fly given the parameters I want (if I want watermarks on the thumbnailed images, and want them in greyscale I can do that). In this case I am cropping-to-fit the thumbnails to 150x150 and cropping to the top-center

b: Performance
- Thumbnails are base64 embedded into the page to minimize requests. This may not work with all of the templates. I tried it, and it worked with Lytebox Fancybox. you cannot embed the image targets to my knowledge though.

c: Automatic orientation
- I uploaded some jpeg images from my ipod. These were automatically corrected to show 'upright'. Which is handy as customers don't have to rotate images before uploading.

d: Ease of Modification
- Adjusting the size of the popup images, or the size of the thumbnails is as easy as changing the values in the template. CGSmartImage will then re-process the images on the fly. All I have to do after that is tweak stylesheets.

Either way, Gallery is a nice module... and with a minimal amount of modification you can have your cake and eat it too wrt thumbnails and ease of use for your customers.

_________________
Follow me on twitter
Please post system information from "Extensions >> System Information" (there is a bbcode option) on all posts asking for assistance.
--------------------
If you can't bother explaining your problem well, you shouldn't expect much in the way of assistance.


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: use CGSmartImage in news or cgblog summary or detail pag
PostPosted: Sun Oct 16, 2011 9:04 pm 
Offline
Power Poster
Power Poster
User avatar

Joined: Thu Feb 08, 2007 6:11 pm
Posts: 506
Location: Florida
I'm running into an issue with cgblog. II delete the image, say I have a post and add an image, then decide that I don't want an image on that post and don't want any image at all, I click the delete next to the image yet this is what happens on the post: it still prints the figure and the image tags and this is the error:

\$1:
<img src="<br />
<b>Warning</b>:  file_get_contents(http://domain.name/uploads/cgblog/id6/testcrop.jpg) [<a href='function.file-get-contents'>function.file-get-contents</a>]: failed to open stream: HTTP request failed! HTTP/1.1 404 Not Found
 in <b>/home/username/public_html/domain/directornam/modules/CGSmartImage/lib/class.cgsi_utils.php</b> on line <b>322</b><br />
string(71) "Smarty error: Attempt to create a CGImageBase object with invalid input"
" alt=''/>


Any help is deeeeeeeeeeeply appreciated.


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: use CGSmartImage in news or cgblog summary or detail pag
PostPosted: Tue Nov 15, 2011 10:53 pm 
Offline
Forum Members
Forum Members
User avatar

Joined: Thu Jul 29, 2010 11:09 pm
Posts: 149
Location: Portland, OR
That's the first time you've installed Gallery Calguy? Man, I love that module and CGSmartImage is crucial for how I set up my Gallery templates.


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: use CGSmartImage in news or cgblog summary or detail pag
PostPosted: Tue May 29, 2012 10:55 am 
Offline
Forum Members
Forum Members
User avatar

Joined: Fri Sep 14, 2007 1:05 pm
Posts: 144
Location: South Derbyshire – UK
Hi

I tried a variation on your code to get an alt tag and link information into my summary news template.

However I am having a problem with the CGSmartImage module. My template looks like this:
\$1:
{foreach from=$items item=entry}

<div class="homeHighlightTop">

{capture name=page_alias assign=pageAlias}
{if isset($entry->fields)}
  {foreach from=$entry->fields item='field'}
     {if $field->name == 'pagealias'}
          {$field->value}
        {/if}
  {/foreach}
{/if}
{/capture}

{capture name=image_alt assign=imageAlt}
{if isset($entry->fields)}
  {foreach from=$entry->fields item='field'}
     {if $field->name == 'imagealt'}
          {$field->value}
        {/if}
  {/foreach}
{/if}
{/capture}

<h2><a href='{cms_selflink href="$pageAlias"}'>{$entry->title}</a></h2>


{if isset($entry->fields)}
  {foreach from=$entry->fields item='field'}
     {if $field->type == 'file' && $field->name == 'highlightimage'}
          <img src="{CGSmartImage src1=$entry->file_location src2=$field->value  filter_resize=w,20}" alt='$imageAlt'/>
          {* <img src="{$entry->file_location}/{$field->value}" alt="$imageAlt"/> *}
     {/if}
  {/foreach}
{/if}

{if $entry->content}
<p>{eval var=$entry->content}</p>
{/if}

</div>

<div class="homeHighlightBottom">
    <p><a href='{cms_selflink href="$pageAlias"}'>Tell me more</a></p>
</div>

{/foreach}


I have tried it with a simple
\$1:
{CGSmartImage src1=$entry->file_location src2=$field->value  filter_resize=w,20}
without the img tag as well. But I get the error code:
\$1:
string(143) "Smarty error: [in module_db_tpl:News;summaryhomepagehighlight line 33]: [plugin] unknown tag - 'CGSmartImage' (core.load_plugins.php, line 198)" string(155) "Smarty error: [in module_db_tpl:News;summaryhomepagehighlight line 33]: syntax error: unrecognized tag 'CGSmartImage' (Smarty_Compiler.class.php, line 590)"


I have used the CGSmartImage within the Products module (Thanks to help from callguy - big thumbs up).

But now have this problem - it is probably something really simple that I have missed.


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: use CGSmartImage in news or cgblog summary or detail pag
PostPosted: Tue May 29, 2012 12:30 pm 
Offline
Forum Members
Forum Members
User avatar

Joined: Fri Sep 14, 2007 1:05 pm
Posts: 144
Location: South Derbyshire – UK
Hi, just a quick note - I got the capture bit wrong. Now all OK, but still have a problem with the CGSmartImage causing an error.

Cheers


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: use CGSmartImage in news or cgblog summary or detail pag
PostPosted: Tue May 29, 2012 12:35 pm 
Offline
Forum Members
Forum Members
User avatar

Joined: Fri Sep 14, 2007 1:05 pm
Posts: 144
Location: South Derbyshire – UK
Hi

Having gone through the template again I decided to start from scratch and re installed all the modules.

It's now working!

Cheers


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
Display posts from previous:  Sort by  
Post new topic Reply to topic  [ 25 posts ]  Go to page Previous  1, 2

All times are UTC


Who is online

Users browsing this forum: No registered users


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Search for:
Jump to:  
Hosting Nation - Managed CMSMS Hosting