Jack Stephens' Geek Brochure: May 2009

Friday, May 22, 2009

Stackoverflow Flair without the image

Scott Hanselman tweeted about how cool it would be to have a Stackoverflow flair without a tje gravatar. This is my solution using CSS

<html>
<head>
    <title>Stack Overflow Flair Demo</title>
    <style type="text/css">
.valuable-flair
{
    background-color: #ffffff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    height: 50px;
    padding: 3px;
    width: 50px;
}
.gravatar
{
 display: none;
}

.valuable-flair .badge1
{
    color: #ffcc00;
}
.valuable-flair .badge2
{
    color: #c0c0c0;
}
.valuable-flair .badge3
{
    color: #CC9966;
}

</style>
</head>
<body>
<script src="http://stackoverflow.com/users/flair/3819.js?theme=none" type="text/javascript"></script>
</body>
</html>

Thursday, May 14, 2009

ASP.NET Cookieless sessions and JQuery AJAX

I was trying to get some jquery ajax calls to work after converting a site to cookie-less sessions (don't ask). I noticed the following code wouldn't work:

$.post("/bin/getsomedata.dll", {'id': id},
   function(data)
   {
       doSomething(data);
   }
);

I changed it to:

$.post("<%=Response.ApplyAppPathModifier("/bin/getsomedata.dll")%>", {'id': id},
   function(data)
   {
       doSomething(data);
   }
);

and all was groovy

I also noticed that when I turn off cookieless sessions, everything still works. It appears that Response.ApplyAppPathModifier() only alters the URL when I am in cookieless sessions

Thursday, May 07, 2009

Photoviewer

Today I needed to write a pop up form that would show any image without any extra IE (or Firefox, Chrome, Safari, etc.) toolbars, etc. To get a web form to display an arbitrary image, I have a simple page that takes the URL of the image in the query string. The web form takes that string and uses it to set ImageUrl of an asp.image control.

photoviewer.aspx:

<%@ Page Language="C#" EnableViewState="false" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">    private void Page_Load()
    {        string file = Request.QueryString["file"];
        if (file != null)
            myImage.ImageUrl = Server.UrlDecode(file);
    }
</script>
<html>
<head>
    <title>My Image Viewer</title>
</head><body>
    <form id="Form1" method="post" runat="server">
    <table style="border:0;">
        <tr>
            <td>
                <asp:Image runat="server" ID="myImage" EnableViewState="false" />
            </td>    
        </tr>
        <tr>
            <td>
                <input type="button" onclick="javascript: window.close();" 
                    value="close" />
            </td>
        </tr>
    </table>
    </form>
</body>
</html>

To get rid of extra browser features and to size the popup, I call window.open() I set the height and width to values that will ensure that I have enough room for the image (I can use to get the dimensions of an image and add some buffer around the image so the popup isn’t all picture). I suppress status, toolbar, menubar. Location and scrollbars by setting them all to “0”.

feature_win.js

// declared outside of the scope of the function so it will persist on the page:
var newWindow;
function featureWin(height, width, url)
{
    var lHeight = height;
    var lWidth = width;
    
    if (newWindow && !newWindow.closed) 
    {
      newWindow.close()
    }
    newWindow = window.open(url, null, 'height=' + height +  
       ',width=' + width + ',status=0,toolbar=0,menubar=0,location=0,scrollbars=0');
}

Here we put it all together.

default.html

<html>
<head>
    <title>Test My Image Viewer</title>
    <script type="text/javascript" src="feature_win.js"></script>
</head>
<body>
<a href="javascript: featureWin(825, 1050, 'photoviewer.aspx?file=Garden.jpg');">
    Garden</a>
</body>
</html>