0% found this document useful (0 votes)
42 views

OSS Lab With Outputs

The document contains code snippets for various web development tasks using technologies like HTML, CSS, JavaScript, PHP and MySQL. This includes programs to create a basic web page with frames and tables, incorporate CSS for styling, perform simple calculations in JavaScript, check user login details in PHP against a MySQL database, and pass messages between web pages.
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
42 views

OSS Lab With Outputs

The document contains code snippets for various web development tasks using technologies like HTML, CSS, JavaScript, PHP and MySQL. This includes programs to create a basic web page with frames and tables, incorporate CSS for styling, perform simple calculations in JavaScript, check user login details in PHP against a MySQL database, and pass messages between web pages.
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 24

1 .

Program to create a web page with Frames and Tables

Frametable.html
<html>
<frameset rows="40%,*">
<frame src="f1.html" name="f1">
<frameset cols="50%,50%">
<frame src="f2.html" name="f2">
<frame name="f3">
</frameset>
</frameset>
</html>
F1.HTML:
<html>
<head><title> usage of frame tag </title></head>
<body bgcolor="yellow">
<h3> <center>USAGE OF FRAMES AND TABLE </h3>
<img src="Tulips.JPG" width="150" height="150"></img>
</body>
</html>
F2.HTML:
<html>
<head><title>usage of frame tag </title>
</head>
<body bgcolor="red">
<h1><center> course details </h1></center>
<h3>
<ul>
<li> <a href="bca.html" target="f3">BCA </a></li>
<li> <a href="bsc.html" target="f3">B.Sc </a></li>
</ul>
</h3>
</body>
</html>
BCA.HTML:
<html>
<head>
<title>usage of frame tag
</title>
</head>
<body>
<br>
<br>
<br>
<br>
<center>
<table border=1>
<tr>
<td>
<u>BCA COURSE DETAILS </u>
</td>
</tr>
<tr>
<td>
Duration : 3 years
</td>
</tr>
<tr>
<td>
fees: 36,000 / year
</td>
</tr>
</table>
</center>
</body>
</html>
BSC.HTML:
<html>
<head>
<title>usage of frame tag
</title>
</head>
<body>
<br>
<br>
<br>
<br>
<center>
<table border=1>
<tr>
<td>
<u>BSC COURSE DETAILS </u>
</td>
</tr>
<tr>
<td>
Duration : 3 years
</td>
</tr>
<tr>
<td>
fees: 34,000 / year
</td>
</tr>
</table>
</center>
</body>
</html>

OUTPUT :
2 . Program to create a web page incorporating CSS
(Cascading Style Sheets)
extstyle.css
h2 {color:green; text-align:center; border-style:dashed}
h1 {color:blue; text-align:center; border-style:dotted}
h3 {color:maroon; text-align:center; border-style:solid}
cssstyle.html
<html>
<head>
<title>
css syle sheets-internal and external
</title>
<link rel="stylesheet" type="text/css" href="extstyle.css"/>
<style type="text/css">
h4 {font-size:16pt; text-align:center; border-style:solid; color:brown;}
p {font-size:16pt; text-align:center; border-style:dotted; color:red;}
</style>
</head>
<body>
<BR>
<BR>
<BR>
<center><u><font size=24> EXTERNAL, INTERNAL AND
INLINE STYLES USING CSS</font></U></CENTER>
<br>
<br>
<br>
<h1>Blue text with dotted border using external style sheet</h1>
<h2>Green text with dashed border using external style sheet</h2>
<h3>Maroon text with solid border using external style sheet</h3>
<h4> Brown text with solid border using internal style sheet</h3>
<p>Red text with dotted border using internal style sheet</p>
<h5 style="color:olive; font-size:16pt; font-weight:bold; text-
align:center; border-style:solid;">olive color inline style text</h5>
<hr>
</body>
</html>

OUTPUT :
3. WRITE A SHELL PROGRAM TO FIND THE
FACTORIAL OF AN INTEGER POSITIVE NUMBER
echo "ENTET A POSITIVE NUMBER"
read n
f=1
until test $n -lt 1;
do
f=`expr $f \* $n`
n=`expr $n - 1`
done
echo "FACTIORIAL IS $f"
output:
ENTET A POSITIVE NUMBER
5
FACTIORIAL IS 120
4 . Develop a shell program to find the details of a
user session
echo -e "\n USER SESSION DETAILS
1. For counting the number of logged-in user
2. For listing the currently logged-in users
3. For checking the groups to which the current user belong"
read input
case $input in
1)
who --count | grep users #syntax who <option><user optional>& grep
used to filter
;;
2)
who -q | grep -v users #-q or --count option is to count the number
of users and print the logged-in users.
;;
3)
groups #syntax groups <option> [USERNAME]
;;
*)
echo -e "Please Enter Correct Input \n"
;;
esac
Output:
5 . Program to create a simple calculator in Java
script
Calc.html
<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<meta http-equiv="X-UA-Compatible" content="ie=edge">

<link rel="stylesheet" href="style.css">

<title>Calculator</title>

</head>

<body>

<div class="container">

<h1>Calculator By CodeWithHarry</h1>

<div class="calculator">

<input type="text" name="screen" id="screen">

<table>

<tr>

<td><button>(</button></td>

<td><button>)</button></td>

<td><button>C</button></td>

<td><button>%</button></td>
</tr>

<tr>

<td><button>7</button></td>

<td><button>8</button></td>

<td><button>9</button></td>

<td><button>X</button></td>

</tr>

<tr>

<td><button>4</button></td>

<td><button>5</button></td>

<td><button>6</button></td>

<td><button>-</button></td>

</tr>

<tr>

<td><button>1</button></td>

<td><button>2</button></td>

<td><button>3</button></td>

<td><button>+</button></td>

</tr>

<tr>

<td><button>0</button></td>

<td><button>.</button></td>

<td><button>/</button></td>

<td><button>=</button></td>
</tr>

</table>

</div>

</div>

</body>

<script src="index.js"></script>

</html>

style.css
.container{

text-align: center;

margin-top:23px

table{

margin: auto;

input{

border-radius: 21px;

border: 5px solid #244624;

font-size:34px;

height: 65px;

width: 456px;
}

button{

border-radius: 20px;

font-size: 40px;

background: #978fa0;

width: 102px;

height: 90px;

margin: 6px;

.calculator{

border: 4px solid #13695d;

background-color: #ff99f7;

padding: 23px;

border-radius: 53px;

display: inline-block;

h1{

font-size: 28px;

font-family: 'Courier New', Courier, monospace;

}
index.js
let screen = document.getElementById('screen');

buttons = document.querySelectorAll('button');

let screenValue = '';

for (item of buttons) {

item.addEventListener('click', (e) => {

buttonText = e.target.innerText;

console.log('Button text is ', buttonText);

if (buttonText == 'X') {

buttonText = '*';

screenValue += buttonText;

screen.value = screenValue;

else if (buttonText == 'C') {

screenValue = "";

screen.value = screenValue;

else if (buttonText == '=') {

screen.value = eval(screenValue);

else {

screenValue += buttonText;

screen.value = screenValue;

}
})

OUTPUT :
6 . JavaScript program to scroll your name in the
scroll bar
Scrollname.html
<html>
<head>
<title>Scroll the Name</title>
<script language="JavaScript">
myname=prompt("Enter your name"," ");
var blanks=" ";
function ScrollText(milliseconds)
{
window.setInterval("displayText(' "+myname+" ')",milliseconds)
}
function displayText(text)
{
window.defaultStatus=blanks+text;
blanks+=" ";
}
</script>
</head>
<body onload="ScrollText(100)">
<P>Watch Your Name Scroll at the bottom of this window</P>
</body>
</html>
OUTPUT :
7 . Program to check message passing mechanism
between pages
Input.html
<html>
<head>
<title>Message passing between two pages</title>
</head>
<body>
<form action="welcome.php" method="post">
<center><U>MESSAGE PASSING MECHANISM BETWEEN TWO
PAGES</U></center>
<BR>
<BR>
Enter your name:<input name="name" type="text" /> <br /> Select your
course:<select name="course">
<option value="BSC">BSC</option>
<option value="BCA">BCA</option>
</select><br /> <input type="submit" /></form>
</body>
</html>

OUTPUT :

Welcome.php
<html>
<head>
<title>Message passing between two pages</title>
</head>
<body>
<?php echo "Hi ".$_POST[“name”]. " welcome to open source programming
lab";?>.<br/>
<?php echo "You are studying in ".$_POST[“course”];?>
</body>
</html>
OUTPUT: :
8. Application for Email Registration and Login using PHP and MySQL.

Auth_session:
<?php
session_start();
if(!isset($_SESSION["username"]))
{
header("Location: login.php");
exit() ;
}
?>

Dashboard:
<?php
//include auth_session.php file on all user panel pages
include("auth_session.php");
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Dashboard - Client area</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="form">
<p>Hey, <?php echo $_SESSION['username']; ?>!</p>
<p>You are in user dashboard page.</p>
<p><a href="logout.php">Logout</a></p>
</div>
</body>
</html>

DB:
<?php
// Enter your host name, database username, password, and database name.
// If you have not set database password on localhost then set empty.
$con = mysqli_connect("localhost","root","intel","LoginSystem");
// Check connection
if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
?>

Index:
<?php
header("Location: login.php");
?>

Login:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Login</title>
<link rel="stylesheet" href="style.css"/>
</head>
<body>
<?php
require('db.php');
session_start();
// When form submitted, check and create user session.
if (isset($_POST['username']))
{
$username = stripslashes($_REQUEST['username']); // removes backslashes
$username = mysqli_real_escape_string($con, $username);
$password = stripslashes($_REQUEST['password']);
$password = mysqli_real_escape_string($con, $password);
// Check user is exist in the database
$query = "SELECT * FROM `users` WHERE username='$username'
AND password='" . md5($password) . "'";
$result = mysqli_query($con, $query) or die(mysql_error());
$rows = mysqli_num_rows($result);
if ($rows == 1)
{
$_SESSION['username'] = $username;
// Redirect to user dashboard page
header("Location: dashboard.php");
}
else
{
echo "<div class='form'>
<h3>Incorrect Username/password.</h3><br/>
<p class='link'>Click here to <a href='login.php'>Login</a> again.</p>
</div>";
}
}
Else
{
?>
<form class="form" method="post" name="login">
<h1 class="login-title">Login</h1>
<input type="text" class="login-input" name="username" placeholder="Username"
autofocus="true"/>
<input type="password" class="login-input" name="password" placeholder="Password"/>
<input type="submit" value="Login" name="submit" class="login-button"/>
<p class="link">Don't have an account? <a href="registration.php">Registration Now</a></p>
</form>
<?php
}
?>
</body>
</html>

Logout:
<?php
session_start();
// Destroy session
if(session_destroy())
{
// Redirecting To Home Page
header("Location: login.php");
}
?>

Registration:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Registration</title>
<link rel="stylesheet" href="style.css"/>
</head>
<body>
<?php
require('db.php');
// When form submitted, insert values into the database.
if (isset($_REQUEST['username']))
{
// removes backslashes
$username = stripslashes($_REQUEST['username']);
//escapes special chawracters in a string
$username = mysqli_real_escape_string($con, $username);
$email = stripslashes($_REQUEST['email']);
$email = mysqli_real_escape_string($con, $email);
$password = stripslashes($_REQUEST['password']);
$password = mysqli_real_escape_string($con, $password);
$create_datetime = date("Y-m-d H:i:s");
$query = "INSERT into `users` (username, password, email, create_datetime)
VALUES ('$username', '" . md5($password) . "', '$email', '$create_datetime')";
$result = mysqli_query($con, $query);
if ($result)
{
echo "<div class='form'>
<h3>You are registered successfully.</h3><br/>
<p class='link'>Click here to <a href='login.php'>Login</a></p>
</div>";
}
Else
{
echo "<div class='form'>
<h3>Required fields are missing.</h3><br/>
<p class='link'>Click here to <a href='registration.php'>registration</a> again.</p>
</div>";
}
}
else
{
?>
<form class="form" action="" method="post">
<h1 class="login-title">Registration</h1>
<input type="text" class="login-input" name="username" placeholder="Username" required />
<input type="text" class="login-input" name="email" placeholder="Email Adress">
<input type="password" class="login-input" name="password" placeholder="Password">
<input type="submit" name="submit" value="Register" class="login-button">
<p class="link">Already have an account? <a href="login.php">Login here</a></p>
</form>
<?php
}
?>
</body>
</html>

You might also like