drop handler and enhancer functions, and read me explains this.
--- a/client/README.md Thu Feb 13 17:23:25 2014 +0100
+++ b/client/README.md Fri Feb 14 12:40:52 2014 +0100
@@ -282,6 +282,39 @@
});
</script>
+
+## Drop management
+
+You can override, partially or totally, the function that handle the drop event from an other web page.
+The current function catches drops from google results page, tweets, links, images and other things like svg paths.
+If you want to override totally the handler function, you can define a **drop\_handler** function that receives a \_data object
+and returns a node object. A node object has title, description, image and uri properties. The \_data object is received from the
+browser's drop event. Here is an example of drop\_handler function :
+
+ _renkan = new Rkns.Renkan({
+ ...
+ drop_handler: function(_data){
+ var newNode = {};
+ newNode.title = "Overridden title";
+ newNode.description = "Overridden description " + _data["text/plain"];
+ return newNode;
+ }
+ });
+
+
+You can also define a **drop\_enhancer** function that receives the already formed node object and \_data object. This function has to
+return the overriden node object. Here is an example of drop\_enhancer function :
+
+ _renkan = new Rkns.Renkan({
+ ...
+ drop_enhancer: function(newNode, _data){
+ newNode.title = "Overridden title";
+ return newNode;
+ }
+ });
+
+
+
## Tests
Because of a simple php file enabling persistent connection, you can not test the writables examples by only opening them in your browser.
--- a/client/js/paper-renderer.js Thu Feb 13 17:23:25 2014 +0100
+++ b/client/js/paper-renderer.js Fri Feb 14 12:40:52 2014 +0100
@@ -2525,71 +2525,84 @@
}
catch(e) {}
}
- var newNode = {};
- switch(_data["text/x-iri-specific-site"]) {
- case "twitter":
- var snippet = $('<div>').html(_data["text/x-iri-selected-html"]),
- tweetdiv = snippet.find(".tweet");
- newNode.title = _renkan.translate("Tweet by ") + tweetdiv.attr("data-name");
- newNode.uri = "http://twitter.com/" + tweetdiv.attr("data-screen-name") + "/status/" + tweetdiv.attr("data-tweet-id");
- newNode.image = tweetdiv.find(".avatar").attr("src");
- newNode.description = tweetdiv.find(".js-tweet-text:first").text();
- break;
- case "google":
- var snippet = $('<div>').html(_data["text/x-iri-selected-html"]);
- newNode.title = snippet.find("h3:first").text().trim();
- newNode.uri = snippet.find("h3 a").attr("href");
- newNode.description = snippet.find(".st:first").text().trim();
- break;
- case undefined:
- default:
- if (_data["text/x-iri-source-uri"]) {
- newNode.uri = _data["text/x-iri-source-uri"];
- }
- if (_data["text/plain"] || _data["text/x-iri-selected-text"]) {
- newNode.description = (_data["text/plain"] || _data["text/x-iri-selected-text"]).replace(/[\s\n]+/gm,' ').trim();
- }
- if (_data["text/html"] || _data["text/x-iri-selected-html"]) {
- var snippet = $('<div>').html(_data["text/html"] || _data["text/x-iri-selected-html"]);
- var _svgimgs = snippet.find("image");
- if (_svgimgs.length) {
- newNode.image = _svgimgs.attr("xlink:href");
- }
- var _svgpaths = snippet.find("path");
- if (_svgpaths.length) {
- newNode.clipPath = _svgpaths.attr("d");
- }
- var _imgs = snippet.find("img");
- if (_imgs.length) {
- newNode.image = _imgs[0].src;
- }
- var _as = snippet.find("a");
- if (_as.length) {
- newNode.uri = _as[0].href;
- }
- newNode.title = snippet.find("[title]").attr("title") || newNode.title;
- newNode.description = snippet.text().replace(/[\s\n]+/gm,' ').trim();
- }
- if (_data["text/uri-list"]) {
- newNode.uri = _data["text/uri-list"];
- }
- if (_data["text/x-moz-url"] && !newNode.title) {
- newNode.title = (_data["text/x-moz-url"].split("\n")[1] || "").trim();
- if (newNode.title === newNode.uri) {
- newNode.title = false;
- }
- }
- if (_data["text/x-iri-source-title"] && !newNode.title) {
- newNode.title = _data["text/x-iri-source-title"];
- }
- if (_data["text/html"] || _data["text/x-iri-selected-html"]) {
- newNode.image = snippet.find("[data-image]").attr("data-image") || newNode.image;
- newNode.uri = snippet.find("[data-uri]").attr("data-uri") || newNode.uri;
- newNode.title = snippet.find("[data-title]").attr("data-title") || newNode.title;
- newNode.description = snippet.find("[data-description]").attr("data-description") || newNode.description;
- newNode.description = snippet.find("[data-clip-path]").attr("data-clip-path") || newNode.description;
- }
+
+ // Option management : drop handler
+ if(typeof _renkan.options.drop_handler === "undefined"){
+ _renkan.options.drop_handler = function(_data){
+ var newNode = {};
+ switch(_data["text/x-iri-specific-site"]) {
+ case "twitter":
+ var snippet = $('<div>').html(_data["text/x-iri-selected-html"]),
+ tweetdiv = snippet.find(".tweet");
+ newNode.title = _renkan.translate("Tweet by ") + tweetdiv.attr("data-name");
+ newNode.uri = "http://twitter.com/" + tweetdiv.attr("data-screen-name") + "/status/" + tweetdiv.attr("data-tweet-id");
+ newNode.image = tweetdiv.find(".avatar").attr("src");
+ newNode.description = tweetdiv.find(".js-tweet-text:first").text();
+ break;
+ case "google":
+ var snippet = $('<div>').html(_data["text/x-iri-selected-html"]);
+ newNode.title = snippet.find("h3:first").text().trim();
+ newNode.uri = snippet.find("h3 a").attr("href");
+ newNode.description = snippet.find(".st:first").text().trim();
+ break;
+ case undefined:
+ default:
+ if (_data["text/x-iri-source-uri"]) {
+ newNode.uri = _data["text/x-iri-source-uri"];
+ }
+ if (_data["text/plain"] || _data["text/x-iri-selected-text"]) {
+ newNode.description = (_data["text/plain"] || _data["text/x-iri-selected-text"]).replace(/[\s\n]+/gm,' ').trim();
+ }
+ if (_data["text/html"] || _data["text/x-iri-selected-html"]) {
+ var snippet = $('<div>').html(_data["text/html"] || _data["text/x-iri-selected-html"]);
+ var _svgimgs = snippet.find("image");
+ if (_svgimgs.length) {
+ newNode.image = _svgimgs.attr("xlink:href");
+ }
+ var _svgpaths = snippet.find("path");
+ if (_svgpaths.length) {
+ newNode.clipPath = _svgpaths.attr("d");
+ }
+ var _imgs = snippet.find("img");
+ if (_imgs.length) {
+ newNode.image = _imgs[0].src;
+ }
+ var _as = snippet.find("a");
+ if (_as.length) {
+ newNode.uri = _as[0].href;
+ }
+ newNode.title = snippet.find("[title]").attr("title") || newNode.title;
+ newNode.description = snippet.text().replace(/[\s\n]+/gm,' ').trim();
+ }
+ if (_data["text/uri-list"]) {
+ newNode.uri = _data["text/uri-list"];
+ }
+ if (_data["text/x-moz-url"] && !newNode.title) {
+ newNode.title = (_data["text/x-moz-url"].split("\n")[1] || "").trim();
+ if (newNode.title === newNode.uri) {
+ newNode.title = false;
+ }
+ }
+ if (_data["text/x-iri-source-title"] && !newNode.title) {
+ newNode.title = _data["text/x-iri-source-title"];
+ }
+ if (_data["text/html"] || _data["text/x-iri-selected-html"]) {
+ newNode.image = snippet.find("[data-image]").attr("data-image") || newNode.image;
+ newNode.uri = snippet.find("[data-uri]").attr("data-uri") || newNode.uri;
+ newNode.title = snippet.find("[data-title]").attr("data-title") || newNode.title;
+ newNode.description = snippet.find("[data-description]").attr("data-description") || newNode.description;
+ newNode.description = snippet.find("[data-clip-path]").attr("data-clip-path") || newNode.description;
+ }
+ }
+ if(typeof _renkan.options.drop_enhancer === "function"){
+ newNode = _renkan.options.drop_enhancer(newNode, _data);
+ }
+ return newNode;
+ };
}
+
+ var newNode = _renkan.options.drop_handler(_data);
+
if (!newNode.title) {
newNode.title = this.renkan.translate("Dragged resource");
}
--- a/client/test/test-writable-bins-div-100.html Thu Feb 13 17:23:25 2014 +0100
+++ b/client/test/test-writable-bins-div-100.html Fri Feb 14 12:40:52 2014 +0100
@@ -63,7 +63,11 @@
],
/*property_files: [ "data/properties.json" ],
node_fill_color: false*/
- language: "fr"
+ language: "fr",
+ drop_enhancer: function(newNode, _data){
+ newNode.title = "Prefix : " + newNode.title;
+ return newNode;
+ }
});
Rkns.jsonIO(_renkan, {
url: "../data/simple-persist.php"