Blog posts by Shamrez Iqbal

Blog posts by Shamrez Iqbal2014-12-18T20:17:31.0000000Zhttps://world.optimizely.com/blogs/Shamrez-Iqbal/ Optimizely World Adding StartPublishDate to PageTree tooltipIn my previous blog post I demonstrated how to customize the tooltip, but it turned out we needed to add the StartPublishDate property to the Tooltip, and it turned out that the item object in the javascript file did not contain this property, so time for some more hunting. episerver/cms/Stores/contentstructure/This time I started out in the network tab of F12 showing only XHRs. Looking at the different requests I noticed most of them looked very similar so I had to dig through the contents until I found a call containing PageData and I eventually I found one. <a href="/link/9d4bfd4a9f924311830d9d6759a909ce.aspx"><img title="image" style="border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px" border="0" alt="image" src="/link/d5bd441a8a164ca98108012ef3260ef0.aspx" width="770" height="330" /></a> Looking at the URL the data came from something called /Stores/contentstructure/ which ContentStructureStore is handling - which inherits from RestController. A new customization point was needed. Looking at how this REST-controller retrieved data I noticed that the data was is converted into Model objects using something called ContentStoreModelCreator. The ContentStoreModelCreator has a constructor which takes an enumerable of IModelTransform. This looked like a promising extension point, searching for implementers of this store I found PopulatePageDataModel. As in the previous post, I created a class inheriting from this class. What PopulatePageDataModel basically does is, it has an array of property names in an array, and tries using the weakly-typed way of retrieving this data. My class added the “PageStartPublish” to the array, and modified the TransformInstance method to use my collection instead. <pre class="language-csharp"><code> public class MyPopulatePageDataModel : PopulatePageDataModel { private static readonly string[] PropertyNames = new string[] { "PageLanguageBranch", "PageExternalURL", "PageChildOrderRule", "PageSaved", "PageChangedBy", "PageCreated", "PageChanged", "PageTypeID", "PageVisibleInMenu", "PageShortcutType", "PageShortcutLink", "PageLinkURL", "PageStartPublish" }; public override void TransformInstance(EPiServer.Core.IContent source, EPiServer.Cms.Shell.UI.Rest.Models.StructureStoreContentDataModel target, IModelTransformContext context) { PropertyDictionary properties = target.Properties; IContent content = source; foreach (string key in PropertyNames) { PropertyData propertyData = content.Property[key]; if (propertyData != null) properties.Add(key, propertyData.Value); } } }</code></pre> The next step was to Intercept it in IOC, but the PopulatePageDataModel is marked as a singleton so instead of saying InterceptWith(i=>new CustomPopulatePageDataModel()) the object is created once in the module and its called with InterceptWith(i=>MyCustomPopulatePageDataModel); <pre class="language-csharp"><code> private static void ConfigureContainer(ConfigurationExpression container) { MyPopulatePageDataModel model = new MyPopulatePageDataModel(); container.IfTypeMatches(type => type.Equals(typeof(PopulatePageDataModel))).InterceptWith(i => model); //Implementations for custom interfaces can be registered here. }</code></pre> There are better ways of implementing a singleton but for the sake of demo I did it in the module, it’s possible that it might be possible to define it some other way in StructureMap as well. Now, when looking at the javascript-object being sent to the getItemToolTip we can see that the PageStartPublish is available and can be added to the tooltip. <a href="/link/9be576fd26e74380b53a997c1c874917.aspx"><img title="image" style="border-left-width: 0px; border-right-width: 0px; background-image: none; border-bottom-width: 0px; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-top-width: 0px" border="0" alt="image" src="/link/79e5c0684d664e7eb72918860f16abee.aspx" width="670" height="378" /></a>2014-12-18T20:17:31.0000000Z

Blog post

Changing the tooltip in the Page TreeA customer wanted to show some more data in the page tree tooltip. This obviously meant extending the user interface in some way, but the first step was to figure out where the tooltip was set. <h1>Where Are You being made?</h1> We started digging in using the F12 tools in Chrome to figure out the where the tooltip was generated. <a href="/link/4ff2c928347f4372b8d3b004f036e5ea.aspx"><img title="clip_image002" style="background-image: none; display: inline" border="0" alt="clip_image002" src="/link/d3fdd9fb125645e0972daaae90d18f2a.aspx" width="244" height="56" /></a> We started by unpacking the clientresources archives and searched for the attach-points in the markup, such as “rowNode” but the files were minified so it was a hopeless task – and we got many matches. After looking at a page here on World, it turned out that there was a nuget package with the unminified debug version javascript files. After installing this package the they could be enabled by changing web.config the following way: <pre class="language-csharp"><code><episerver.framework> <clientResources debug="true" /> . . . </episerver.framework></code></pre> <style type="text/css"> .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } </style> An interesting thing was that this seems to work regardless of installing the nuget package. Things got slightly easier and we eventually figured out that the tooltip was being set in \epi-cms\component\PageNavigationTree.js <pre class="language-csharp"><code> getTooltip: function (item) { // summary: // Overridden function to select data for the tooltip // tags: // public, extension //We create a content reference and use the id to hide the provider key for the user. var reference = new ContentReference(item.contentLink), baseTooltip = this.inherited(arguments); return baseTooltip + ", " + headingResources.id + ": " + reference.id + " (" + headingResources.type + ": " + item.contentTypeName + ")"; },</code></pre> <h1>Where can we fix you?</h1> The next task was figuring out how to change this, One way to fix it would be to modify the js directly in the zip but that change would be lost the minute a new nuget package was available – which meant about 2 weeks. An extension point was needed, and after lots more digging we found one <pre class="language-csharp"><code>this.contentRepositoryDescriptors = this.contentRepositoryDescriptors || dependency.resolve("epi.cms.contentRepositoryDescriptors"); var settings = this.contentRepositoryDescriptors[this.repositoryKey]; var componentType = settings.customNavigationWidget || "epi-cms/component/ContentNavigationTree";</code></pre> <style type="text/css"> .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } </style> Using F12 debugging we figured out the values in settings-object which came from a a contentRepositoryDescriptor the RepositoryKey was set to “pages”, and the extensionpoint would be settings.customNavigationWidget. Now, the hard part was to figure out how to set the customNavigationWidget, we looked at creating Components, ContentDescriptors, ContentRepositories and eventually found a class called PageRepositoryDescriptor which was where the settings-data came from. <h1>How can we fix you?</h1> There are four classes which inherit from ContentRepositoryDescriptorBase and they are all registered in StructureMap using the ServiceConfiguration-attribute. And they are exposed as an enumerable. We started by adding our own class which inherited PageRepositoryDescriptor and changed the customNavigationWidget setting   <pre class="language-csharp"><code>public class OurDescriptor : PageRepositoryDescriptor { public override string CustomNavigationWidget { get { return "alloy/widget/foo"; } } }</code></pre> <style type="text/css"> .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; }</style>   We tried adding the serviceconfiguration attribute to this but this broke the application because the Key-property wasn’t unique so what we instead wanted the container to do was to provide our implementation each time PageRepositoryDescriptor was requested. This was achieved by creating a configurationModule   <pre class="language-csharp"><code>[InitializableModule] [ModuleDependency(typeof(EPiServer.Web.InitializationModule))] public class DescriptorInitialization : IConfigurableModule { public void ConfigureContainer(ServiceConfigurationContext context) { context.Container.Configure(ConfigureContainer); } private static void ConfigureContainer(ConfigurationExpression container) { container.IfTypeMatches(type => type.Equals(typeof(PageRepositoryDescriptor))).InterceptWith(i => new OurDescriptor ()); } }</code></pre> <style type="text/css"> .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; }</style>   Building and testing this was a success and there was a request to alloy/widget/foo which we now had to implement. The following lines were added to modules.config <pre class="language-csharp"><code><clientResources> <add name="alloy.widget.foo" path="Scripts/foo.js" resourceType="Script" /> </clientResources></code></pre> <style type="text/css"> .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; }</style> And finally a the javascript file called foo.js We started with a copy and paste of the existing ContentNavigationTree, but all methods except the tooltip method was removed, the define function was changed, and ContentNavigationTree was added as a dependency and provided as the base class for this component (first parameter in declare(..) )   <pre class="language-csharp"><code>define("alloy/widget/foo", [ // dojo "dojo/_base/array", "dojo/_base/connect", "dojo/_base/declare", "dojo/_base/lang", "dojo/dom-class", "dojo/topic", "dojo/when", // epi "epi/dependency", "epi/string", "epi/shell/ClipboardManager", "epi/shell/command/_WidgetCommandProviderMixin", "epi/shell/selection", "epi/shell/TypeDescriptorManager", "epi/shell/widget/dialog/Alert", "epi/shell/widget/dialog/Confirmation", "epi-cms/_ContentContextMixin", "epi-cms/_MultilingualMixin", "epi-cms/ApplicationSettings", "epi-cms/contentediting/PageShortcutTypeSupport", "epi-cms/command/ShowAllLanguages", "epi-cms/component/_ContentNavigationTreeNode", "epi-cms/component/ContentContextMenuCommandProvider", "epi-cms/contentediting/ContentActionSupport", "epi-cms/core/ContentReference", "epi-cms/widget/ContentTree", "epi-cms/component/ContentNavigationTree", "epi/shell/widget/ContextMenu", // resources "epi/i18n!epi/cms/nls/episerver.cms.components.createpage", "epi/i18n!epi/cms/nls/episerver.cms.components.pagetree", "epi/i18n!epi/cms/nls/episerver.shared.header" ], function ( // dojo array, connect, declare, lang, domClass, topic, when, // epi dependency, epistring, ClipboardManager, _WidgetCommandProviderMixin, Selection, TypeDescriptorManager, Alert, Confirmation, _ContentContextMixin, _MultilingualMixin, ApplicationSettings, PageShortcutTypeSupport, ShowAllLanguagesCommand, _ContentNavigationTreeNode, ContextMenuCommandProvider, ContentActionSupport, ContentReference, ContentTree, connavtree, ContextMenu, // resources resCreatePage, res, headingResources ) { return declare([connavtree], { // summary: // Light weight Page tree component. // description: // Extends epi.cms.widget.PageTree to provide global messaging capability. // tags: // internal xproduct getTooltip: function (item) { // summary: // Overridden function to select data for the tooltip // tags: // public, extension //We create a content reference and use the id to hide the provider key for the user. var reference = new ContentReference(item.contentLink), baseTooltip = this.inherited(arguments); return baseTooltip + ", " + headingResources.id + ": " + reference.id + " (" + headingResources.type + ": " + item.contentTypeName + ")" + "Changed: " + item.changed; } }); });</code></pre> <style type="text/css"> .csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; }</style>   And now the tooltip shows the changed date of the page as well.2014-12-16T11:04:53.0000000Z

Blog post

Updated content not showing in browsers<h3>Why isn’t the page updated </h3> This is a question I’ve got from editors from time to time and usually the answer has been try Ctrl-R or Ctrl-F5 in the browser and see if that helps, which usually does the trick but one cannot expect all visitors of a web page to do this in order to see updated content. The problem <pre class="language-csharp"><code><link href="StyleSheet.css" rel="stylesheet" /> <script src="site.js"></script> <script type="text/javascript"> $(function () { bar(); // from site.js }); </script> </head> <body> <form id="form1" runat="server"> <div class="foo"> Text with class foo </div> <EPiServer:Property runat="server" PropertyName="vppimage"></EPiServer:Property> <img src="/image.jpg" /> </form> </body> </code></pre> <style type="text/css">.csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } </style><style type="text/css">.csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } </style> Which renders something like this in a browser and all is well <a href="/link/b18b5ecf128c466a94c6fd59cef9931b.png"><img title="clip_image002" style="display: inline; background-image: none;" border="0" alt="clip_image002" src="/link/0525a3cf0ef14c0f9f68bbe9083c6d1c.png" width="343" height="254" /></a> And looking in fiddler for the requests being made first time the page is visited <a href="/link/b86e844853494cccb5c340cd5892939e.jpg"><img title="clip_image004" style="display: inline; background-image: none;" border="0" alt="clip_image004" src="/link/ff1c7a0278cc4c009392998b654983da.jpg" width="551" height="84" /></a> The green colored requests are fired first time, while the red request is if click in the address bar and press enter and the blue request is after closing the browser, and pasting in the address to the page and opening it again. Note that neither the blue or red requests retrieve the js,css or vpp file again since the initial requests ensured that the content is cached on the browser. Now we have four assets on the page, an image a stylesheet, a javascript and an image stored in VPP. Let’s see what happens when we update all four of them. <a href="/link/582ea7242d3f4a84abb3eb67ec2ba26b.png"><img title="clip_image005" style="display: inline; background-image: none;" border="0" alt="clip_image005" src="/link/9ec37d65c5a948528fc98f58e24125e2.png" width="403" height="350" /></a> The script fires with an alert, with the text ‘hello v4’, but neither the image nor the text styling is updated Again looking in fiddler the orange request is the only one fired. <a href="/link/ce746f95265d48a8aa07f94f77ae88ad.jpg"><img title="clip_image007" style="display: inline; background-image: none;" border="0" alt="clip_image007" src="/link/4337d7c936d44eeaad6b492ae1d5121a.jpg" width="443" height="28" /></a> If however ctrl-R (reload) is pressed in Firefox everything is updated <a href="/link/04a57b75be8e4d7bb96f0a67a0048ab8.png"><img title="clip_image008" style="display: inline; background-image: none;" border="0" alt="clip_image008" src="/link/aeb1876ae2e54390877297efcaad118e.png" width="364" height="319" /></a> This might be fine for certain situations but there are times when this doesn’t seem to be an option, so we can either ask the visitor/editor to wait 24 hours for the content to expired from the cache or ask them and the visitors to press reload after visiting the page. <h3>What is causing the problem</h3> The reason for this happening is that the server is saying that the content can be cached for a certain amount of time – and that is about it – the browser is not receiving any further instructions and will not care until the cache has expired. <a href="/link/7380f858cb454719869d997ba1168cb5.png"><img title="clip_image009" style="display: inline; background-image: none;" border="0" alt="clip_image009" src="/link/e30fd36b02d1402984d89f753bdcb612.png" width="356" height="283" /></a> <h3>The solution</h3> Disclaimer: this might not be the best or correct solution but it seems to work. What we need to do is tell the browser to always check that its local cache is valid. In web.config one has to add cacheControlCustom="no-cache,must-revalidate" <pre class="language-csharp"><code><staticContent> <clientCache cacheControlMode="UseMaxAge" cacheControlMaxAge="1.00:00:00" cacheControlCustom="no-cache,must-revalidate" > </clientCache> </staticContent> </code></pre> <style type="text/css">.csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; } </style> What this ensures is that the server will tell the browser that it must validate its cache with the server before displaying it to the user. Note that things won’t immediately work for browsers which have already cached the content but when that content has expired or Reload is pressed the new responses from the server will contain the desired instructions. If we look at fiddler the green requests is the initial request <a href="/link/4a6d3b0743e647728f71826cd566dfec.jpg"><img title="clip_image011" style="display: inline; background-image: none;" border="0" alt="clip_image011" src="/link/38a9abbe1d574adbba5e19da3d78dd4b.jpg" width="554" height="148" /></a> The purple requests is when I press the address bar and click enter. And the orange requests is after having updated one of the assets – the image.jpg which then causes it to refresh and retrieve the content. The browser now sends the IF-* headers to verify the content with the server. <a href="/link/a2ca5cd1696a40e68b51eda0333d4358.png"><img title="clip_image012" style="display: inline; background-image: none;" border="0" alt="clip_image012" src="/link/32ab9eeae2754958bc6b83eac758bde3.png" width="549" height="113" /></a> And the response from the server <a href="/link/73ab2fdbe667459fbfdcfa73936b6ae1.png"><img title="clip_image013" style="display: inline; background-image: none;" border="0" alt="clip_image013" src="/link/9dd1461891db459995131a3c9cc7bf1c.png" width="541" height="170" /></a> You can see that the Etag value differs from the request If-None-Match value and thus new content is retrieved. In my opinion the web.config change should be included in web.config before launching any site and then you can increase the cache expiration values to increase long term page speed. 2013-11-12T10:20:16.0000000Z

Blog post

Fileupload-gadget<h2>Introduction</h2> This is a gadget which hosts a Silverlight-application, with the purpose of uploading files to EPiServer. Almost every day in the life of a developer the following happens- you’ve had a meeting/workshop with your client (of the suspicious kind), with offices in a shady back ally in a country nobody but a bunch of professors in geography have heard about, So anyways, you have a need to store the documents from the meeting and other artifacts in a safe place (while you’re out partying), and what place is better than EPiServer? Obviously you suspect the client’s wireless network to have sniffing mechanisms which will sniff out all your passwords on Google Docs and VPN probably won’t work. So you log in to Episerver, upload the files there. But there’s still the risk of password sniffers,sniffing out the cms password, but hey, we have to choose the lesser of two evils :-) Anyways, initially I was thinking that an entry like this should be qualified for disqualification due to the fact that some part of it is made in Silverlight. But then contributions came and lo, they were all using some sort of external system. <h2>Technical details and process</h2> In the beginning just for prototyping, I tried SWFUpload, which didn’t work as intended with general asp.net mvc. I then turned to a Silverlight-based solution. But generally speaking the gadget is just a bunch of projects which others have made and glued together using HyperGLUE-technology (so advanced so complex, i won’t even tell you what it is!)  into a gadget (and inspired by other gadgets) These include 1. <a href="http://slfileupload.codeplex.com/">Silverlight Multi File Uploader (using WCF)</a> 2. <a href="https://www.coderesort.com/p/epicode/wiki/FolderBrowserProperty">Folder Browser Property (Marcus  Lindblom)</a> - Meridium AB As suggested in “Introduction to gadget development” the gadgets can be stored in the Modules but looking at other gadgets and seeing that the controller tries to look for the views in the root “Views” folder on the website. In order to make the folder browser work properly I had to use the same approach but I’m not too fond of it since can risk overwriting setting/files from other gadgets b: referring to javascript/aspx files in the gadget markup will be repeated many times over which might not be a good practice. And initially I thought the gadget would be quite easy to create and even if the views are almost empty I tried a lot of things to make the different aspects of the gadget to work together. <h2>Features</h2> Some features · Select and upload multiple files · Automatically overwrite (I think) the files if they already exist · WCF- even bigger config files · Ability to configure a standard folder always set (might be handy) · Support for VersioningFileSystem and Nativefilesystem Screenshots <a href="/link/3504a4e501eb404aa1ae3fb4f2d2f096.jpg"><img style="border-right-width: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="sccren1" border="0" alt="sccren1" src="/link/44e59fecfb4f4287837c56b08c1fed76.jpg" width="244" height="166" /></a> <a href="/link/abd33b8645e6456983b55b5f07f6efbe.jpg"><img style="border-right-width: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="screen2" border="0" alt="screen2" src="/link/517b7884dae542c0b23221f6d2a96ffb.jpg" width="244" height="166" /></a>  <a href="/link/078377a24448468b8de2590c72495ad4.jpg"><img style="border-right-width: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="screen3" border="0" alt="screen3" src="/link/823236b1e2134d2ca43a7535306399dc.jpg" width="244" height="57" /></a> <h2>Download</h2> <div style="padding-bottom: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; display: inline; float: none; padding-top: 0px" id="scid:fb3a1972-4489-4e52-abe7-25a00bb07fdf:f7568e17-53d3-4a03-a850-eda3b4af9667" class="wlWriterSmartContent"> <a href="/link/b226a03e7d6f40b5a6bb396585578dfb.zip" target="_blank">Source</a> <a href="/link/fcd4ea0a5efb4d9ba8b138dc764a6ede.zip" target="_blank">Episerver Package</a> </div>   <h2>Installation</h2> If you prefer to install it manually: 1. build and copy the folders to the root level of the site. 2. add the following things to web config   inside this node : “<episerver.shell>  <modules autoDiscovery="Minimal">”   add <add name="UploadGadget">     <assemblies>       <add assembly="MultiFileUploadGadget1" />     </assemblies>   </add> inside this node: <system.servicemodel><services> add <service behaviorConfiguration="UploadServiceBehavior" name="mpost.FileUploadServiceLibrary.UploadService">       <endpoint address="" binding="customBinding" bindingConfiguration="binaryBinding" contract="mpost.FileUploadServiceLibrary.IUploadService" >         <identity>           <dns value="localhost"/>         </identity>       </endpoint>       <endpoint address="mex" binding="mexHttpBinding" contract="IMetadataExchange" /> </service>   inside this node: <system.serviceModel><behaviors><serviceBehaviors> add:   <behavior name="UploadServiceBehavior" >           <serviceMetadata httpGetEnabled="true"/>           <serviceDebug includeExceptionDetailInFaults="true"/>         </behavior>   inside this node: <system.serviceModel><bindings><customBinding> <binding name="binaryBinding" ">          <binaryMessageEncoding maxReadPoolSize="2147483647" maxSessionSize="2147483647" maxWritePoolSize="2147483647"  />          <httpTransport maxReceivedMessageSize="2147483647" maxBufferSize="2147483647" />        </binding> Extra settings which might be required  also, if you do not have  the handler for .svc files you might need to add something like (for IIS7.x) in <system.webserver><handlers>   <add name="svchandler" path="*.svc" verb="*" type="System.ServiceModel.Activation.HttpHandler, System.ServiceModel, Version=3.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089" preCondition="integratedMode" /> small update: This should be added before other handlers have a chance to handle the extension. and finally serviceHostingEnvironment aspNetCompatibilityEnabled="true" /> inside the <system.servicemodel> tag I haven’t added this tag as part of the installation package since there isn’t any “key-attribute” to verify if the tag already exists so you need to add it manually in case it isn’t there.     You’ll have to google for the IIS6 settings.   Disclaimer During development of this and testing some VersioningFIleSystem methods I managed to wreck the filesystem. I recommend NativeFilesystem for testing. And as mentioned, existing files will most likely be overwritten.2009-11-26T07:49:47.0000000Z

Blog post

FindPagesWithCriteria GadgetMy contribution to the Gadget Contest is a gadget for doing findpageswithcriteria-calls. I haven’t done asp.net MVC coding before this so it was a new and interesting experience. Some points of interest – although the introduction to gadgets article talks about extension-methods for htmlhelper-classes it seems like you do not get Intellisense in the views. Did also experience that the Intellisense was working but the Html-helper wasn’t available.   <a href="/link/55c19780430042c7b4744ffea983a1f4.jpg"><img style="border-right-width: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="screen1" border="0" alt="screen1" src="/link/0b8679b57e424730b59c4ea47b1e6877.jpg" width="244" height="72" /></a> Screenshot of criteria builder    <a href="/link/ef2ebb8ca73d4553b0d7bb64b7bb4bbb.jpg"><img style="border-right-width: 0px; display: inline; border-top-width: 0px; border-bottom-width: 0px; border-left-width: 0px" title="screen2" border="0" alt="screen2" src="/link/9aba84e3731e4a32ab5d8c9c35694973.jpg" width="244" height="65" /></a>  The magnificent result-view   Some further things which could be added and would be make the gadget more editor friendly:   <ul> <li>Using the Dynamic Data Store to save searches </li> <li>Using Reflection (possibly?) to determine the valuetype automatically </li> <li>Possibility to select where to start searching </li> <li>Validation and friendly feedback for errors</li> <li></li> <li></li> </ul>           Installation instructions (hope it works for you)   1. add this to web.config <modules autoDiscovery="Minimal">     <add name="FindPages">         <assemblies>             <add assembly="FindPages"/>         </assemblies>     </add> </modules> under the episerver.shell tag 2. unpack the zip file to your episerver ctp site, open and build the project 2. add gadget to the page 3. rule the world?   <div style="padding-bottom: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; display: inline; float: none; padding-top: 0px" id="scid:fb3a1972-4489-4e52-abe7-25a00bb07fdf:ff4d2fd0-4da3-4dc7-8f60-b9ec1b600506" class="wlWriterEditableSmartContent">Source and project files <a href="/link/b4f6af116a6645048b01c2a754f1d067.zip" target="_blank">Source and project files</a></div>2009-10-27T18:38:29.0000000Z

Blog post

Making Asp.net Ajax services and IIS6/CMS5/(2003) work.In the process of migrating a site I encountered a strange problem with asp.net ajax services. As you all probably are aware - there are two common approaches for running ajax in asp.net. <ul> <li>UpdatePanel </li> <li>Webservices callable from javascript </li> </ul> When the latter approach is used, the methods and class have to be decorated with the ScriptService and ScriptMethod attributes. This in turn makes it possible to access the javascript-version of the services by accessing example.asmx/js or example.asmx/jsdebug. In the CMS5 site I got 404s when trying to access those Urls for a service. After some testing and trying I found a solution. CMS5 sites are – at least in IIS6 – configured with a wildcard application mapping handler. Having this handler one should assume that everything is caught and handled by this. But not so for the /js and /jsdebug urls. The solution was to add an explicit handler for asmx pointing to the isapi-dll which is used in the wildcard part. I would like to add a screenshot for this but it didn’t work publishing images to the blog so I’ll have to explain manually and perhaps conform to WCAG :-)   <a href="/link/5555a2fb99a14809b7e3a53375ca6e8c.jpg"><img style="border-bottom: 0px; border-left: 0px; display: inline; border-top: 0px; border-right: 0px" title="screenie" border="0" alt="screenie" src="/link/f0058e8c8cb34bacb8b4abb6c142d311.jpg" width="244" height="144" /></a> this can be done from the “Home Directory”-tab in site properties. Press the Configure button and add a new mapping there with extension .asmx. Most likely the cause of this is a bug in the wildcard application mapping system.2009-05-27T09:37:16.0100000Z

Blog post

Problems with access rights to VPP in a load balanced enviromentSome weeks ago after installing Cms5 in a load balanced enviroment a problem surfaced with access rights to the VPP-folders. The vpp files for the site was on a fileshare on a seperate server,  and after installing a site on the first webserver, we copied the files to the other server, did some web.config changes,  but the site did not work, and the error message (i do not recall the exact error message now) pointed to the VPP filepath. After some reflection and creating a page which simulated the vpp-behaviour we discovered that while one server had access rights to the vpp-files on the other server, but the second webserver didn’t have access rights to it. We had to use <a href="http://setacl.sourceforge.net/">SetAcl</a> to fix the permissions for this problem but it turns out that the installer sets explicit ntfs-permissions on the vpp-folder. We didn’t experiment with running the installer on the webserver causing problems and its possible that it would not work because of the explicit permissions being set by the installer (they might be replaced on consecutive installs).2008-10-07T10:49:13.1570000Z

Blog post

Security issue? - Editors remain logged in after logging out in Episerver 5 enterprise installationsRecently, after migrating an enterprise site from v4 to v5 I discovered a potential security issue in v5. In v4 if an enterprise site had foo.com and bar.com then foo.com/mytemp.aspx?id=100 and bar.com/mytemp.aspx?id=100 would show the same page and i suppose this also was the reason that once you were logged in to a site all site were accesible in edit-mode. The same also applied to simple addresses for pages. I.e. foo.com/foo and bar.com/foo would result in the same page being shown. In V5 the friendly url functionality is rewritten and the “cross-domain” addresses do not work. This has an interesting consequence when working in edit-mode. Whenl logging in to edit-mode for foo.com, and clicking on the node for bar.com this pops up the login box. For some of the editors this can be a really annoying thing because of their workflow with publshing to many sites in a short time. But the real security issue is that after logging out from the edit mode interface, the editor will remain logged in on foo.com. I have tested this behaviour on a test site running r1 sp3. I suppose the only fix for this at the moment is awareness of this behaviour. 2008-10-07T10:19:58.6600000Z

Blog post

p-tags showing upRecently one of our customers had a problem with p-tags appearing on a page. I've bumped into similar issues and discussed the problem with Steve Celius on #epicode, and concluded that if all buttons in the editor of a field are turned off, <episerver:property /> will then render the tags with html entities meaning that instead of the tags being processed, they'll actually just be shown on the page as-is. I logged into the site and all the buttons for the property were turned of so it should generate any tags and i tried and tested things and no tags were generated. After some further discussion with other people in #epicode, among them erik- and asthiss, i realized that the problem was caused by the fact that some webeditors had enabled All functions available in the Editor under Permissions for Functions What happened then was that the property would show as a html-property for the some editors - inserting html tags, but when other editors accessed the property, it would show as plain text with tags. The solution to the problem was to use <%= CurrentPage["PropertyName] %> in the page to force the property to process and render the html. 2008-09-05T09:58:08.0000000Z

Blog post