summaryrefslogtreecommitdiff
path: root/share/frontend
diff options
context:
space:
mode:
Diffstat (limited to 'share/frontend')
-rw-r--r--share/frontend/imconcat/img/concat.pngbin3689 -> 1979 bytes
-rw-r--r--share/frontend/imconcat/img/generating.gifbin0 -> 198082 bytes
-rw-r--r--share/frontend/imconcat/img/logo-complete.pngbin0 -> 19794 bytes
-rw-r--r--share/frontend/imconcat/img/photoblaster.pngbin0 -> 3479 bytes
-rw-r--r--share/frontend/imconcat/index.html239
5 files changed, 146 insertions, 93 deletions
diff --git a/share/frontend/imconcat/img/concat.png b/share/frontend/imconcat/img/concat.png
index eb14906..fe751b7 100644
--- a/share/frontend/imconcat/img/concat.png
+++ b/share/frontend/imconcat/img/concat.png
Binary files differ
diff --git a/share/frontend/imconcat/img/generating.gif b/share/frontend/imconcat/img/generating.gif
new file mode 100644
index 0000000..a944dd8
--- /dev/null
+++ b/share/frontend/imconcat/img/generating.gif
Binary files differ
diff --git a/share/frontend/imconcat/img/logo-complete.png b/share/frontend/imconcat/img/logo-complete.png
new file mode 100644
index 0000000..eed5ef7
--- /dev/null
+++ b/share/frontend/imconcat/img/logo-complete.png
Binary files differ
diff --git a/share/frontend/imconcat/img/photoblaster.png b/share/frontend/imconcat/img/photoblaster.png
new file mode 100644
index 0000000..4d7a6df
--- /dev/null
+++ b/share/frontend/imconcat/img/photoblaster.png
Binary files differ
diff --git a/share/frontend/imconcat/index.html b/share/frontend/imconcat/index.html
index af18849..89a896b 100644
--- a/share/frontend/imconcat/index.html
+++ b/share/frontend/imconcat/index.html
@@ -2,12 +2,15 @@
<html>
<head>
<meta charset="utf-8" />
- <title>Getting started with JSON Form</title>
+ <title>Photoblaster Concatenate</title>
<!-- <link rel="stylesheet" style="text/css" href="deps/opt/bootstrap.css" />-->
<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;
@@ -21,20 +24,73 @@
}
.pb_links{
display: inline-block;
- font-size: 2em;
- color:active: #999999;
- color: #00000;
+ color: #797979;
+ }
+ a.pb_links:hover{
+ color: yellow;
}
#links{
border-bottom:1px solid black;
margin-bottom: 10px;
+ background-color: #222;
}
+// .logo-row{
+// display: inline;
+// }
+// div.logo-row{
+// max-width: 544px;
+// width: 544px;
+// }
+// img.logo-row{
+// vertical-align: top;
+// }
+// #logo-scratch{
+// position:relative;
+// top: -52px;
+// }
+// #logos{
+// width: 100%;
+//
+// }
+ .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%;
+ border: 1px solid gray;
+ }
+ #final_image > img{
+ width: 100%;
+ }
</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>
@@ -42,25 +98,36 @@
<a class="pb_links" href="http://asdf.us/imbreak">imbreak</a>
<a class="pb_links" href="http://asdf.us/shader">shader</a>
</div>
- <h1>
+ <h1 id="logos">
<a href="">
- <img src="img/logo.jpg" /></br><img src="img/concat.png" />
+ <img src="img/logo-complete.png" />
</a>
</h1>
- <h2>Small Modal</h2>
- <!-- Trigger the modal with a button -->
- <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Small Modal</button>
-
<!-- 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">Modal Header</h4>
+ <h4 class="modal-title success">Final Image:</h4>
+ <h4 class="modal-title failure">Request Failed:</h4>
</div>
<div class="modal-body">
- <p>This is a small modal.</p>
+ <div id="final_image">
+ <img src="img/logo-complete.png" / >
+ </div>
+ <div id="final_width" class="row col-md-10">
+ width: <span class="final_value">58</span>px
+ </div>
+ <div id="final_height" class="row col-md-10">
+ height: <span class="final_value">58</span>px
+ </div>
+ <div id="final_size" class="row col-md-10">
+ size: <span class="final_value">58</span>
+ </div>
+ <div id="final_url" class="row col-md-10">
+ url: <input type="text" class="final_value"></input>
+ </div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
@@ -68,46 +135,6 @@
</div>
</div>
</div>
-<div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
- <div class="modal-dialog" role="document">
- <div class="modal-content">
- <div class="modal-header">
- <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
- <h4 class="modal-title" id="gridSystemModalLabel">Modal title</h4>
- </div>
- <div class="modal-body">
- <div class="row">
- <div class="col-md-4">.col-md-4</div>
- <div class="col-md-4 col-md-offset-4">.col-md-4 .col-md-offset-4</div>
- </div>
- <div class="row">
- <div class="col-md-3 col-md-offset-3">.col-md-3 .col-md-offset-3</div>
- <div class="col-md-2 col-md-offset-4">.col-md-2 .col-md-offset-4</div>
- </div>
- <div class="row">
- <div class="col-md-6 col-md-offset-3">.col-md-6 .col-md-offset-3</div>
- </div>
- <div class="row">
- <div class="col-sm-9">
- Level 1: .col-sm-9
- <div class="row">
- <div class="col-xs-8 col-sm-6">
- Level 2: .col-xs-8 .col-sm-6
- </div>
- <div class="col-xs-4 col-sm-6">
- Level 2: .col-xs-4 .col-sm-6
- </div>
- </div>
- </div>
- </div>
- </div>
- <div class="modal-footer">
- <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
- <button type="button" class="btn btn-primary">Save changes</button>
- </div>
- </div><!-- /.modal-content -->
- </div><!-- /.modal-dialog -->
-</div><!-- /.modal -->
<form></form>
<div id="res" class="alert"></div>
<script type="text/javascript" src="deps/underscore.js"></script>
@@ -115,48 +142,74 @@
<script type="text/javascript" src="lib/jsonform.js"></script>
<script type="text/javascript">
$(document).ready(function(){
- $('.modal').modal();
+ $('.modal').modal();
+ $('form').jsonForm({
+ "schema": {
+ "image_url1": {
+ "type": "string",
+ "title": "Image Url 1:"
+ },
+ "image_url2": {
+ "type": "string",
+ "title": "Image Url 2:"
+ },
+ "dimensions_match": {
+ "type": "string",
+ "title": "Match Dimensions To:",
+ "enum": [ "smaller", "larger" ]
+ },
+ "frames_match": {
+ "type": "string",
+ "title": "Match Frame Count To:",
+ "enum": [ "shorter", "longer" ]
+ },
+ "merge_direction": {
+ "type": "string",
+ "title": "Merge Direction:",
+ "enum": [ "right", "down" ]
+ },
+ "finalformat": {
+ "type": "string",
+ "title": "Final Image Format:",
+ "enum": [ "gif", "jpg", "png" ]
+ },
+ "username": {
+ "type": "string",
+ "title": "Username:"
+ }
+ },
+ "form": [
+ "*",
+ {
+ "type": "submit",
+ "title": "BINGO"
+ }
+ ],
+ "onSubmitValid": function (values) {
+ is_generating()
+ $.ajax({
+ url: 'some-url',
+ type: 'post',
+ dataType: 'json',
+ data: $('form').serialize(),
+ success: function(data) {
+ showSuccess(data)
+ },
+ failure: showFaliure(data)
+ });
+ }
+ });
+ function showSuccess(data){
+ $('.modal').modal();
+ }
+ function showFailure(data){
+ $('.modal').modal();
+ }
+ function generatingOn(){
+ };
+ function generatingOff(){
+ };
})
- $('form').jsonForm({
- "schema": {
- "image_url1": {
- "type": "string",
- "title": "Image Url 1:"
- },
- "image_url2": {
- "type": "string",
- "title": "Image Url 2:"
- },
- "dimensions_match": {
- "type": "string",
- "title": "Match Dimensions To:",
- "enum": [ "smaller", "larger" ]
- },
- "frames_match": {
- "type": "string",
- "title": "Match Frame Count To:",
- "enum": [ "shorter", "longer" ]
- },
- "merge_direction": {
- "type": "string",
- "title": "Merge Direction:",
- "enum": [ "right", "down" ]
- },
- "finalformat": {
- "type": "string",
- "title": "Merge Direction:",
- "enum": [ "gif", "jpg", "png" ]
- },
- "username": {
- "type": "string",
- "title": "Username:"
- }
- },
- "onSubmitValid": function (values) {
- // "values" follows the schema, yeepee!
- console.log(values);
- }
- });
</script>
</body>
generated by cgit v1.2.3-70-g09d2 (git 2.51.0) at 2025-12-19 20:43:56 +0000