ghopp
/
taskrambler
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

some work on the javascript...still I think it's not very good, but better than before.

v0.1.8
Georg Hopp 12 years ago
parent
717b037dc4
commit
3ab1cc3ebb
7 changed files with 348 additions and 159 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 3
      assets/html/layout.html
  2. 53
      assets/js/application.js
  3. 105
      assets/js/init.js
  4. 56
      assets/js/menu.js
  5. 126
      assets/js/session.js
  6. 110
      assets/js/session.orig.js
  7. 54
      assets/js/user.js

3
assets/html/layout.html
View File

@ -14,6 +14,9 @@
<script type="text/javascript" src="/js/jquery.ui.touch-punch.min.js"></script> <script type="text/javascript" src="/js/jquery.ui.touch-punch.min.js"></script>
<script type="text/javascript" src="/js/serverval.js"></script> <script type="text/javascript" src="/js/serverval.js"></script>
<script type="text/javascript" src="/js/session.js"></script> <script type="text/javascript" src="/js/session.js"></script>
<script type="text/javascript" src="/js/user.js"></script>
<script type="text/javascript" src="/js/menu.js"></script>
<script type="text/javascript" src="/js/application.js"></script>
<script type="text/javascript" src="/js/init.js"></script> <script type="text/javascript" src="/js/init.js"></script>
</head> </head>

53
assets/js/application.js
View File

@ -0,0 +1,53 @@
function Application()
{
}
Application.prototype.init = function(menu) {
this.session = new Session("#sessid", "#sessinfo");
this.user = new User("#user", menu);
$(window).focus($.proxy(this.session.update, this.session));
$.getJSON("/version/", function(data) {
this.version = data.version;
$("#version").empty().append("version: " + this.version);
});
}
Application.prototype.logout = function() {
$.ajax({
dataType : "json",
url : "/authenticate/",
type : "DELETE",
success : $.proxy(this.user.update, this.user),
complete : $.proxy(this.session.update, this.session)
});
}
Application.prototype.login = function(ev) {
this._sendForm("#login", "/authenticate/", ev);
}
Application.prototype.signup = function(ev) {
this._sendForm("#signup", "/signup/", ev);
}
Application.prototype._sendForm = function(id, url, ev) {
ev.preventDefault();
$.ajax({
dataType : "json",
url : url,
type : "POST",
data : $(id + " form").serialize(),
success : $.proxy(this._formSuccess, this, id),
complete : $.proxy(this.session.update, this.session)
});
}
Application.prototype._formSuccess = function(id) {
this.user.update();
$(id + "-container").addClass("hide");
}
// vim: set ts=4 sw=4:

105
assets/js/init.js
View File

@ -1,9 +1,11 @@
var sess = null; var sess = null;
$(document).ready(function() { $(document).ready(function() {
var sval = new ServerVal("#randval");
var asset_exp = /^.*\/(.*)/;
var asset = '/_main.html';
var sval = new ServerVal("#randval");
var asset_exp = /^.*\/(.*)/;
var asset = '/_main.html';
var application = new Application();
var menu = new Menu("#menu", application);
var title_adds = { var title_adds = {
'/_author.html' : ' - Author', '/_author.html' : ' - Author',
@ -23,95 +25,34 @@ $(document).ready(function() {
$("#title").load("/_title.html"); $("#title").load("/_title.html");
$("#main").load(asset); $("#main").load(asset);
menu.init(application);
$("#menu").load("/_menu.html", function() {
$("div#menu ul li.signup").click(function(e) {
if ($("#signup-container").hasClass("hide")) {
$("#login-container").addClass("hide");
$("#signup-container").css("top", e.pageY + 20);
$("#signup-container").css("left", e.pageX - 100);
$("#signup-container").removeClass("hide");
} else {
$("#signup-container").addClass("hide");
}
});
$("div#menu ul li.login").click(function(e) {
if ($("#login-container").hasClass("hide")) {
$("#signup-container").addClass("hide");
$("#login-container").css("top", e.pageY + 20);
$("#login-container").css("left", e.pageX - 100);
$("#login-container").removeClass("hide");
} else {
$("#login-container").addClass("hide");
}
});
$("#statusline").load("/_statusline.html", function() {
application.init(menu);
}); });
$("#statusline").load("/_statusline.html", function (){
sess = new Session("#sessinfo", "#sessid", "#user");
$.getJSON(
"/version/",
function(data) {
$("#version").empty().append("version: " + data.version);
}
);
$.getJSON("/sessinfo/", $.proxy(sess.loadJSON, sess));
$.getJSON("/currentuser/", $.proxy(sess.loadUserJSON, sess));
$(window).focus(function() {
$.getJSON("/sessinfo/", $.proxy(sess.loadJSON, sess));
$("#login").load("/_login.html", function() {
$(function() {
$("#login-container").draggable();
}); });
$("div#menu ul li.logout").click(function() {
$.ajax({
dataType: "json",
url: "/authenticate/",
type: 'DELETE',
success: $.proxy(sess.loadUserJSON, sess)
});
$.getJSON("/sessinfo/", $.proxy(sess.loadJSON, sess));
$("#login-close").click(function() {
$("#login-container").addClass("hide");
}); });
$("#login").load("/_login.html", function (){
$(function() {
$("#login-container").draggable();
});
$("#login-close").click(function (e) {
$("#login-container").addClass("hide");
});
$("#login form").submit(function(event) {
event.preventDefault();
$.post("/authenticate/",
$("#login form").serialize(),
$.proxy(sess.loadUserJSON, sess));
$("#login-container").addClass("hide");
$.getJSON("/sessinfo/", $.proxy(sess.loadJSON, sess));
});
$("#login form").submit($.proxy(application.login, application));
});
$("#signup").load("/_signup.html", function (){
$(function() {
$("#signup-container").draggable();
}); });
$("#signup").load("/_signup.html", function (){
$(function() {
$("#signup-container").draggable();
});
$("#signup-close").click(function (e) {
$("#signup-container").addClass("hide");
});
$("#signup form").submit(function(event) {
event.preventDefault();
$.post("/signup/",
$("#signup form").serialize(),
$.proxy(sess.loadUserJSON, sess));
$("#signup-container").addClass("hide");
$.getJSON("/sessinfo/", $.proxy(sess.loadJSON, sess));
});
$("#signup-close").click(function (e) {
$("#signup-container").addClass("hide");
}); });
$("#signup form").submit($.proxy(application.signup, application));
}); });
$("#footer").load("/_footer.html", function (){ $("#footer").load("/_footer.html", function (){

56
assets/js/menu.js
View File

@ -0,0 +1,56 @@
function Menu(menuSelector, application, user)
{
this.application = application;
this.signupSelector = menuSelector + " ul li.signup";
this.loginSelector = menuSelector + " ul li.login";
this.logoutSelector = menuSelector + " ul li.logout";
this.menuElement = $(menuSelector);
}
Menu.prototype.init = function() {
this.menuElement.load("/_menu.html", $.proxy(this._menuActions, this));
}
Menu.prototype.update = function() {
if (this.application.user.isEmpty()) {
$(this.signupSelector).removeClass("hide");
$(this.loginSelector).removeClass("hide");
$(this.logoutSelector).addClass("hide");
} else {
$(this.signupSelector).addClass("hide");
$(this.loginSelector).addClass("hide");
$(this.logoutSelector).removeClass("hide");
}
}
Menu.prototype._menuActions = function() {
$(this.signupSelector).click(function(ev) {
if ($("#signup-container").hasClass("hide")) {
$("#login-container").addClass("hide");
$("#signup-container").css("top", ev.pageY + 20);
$("#signup-container").css("left", ev.pageX - 100);
$("#signup-container").removeClass("hide");
} else {
$("#signup-container").addClass("hide");
}
});
$(this.loginSelector).click(function(ev) {
if ($("#login-container").hasClass("hide")) {
$("#signup-container").addClass("hide");
$("#login-container").css("top", ev.pageY + 20);
$("#login-container").css("left", ev.pageX - 100);
$("#login-container").removeClass("hide");
} else {
$("#login-container").addClass("hide");
}
});
$(this.logoutSelector)
.click($.proxy(this.application.logout, this.application));
}
// vim: set ts=4 sw=4:

126
assets/js/session.js
View File

@ -1,109 +1,81 @@
function Session(sInfo, sId, sUser)
function Session(idSelector, infoSelector)
{ {
this.eUser = $(sUser);
this.eId = $(sId);
this.canvas = $(sInfo + " canvas").get(0);
this.context = this.canvas.getContext("2d");
this.idElement = $(idSelector);
this.canvas = $(infoSelector + " canvas").get(0);
this.context = this.canvas.getContext("2d");
this.id = "none"
this.timeout = 0;
this.timeleft = 0;
this.email = "";
this.firstname = "";
this.surname = "";
this.interval = null;
this._interval = null;
//this.draw();
this.update();
} }
Session.prototype.loadUserJSON = function(data)
{
this.username = data.username;
this.email = data.email;
this.firstname = data.firstname;
this.surname = data.surname;
name = "";
if ('' == this.username) {
name = "not logged in";
$("li.signup").removeClass("hide");
$("li.login").removeClass("hide");
$("li.logout").addClass("hide");
} else {
if ('' == this.firstname || '' == this.surname) {
name += this.username;
} else {
name += this.firstname + " " + this.surname;
}
$("li.signup").addClass("hide");
$("li.login").addClass("hide");
$("li.logout").removeClass("hide");
}
this.eUser.empty().append(name);
Session.prototype.update = function() {
$.getJSON("/sessinfo/", $.proxy(this._update, this));
} }
Session.prototype.loadJSON = function(data)
{
// this.stop();
this.id = ("0" == data.id)? "none" : data.id;
this.timeout = data.timeout * 10;
this.timeleft = data.timeleft * 10;
Session.prototype.clear = function() {
this.id = "none";
this.timeout = 0;
this.timeleft = 0;
this.eId.empty().append(this.id);
this._fraction = 0.0;
this._leftWidth = 0.0;
this.draw();
if (0 < this.timeleft)
this.start();
this.idElement.empty().append(this.id);
this._stop();
} }
Session.prototype.draw = function()
/*
* not real private but as a convention I use _ prefix to indicate
* internal use only.
*/
Session.prototype._update = function(data)
{ {
this.context.fillStyle = "rgb(255, 0, 0)";
this.context.fillRect(0, 0, this.canvas.width, this.canvas.height);
this.id = ("0" == data.id)? "none" : data.id;
this.timeout = data.timeout;
this.timeleft = data.timeleft;
this.context.fillStyle = "rgb(0, 255, 0)";
this.context.fillRect(0, 0,
this.canvas.width / this.timeout * this.timeleft,
this.canvas.height);
this._fraction = this.canvas.width / this.timeout;
this._leftWidth = this._fraction * this.timeleft;
this.idElement.empty().append(this.id);
this._start();
} }
Session.prototype.start = function()
Session.prototype._start = function()
{ {
if (null === this.interval) {
this.interval = setInterval($.proxy(this.process, this), 1000);
this._draw();
if (0 < this.timeleft && null === this._interval) {
this._interval = setInterval($.proxy(this._process, this), 5000);
} }
} }
Session.prototype.process = function()
Session.prototype._process = function()
{ {
if (0 >= this.timeleft) { if (0 >= this.timeleft) {
this.stop();
this.clear();
} }
else { else {
this.timeleft -= 10;
this.draw();
this.timeleft-=5;
this._leftWidth -= 5*this._fraction;
this._draw();
} }
} }
Session.prototype.stop = function()
{
clearInterval(this.interval);
this.interval = null;
this.id = "none";
this.timeout = 0;
this.timeleft = 0;
this.username = "";
this.email = "";
this.firstname = "";
this.surname = "";
Session.prototype._draw = function() {
this.context.fillStyle = "rgb(255, 0, 0)";
this.context.fillRect(0, 0, this.canvas.width, this.canvas.height);
this.eId.empty().append("");
this.eUser.empty().append("not logged in");
this.context.fillStyle = "rgb(0, 255, 0)";
this.context.fillRect(0, 0, this._leftWidth, this.canvas.height);
}
this.draw();
Session.prototype._stop = function()
{
clearInterval(this._interval);
this._interval = null;
} }
// vim: set ts=4 sw=4: // vim: set ts=4 sw=4:

110
assets/js/session.orig.js
View File

@ -0,0 +1,110 @@
function Session(sInfo, sId, sUser)
{
this.eUser = $(sUser);
this.eId = $(sId);
this.canvas = $(sInfo + " canvas").get(0);
this.context = this.canvas.getContext("2d");
this.id = "none"
this.timeout = 0;
this.timeleft = 0;
this.user = null;
//this.draw();
}
Session.prototype.isAthenticated = function(data)
{
}
Session.prototype.authenticate = function(data)
{
this.username = data.username;
this.email = data.email;
this.firstname = data.firstname;
this.surname = data.surname;
name = "";
if ('' == this.username) {
name = "not logged in";
$("li.signup").removeClass("hide");
$("li.login").removeClass("hide");
$("li.logout").addClass("hide");
} else {
if ('' == this.firstname || '' == this.surname) {
name += this.username;
} else {
name += this.firstname + " " + this.surname;
}
$("li.signup").addClass("hide");
$("li.login").addClass("hide");
$("li.logout").removeClass("hide");
}
this.eUser.empty().append(name);
}
Session.prototype.loadJSON = function(data)
{
// this.stop();
this.id = ("0" == data.id)? "none" : data.id;
this.timeout = data.timeout * 10;
this.timeleft = data.timeleft * 10;
this.eId.empty().append(this.id);
this.draw();
if (0 < this.timeleft)
this.start();
}
Session.prototype.draw = function()
{
this.context.fillStyle = "rgb(255, 0, 0)";
this.context.fillRect(0, 0, this.canvas.width, this.canvas.height);
this.context.fillStyle = "rgb(0, 255, 0)";
this.context.fillRect(0, 0,
this.canvas.width / this.timeout * this.timeleft,
this.canvas.height);
}
Session.prototype.start = function()
{
if (null === this.interval) {
this.interval = setInterval($.proxy(this.process, this), 1000);
}
}
Session.prototype.process = function()
{
if (0 >= this.timeleft) {
this.stop();
}
else {
this.timeleft -= 10;
this.draw();
}
}
Session.prototype.stop = function()
{
clearInterval(this.interval);
this.interval = null;
this.id = "none";
this.timeout = 0;
this.timeleft = 0;
this.username = "";
this.email = "";
this.firstname = "";
this.surname = "";
this.eId.empty().append("");
this.eUser.empty().append("not logged in");
this.draw();
}
// vim: set ts=4 sw=4:

54
assets/js/user.js
View File

@ -0,0 +1,54 @@
function User(userSelector, menu)
{
this.userElement = $(userSelector);
this.menu = menu;
this.update();
}
User.prototype.update = function() {
$.getJSON("/currentuser/", $.proxy(this._setData, this));
}
User.prototype.clear = function() {
this.username = "";
this.email = "";
this.firstname = "";
this.surname = "";
this._displayUser();
}
User.prototype.isEmpty = function() {
if ("" == this.username) {
return true;
}
return false;
}
User.prototype._setData = function(data) {
this.username = data.username;
this.email = data.email;
this.firstname = data.firstname;
this.surname = data.surname;
this._displayUser();
this.menu.update();
}
User.prototype._displayUser = function() {
if (this.isEmpty()) {
this.userElement.empty().append("not logged in");
} else {
if ("" == this.firstname || "" == this.surname) {
this.userElement.empty().append(this.username);
} else {
this.userElement.empty()
.append(this.firstname + " " + this.surname);
}
}
}
// vim: set ts=4 sw=4:
Write Preview
Loading…
Cancel
Save