Shell File Manager
<?php
include_once('init.php');
$log_status = $_GET['log_status'];
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title>CamScan FZCO : Lens Calculator</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="">
<meta name="keywords" content="">
<?php include_once('include/front_meta_head.php'); ?>
<link rel="stylesheet" href="lens_css/jquery.mobile-1.2.0.min.css" />
<script src="lens_js/jquery.mobile.js"></script>
<script src="lens_js/cameras.js"></script>
<script src="lens_js/axislenscalc.js"></script>
<link rel="stylesheet" href="lens_css/lens.css" />
<script type="text/javascript">
$(function() {
$('.ui-link-inherit').click(function() {
alert($(this).html());
})
});
</script>
</head>
<body>
<div data-role="page" id="calculator">
<div data-role="content" class="ui-body ui-body-c" style="background-color:#DDDDDD">
<h3>
<strong> <span class="left_it" style="color: #fed049">
Lens calculator for
</span> </strong>
<span class="cam-name space_it left_it">
</span>
<div class="ui-block-b left">
<a href="#camera-selector" id="change-link" data-role="button" data-transition="fade" data-rel="dialog" class="small-link floatright" data-inline="true" data-mini="true">
Change
</a>
</div>
<br>
</h3>
<br>
<div id="left-pos">
<div class="ui-block-a left">
Click the calculator icon next to the value you wish to calculate. Then drag sliders or enter values into fields to update results. Calculated results are shown on a yellow background.
</span>
<span id="help-fixedfocal">
The camera uses a fixed focal length lens. Drag the distance slider to calculate scene dimensions, or enter values into scene dimensions fields to calculate camera distance. Calculated results are shown on a yellow background.
</span>
<a href="#help-dialog" data-rel="popup" data-transition="flip" class="small-link" id="help-link"> <img src="../assets/img/lens/dialog.png" class="info-img" />
</a>
</p>
</div>
<br><br>
</div>
<br><br>
<div class="ui-body ui-body-b" data-theme="a" data-content-theme="a" id="sizes-container">
<p>
Scene dimensions and resolution:
<a id="sizes-link" href="#">
<img src="../assets/img/lens/calculator.png" width="25px" hight="25px" class="floatlock">
</a>
</p>
<div class="ui-grid-b">
<div class="ui-block-a" style="padding-right:0.2em; ">
<label for="s-width">
Width:
<a href="#error-dialog" data-rel="popup">
<img src="../assets/img/lens/error.png" class="sizewarn">
</a>
</label>
<input android:inputType="number" type="text" name="name" pattern="[0-9]*" id="s-width" value="25" data-mini="true" />
</div>
<div class="ui-block-b" style="padding-left:0.2em;padding-right:0.2em">
<label for="s-height">
Height:
<a href="#error-dialog" data-rel="popup">
<img src="../assets/img/lens/error.png" class="sizewarn">
</a>
</label>
<input android:inputType="number" type="text" name="name" pattern="[0-9]*" id="s-height" value="25" data-mini="true" />
</div>
<div class="ui-block-c" style="padding-left:0.2em;">
<label for="s-resolution">
Resolution:
<a href="#error-dialog" data-rel="popup">
<img src="../assets/img/lens/error.png" class="sizewarn">
</a>
</label>
<input android:inputType="number" type="text" name="name" pattern="[0-9]*" id="s-resolution" value="25" data-mini="true" />
</div>
</div>
<br />
<div class="ui-grid-a">
<div class="ui-block-a">
<a href="#resolution-dialog" id="resolution-link" data-role="button" data-inline="true" data-mini="true" data-rel="popup" data-transition="flip" class="small-link floatleft" data-icon="arrow-d" data-iconpos="right" style="background-color: #fed049">
Resolution:
<span id="res-btn-label">
</span>
</a>
</div>
</div>
<br />
<!-- Aspect ratio controls -->
</div>
<br />
<div class="ui-body ui-body-b" data-theme="a" data-content-theme="a" id="distance-container">
<label for="distance-slider">
<span id="distance-label">
Distance:
</span>
<a href="#units-dialog" data-rel="popup" data-transition="flip" class="small-link" id="units-link" style="color: #007580">
Units
</a>
<a href="#range-dialog" data-rel="popup" data-transition="flip" class="small-link" id="d-range-link" style="color: #007580">
Range
</a>
<a href="#error-dialog" data-rel="popup">
<img src="../assets/img/lens/error.png" class="sizewarn">
</a>
<a id="distance-link" href="#">
<img src="../assets/img/lens/calculator.png" width="25px" hight="25px" alt="Calculate the distance" class="floatlock">
</a>
</label>
<input type="range" pattern="[0-9]*" name="distance-slider" id="distance-slider" value="10" min="1" max="100" />
<br />
<!-- Distance slider -->
</div>
<br />
<div class="ui-body ui-body-b" data-theme="a" data-content-theme="a" id="focal-container">
<label for="focal-slider">
Focal length (mm):
<a href="#error-dialog" data-rel="popup">
<img src="../assets/img/lens/error.png" class="sizewarn">
</a>
FoV ~
<span id="angle">
</span>
°
<a href="#f-range-dialog" data-rel="popup" data-transition="flip" class="small-link" id="f-range-link" style="color: #007580">
Range
</a>
<a id="focal-link" href="#">
<img src="../assets/img/lens/calculator.png" width="25px" hight="25px" alt="Calculate focal length" class="floatlock">
</a>
</label>
<input type="range" pattern="[0-9]*" name="focal-slider" id="focal-slider" value="25" min="2" max="120" step="0.1" />
<br />
<!-- Angle slider -->
</div>
<div class="ui-body ui-body-b" data-theme="a" data-content-theme="a" id="focal-error-container" style="display:none">
<p>
The calculated focal length is outside the 1-120 mm range supported by the lens calculator
</p>
<a href="#" id="focal-reset" data-theme="c" data-role="button" class="small-link floatright" data-inline="true" data-mini="true">
Reset
</a>
</div>
<br />
<p>
<i>
Note: Individual variations of the field of view could exist, for example due to back focus adjustment and lens distortion. Plan with margins.
</i>
</p>
<!-- </form> -->
<div data-role="popup" id="units-dialog" data-theme="a" class="ui-content">
<p>
<span id="2-distance-label">
Select units:
</span>
</p>
<fieldset data-role="controlgroup" id="unit-selector" name="unit-selector">
<input type="radio" name="units" id="unit-1" value="m" checked="checked" />
<label id="unit-1-label" for="unit-1">
meters
</label>
<input type="radio" name="units" id="unit-2" value="ft" />
<label id="unit-2-label" for="unit-2">
feet
</label>
<input type="radio" name="units" id="unit-3" value="yd" />
<label id="unit-3-label" for="unit-3">
yards
</label>
</fieldset>
</div>
<div data-role="popup" id="range-dialog" data-theme="a" class="ui-content">
<p>
<span id="2-range-label">
Choose range:
</span>
</p>
<fieldset data-role="controlgroup" id="range-selector" name="range-selector">
<input type="radio" name="range" id="range-1" value="100" checked="checked" />
<label id="range-1-label" for="range-1">
1-100
</label>
<input type="radio" name="range" id="range-2" value="200" />
<label id="range-2-label" for="range-2">
1-200
</label>
<input type="radio" name="range" id="range-3" value="500" />
<label id="range-3-label" for="range-3">
1-500
</label>
<input type="radio" name="range" id="range-4" value="2000" />
<label id="range-4-label" for="range-4">
1-2000
</label>
</fieldset>
</div>
<div data-role="popup" id="resolution-dialog" data-theme="a" class="ui-content">
<p>
<span id="2-res-label">
Select resolution:
</span>
</p>
<fieldset data-role="controlgroup" id="res-selector" name="res-selector">
<input type="radio" name="res" id="res-1" value="1080p" checked="checked" />
<label id="res-1-label" for="res-1">
1080p
</label>
<input type="radio" name="res" id="res-2" value="720p" />
<label id="res-2-label" for="res-2">
720p
</label>
<input type="radio" name="res" id="res-3" value="VGA" />
<label id="res-3-label" for="res-3">
VGA
</label>
</fieldset>
</div>
<div data-role="popup" id="f-range-dialog" data-theme="a" class="ui-content">
<p>
<span id="2-f-range-label">
Choose range:
</span>
</p>
<fieldset data-role="controlgroup" id="f-range-selector" name="f-range-selector">
<input type="radio" name="f-range" id="f-range-1" value="1" checked="checked" />
<label id="f-range-1-label" for="f-range-1">
Supplied lens
</label>
<input type="radio" name="f-range" id="f-range-2" value="2" />
<label id="f-range-2-label" for="f-range-2">
1mm - 120mm
</label>
</fieldset>
<div class="ui-body ui-body-c ui-corner-all" data-theme="a" data-content-theme="a" id="warning-lens-not-replacable">
<br />
<p>
<img src="../assets/img/lens/error.png" width="25px" /> It is not possible to replace the supplied lens on
<span class="cam-name">
AXIS P3353 6mm
</span>
.
</p>
</div>
</div>
<div data-role="popup" id="error-dialog" data-theme="a" class="ui-content">
<div id="warning-obstructed">
<div class="ui-body ui-body-c ui-corner-all" data-theme="a" data-content-theme="a">
<img src="../assets/img/lens/error.png" />
<br />
<p>
The housing limits the field of view to
<span id="obstructed-FoV">
X
</span>
吏�.
</p>
</div>
<br />
</div>
<div id="warning-supplied-lens">
<div class="ui-body ui-body-c ui-corner-all" data-theme="a" data-content-theme="a">
<img src="../assets/img/lens/error.png" />
<br />
<p>
The supplied lens does not support the selected scene size at the given distance.
</p>
</div>
<br />
</div>
<div id="info-lens-link">
<div class="ui-body ui-body-c ui-corner-all" data-theme="a" data-content-theme="a">
<p>
<a href="#" target="_blank">
Click here for available accessory lenses.
</a>
</p>
</div>
<br />
</div>
<div id="warning-lens-not-replacable-2">
<div class="ui-body ui-body-c ui-corner-all" data-theme="a" data-content-theme="a">
<img src="../assets/img/lens/error.png" />
<br />
<p>
It is not possible to replace the supplied lens on
<span class="cam-name">
AXIS P3353 6mm
</span>
.
</p>
</div>
<br />
</div>
<a href="#calculator" data-role="button" data-theme="c">
OK
</a>
</div>
<!-- /popup - end of error dialog popup -->
<div data-role="popup" id="cam-error-dialog" data-theme="a" class="ui-content">
<p>
The specified camera cannot be found. Click "Change" to select camera.
</p>
<br />
<a href="#calculator" data-role="button" data-theme="c">
OK
</a>
</div>
<!-- /popup - end of cam error dialog popup -->
<div data-role="popup" id="help-dialog" class="ui-content">
<a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">
Close
</a>
<p>
<b>
Select camera model
</b>
by pressing the
<i>
Change
</i>
button.
</p>
<p>
If the camera uses a varifocal or zoom lens, a calculator icon is displayed in the top right corner of the
<i>
Scene dimensions and resolution
</i>
,
<i>
Distance
</i>
and
<i>
Focal length
</i>
fields. Click the calculator icon next to the value you wish to calculate.
</p>
<p>
<b>
Enter your given values
</b>
into the
<i>
Scene dimensions and resolution
</i>
fields, or drag the
<i>
Distance
</i>
or
<i>
Focal length
</i>
sliders. The results are continuously updated.
</p>
<p style="margin-left:20px;">
<b>
Note:
</b>
The scene width and scene height are kept in proportion by the camera's aspect ratio. Use the
<i>
Resolution
</i>
popup to select a different aspect ratio, if available.
</p>
<p style="margin-left:20px;">
<b>
Note:
</b>
The resolution is determined by the horizontal resolution of the camera sensor and the scene width. Therefore resolution will always change when scene width is changed, and scene width will always change when resolution is changed, regardless of camera distance and camera focal length.
</p>
<p style="margin-left:20px;">
<b>
Note:
</b>
The lens calculator displays a warning if the calculated focal length is outside the range supported by the camera's lens.
</p>
<p>
<b>
Select metric or imperial units
</b>
using the
<i>
Units
</i>
link next to the distance slider.
</p>
<p>
<b>
Change the range
</b>
for the
<i>
Distance
</i>
and
<i>
Focal length
</i>
sliders using the
<i>
Range
</i>
links.
</p>
</div>
</div>
<!-- /content -->
<div class="tooltip" id="units-tip">
Select units (m, ft or yards)
</div>
<div class="tooltip" id="d-range-tip">
Adjust the range for the distance slider
</div>
<div class="tooltip" id="f-range-tip">
Adjust the range for the focal length slider to allow for accessory lenses
</div>
<div class="tooltip" id="sizes-tip">
Click to calculate scene sizes and resolution
</div>
<div class="tooltip" id="distance-tip">
Click to calculate camera distance
</div>
<div class="tooltip" id="focal-tip">
Click to calculate focal length
</div>
<div class="tooltip" id="change-tip">
Click to change camera model
</div>
<div class="tooltip" id="resolution-tip">
Click to select a different resolution
</div>
<div class="tooltip" id="corridor-tip">
Click to toggle between 16:9 and 9:16 aspect ratios
</div>
<div class="tooltip" id="help-tip">
Click for more help
</div>
</div>
<!-- /page - end of calculator page -->
<!-- Start of camera selector page -->
<div data-role="page" id="camera-selector">
<div data-role="content" class="ui-body ui-body-b">
<ul data-role="listview" data-theme="g" id="camlistview" data-filter="true">
</ul>
</div>
<!-- /content -->
</div>
<!-- /page - end of camera selector page -->
<div style="clear:both"></div>
</body>
</html>
Shell File Manager Version 1.1, Coded By Shell
Email: [email protected]