Page Menu
Home
c4science
Search
Configure Global Search
Log In
Files
F107128988
edit.html
No One
Temporary
Actions
Download File
Edit File
Delete File
View Transforms
Subscribe
Mute Notifications
Award Token
Subscribers
None
File Metadata
Details
File Info
Storage
Attached
Created
Sat, Apr 5, 01:14
Size
7 KB
Mime Type
text/html
Expires
Mon, Apr 7, 01:14 (7 h, 3 m)
Engine
blob
Format
Raw Data
Handle
25346808
Attached To
rDESUTOPLATFORM Desuto Platform
edit.html
View Options
<!--
Page to edit an image
-->
<!DOCTYPE html>
<html>
<head>
<base href="/retrieval/">
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="css/edit-sober.css"/>
<link rel="stylesheet" href="css/caman.css"/>
<link href='//fonts.googleapis.com/css?family=Rancho' rel='stylesheet' type='text/css'>
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
<!-- Configuration -->
<script src="js/config/config.js"></script>
<!-- jQuery (local) -->
<script src="js/vendor/jquery-1.10.2.min.js"></script>
<script src="js/vendor/jquery-libs/jquery.migrate-1.1.1.js"></script>
<script src="js/vendor/jquery-libs/jquery.imagemapster.js"></script>
<script src="js/vendor/underscore-min.js"></script>
<script src="js/vendor/caman.full.js"></script>
<script src="js/vendor/getImageData.js"></script>
<script src="js/edit/edit.js"></script>
<script>
//Actions to do when the page is loading
$(function() {
var imageID = getParameterByName("id");
imageID = imageID.substring(imageID.lastIndexOf("/") + 1, imageID.lastIndexOf("."));
//get article url (if available)
$.getJSON(config.getArticleForImageURL, {
"imageID": imageID,
"indexID": config.articlesLuceneIndexID,
}, function(data) {
if(Object.keys(data).length !== 0 && data.hasOwnProperty("url") && data.url !== ""){
var linkElement = $("<a><i class='fa fa-file-text-o'></i> Go To Article</a>").attr("href", data.url).attr("target", "_blank");
$("#gotoArticle").append(linkElement);
}
});
//get the value of the parameter id in the URL
var idImageDetail = getParameterByName("id");
updateCanvas();
// Set the source of the canvas image to the current URL
$('#example').attr({'src': idImageDetail});
addImageOnCanvas('example');
/* Required for importing images from another domain */
/*$.getImageData({url: idImageDetail,
success: function(image) {
$('#example').attr({'src': image.src});
addImageOnCanvas('example');
}
});*/
});
</script>
</head>
<body id="bodyEdition">
<!-- Div with the content -->
<div id="content">
<!-- Div with the image to edit -->
<div id="editionImage">
<div id="editionOverlay"><img src="img/loader-white-32.gif" /></div>
<img
id="example"
class="unselectable"
src="//placeholdit.imgix.net/~text?txtsize=33&txt=loading...&w=300&h=300"
>
<div id="gotoArticle"></div>
</div>
<!-- Div with all tools to edit the image -->
<div id="editionTools">
<div id="Filters">
<div class="Filter">
<div class="FilterName">
<p>brightness</p>
</div>
<div class="FilterSetting">
<input
type="range"
id="slider1"
min="-100"
max="100"
step="1"
value="0"
data-filter="brightness"
>
<span id="sliderCaption1" class="FilterValue">0</span>
</div>
</div>
<div class="Filter">
<div class="FilterName">
<p>contrast</p>
</div>
<div class="FilterSetting">
<input
type="range"
id="slider2"
min="-100"
max="100"
step="1"
value="0"
data-filter="contrast"
>
<span id="sliderCaption2" class="FilterValue">0</span>
</div>
</div>
<div class="Filter">
<div class="FilterName">
<p>saturation</p>
</div>
<div class="FilterSetting">
<input
type="range"
id="slider3"
min="-100"
max="100"
step="1"
value="0"
data-filter="saturation"
>
<span id="sliderCaption3" class="FilterValue">0</span>
</div>
</div>
<div class="Filter">
<div class="FilterName">
<p>vibrance</p>
</div>
<div class="FilterSetting">
<input
type="range"
id="slider4"
min="-100"
max="100"
step="1"
value="0"
data-filter="vibrance"
>
<span id="sliderCaption4" class="FilterValue">0</span>
</div>
</div>
<div class="Filter">
<div class="FilterName">
<p>exposure</p>
</div>
<div class="FilterSetting">
<input
type="range"
id="slider5"
min="-100"
max="100"
step="1"
value="0"
data-filter="exposure"
>
<span id="sliderCaption5" class="FilterValue">0</span>
</div>
</div>
</div>
<!-- A div with a reset button, to put all value to zero -->
<div id="resetButtonDiv">
<button onclick="reset();">Reset</button>
</div>
</div>
</div>
</body>
</html>
Event Timeline
Log In to Comment