Commit 769179ee authored by François Billioud's avatar François Billioud

implements svg-editor

implements save/load from local document
parent ccd821cd
......@@ -11,12 +11,10 @@ var Xinha = function() {
xinha_init();
}
this.saveEdition = function() {
var textArea = $("#input_area");
getCurrentDocument().saveEdition(textArea.content);
getCurrentDocument().saveEdition($("#input_area").attr("value"));
}
this.loadContent = function() {
var textArea = $("input_area");
textArea.content = getCurrentDocument().getContent();
this.loadContentFromDocument = function(doc) {
$("#input_area").attr("value",doc.getContent());
}
this.load();
}
......@@ -28,11 +26,11 @@ var Xinha = function() {
*/
var JSONTextDocument = function() {
JSONDocument.call(this);//inherits from JSONDocument
JSONDocument.call(this);//inherits properties from JSONDocument
this.type = "text";
}
JSONTextDocument.prototype = new JSONDocument();
JSONTextDocument.prototype = new JSONDocument();//inherits methods from JSONDocument
JSONTextDocument.prototype.saveEdition = function(content) {
this.setContent(content);
......@@ -42,6 +40,7 @@ JSONTextDocument.prototype.saveEdition = function(content) {
JSONTextDocument.prototype.setAsCurrentDocument = function() {
getCurrentPage().displayDocumentTitle(this);
getCurrentPage().displayDocumentState(this);
getCurrentPage().displayDocumentContent(this);
getCurrentPage().displayAuthorName(this);
getCurrentPage().displayLastModification(this);
setCurrentDocument(this);
......@@ -53,19 +52,10 @@ getCurrentDocument = function() {
return doc;
}
saveCurrentDocument = function() {
getCurrentPage().getEditor().saveEdition();
//saveJIO(); : JIO function
}
/*
// save
saveCurrentDocument = function() {
//gestion fichier
var currentDocument = getLocalDocument();
currentDocument.updateDocument();
saveXHR = function() {
//create request
var xhr=null;
try
......@@ -83,7 +73,7 @@ saveCurrentDocument = function() {
//xhr.open("PUT", keyToUrl(key, wallet), true, wallet.userAddress, wallet.davToken);
//HACK:
xhr.open("PUT", currentUser.storage+"/dav/temp.json", true);
xhr.open("PUT", "dav/temp.json", true);
xhr.setRequestHeader("Authorization", "Basic "+"nom:test");
//END HACK.
......@@ -91,17 +81,15 @@ saveCurrentDocument = function() {
if(xhr.readyState == 4) {
if(xhr.status != 200 && xhr.status != 201 && xhr.status != 204) {
alert("error: got status "+xhr.status+" when doing basic auth PUT on url "+Base64.encode("nom:test")+" " + xhr.statusText);
} else {
lastModificationArea.innerHTML = currentDocument.getLastModification();
}
}
}
xhr.withCredentials = "true";
xhr.send(JSON.stringify(currentDocument.getDocument()));
xhr.send(JSON.stringify(getCurrentDocument()));
}
// load
loadDocument = function() {
loadXHR = function() {
//create request
var xhr=null;
......@@ -118,20 +106,18 @@ loadDocument = function() {
}
}
xhr.open("GET", currentUser.storage+"/dav/temp.json", false);
xhr.open("GET", "dav/temp.json", false);
xhr.onreadystatechange = function() {
if(xhr.readyState == 4) {
var cDoc = null;
var cDoc = new JSONTextDocument();
if(xhr.status == 200) {
cDoc = new Document(JSON.parse(xhr.responseText));
cDoc.load(JSON.parse(xhr.responseText));
} else {
alert("error: got status "+xhr.status+" when doing basic auth GET on url "+"nom:test"+" " + xhr.statusText);
cDoc = new Document(null);
}
cDoc.updateHTML();
setLocalDocument(cDoc);
cDoc.setAsCurrentDocument();
}
}
xhr.send();
}*/
}
/**
* Editors
*/
SVGEditor = function() {
this.name = "svg-editor";
this.load = function() {$("#svgframe").attr("src", "svg-editor/svg-editor.html")}
this.saveEdition = function() {
var s = "svgframe";
getCurrentDocument().saveEdition(window.frames[s].svgCanvas.getSvgString());
}
this.loadContentFromDocument = function(doc) {
var s = "svgframe";
window.frames[s].svgCanvas.setSvgString(doc.getContent());
}
var s = "svgframe";
this.svgCanvas = window.frames[s].svgCanvas;
this.load();
}
/**
* SVG documents
*/
var JSONIllustrationDocument = function() {
JSONDocument.call(this);//inherits properties from JSONDocument
this.type = "illustration";
}
JSONIllustrationDocument.prototype = new JSONDocument();//inherits methods from JSONDocument
JSONIllustrationDocument.prototype.saveEdition = function(content) {
this.setContent(content);
this.setLastModification(currentTime());
this.setAsCurrentDocument();
}
JSONIllustrationDocument.prototype.setAsCurrentDocument = function() {
getCurrentPage().displayDocumentTitle(this);
getCurrentPage().displayDocumentState(this);
getCurrentPage().displayDocumentContent(this);
getCurrentPage().displayAuthorName(this);
getCurrentPage().displayLastModification(this);
setCurrentDocument(this);
}
getCurrentDocument = function() {
var doc = new JSONIllustrationDocument();
doc.load(JSON.parse(localStorage.getItem("currentDocument")));
return doc;
}
// save
saveXHR = function() {
//create request
var xhr=null;
try
{
xhr = new XMLHttpRequest();
} catch(e)
{
try {xhr = new ActiveXObject("Msxml2.XMLHTTP");}
catch (e2)
{
try {xhr = new ActiveXObject("Microsoft.XMLHTTP");}
catch (e) {alert("Please install a more recent browser")}
}
}
//xhr.open("PUT", keyToUrl(key, wallet), true, wallet.userAddress, wallet.davToken);
//HACK:
xhr.open("PUT", "dav/temp2.json", true);
xhr.setRequestHeader("Authorization", "Basic "+"nom:test");
//END HACK.
xhr.onreadystatechange = function() {
if(xhr.readyState == 4) {
if(xhr.status != 200 && xhr.status != 201 && xhr.status != 204) {
alert("error: got status "+xhr.status+" when doing basic auth PUT on url "+Base64.encode("nom:test")+" " + xhr.statusText);
}
}
}
xhr.withCredentials = "true";
xhr.send(JSON.stringify(getCurrentDocument()));
}
// load
loadXHR = function() {
//create request
var xhr=null;
try
{
xhr = new XMLHttpRequest();
} catch(e)
{
try {xhr = new ActiveXObject("Msxml2.XMLHTTP");}
catch (e2)
{
try {xhr = new ActiveXObject("Microsoft.XMLHTTP");}
catch (e) {}
}
}
xhr.open("GET", "dav/temp2.json", false);
xhr.onreadystatechange = function() {
if(xhr.readyState == 4) {
var cDoc = new JSONIllustrationDocument();
if(xhr.status == 200) {
cDoc.load(JSON.parse(xhr.responseText));
} else {
alert("error: got status "+xhr.status+" when doing basic auth GET on url "+"nom:test"+" " + xhr.statusText);
}
cDoc.setAsCurrentDocument();
}
}
xhr.send();
}
\ No newline at end of file
/**
* Editors
*/
SheetEditor = function() {
this.name = "JQuery Sheet Editor";
this.load = function() {
$("#jQuerySheet0").sheet({
buildSheet: '10x15',
title: 'Spreadsheet Playground',
inlineMenu: inlineMenu($.sheet.instance)
});
}
this.saveEdition = function() {}
this.loadContentFromDocument = function(doc) {}
this.load();
}
/***
* Spreadsheet documents
*/
......@@ -26,6 +45,7 @@ JSONSheetDocument.prototype.load({
//display document information
setAsCurrentDocument: function() {
getCurrentPage().displayDocumentTitle(this);
//getCurrentPage().displayDocumentContent(this);
getCurrentPage().displayDocumentState(this);
getCurrentPage().displayAuthorName(this);
getCurrentPage().displayLastModification(this);
......@@ -34,17 +54,11 @@ JSONSheetDocument.prototype.load({
});
getCurrentDocument = function() {
var doc = new JSONTextDocument();
var doc = new JSONSheetDocument();
doc.load(JSON.parse(localStorage.getItem("currentDocument")));
return doc;
}
saveCurrentDocument = function() {
getCurrentPage().getEditor().saveEdition();
//saveJIO(); : JIO function
}
......@@ -89,12 +103,4 @@ function goToObj(s) {
return false;
}
$("#jQuerySheet0").sheet({
buildSheet: '10x15',
title: 'Spreadsheet Playground',
inlineMenu: inlineMenu($.sheet.instance)
});
/*
*/
\ No newline at end of file
......@@ -48,16 +48,25 @@ Page.prototype = {
},
/* update the HTML page from the XML document */
loadPage: function() {
//Page content
this.displayPageTitle();
this.displayPageContent();
var dependencies = this.getDependencies();
$(dependencies).find("linkfile").each(function() {currentPage.include($(this).text(),"link");});//includes css
$(dependencies).find("scriptfile").each(function() {currentPage.include($(this).text(),"script");});//includes js
switch(this.name) {
case "editor":
this.editor = new Xinha();
break;
case "table":
this.editor = new SheetEditor();
break;
case "illustration":
this.editor = new SVGEditor();
break;
}
},
/* include a javascript or a css file */
include: function(file,type) {
......@@ -101,6 +110,7 @@ Page.prototype = {
displayAuthorName: function(doc) {this.getHTML().getElementById("author").innerHTML = doc.getAuthor();},
displayLastModification: function(doc) {this.getHTML().getElementById("last_update").innerHTML = doc.getLastModification();},
displayDocumentTitle: function(doc) {this.getHTML().getElementById("document_title").innerHTML = doc.getTitle();},
displayDocumentContent: function(doc) {this.getEditor().loadContentFromDocument(doc);},
displayDocumentState: function(doc) {
var stateArea = this.getHTML().getElementById("document_state");
stateArea.innerHTML = doc.getState()[getCurrentUser().getLanguage()];
......@@ -164,7 +174,7 @@ setCurrentUser = function(user) {localStorage.setItem("currentUser", JSON.string
/* JSON document */
var JSONDocument = function() {
this.type = "text";
this.type = null;
this.language = getCurrentUser().getLanguage();
this.version = null;
......@@ -173,7 +183,7 @@ var JSONDocument = function() {
this.content="";
this.creation=currentTime();
this.lastModification=currentTime();
this.state=Document.states.draft;
this.state=this.states.draft;
}
JSONDocument.prototype = new UngObject();
......@@ -216,7 +226,7 @@ JSONDocument.prototype.load({
save: function() {}
});
Document.states = {
JSONDocument.prototype.states = {
draft:{"fr":"Brouillon","en":"Draft"},
saved:{"fr":"Enregistré","en":"Saved"},
deleted:{"fr":"Supprimé","en":"Deleted"}
......@@ -235,7 +245,7 @@ setCurrentDocument = function(doc) {localStorage.setItem("currentDocument",JSON.
editDocumentSettings = function() {
$("#edit_document").dialog({
autoOpen: false,
autoOpen: true,
height: 131,
width: 389,
modal: true,
......@@ -258,6 +268,12 @@ editDocumentSettings = function() {
});
}
saveCurrentDocument = function() {
getCurrentPage().getEditor().saveEdition();
saveXHR();
//saveJIO(); : JIO function
}
changeLanguage = function(language) {
var user = getCurrentUser();
user.setLanguage(language);
......
......@@ -25,12 +25,20 @@ UngObject.prototype.load = function(data) {
/* Load methods from a class to another class */
UngObject.prototype.inherits = function(superClass) {
for (var element in superClass.prototype ) {
this.prototype[element] = superClass.prototype[element]
}
this.prototype.load(superClass.prototype);
}
/**
* returns the current date
*/
currentTime = function() {return (new Date()).toUTCString();}
\ No newline at end of file
currentTime = function() {return (new Date()).toUTCString();}
/*
* wait an event before execute an action
*/
waitBeforeExecution = function(event, func) {
var waitBefore = function() {
if(event) {func.call();} else {setTimeout(waitBefore,1000)}
}
setTimeout(waitBefore,1000);
}
\ No newline at end of file
......@@ -3,7 +3,7 @@
<title> Page web - Web Page </title>
<content>
<label>
Contenu de la page
Page Content
</label>
<div class="input">
......
<root>
<title> Illustration Web - Web Illustration </title>
<content>
<label>
Page Content
</label>
<div class="input"><div >
<iframe name="svgframe" id="svgframe" width="100%" height="600"/>
</div></div>
</content>
<dependencies>
<scriptfile>js/illustration.js</scriptfile>
<stylefile>css/jquery-ui.css</stylefile>
</dependencies>
</root>
......@@ -10,57 +10,7 @@
<link rel="stylesheet" href="js/jquery/plugin/sheet/jquery.sheet.css" type="text/css" />
<link rel="stylesheet" href="jquery_sheet_editor/jquery.sheet.erp5.css" type="text/css" />
<link rel="stylesheet" href="js/jquery/plugin/colorpicker/jquery.colorPicker.css" type="text/css" />
<link rel="stylesheet" href="js/jquery/plugin/colorpicker/menu.css" type="text/css" />
<script type="text/javascript">
$("button.save").click(function(event){
source = $.sheet.instance[0].getSource(true);
$("input#my_text_content").attr("value", source)
});
$(function() {
$('#jQuerySheet0').sheet({
title: 'Spreadsheet Playground',
inlineMenu: inlineMenu($.sheet.instance),
urlGet: './getTextContent',
});
});
function inlineMenu(instance) {
var I = (instance ? instance.length : 0);
var html = $('#inlineMenu').html().replace(/sheetInstance/g, "$.sheet.instance[" + I + "]");
var menu = $(html);
menu.find('.colorPickerCell')
.colorPicker()
.change(function() {
$.sheet.instance[I].cellUndoable.add($.sheet.instance[I].obj.cellHighlighted());
$.sheet.instance[I].obj.cellHighlighted().css('background-color', $(this).val());
$.sheet.instance[I].cellUndoable.add($.sheet.instance[I].obj.cellHighlighted());
});
menu.find('.colorPickerFont')
.colorPicker()
.change(function() {
$.sheet.instance[I].cellUndoable.add($.sheet.instance[I].obj.cellHighlighted());
$.sheet.instance[I].obj.cellHighlighted().css('color', $(this).val());
$.sheet.instance[I].cellUndoable.add($.sheet.instance[I].obj.cellHighlighted());
});
menu.find('.colorPickers')
.children().eq(1).css('background-image', "url('jquery_sheet_image/palette.png')");
menu.find('.colorPickers')
.children().eq(3).css('background-image', "url('jquery_sheet_image/palette_bg.png')");
return menu;
}
function goToObj(s) {
$('html, body').animate({
scrollTop: $(s).offset().top
}, 'slow');
return false;
}
</script>
<!--<link rel="stylesheet" href="js/jquery/plugin/colorpicker/menu.css" type="text/css" />-->
<div id="jQuerySheet0" style="height: 400px;"></div>
......@@ -145,7 +95,7 @@
</span>
<a href="#" onclick="sheetInstance.obj.formula().val('=HYPERLINK(\'' + prompt('Enter Web Address', 'http://www.visop-dev.com/') + '\')').keydown(); return false;" title="HyperLink">
<img alt="Web Link" src="jquery_sheet_image/page_link.png" />
<img alt="Web Link" src="jquery_sheet_editor/jquery_sheet_image/page_link.png" />
</a>
<a href="#" onclick="sheetInstance.toggleFullScreen(); $('#lockedMenu').toggle(); return false;" title="Toggle Full Screen">
<img alt="Web Link" src="jquery_sheet_editor/jquery_sheet_image/arrow_out.png" />
......@@ -157,12 +107,15 @@
<dependencies>
<scriptfile>js/jquery/plugin/sheet/jquery.sheet.js</scriptfile>
<scriptfile>js/jquery/plugin/mbmenu/mbMenu.min.js</scriptfile>
<scriptfile>js/jquery/plugin/jqcharts/jgcharts.min.js</scriptfile>
<scriptfile>js/jquery/plugin/jqchart/jgcharts.min.js</scriptfile>
<scriptfile>js/jquery/plugin/colorpicker/jquery.colorPicker.min.js</scriptfile>
<scriptfile>js/jquery/plugin/elastic/jquery.elastic.min.js</scriptfile>
<scriptfile>js/jquery/plugin/sheet/jquery.sheet.erp5.js</scriptfile>
<scriptfile>js/jquery/plugin/jqcharts/jgcharts.min.js</scriptfile>
<scriptfile>js/jquery/plugin/sheet/jquery.sheet.js</scriptfile>
<scriptfile>js/table.js</scriptfile>
<stylefile>js/jquery/plugin/sheet/jquery.sheet.css</stylefile>
<stylefile>css/table.css</stylefile>
<stylefile>js/jquery/plugin/colorpicker/jquery.colorPicker.css</stylefile>
<stylefile>css/jquery-ui.css</stylefile>
</dependencies>
</root>
<link rel="stylesheet" href="css/jquery.sheet.erp5.css" type="text/css" />
\ 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