Write ECMAScript 6 (JavaScript 6) in VS Code.

In this post i will show you how to write and debug EcmaScript6 in VS Code.

1. Install NodeJs (Check the configure path option during install).
2. Install VS Code.
3. Restart your machine/Inspect path has been set for NodeJs.
4. Start VS Code.
5. From menu select Open Folder(File->Open Folder).

6. Create a New Folder.

7. Create a new file named “jsconfig.json” and paste below code.

{
    "compilerOptions": {
        "target": "ES6"
    }
}

8. Now create a javascript file Hello.js and paste below code.

class Car {
    constructor(make) { //constructors!
        this.make = make;
      this.currentSpeed = 25;
    }

    printCurrentSpeed(){
          console.log(this.make + ' is going ' + this.currentSpeed + ' mph.');
    }
}

class RaceCar extends Car { //inheritance
    constructor(make, topSpeed) {
        super(make); //call the parent constructor with super
        this.topSpeed = topSpeed;
    }

    goFast(){
          this.currentSpeed = this.topSpeed;
    }
}

let stang = new RaceCar('Mustang', 150);

stang.printCurrentSpeed();
stang.goFast();
stang.printCurrentSpeed();

9. From menu select Debug (View->Debug).

10. Click on green start debug button, which will ask to configure the settings.
Select NodeJs

11. When we select NodeJs,VS Code will open launch.json. Update it with our file name Hello.js

12 Agin click on that Green Play button and enjoy.

JavaScript Logging in ASP.NET MVC – Jsnlog and elmah

Hi Guys in this post i will show you, how you can log javascipt erros in your asp.net mvc applications.

First of all, let me tell you the tools.

1. Visual Studio 2013
2. ASP.NET MVC 4
4. Elmah.mvc
5. Jsnlog.elmah
6. SQL Server 2008

So we can start

1. Create an MVC application.

2. Got to Nugget and add Elmah.MVC, Please note i using elmah’s mvc package

3. Now go to elmah site and download sql scripts for elmah

4. Create a database named Logging and apply the downloaded script.

5. Go to web.config and add connection string for elmah

6.Configure elmah in web.config by adding this

 <elmah>
    <errorLog type="Elmah.SqlErrorLog, Elmah" connectionStringName="elmah" />
     <security allowRemoteAccess="false" />
  </elmah>

7. Great now thorw an exception from your home controller

8. Go to elmah, if you saw this screen, we are good, elmah is configured correctly

9. Again back to Nugget and add Jsnlog for elmah

10. Go to your _Layout.csftml and add this at top

@Html.Raw(JSNLog.JavascriptLogging.Configure())
    <script type="text/javascript">
        window.onerror = function (errorMsg, url, lineNumber, column, errorObj) {

            // Send object with all data to server side log, using severity fatal,
            // from logger "onerrorLogger"
            JL("onerrorLogger").fatalException({
                "msg": "Exception!",
                "errorMsg": errorMsg, "url": url,
                "line number": lineNumber, "column": column
            }, errorObj);

            // Tell browser to run its own error handler as well
            return false;
        }
    </script>

11. Make some javascript error in index.cshtml

@section scripts{
    <script type="text/javascript">
        JL().info("This is a log message");
        xyz;
    </script>

}

12. Go to elmah and watch this

Valid DICOM File checking in JavaScript

Today i will show you, How we can check wheather a file is a DICOM file or not through JavaScript.
One year ago i wrote about how we can achieve this through c#. Please refer this “Valid Dicom File c#”

Normally the extension for a DICOM file is ‘.dcm’. But this extension never guarantee the file is a valid DICOM file.

DICOM is a binary file, in a DICOM file first 128(0-127) bytes is unused. the next 4 bytes(128-131) contain letters ‘D’,’I’,’C’,’M’.

So our logic is to ready all bytes from 128-131 using some binary reader and equate with ‘D’,’I’,’C’,’M’

128=>’D’
129=>’I’
130=>’C’
131=>’M’

<input type="file" id="dcmUpload" />

<script type="text/javascript">

    //binding event handler to input,This work in chrome and firefox. Use attachevent in IE
    document.getElementById("dcmUpload").addEventListener("change", handleInput, false);

    function handleInput(e) {
        if (e.target.files.length == 0) {
            return;
        }

        var file = e.target.files[0];
        var reader = new FileReader();
        reader.readAsArrayBuffer(file);

        //Fired after sucessful file read, Please read documenation for FileReader
        reader.onload = function (evt) {
            if (evt.target.readyState === FileReader.DONE) {

                var array = new Uint8Array(evt.target.result);
                var s = "";
                var start = 128, end = 132;
                for (var i = start; i < end; ++i) {
                    s += String.fromCharCode(array[i]);
                }

                if (s == "DICM") {

                    alert("DICM found not a valid dicom file")
                }

                else {

                    alert("DICM not found");
                }
            }
        };

    }

</script>

JavaScript Functions

1. What is a function?

A function is a block of code, which can be reused.
In JavaScript a function can be declared as below.

function sum(a,b)
{
  var c=a+b;
  return c;
}

A function always return a value. If no return statement it will return undefined.

2. Invoking the function.

You can invoke the above function as below.

var result=sum(1,2);

3. Parameters in functions.

The above sum function take 2 arguments, we can define functions without arguments.
If you forget to pass a parameter, JavaScript will assign undefined to that parameter.

ex: if you call sum(1);,which will return NaN. Because c will be calculated as var c= 1 + undefined
you can pass any number of parameters to the sum function as.
sum(1,2,3,4) but the result will be 3, because JavaScript will took only first 2 parameters

4. Arguments array

A JavaScript function stores all the passed parameters in an internal arguments array.

function args()
{
  return arguments;
}

now call args(1,2,3,true,undefined);
will return [1,2,3,true,undefined]

5. A JavaScript function that can be used to sum n numbers.

function sum_n_numbers()
{
  var i, result=0;

  var count=arguments.length;
  
  for(i=0;i<count;i++)
  {
    result+=arguments[i];
  }

  return result;  

}

6. Predefined functions in JavaScript.

parseInt()
parseFloat()
isNaN()
isFinite()
encodeURI()
decodeURI()
encodeURIComponent()
decodeURIComponent()
eval() – take string input and execute JavaScript

7. Variable scope in JavaScript.

JavaScript uses function scope than block scope.
A variable declared inside function will be accessible throughout the function.
A variable declared inside a if block is also accessible throughout the function.
Global variables are declared outside the function.
If a variable is declared inside a function without the var keyword , it will automatically go to the global scope.(not recommended)

8. Function Expression

JavaScript functions can be assigned to variables.

var func= function sum(a,b){};
var result= func(a,b);

In JavaScript functions are treated as data, which can be assigned to other variables.
So JavaScript functions are special kind of data which contain code and can be executed.

9. Anonymous Functions

These are functions without names. They can be passed to another functions or can be executed immediately.

function(a)
{
  return a;
}

10. Passing functions to another functions

function add(a,b)
{
  return a()+b();
}

function one(a)
{
  return a;
}

function two(b)
{
  return b;
}

add(one(1),two(2));

add(function(){return 1;},function(){ return 2;});

11. Self-invoking Functions.

These functions are executed immediately after it is defined.

(
 function()
  {
    alert('hai');
  }
)()

These functions can take parameters too

(
 function(a)
  {
    alert(a);
  }
)('vivek')

12. Inner Functions

JavaScript supports inner functions, these are normally private.

function sum(a,b)
{
  function calculate(a,b)
  {
    retun a+b;
  }

  return calculate(a,b);
}

13. A function can return another function.

function hai()
{
  return function(){ alert('hai');};
}

14. JavaScript functions can be called before it is declared.

alert(func());
function func()
{
  return "hai";
}

Access Query string in javascript functions-SignalR tips

Try this Tip.

 <script type="text/javascript">

function querySt(Key) {
    var url = window.location.href;
    KeysValues = url.split(/[\?&]+/);
    for (i = 0; i < KeysValues.length; i++) {
            KeyValue= KeysValues[i].split("=");
            if (KeyValue[0] == Key) {
                return KeyValue[1];
        }
    }
}

</script>

Now access by

var value = querySt("name");