Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support for presets in addition to manual/individual width param #2

Open
wants to merge 5 commits into
base: master
Choose a base branch
from
Open

Support for presets in addition to manual/individual width param #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
13a68b2
Switched to use IISExpress
MarcStoecker Jul 25, 2013
1da4d7a
Added support for 'prest='
MarcStoecker Jul 25, 2013
9f51409
Added support for 'preset='
MarcStoecker Jul 25, 2013
0949455
Merge branch 'master' of https://github.com/esn303/slimresponse
MarcStoecker Jul 25, 2013
83d3e32
updated info on width/preset param
MarcStoecker Jul 25, 2013
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 16 additions & 2 deletions plugin/FilterModule/MarkupParser.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ public MarkupParser(System.Text.Encoding encoding)
this.TextEncoding = encoding;
}

public string TransformImgToPicture(string content)
public string TransformImgToSlimmage(string content)
{
try
{
Expand All @@ -41,6 +41,20 @@ public string TransformImgToPicture(string content)
if ((src != null && src.Value.IndexOf("slimmage=true", StringComparison.InvariantCultureIgnoreCase) > -1)
|| (cls != null && cls.Value.IndexOf("slimmage", StringComparison.InvariantCultureIgnoreCase) > -1))
{
// - if no width set with querystring param, but preset name, get the width from the preset
if ((src.Value.IndexOf("width=", StringComparison.InvariantCultureIgnoreCase) == -1)
&& (src.Value.IndexOf("preset=", StringComparison.InvariantCultureIgnoreCase) > -1))
{
// - get presets from config
var configSection = WebConfigurationManager.GetSection("resizer") as ImageResizer.ResizerSection;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we're depending on ImageResizer.ResizerSection anyway, it's probably better to just call Config.Current.getConfigXml().queryFirst("presets") so we don't miss elements with case variations. ImageResizer has case-insensitive configuration, unlike the .NET XML library. Copy/paste from https://github.com/imazen/resizer/blob/master/Core/Plugins/Basic/Presets.cs if you want.

ImageResizer also supports the semicolon syntax, not just querystring, so using new Instructions() to parse will enable that. Instructions.Width will return either 'width' and 'w', but not 'maxwidth'. instructions.Get<int>("maxwidth") lets you access that.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the heads up with the semicolon separated instructions! Will fix that.

XmlElement conf = configSection.getCopyOfNode("presets").ToXmlElement();
// - find preset by name
XmlNode curpreset = conf.SelectSingleNode(string.Format("preset[@name='{0}']/@defaults", System.Web.HttpUtility.ParseQueryString(src.Value.Substring(src.Value.IndexOf("?")))["preset"]));
string presetWidth = System.Web.HttpUtility.ParseQueryString(curpreset.InnerText)["width"];

// - append presets's default width to querystring
src.Value = string.Format("{0}&width={1}", src.Value, presetWidth);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's probably best to expand the quality and format variables as well so those optimizations can take effect as well.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe using just the whole preset string is an option? But any params that are image size related would surely prove difficult then. We could also just with these to additional params for now and have a first version shipped. We can always improve later on, right?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Now that slimmage supports height, perhaps we can just apply the preset client-side as if it were server side? No item-specific logic? Perhaps check the preset xml itself for an enabling flag, like 'applyWithSlimResponse'?

}

// - append fallback image
HtmlNode container = doc.CreateElement("noscript");
Expand All @@ -62,7 +76,7 @@ public string TransformImgToPicture(string content)
}
catch(Exception ex)
{
Trace.TraceWarning("SlimResponse failed to parse HTML: " + ex.ToString() + ex.StackTrace);
Trace.TraceWarning("SlimResponse failed to parse HTML: {0} {1}", ex.ToString(), ex.StackTrace);
// - better that nothing(tm) ...
//return content;
return ex.ToString();
Expand Down
2 changes: 1 addition & 1 deletion plugin/FilterModule/SlimResponseModule.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ private void RegisterMarkupFilter(object sender, EventArgs e)
{
var parser = new MarkupParser(response.ContentEncoding);
var filter = new ResponseFilterStream(response.Filter);
filter.TransformString += new Func<string, string>(parser.TransformImgToPicture);
filter.TransformString += new Func<string, string>(parser.TransformImgToSlimmage);
response.Filter = filter;
}

Expand Down
5 changes: 3 additions & 2 deletions plugin/SlimResponse.sln
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,9 @@ Microsoft Visual Studio Solution File, Format Version 12.00
# Visual Studio 2012
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "SlimResponse", "SlimResponse.csproj", "{E8729ED7-063B-4EA4-BD37-FE9070037FB2}"
EndProject
Project("{E24C65DC-7377-472B-9ABA-BC803B73C61A}") = "www", "..\www\", "{51398F46-7C7C-43DB-A4C3-3E9BBB470F9F}"
Project("{E24C65DC-7377-472B-9ABA-BC803B73C61A}") = "www(5)", "http://localhost:50940", "{51398F46-7C7C-43DB-A4C3-3E9BBB470F9F}"
ProjectSection(WebsiteProperties) = preProject
UseIISExpress = "true"
TargetFrameworkMoniker = ".NETFramework,Version%3Dv4.5"
ProjectReferences = "{e8729ed7-063b-4ea4-bd37-fe9070037fb2}|Imazen.SlimResponse.dll;"
Debug.AspNetCompiler.VirtualPath = "/www"
Expand All @@ -21,7 +22,7 @@ Project("{E24C65DC-7377-472B-9ABA-BC803B73C61A}") = "www", "..\www\", "{51398F46
Release.AspNetCompiler.ForceOverwrite = "true"
Release.AspNetCompiler.FixedNames = "false"
Release.AspNetCompiler.Debug = "False"
VWDPort = "50940"
SlnRelativePath = "..\www\"
EndProjectSection
EndProject
Global
Expand Down
2 changes: 1 addition & 1 deletion readme.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ or for "slimmage=true" in any image URL
<img src="image.jpg?width=150&slimmage=true" />
```

**Slimmage requires "width=[number]" be present in the URL. This value specifies the image size when javascript is disabled, but is modified by slimmage.js under normal circumstances.**
**Slimmage requires "width=[number]" be present in the URL. This value specifies the image size when javascript is disabled, but is modified by slimmage.js under normal circumstances. If you prefer to use ImageResizer presets, you can omit the width parameter if your specified preset provides a width.**


It then adds the appropriate markup to allow [slimmage.js](https://github.com/imazen/slimmage) to turn them into responsive images.
Expand Down
Binary file modified www/bin/Imazen.SlimResponse.dll
View file
Open in desktop
Binary file not shown.
26 changes: 22 additions & 4 deletions www/index.aspx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,18 @@
font-weight:normal;
}

h2
{
font-size:1em;
font-weight:normal;
}

h4
{
font-size:0.75em;
font-weight:normal;
}

.autoscale-width
{
max-width:100%;
Expand Down Expand Up @@ -47,13 +59,19 @@

<body>
<div>
<div>
<h1>
SlimResponse, ImageResizer, & Slimmage
SlimResponse, ImageResizer & Slimmage for resource friendly responsive images
<iframe src="http://ghbtns.com/github-btn.html?user=imazen&repo=SlimResponse&type=fork&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="150" height="30"></iframe>
</h1>

<img src="sample.jpg?width=200&format=jpg&quality=90&slimmage=true" class="autoscale-width" alt="sample"/>

<h2>Works with both, preset or width parameters which results in the same image rendered here by javascript enabled clients.</h2>

<h4>Image with initial <em>width=100</em>, no preset</h4>
<img src="sample.jpg?width=100&format=jpg&quality=90&slimmage=true" class="autoscale-width" alt="sample"/>

<h4>Image with <em>preset=sample</em>, that has a default initial width of 800</h4>
<img src="sample.jpg?preset=sample&format=jpg&quality=90&slimmage=true" class="autoscale-width" alt="sample"/>

<p>Stuttgart, Germany (<a href="http://www.flickr.com/photos/jan_ortmann/7147983853/">Photo by jojonks via Flickr</a>)</p>
</div>
</body>
Expand Down
11 changes: 7 additions & 4 deletions www/web.config
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,12 @@
<diagnostics enableFor="Localhost"/>
<!-- AllHosts, None -->
<plugins>
<add name="DiskCache"/>
<!-- requires Performance Bundle (licence) -->
<add name="DiskCache" /> <!-- requires Performance Bundle (licence) -->
<add name="Presets" /> <!-- Free bundle -->
</plugins>
<presets onlyAllowPresets="false">
<preset name="sample" defaults="width=800&amp;quality=90" settings="format=jpeg" />
</presets>
</resizer>
<!--
For a description of web.config changes for .NET 4.5 see http://go.microsoft.com/fwlink/?LinkId=235367.
Expand All @@ -22,12 +25,12 @@
<system.web>
<customErrors mode="RemoteOnly"/>
<compilation debug="true" targetFramework="4.5"/>
<!-- This is for IIS5, IIS6, and IIS7 Classic, and Cassini/VS Web Server
<httpModules>
<!-- This is for IIS5, IIS6, and IIS7 Classic, and Cassini/VS Web Server-->
<add name="ImageResizingModule" type="ImageResizer.InterceptModule"/>
<add name="SlimResponseModule" type="Imazen.SlimResponse.SlimResponseModule, Imazen.SlimResponse"/>
</httpModules>
<pages controlRenderingCompatibilityVersion="3.5" clientIDMode="AutoID"/>
-->
</system.web>
<system.webServer>
<modules runAllManagedModulesForAllRequests="true">
Expand Down