Horizontal Rule using CSS3 Gradient

Posted on by

I love all the little tricks you can perform with CSS 3. I saw this nice horizontal rule on MLSsoccer.com:

mls

The CSS is pretty simple:

hr {
	background: #ababab;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/
		Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9Ij
		EwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3Bl
		Y3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2
		VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5
		MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3
		RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBv
		ZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2FiYWJhYiIgc3RvcC1vcGFjaXR5PSIxIi
		8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0
		b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMC
		IgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ct
		Z2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(left,#ffffff 0%,#ababab 50%,#ffffff 100%);
	background: -webkit-gradient(linear,left top,right top,
		color-stop(0%,#ffffff),color-stop(50%,#ababab),color-stop(100%,#ffffff));
	background: -webkit-linear-gradient(left,#ffffff 0%,#ababab 50%,#ffffff 100%);
	background: -o-linear-gradient(left,#ffffff 0%,#ababab 50%,#ffffff 100%);
	background: -ms-linear-gradient(left,#ffffff 0%,#ababab 50%,#ffffff 100%);
	background: linear-gradient(to right,#ffffff 0%,#ababab 50%,#ffffff 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(
		startColorstr='#ffffff',endColorstr='#ffffff',GradientType=1);
	margin: 20px 0;
}

You can just swap the #ababab color for whatever color you’d like to change the gray, but of course that would not change out the encoded image. Personally, I would just get rid of the embedded image and let browsers that don’t support CSS gradients to use the fallback solid color.

LightSwitch

Posted on by

First of all, WOW!

I had heard about LightSwitch, but I always got that same vibe as I am sure everyone else did – that it was a bit of a “toy”. I never really got into the whole Silverlight LOB thing, so I did not really think tweice about LightSwitch. Plus the whole sepearate download thing…

As Michael Washington said in an interview when asked if LightSwitch was a bit too basic for the “hard core” developer:

It’s in Visual Studio, so if you aren’t already a person who would open up Visual Studio it is not the product for you.

That pretty much puts things into perspective.

I needed a reporting solution, and I wanted something fast and simple. I know I cannot give a report builder to a marketing person and say, “have at it!” They won’t understand the db schema, and I would just wind up building the report myself. I decided it was the right time to give LightSwitch a go, and man am I impressed!

With Visual Studio 2012 Update 2, LightSwitch 3 was released. Included in LightSwitch 3 is the ability to create HTML5 clients. It is pretty darned awesome! LightSwitch makes getting started simple, but if you want to dive-deep you can. I was able to take our db and throw together a couple of sample reports in minutes. I even made a couple more while demoing LightSwitch for my peers – it is just drop-dead simple. However, don’t let the simplicity fool you – there are plenty of hooks to get in deep.

LightSwitch uses jQuery mobile, so it can use all the cool jQuery stuff out there. Wijmo is building LightSwitch-specific implementations of their widgets that should be in beta soon, but you could just use the current Wijmo widgets with a little elbow grease.

I am so stoked to get to using LightSwitch. I was dreading making these reports, but now I am actually excited. It will be so easy to make them that it will actually be fun. Whodathunkit?

Resources

Wijmo

Posted on by

I just found out about Wijmo. Wijmo is a javascript widget library that utilizes jQuery, jQuery UI and knockoutjs. Using jQuery UI allows the widgets to be themed easily with any of Wijmo’s premium themes, the canned jQuery UI themes, or rolling your own with them roller.

Wijmo costs if you want to use it in a commercial application, but they do have an open source option that allows for use in GPLv3 projects.

OMGWTFIIS?!?!

Posted on by
scream and shout

I am working on some automation to allow a large zip file to be uploaded, extracted, parsed, etc. While working locally, things worked fine. Once I pushed to our dev server, it all fell apart.

The file is 30MB – I did not really think that was too large, but apparently there is a nice, hidden gem in IIS – an artificial limit of 30MB. It was driving me nuts because I could upload a bunch of other zip files, but not the one I needed to. That led me to think it had something to do with the size, and lo and behold that is it.

I found the magic google incantation to find a post on IIS7 file upload size limits. This post gives a great overview about the silliness that exists, and a nice site-level solution:

<system.webServer>
  <security>
    <requestFiltering>
      <requestLimits maxAllowedContentLength="524288000"/>
    </requestFiltering>
  </security>
</system.webServer>

A commenter outlines a solution using the IIS7 snap-in, but I am okay with the web.config method. For completeness, here are the steps:

  1. Open IIS7 snap-in
  2. Select the site to enable large file uploads
  3. Double click “Request Filtering” in the main window
  4. Right-click the dialog window and select “Edit Feature Settings”
  5. Modify the “Maximum allowed content length (bytes)

So, at least I got everything working, but I sure wasted a whole bunch of my time before I found this…

photo by: mdanys

EF and “dynamic” data

Posted on by

We use EF for our e-commerce website, and we have the need to get some data out in the form of reports. Ideally I’d like to be able to basically write up a report query and have the data come out on the other side. However, with EF it isn’t necessarily that simple.

I really don’t want to have to go through all the ceremony of creating models, mapping classes, services, etc. I’d like to keep it pretty simple with a service that can give me back the data I want, then I can use it in a Google Chart or a jQuery datatable or something on the client side. I want the server-side to be basic, and then I can focus on the client-side to give a rich report experience.

I did a quick search and came up with a couple of interesting options. The first is a way to dynamically query views. It sounds very interesting, but it looks like it isn’t quite what I am looking for. The post leaves things a little open-ended, but it looks like the views he is querying already have all the strongly-typed stuff needed and the code just performs dynamic queries against those static objects. I could be wrong though as there is not concrete example of how it is used, just the theory behind all the dynamic wackiness going on.

The next option looks a little more like what I am looking for – it returns a dynamic object using SqlQuery. The code in the post is a little verbose for my taste, but a commenter converted the code into an extension, and I like that idea a lot better. I put his code into a gist.

After looking into the options, I think that maybe the notion that I have to stick with EF is just holding me bock. I am very familiar with Massive and have used it and enjoy using it. It is a single class file, and maybe it is just the thing I need to get this report data out of my database easily – which is the idea behind Massive!

Coalesce operator basic example

Posted on by

There was some null checks for trimming that were added in our codebase like this:

if (model.SearchEmail != null)
    model.SearchEmail = model.SearchEmail.Trim();

A tiny bit “easier”* alternative would be to use the coerce operator:

model.SearchEmail = (model.SearchEmail ?? String.Empty).Trim();

It is a little less typing and a single line. I think it is still pretty obvious what you are trying to do, so if you like it, use it.

If you don’t already know about coalesce, it is basically “if the value is null, use this other value”. So in the above, if model.SearchEmail is null, then use String.Empty. Then, trimming String.Empty would return null. But, if model.SearchEmail has a value, it gets trimmed and everything works as expected.

If you are interested in more examples/info, check out this StackOverflow Q&A.

* I say “easier” because it is my preference for terse yet understandable code. It may not be your preference, and that is cool

WebAPI – Y U NO DELETE?!!

Posted on by

37098508

Ok, silliness aside, WTF? At first I thought I was going insane. After wasting about 20 minutes thinking it was my fault, I realized it had to be something else. Well, it turns out that, by default, IIS Express doesn’t handle PUT and DELETE. So it isn’t a WebAPI thing, it is an IIS Express thing, but it isn’t immediately obvious what the problem is.

A little googling, a little reading, and I stumbled upon this post that explains how to update IIS Express (as well as IIS proper):

  1. Open the IIS Express config file (located at C:\Users\\Documents\IISExpress\config\applicationhost.config)
  2. Find the key “ExtensionlessUrl-Integrated-4.0″
  3. Add PUT and DELETE to the “verb”
<add name="ExtensionlessUrl-Integrated-4.0" 
     path="*." 
     verb="GET,HEAD,POST,DEBUG,PUT,DELETE" 
     type="System.Web.Handlers.TransferRequestHandler" 
     preCondition="integratedMode,runtimeVersionv4.0" />

CodeRush with Refactor! Pro

Posted on by

I am stoked! I was finally able to get a CodeRush with Refactor! Pro subscription. I cannot wait to get started with it.

I was a long time CodeRush Xpress user, and I have to say for a free tool, CodeRush Xpress is pretty awesome. I remember doing some pair-programming a while back with one of my co-workers and he saw me use a refactor. He stopped me and said, “how’d you do that?” I showed him CodeRush Xpress and he was off to download his own copy.

A couple months back I was finally able to make the jump to VS 2012 from VS 2010. As much as I enjoyed CodeRush Xpress, there were some stability issues that I had with VS 2010, and I think Xpress contributed to those issues. I am a bit of an “extension junkie”, so I am not sure if it was a combination, or maybe it was just some other plugin entirely. I could be giving Xpress a bum rap, so please try it out for yourself. It is free after all…

When I started my 2012 adventure, I decided to scale back the extensions, but I really did miss CodeRush Xpress, so I finally worked out purchasing a Pro license. DevExpress customer service is awesome. I had some questions and concerns, and they were totally responsive and willing to work with me. Special thanks to Vache – I really appreciate it.

But don’t just take my word for it. From devlinliles.com, who’s post helped sway me towards getting a Pro license even though he ultimately chose ReSharper over CodeRush:

I completely agree on the support side of things. CodeRush has this nailed. I tweeted some problems and got *positively* bombarded with answers and resources. The support they offer is second to (none) with tooling out there.

So, my next adventure begins. I cannot wait to get started. I am sure I’ll have plenty of follow-up posts to rave about all the great features of CodeRush!
:)

SVG Patterns

Posted on by

SVG Patterns is a great site with many examples of using SVG patterns for backgrounds.

SVG patterns have the benefit of being scalable (they are vector graphics) while typically being smaller than bitmap graphics. They also are have more browser support than CSS3 gradients.

The site links to code samples for each pattern on Codepen so you can test them out, fork them and play with them, etc.

CSS3 Patterns

The idea behind SVG patterns was inspired by CSS3 Patterns, which is pretty cool.

Shortcodes in widgets

Posted on by

I just switched to this new theme, and I wanted to transfer over the customizations I made to the last theme. I was a WordPress n00b when I started the blog, and I did not initially use widgets. To transfer all my customizations over, I knew widgets would be the way to do it.

I have the Last.fm plugin, and I made mods to my sidebar.php file to include it before. All I needed to do this time was put the shortcode in a text widget, right? WRONG! I knew there had to be a way.

A quick google revealed this post on using shortcodes in widgets. It turns out it is super-simple, but does require editing the functions.php file. You simply add the following:

add_filter('widget_text', 'do_shortcode');