rsc/form-script.js

   1
   2
   3 //Files and character counter
   4 document.addEventListener("FileUploaded", function(e){
   5                         //console.log("end-of-end");
   6                         //console.log(image_load_arr)
   7                         var all_checked = !image_load_arr.some(function(image_load_bool){
   8                                 return (!image_load_bool)
   9                         });
  10                         if(all_checked){
  11                                 //console.log("sent");
  12                                 var form_submision = new XMLHttpRequest();
  13                                 form_submision.open("POST", "/add-to-queue");
  14                                 form_submision.timeout = 50000; //50 sec timeout
  15                                 form_submision.onload = function(){
  16                                         var codes = form_submision.response.split("&");
  17                                         var code_failed = codes.some(function(code){
  18                                                 var key_value = code.split("=");
  19                                                 //console.log(key_value);
  20                                                 if(key_value[1] !== "0" && key_value[1] !== "5"){
  21                                                         return true;
  22                                                 }
  23                                         });
  24                                         //console.log(code_failed);
  25                                         if(code_failed){
  26                                                 var fail_string = "Upload Failed: \n";
  27                                                 codes.forEach(function(code){
  28                                                         var key_value = code.split("=");
  29                                                         //console.log( key_value);
  30                                                         if(key_value[0] == "All"){
  31                                                                 if(key_value[1] == "-1"){
  32                                                                         fail_string += "Multiple submits recieved";
  33                                                                 }
  34                                                                 else if(key_value[1] == "-2"){
  35                                                                         fail_string += "Mismatched Token";
  36                                                                 }
  37                                                                 else if(key_value[1] == "-3"){
  38                                                                         fail_string += "Comment was changed";
  39                                                                 }
  40                                                                 else if(key_value[1] == "-4"){
  41                                                                         fail_string += "IP Missmatch";
  42                                                                 }
  43                                                                 else if(key_value[1] == "-5"){
  44                                                                         fail_string += "Image Not Allowed";
  45                                                                 }
  46                                                         }
  47                                                         else if(key_value[1] == "1"){
  48                                                                 fail_string += key_value[0] + " Was greater than 5 megabytes\n";
  49                                                         }
  50                                                         else if(key_value[1] == "0"|| key_value[1] == "5"){
  51                                                                 fail_string += key_value[0] + " Suceeded\n";
  52                                                         }
  53                                                         else if(key_value[1] == "6"){
  54                                                                 fail_string += key_value[0] + " Was already uploaded from a previous session\n";
  55                                                         }
  56                                                 });
  57                                                 alert(fail_string);
  58                                         }
  59                                         else{
  60                                                 window.location.href = ("/russian-roulette.php?" + form_submision.response);
  61                                         }
  62                                         //console.log(codes);
  63                                 };
  64                                 form_submision.send(form_submision_values);
  65                         }
  66         });
  67 var form_submision_values;
  68
  69 var character_counter = document.getElementById('CharacterCount');
  70 var error_msg = document.getElementById('errorMsg');
  71 var error_msg_text = document.createTextNode("");
  72 error_msg.appendChild(error_msg_text);
  73 var textarea = document.getElementById('Comment');
  74 var submit = document.getElementById('submit-button');
  75 // submit.removeAttribute('disabled');
  76
  77 var image_load_arr = [false,false,false,false];
  78
  79 var CHARACTER_LIMIT =  280;
  80
  81 function checkIfSubmitToBeDisabled(){
  82         characterCountColoring();
  83         //Check comment
  84         var length = textarea.value.length;
  85         if(length == 0) {
  86                 submit.setAttribute('disabled',1);
  87                 error_msg.textContent = "Input a comment and/or file";
  88         }
  89         else if(length > CHARACTER_LIMIT){
  90                 submit.setAttribute('disabled',1);
  91                 error_msg.textContent = "Character count exceeded(>"+ CHARACTER_LIMIT + ")";
  92         }
  93         else{
  94                 submit.removeAttribute('disabled');
  95                 error_msg.innerHTML = "Click to submit";
  96         }
  97         //check all file fontainers
  98         for(var i = 1 ; i <= 4; i++){
  99                 if(document.getElementById("f" + i).files[0] != undefined){ // check if exists
 100                         //console.log(document.getElementById("f" + i).files[0].name);
 101                         if(document.getElementById("f" + i).files[0].name.indexOf(".webm") >-1){ //
 102                                 submit.setAttribute('disabled',1);
 103                                 //console.log(error_msg_text);
 104                                 error_msg.textContent = "Twitter does not support .webm. Use .mp4 instead.";
 105                                 break;
 106                         }
 107                         if(length == 0) {
 108                                 //console.log(document.getElementById("f" + i).files[0] )
 109                                 submit.removeAttribute('disabled');
 110                                 error_msg.nodeValue = "Click to submit";
 111                         }
 112                 }
 113         }
 114 }
 115
 116 function characterCountColoring(){
 117         var length = textarea.value.trim().length;
 118         var red = 0; var blue = 100; var green = 100;
 119         if(length == 0){
 120                 red = 0; blue = 0; green = 0;
 121         }
 122         else if(length > CHARACTER_LIMIT){
 123                 red = 255; blue = 0; green = 0;
 124         }
 125         else{
 126                 red = Math.ceil(length/CHARACTER_LIMIT * 180);
 127         }
 128         character_counter.innerHTML = '<span style=\'color:rgb(' + red + ',' + green + ',' + blue + ')\'>' + length + '</span>'
 129 }
 130
 131 function setFileListener(file){
 132         file_node = document.getElementById(file);
 133         (function(_file_node){
 134                 _file_node.addEventListener("change", checkIfSubmitToBeDisabled);
 135         })(file_node);
 136 }
 137
 138 //use a compression algorithm to send data from the server to the client.
 139 //Ticket gen recieves the comment, the IP of the sender and creates a random value identifying the token.
 140 //This token uses the IP and random value to decide if a form has been submitted multiple times.
 141 //Comments are checked against the server before files are checked. comment is not sent in the files POST request.
 142 //This system allows for the server to modify the comment data and store it in the database in one shot. also allows for error checking being done quicker.
 143 function submitProcess(event){
 144         image_load_arr = [false, false, false, false];
 145         var form = document.getElementById("submit-form");
 146         var submit =  document.getElementById("submit-button");
 147         var comment = document.getElementById("Comment").value.trim();
 148         //submit.setAttribute("disabled", 1);
 149         form_submision_values =  new FormData();
 150
 151         //create a ticket to prevent resubmision on
 152          var ticket_request = new XMLHttpRequest();
 153          var files = "";
 154         for(var file = 1 ; file <= 4 ; file++){
 155                 if(document.getElementById("f" + file).files[0] !== undefined){
 156                         files = document.getElementById("f" + file).files[0].name;
 157                 }
 158         }
 159          //console.log(files)
 160          ticket_request.open("GET", "/ticket-gen?comment=" + comment + "&files=" + files);
 161          ticket_request.responseType="text";
 162          ticket_request.onload = function(){
 163                 var ticket = ticket_request.response;
 164                 //console.log(ticket);
 165                 if(ticket[0] == "-"){
 166                         ticket_arr = ticket.split(" ");
 167                         if(ticket_arr[0] == "-1") window.alert("Don't double click submit.............\nServer got the comment, is processing image.");
 168                         if(ticket_arr[0] == "-2") {
 169                                 var response = window.confirm("Comment will require admin verification due to text filter. Please fix the following or press OK to be put on the verification list '" + ticket_arr[1].replace("/_/g", " ") + "'");
 170                                 if(response == true){
 171                                         document.getElementById("Comment").value = "VERIFY: " +  document.getElementById("Comment").value.trim();
 172                                         submitProcess(event);
 173                                 }
 174                         }
 175                         if(ticket_arr[0] == "-3") {
 176                                 alert("Comment too long");
 177                         }
 178                         if(ticket_arr[0] == "-4") {
 179                                 alert("Nothing entered");
 180                         }
 181                         if(ticket_arr[0] == "-5") {
 182                                 alert("You are banned: " + ticket_arr[1]);
 183                         }
 184                         return false;
 185                 }
 186
 187                 form_submision_values.append("ticket", ticket);
 188                 var file_upload_event = new Event("FileUploaded");
 189                 for(var file = 1 ; file <= 4 ; file++){
 190                         (function(_file){
 191                                 var image_reader = new FileReader();
 192                                 var file_obj = document.getElementById("f" + _file).files[0];
 193                                 if(file_obj !== undefined){
 194                                         image_reader.readAsBinaryString(file_obj, "UTF-8");
 195                                         image_reader.onload=function(){ }
 196                                         image_reader.onloadend=function(){
 197                                                 form_submision_values.append("file" + _file, encodeURI(file_obj.name) + "=" + btoa(image_reader.result));
 198                                                 //console.log(encodeURI(file_obj.name));
 199                                                 image_load_arr[_file - 1] = true;
 200                                                 document.dispatchEvent(file_upload_event);
 201                                         }
 202                                 }
 203                                 else{
 204                                         image_load_arr[_file - 1] = true;
 205                                         form_submision_values.append("file" + _file, "");
 206                                         document.dispatchEvent(file_upload_event);
 207                                 }
 208                         })(file);
 209                 }
 210
 211          }
 212          ticket_request.send(null);
 213
 214         submit.removeAttribute("comment");
 215         event.preventDefault();
 216         return false;
 217 }
 218
 219 for(var i = 1 ; i <= 4; i++) setFileListener("f" + i);
 220
 221 if (textarea.addEventListener) {
 222         textarea.addEventListener('input', function() {
 223                 checkIfSubmitToBeDisabled();
 224   }, false);
 225 }
 226 else if (textarea.attachEvent) {
 227         textarea.attachEvent('onpropertychange', function() {
 228                  checkIfSubmitToBeDisabled();
 229   });
 230 }
 231 document.getElementById("submit-form").addEventListener("submit", submitProcess);
 232
 233
 234