$(function() {
var originalData = {
show_editor: false,
container: "preview"
};
var userData = {
bins: [
{
type: "ResourceList",
title: "Resource List",
list: [
{
title: "IRI",
url: "http://www.iri.centrepompidou.fr/",
image: "http://www.iri.centrepompidou.fr/wp-content/themes/IRI-Theme/images/logo-iri-petit_fr_fr.png",
description: "Institut de Recherche et d'Innovation"
}
]
}
],
search: [
{
type: "Wikipedia",
lang: "en"
}
]
};
function getNormalizedHtml(jqsel) {
return jqsel.html().replace(/[\r\n]/gm,' ').replace(/\s{2,}/g,' ').replace(/(^\s+|\s+$)/g,'');
}
var searchEngineTemplate = getNormalizedHtml($(".search-engine-list"));
$(".search-engine-list").empty().sortable();
var resourceTemplate = getNormalizedHtml($(".resource-list"));
$(".resource-list").empty();
var binTemplate = getNormalizedHtml($(".bin-list"));
$(".bin-list").empty().sortable();
function addSearchEngine(data, editMode) {
$(".item").removeClass("item-editing");
var element = $(searchEngineTemplate),
allfields = element.find(".edit-value"),
typefield = element.find(".search-engine-type .edit-value"),
typedisplay = element.find(".search-engine-type .display-value"),
langsection = element.find(".search-engine-language"),
langfield = element.find(".search-engine-language .edit-value"),
langdisplay = element.find(".search-engine-language .display-value");
element.data("userdata",data);
if (editMode) {
element.addClass("item-editing");
}
var onChange = function() {
data.type = typefield.val();
typedisplay.text(typefield.find("[value=" + data.type + "]").text());
if (data.type === "Wikipedia") {
data.lang = langfield.val() || "en";
langdisplay.text(langfield.find("[value=" + data.lang + "]").text());
langsection.show();
} else {
delete data.lang;
langsection.hide();
}
};
typefield.val(data.type);
if (data.type === "Wikipedia") {
langfield.val(data.lang || "en");
}
allfields.on("keyup paste change", onChange);
onChange();
element.click(function() {
$(".item").removeClass("item-editing");
element.addClass("item-editing");
return false;
});
element.find(".remove-item").click(function() {
element.remove();
return false;
});
$(".search-engine-list").append(element);
}
function addBin(data, editMode) {
$(".item").removeClass("item-editing");
var element = $(binTemplate),
allfields = element.find(".edit-value"),
typefield = element.find(".bin-type .edit-value"),
typedisplay = element.find(".bin-type .display-value"),
langsection = element.find(".bin-language"),
langfield = langsection.find(".edit-value"),
langdisplay = langsection.find(".display-value"),
ldtsection = element.find(".ldt-options"),
ldttypefield = element.find(".bin-ldt-type .edit-value"),
ldttypedisplay = element.find(".bin-ldt-type .display-value"),
ldtpffield = element.find(".bin-ldt-platform .edit-value"),
ldtpfdisplay = element.find(".bin-ldt-platform .display-value"),
ldtprojsection = element.find(".bin-ldt-project"),
ldtprojfield = ldtprojsection.find(".edit-value"),
ldtprojdisplay = ldtprojsection.find(".display-value"),
kwsection = element.find(".bin-keyword"),
kwfield = kwsection.find(".edit-value"),
kwdisplay = kwsection.find(".display-value"),
ressection = element.find(".bin-resources"),
titlefield = element.find(".bin-title .edit-value"),
titledisplay = element.find(".bin-title .display-value"),
reslist = element.find(".resource-list");
reslist.sortable({
stop: updateListData
});
element.data("userdata",data);
if (editMode) {
element.addClass("item-editing");
}
var onChange = function() {
data.type = typefield.val();
typedisplay.text(typefield.find("[value=" + data.type + "]").text());
if (data.type === "Wikipedia") {
data.lang = langfield.val() || "en";
langdisplay.text(langfield.find("[value=" + data.lang + "]").text());
langsection.show();
} else {
delete data.lang;
langsection.hide();
}
if (data.type === "Ldt") {
ldtsection.show();
data.ldt_type = ldttypefield.val() || "Results";
ldttypedisplay.text(ldttypefield.find("[value=" + data.ldt_type + "]").text());
data.ldt_platform = ldtpffield.val() || ldtpffield.val("http://ldt.iri.centrepompidou.fr/").val();
ldtpfdisplay.text(data.ldt_platform);
if (data.ldt_type === "Project") {
data.project_id = ldtprojfield.val();
ldtprojdisplay.text(data.ldt_project);
ldtprojsection.show();
} else {
delete data.ldt_project;
ldtprojsection.hide();
}
} else {
delete data.ldt_type;
delete data.project_id;
delete data.ldt_platform;
ldtsection.hide();
}
if (data.type === "Wikipedia" || (data.type === "Ldt" && data.ldt_type === "Results")) {
data.search = kwfield.val();
kwdisplay.text(data.search);
kwsection.show();
} else {
delete data.search;
kwsection.hide();
}
if (data.type === "ResourceList") {
data.title = titlefield.val() || titlefield.val("Untitled Resource List").val();
titledisplay.text(data.title);
ressection.show();
} else {
ressection.hide();
}
updateListData();
};
var updateListData = function() {
if (data.type === "ResourceList") {
data.list = Array.prototype.slice.call(
reslist.find(".resource").map(function(){return $(this).data("userdata");})
);
} else {
delete data.list;
}
};
var addResource = function(resdata, editmode) {
var resel = $(resourceTemplate),
all_fields = resel.find(".edit-value"),
title_field = resel.find(".resource-title .edit-value"),
title_text = resel.find(".resource-title .display-value"),
url_field = resel.find(".resource-url .edit-value"),
url_text = resel.find(".resource-url .display-value"),
description_field = resel.find(".resource-description .edit-value"),
description_text = resel.find(".resource-description .display-value"),
image_field = resel.find(".resource-image .edit-value"),
image_text = resel.find(".resource-image .display-value");
resel.data("userdata",resdata);
if (editmode) {
resel.addClass("resource-editing");
}
var onResourceChange = function() {
resdata.title = title_field.val();
title_text.text(resdata.title);
resdata.description = description_field.val();
description_text.text(resdata.description);
resdata.url = url_field.val();
url_text.text(resdata.url);
resdata.image = image_field.val();
image_text.text(resdata.image);
updateListData();
};
title_field.val( resdata.title || "" );
url_field.val( resdata.url || "" );
description_field.val( resdata.description || "" );
image_field.val( resdata.image || "" );
all_fields.on("keyup paste change", onResourceChange);
onResourceChange();
resel.find(".remove-item").click(function() {
resel.remove();
updateListData();
return false;
});
resel.click(function() {
$(".resource").removeClass("resource-editing");
resel.addClass("resource-editing");
return false;
});
reslist.append(resel);
};
if (data.list) {
data.list.forEach(addResource);
}
typefield.val(data.type);
if (data.type === "Wikipedia") {
langfield.val(data.lang || "en");
}
if (data.type === "Ldt") {
ldttypefield.val(data.ldt_type || "Results");
ldtpffield.val(data.ldt_platform || "http://ldt.iri.centrepompidou.fr/");
if (data.ldt_type === "Project") {
ldtprojfield.val(data.ldt_project);
}
}
if (data.type === "Wikipedia" || (data.type === "Ldt" && data.ldt_type === "Results")) {
kwfield.val(data.search || "");
}
if (data.type === "ResourceList") {
titlefield.val(data.title || "Untitled Resource List");
}
allfields.on("keyup paste change", onChange);
onChange();
element.click(function() {
$(".item").removeClass("item-editing");
element.addClass("item-editing");
return false;
});
element.find(".remove-item").click(function() {
element.remove();
return false;
});
element.find(".add-resource").click(function() {
addResource({"title": "New Resource"},true);
return false;
});
$(".bin-list").append(element);
}
userData.search.forEach(function(data) {
addSearchEngine(data,false);
});
userData.bins.forEach(function(data) {
addBin(data,false);
});
$(".add-search-engine").click(function() {
addSearchEngine({
type: "Wikipedia",
lang: "en"
}, true);
return false;
});
$(".add-bin").click(function() {
addBin({
type: "Wikipedia",
lang: "en",
search: ""
}, true);
return false;
});
$(".update-preview").click(function() {
userData.search = Array.prototype.slice.call(
$(".search-engine").map(function(){return $(this).data("userdata");})
);
userData.bins = Array.prototype.slice.call(
$(".bin").map(function(){return $(this).data("userdata");})
);
new Rkns.Renkan(_.extend({}, originalData, userData));
});
new Rkns.Renkan(_.extend({}, originalData, userData));
});