PACE OF CHANGE AND DEBUGGING BOOKS

June 21, 2014 knarfalingus 2 Comments

I started reading the book “Pro AngularJS” written by Adam Freeman. This book was published on April 1st 2014. I’ve read Freeman’s books before (Pro ASP.NET MVC X) and found them to be informative.

I followed the instructions in Chapter 1 for “How Do You Set Up Your Development Environment”, which basically entails using nodejs as a simple web server for hosting your angular and bootstrap files.

So I install node, install the connect module, copy in the simple server.js code shown here:

var connect = require('connect');

connect.createServer(
    connect.static("../angularjs")

).listen(5000);

I run node server.js and I get “TypeError: Object function createServer(), has no method ‘static’”

Well, after a bit of investigation, it appears that the connect module has been reorganized, the author most likely used version 2.x, but looking at the connect module release history, version 3.0 was released on 5/29/2014. In fact the release candidate for 3.0 first appeared to be published in March, so that explains why the book doesn’t use the newer version.

To fix so it works with v3.0 of the connect module, also install the module ‘serve-static’ using the command

npm install serve-static

The replacement code that works is as follows:

var connect = require('connect')
var serveStatic = require('serve-static')

var app = connect();

app.use(serveStatic('../angularjs'));

app.listen(5000);

Alternatively, you can install an older version of connect. Looking over the history indicates that 2.13.0 would most likely be the best choice.

npm install connect@2.13.0

So far I’ve learned a bit about node, installing older versions of packages and the changes to the connect module without even reading much of the book 🙂

Hopefully the rest of the examples in the book run with less research!

TypeScript, WordPress

TYPESCRIPT WORDPRESS PLUGIN FOR SYNTAX HIGHLIGHTER EVOLVED

June 17, 2014 knarfalingus 3 Comments

I developed a simple WordPress Plugin for Syntax Higlighter Evolved for displaying TypeScript (http://wordpress.org/plugins/syntax-highlighter-evolved-typescript/)

I found these links helpful in publishing and deploying the plugin.

First I signed up as suggested here (https://wordpress.org/plugins/about/) and then I got the relevant SVN information via e-mail.

Afterwards, I used TortoiseSVN as described here (http://eamann.com/tech/how-to-publish-a-wordpress-plugin-subversion/) and deployed.

TypeScript

TYPESCRIPT CONVERSION TAKEAWAY

June 8, 2014 knarfalingus Leave a comment

The conversion of the 20,000 lines of legacy Javascript in the Windows Control Library was a success. I touched on the major issues in my previous posts. The issues encountered themselves weren’t any kind of flaw in TypeScript, it just demonstrated the need to keep in mind the style of Javascript code that is being generated. After going through the experience, the following steps are what I would recommend for TypeScript conversion:

1) Rename your .js (Javascript) files to .ts (TypeScript) files and compile. Fix all errors that arise and test your fixes.

2) Add type annotations to all variable and parameter declarations. Minimize the use of the ‘any’ type. Add interfaces to define function signatures. Use interfaces to describe existing data structures. Don’t refactor any of your code yet, wait until conversion is complete.

3) Restructure your JavaScript code into modules and classes. I myself did Step 3 before Step 2, but if I did it again I would do Step 2 first.

TypeScript

TYPOS IN TYPESCRIPT

June 5, 2014 knarfalingus Leave a comment

One problem I encountered was when I made a typo while converting a prototypical class and I was chopping the “class.prototype’ out of the function declarations and replacing it with the private or public keyword. For example a class like so

var MyNamespace = MyNamespace || {};

MyNamespace.Widget2 = function(inp,a,b)
{
	this._a = a;
	this._b = b;
	this._inp = inp;
}

MyNamespace.Widget2.prototype.create = function()
{
	this.click();
}

MyNamespace.Widget2.prototype.method1 = function(x)
{
	alert('hello');
}

MyNamespace.Widget2.prototype.click = function(e)
{
	this.method1();
}

Was converted to

module MyNamespace
{
	export class Widget2
	{
		private _a : number;
		private _b : number;
		private _inp : number;

		constructor (inp,a,b)
		{
			this._a = a;
			this._b = b;
			this._inp = inp;
		}

		public create()
		{
			this.click();
		}


		public method1(x)
		{
			alert("hello");
		}

		public click = function()
		{
			this.method1();
		}

	}
}

Note what I consider the typo – the click function was not completely converted, I forgot to strip the ‘= function’ and now it is an assignment to a variable, but it is perfectly valid TypeScript. and it will run correctly. The problem is ‘this’ in the function is not typed as Widget2 but as ‘any’. Now the code will run fine BUT if you make any modifications to the use of ‘this’ in the function you will not get the protections afforded by TypeScript – for example the following class will compile perfectly fine due to ‘this’ being typed as ‘any’, and fail at runtime.

module MyNamespace
{
	export class Widget2
	{
		private _a : number;
		private _b : number;
		private _inp : number;

		constructor (inp,a,b)
		{
			this._a = a;
			this._b = b;
			this._inp = inp;
		}

		public create()
		{
			this.click();
		}


		public method1(x)
		{
			alert("hello");
		}

		public click = function()
		{
                        // method name incorrect 
			this.mthod1();			
		}

	}
}

The recommendation I have for this situation if you are converting a large codebase is to do a regex search in Visual Studio on

(public|private)?s+($|w|_)+s+=s+function

And see if you have made the mistake yourself. If you use unicode characters in your identifiers you will have to update the regex

TypeScript

THIS AGAIN

June 2, 2014 knarfalingus Leave a comment

Another issue I bumped into was converting closures to TypeScript classes, ‘this’ again popped up as part of a larger issue. For example, starting with the following Javascript code

var MyNamespace = MyNamespace || {};

MyNamespace.Widget1 = function(inp,a,b)
{
	var _a = a;
	var _b = b;
	var _inp = inp;

	this.create = function() 
	{
		inp.addEventListener("keydown",this.click);

	}

	this.click = function(e)
	{
		alert("clicked " + _a);
	}

}

I converted it to the following TypeScript.

module MyNamespace
{

	export class Widget1
	{
		private inp : HTMLElement;
		private _a : number;
		private _b : number;
		
		constructor(inp:HTMLElement,a:number,b:number)
		{
			this._a = a;
			this._b = b;
			this.inp = inp;
		}

		public create() 
		{
			this.inp.addEventListener("keydown",this.click);

		}

		private click(e)
		{
			alert("clicked " + this._a);
		}

	}


}

But this has a problem, I’ve converted a closure style object to a prototype style (what a TypeScript class is converted to) as can be seen here in the generated Javascript:

var MyNamespace;
(function (MyNamespace) {
    var Widget1 = (function () {
        function Widget1(inp, a, b) {
            this._a = a;
            this._b = b;
            this.inp = inp;
        }
        Widget1.prototype.create = function () {
            this.inp.addEventListener("keydown", this.click);
        };

        Widget1.prototype.click = function (e) {
            alert("clicked " + this._a);
        };
        return Widget1;
    })();
    MyNamespace.Widget1 = Widget1;
})(MyNamespace || (MyNamespace = {}));

Using prototype in of itself is of course not a problem. However, since I changed my variables to be properties of ‘this’, a bug is born: ‘this’ in an event handler refers to the object that fired the event (in most browsers), not my object. Therefore the reference to ‘this._a’ refers to a most likely nonexistent property ‘_a’ on the DOM object that fired the event. We need to fix this by calling bind on the event handler function and getting a reference to a function that is bound to the correct ‘this’, like so

module MyNamespace
{
	export class Widget1
	{
		private inp : HTMLElement;
		private _a : number;
		private _b : number;
		
		constructor(inp:HTMLElement,a:number,b:number)
		{
			this._a = a;
			this._b = b;
			this.inp = inp;
		}

		public create() 
		{
                        // use bind to set this to the instance of Widget1 object not the object firing the event
			var click = this.click.bind(this);
			this.inp.addEventListener("keydown",click);

		}

		private click(e)
		{
			alert("clicked " + this._a);
		}

	}


}

TypeScript

THIS

May 29, 2014 knarfalingus Leave a comment

Like I have mentioned in the previous posts, the code I am converting is several years old. One of the things it does is some browser detection on page load (a technique that is generally no longer in favor). Changing the functionality or refactoring the code prior to TypeScript conversion however was not a goal. During the conversion of this detector object (which was not prototype or closure style) I started with something structured something like this:


var MyNamespace = MyNamespace || {};

MyNamespace.detector = {

    name: "4",
    init: function () {
        this.name = this.name + "test";
        this.other();
    }, 
    other: function () {
        this.name = "test3";
    },


    dostuff: function (x) {
        alert(this.name + ' ' + x);
    }
}


MyNamespace.detector.init();

MyNamespace.detector.dostuff('z');

And converted it to this TypeScript :


module MyNamespace
{
    export module detector
    {
        export var name : string = "4";

        export function init():void
        {
            this.name = this.name + "test";
            other();
        }

        function other():void
        {
            this.name = "test3";
        }

        export function dostuff(x:string):void
        {
            alert(this.name + ' ' + x);
        } 
    }

}

MyNamespace.detector.init();

MyNamespace.detector.dostuff('z');

The way the “other” function was handled led to issues. I had essentially tried to make it private by not exporting it as it is not something external code would use directly. A quick glance at the code above might give one the impression that the alert would say ‘test3 z’ but in reality it shows ‘4test z’. That is because the “this” in the function “other” is actually a different “this” than in “dostuff” or “init”. The transpiled TypeScript code below makes it clearer why. “this” in the function “other” is the function, while for “init” and “dostuff” it is the object “detector”. The other catch with this situation is that TypeScript will happily let you assign to “this” in a standalone function, even if you set the “allow implicit any types” compiler directive off. Secondly, the “export var name” is actually not required because of the way “this” is handled. TypeScript will compile the file with no errors without that declaration.

My own advice from this “this” experience would be to wary of function exports from modules that use “this” and to check them carefully. In my experience so far, using “this” in TypeScript classes has more protections.

var MyNamespace;
(function (MyNamespace) {
    (function (detector) {
        detector.name = "4";
        function init() {
            this.name = this.name + "test";
            other();
        }
        detector.init = init;

        function other() {
            this.name = "test3";
        }

        function dostuff(x) {
            alert(this.name + ' ' + x);
        }
        detector.dostuff = dostuff;
    })(MyNamespace.detector || (MyNamespace.detector = {}));
    var detector = MyNamespace.detector;
})(MyNamespace || (MyNamespace = {}));

MyNamespace.detector.init();

MyNamespace.detector.dostuff('z');

TypeScript

TYPESCRIPT PLUNGE

May 27, 2014 knarfalingus Leave a comment

My plunge into TypeScript is to convert an existing proprietary ASP.NET Control Class Library, that uses C# on the server side, and Javascript on the client side from Javascript to TypeScript. Although this library is in production use daily, there hasn’t been significant development on it since it was first created back in the 2006-2007 timeframe. As such, it is packed with older style Javascript. There is also zero jQuery usage. After the conversion, I expect another developer at my company may be able to modify it! (safely!). The amount of code is not insignificant, there are about 20,500 total lines of Javascript spread across several files. Although I won’t post any of this closed source code here, I will put up some pseudo code that illustrates what I encounter.

The next step is to get TypeScript to work in a class library project, by default it does not. This can be achieved be editing the project file in a text editor and changing the below from

  <Import Project="$(MSBuildBinPath)Microsoft.CSharp.targets" />
  <!-- To modify your build process, add your task inside one of the targets below and uncomment it. 
       Other similar extension points exist, see Microsoft.Common.targets.
  <Target Name="BeforeBuild">
  </Target>
  <Target Name="AfterBuild">
  </Target>
  -->

  <Import Project="$(MSBuildBinPath)Microsoft.CSharp.targets" />
  <Import Project="$(MSBuildExtensionsPath32)MicrosoftVisualStudiov$(VisualStudioVersion)TypeScriptMicrosoft.TypeScript.targets" />
  <!-- To modify your build process, add your task inside one of the targets below and uncomment it. 
       Other similar extension points exist, see Microsoft.Common.targets.
  <Target Name="BeforeBuild">
  </Target>
  <Target Name="AfterBuild">
  </Target>
  -->

IIS, WordPress

HOSTING WORDPRESS ON IIS, YOU WON’T BELIEVE WHAT YOU DON’T KNOW [PICS] [NSFW]

May 26, 2014 knarfalingus Leave a comment

Ok, so link bait headlines are the order of the day

One tricky issue I had when setting up this website is that the domain itself (knarfalingus.com) is not the main domain of the site. This is a shared hosting account, so on disk, what I will call the ‘primary’ domain points to the root folder ‘’ , and ‘knarfalingus.com’ is a domain pointer that points to the same IP address. I wanted ‘knarfalingus.com’ to point to a subfolder. The way I have it set up, this domain is hosted on disk in a subdirectory of the root, ‘knarfalingus.com’

In order to achieve this, various rewrite rules were put in play. I’ll just refer to the two excellent articles I used when I first set up the site for details, but they should cover most of what is needed to handle the situation. The web.config containing these rules go in the root folder.

http://weblogs.asp.net/owscott/archive/2010/01/26/iis-url-rewrite-hosting-multiple-domains-under-one-site.aspx

http://weblogs.asp.net/owscott/archive/2010/05/26/url-rewrite-multiple-domains-under-one-site-part-ii.aspx

For the starting point of this post, this is the web.config for the case when the you have a domain pointer “yourdomain.com” and you want to host it on disk in a same named subfolder of the root i.e. ‘yourdomain.com’

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
		<rewrite>
			<rules>
        <rule name="yourdomain.com" enabled="true" stopProcessing="true">
          <match url=".*" />
          <conditions logicalGrouping="MatchAll" trackAllCaptures="false">
            <add input="{HTTP_HOST}" pattern="^(www.)?yourdomain.com$" />
            <add input="{PATH_INFO}" pattern="^/yourdomain.com($|/)" negate="true" />
          </conditions>
          <action type="Rewrite" url="/yourdomain.com/{R:0}" />
        </rule>
      </rules>
			<outboundRules>
				<rule name="Outgoing - URL paths" preCondition=".aspx pages only" enabled="true">
					<match filterByTags="A" pattern="^(?:yourdomain|(.*//[_a-zA-Z0-9-.]*)?/yourdomain.com)(.*)" />
					<action type="Rewrite" value="{R:1}{R:2}" />
				</rule>
				<rule name="response_location URL">
					<match serverVariable="RESPONSE_LOCATION" pattern="^(?:yourdomain|(.*//[_a-zA-Z0-9-.]*)?/yourdomain.com)(.*)" />
					<action type="Rewrite" value="{R:1}{R:2}" />
				</rule>
				<rule name="response_location querystring">
					<match serverVariable="RESPONSE_LOCATION" pattern="(.*)%2fyourdomain.com(.*)" />
					<action type="Rewrite" value="{R:1}{R:2}" />
				</rule>
				<preConditions>
				   <preCondition name=".aspx pages only">
					   <add input="{SCRIPT_NAME}" pattern=".aspx$" />
				   </preCondition>
				</preConditions>
			</outboundRules>
		</rewrite>
    </system.webServer>
</configuration>

Although this was satisfactory, I recently wanted to add permalinks to my WordPress site. But doing so resulted in nasty 404 errors in IIS. Following the advice here would probably work on most sites but not on mine due to the special setup.

First, I wanted to have a URL pattern that was useful in terms of SEO and also resistant to change. For example, in the WordPress settings, one of the built-in Permalink Types is ‘Day and Name’ which looks like so:

http://www.yourdomain.com/2014/05/26/sample-post/

Where ‘sample post’ is the post slug (which was helpfully hidden for me in WordPress when editing posts, this can be made visible via Screen Options).

To me this not a very useful format. The date is included which might be helpful on a more time sensitive blog like a news site, but to me is meaningless. Worse still the entire format is based on the premise that your title slug never changes – which you may want to change at some later date.

If in the future you change your scheme to

http://www.yourdomain.com/sample-post/2014/05/26/

you can rest assured you have broken all existing links to your posts!

How to solve these issues and improve SEO? For the SEO part, I’d want the title first in the URL, as it is the most specific information. After that I’d want the category for some more keywords. Finally, add the unique post_id to the URL. My URL scheme is therefore as follows

Here are the parts of the scheme (see Permalinks for syntax)

/blog/ – the reason for this is explained below
%postname% – this is next – this is the most ‘specific’ information about the post, and I put it first in the URL for that reason.
%category% – this is next, less specific, but useful keywords. If you use a category hiearchy you will get multiple keywords separated by ‘/’
%post_id% – this is last. It is meaningless in terms of SEO so it can be last, and as long as I commit to keeping %post_id% last in any URL scheme I come up in the future, any existing links out on other sites should continue to work (EDIT:not with WordPress permalinks but by using IIS Rewrite, see below)

To demonstrate this, examine the following links, they will all lead back to this page, due to the non-varying placement of %post_id%

http://www.knarfalingus.com/blog/hosting-wordpress-on-iis-you-wont-believe-what-you-dont-know-pics-nsfw/wordpress/80/

http://www.knarfalingus.com/blog/still/works/wordpress/80/

http://www.knarfalingus.com/blog/still/works/now/80/

And finally this one here – which won’t work with the WordPress Permalink scheme, which expects three leading directories in the path to the %post_id%. It does work now as I address the issue below when discussing the /blog/ prefix.

http://www.knarfalingus.com/blog/80/

/blog/ prefix

The reason for this is simple, as I stated earlier I have the pre-existing rules which make the domain pointer appear as a standalone domain, but this has a consequence, the rules in the web.config in the root folder actually control the rewrites. In order to squeeze in a rule for the blog without interfering with anything else, I chose to have a rule that handles only URLs with a specific prefix, in this case ‘/blog/’ (actually it matches /blog followed by anything, /blog1/, /blogxyz/ but for my purposes, good enough). This rewrites those URLs to index.php

        <rule name="yourdomain.com wordpress" enabled="true" stopProcessing="true">
          <match url=".*" />
          <conditions logicalGrouping="MatchAll" trackAllCaptures="false">
            <add input="{HTTP_HOST}" pattern="^(www.)?yourdomain.com$" />
            <add input="{PATH_INFO}" matchType="Pattern" pattern="^/blog/.*$" ignoreCase="true" negate="false" />
          </conditions>
          <action type="Rewrite" url="/yourdomain.com/index.php/{R:0}" appendQueryString="false" />
        </rule>

Now above I mentioned http://www.knarfalingus.com/blog/80/ doesnt redirect to the page – but we can fix that by changing our newly added rule to:

        <rule name="yourdomain.com wordpress" enabled="true" stopProcessing="true">
          <match url=".*" />
          <conditions logicalGrouping="MatchAll" trackAllCaptures="false">
                        <add input="{HTTP_HOST}" pattern="^(www.)?yourdomain.com$" />
                        <add input="{PATH_INFO}" matchType="Pattern" pattern="^/blog[w-_/.]*/(d+)/?$" ignoreCase="true" negate="false" />
          </conditions>
          <action type="Rewrite" url="/yourdomain.com/?p={C:1}" appendQueryString="false" />
        </rule>

This rule captures all URLs for yourdomain.com that start with /blog and end with a number. That number is rewritten to what is the default PermaLink URL in wordpress (/?p=%post_id%).

Now URL’s like this work, note the ID is at the end of the URL:

http://www.knarfalingus.com/blog/94935/this/is/a/really/4434/long/URL-dont-you-think.aspx/342534235/test/tes/90/yada-yada-yada/the_answer_is_42/why/are/you/still/reading/this/test/test/80/

I also added a trailing ? to the RegEx to make the trailing slash optional

http://www.knarfalingus.com/blog/94935/this/is/a/really/4434/long/URL-dont-you-think.aspx/342534235/test/tes/90/yada-yada-yada/the_answer_is_42/why/are/you/still/reading/this/test/test/80

Wrapping up, many WordPress themes have a 404 page, But I did not see it, I saw an IIS 404 page. The issue is IIS is handling the 404, instead we need to let it flow through to PHP/Wordpress. The solution is to add the following to web.config

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
    <httpErrors existingResponse="PassThrough" />
    .....

Tossing in a little security, we can block others from loading our content in frames (I know, not very common anymore), by using the X-Frame-Options header and specifying SAMEORIGIN.


<?xml version="1.0" encoding="UTF-8"?>
<configuration>
	<system.webServer>
		<httpProtocol>
			<customHeaders>
				<add name="X-Frame-Options" value="sameorigin" />
			</customHeaders>
		</httpProtocol>

The final config is now as follows:


<?xml version="1.0" encoding="UTF-8"?>
<configuration>
	<system.webServer>
		<httpProtocol>
			<customHeaders>
				<add name="X-Frame-Options" value="sameorigin" />
			</customHeaders>
		</httpProtocol>
		<httpErrors existingResponse="PassThrough" />		
		<rewrite>
			<rules>
        <rule name="yourdomain.com wordpress" enabled="true" stopProcessing="true">
          <match url=".*" />
          <conditions logicalGrouping="MatchAll" trackAllCaptures="false">
                        <add input="{HTTP_HOST}" pattern="^(www.)?yourdomain.com$" />
                        <add input="{PATH_INFO}" matchType="Pattern" pattern="^/blog[w-_/.]*/(d+)/?$" ignoreCase="true" negate="false" />
          </conditions>
          <action type="Rewrite" url="/yourdomain.com/?p={C:1}" appendQueryString="false" />
        </rule>
        <rule name="yourdomain.com" enabled="true" stopProcessing="true">
          <match url=".*" />
          <conditions logicalGrouping="MatchAll" trackAllCaptures="false">
                        <add input="{HTTP_HOST}" pattern="^(www.)?yourdomain.com$" />
                        <add input="{PATH_INFO}" pattern="^/yourdomain.com($|/)" negate="true" />
          </conditions>
          <action type="Rewrite" url="/yourdomain.com/{R:0}" />
        </rule>
      </rules>
			<outboundRules>
				<rule name="Outgoing - URL paths" preCondition=".aspx pages only" enabled="true">
					<match filterByTags="A" pattern="^(?:yourdomain|(.*//[_a-zA-Z0-9-.]*)?/yourdomain.com)(.*)" />
					<action type="Rewrite" value="{R:1}{R:2}" />
				</rule>
				<rule name="response_location URL">
					<match serverVariable="RESPONSE_LOCATION" pattern="^(?:yourdomain|(.*//[_a-zA-Z0-9-.]*)?/yourdomain.com)(.*)" />
					<action type="Rewrite" value="{R:1}{R:2}" />
				</rule>
				<rule name="response_location querystring">
					<match serverVariable="RESPONSE_LOCATION" pattern="(.*)%2fyourdomain.com(.*)" />
					<action type="Rewrite" value="{R:1}{R:2}" />
				</rule>
				<preConditions>
				   <preCondition name=".aspx pages only">
					   <add input="{SCRIPT_NAME}" pattern=".aspx$" />
				   </preCondition>
				</preConditions>
			</outboundRules>
		</rewrite>
    </system.webServer>
</configuration>

UPDATE : after posting I noticed the categories, date, comments, feed, author links (side menu) and pages didn’t work. This seemed to be the combination of PermaLinks plus the rules I started with, not the recent rule additions. I basically exclude rewriting any subdirectories and any .php files to index.php – this seems to be working. All the permalinks seem to be working as well without any logic for the /blog prefix.

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
  <!-- {EA385C80-7BD5-46DC-8E47-F992B0514618}  -->
  <system.webServer>
    <httpProtocol>
      <customHeaders>
        <add name="X-Frame-Options" value="sameorigin" />
      </customHeaders>
    </httpProtocol>
    <httpErrors existingResponse="PassThrough" />
    <rewrite>
      <rules>
              <!-- permalink = /blog/%postname%/%category%/%post_id%/ -->
                <clear />
                <rule name="wordpress grab trailing post_id" enabled="true" stopProcessing="true">
                  <match url=".*" />
                  <conditions logicalGrouping="MatchAll" trackAllCaptures="false">
                    <add input="{HTTP_HOST}" pattern="^(www.)?yourdomain.com$" />
                    <add input="{PATH_INFO}" matchType="Pattern" pattern="^/blog[w-_/.]*/(d+)/?$" ignoreCase="true" negate="false" />
                  </conditions>
                  <action type="Rewrite" url="/yourdomain.com/?p={C:1}" appendQueryString="false"/>
                </rule>
                <rule name="wordpresss urls" enabled="true" stopProcessing="false">
                  <match url=".*" />
                  <conditions logicalGrouping="MatchAll" trackAllCaptures="false">
                    <add input="{HTTP_HOST}" pattern="^(www.)?yourdomain.com$" />
                    <add input="{PATH_INFO}" pattern="^/wp-includes/.*$" negate="true" />
                    <add input="{PATH_INFO}" pattern="^/wp-content/.*$" negate="true" />
                    <add input="{PATH_INFO}" pattern="^/wp-admin/.*$" negate="true" />
                    <add input="{REQUEST_FILENAME}" pattern="^.*.php$" negate="true" />
                  </conditions>
                  <action type="Rewrite" url="/index.php/{R:0}"   />
                </rule>
                <rule name="yourdomain.com" enabled="true" stopProcessing="false">
                    <match url=".*" />
                    <conditions logicalGrouping="MatchAll" trackAllCaptures="false">
                        <add input="{HTTP_HOST}" pattern="^(www.)?yourdomain.com$" />
                        <add input="{PATH_INFO}" pattern="^/yourdomain.com($|/)" negate="true" />
                    </conditions>
                    <action type="Rewrite" url="/yourdomain.com/{R:0}" />
                </rule>
      </rules>
      <outboundRules>
        <rule name="Outgoing - URL paths" preCondition=".aspx pages only" enabled="true">
          <match filterByTags="A" pattern="^(?:yourdomain|(.*//[_a-zA-Z0-9-.]*)?/yourdomain.com)(.*)" />
          <action type="Rewrite" value="{R:1}{R:2}" />
        </rule>
        <rule name="response_location URL">
          <match serverVariable="RESPONSE_LOCATION" pattern="^(?:yourdomain|(.*//[_a-zA-Z0-9-.]*)?/yourdomain.com)(.*)" />
          <action type="Rewrite" value="{R:1}{R:2}" />
        </rule>
        <rule name="response_location querystring">
          <match serverVariable="RESPONSE_LOCATION" pattern="(.*)%2fyourdomain.com(.*)" />
          <action type="Rewrite" value="{R:1}{R:2}" />
        </rule>
        <preConditions>
          <preCondition name=".aspx pages only">
            <add input="{SCRIPT_NAME}" pattern=".aspx$" />
          </preCondition>
        </preConditions>
      </outboundRules>
    </rewrite>
  </system.webServer>
</configuration>

TypeScript

LEARN TYPESCRIPT IN 3 MINUTES WITH THIS ONE SIMPLE TRICK.

May 26, 2014 knarfalingus Leave a comment

Ha ha, sorry had to post a link bait title after reading this post by Scott Hanselman a few moments ago. Anyway, I finally decided to take the plunge and dive into TypeScript after the recent 1.0 release.

Since this is my first post in a planned series, I’ll cover the basics on getting TypeScript set up and also the tools I am using with Visual Studio 2013 to assist in development. I’m actually two weeks into the plunge and way behind on posts so I’ll try not cover too much in a post.

To get Visual Studio 2013 in shape to do TypeScript development do the following.

Step 1 : Get Visual Studio 2013 Update 2 – this includes TypeScript 1.0.1, and TypeScript support is now officially part of VS 2013.

Step 2 : Get Web Essentials 2013 for VS 2013 Update 2 – admittedly this is buggy for me right now on some computers/projects, it seems to be crashing VS 2013 very frequently on save in those cases, so I keep it disabled most of the time right now and enable only when setting up script minification and doing actual builds.

Step 3 : Get a File Nesting extension like this one. This makes things much more manageable in solution explorer, I use it to nest related JavaScript (.js) files under TypeScript (.ts) files, minified JavaScript (.min.js, created by Web Essentials in my case) and also source map (.map) files under the JavaScript files.

When I have TypeScript file in my project, the TypeScript compiler automatically “trans-piles” the file to JavaScript on save. However, I need to explicitly include the .js file in my project OR just select show all files in solution explorer and use the nesting tool to nest it appropriately, this has the side effect of including the file. Then right click the .js file, select the WebEssentials menu and choose minify JavaScript file. This is a one time setting so that on every save of the JavaScript file, WebEssentials will take the further step of generating minified JavaScript files. After I include the files, I also nest them . The end result for a TypeScript file ‘Widget2.ts’ is as below :

My next post will cover the start of the ‘plunge’

jquery

0x800a01b6 – JavaScript runtime error: Object doesn’t support property or method ‘datepicker’

August 26, 2013 knarfalingus 2 Comments

If you have jqueryui linked properly and jquery linked before it, check for more than one reference to jquery. Posted because I wasted some time on this one.

Knarfalingus.net

PACE OF CHANGE AND DEBUGGING BOOKS

TYPESCRIPT WORDPRESS PLUGIN FOR SYNTAX HIGHLIGHTER EVOLVED

TYPESCRIPT CONVERSION TAKEAWAY

TYPOS IN TYPESCRIPT

THIS AGAIN

THIS

TYPESCRIPT PLUNGE

HOSTING WORDPRESS ON IIS, YOU WON’T BELIEVE WHAT YOU DON’T KNOW [PICS] [NSFW]

/blog/ prefix

LEARN TYPESCRIPT IN 3 MINUTES WITH THIS ONE SIMPLE TRICK.

0x800a01b6 – JavaScript runtime error: Object doesn’t support property or method ‘datepicker’

Just another WordPress site