mirror of
https://github.com/imapsync/imapsync.git
synced 2025-06-07 13:15:22 +02:00
453 lines
17 KiB
JavaScript
Executable file
453 lines
17 KiB
JavaScript
Executable file
|
|
// $Id: imapsync_form.js,v 1.8 2019/06/25 16:41:43 gilles Exp gilles $
|
|
|
|
/*jslint browser: true*/ /*global $*/
|
|
|
|
|
|
$(document).ready(
|
|
function ()
|
|
{
|
|
"use strict";
|
|
// Bootstrap popover and tooltip
|
|
$("[data-toggle='tooltip']").tooltip();
|
|
|
|
var readyStateStr = {
|
|
"0": "Request not initialized",
|
|
"1": "Server connection established",
|
|
"2": "Response headers received",
|
|
"3": "Processing request",
|
|
"4": "Finished and response is ready"
|
|
};
|
|
|
|
function is( expected, given, comment )
|
|
{
|
|
var message = ": ["
|
|
+ expected
|
|
+ "] === ["
|
|
+ given
|
|
+ "] "
|
|
+ comment
|
|
+ "\n" ;
|
|
if ( expected === given )
|
|
{
|
|
message = "ok " + message ;
|
|
}
|
|
else
|
|
{
|
|
message = "Nok" + message ;
|
|
}
|
|
$("#tests").append( message ) ;
|
|
}
|
|
|
|
function last_eta( string )
|
|
{
|
|
// return the last occurrence of the substring "ETA: ...\n"
|
|
// or ""
|
|
var eta ;
|
|
var last_found ;
|
|
|
|
if ( undefined === string )
|
|
{
|
|
return "" ;
|
|
}
|
|
|
|
var eta_re = /ETA:.*\n/g ;
|
|
|
|
eta = string.match( eta_re ) ;
|
|
if ( eta )
|
|
{
|
|
last_found = eta[eta.length -1 ] ;
|
|
return last_found ;
|
|
}
|
|
else
|
|
{
|
|
return "" ;
|
|
}
|
|
}
|
|
|
|
function tests_last_eta()
|
|
{
|
|
is( "", last_eta( ), "last_eta: no args => empty string" ) ;
|
|
is( "", last_eta( "" ), "last_eta: empty => empty string" ) ;
|
|
is( "", last_eta( "ETA" ), "last_eta: ETA => empty string" ) ;
|
|
is( "", last_eta( "ETA: but no CR" ),
|
|
"last_eta: ETA: but no CR => empty string" ) ;
|
|
|
|
is(
|
|
"ETA: with CR\n",
|
|
last_eta( "Blabla ETA: with CR\n" ),
|
|
"last_eta: ETA: with CR => ETA: with CR"
|
|
) ;
|
|
|
|
is(
|
|
"ETA: 2 with CR\n",
|
|
last_eta( "Blabla ETA: 1 with CR\nBlabla ETA: 2 with CR\n" ),
|
|
"last_eta: several ETA: with CR => ETA: 2 with CR"
|
|
) ;
|
|
}
|
|
|
|
function refreshLog(xhr)
|
|
{
|
|
var slice_length ;
|
|
$("#output").text(xhr.responseText) ;
|
|
if (xhr.readyState === 4) {
|
|
slice_length = -2400 ;
|
|
}
|
|
else
|
|
{
|
|
slice_length = -240 ;
|
|
}
|
|
$("#progress").text( last_eta( xhr.responseText.slice( slice_length ) ) ) ;
|
|
}
|
|
|
|
|
|
|
|
function handleRun(xhr, timerRefreshLog)
|
|
{
|
|
|
|
$("#console").text("Status: " + xhr.status + " " + xhr.statusText + "\n" + "State: " + readyStateStr[xhr.readyState] + "\n") ;
|
|
|
|
if (xhr.readyState === 4) {
|
|
// var headers = xhr.getAllResponseHeaders();
|
|
// $("#console").append(headers);
|
|
// $("#console").append("See the completed log\n");
|
|
$("#link_to_bottom").show();
|
|
clearInterval(timerRefreshLog);
|
|
refreshLog(xhr); // a last time
|
|
$("#bt-sync").prop("disabled", false); // back to enable state for next run
|
|
}
|
|
}
|
|
|
|
function imapsync()
|
|
{
|
|
var querystring = $("#form").serialize();
|
|
$("#abort").text("\n\n"); // clean abort console
|
|
$("#output").text("Here comes the log!\n\n");
|
|
|
|
if ( "imap.gmail.com" === $("#host1").val() )
|
|
{
|
|
querystring = querystring + "&gmail1=on";
|
|
}
|
|
if ( "imap.gmail.com" === $("#host2").val() )
|
|
{
|
|
querystring = querystring + "&gmail2=on";
|
|
}
|
|
|
|
var xhr;
|
|
xhr = new XMLHttpRequest();
|
|
var timerRefreshLog = setInterval(
|
|
function ()
|
|
{
|
|
refreshLog(xhr);
|
|
}, 5000 ) ;
|
|
xhr.onreadystatechange = function ()
|
|
{
|
|
handleRun(xhr, timerRefreshLog);
|
|
};
|
|
xhr.open("POST", "/cgi-bin/imapsync", true);
|
|
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
|
|
xhr.send(querystring);
|
|
}
|
|
|
|
|
|
function handleAbort(xhr)
|
|
{
|
|
|
|
$("#abort").text("Status: " + xhr.status + " " + xhr.statusText + "\n" + "State: " + readyStateStr[xhr.readyState] + "\n\n");
|
|
|
|
if (xhr.readyState === 4)
|
|
{
|
|
$("#abort").append(xhr.responseText);
|
|
$("#bt-sync").prop("disabled", false);
|
|
$("#bt-abort").prop("disabled", false); // back for next abort
|
|
}
|
|
}
|
|
|
|
function abort()
|
|
{
|
|
var querystring = $("#form").serialize() + "&abort=on";
|
|
var xhr;
|
|
xhr = new XMLHttpRequest();
|
|
xhr.onreadystatechange = function ()
|
|
{
|
|
handleAbort(xhr);
|
|
};
|
|
xhr.open("POST", "/cgi-bin/imapsync", true);
|
|
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
|
|
xhr.send(querystring);
|
|
}
|
|
|
|
function store( id )
|
|
{
|
|
var stored ;
|
|
$( "#tests" ).append( "Eco: " + id + " type is " + $( id ).attr( "type" ) + "\n" ) ;
|
|
if ( "text" === $( id ).attr( "type" ) || "password" === $( id ).attr( "type" ) )
|
|
{
|
|
localStorage.setItem( id, $(id).val() ) ;
|
|
stored = $(id).val() ;
|
|
}
|
|
else if ( "checkbox" === $( id ).attr( "type" ) )
|
|
{
|
|
$( "#tests" ).append( "Eco: " + id + " checked is " + $( id )[0].checked + "\n" ) ;
|
|
localStorage.setItem( id, $( id )[0].checked ) ;
|
|
stored = $( id )[0].checked ;
|
|
}
|
|
return stored ;
|
|
}
|
|
|
|
function retrieve( id )
|
|
{
|
|
var retrieved ;
|
|
$( "#tests" ).append( "Eco: " + id + " type is " + $( id ).attr( "type" ) + " length is " + $( id ).length + "\n" ) ;
|
|
if ( "text" === $( id ).attr( "type" ) || "password" === $( id ).attr( "type" ) )
|
|
{
|
|
$( id ).val( localStorage.getItem( id ) ) ;
|
|
retrieved = $( id ).val() ;
|
|
}
|
|
else if ( "checkbox" === $( id ).attr( "type" ) )
|
|
{
|
|
$( "#tests" ).append( "Eco: " + id + " getItem is " + localStorage.getItem( id ) + "\n" ) ;
|
|
$( id )[0].checked = JSON.parse( localStorage.getItem( id ) ) ;
|
|
retrieved = $( id )[0].checked ;
|
|
}
|
|
return retrieved ;
|
|
}
|
|
|
|
function tests_store_retrieve()
|
|
{
|
|
if ( $("#tests").length !== 0 )
|
|
{
|
|
is( 1, 1, "one equals one" ) ;
|
|
// isnot( 0, 1, "zero differs one" ) ;
|
|
|
|
// no exist
|
|
is( undefined, store( "#test_noexists" ), "store: #test_noexists" ) ;
|
|
is( undefined, retrieve( "#test_noexists" ), "retrieve: #test_noexists" ) ;
|
|
is( undefined, retrieve( "#test_noexists2" ), "retrieve: #test_noexists2" ) ;
|
|
|
|
// input text
|
|
$("#test_text" ).val( "foo" ) ;
|
|
is( "foo", $("#test_text" ).val( ), "#test_text val = foo" ) ;
|
|
is( "foo", store( "#test_text" ), "store: #test_text" ) ;
|
|
$("#test_text" ).val( "bar" ) ;
|
|
is( "bar", $("#test_text" ).val( ), "#test_text val = bar" ) ;
|
|
is( "foo", retrieve( "#test_text" ), "retrieve: #test_text = foo" ) ;
|
|
is( "foo", $("#test_text" ).val( ), "#test_text val = foo" ) ;
|
|
|
|
|
|
// input check button
|
|
$( "#test_checkbox" ).prop( "checked", true );
|
|
is( true, store( "#test_checkbox" ), "store: #test_checkbox checked" ) ;
|
|
|
|
$( "#test_checkbox" ).prop( "checked", false );
|
|
is( true, retrieve( "#test_checkbox" ), "retrieve: #test_checkbox = true" ) ;
|
|
|
|
$( "#test_checkbox" ).prop( "checked", false );
|
|
is( false, store( "#test_checkbox" ), "store: #test_checkbox not checked" ) ;
|
|
$( "#test_checkbox" ).prop( "checked", true );
|
|
is( false, retrieve( "#test_checkbox" ), "retrieve: #test_checkbox = false" ) ;
|
|
|
|
}
|
|
}
|
|
|
|
|
|
function store_form()
|
|
{
|
|
if ( Storage !== "undefined")
|
|
{
|
|
// Code for localStorage.
|
|
store("#user1") ;
|
|
store("#password1") ;
|
|
store("#host1") ;
|
|
store("#subfolder1") ;
|
|
store("#showpassword1") ;
|
|
|
|
store("#user2") ;
|
|
store("#password2") ;
|
|
store("#host2") ;
|
|
store("#subfolder2") ;
|
|
store("#showpassword2") ;
|
|
|
|
store("#dry") ;
|
|
store("#justlogin") ;
|
|
store("#justfolders") ;
|
|
store("#justfoldersizes") ;
|
|
|
|
localStorage.account1_background_color = $("#account1").css("background-color") ;
|
|
localStorage.account2_background_color = $("#account2").css("background-color") ;
|
|
}
|
|
}
|
|
|
|
function show_extra_if_needed()
|
|
{
|
|
if ( $("#subfolder1").length && $("#subfolder1").val().length > 0 )
|
|
{
|
|
$(".extra_param").show() ;
|
|
}
|
|
if ( $("#subfolder2").length && $("#subfolder2").val().length > 0 )
|
|
{
|
|
$(".extra_param").show() ;
|
|
}
|
|
}
|
|
|
|
function retrieve_form()
|
|
{
|
|
if ( Storage !== "undefined" )
|
|
{
|
|
// Code for localStorage.
|
|
retrieve( "#user1" ) ;
|
|
retrieve( "#password1" ) ;
|
|
// retrieve("#showpassword1") ;
|
|
retrieve( "#host1" ) ;
|
|
retrieve( "#subfolder1" ) ;
|
|
|
|
retrieve( "#user2" ) ;
|
|
retrieve( "#password2" ) ;
|
|
// retrieve("#showpassword2") ;
|
|
retrieve( "#host2" ) ;
|
|
retrieve( "#subfolder2" ) ;
|
|
|
|
retrieve( "#dry" ) ;
|
|
retrieve( "#justlogin" ) ;
|
|
retrieve( "#justfolders" ) ;
|
|
retrieve( "#justfoldersizes" ) ;
|
|
|
|
// In case
|
|
// localStorage.removeItem( "account1_background_color" ) ;
|
|
// localStorage.removeItem( "account2_background_color" ) ;
|
|
|
|
if ( localStorage.account1_background_color )
|
|
{
|
|
$("#account1").css("background-color", localStorage.account1_background_color ) ;
|
|
}
|
|
if ( localStorage.account2_background_color )
|
|
{
|
|
$("#account2").css("background-color", localStorage.account2_background_color ) ;
|
|
}
|
|
|
|
// Show the extra parameters if they are not empty because it would be dangerous
|
|
// to retrieve them without knowing
|
|
show_extra_if_needed() ;
|
|
}
|
|
}
|
|
|
|
|
|
function showpassword( id, button )
|
|
{
|
|
var x = document.getElementById( id );
|
|
if ( button.checked )
|
|
{
|
|
x.type = "text";
|
|
} else {
|
|
x.type = "password";
|
|
}
|
|
}
|
|
|
|
function init()
|
|
{
|
|
// in case of a manual refresh, start with
|
|
$("#bt-sync").prop("disabled", false);
|
|
$("#bt-abort").prop("disabled", false);
|
|
$("#link_to_bottom").hide();
|
|
retrieve_form();
|
|
|
|
$("#showpassword1").click(
|
|
function ()
|
|
{
|
|
// does not change jslint report...
|
|
/*jshint validthis: true */
|
|
var button = this ;
|
|
showpassword( "password1", button ) ;
|
|
}
|
|
);
|
|
|
|
|
|
$("#showpassword2").click(
|
|
function ()
|
|
{
|
|
var button = this ;
|
|
showpassword( "password2", button ) ;
|
|
}
|
|
);
|
|
|
|
|
|
$("#bt-sync").click(
|
|
function ()
|
|
{
|
|
$("#bt-sync").prop("disabled", true);
|
|
$("#bt-abort").prop("disabled", false);
|
|
$("#link_to_bottom").hide();
|
|
store_form();
|
|
imapsync();
|
|
}
|
|
);
|
|
|
|
$("#bt-abort").click(
|
|
function ()
|
|
{
|
|
$("#bt-sync").prop("disabled", true);
|
|
$("#bt-abort").prop("disabled", true);
|
|
abort();
|
|
}
|
|
);
|
|
|
|
|
|
$.fn.swapWith = function(to)
|
|
{
|
|
var temp = $(to).val();
|
|
$(to).val($(this).val());
|
|
$(this).val(temp);
|
|
};
|
|
|
|
|
|
$("#swap").click(
|
|
function()
|
|
{
|
|
// swaping colors can't use swapWith()
|
|
var temp1 = $("#account1").css("background-color") ;
|
|
var temp2 = $("#account2").css("background-color") ;
|
|
$("#account1").css("background-color", temp2 );
|
|
$("#account2").css("background-color", temp1 );
|
|
|
|
$("#user1").swapWith("#user2");
|
|
$("#password1").swapWith("#password2");
|
|
$("#host1").swapWith("#host2");
|
|
$("#subfolder1").swapWith("#subfolder2");
|
|
|
|
var temp = $("#showpassword1")[0].checked ;
|
|
$("#showpassword1")[0].checked = $("#showpassword2")[0].checked ;
|
|
$("#showpassword2")[0].checked = temp ;
|
|
showpassword( "password1", $("#showpassword1")[0] ) ;
|
|
showpassword( "password2", $("#showpassword2")[0] ) ;
|
|
}
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function progress_bar_update( string )
|
|
{
|
|
//
|
|
return ;
|
|
}
|
|
|
|
|
|
|
|
function tests()
|
|
{
|
|
if ( $("#tests").length !== 0 )
|
|
{
|
|
tests_store_retrieve() ;
|
|
tests_last_eta() ;
|
|
}
|
|
}
|
|
|
|
init( ) ;
|
|
tests( ) ;
|
|
|
|
}
|
|
|
|
);
|
|
|