mirror of
https://github.com/YunoHost-Apps/jappix_ynh.git
synced 2024-09-03 19:26:19 +02:00
526 lines
20 KiB
JavaScript
526 lines
20 KiB
JavaScript
/*
|
|
|
|
Jappix - An open social platform
|
|
These are the homepage JS scripts for Jappix
|
|
|
|
-------------------------------------------------
|
|
|
|
License: AGPL
|
|
Authors: Valérian Saliou, LinkMauve
|
|
|
|
*/
|
|
|
|
// Bundle
|
|
var Home = (function () {
|
|
|
|
/**
|
|
* Alias of this
|
|
* @private
|
|
*/
|
|
var self = {};
|
|
|
|
|
|
/**
|
|
* Apply change events
|
|
* @private
|
|
* @param {object} current_sel
|
|
* @param {string} div
|
|
* @return {undefined}
|
|
*/
|
|
self._eventsChange = function(current_sel, div) {
|
|
|
|
try {
|
|
// Create the attached events
|
|
switch(div) {
|
|
// Login tool
|
|
case 'loginer':
|
|
current_sel.find('a.to-anonymous').click(function() {
|
|
return self.change('anonymouser');
|
|
});
|
|
|
|
current_sel.find('a.advanced').click(self.showAdvanced);
|
|
current_sel.find('form').submit(self.loginForm);
|
|
|
|
break;
|
|
|
|
// Anonymous login tool
|
|
case 'anonymouser':
|
|
current_sel.find('a.to-home').click(function() {
|
|
return self.change('loginer');
|
|
});
|
|
|
|
current_sel.find('form').submit(Connection.doAnonymous);
|
|
|
|
// Keyup event on anonymous join's room input
|
|
current_sel.find('input.room').keyup(function() {
|
|
var value = $(this).val();
|
|
var report_sel = current_sel.find('.report');
|
|
var span_sel = current_sel.find('span');
|
|
|
|
if(!value) {
|
|
report_sel.hide();
|
|
span_sel.text('');
|
|
} else {
|
|
report_sel.show();
|
|
span_sel.text(JAPPIX_LOCATION + '?r=' + value);
|
|
}
|
|
});
|
|
|
|
break;
|
|
|
|
// Register tool
|
|
case 'registerer':
|
|
// Server input change
|
|
$('#home input.server').keyup(function(e) {
|
|
if($.trim($(this).val()) == HOST_MAIN) {
|
|
$('#home .captcha_grp').show();
|
|
$('#home input.captcha').removeAttr('disabled');
|
|
} else {
|
|
$('#home .captcha_grp').hide();
|
|
$('#home input.captcha').attr('disabled', true);
|
|
}
|
|
});
|
|
|
|
// Register input placeholder
|
|
// FIXME: breaks IE compatibility
|
|
//$('#home input[placeholder]').placeholder();
|
|
|
|
// Register form submit
|
|
current_sel.find('form').submit(self.registerForm);
|
|
|
|
break;
|
|
}
|
|
} catch(e) {
|
|
Console.error('Home._eventsChange', e);
|
|
}
|
|
|
|
};
|
|
|
|
|
|
/**
|
|
* Create obsolete form
|
|
* @private
|
|
* @param {string} home
|
|
* @param {string} locale
|
|
* @return {undefined}
|
|
*/
|
|
self._obsolete = function(home, locale) {
|
|
|
|
try {
|
|
// Add the code
|
|
$(locale).after(
|
|
'<div class="obsolete">' +
|
|
'<p>' + Common._e("Your browser is out of date!") + '</p>' +
|
|
|
|
'<a class="firefox browsers-images" title="' + Common.printf(Common._e("Last %s version is better!"), 'Mozilla Firefox') + '" href="http://www.mozilla.com/firefox/"></a>' +
|
|
'<a class="chrome browsers-images" title="' + Common.printf(Common._e("Last %s version is better!"), 'Google Chrome') + '" href="http://www.google.com/chrome"></a>' +
|
|
'<a class="safari browsers-images" title="' + Common.printf(Common._e("Last %s version is better!"), 'Safari') + '" href="http://www.apple.com/safari/"></a>' +
|
|
'<a class="opera browsers-images" title="' + Common.printf(Common._e("Last %s version is better!"), 'Opera') + '" href="http://www.opera.com/"></a>' +
|
|
'<a class="ie browsers-images" title="' + Common.printf(Common._e("Last %s version is better!"), 'Internet Explorer') + '" href="http://www.microsoft.com/hk/windows/internet-explorer/"></a>' +
|
|
'</div>'
|
|
);
|
|
|
|
// Display it later
|
|
$(home + '.obsolete').oneTime('1s', function() {
|
|
$(this).slideDown();
|
|
});
|
|
|
|
Console.warn('Jappix does not support this browser!');
|
|
} catch(e) {
|
|
Console.error('Home._obsolete', e);
|
|
}
|
|
|
|
};
|
|
|
|
|
|
/**
|
|
* Allows the user to switch the difference home page elements
|
|
* @public
|
|
* @param {string} div
|
|
* @return {boolean}
|
|
*/
|
|
self.change = function(div) {
|
|
|
|
try {
|
|
// Path to
|
|
var home = '#home .';
|
|
var right = home + 'right ';
|
|
var current = right + '.homediv.' + div;
|
|
|
|
// We switch the div
|
|
$(right + '.homediv, ' + right + '.top').hide();
|
|
$(right + '.' + div).show();
|
|
|
|
// We reset the homedivs
|
|
$(home + 'homediv:not(.default), ' + home + 'top:not(.default)').remove();
|
|
|
|
// Get the HTML code to display
|
|
var disable_form = '';
|
|
var lock_host = '';
|
|
var code = '';
|
|
|
|
// Apply the previous link
|
|
switch(div) {
|
|
case 'loginer':
|
|
case 'anonymouser':
|
|
case 'registerer':
|
|
if(!Common.exists(right + '.top.sub')) {
|
|
// Append the HTML code for previous link
|
|
$(right + '.top.default').after('<h1 class="top sub loginer anonymouser registerer">« <a href="#" class="previous">' + Common._e("Previous") + '</a></h1>');
|
|
|
|
// Click event on previous link
|
|
$(home + 'top.sub a.previous').click(function() {
|
|
return self.change('default');
|
|
});
|
|
}
|
|
|
|
break;
|
|
}
|
|
|
|
// Apply the form
|
|
switch(div) {
|
|
// Login tool
|
|
case 'loginer':
|
|
lock_host = Utils.disableInput(LOCK_HOST, 'on');
|
|
code = '<p>' + Common.printf(Common._e("Login to your existing XMPP account. You can also use the %s to join a groupchat."), '<a href="#" class="to-anonymous">' + Common._e("anonymous mode") + '</a>') + '</p>' +
|
|
|
|
'<form action="#" method="post">' +
|
|
'<fieldset>' +
|
|
'<legend>' + Common._e("Required") + '</legend>' +
|
|
|
|
'<label for="lnick">' + Common._e("Address") + '</label>' +
|
|
'<input type="text" class="nick" id="lnick" pattern="[^@/]+" required="" /><span class="jid">@</span><input type="text" class="server" id="lserver" value="' + HOST_MAIN + '" ' + lock_host + ' pattern="[^@/]+" required="" list="server" />' +
|
|
'<label for="lpassword">' + Common._e("Password") + '</label>' +
|
|
'<input type="password" class="password" id="lpassword" required="" />' +
|
|
'<label for="lremember">' + Common._e("Remember me") + '</label>' +
|
|
'<input type="checkbox" class="remember" id="lremember" />' +
|
|
'</fieldset>' +
|
|
|
|
'<a href="#" class="advanced home-images">' + Common._e("Advanced") + '</a>' +
|
|
|
|
'<fieldset class="advanced">' +
|
|
'<legend>' + Common._e("Advanced") + '</legend>' +
|
|
|
|
'<label for="lresource">' + Common._e("Resource") + '</label>' +
|
|
'<input type="text" class="resource" id="lresource" value="' + JAPPIX_RESOURCE + '" />' +
|
|
'<label for="lpriority">' + Common._e("Priority") + '</label>' +
|
|
'<select class="priority" id="lpriority">' +
|
|
'<option value="1">' + Common._e("Low") + '</option>' +
|
|
'<option value="10" selected="">' + Common._e("Medium") + '</option>' +
|
|
'<option value="100">' + Common._e("High") + '</option>' +
|
|
'</select>' +
|
|
'</fieldset>' +
|
|
|
|
'<div class="submit">' +
|
|
'<input type="submit" value="' + Common._e("Here we go!") + '" />' +
|
|
|
|
'<div class="clear"></div>' +
|
|
'</div>' +
|
|
'</form>';
|
|
|
|
break;
|
|
|
|
// Anonymous login tool
|
|
case 'anonymouser':
|
|
disable_form = Utils.disableInput(ANONYMOUS, 'off');
|
|
code = '<p>' + Common.printf(Common._e("Enter the groupchat you want to join and the nick you want to have. You can also go back to the %s."), '<a href="#" class="to-home">' + Common._e("login page") + '</a>') + '</p>';
|
|
|
|
if(LEGAL) {
|
|
code += '<p>' + Common.printf(Common._e("By using our service, you accept %s."), '<b><a href="' + Common.encodeQuotes(LEGAL) + '" target="_blank">' + Common._e("our terms of use") + '</a></b>') + '</p>';
|
|
}
|
|
|
|
code += '<form action="#" method="post">' +
|
|
'<fieldset>' +
|
|
'<legend>' + Common._e("Required") + '</legend>' +
|
|
|
|
'<label>' + Common._e("Room") + '</label>' +
|
|
'<input type="text" class="room"' + disable_form + ' pattern="[^/]+" required="" />' +
|
|
|
|
'<label>' + Common._e("Nickname") + '</label>' +
|
|
'<input type="text" class="nick"' + disable_form + ' required="" />' +
|
|
'</fieldset>' +
|
|
|
|
'<input type="submit" value="' + Common._e("Here we go!") + '"' + disable_form + ' />' +
|
|
'</form>' +
|
|
|
|
'<div class="info report">' +
|
|
Common._e("Share this link with your friends:") + ' <span></span>' +
|
|
'</div>';
|
|
|
|
break;
|
|
|
|
// Register tool
|
|
case 'registerer':
|
|
disable_form = Utils.disableInput(REGISTRATION, 'off');
|
|
|
|
if(!disable_form) {
|
|
lock_host = Utils.disableInput(LOCK_HOST, 'on');
|
|
}
|
|
|
|
code = '<p>' + Common._e("Register a new XMPP account to join your friends on your own social cloud. That's simple!") + '</p>';
|
|
|
|
if(LEGAL) {
|
|
code += '<p>' + Common.printf(Common._e("By using our service, you accept %s."), '<b><a href="' + Common.encodeQuotes(LEGAL) + '" target="_blank">' + Common._e("our terms of use") + '</a></b>') + '</p>';
|
|
}
|
|
|
|
code += '<form action="#" method="post">' +
|
|
'<fieldset>' +
|
|
'<legend>' + Common._e("Required") + '</legend>' +
|
|
|
|
'<label for="rnick">' + Common._e("Address") + '</label>' +
|
|
'<input type="text" class="nick" id="rnick" ' + disable_form + ' pattern="[^@/]+" required="" placeholder="' + Common._e("Username") + '" /><span class="jid">@</span><input type="text" class="server" id="rserver" value="' + HOST_MAIN + '" ' + disable_form + lock_host + ' pattern="[^@/]+" required="" list="server" placeholder="' + Common._e("Server") + '" />' +
|
|
'<label for="rpassword">' + Common._e("Password") + '</label>' +
|
|
'<input type="password" class="password" id="rpassword" ' + disable_form + ' required="" placeholder="' + Common._e("Enter password") + '" /><input type="password" class="spassword" id="spassword" ' + disable_form + ' required="" placeholder="' + Common._e("Once again...") + '" />';
|
|
|
|
if(REGISTER_API == 'on') {
|
|
code += '<div class="captcha_grp">' +
|
|
'<label for="captcha">' + Common._e("Code") + '</label><input type="text" class="captcha" id="captcha" ' + disable_form + ' maxlength="6" pattern="[a-zA-Z0-9]{6}" required="" placeholder="' + Common._e("Security code") + '" /><img class="captcha_img" src="./server/captcha.php?id=' + genID() + '" alt="" />' +
|
|
'</div>';
|
|
}
|
|
|
|
code += '</fieldset>' +
|
|
|
|
'<input type="submit" value="' + Common._e("Here we go!") + '" ' + disable_form + '/>' +
|
|
'</form>';
|
|
|
|
break;
|
|
}
|
|
|
|
// Form disabled?
|
|
if(disable_form) {
|
|
code += '<div class="info fail">' +
|
|
Common._e("This tool has been disabled!") +
|
|
'</div>';
|
|
}
|
|
|
|
// Create this HTML code
|
|
if(code && !Common.exists(current)) {
|
|
$(right + '.homediv.default').after(
|
|
'<div class="' + div + ' homediv">' + code + '</div>'
|
|
);
|
|
|
|
self._eventsChange(
|
|
$(current),
|
|
div
|
|
);
|
|
}
|
|
|
|
// We focus on the first input
|
|
$(document).oneTime(10, function() {
|
|
$(right + 'input:visible:first').focus();
|
|
});
|
|
} catch(e) {
|
|
Console.error('Home.change', e);
|
|
} finally {
|
|
return false;
|
|
}
|
|
|
|
};
|
|
|
|
|
|
/**
|
|
* Allows the user to display the advanced login options
|
|
* @public
|
|
* @return {boolean}
|
|
*/
|
|
self.showAdvanced = function() {
|
|
|
|
try {
|
|
// Hide the link
|
|
$('#home a.advanced').hide();
|
|
|
|
// Show the fieldset
|
|
$('#home fieldset.advanced').show();
|
|
} catch(e) {
|
|
Console.error('Home.showAdvanced', e);
|
|
} finally {
|
|
return false;
|
|
}
|
|
|
|
};
|
|
|
|
|
|
/**
|
|
* Reads the login form values
|
|
* @public
|
|
* @return {boolean}
|
|
*/
|
|
self.loginForm = function() {
|
|
|
|
try {
|
|
// We get the values
|
|
var path_sel = $('#home .loginer');
|
|
|
|
var lServer = path_sel.find('.server').val();
|
|
var lNick = Common.nodeprep(path_sel.find('.nick').val());
|
|
var lPass = path_sel.find('.password').val();
|
|
var lResource = path_sel.find('.resource').val();
|
|
var lPriority = path_sel.find('.priority').val();
|
|
var lRemember = path_sel.find('.remember').filter(':checked').size();
|
|
|
|
// Enough values?
|
|
if(lServer && lNick && lPass && lResource && lPriority) {
|
|
Connection.doLogin(lNick, lServer, lPass, lResource, lPriority, lRemember);
|
|
} else {
|
|
$(lPath + 'input[type="text"], ' + lPath + 'input[type="password"]').each(function() {
|
|
var select = $(this);
|
|
|
|
if(!select.val()) {
|
|
$(document).oneTime(10, function() {
|
|
select.addClass('please-complete').focus();
|
|
});
|
|
} else {
|
|
select.removeClass('please-complete');
|
|
}
|
|
});
|
|
}
|
|
} catch(e) {
|
|
Console.error('Home.loginForm', e);
|
|
} finally {
|
|
return false;
|
|
}
|
|
|
|
};
|
|
|
|
|
|
/**
|
|
* Reads the register form values
|
|
* @public
|
|
* @return {boolean}
|
|
*/
|
|
self.registerForm = function() {
|
|
|
|
try {
|
|
var path = '#home .registerer';
|
|
var path_sel = $(path);
|
|
|
|
// Remove the success info
|
|
path_sel.find('.success').remove();
|
|
|
|
// Get the values
|
|
var username = Common.nodeprep(path_sel.find('.nick').val());
|
|
var domain = path_sel.find('.server').val();
|
|
var pass = path_sel.find('.password').val();
|
|
var spass = path_sel.find('.spassword').val();
|
|
var captcha = path_sel.find('.captcha').val();
|
|
|
|
// Enough values?
|
|
if(domain && username && pass && spass && (pass == spass) && !((REGISTER_API == 'on') && (domain == HOST_MAIN) && !captcha)) {
|
|
// We remove the not completed class to avoid problems
|
|
$('#home .registerer input').removeClass('please-complete');
|
|
|
|
// Fire the register event!
|
|
Connection.doRegister(username, domain, pass, captcha);
|
|
}
|
|
|
|
// Something is missing?
|
|
else {
|
|
$(path + ' input[type="text"], ' + path + ' input[type="password"]').each(function() {
|
|
var select = $(this);
|
|
|
|
if(!select.val() || (select.is('#spassword') && pass && (pass != spass))) {
|
|
$(document).oneTime(10, function() {
|
|
select.addClass('please-complete').focus();
|
|
});
|
|
} else {
|
|
select.removeClass('please-complete');
|
|
}
|
|
});
|
|
}
|
|
} catch(e) {
|
|
Console.error('Home.registerForm', e);
|
|
} finally {
|
|
return false;
|
|
}
|
|
|
|
};
|
|
|
|
|
|
/**
|
|
* Plugin launcher
|
|
* @public
|
|
* @param {type} name
|
|
* @return {undefined}
|
|
*/
|
|
self.launch = function() {
|
|
|
|
try {
|
|
$(document).ready(function() {
|
|
// Define the vars
|
|
var home = '#home ';
|
|
var button = home + 'button';
|
|
var corp = home + '.corporation';
|
|
var aboutus = home + '.aboutus';
|
|
var locale = home + '.locale';
|
|
|
|
// Removes the <noscript /> elements to lighten the DOM
|
|
$('noscript').remove();
|
|
|
|
// Allows the user to switch the home page
|
|
$(button).click(function() {
|
|
// Login button
|
|
if($(this).is('.login')) {
|
|
return self.change('loginer');
|
|
}
|
|
|
|
// Register button
|
|
else {
|
|
return self.change('registerer');
|
|
}
|
|
});
|
|
|
|
// Allows the user to view the corporation & about infobox
|
|
$(corp + ', ' + aboutus).hover(function() {
|
|
$(this).addClass('hovered');
|
|
}, function() {
|
|
$(this).removeClass('hovered');
|
|
});
|
|
|
|
// Allows the user to switch the language
|
|
$(locale).hover(function() {
|
|
// Initialize the HTML code
|
|
var keepget = $(locale).attr('data-keepget');
|
|
var html = '<div class="list">';
|
|
|
|
// Generate each locale HTML code
|
|
for(var i in LOCALES_AVAILABLE_ID) {
|
|
html += '<a href="./?l=' + LOCALES_AVAILABLE_ID[i] + keepget + '">' + LOCALES_AVAILABLE_NAMES[i].htmlEnc() + '</a>';
|
|
}
|
|
|
|
html += '</div>';
|
|
|
|
// Append the HTML code
|
|
$(locale).append(html);
|
|
}, function() {
|
|
$(locale + ' .list').remove();
|
|
});
|
|
|
|
// Disables the browser HTTP-requests stopper
|
|
$(document).keydown(function(e) {
|
|
if((e.keyCode == 27) && !System.isDeveloper()) {
|
|
return false;
|
|
}
|
|
});
|
|
|
|
// Warns for an obsolete browser
|
|
if(Utils.isObsolete()) {
|
|
self._obsolete();
|
|
}
|
|
|
|
Console.log('Welcome to Jappix! Happy coding in developer mode!');
|
|
});
|
|
} catch(e) {
|
|
Console.error('Home.launch', e);
|
|
}
|
|
|
|
};
|
|
|
|
|
|
/**
|
|
* Return class scope
|
|
*/
|
|
return self;
|
|
|
|
})();
|
|
|
|
Home.launch();
|