summaryrefslogtreecommitdiff
path: root/share/frontend/imthresh/index.html
diff options
context:
space:
mode:
authoryo mama <pepper@scannerjammer.com>2016-10-01 13:56:42 -0700
committeryo mama <pepper@scannerjammer.com>2016-10-01 13:56:42 -0700
commit7f2f9bc05206afa66afe7d71d4f3484e39f40a34 (patch)
treecb05348cf7387b817dea58080efd34ca26b8bdd2 /share/frontend/imthresh/index.html
parentd9b7653700040bf25cb5681b5dc7021bc505d975 (diff)
added imthresh
Diffstat (limited to 'share/frontend/imthresh/index.html')
-rw-r--r--share/frontend/imthresh/index.html330
1 files changed, 330 insertions, 0 deletions
diff --git a/share/frontend/imthresh/index.html b/share/frontend/imthresh/index.html
new file mode 100644
index 0000000..292de01
--- /dev/null
+++ b/share/frontend/imthresh/index.html
@@ -0,0 +1,330 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8" />
+ <title>Photoblaster Concatenate</title>
+ <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
+ <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
+ <style type="text/css">
+ body{
+ line-height: 2em;
+ }
+ #result{
+ position:absolute;
+ top 0;
+ z-index:100;
+ height:700px;
+ width:1000px;
+ background-color: rgba(22,22,22,0.2);
+ }
+ form{
+ margin-left:10px;
+ }
+ .pb_links{
+ display: inline-block;
+ color: #797979;
+ }
+ a.pb_links:hover{
+ color: yellow;
+ }
+ #links{
+ border-bottom:1px solid black;
+ margin-bottom: 10px;
+ background-color: #222;
+ }
+ .btn{
+ margin-top: 10px;
+ background-color: gray;
+ border-color: #666;
+ -webkit-user-select:none;
+ -moz-user-select:none;
+ -ms-user-select:none;
+ user-select:none;
+ text-shadow: none;
+ -webkit-box-shadow: none;
+ -moz-box-shadow: none;
+ box-shadow: none;
+ }
+ .btn:hover, .btn:focus{
+ background-color: #444;
+ border-color: #666;
+ }
+ .btn:active{
+ background-color: #FFF600 !important;
+ border-color: #EFED2D !important;
+ }
+ .failure{
+ color:red;
+ }
+ .modal-body > img{
+ margin-left:5px;
+ width: 100%;
+ height: 100%;
+ border: 1px solid gray;
+ }
+ #final_image > a > img{
+ width: 100%;
+ }
+ #send_to_input{
+ margin-top: 10px;
+ }
+ .dontshowme{
+ display: none;
+ }
+ #error_message{
+ color: red;
+ }
+ .switcheroo {
+ width: 19px;
+ height:38px;
+ display: inline-block;
+ position: absolute;
+ background-image: url(http://i.asdf.us/im/7e/user_convo_1353562627_1355449919.png);
+ //background-image: url( http://i.asdf.us/im/7b/user_convo_1353562627.png);
+ background-repeat:no-repeat;
+ background-position: 3px 10px;
+ cursor: pointer;
+ }
+ .modal-footer{
+ border: none;
+ }
+ </style>
+ </head>
+ <body>
+ <div id="links">
+ <span class="pb_links">links:</span>
+ <a class="pb_links" href="http://asdf.us/im/gallery">gallery</a>
+ <a class="pb_links" href="http://asdf.us/im">pb</a>
+ <a class="pb_links" href="http://asdf.us/imgradient">imgradient</a>
+ <a class="pb_links" href="http://asdf.us/imgrid">imgrid</a>
+ <a class="pb_links" href="http://asdf.us/impattern">impattern</a>
+ <a class="pb_links" href="http://asdf.us/imlandscape">imlandscape</a>
+ <a class="pb_links" href="http://asdf.us/imbreak">imbreak</a>
+ <a class="pb_links" href="http://asdf.us/shader">shader</a>
+ <a class="pb_links" href="http://asdf.us/ascii">ascii</a>
+ </div>
+ <h1 id="logos">
+ <a href="">
+ <img src="img/logo-complete.png" />
+ </a>
+ </h1>
+ <!-- Modal -->
+ <div class="modal fade" id="myModal" role="dialog">
+ <div class="modal-dialog modal-lg">
+ <div class="modal-content">
+ <div class="modal-header">
+ <button type="button" class="close" data-dismiss="modal">&times;</button>
+ <h4 class="modal-title success dontshowme modal-info">Final Image:</h4>
+ <h4 class="modal-title failure dontshowme modal-info">Request Failed:</h4>
+ </div>
+ <div class="modal-body">
+ <div id="final_image" class="dontshowme modal-info">
+ <a target="_blank"> <img src="img/logo-complete.png" / ></a>
+ </div>
+ <div id="error_message" class="row col-md-10 dontshowme modal-info">
+ </div>
+
+ <div id="final_width" class="row col-md-10 dontshowme modal-info">
+ width: <span class="final_value"></span>
+ </div>
+ <div id="final_height" class="row col-md-10 dontshowme modal-info">
+ height: <span class="final_value"></span>
+ </div>
+ <div id="final_size" class="row col-md-10 dontshowme modal-info">
+ size: <span class="final_value">58</span>
+ </div>
+ <div id="final_url" class="row col-md-10 dontshowme modal-info">
+ url: <input type="text" class="final_value"></input>
+ </div>
+ <div id="send_to_input" class="row col-md-10 dontshowme modal-info">
+ <span id="sendtoinput" style="border: 1px solid gray; cursor: pointer;">&nbsp;send to input <img src="img/arrow_pointing_left.png">&nbsp;</span>
+ </div>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+ </div>
+ </div>
+ </div>
+ </div>
+ <form></form>
+ <div id="res" class="alert"></div>
+ <script type="text/javascript" src="deps/underscore.js"></script>
+ <script type="text/javascript" src="deps/opt/jsv.js"></script>
+ <script type="text/javascript" src="lib/jsonform.js"></script>
+ <script type="text/javascript">
+ $(document).ready(function(){
+ $('form').jsonForm({
+ "schema": {
+ "url": {
+ "type": "string",
+ "title": "Image Url:"
+ },
+ "threshold_type": {
+ "type": "string",
+ "title": "Match Frame Count To:",
+ "enum": [
+ "two-color",
+ "fuzzy",
+ "isodata",
+ "kapur",
+ "kmeans",
+ "local",
+ "otsu",
+ "ptile",
+ "sahoo",
+ "triangle"
+ ]
+ },
+ "username": {
+ "type": "string",
+ "title": "Username:"
+ }
+ },
+ "form": [
+ "*",
+ {
+ "type": "submit",
+ "title": "BINGO"
+ }
+ ],
+ "onSubmitValid": function (values) {
+ generatingOn()
+ $.ajax({
+ url: '/im/api/pbthresh',
+ type: 'post',
+ dataType: 'json',
+ data: $('form').serialize(),
+ success: function(data) {
+ showSuccess(data)
+ },
+ error: function(data){
+ showFailure(data)
+ }
+ });
+ }
+ });
+ function showSuccess(data){
+ $('.success').removeClass('dontshowme')
+ $('#final_image').find('img').attr("src", data.url)
+ $('#final_image').find('a').attr("href", data.url)
+ $('#final_width > .final_value').html(data.width)
+ $('#final_height > .final_value').html(data.height)
+ $('#final_size > .final_value').html(data.size.toString() + " bytes")
+ $('#final_url > .final_value').val(data.url)
+ $('#final_width, #final_height, #final_size, #final_url, #final_image, #send_to_input').removeClass('dontshowme')
+ $('#send_to_input').click(function(){
+ $('#jsonform-0-elt-img_url1').val(data.url)
+ generatingOff()
+ $('#myModal').modal('hide')
+ });
+ $('.modal').modal()
+ }
+ function showFailure(data){
+ var msg;
+ switch(data.status) {
+ case 405:
+ msg = "This type of request is not allowed."
+ break;
+ case 500:
+ msg = "Problem with the request. Please check your input parameters."
+ break;
+ case 400:
+ msg = data.responseJSON.message
+ reportError("hello")
+ break;
+ case 410:
+ msg = data.responseJSON.message
+ break;
+ default:
+ msg = "Request was unable to reach the server. Try Again?"
+ }
+ reportError(msg)
+ }
+ function generatingOn(){
+ resetModal()
+ $('form').find('input[type=submit]').prop('disabled', true);
+ $('#logos').find('img').attr("src", "img/generating.gif")
+ };
+ function generatingOff(){
+ resetModal()
+ $('form').find('input[type=submit]').prop('disabled', false);
+ $('#logos').find('img').attr("src", "img/logo-complete.png")
+ };
+ function reportError(msg){
+ $('.failure, #error_message').removeClass("dontshowme")
+ $('#error_message').html(msg)
+ $('#error_message').removeClass("dontshowme")
+ $('.modal').modal();
+ }
+ function resetModal(){
+ $('.modal-info').each(
+ function(el){
+ if (!$(this).hasClass("dontshowme")){
+ $(this).addClass("dontshowme")
+ }
+ }
+ )
+ }
+ $('.modal-content').find("button").click(function(){
+ generatingOff()
+ })
+ $('#myModal').on('hidden.bs.modal', function () {
+ generatingOff()
+ })
+ var switcheroo = ('<div class="switcheroo"></div>')
+ $('#jsonform-0-elt-img_url1, #jsonform-0-elt-frames_match, ' +
+ '#jsonform-0-elt-merge_direction, #jsonform-0-elt-dimensions_match').each(
+ function(el){
+ var that = this
+ $(switcheroo).insertAfter(
+ this
+ )
+ var my_switcheroo = $(this).next()
+ if ($(that).attr("id") == 'jsonform-0-elt-img_url1'){
+ $(my_switcheroo).css({
+ 'position': 'relative',
+ 'top': '50px'
+ })
+ }
+ $(my_switcheroo).click(function(el){
+ switch($(that).attr("id")){
+ case 'jsonform-0-elt-img_url1':
+ var url2 = $(that).val()
+ var url1 = $('#jsonform-0-elt-img_url2').val()
+ $(that).val(url1)
+ $('#jsonform-0-elt-img_url2').val(url2)
+ break;
+ case 'jsonform-0-elt-dimensions_match':
+ var dimensions = $('#jsonform-0-elt-dimensions_match').val() == 'smaller' ? 'larger' : 'smaller';
+ $('#jsonform-0-elt-dimensions_match').val(dimensions)
+ break;
+ case 'jsonform-0-elt-frames_match':
+ var dimensions = $('#jsonform-0-elt-frames_match').val() == 'shorter' ? 'longer' : 'shorter';
+ $('#jsonform-0-elt-frames_match').val(dimensions)
+ break;
+ case 'jsonform-0-elt-merge_direction':
+ var dimensions = $('#jsonform-0-elt-merge_direction').val() == 'right' ? 'down' : 'right';
+ $('#jsonform-0-elt-merge_direction').val(dimensions)
+ break;
+ default:
+ msg = "Request was unable to reach the server. Try Again?"
+ }
+ })
+ }
+ )
+ $("#jsonform-0-elt-resize_switch").css(
+ {
+ "display": "inline",
+ "margin-left": "10px",
+ "margin-top": "10px",
+ }
+ ).attr("checked", true)
+ $("#jsonform-0-elt-resize_switch").parent().css("display", "inline")
+ $("#jsonform-0-elt-resize_switch").parent().parent().css("display", "inline")
+ $("#jsonform-0-elt-resize_switch").parent().parent().parent().css("margin-top", "10px")
+ })
+
+ </script>
+ </body>
+</html>
generated by cgit v1.2.3-70-g09d2 (git 2.51.0) at 2026-01-04 10:46:53 +0000