Skip to content

R
renderjs
Commit 07726f3b authored by Cédric Le Ninivin's avatar Cédric Le Ninivin
Browse files
Options

fwi: integrate basic blog gadget

parent ec10ac71
Hide whitespace changes
Inline Side-by-side
Showing with 141 additions and 187 deletions
examples/fwi/blog.html
View file @ 07726f3b
<!DOCTYPE html>
<html>
<head>
<title>Free Web Initiative</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="css/main.css">
<script src="js/lib/events/events.js"></script>
<script src="js/lib/jio/sha256.amd.js"></script>
<script src="js/lib/jio/rsvp-custom.js"></script>
<script src="js/lib/jio/jio.js"></script>
<script src="js/lib/jio/complex_queries.js"></script>
<script src="js/lib/jio/localstorage.js"></script>
<script src="js/lib/jio/indexstorage.js"></script>
<script src="js/lib/jio/qiniustorage.js"></script>
<script src="js/lib/jio/dropboxstorage.js"></script>
<script src="js/lib/jio/hmac-sha1.js"></script>
<link rel="stylesheet" href="blog.css">
<script src="../../lib/jquery/jquery.js" type="text/javascript"></script>
<script src="../../node_modules/rsvp/dist/rsvp-2.0.4.js" type="text/javascript"></script>
<script src="../../dist/renderjs-latest.js" type="text/javascript"></script>
<script src="blog.js" type="text/javascript"></script>
</head>
<header><h1 style="text-align:center;">Free Web Initiative</h1></header>
<body style="background-color: white; color: black;">
......@@ -22,9 +17,6 @@
<div id="content"></div>
</div>
</div>
<a id="dropbox_login" href=''>Dropbox</a>
<script src="js/dropbox.js"></script>
<script src="js/website.js"></script>
</body>
</html>
examples/fwi/blog.js
View file @ 07726f3b
/*jslint indent: 2 */
/*global EventEmitter, RSVP, jIO */
(function () {
/**
* Web site configurations
*/
var now,
website_content =
[
{
"title": "Motto",
"reference": "erp5-Kyorin.Success.Case",
"language": "en",
"version": "001",
"created": now,
"modified": now,
"description": "A success story of Kyorin implementation of ERP5",
"text_content": "<h2>Motto</h2><p><strong>Regive access to your code</strong></p>"
},{
"title": "Guidelines",
"reference": "erp5-Tristans.document",
"language": "en",
"version": "001",
"created": now,
"modified": now,
"description": "test stestestes",
"text_content": '<h2>Free Web Application rules/guidelines</h2><p>see: <a href="http://www.gnu.org/philosophy/free-sw.en.html">Free Software Philosophy</a>.<ul><li>The freedom to run the application, for any purpose (freedom 0).</li><li>The freedom to study how the application works, and change it so it does your computing as you wish (freedom 1). Access to the source code is a precondition for this. (free web application should provide original code and a facility to compile it.)</li><li>The freedom to redistribute copies so you can help your neighbor (freedom 2).</li><li>The freedom to distribute copies of your modified versions to others (freedom 3). By doing this you can give the whole community a chance to benefit from your changes. Access to the source code is a precondition for this.</l></ul>'
},{
"title": "Freedom Button",
"reference": "erp5-Kyorin.Success.FB",
"language": "en",
"version": "001",
"created": now,
"modified": now,
"description": "A success story of Kyorin implementation of ERP5",
"text_content": "<h2>Freedom Button</h2><p>Free web is at the reach of a button: the freedom button displayed on your page. With just a click, users start to browse and modify the code.</p>"
},{
"title": "Education",
"reference": "erp5-Kyorin.Success.edu",
"language": "en",
"version": "001",
"created": now,
"modified": now,
"description": "A success story of Kyorin implementation of ERP5",
"text_content": "<h2>Free Web is for Education</h2><p>Computer science have never been this easy to practice. The only thing you need is a browser. Let's offer people a opportunity to learn how tools they uses everyday are make.</p><p>Free Web offer the opportunity for user to easily modify the way they are using the web. It facilitates the development of a web application because the user only need a browser to create it. He can easily ask for help because its code is available to everyone. You can also learn by modify and tweaking around an existing application. Further more, languages used in Web application are standard, to learn how to do basic applications you just need to learn 3 basic technologies: JavaScript, html and css.Doing so we offer a direct development tool without any installation. Only the code stays. We can reach people more easily. A MooC only cost its development and in then available to everyone for free, ready for modification and community improvement.We this, we can reach people that could not be reached before: women, children, elders... We can teach them and ask them to do the tools they will be using on the web. Computer science and the Web have been developed by scientists, developers and entrepreneurs, it is time for users to have a word because this amazing tool is for them.</p>"
}
],
configuration, cache = {},
/*jio_config = {
"type": "index",
"indices": [{
"id": "id.json",
"index": ["_id", "type", "reference", "modified",
"title", "description",
"text_content"],
"title": "Index the ID",
"attachment": "index.json"},
],
"sub_storage": {
"type": "dropbox",
"bucket": "yourtasks",
"access_key": "-ZKzQmTR8MRh0UEIE-a7Sc-GlD2Rd2tHCEweqKzP",
"secret_key": "LUKfbUtFSc_L8Ix8ZRrwEJfC6PgJbJiRWqpnz-kg"
}
},
jio_config = {
"type": "local",
"username": "Nexedi SA",
"application_name": "Live Website Demo"
},
jio_config = {
"type": "index",
"indices": [{
"id": "id.json",
"index": ["_id", "type", "reference", "modified",
"title", "description",
"text_content"],
"title": "Index the ID",
"attachment": "index.json"},
],
"sub_storage": {
"type": "dropbox",
"access_token": "v43SQLCEoi8AAAAAAAAAAVixCoMfDelgGj3NRPfEnqscAuNGp2LhoS8-GiAaDD4C"
}
},*/
jio_config = {
"type": "dropbox",
"access_token": "v43SQLCEoi8AAAAAAAAAAVixCoMfDelgGj3NRPfEnqscAuNGp2LhoS8-GiAaDD4C"
},
repository = jIO.createJIO(jio_config)
,website_emitter = new events.EventEmitter(), place, cache;
/**
* allow users to bind listeners to websites event
* TODO need to export website_emitter to window!
*/
place = {
"index": {
"dom": document.querySelector("#index")
},
"content": {
"dom": document.querySelector("#content")
}
};
/**
* SHOULD BE USED FOR TEST ONLY
* Creates and fill the page repository
* @return A promise
*/
var addSomePageIntoLocalStorageIfNecessary = function () {
/*Empty local storage before filling it*/
//window.localStorage.clear();
//window.sessionStorage.clear();
console.log("filling");
for (i = 0; i < website_content.length -1; i += 1) {
repository.post(website_content[i]);
}
console.log('almost')
return repository.post(website_content[website_content.length -1])
};
/**
* Retrieve the list of web pages
*/
var getPageList = function () {
return repository.allDocs({"include_docs": true})
.then(function (answer) {
return answer;
})
};
var loadAndDisplayIndexView = function () {
getPageList()
.then(function (response) {
// on index success
var i, length, rows, row, page_list_html = "<ul>";
rows = response.data.rows;
length = rows.length;
for (i = 0; i < length; i += 1) {
page_list_html += "<li><a href=\"#" + rows[i].doc.title.replace(/"/g, "\\\"") +
"\">" + rows[i].doc.title + "</a></li>";
}
page_list_html += "</ul>";
place.index.dom.innerHTML = page_list_html;
})
};
var loadAndDisplayContentPage = function (page_title) {
getPageList()
.then(function (response) {
// on page list response
var i, rows = response.data.rows, length = rows.length;
for (i = 0; i < length; i += 1) {
if (rows[i].doc.title === page_title) {
// show page
place.content.dom.innerHTML = rows[i].doc.text_content;
return;
}
}
place.content.dom.innerHTML = "<p>404</p>";
})
},
(function (window, rJS,$) {
/**
* Web site configurations
*/
var gk = rJS(window);
/**
* Run the web site runtime
*/
runWebSite = function () {
console.log('run');
window.addEventListener("hashchange", function () {
loadAndDisplayContentPage(location.hash.slice(1));
var loadAndDisplayIndexView = function () {
var i, length, rows, row, page_list_html = "<ul>";
rows = this.page_list.data.rows;
length = rows.length;
for (i = 0; i < length; i += 1) {
page_list_html += "<li><a href=\"#" + rows[i].doc.title.replace(/"/g, "\\\"") +
"\">" + rows[i].doc.title + "</a></li>";
}
page_list_html += "</ul>";
place.index.dom.innerHTML = page_list_html;
};
var loadAndDisplayContentPage = function (value) {
var i; //,
//rows = this.page_list.data.rows,
//length = rows.length;
//for (i = 0; i < length; i += 1) {
//if (rows[i].doc.title === page_title) {
// // show page
$("#content").empty().append(value);
//place.content.dom.innerHTML = rows[i].doc.text_content;
// return;
// }
//}
//place.content.dom.innerHTML = "<p>404</p>";
};
/* Initialize Page List */
gk.declareMethod('setPageList', function (page_list) {
this.page_list = page_list;
});
gk.declareMethod('displayHTML', function (value) {
this.value = value;
loadAndDisplayContentPage(value);
});
console.log('Index')
loadAndDisplayIndexView();
if (location.hash) {
loadAndDisplayContentPage(location.hash.slice(1));
}
};
/*addSomePageIntoLocalStorageIfNecessary().then(runWebSite, console.error);}());*/
runWebSite();}());
\ No newline at end of file
/**
* Run the web site runtime
*/
gk.ready(function (g) {
console.log('run-blog');
});
}(window, rJS, jQuery));
\ No newline at end of file
examples/fwi/catalog.js
View file @ 07726f3b
......@@ -27,6 +27,11 @@
"title" : "Aloha Editor Gadget",
"interface" : "http://www.renderjs.org/interface/editor"
},
blog_1_dict = {
"path" : "./blog.html",
"title" : "Blog Gadget",
"interface" : "http://www.renderjs.org/interface/blog"
},
catalog_list = [
{
"path" : "./officejs.html",
......@@ -40,6 +45,7 @@
catalog_list.push(editor_2_dict);
catalog_list.push(editor_3_dict);
catalog_list.push(editor_4_dict);
catalog_list.push(blog_1_dict);
gk.declareMethod('allDocs', function (filter) {
var deferred = $.Deferred();
......@@ -48,6 +54,9 @@
} else if (filter.query ===
'interface: "http://www.renderjs.org/interface/io"') {
deferred.resolve([io_dict]);
} else if (filter.query ===
'interface: "http://www.renderjs.org/interface/blog"') {
deferred.resolve([blog_1_dict]);
} else if (filter.query ===
'interface: "http://www.renderjs.org/interface/editor"') {
deferred.resolve([editor_1_dict, editor_2_dict, editor_3_dict, editor_4_dict]);
......
examples/fwi/officejs.html
View file @ 07726f3b
......@@ -45,6 +45,14 @@
<div data-role="fieldcontain" class="editor_a">
</div>
</div>
<!-- blog A -->
<div class="blog_a">
<div data-role="fieldcontain" class="blog_a_safe">
</div>
<div data-role="fieldcontain" class="blog_a">
</div>
</div>
<!-- editor B -->
<div class="editor_b">
......
examples/fwi/officejs.js
View file @ 07726f3b
......@@ -36,6 +36,33 @@
});
}
function attachIOToBlog(all_param) {
var blog = all_param[0],
io = all_param[1],
id = all_param[2],
jio_config = {
"type": "dropbox",
"access_token": "v43SQLCEoi8AAAAAAAAAAVixCoMfDelgGj3NRPfEnqscAuNGp2LhoS8-GiAaDD4C"
};
$(io.element).trigger('create');
$(blog.element).trigger('create');
return io.configureIO(id, jio_config)
.then(function () {
return io.configureDataSourceCallback(blog,blog.displayHTML);
})
.then(function () {
return io.getIO().fail(function (error) {
if (error.status === 404) {
return "";
}
throw error;
});
})
.then(function (value) {
return blog.displayHTML(value);
});
}
function handleError(rejectedReason) {
var word_list;
console.warn(rejectedReason);
......@@ -66,23 +93,47 @@
};
}
function createLoadNewBlogCallback(g, blog_path, e_c, io_path, i_c) {
return function () {
e_c.empty();
return RSVP.all([
g.declareGadget(blog_path, {element: e_c[0], sandbox: 'iframe'}),
g.declareGadget(io_path),
"officejs"
])
.then(function (all_param) {
i_c.empty();
i_c[0].appendChild(all_param[1].element);
return attachIOToBlog(all_param);
})
.fail(handleError);
};
}
rJS(window).ready(function (g) {
var editor_a_context = $(g.element).find(".editor_a").last(),
io_a_context = $(g.element).find(".editor_a_safe").last();
io_a_context = $(g.element).find(".editor_a_safe").last(),
io_blog_a_context = $(g.element).find(".blog_a_safe").last(),
blog_a_context = $(g.element).find(".blog_a").last();
// editor_b_context = g.context.find(".editor_b").last(),
// io_b_context = g.context.find(".editor_b_safe").last();
// First, load the catalog gadget
console.log('start');
g.declareGadget('./catalog.html')
.then(function (catalog) {
// Fetch the list of editor and io gadgets
// This is done in 2 different queries to the catalog
console.log('catalog ready');
return RSVP.all([
catalog.allDocs(
{query: 'interface: "http://www.renderjs.org/interface/editor"'}
),
catalog.allDocs(
{query: 'interface: "http://www.renderjs.org/interface/io"'}
),
catalog.allDocs(
{query: 'interface: "http://www.renderjs.org/interface/blog"'}
)
]);
})
......@@ -90,9 +141,10 @@
var panel_context = $(g.element).find(".bare_panel"),
editor_list = all_list[0],
io_list = all_list[1],
blog_list = all_list[2],
editor_definition,
i;
console.log('got Catalog Stuff');
// Load 1 editor and 1 IO and plug them
editor_a_context.empty();
return RSVP.all([
......@@ -104,10 +156,25 @@
"officejs"
])
.then(function (all_param) {
console.log('Editor Gadget Prepared');
io_a_context.empty();
io_a_context[0].appendChild(all_param[1].element);
return attachIOToEditor(all_param);
})
.then(function (){
return RSVP.all([ // Load Blog
g.declareGadget(
blog_list[0].path,
{element: blog_a_context[0], sandbox: 'iframe'}
),
g.declareGadget(io_list[0].path),// io_blog_a_context),
"officejs"
])})
.then(function (all_param) {
io_blog_a_context.empty();
io_blog_a_context[0].appendChild(all_param[1].element);
return attachIOToBlog(all_param);
})
.then(function () {
// Fill the panel
for (i = 0; i < editor_list.length; i += 1) {
......
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
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7