Skip to content

Tenzing / pdf-customizer

Go to a project
Toggle navigation
Toggle navigation pinning
6511af0d by Jeff Balicki
Options

stage one complete

1 parent 2adbdfda
Inline Side-by-side
Showing 2 changed files with 55 additions and 22 deletions
......@@ -35,7 +35,8 @@ class pdfModel extends Model
->join('changesPDF', 'PDF_idPDF', '=', 'idPDF')
->join('stylesPDF', 'stylesPDF_idstylesPDF', '=', 'idstylesPDF')
->join('change_typePDF', 'idchange_typePDF', '=', 'change_typePDF_idchange_typePDF')
->where('PDF.idPDF','=', $id);
->where('PDF.idPDF','=', $id)
->orderBy('changesPDF.order', 'asc');
return $rows;
......
var pluginUrl = "http://localhost:8888/Forms";
var pdf_customizer = "http://localhost:8888/pdf-customizer/public";
// var pluginUrl = "http://localhost:8888/Forms";
// var pdf_customizer = "http://localhost:8888/pdf-customizer/public";
// var pluginUrl = "http://contact.gotenzing.com";
// var pdf_customizer = "http://pdf-customizer.synapsus.co";
var pluginUrl = "http://contact.gotenzing.com";
var pdf_customizer = "http://pdf-customizer.synapsus.co";
function getAuth() {
......@@ -64,12 +64,14 @@
});
}
function ShowBox(pheight, pwidth,up, right, height, width, example) {
function ShowBox(pheight, pwidth,up, right, height, width, count, example) {
jQuery(document).ready(function($) {
$('span').hide();
$('#span'+count).show();
$('#Canvas').css("background-image", "url(" + pdf_customizer + '/fileentry/getImage/' +example+")");
var Qc = document.getElementById("Canvas");
var Qctx = Qc.getContext("2d");
Qctx.clearRect(0, 0, Qc.width, Qc.height);
......@@ -101,9 +103,9 @@
function HideBox() {
jQuery(document).ready(function($) {
$('span').hide();
var cnv = document.getElementById("Canvas");
var ctx = cnv.getContext('2d'); // gets reference to canvas context
ctx.beginPath(); // clear existing drawing paths
......@@ -200,32 +202,33 @@
var pdflist = "";
var pdfChange = "";
var f = 0;
pdflist += '<div class="column" style="position: static; width: 212px; height: 10px; display: block; vertical-align: baseline; float: left;">';
pdflist += '<div id="pdfPreview" class="column">';
// pdflist += '<img id="pdfimage" src="' + pdf_customizer + '/fileentry/getImage/' + json[0].folder + '/' + json[0].example + '" width="300px">';
pdflist += '<canvas id="Canvas" width="252px" height="504px" style=" margin-top:60px; border-style: solid; background-image: url(' + pdf_customizer + '/fileentry/getImage/' + json[0].folder + '/' + json[0].example + '); background-size:252px 504px;"></div>';
pdfChange += '<form id="changes" name="changes" enctype="multipart/form-data" action="#" METHOD="POST"><h4>' + json[0].name + '</h4>';
pdflist += '<canvas id="Canvas" width="252px" height="504px" style=" margin-top:60px; border-style: solid; border-width:1px; background-image: url(' + pdf_customizer + '/fileentry/getImage/' + json[0].folder + '/' + json[0].example + '); background-size:252px 504px;"></div>';
pdfChange += '<form id="changes" name="changes" enctype="multipart/form-data" action="" METHOD="POST"><h4>' + json[0].name + '</h4>';
pdfChange += '<input type="hidden" id="id" name="id" value="' + json[0].idPDF + '">';
for (i = 0; i < json.length; ++i) {
var example = json[0].folder + '/' +json[i].example
if (json[i].change_type == "textflow") {
pdfChange += json[i].names + ': <textarea onfocus="ShowBox('+json[0].pheight+','+json[0].pwidth+','+ json[i].locationUp+','+json[i].locationRight+','+json[i].height+','+json[i].width + ',\''+ example + '\')" title="' + json[i].names + '" id="changescontent'+[f]+'" class="textarea" value="' + json[i].content + '" name="content">' + json[i].content + '</textarea>';
pdfChange += json[i].names + ': <textarea onfocus="ShowBox('+json[0].pheight+','+json[0].pwidth+','+ json[i].locationUp+','+json[i].locationRight+','+json[i].height+','+json[i].width +','+ i + ',\''+ example + '\')" title="' + json[i].names + '" id="changescontent'+[f]+'" class="textarea" value="' + json[i].content + '" name="content">' + json[i].content + '</textarea>';
++f
}
if (json[i].change_type == "text") {
pdfChange += json[i].names + ': <input onfocusout="HideBox()" onfocus="ShowBox('+json[0].pheight+','+json[0].pwidth+','+ json[i].locationUp+','+json[i].locationRight+','+json[i].height+','+json[i].width +',\''+ example + '\')" title="' + json[i].names + '" id="changescontent" type="text" name="content" value="' + json[i].content + '"">';
pdfChange += json[i].names + ': <input onfocusout="HideBox()" onfocus="ShowBox('+json[0].pheight+','+json[0].pwidth+','+ json[i].locationUp+','+json[i].locationRight+','+json[i].height+','+json[i].width +','+ i + ',\''+ example + '\')" title="' + json[i].names + '" id="changescontent" type="text" name="content" value="' + json[i].content + '"">';
}
if (json[i].change_type == "img") {
pdfChange += json[i].names + ': <input onfocusout="HideBox()" onfocus="ShowBox('+json[0].pheight+','+json[0].pwidth+','+ json[i].locationUp+','+json[i].locationRight+','+json[i].height+','+json[i].width + ',\''+ example + '\')" title="' + json[i].names + '" class="fileupload" id="changescontent" style="display: block; box-sizing: border-box; width: 100%; height: 2.4375rem; padding: .5rem; border: 1px solid #cacaca; margin: 0 0 1rem; font-family: inherit; font-size: 1rem; color: #8a8a8a; background-color: #fefefe; box-shadow: inset 0 1px 2px rgba(10,10,10,.1); border-radius: 0; transition: box-shadow .5s,border-color .25s ease-in-out; -webkit-appearance: none; -moz-appearance: none;" type="file" name="content" >';
pdfChange += json[i].names + ': <input onfocusout="HideBox()" onfocus="ShowBox('+json[0].pheight+','+json[0].pwidth+','+ json[i].locationUp+','+json[i].locationRight+','+json[i].height+','+json[i].width +','+ i + ',\''+ example + '\')" title="' + json[i].names + '" class="fileupload" id="changescontent" style="display: block; box-sizing: border-box; width: 100%; height: 2.4375rem; padding: .5rem; border: 1px solid #cacaca; margin: 0 0 1rem; font-family: inherit; font-size: 1rem; color: #8a8a8a; background-color: #fefefe; box-shadow: inset 0 1px 2px rgba(10,10,10,.1); border-radius: 0; transition: box-shadow .5s,border-color .25s ease-in-out; -webkit-appearance: none; -moz-appearance: none;" type="file" name="content" >';
}
pdfChange += '<span id="span'+i+'">'+json[i].tips+'</span><br/>';
}
pdfChange += '<input type="submit" value="Submit">';
pdfChange += '</form>';
strVar2 += ' <div class="callout primary"><div class="row column"><h1>Welcome to Synapsus Online PDF Editor</h1>';
strVar2 += '<p class="lead">Please make your changes or return <a href="#" onclick="location.reload();">back to the list</a></p>';
strVar2 += ' </div></div><div class="row small-up-2 medium-up-3 large-up-3">';
strVar2 += pdflist + '<div class="column" style="margin-left:300px; width:300px;">' + pdfChange + '</div></div><div style="height: 200px; margin-top: 50px;padding: 10px;position: relative;"></div>';
strVar2 += ' </div></div><div id="wrapper" class="row small-up-2 medium-up-3 large-up-3">';
strVar2 += pdflist + '<div id="changesColumn" class="column" >' + pdfChange + '</div><div id="pdfFooter"></div></div>';
......@@ -234,12 +237,41 @@
jQuery(function($) {
$("#Canvas").stick_in_parent();
var stickySidebar = $('#pdfPreview');
if (stickySidebar.length > 0) {
var stickyHeight = stickySidebar.height(),
sidebarTop = stickySidebar.offset().top;
}
// on scroll move the sidebar
$(window).scroll(function () {
if (stickySidebar.length > 0) {
var scrollTop = $(window).scrollTop();
if (sidebarTop < scrollTop) {
stickySidebar.css('top', scrollTop - sidebarTop);
// stop the sticky sidebar at the footer to avoid overlapping
var sidebarBottom = stickySidebar.offset().top + stickyHeight,
stickyStop = $('#changesColumn').offset().top + $('#changesColumn').height();
if (stickyStop < sidebarBottom) {
var stopPosition = $('#changesColumn').height() - stickyHeight;
stickySidebar.css('top', stopPosition);
}
}
else {
stickySidebar.css('top', '0');
}
}
});
$(window).resize(function () {
if (stickySidebar.length > 0) {
stickyHeight = stickySidebar.height();
}
});
......@@ -285,7 +317,7 @@
if (el.id)
document.getElementById(el.id).value = el.getContent();
console.log(el.id);
///console.log(el.id);
tinymce.get(el.id).remove();
......