AI_anchor_openshot/static/script_msg.js

//jQuery time
var current_fs, next_fs, previous_fs; //fieldsets
var left, opacity, scale; //fieldset properties which we will animate
var animating; //flag to prevent quick multi-click glitasdaches
var client_id = Date.now()
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
  return new bootstrap.Tooltip(tooltipTriggerEl)
})

$(".next").click(function(){
  avatar = $('.avatar').val();
  name_title = $('.title_new').val();
  txtARR=[];
  imgARR=[];
  var step;
	for (step = 1; step <= 10; step++) {
	  if($(".txtsrc"+step).val()!=""){
		  txtARR.push($(".txtsrc"+step).val())
	  }
	}
	var step2;
	for (step2 = 1; step2 <= 10; step2++) {
	  if($(".imgsrc"+step2).val()!=""){
		  imgARR.push($(".imgsrc"+step2).val())
	  }
	}	
	dataOBJ = {"name":name_title,"text_content":txtARR,"image_urls":imgARR,"avatar":avatar,"client_id":client_id}
	objstr = JSON.stringify(dataOBJ);
	console.log(dataOBJ)
  alert('資料送出，請稍候')
  $.ajax({
	url: 'http://www.choozmo.com:8888/make_anchor_video_v2',
	//url: 'http://www.choozmo.com:8888/qqreq',
	dataType : 'json', // 預期從server接收的資料型態
  contentType : 'application/json; charset=utf-8', // 要送到server的資料型態
	type: 'post',
	data: objstr,
	success: function(suc_data) {
    alert(suc_data.msg)
	  },
	//data:JSON.stringify({n1:"12",n2:"22"}),
	error: function (error) {
	  alert(error)
	}
});

});



var loaded_data = ''
function openNav() {
	document.getElementById("mySidenav").style.width = "250px";
  document.querySelector('.loader').style.display = "block";
    $.get("http://www.choozmo.com:8888/history_input", function(data, status){
        console.log(data)
        loaded_data = data
         for (var obj of data) {
            var historyList = document.querySelector('.historyList');
            var list = document.createElement('li')
            var message = document.createElement('a')
            list.classList.add("historyList-item");
            message.classList.add("historyList-link");
            var content = document.createTextNode(obj.name)
            message.id = obj.id
            message.setAttribute('href', "#")
            message.setAttribute('onclick', "load_data()")
            message.appendChild(content)
            list.appendChild(message);
            historyList.appendChild(list);
        } 
        document.querySelector('.loader').style.display = "none";  
        });
}
var myModal = new bootstrap.Modal(document.getElementById('history'), {
  keyboard: false
})
    function closeNav() {
      document.getElementById("mySidenav").style.width = "250px";
    }
    function load_data(){
      var title = document.getElementById("title");
      var linker = document.getElementById("linker");
      
      myModal.hide()
      tid = event.srcElement.id
      console.log(tid);
      linker.setAttribute('href', loaded_data.find(item => item.id == tid).link)
      
      $("#linker").val(loaded_data.find(item => item.id == tid).link)
      $("#linker").show()
      
      $(".title_new").val(loaded_data.find(item => item.id == tid).name)
      var step;
      for (step = 1; step <= 10; step++) {
        $(".txtsrc"+step).val(loaded_data.find(item => item.id == tid).text_content[step-1]) 
      }
      var step2;
      for (step2 = 1; step2 <= 10; step2++) {
        $(".imgsrc"+step2).val(loaded_data.find(item => item.id == tid).image_urls[step2-1]) 
      }
      
    }
            var ws = new WebSocket(`ws://www.choozmo.com:8888/progress/${client_id}`);
            ws.onmessage = function(event) {
              var elem = document.getElementById("myBar");
              console.log(event.data)
              elem.style.width = event.data + "%";
              elem.innerHTML = event.data  + "%";
            };