Sunday, October 11, 2015

Implementation of Euclidean Algorithm in Java

In this post, I am going to share the implementation of Euclidean Algorithm in Java.

Euclidean Algorithm is nothing but a method for calculating GCD of two numbers.

GCD (Greatest Common Divisor)

Take two numbers 20 and 30.

Factors of 20: 1, 2, 4, 5, 10, 20.

Factors of 30: 1, 2, 3, 5, 6, 10, 15, 30.

GCD refers to highest common factor of two numbers.

Now for 20 and 30, the common factor and the highest number is: 10. So GCD for 20 and 30 is 10.

The essence of this post is how can we calculate GCD in Java.

Well here it goes,


1:  import java.util.Scanner;  
2:  public class EuclideanAlgo {  
3:       public EuclideanAlgo() {  
4:       }  
5:       public static void main(String[] args) {  
6:            EuclideanAlgo euclideanAlgo = new EuclideanAlgo();  
7:            // Scanner class is used to values in the run time.  
8:            Scanner scanner = new Scanner(System.in);  
9:            // Below takes value of variable a.  
10:            System.out.println("Enter value for a: ");  
11:            int a = scanner.nextInt();  
12:            // Below takes value of variable b.  
13:            System.out.println("Enter value for a: ");  
14:            int b = scanner.nextInt();  
15:            // Calling method returnGCD to get GCD from there.  
16:            int gcd = euclideanAlgo.returnGCD(a, b);  
17:            System.out.println("GCD of " + a + " and " + b + " is: " + gcd);  
18:       }  
19:       private int returnGCD(int a, int b) {  
20:            if (b == 0)  
21:                 return a;  
22:            else {  
23:                 return returnGCD(b, a % b);  
24:            }  
25:       }  
26:  }  

Results are as follows:








In the above code, I used a Scanner class instance in lines 10 and 12 to record values of variables a and b at runtime and passed the values to a function in line 16.

The function returnGCD does the following:

Let's take value of a as 20 and b as 30.

Here 

The function is a recursive one and loops until it finds the second argument of the function to be 0.

If the second argument is not 0, it enters else and the arguments for the method becomes b and a%b.

Explantaion:

For example a is 20 and b is 30.

If condition is false since b is not 0.
Enters else and method is again called with arguments as 
a = 30 (b) and b = 20%30 (a%b) = 20.

If condition is false since b is not 0.
Enters else and method is again called with arguments as 
a = 20 (b) and b = 30%20 (a%b) = 10.

If condition is false since b is not 0.
Enters else and method is again called with arguments as 
a = 10 (b) and b = 20%10 (a%b) = 0.

Now this is a hit!

Code enters If and exits the method with value 10 which is GCD of 20 and 30.

Tuesday, October 6, 2015

A look into setTimeout method in javascript


In this I want to focus on setTimeout of javascript where we can delay things.

I have created a simple HTML code which has Left Center and Right texts three times and a Button on top of them.


I used setTimeout to clear the texts in Red under the button on clicking the button.


When one clicks the button, the following should happen:


1. All the "Left" text under button will disappear in 3 seconds.

2. In the following 3 seconds "Center" text will disappear.
3. In the following 3 seconds "Right" text will disappear.




Left
Center
Right
Left
Center
Right
Left
Center
Right




I used the following code to achieve the above:


1:  <html>  
2:       <head>  
3:            <style>  
4:                 p  
5:                 {  
6:                      color:red;  
7:                      font-size:20px;  
8:                 }  
9:                 .center  
10:                 {  
11:                      text-align:center;  
12:                 }  
13:                 .right  
14:                 {  
15:                      text-align:right;  
16:                 }  
17:            </style>  
18:            <script>  
19:                 function function1()  
20:                 {  
21:                      var time=3000;  
22:                      var var0=document.getElementsByClassName("left");  
23:                      var var1=document.getElementsByClassName("center");  
24:                      var var2=document.getElementsByClassName("right");  
25:                      setTimeout(function() {  
26:                           for(var a=0;a<var0.length;a++) {  
27:                                var0[a].style.display="none";  
28:                                if(a===parseInt(var0.length)-1) {  
29:                                     setTimeout(function() {  
30:                                          for(var b=0;b<var1.length;b++) {  
31:                                               var1[b].style.display="none";  
32:                                               if(b===parseInt(var1.length)-1) {  
33:                                                    setTimeout(function() {  
34:                                                         for(var c=0;c<var2.length;c++) {  
35:                                                              var2[c].style.display="none";  
36:                                                         }  
37:                                                    }, time);  
38:                                               }  
39:                                          }  
40:                                     }, time);  
41:                                }  
42:                           }  
43:                      }, time);  
44:                 }  
45:            </script>  
46:       </head>  
47:       <body>  
48:            <center>  
49:            <input type="button" onclick="function1();" value="Click here">  
50:            </center>  
51:            <p class="left">Left</p>  
52:            <p class="center">Center</p>  
53:            <p class="right">Right</p>  
54:            <p class="left">Left</p>  
55:            <p class="center">Center</p>  
56:            <p class="right">Right</p>  
57:            <p class="left">Left</p>  
58:            <p class="center">Center</p>  
59:            <p class="right">Right</p>  
60:       </body>  
61:  </html>  


In the above code, I used a setTimeout method and provided a delay of 3000 ms (3 seconds), In the method, I have formatted display to none in javascript and when the last tag of class name "left" is reached, I did the same for Center in the main setTimeout and created a setTimeout method for center inside and in Center's setTimeout method, I created another setTimeout for "right".

One can do really cool stuff with this method.

Suggestions are really appreciated.

Tuesday, September 8, 2015

Creation of dynamic HTML Part II

In this post, I am about to write about the way of creating dynamic HTML using javascript using a JS function called createElement.

The process is pretty straight forward unlike the other dynamic HTML way where we dump HTML into innerHTML of a dummy tag.

Here we can create new tags entirely without using dummy tags.

Here is the HTML/JS code I've written.


1:  <html>  
2:  <head>  
3:  <script>  
4:  function function1()  
5:  {  
6:       var var1 = document.createElement("center");  
7:       var var2 = document.createElement("p");  
8:       var2.style.color="teal";  
9:       var2.style.fontSize="20px";  
10:       var2.innerHTML = "Dynamic HTML Paragraph";  
11:       var2.id="id1";  
12:       var var3 = document.createElement("button");  
13:       var3.textContent="Click here to delete the dynamic HTML";  
14:       var3.id="id2";  
15:       var3.onclick = function()   
16:       {  
17:            var var4 = confirm("You sure ?");  
18:            if(var4)  
19:            {  
20:                 var var5 = document.getElementById("id1");  
21:                 var5.parentNode.removeChild(var5);  
22:                 var var6 = document.getElementById("id2");  
23:                 var6.parentNode.removeChild(var6);  
24:            }  
25:       };  
26:       var1.appendChild(var2);  
27:       var1.appendChild(var3);  
28:       document.body.appendChild(var1);  
29:  }  
30:  </script>  
31:  </head>  
32:  <body onload="function1(); ">  
33:  <h3>Creation of dynamic HTML using javascript createElement (This is static ofcourse) &#9786</h3>  
34:  </body>  
35:  </html>  

In the above code in line number 33, I have written static HTML code.

In script tag I have written a function and called it onload of body.

In the function in line 4, I have took sort of a parent element "center" tag using createElement as in line 6.

I went ahead and created two more tags "p" and "button" using createElement.

Important part is that we have to attach these two elements to center tag.

I assumed center tag as a parent tag.

In turn I attached this center tag to body as in line 28.

I have also included onclick functionality for the button tag.

On clicking the button you will be asked if you want to delete. If we say Yes, it deletes both the p button tags created dynamically.

I used the code in lines 20-23 for deleting the tags.

I felt this is a very efficient way to create HTML tags in javascript as I am able to control almost everything of the tag in javascript, instead of writing HTML and dumping HTML as a string into innerHTML.

For instance if I wanted to control the color of the tag. I am first creating the element like

var var1 = document.createElement("p");
var1.innerHTML="P tag";
var1.style.color="lime";
var1.style.fontSize="20px";

I figured style's usage is like

we generally use

<p style="color:lime;font-size:20px;"></p>

in javascript this becomes variable.style(attribute).color(property)="lime"(value );

You can paste the above code in a notepad and save it as HTML and try it out on your own.



Happy learning.

Suggestions are very much appreciated.

Comments

blog comments powered by Disqus