Skip to content

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

fwi: Add property gadget

parent ddea4d9c
Hide whitespace changes
Inline Side-by-side
Showing with 132 additions and 66 deletions
examples/fwi/catalog.js
View file @ 799be6f4
...@@ -27,6 +27,11 @@ ...@@ -27,6 +27,11 @@
"title" : "Blog", "title" : "Blog",
"interface" : "http://www.renderjs.org/interface/blog" "interface" : "http://www.renderjs.org/interface/blog"
}, },
property_1_dict = {
"path" : "./property.html",
"title" : "Property",
"interface" : "http://www.renderjs.org/interface/property"
},
catalog_list = [ catalog_list = [
{ {
"path" : "./officejs.html", "path" : "./officejs.html",
...@@ -39,6 +44,7 @@ ...@@ -39,6 +44,7 @@
catalog_list.push(editor_2_dict); catalog_list.push(editor_2_dict);
catalog_list.push(editor_3_dict); catalog_list.push(editor_3_dict);
catalog_list.push(editor_4_dict); catalog_list.push(editor_4_dict);
catalog_list.push(property_1_dict);
catalog_list.push(blog_1_dict); catalog_list.push(blog_1_dict);
gk.declareMethod('allDocs', function (filter) { gk.declareMethod('allDocs', function (filter) {
...@@ -51,6 +57,9 @@ ...@@ -51,6 +57,9 @@
} else if (filter.query === } else if (filter.query ===
'interface: "http://www.renderjs.org/interface/blog"') { 'interface: "http://www.renderjs.org/interface/blog"') {
deferred.resolve([blog_1_dict]); deferred.resolve([blog_1_dict]);
} else if (filter.query ===
'interface: "http://www.renderjs.org/interface/property"') {
deferred.resolve([property_1_dict]);
} else if (filter.query === } else if (filter.query ===
'interface: "http://www.renderjs.org/interface/editor"') { 'interface: "http://www.renderjs.org/interface/editor"') {
deferred.resolve([editor_2_dict, editor_3_dict, editor_4_dict]); deferred.resolve([editor_2_dict, editor_3_dict, editor_4_dict]);
......
examples/fwi/io.js
View file @ 799be6f4
(function (window, $, jIO, rJS) { (function (window, $, jIO, rJS, RSVP) {
"use strict"; "use strict";
var gk = rJS(window); var gk = rJS(window);
gk.declareMethod('configureIO', function (key, config) { gk.declareMethod('configureIO', function (config) {
this.jio = jIO.createJIO(config); this.jio = jIO.createJIO(config);
this.jio_key = key;
}) })
.declareMethod('getIOList', function () {
.declareMethod('getIO', function () {
var gadget = this; var gadget = this;
// Should use index storage
return gadget.jio.getAttachment({ return gadget.jio.AllDocs({
"_id": gadget.jio_key, "include_docs": true
"_attachment": "content.html"
}).then(function (response) { }).then(function (response) {
return jIO.util.readBlobAsText(response.data); return response.data.rows;
});
})
.declareMethod('getIO', function (key) {
var gadget = this;
return gadget.jio.get({
"_id": key,
}).then(function (response) { }).then(function (response) {
return response.target.result; return response.data;
}); });
}) })
.declareMethod('setIO', function (value) { .declareMethod('setIO', function (document) {
var gadget = this; var gadget = this;
return gadget.jio.put(document);
return gadget.jio.put({"_id": gadget.jio_key})
.then(function () {
return gadget.jio.putAttachment({
"_id": gadget.jio_key,
"_attachment": "content.html",
"_data": value,
"_mimetype": "text/html"
});
});
}) })
.declareMethod('configureDataSourceCallback', function (that, callback) { .declareMethod('configureDataSourceCallback', function (editor, editor_callback, property, property_callback, key) {
var g = this; var g = this;
$(g.element).find('a').unbind('click').click(function () { $(g.element).find('a').unbind('click').click(function () {
callback.apply(that).then(function (value) { RSVP.all([
g.setIO(value); editor_callback.apply(editor),
property_callback.apply(property)
])
.then(function (result_list) {
var document = result_list[1];
document._id = key;
document.text_content = result_list[0];
return g.setIO(document);
}); });
}); });
}); });
}(window, jQuery, jIO, rJS)); }(window, jQuery, jIO, rJS, RSVP));
examples/fwi/officejs.html
View file @ 799be6f4
...@@ -41,7 +41,8 @@ ...@@ -41,7 +41,8 @@
<div class="editor_a"> <div class="editor_a">
<div data-role="fieldcontain" class="editor_a_safe"> <div data-role="fieldcontain" class="editor_a_safe">
</div> </div>
<div data-role="fieldcontain" class="property_a_safe">
</div>
<div data-role="fieldcontain" class="editor_a"> <div data-role="fieldcontain" class="editor_a">
</div> </div>
</div> </div>
...@@ -54,15 +55,6 @@ ...@@ -54,15 +55,6 @@
</div> </div>
</div> </div>
<!-- editor B -->
<div class="editor_b">
<div data-role="fieldcontain" class="editor_b_safe">
</div>
<div data-role="fieldcontain" class="editor_b">
</div>
</div>
</div> </div>
</div> </div>
</body> </body>
......
examples/fwi/officejs.js
View file @ 799be6f4
...@@ -4,35 +4,30 @@ ...@@ -4,35 +4,30 @@
function attachIOToEditor(all_param) { function attachIOToEditor(all_param) {
var editor = all_param[0], var editor = all_param[0],
io = all_param[1], io = all_param[1],
id = all_param[2], id = all_param[2],
jio_config = { property = all_param[3],
"type": "dropbox", jio_config = {
"access_token": "v43SQLCEoi8AAAAAAAAAAVixCoMfDelgGj3NRPfEnqscAuNGp2LhoS8-GiAaDD4C" "type": "dropbox",
}; "access_token": "v43SQLCEoi8AAAAAAAAAAVixCoMfDelgGj3NRPfEnqscAuNGp2LhoS8-GiAaDD4C"
};
$(io.element).trigger('create'); $(io.element).trigger('create');
$(property.element).trigger('create');
$(editor.element).trigger('create'); $(editor.element).trigger('create');
// .then(function (element) { return io.configureIO(jio_config)
// element.trigger('create');
// });
// io.getElement()
// .then(function (element) {
// element.trigger('create');
// });
return io.configureIO(id, jio_config)
.then(function () { .then(function () {
return io.configureDataSourceCallback(editor, editor.getContent); return io.configureDataSourceCallback(editor, editor.getContent, property, property.getContent ,'48c3ca06-78b9-2f4c-80db-d5cb2417de45');
}) })
.then(function () { .then(function () {
return io.getIO().fail(function (error) { return io.getIO('48c3ca06-78b9-2f4c-80db-d5cb2417de45').fail(function (error) {
if (error.status === 404) { if (error.status === 404) {
return ""; return "";
} }
throw error; throw error;
}); });
}) })
.then(function (value) { .then(function (document) {
return editor.setContent(value); return RSVP.all([editor.setContent(document.text_content), property.setContent(document)]);
}); });
} }
...@@ -46,20 +41,20 @@ ...@@ -46,20 +41,20 @@
}; };
$(io.element).trigger('create'); $(io.element).trigger('create');
$(blog.element).trigger('create'); $(blog.element).trigger('create');
return io.configureIO(id, jio_config) return io.configureIO(jio_config)
.then(function () { .then(function () {
return io.configureDataSourceCallback(blog,blog.displayHTML); return io.configureDataSourceCallback(blog,blog.displayHTML, '48c3ca06-78b9-2f4c-80db-d5cb2417de45');
}) })
.then(function () { .then(function () {
return io.getIO().fail(function (error) { return io.getIO('48c3ca06-78b9-2f4c-80db-d5cb2417de45').fail(function (error) {
if (error.status === 404) { if (error.status === 404) {
return ""; return "";
} }
throw error; throw error;
}); });
}) })
.then(function (value) { .then(function (document) {
return blog.displayHTML(value); return blog.displayHTML(document.text_content);
}); });
} }
...@@ -76,18 +71,22 @@ ...@@ -76,18 +71,22 @@
throw rejectedReason; throw rejectedReason;
} }
function createLoadNewEditorCallback(g, editor_path, e_c, io_path, i_c) { function createLoadNewEditorCallback(g, editor_path, e_c, io_path, i_c, property_path, p_c) {
return function () { return function () {
e_c.empty(); e_c.empty();
p_c.empty();
$('.editor_a_safe').attr("style",""); $('.editor_a_safe').attr("style","");
$('.property_a_safe').attr("style","");
return RSVP.all([ return RSVP.all([
g.declareGadget(editor_path, {element: e_c[0], sandbox: 'iframe'}), g.declareGadget(editor_path, {element: e_c[0], sandbox: 'iframe'}),
g.declareGadget(io_path), g.declareGadget(io_path),
"officejs" "officejs",
g.declareGadget(property_path)
]) ])
.then(function (all_param) { .then(function (all_param) {
i_c.empty(); i_c.empty();
i_c[0].appendChild(all_param[1].element); i_c[0].appendChild(all_param[1].element);
p_c[0].appendChild(all_param[3].element);
return attachIOToEditor(all_param); return attachIOToEditor(all_param);
}) })
.fail(handleError); .fail(handleError);
...@@ -98,6 +97,7 @@ ...@@ -98,6 +97,7 @@
return function () { return function () {
e_c.empty(); e_c.empty();
$('.editor_a_safe').attr("style","display:none"); $('.editor_a_safe').attr("style","display:none");
$('.property_a_safe').attr("style","display:none");
return RSVP.all([ return RSVP.all([
g.declareGadget(blog_path, {element: e_c[0], sandbox: 'iframe'}), g.declareGadget(blog_path, {element: e_c[0], sandbox: 'iframe'}),
g.declareGadget(io_path), g.declareGadget(io_path),
...@@ -116,7 +116,9 @@ ...@@ -116,7 +116,9 @@
var editor_a_context = $(g.element).find(".editor_a").last(), 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(".editor_a_safe").last(), io_blog_a_context = $(g.element).find(".editor_a_safe").last(),
blog_a_context = $(g.element).find(".editor_a").last(); blog_a_context = $(g.element).find(".editor_a").last(),
property_a_context = $(g.element).find(".property_a_safe").last()
;
// First, load the catalog gadget // First, load the catalog gadget
g.declareGadget('./catalog.html') g.declareGadget('./catalog.html')
...@@ -133,6 +135,9 @@ ...@@ -133,6 +135,9 @@
), ),
catalog.allDocs( catalog.allDocs(
{query: 'interface: "http://www.renderjs.org/interface/blog"'} {query: 'interface: "http://www.renderjs.org/interface/blog"'}
),
catalog.allDocs(
{query: 'interface: "http://www.renderjs.org/interface/property"'}
) )
]); ]);
}) })
...@@ -141,12 +146,15 @@ ...@@ -141,12 +146,15 @@
editor_list = all_list[0], editor_list = all_list[0],
io_list = all_list[1], io_list = all_list[1],
blog_list = all_list[2], blog_list = all_list[2],
property_list = all_list[3],
editor_definition, editor_definition,
blog_definition, blog_definition,
property_definition,
i; i;
// Load 1 editor and 1 IO and plug them // Load 1 editor and 1 IO and plug them
editor_a_context.empty(); editor_a_context.empty();
$('.editor_a_safe').attr("style","display:none"); $('.editor_a_safe').attr("style","display:none");
$('.property_a_safe').attr("style","display:none");
return RSVP.all([ return RSVP.all([
g.declareGadget( g.declareGadget(
blog_list[0].path, blog_list[0].path,
...@@ -156,13 +164,13 @@ ...@@ -156,13 +164,13 @@
"officejs" "officejs"
]) ])
.then(function (all_param) { .then(function (all_param) {
console.log('Editor Gadget Prepared');
io_blog_a_context.empty(); io_blog_a_context.empty();
io_blog_a_context[0].appendChild(all_param[1].element); io_blog_a_context[0].appendChild(all_param[1].element);
return attachIOToBlog(all_param); return attachIOToBlog(all_param);
}) })
.then(function () { .then(function () {
// Fill the panel // Fill the panel
property_definition = property_list[0];
for (i = 0; i < blog_list.length; i += 1) { for (i = 0; i < blog_list.length; i += 1) {
blog_definition = blog_list[i]; blog_definition = blog_list[i];
panel_context.append( panel_context.append(
...@@ -181,8 +189,10 @@ ...@@ -181,8 +189,10 @@
'data-iconpos="left">' + editor_definition.title + '</a>' 'data-iconpos="left">' + editor_definition.title + '</a>'
); );
panel_context.find('a').last().click( panel_context.find('a').last().click(
createLoadNewEditorCallback(g, editor_definition.path, createLoadNewEditorCallback(
editor_a_context, io_list[0].path, io_a_context) g, editor_definition.path,
editor_a_context, io_list[0].path, io_a_context,
property_definition.path, property_a_context)
); );
} }
panel_context.trigger('create'); panel_context.trigger('create');
......
examples/fwi/property.html 0 → 100644
View file @ 799be6f4
<!DOCTYPE html>
<html>
<head>
<title>Free Web Initiative</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<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="property.js" type="text/javascript"></script>
</head>
<header><h1 style="text-align:center;">Free Web Initiative</h1></header>
<body style="background-color: white; color: black;">
<div class="main-container">
<form id="document-property">
Title: <input id="title" type="text" name="title">
Reference: <input id="reference" type="text" name="reference">
</form>
</div>
</body>
</html>
examples/fwi/property.js 0 → 100644
View file @ 799be6f4
/*jslint indent: 2 */
/*global EventEmitter, RSVP, jIO */
(function (window, rJS,$) {
/**
* Web site configurations
*/
var gk = rJS(window);
/* Initialize Page List */
gk.declareMethod('setContent', function (document) {
var field,
form_field;
for (field in document) {
if (document.hasOwnProperty(field)) {
form_field = $('#' + field);
if (form_field) {
form_field.attr('value', document[field]);
}
}
}
});
gk.declareMethod('getContent', function (value) {
var result = {},
property_value_list = $('#document-property').serializeArray(),
i;
for (i = 0; i < property_value_list.length; i += 1 ) {
result[property_value_list[i].name] = property_value_list[i].value;
}
return result
});
}(window, rJS, jQuery));
\ No newline at end of file
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