Appychip

Tuesday 3 June 2014

Introduction to Object Oriented Javascript

Introduction

Many programming languages uses class based object oriented based paradigm, However, JavaScript uses prototype based paradigm. Let's get more deeper into that....

JavaScript was simply used as a scripting language which was mainly used by web-designers to do simple dynamic tricks on web pages. With time the JavaScript has evolve as one of the important full featured programming language to built rich Internet application rather than just doing simple tricks on the website.

                                    Object Oriented JavaScript
JavaScript uses class-less based object oriented paradigm which is also known as prototype based object oriented paradigm.
In prototype based object oriented paradigm, rather than defining set of class templates from which the objects are created, the objects are declared as they are needed.

                                                Advantage
One of the major advantage of prototype based OOP paradigm is that the objects can be modified at runtime. This means that the definition structure of the object is not strict as the classes are not defined.

                                                  Example
Let us see an example of object oriented paradigm, A function serves as an object prototype. To create an instance of this object new keyword is used.

1
2
3

function Car() { }
var myCar = new Car();
console.log(myCar);

Here the function Car() serves as an object and myCar is an instance of Car().
The output of the above code is object{}

To see a complete example of the same Following is the code :

<html>
<head>
    <title>Learning Dojo</title>
    <script src="dojoroot/dojo/dojo.js">
</script>

</head>
<body>
<h1>Learning Dojo</h1>
<div>Object oriented javascript</div>
<ul id="list">
    <li>It is class-less based object oriented paradigm</li>
    <li>Allow to modify object at runtime</li>
    <li>class template need not to be defined</li>
</ul>
<script>
    function Car() { } //Here Car function serves as an object
    var myCar = new Car(); // myCar is an instance of Car object
    alert(myCar); // This will show the output as object in the alert-box
    
</script>
</body>
</html>

After running the above code in the browser we get the following output:

Saturday 12 April 2014

Getting Started with dojo : Part 1

DOJO

Dojo is a lightweight javascript library which have the following features:

Lightweight
Provide object oriented features
Help to build AJAX rich application
Large scale web application can be built
Provide widget library
Saves development time
Prevent cross browser inconsistency
And many more

Follow the instruction to get started with dojo :

Download stable version of dojo from dojotoolkit.org
In your www directory of wamp server make a folder named learndojo, in the folder learndojo make another directory dojoroot.
Unzip the downloaded dojo library in this dojoroot directory, directory structure should be like www/learndojo/dojoroot/dojo/dojo.js . The file dojo.js is present in the dojo folder of your unzipped directories.
In the learndojo directory make a file and named it index.html which have the following code.



<html>


<head>


<title>Learning Dojo</title>


<!--Below line includes the dojo.js files from the directory dojoroot/dojo/ -->


<script src="dojoroot/dojo/dojo.js">


</script>





</head>


<body>


<h1>Learning Dojo</h1>


<div id="message">Following are some features of dojo</div>


<ul id="list">


<li>Rich Internet application, saving development time</li>


<li class="highlight">Dojo have widget library and object oriented features which helps to build a AJAX powered web application</li>


<li>Extremely light-weight</li>


</ul>


</script>


<script>


/*Here dojo.onLoad is a function which will create a div on this page gets loaded and will add the text Hello learner.... to the body of this page. */


dojo.addOnLoad(function() {


dojo.create(


"div",


{


"innerHTML": "Hello, Learner. I hope you are enjoying dojo!"


},


dojo.body()


);


});


</script>


</body>


</html>

In the above code, the we have included dojo.js in the <head> section and we are using dojo to create a div dynamically when the web page gets loaded.
The dojo.onLoad function creates a div and add the text to the body "Hello learner, I hope you are enjoying dojo".
The same working code you can fork from git also.

Thursday 3 April 2014

Getting started with Angularjs

Getting started with Angularjs

Angularjs is an awesome javascript library by google. It works on MVW (Model View Whatever) framework. HTML is good to have static documents but it failed to have dynamic views. The AngularJs allows you to do so.

Let us take an example to start with, so that you can have better understanding of angularjs.

First of all download the file angular.min.js

keep it where you are going to make your other files in which you will include this file.

Now make a file usingDirectives.html where you have kept angular.min.js file.

usingDirectives.html file will contain the following code :

<html data-ng-app=""> <!--here data-ng-app="" tells that we are using the angular in this file,
you can also use ng-app instead of data-ng-app
This is also known as directives-->
 <head>
  <title>Using Angularjs directives</title>
  
 </head>

 <body>
  Name : 
  <br>
  <input type="text" data-ng-model="name" />  {{ name }}
  <!--Now here in the input field we have used the directive data-ng-model, a model is where the data resides,
  we have given the name of model as "name" which we will use as the variable for data binding.
  Here the variable is placed in {{}} whcih is a data binding expression.
  Whatever we type in the model (textbox) will be binded to the {{name}}. -->
  <script  src="angular.min.js"></script>
 </body>
</html>

Here in this example we have data-ng-app="" in the html tag which tells that we are using the angular in this file, we can also use ng-app instead of data-ng-app, This is also known as directives.

We have an input field, we have used the directive data-ng-model, a model is where the data resides, we have given the name of model as "name" which we will use as the variable for data binding.
Here the variable is placed in {{}} which is a data binding expression.
What ever we type in the model (textbox) will be binded to the {{name}}
I hope this example is the simplest one to start with, you can also get the same working example from this link .

Friday 7 March 2014

JAVA PROGRAM TO COUNT NUMBER OF LINES IN A C PROGRAM

Following is the java program which counts the number of lines in a c program which is taken as string in the object of StringTokenizer class.

Monday 30 December 2013

Angularjs Simple example

Hello Everyone
 In this tutorial you are going to learn about angularjs with a basic program.
 Angularjs works on SPA framework which means single page application. To run the following
program all you need is to download angular.min.js and save it in the folder which contains 
the following file. Following programs itself explains through comments how angularjs is 
working, It displays a textbox and whatever being entered in the textbox will be displayed 
on the right of the textbox.
 
<!DOCTYPE html>
<html data-ng-app=""> <!-- Here data-ng-app is a directives which tells the
 html new tricks--> 
 <head>
 <title>Learn Angularjs</title>
</head>
<body >
Name : <input type="text" data-ng-model="name"/>{{name}}  <!-- this defines a textbox with variable name - 'name' and {{name}} output the text of the textbox being entered in it by the user. data-ng-model is a directive and {{name}} is a data binding expression -->
<div data-ng-init="names=['ajeet','ankit','bihar','rahul','sunny','chitrank']"> <!-- This div initialises the array 'names'-->
 <br>
 <ul>
  <li ng-repeat="dcmember in names">{{dcmember}}</li> <!-- ng-repeat directives repeats the elements of the array to be listed by the variable dcmember in the array names-->
 </ul>
</div>
<br>
<div data-ng-init="customers=[{name:'ajeet',city : 'Mhow'},{name :'ankit',city : 'Dewas'}]">  <!-- Here customers is an array which consist of name and city of the customer-->
 <input type="text" data-ng-model="nametext">{{nametext}}
  <ul>
   <!--filter will display the result according to the text being entered in the textbox, orderBy will display the list in alphabetical order according to city-->
   <li ng-repeat="cust in customers | filter: nametext | orderBy :  'city'" >{{cust.name}} - {{cust.city}}</li>
  </ul>
</div>
<script type="text/javascript" src="angular.min.js"></script>
</body>
</html>

Monday 23 December 2013

Introduction to javascript

Introduction to javascript : 1

Javascript is a very easy to learn language.

1. Printing text to console:
write the text in double quote which you want to print to console
ex. "This text will be printed on console";

2. Counting length of the string:
use length function to count the length of the string
ex. "sample".length;

3. Data types in javascript:
There are data types in many languages like numbers, string etc.
In JavaScript also there are data types like numbers and string.
The numbers written without double quotes are number ex. 43, 78.9.
The text written within double quotes are considered as string ex. "43", "javascript"

4. confirm function :
Confirm function is used to take response from the user for a particular action.
A confirm box appears on the screen with some display text, ok and cancel button.
ex. confirm("try again?");

5.Prompt function :
Prompt function provides interaction with user. It provides a input box to take input from the user.
ex. Prompt("What is your name?");

Saturday 15 June 2013

Coding to Send Email on a Button Click With and Without attachment

 
Private Sub sendbutton_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles sendbutton.Click
        If con.State = ConnectionState.Open Then
            con.Close()
        End If
        Try
            Dim mail, atchmail As New MailMessage
            mail.Subject = subjecttextbox.Text
            mail.To.Add(totextbox.Text)
            mail.From = New MailAddress(usernametextbox.Text)
            mail.Body = bodytextbox.Text
            If attachmenttextbox.Text <> "" Then 'If attachment is there than this code will be executed
                Dim attachment As System.Net.Mail.Attachment
                attachment = New System.Net.Mail.Attachment(attachmenttextbox.Text)
                mail.Attachments.Add(attachment)

                Dim smtp As New SmtpClient("smtp.gmail.com")
                smtp.EnableSsl = True
                smtp.Credentials = New System.Net.NetworkCredential(usernametextbox.Text, passwordtextbox.Text)
                smtp.Port = "587"
                smtp.Send(mail)
            Else 'If there is no attachment than this code is executed
                Dim smtp As New SmtpClient("smtp.gmail.com")
                smtp.EnableSsl = True
                smtp.Credentials = New System.Net.NetworkCredential(usernametextbox.Text, passwordtextbox.Text)
                smtp.Port = "587"
                smtp.Send(mail)
            End If

            MsgBox("Message Sent Successfully", MsgBoxStyle.Information)
            totextbox.Clear()
            subjecttextbox.Clear()
            bodytextbox.Clear()
            attachmenttextbox.Clear()
            usernametextbox.Text = "sample_email@gmail.com"
            passwordtextbox.Clear()
        Catch ex As Exception
            MsgBox(ex.ToString)
        End Try
        

    End Sub