Update interface script.

-  //var pluginUrl = "http://localhost:8888/Forms";
-  //var pdf_customizer = "http://localhost:8888/pdf-customizer/public";
+//var pluginUrl = "http://contact-form.dev";
+//var pdf_customizer = "http://pdf-customizer.dev/public";
 
-  var pluginUrl = "http://contact.gotenzing.com";
-  var pdf_customizer = "http://pdf-customizer.synapsus.co";
-
-  function getAuth() {
+var pluginUrl = "http://contact.gotenzing.com";
+var pdf_customizer = "http://pdf-customizer.synapsus.co";
 
+function getAuth() {
   jQuery(document).ready(function($) {
-
     var settings = {
       "async": true,
       "crossDomain": true,
@@ -24,38 +22,26 @@
         //alert(xhr.status);
         document.getElementById('contentArea').innerHTML = xhr.responseText;
       }
-
-          }
+    };
 
     $.ajax(settings).done(function(response) {
       console.log(response);
       token = response;
     });
-          
   });
-
-  }
-
-
-
-
-  function offFocus(id) {
+}
 
 
+function offFocus(id) {
   jQuery(document).ready(function($) {
-
-
     $("#select" + id + "").removeClass("focus");
     $(".entry_block").mouseleave(function() {
       $("#select" + id + "").addClass("focus");
     });
   });
-  }
-
-
-  function ShowBox(pheight, pwidth, up, right, height, width, count, example) {
-
+}
 
+function ShowBox(pheight, pwidth, up, right, height, width, count, example) {
   jQuery(document).ready(function($) {
     $('span').hide();
     $('#span' + count).show();
@@ -66,8 +52,6 @@
     Qctx.clearRect(0, 0, Qc.width, Qc.height);
     Qctx.restore();
 
-
-
     var down = pheight - (up + height);
     var scaleH = $("Canvas").height() / pheight;
     var scaleW = $("Canvas").width() / pwidth;
@@ -85,24 +69,20 @@
     ctx.stroke();
     //console.log(pheight, pwidth,up, right, height, width);
     // console.log(myrect )
-
-
-
   });
-
-  }
+}
 
 
 function SetFocus(i) {
   jQuery(document).ready(function($) {
-    $("label#focusButton"+i).css({"border": "2px solid #F7A800 !important"});
-    console.log($("label#focusButton"+i));
+    $("label#focusButton" + i).css({"border": "2px solid #F7A800 !important"});
+    console.log($("label#focusButton" + i));
 
   });
 }
 
 
-  function HideBox() {
+function HideBox() {
   jQuery(document).ready(function($) {
     $('span').hide();
 
@@ -112,9 +92,9 @@ function SetFocus(i) {
     ctx.save(); // store the current transformation matrix
   });
 
-  }
+}
 
-  function HideBoxwithdate() {
+function HideBoxwithdate() {
   jQuery(document).ready(function($) {
     var cnv = document.getElementById("Canvas");
     var ctx = cnv.getContext('2d'); // gets reference to canvas context
@@ -122,77 +102,51 @@ function SetFocus(i) {
     ctx.save(); // store the current transformation matrix
   });
 
-  }
-
-
+}
 
-  function getJson(user_id) {
 
+function getJson(user_id) {
   jQuery(document).ready(function($) {
-
     $.getJSON("" + pdf_customizer + "/api/v1/get-list/" + user_id, function(data) {
       // Get the element with id summary and set the inner text to the result.
       var json = JSON.stringify(data);
       pickPdfFromList(json);
-
     });
-
-
-
   });
-  }
-
-  function getOneJson(id) {
+}
 
+function getOneJson(id) {
   jQuery(document).ready(function($) {
-
     $.getJSON("" + pdf_customizer + "/api/v1/get-pdf-google/" + id, function(data) {
       // Get the element with id summary and set the inner text to the result.
       var json = JSON.stringify(data);
 
       changePdfOptions(json);
-
     });
-
-
-
   });
-  }
+}
 
-  function pickPdfFromList(json) {
+function pickPdfFromList(json) {
+  jQuery(document).ready(function($) {
     json = JSON.parse(json);
 
-
-
-
     var strVar = "";
-
-
     var i;
     var pdflist = "";
     for (i = 0; i < json.length; ++i) {
       pdflist += '<div class="column">';
-          pdflist += '<a href="#" onclick="getOneJson(' + json[i].idPDF + ');"> <img class="thumbnail" src="' + pdf_customizer + '/fileentry/getImage/' + json[i].folder + '/' + json[i].image + '" height="270px"></a>';
+      pdflist += '<a href="#" onclick="getOneJson(' + json[i].idPDF + ');"><img class="thumbnail" src="' + pdf_customizer + '/fileentry/getImage/' + json[i].folder + '/' + json[i].image + '" height="270px"></a>';
       pdflist += " <h5>" + json[i].name + "</h5>";
       pdflist += "</div>";
     }
 
-
     strVar += ' <div class="callout primary"><div class="row column"> <h1 class="pdfeditortitle">CUBOS COLLATERAL MATERIAL</h1>';
     strVar += ' ';
-
-
-
-
     document.getElementById('contentArea').innerHTML = strVar;
+  });
+}
 
-
-
-
-  }
-
-
-  function changePdfOptions(json) {
+function changePdfOptions(json) {
   jQuery(function($) {
     json = JSON.parse(json);
     $(document).ready(function() {
@@ -213,41 +167,35 @@ function SetFocus(i) {
       $("#changes").validate();
     });
 
-
-
     var strVar2 = "";
-
-
     var pdflist = "";
     var pdfChange = "";
     var f = 0;
 
-
     var scaleImage = 400 / json[0].pwidth;
     var imageHeight = json[0].pheight * scaleImage;
     var imageWidth = '400';
     console.log(json[0].pheight, scaleImage, imageHeight);
 
-
     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="' + imageWidth + '" height="' + imageHeight + '" 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:' + imageWidth + 'px  ' + imageHeight + 'px"></div>';
     pdfChange += '<form id="changes" name="changes" enctype="multipart/form-data" action=""  METHOD="POST"></br><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
+      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 + ',' + i + ',\'' + example + '\')"  id="changescontent' + [f] + '" class="textarea required"   value="' + json[i].content + '" name="content[' + i + ']">' + json[i].content + '</textarea>';
-                  ++f
+        ++f;
         pdfChange += '<span id="span' + i + '">' + json[i].tips + '</span><br/>';
       }
       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 + ',' + i + ',\'' + example + '\')"  id="changescontent['+i+']" type="text" class="required"   name="content[' + i + ']" 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 + '\')"  id="changescontent[' + i + ']" type="text" class="required"   name="content[' + i + ']" value="' + json[i].content + '"">';
         pdfChange += '<span id="span' + i + '">' + json[i].tips + '</span><br/>';
       }
       if (json[i].change_type == "img") {
-                  pdfChange += json[i].names + ':<label id="focusButton' + i + '" class="custom-file-input"><input onfocusout="HideBox()"  onfocus="SetFocus('+i+'), ShowBox(' + json[0].pheight + ',' + json[0].pwidth + ',' + json[i].locationUp + ',' + json[i].locationRight + ',' + json[i].height + ',' + json[i].width + ',' + i + ',\'' + example + '\')"  class="fileupload upload required"  id="changescontent[' + i + ']"   type="file" name="content[' + i + ']"  ></label>';
+        pdfChange += json[i].names + ':<label id="focusButton' + i + '" class="custom-file-input" tabindex="0"><input tabindex="-1" onfocusout="HideBox()"  onfocus="SetFocus(' + i + '), ShowBox(' + json[0].pheight + ',' + json[0].pwidth + ',' + json[i].locationUp + ',' + json[i].locationRight + ',' + json[i].height + ',' + json[i].width + ',' + i + ',\'' + example + '\')"  class="fileupload upload required"  id="changescontent[' + i + ']"   type="file" name="content[' + i + ']"  ><span class="file-button"><span class="file-name file-button"></span><strong>Browse</strong></span></label>';
         pdfChange += '<span id="span' + i + '">' + json[i].tips + '</span><br/>';
       }
       if (json[i].change_type == "date") {
@@ -264,17 +212,11 @@ function SetFocus(i) {
     strVar2 += ' </div></div><div id="wrapper" class="black small-up-2 medium-up-3 large-up-3">';
     strVar2 += pdflist + '<div id="changesColumn" style="height:' + $("#changes").height() + ';" class="column" >' + pdfChange + '<div id="tezingLogo"></div></div><div id="pdfFooter"></div></div>';
 
-
-
     document.getElementById('contentArea').innerHTML = strVar2;
     document.getElementById('google_drive').innerHTML = " ";
 
-
-
-
     if ($(window).width() > 700) {
 
-
       $('#pdfPreview').css('position', 'relative');
       var stickySidebar = $('#pdfPreview');
 
@@ -309,47 +251,69 @@ function SetFocus(i) {
           stickyHeight = stickySidebar.height();
         }
       });
-
-
     }
 
-          tinymce.init({
+    var tinymces = tinymce.init({
       selector: '.textarea',
       entity_encoding: "raw",
       menubar: false,
       toolbar: ' bold italic',
       remove_linebreaks: false,
       remove_trailing_brs: false,
-              
-
+      init_instance_callback: function(editor) {
+        var editorDoc = document.getElementById(editor.id + '_ifr');
+        var editorDocContent = editorDoc.contentDocument;
+        editorDoc.style.border = "2px solid #131212";
+        editorDocContent.body.style.backgroundColor = "#131212";
+        editorDocContent.body.style.color = "#ccc";
+      },
       setup: function(editor) {
         editor.on('focus', function(e) {
           console.log(editor.id);
-                      $('#' + editor.id).trigger("onfocus");
-                      $(this).css('border', '2px solid #F7A800 !important');
+
+          var editorDoc = document.getElementById(editor.id + '_ifr');
+          var editorDocContent = editorDoc.contentDocument;
+          editorDoc.style.border = "2px solid #F7A800";
+
+          //$('#' + editor.id).trigger("focus");
+          //$(this).css('border', '2px solid #F7A800 !important');
         });
-                  editor.on('focusout', function(e) {
-                      //  console.log('out'+editor.id);
-                      $(this).css('border', '0px solid #F7A800 !important');
-                      HideBox();
+        editor.on('blur', function(e) {
+          console.log('out' + editor.id);
+          var editorDoc = document.getElementById(editor.id + '_ifr');
+          var editorDocContent = editorDoc.contentDocument;
+          editorDoc.style.border = "2px solid #131212";
+
+          //$(this).css('border', '0px solid #F7A800 !important');
+          //HideBox();
         });
       }
-
-
-
     });
 
     var files;
-          var imagefiles = [];;
-
+    var imagefiles = [];
 
     $(".fileupload").change(function(e) {
+      var target = e.target;
       files = e.target.files;
+      console.log(files);
+
+      if(files.length >= 1) {
         for (var i = 0, file; file = files[i]; i++) {
-                  //console.log(file);
+          var fileName = file.name;
+          // insert file name
+          if(fileName) {
+            $(target).parent('label').find('.file-name').text(fileName);
+          } else {
+            $(target).parent('label').find('.file-name').text('');
+          }
+
           imagefiles.push(file);
           // console.log(imagefiles);
         }
+      } else {
+        $(target).parent('label').find('.file-name').text('');
+      }
     });
 
 
@@ -377,10 +341,10 @@ function SetFocus(i) {
 
   });
 
-  }
+}
 
 
-  function returnfileOptions(files, form) {
+function returnfileOptions(files, form) {
   jQuery(function($) {
 
     var data = new FormData();
@@ -414,14 +378,10 @@ function SetFocus(i) {
     });
 
   });
-  }
-
-
-  function returnOptions(form) {
-
-
+}
 
 
+function returnOptions(form) {
   jQuery(function($) {
 
     $.getJSON("" + pdf_customizer + "/api/v1/get-pdf/" + id.value, function(dataReturnd) {
@@ -435,13 +395,11 @@ function SetFocus(i) {
       for (i = 0; i < json.length; ++i) {
 
 
-
         var style = JSON.stringify(json[i].style);
         var content = JSON.stringify(form[0][e].value);
         console.log(form[0][e].value);
 
 
-
         jsonReturn += '{"label":"' + json[i].label + '", "locationUp":"' + json[i].locationUp + '", "locationRight":"' + json[i].locationRight + '","width":"' + json[i].width + '","height":"' + json[i].height + '", "pages":"' + json[i].pages + '", "content":' + content + ', "z-index":null, "idstylesPDF":"' + json[i].idstylesPDF + '", "style":' + style + ', "order":"' + json[i].order + '", "idchange_typePDF":"' + json[i].idchange_typePDF + '", "change_type":"' + json[i].change_type + '", "fileLocation":"' + pluginUrl + '/wp-content/uploads/pdf/"}';
 
 
@@ -454,8 +412,6 @@ function SetFocus(i) {
       //  console.log(jsonReturn);
 
 
-
-
       $.ajax({
         url: "" + pdf_customizer + "/api/update",
         type: "POST",
@@ -478,16 +434,8 @@ function SetFocus(i) {
           alert(xhr.status);
           document.getElementById('contentArea').innerHTML = xhr.responseText;
         }
-
       });
 
-
-
-
     });
-
-
   });
-
-
-  }
\ No newline at end of file
+}
\ No newline at end of file