Commit 92536bdb authored by Romain Courteaud's avatar Romain Courteaud

Add a login form gadget.

parent e86fb706
...@@ -32,12 +32,6 @@ ...@@ -32,12 +32,6 @@
<!-- route --> <!-- route -->
<script src="../lib/route.js" type="text/javascript"></script> <script src="../lib/route.js" type="text/javascript"></script>
<script src="../lib/url.js" type="text/javascript"></script> <script src="../lib/url.js" type="text/javascript"></script>
<!-- JIO -->
<!--script src="../lib/md5.amd.js" type="text/javascript"></script>
<script src="../lib/jio.js" type="text/javascript"></script>
<script src="../lib/complex_queries.js" type="text/javascript"></script>
<script src="../lib/erp5storage.js" type="text/javascript"></script-->
<!-- custom script --> <!-- custom script -->
<!--script src="../js/erp5_loader.js" type="text/javascript"></script--> <!--script src="../js/erp5_loader.js" type="text/javascript"></script-->
<script src="../js/gadget_index.js" type="text/javascript"></script> <script src="../js/gadget_index.js" type="text/javascript"></script>
...@@ -75,6 +69,14 @@ ...@@ -75,6 +69,14 @@
<div class="panel_element"> <div class="panel_element">
<ul data-role="listview" class="listview" data-theme="slapos-black"> <ul data-role="listview" class="listview" data-theme="slapos-black">
<li data-role="list-divider">Connection</li>
<li class="listview_item listview_icon">
<a href="#/login/">
<span class="ui-li-icon ui-li-icon-custom ui-icon-folder-open-alt ui-icon"
>&nbsp;</span>
<h3>Login</h3>
</a>
</li>
<li data-role="list-divider">General</li> <li data-role="list-divider">General</li>
<li class="listview_item listview_icon"> <li class="listview_item listview_icon">
<a href="#/about/"> <a href="#/about/">
...@@ -133,6 +135,13 @@ ...@@ -133,6 +135,13 @@
</div> </div>
</div> </div>
<h1 class="ui-title"></h1> <h1 class="ui-title"></h1>
<div class="wrap right">
<div data-role="controlgroup" data-type="horizontal"
class="buttongroup">
<a href="#/login/" data-position-to="window" data-role="button"
data-icon="user" class="responsive">Login</a>
</div>
</div>
</div> </div>
<!-- content --> <!-- content -->
......
<html>
<head>
<title>IO</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, user-scalable=no" />
<!-- Jquery -->
<script src="../lib/jquery.js" type="text/javascript"></script>
<!-- renderjs -->
<script src="../lib/jschannel.js" type="text/javascript"></script>
<script src="../lib/renderjs.js" type="text/javascript"></script>
<!-- JIO -->
<script src="../lib/md5.amd.js" type="text/javascript"></script>
<script src="../lib/jio.js" type="text/javascript"></script>
<script src="../lib/complex_queries.js" type="text/javascript"></script>
<script src="../lib/localstorage.js" type="text/javascript"></script>
<script src="../js/gadget_io.js" type="text/javascript"></script>
<link rel="http://www.renderjs.org/rel/interface"
href="http://www.renderjs.org/interface/io"/>
</head>
<body>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, user-scalable=no" />
<title>Login</title>
<!-- Jquery -->
<script src="../lib/jquery.js" type="text/javascript"></script>
<!-- renderjs -->
<script src="../lib/jschannel.js" type="text/javascript"></script>
<script src="../lib/renderjs.js" type="text/javascript"></script>
<!-- custom script -->
<script src="../js/gadget_login.js" type="text/javascript"></script>
</head>
<body>
<div class="content_element">
<h2>Login</h2>
<p>Please enter your jIO localstorage username and validate.</p>
<form id="connect">
<input type="text" value="" name="username"
placeholder="jIO local username" spellcheck="false"
required autofocus="autofocus" />
<input type="submit" value="Login" data-inline="True" />
</form>
</div>
</body>
</html>
...@@ -2,73 +2,69 @@ ...@@ -2,73 +2,69 @@
"use strict"; "use strict";
(function (window, $, rJS, undefined) { (function (window, $, rJS, undefined) {
var gk = rJS(window);
$.mobile.ajaxEnabled = false; $.mobile.ajaxEnabled = false;
$.mobile.linkBindingEnabled = false; $.mobile.linkBindingEnabled = false;
$.mobile.hashListeningEnabled = false; $.mobile.hashListeningEnabled = false;
$.mobile.pushStateEnabled = false; $.mobile.pushStateEnabled = false;
// Set the header title
gk.declareMethod('setTitle', function (title) {
var g = rJS(this);
g.context.find("#headergadget").find("h1").text(title);
$('title').text(title);
});
rJS(window).ready(function () { rJS(window).ready(function () {
var g = rJS(this), var g = rJS(this),
body = g.context, body = g.context,
main_context = g.context.find('.ui-content').first(); main_context = g.context.find('.ui-content').first();
function setTitle(title) { function setTitle(title) {
return g.setTitle(title); g.context.find("#headergadget").find("h1").text(title);
return $('title').text("OfficeJS | " + title);
}
function enhanceGadgetRendering(gadget) {
gadget.context.enhanceWithin();
return gadget.getTitle()
.then(setTitle);
} }
function initializeRoute() { function initializeRoute() {
body body
.route("add", "", 1) .route("add", "", 1)
.done(function () { .done(function () {
$.url.redirect('/about/'); $.url.redirect('/login/');
}); });
body body
.route("add", "/about/", 1) .route("add", "/about/", 1)
.done(function () { .done(function () {
g.declareGadget('./about.html', main_context) g.declareGadget('./about.html', main_context)
.done(function (main_gadget) { .then(enhanceGadgetRendering);
main_gadget.context.enhanceWithin();
main_gadget.getTitle()
.then(setTitle);
});
}); });
body body
.route("add", "/contact/", 1) .route("add", "/contact/", 1)
.done(function () { .done(function () {
g.declareGadget('./contact.html', main_context) g.declareGadget('./contact.html', main_context)
.done(function (main_gadget) { .then(enhanceGadgetRendering);
main_gadget.context.enhanceWithin(); });
main_gadget.getTitle()
.then(setTitle); body
}); .route("add", "/login/", 1)
.done(function () {
g.declareGadget('./login.html', main_context)
.then(enhanceGadgetRendering);
}); });
} }
// Trigger route change g.declareGadget('./io.html', g.context.find("iogadget"))
initializeRoute(); .done(function (io_gadget) {
$.url.onhashchange(function () { // Trigger route change
body.route("go", $.url.getPath()) initializeRoute();
.fail(function () { $.url.onhashchange(function () {
g.declareGadget('./error.html', main_context) body.route("go", $.url.getPath())
.done(function (main_gadget) { .fail(function () {
main_gadget.context.enhanceWithin(); g.declareGadget('./error.html', main_context)
main_gadget.getTitle() .then(enhanceGadgetRendering)
.then(setTitle); .then(initializeRoute);
initializeRoute();
}); });
}); });
}); });
}); });
......
/*global window, jQuery, jIO, rJS */
"use strict";
(function (window, $, jIO, rJS) {
var gk = rJS(window);
gk.declareMethod('configureIO', function (json_configuration, key) {
rJS(this).jio = jIO.newJio(json_configuration);
rJS(this).jio_key = key;
})
.declareMethod('getIO', function () {
var deferred = $.Deferred(),
default_value = "",
gadget = rJS(this);
gadget.jio.getAttachment({
"_id": gadget.jio_key,
"_attachment": "body.txt"
}, function (err, response) {
if (err) {
if (err.status === 404) {
deferred.resolve(default_value);
} else {
deferred.reject(err);
}
} else {
deferred.resolve(response || default_value);
}
});
return deferred.promise();
})
.declareMethod('setIO', function (value) {
var deferred = $.Deferred(),
default_value = "",
gadget = rJS(this);
gadget.jio.put({"_id": gadget.jio_key},
function (err, response) {
if (err) {
deferred.reject(err);
} else {
gadget.jio.putAttachment({
"_id": gadget.jio_key,
"_attachment": "body.txt",
"_data": value,
"_mimetype": "text/plain"
}, function (err, response) {
if (err) {
deferred.reject(err);
} else {
deferred.resolve();
}
});
}
});
return deferred.promise();
});
}(window, jQuery, jIO, rJS));
/*global window, jQuery, rJS */
"use strict";
(function (window, $, rJS, undefined) {
var gk = rJS(window);
rJS(window).ready(function () {
var g = rJS(this),
form_context = g.context.find('form'),
field_context = form_context.find("input[type=text]");
function submit_event() {
var jio_json = {
"type": "local",
"username": field_context.val()
};
// XXX What to do?
g.context.text(JSON.stringify(jio_json));
return false;
}
form_context.submit(submit_event);
});
}(window, jQuery, rJS));
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment