Revolutionizing Software Efficiency with Web Technologies
Admin Binary CodeSoft
![Admin Binary CodeSoft]()
Admin Binary CodeSoft
[Engineering - IT] Projects, Software Technology & Training Courses
Presented by: Ayman Khoshouey
Date: December 3, 2024
领英推荐
<!DOCTYPE html>
<html>
<head>
<title>Graphical Y Calculation for Two Phase Flow using Lockhart MARTINELLI Curve </title>
<style>
#chart {
position: relative;
width: 1000px;
height: 1000px;
border: 1px solid black;
}
.curve {
position: absolute;
width: 2px;
height: 2px;
background-color: red;
}
</style>
</head>
<body>
<div id="chart"></div>
<script>
function drawCurve() {
const chart = document.getElementById('chart');
for (let i = 0; i <= 1000; i++) {
const y = Math.log10(i / 10 + 1) * 1000 / 2; // Example curve
const point = document.createElement('div');
point.className = 'curve';
point.style.left = `${i}px`;
point.style.bottom = `${y}px`;
chart.appendChild(point);
}
}
function findY(x) {
const chart = document.getElementById('chart');
for (let y = 0; y <= 1000; y++) {
const pixel = document.elementFromPoint(chart.offsetLeft + x, chart.offsetTop + 1000 - y);
if (pixel && pixel.className === 'curve') {
return y;
}
}
return null;
}
drawCurve();
const x = 599.485; // Example X position
const y = findY(x);
console.log(`Y value at X=${x} is approximately ${y}`);
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Valve Selection Form</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
line-height: 1.6;
display: flex;
flex-direction: row;
gap: 20px;
}
.form-container {
width: 60%;
}
.image-container {
width: 35%;
text-align: center;
border: 1px solid #ccc;
padding: 10px;
}
.form-group {
margin-bottom: 15px;
}
label {
display: block;
font-weight: bold;
}
select, input, button {
width: 100%;
padding: 8px;
margin-top: 5px;
}
.result {
margin-top: 20px;
font-size: 1.2em;
font-weight: bold;
color: green;
}
.image-container img {
max-width: 100%;
height: auto;
margin-top: 10px;
}
.hidden-api-table {
display: none;
}
.checkbox-container {
margin-bottom: 20px;
}
</style>
</head>
<body>
<div class="form-container">
<h1>Valve Selection Form</h1>
<form id="valveForm">
<div class="form-group">
<label for="operationType">Type of Operation:</label>
<select id="operationType" name="operationType">
<option value="onOff">On/Off</option>
<option value="control">Control</option>
<option value="safety">Safety</option>
</select>
</div>
<div class="form-group">
<label for="valveOperation">Valve Operation:</label>
<select id="valveOperation" name="valveOperation">
<option>Gas</option>
<option>Oil</option>
<option>Water</option>
<option>Air</option>
</select>
</div>
<div class="form-group">
<label for="fluidPressure">Fluid Pressure (bar):</label>
<input type="number" id="fluidPressure" name="fluidPressure">
<select id="pressureUnit" name="pressureUnit" onchange="convertPressure()">
<option value="ISO">Bar</option>
<option value="American">PSI</option>
</select>
<input type="text" id="convertedPressure" readonly placeholder="Converted pressure">
</div>
<div class="form-group">
<label for="temperature">Temperature (°C):</label>
<input type="number" id="temperature" name="temperature">
<select id="tempUnit" name="tempUnit" onchange="convertTemperature()">
<option value="ISO">Celsius</option>
<option value="American">Fahrenheit</option>
</select>
<input type="text" id="convertedTemperature" readonly placeholder="Converted temperature">
</div>
<div class="form-group">
<label for="flangeConnectionType">Flange Connection Type:</label>
<select id="flangeConnectionType" name="flangeConnectionType">
<option value="welded">Welded</option>
<option value="threaded">Threaded</option>
<option value="flanged">Flanged</option>
</select>
</div>
<div class="form-group">
<label for="flangeSize">Flange Size:</label>
<input type="number" id="flangeSize" name="flangeSize">
<select id="sizeUnit" name="sizeUnit" onchange="convertSize()">
<option value="ISO">Millimeters</option>
<option value="American">Inches</option>
</select>
<input type="text" id="convertedSize" readonly placeholder="Converted size">
</div>
<button type="button" onclick="ChattiisuggestValve()">Get Suggested Valve</button>
</form>
<div class="result" id="result"></div>
<div class="checkbox-container">
<input type="checkbox" id="showApiTable" onclick="toggleApiTable()">
<label for="showApiTable">Show API Table</label>
</div>
<div class="hidden-api-table" id="apiTable">
<table border="1" cellpadding="10">
<tr>
<th>Valve Type</th>
<th>API Standard</th>
<th>Materials</th>
<th>Pressure Ratings</th>
<th>Size Range</th>
</tr>
<tr>
<td>Gate Valve</td>
<td>API 600</td>
<td>Carbon Steel, Alloy Steel, Stainless Steel</td>
<td>150-2500</td>
<td>1/2" - 48"</td>
</tr>
<tr>
<td>Ball Valve</td>
<td>API 608</td>
<td>Carbon Steel, Alloy Steel, Stainless Steel</td>
<td>150-2500</td>
<td>1/2" - 36"</td>
</tr>
<tr>
<td>Butterfly Valve</td>
<td>API 609</td>
<td>Ductile Iron, Carbon Steel, Stainless Steel</td>
<td>150-600</td>
<td>2" - 48"</td>
</tr>
<tr>
<td>Relief Valve</td>
<td>API 526</td>
<td>Carbon Steel, Alloy Steel, Stainless Steel</td>
<td>150-2500</td>
<td>1/2" - 12"</td>
</tr>
<tr>
<td>Control Valve</td>
<td>API 609</td>
<td>Carbon Steel, Alloy Steel, Stainless Steel</td>
<td>150-2500</td>
<td>1/2" - 24"</td>
</tr>
</table>
</div>
</div>
<div class="image-container" id="imageContainer">
<h2>Valve Image</h2>
<img id="valveImage" src="" alt="No image selected">
</div>
<script>
function ChattiisuggestValve() {
const operationType = document.getElementById("operationType").value;
const valveOperation = document.getElementById("valveOperation").value;
const pressure = parseFloat(document.getElementById("fluidPressure").value);
const temperature = parseFloat(document.getElementById("temperature").value);
const flangeType = document.getElementById("flangeConnectionType").value;
let suggestedValve = "Unknown";
let imageFile = "";
// Valve suggestions based on type, operation, pressure, etc.
if (operationType === "onOff") {
if (valveOperation === "Gas") {
if (pressure <= 1500) {
suggestedValve = "Ball Valve (API 608)";
imageFile = "ball_valve.png";
} else if (valveOperation === "Water" && pressure <= 150) {
suggestedValve = "Gate Valve (API 600)";
imageFile = "gate_valve.png";
}
} else if (valveOperation === "Water") {
if (pressure <= 1000) {
suggestedValve = "Globe Valve (API 623)";
imageFile = "globe_valve.png";
} else {
suggestedValve = "Gate Valve (API 600)";
imageFile = "gate_valve.png";
}
}
} else if (operationType === "control") {
if (flangeType === "flanged") {
suggestedValve = "Butterfly Valve (API 609)";
imageFile = "butterfly_valve.png";
}
if (valveOperation === "Oil") {
if (temperature <= 100) {
suggestedValve = "Control Valve (API 609)";
imageFile = "control_valve.png";
} else {
suggestedValve = "Relief Valve (API 526)";
imageFile = "relief_valve.png";
}
} else {
suggestedValve = "Ball Valve (API 608)";
imageFile = "ball_valve.png";
}
} else if (operationType === "safety") {
if (pressure > 1500) {
suggestedValve = "Relief Valve (API 526)";
imageFile = "relief_valve.png";
} else {
suggestedValve = "Check Valve (API 594)";
imageFile = "check_valve.png";
}
}
// Display the suggested valve and image
const resultDiv = document.getElementById("result");
resultDiv.innerHTML = `Suggested Valve: ${suggestedValve}`;
const imageContainer = document.getElementById("imageContainer");
const valveImage = document.getElementById("valveImage");
if (imageFile) {
valveImage.src = imageFile;
imageContainer.style.display = "block";
} else {
imageContainer.style.display = "none";
}
}
// Toggle API Table visibility
function toggleApiTable() {
const apiTable = document.getElementById("apiTable");
apiTable.style.display = document.getElementById("showApiTable").checked ? "block" : "none";
}
// Temperature conversion function
function convertTemperature() {
const tempValue = parseFloat(document.getElementById("temperature").value);
const tempUnit = document.getElementById("tempUnit").value;
let convertedTemp;
if (tempUnit === "ISO") {
// Convert Celsius to Fahrenheit
convertedTemp = (tempValue * 9/5) + 32;
} else {
// Convert Fahrenheit to Celsius
convertedTemp = (tempValue - 32) * 5/9;
}
document.getElementById("convertedTemperature").value = convertedTemp.toFixed(2);
}
// Pressure conversion function
function convertPressure() {
const pressureValue = parseFloat(document.getElementById("fluidPressure").value);
const pressureUnit = document.getElementById("pressureUnit").value;
let convertedPressure;
if (pressureUnit === "ISO") {
// Convert Bar to PSI
convertedPressure = pressureValue * 14.5038;
} else {
// Convert PSI to Bar
convertedPressure = pressureValue / 14.5038;
}
document.getElementById("convertedPressure").value = convertedPressure.toFixed(2);
}
// Flange size conversion function
function convertSize() {
const sizeValue = parseFloat(document.getElementById("flangeSize").value);
const sizeUnit = document.getElementById("sizeUnit").value;
let convertedSize;
if (sizeUnit === "ISO") {
// Convert Millimeters to Inches
convertedSize = sizeValue / 25.4;
} else {
// Convert Inches to Millimeters
convertedSize = sizeValue * 25.4;
}
document.getElementById("convertedSize").value = convertedSize.toFixed(2);
}
</script>
</body>
</html>