1

(Autonomous) Shamshabad-501218, Hyderabad

COMPUTER SCIENCE AND ENGINEERING

B.TECH IV SEMESTER

2013 2014 Date: 31 December, 2013

Course Code : A1605

Course Title : COMPUTER GRAPHICS AND WEB TECHNOLOGIES LABORATORY

Course Structure : Lectures Tutorials Practicals Credits

- - 3 2

Course Coordinator : Mr H Venkateswara Reddy, Associate Professor.

Team of Instructors : Mr H Venkateswara Reddy, Ms.P.Subhadra, Mr G S Prasada Reddy.

I. COMPUTER GRAPHICS:

1. LABORATORY OVERVIEW:

Computer Graphics finds its applications in almost all sectors like Education, Entertainment, Scientific research, CAD, Automobiles etc. In order to meet with demands of computer applications in different sectors, one has to understand how to work with different graphics tools and platforms, concepts behind that graphics tools or applications. This Lab aims to give the practical knowledge of how graphics tools works, what are the concepts behind the graphical features, how computer graphics concepts are implemented and used in several graphics tools and applications.

2. OBJECTIVES:

The objectives of this laboratory are:

i. Introducing graphical programming concepts behind creating graphical primitives.

ii. This laboratory focuses on implementing graphical output primitives rendering algorithms and also various color filling algorithms.

iii. Also this laboratory focuses on advanced graphics tools like Adobe Flash, Blender etc.

3. OUTCOMES:

Upon the completion of computer graphics practical course, the student will be able to attain the following things:

ii. Understanding the interactive computer graphics architecture

iii. Possess in depth knowledge about different kinds of input, output graphical devices, display systems etc.

iv. Gains proficiency in implementing 2D and 3D concepts in any programming language.

2

v. Possess knowledge of 2D object or image to 3D object or image conversion.

vi. Gains knowledge of implementing graphical concepts in producing animations by using animation packages.

vii. Declare and enforce integrity constraints on a database using a state-of-the-art RDBMS

viii. Programming PL/SQL including stored procedures, stored functions, cursors, packages.

4. LIST OF EXPERIMENTS:

Week Program Category Experiments List

1 Line Drawing Algorithms a. Implement DDA line drawing algorithm for drawing a line segments between two given end points A (x1, y1) and B(x2, y2).

b. Using DDA line drawing Algorithm, Write a C program for drawing a robo shape?

c. Implement Bresenhams line drawing algorithm for drawing a line segment between two given endpoints A (x1, y2) and B(x2, y2).

d. Using Bresenhams line drawing Algorithm, Write a C program for drawing our national flag?

e. Using either DDA or Bresenhams line drawing algorithm, Write a C-program for drawing the car shape?

2 Circle Drawing Algorithms

a) Implement midpoint circle generation algorithm or bresenhams circle algorithm for drawing a circle of given center (x, y) and radius r.

b) Using midpoint circle generation algorithm, write a c-program for drawing Mickey Mouse shape with the help of circles.

c) Using circle generation algorithm, write a c-program for drawing solar planet system with the help of ellipse and circles.

d) Design a sky consisting of clouds using set of ellipses or circles generated by mid point ellipse generation algorithm?

3 Ellipse Generation Algorithm

a) Implement the Ellipse Generation Algorithm for drawing an ellipse of given center(x, y) and radius rx and ry.

b) Using ellipse generation algorithm, write a c-program for drawing Mickey Mouse shape with the help of circles.

c) Design a sky consisting of clouds using set of ellipses or circles generated by mid point ellipse generation algorithm?

d) Write a C-program for drawing the following car shape(appropriate) using DDA line drawing and ellipse

3

generation algorithm: (use lines in place of curve shapes if any)

4 Creating Various Types Of Texts And Fonts

a) Using different graphics functions available for text formatting in C-Language, Write a C program for displaying text in different sizes?

b) Using different graphics functions available for text formatting in C-Language, Write a C program for displaying the following text GRAPHICS ON TEXT-HELLO GRAPHIKOS in GREEN color in vertical direction?

c) Using different graphics functions available for text formatting in C-Language, Write a C program for displaying the following text GRAPHICS ON TEXT-HELLO GRAPHIKOS in GREEN color in horizontal direction?

d) Using different graphics functions available for text formatting in C-Language, Write a C program for displaying the text as it is shown in following figure:

e) Write a C-program for displaying text in different sizes, different colors and different font styles by using graphics functions.

5 Creating Two Dimensional Objects

a) Using different graphics functions available, Write a C-program for creating simple two dimensional shape of fish using output primitives likes lines, circle, rectangle etc

b) Using different graphics functions available, Write a C-program for creating simple two dimensional shape of man using output primitives likes lines, circle, rectangle etc

4

c) Using different graphics functions available, Write a C-program for creating simple two dimensional shape of car using output primitives likes lines, circle, rectangle

d) Using different graphics functions available, Write a C-

program for creating simple two dimensional shape of house using output primitives likes lines, circle, rectangle etc

6 Two Dimensional

Transformations a) For a given 2D object, write a C-program for performing

the basic 2D transformation translation? [Take the object as line segment and for translation, translate object from (100,150) to (200,200)]

b) For a given 2D object, write a C-program for performing the basic 2D transformations translation, Scaling? [Here the object is rectangle. For translation, translate object from (100,150) to (200,200), for scaling, scale the object to twice its original size)?

c) For a given 2D object line segment, write a C-program for performing the basic 2D transformation rotation? [Consider the angle of rotation as 90 degrees].

d) Draw a rectangle shape and write a C-program for doing shear transformation on the object along x-axis where x-shear=2?

e) Draw a rectangle shape and write a C-program for doing shear transformation on the object along y-axis where y-shear=2?

7 Coloring the Pictures a) By using the concept of Boundary fill algorithm, Write a C- program for filling a given rectangle object with color?

5

b) By using the concept of Scan line polygon fill algorithm, write a C- program for filling a given object with color?

c) By using the concept of flood fill algorithm, Write a C- program for filling a given rectangle object with color?

d) Different graphic Functions are available in C-Language for filling a given object with colors. Using the graphic functions, Write a C program for

i. Filling a circle with any color? ii. Filling a polygon with any color?

e) Draw 3 clouds by using graphics functions and fill the 3 clouds with yellow, blue and green colors by using flood fill Algorithm?

f) Draw our national flag by using graphics functions and fill appropriate colors by using boundary fill algorithm?

8 Three Dimensional Transformations

a) For a given 3D object, write a C-program for performing the basic 3D transformations translation, Scaling? [Here the object is rectangle. For translation, translate object from 100units from their current position, for scaling, scale the object to twice its original size)?

b) For a given 3D object rectangle segment, write a C-program for performing the basic 3D transformation rotation? [Consider the angle of rotation as 90 degrees].

c) For a given 3D object, write a C-program for performing the basic 3D transformation translation?

9 Simple Animations Using Transformations

a) By using the translation concept, write the C-code for moving a line segment from left to right.

b) For the following scenarios, write C-programs for designing simple animations using transformations:

i. Circle moving from left to right and vice versa ii. Man object moving

iii. Wind mill rotation

10 Key Frame Animation a) By using Adobe Flash Professional CS6, draw simple clouds in sky, a man in ground and implement the following animation concepts:

i. Shape tweening ii. Motion tweening

b) Using bone tool in adobe flash professional, generate an animation sequence of cartoon character walking?

c) Design any cartoon animation which is sequence of at least 10-15 frames using adobe flash professional?

d) Using shape tweening and motion tweening, generate any animation sequence?

e) Design Key Frame animations using the graphics concepts by implementing tweening concept provided in Adobe Flash CS6 Environment.

6

II. WEB TECHNOLOGIES: 1. LABORATORY OVERVIEW:

Presenting information over internet in form of web pages is the best way of reaching to all corners of world. This laboratory aims at giving knowledge about creating web pages and also about different web programming concepts, technologies.

2. OBJECTIVES:

The objectives of this laboratory are:

i. To be familiar with and understand the importance of web standards. ii. To be able to design and develop interactive, client-side web applications.

iii. To be able to design and develop server-side web applications. iv. To be able to explain how the client-server model of Internet programming works. v. To be able to describe sources of accessibility guidelines and standards, and the

impact of these guidelines on designing computer-based applications. vi. To be able to evaluate ethical issues involving web privacy.

vii. To be able to successfully complete team-based projects

3. OUTCOMES:

Upon the completion of Web Technologies practical course, the student will be able to attain the following things:

1. Demonstrate the ability to retrieve data from a database and present it in a web page.

2. Demonstrate competency in the use of common HTML code.

3. Demonstrate competency using FTP to transfer web pages to a server.

4. Construct pages that meet guidelines for efficient download.

5. Construct pages that meet the needs of an identified audience.

6. Construct efficient file structure for web sites.

7. Evaluate the functions of specific types of web pages in relationship to an entire web site.

8. Design electronic text and web pages that include the standard textual components needed on web pages.

9. Create web pages that meet accessibility needs of those with physical disabilities.

10. Understand how CSS will affect web page creation.

11. Understand the role of JavaScript in web page creation.

7

4. LIST OF EXPERIMENTS:

Week Experiment Category Experiments List

1. Creation of Home Page a) Write a HTML program to demonstrate HTML Headers. b) Write a HTML program using images as link Anchor. c) Write a HTML program for adding images with HTML. d) Write a HTML Program to demonstrate different

formats of text in XHTML e) Write a HTML Program to demonstrate Anchor Tag in

XHTML f) Write a HTML Program to demonstrate Tables in

XHTML g) Write a HTML Program to demonstrate Cell Spacing and

Cell Padding in a XHTML Table h) Write a HTML Program to demonstrate different forms

of Lists- Ordered, Unordered, Nested and description lists

i) Write a HTML Program to demonstrate Simple Frame using XHTML

j) Write a HTML Program to demonstrate Mixed Frames( combining Horizontal & Vertical frames)

k) Write a HTML Demonstration of Navigation through various frames

l) Write a HTML Program to demonstrate Form Fields m) Write a HTML Program to demonstrate Character

Entities

2. Registration form a) Create a registration form with the following fields

Name (Text field), Password (password field), E-mail id

(text field), Phone number (text field), Sex (radio

button), Date of birth (3 select boxes), Languages

known (check boxes English, Telugu, Hindi, Tamil),

Address (text area)

b) Write JavaScript to validate the following fields of the

above registration page.

i. Name (Name should contains alphabets and the length should not be less than 6 characters).

ii. Password (Password should not be less than 6 characters length).

iii. E-mail id (should not contain any invalid and must follow the standard pattern

name@domain.com) c) Write a HTML program using Java script to

demonstrate

a) Alert Box (b) Prompt dialogue

d) Write a HTML program using Java script to perform

8

comparison between two numbers entered by user, using relational operators.

e) Write a HTML program using Java script to calculate the product of 3 integers.

f) Write a HTML program using Java script to print the factorial of integer using recursions.

g) Write a HTML program using Java script to demonstrate Fibonacci (series) numbers using recursion.

h) Write a HTML program using Java script to product sum of even integers from 2 to 100.

i) Write a HTML program using Java script to search an array of elements using linear search.

j) Write a HTML program using Java script to search an element in an array element using binary search.

3. Cascading Style Sheets a) Design a web page using CSS (Cascading Style Sheets) which includes the following: Use different font, styles: In the style definition you define how each selector should work (font, color etc.).Then, in the body of your pages, you refer to these selectors to activate the styles.

b) Write a HTML Program to demonstrate Internal Style Sheet

c) Write a HTML Program to demonstrate External CSS d) Write a HTML Program to demonstrate Inline CSS e) Write a HTML Program to demonstrate Border Colors

using CSS f) Write a HTML Program to demonstrate Text Alignments

using CSS

4. extensible Markup Language (XML)

a) Write an XML file which will display the Book information which includes the following: Title of the book, Author Name, ISBN number, Publisher name, Edition, Price.

b) Demonstration of XML with Internal DTD c) Write a Document Type Definition (DTD) to validate the

above XML file. d) Demonstration of Simple DTD Document e) Demonstration of XML with External DTD f) Write a program to display XML data with XSL.

6. Servlets a) Write a Servlet Program to implement a dynamic HTML using Servlet (user name and password should be accepted using HTML and displayed using a Servlet).

b) Write a Servlet Program to Download a file and display it on the screen(A link has to be provided in HTML, when the link is clicked corresponding file has to be displayed on Screen)

c) Program to Show Validation Of User Using Servlet d) Program of Calling One Servlet By Another Servlet

9

7. Java Server Pages a) Write a Program to display message on browser using Java Server Pages

b) Write a JSP Program to print 10 even and 10 odd numbers.

c) Write a JSP Program to implement verification of a particular user login and display a welcome page.

d) Write a JSP Program to get student information through a HTML and create a JAVA Bean Class, populate Bean and display the same information through another JSP.

e) Write a JSP Program which uses tag to run a applet.

f) Write a JSP Program which implements nested tags and also uses Tag Support Class...

g) An EJB application that demonstrates Session Bean.

h) An EJB application that demonstrates Entity Bean.

i) Write a web application which demonstrates custom tag handling

8. JDBC AND SERVLETS a) Create user registration functionality for student to get registered with exam result section. The registration page takes following information from user: user ID, password, confirm password, full name, and semester, roll no, email-id, and contact number. The registration servlet checks uniqueness of user ID among all users and if found unique then only stores registration information in database.

b) A Program to execute select query using JDBC.

c) To write java servlet programs to conduct online examination and to display student mark list available in a database.

FACULTY INCHARGE HOD, CSE