Commit 11f81591 authored by Tristan Cavelier's avatar Tristan Cavelier Committed by Sebastien Robin

Adding mime object to OfficeJS

We can select files in the slickgrid document lister and the good application
will be loaded with the good file. Extensions are hidden.
parent afb2be24
...@@ -58,18 +58,6 @@ $().ready(function() { ...@@ -58,18 +58,6 @@ $().ready(function() {
<i class="icon-download-alt icon-white"></i> <i class="icon-download-alt icon-white"></i>
Save Save
</button>&nbsp; </button>&nbsp;
<button type="submit"
class="btn"
onclick="OfficeJS.load($('#input_fileName').attr('value'));">
<i class="icon-upload"></i>
Load
</button>&nbsp;
<button type="submit"
class="btn btn-danger"
onclick="OfficeJS.remove($('#input_fileName').attr('value'));">
<i class="icon-remove icon-white"></i>
Remove
</button>
</div> </div>
<div id="elrte_editor"> <div id="elrte_editor">
<h1>OfficeJS elRTE texteditor</h1><p>This is a new document.<br></p> <h1>OfficeJS elRTE texteditor</h1><p>This is a new document.<br></p>
......
...@@ -217,18 +217,6 @@ function goToObj(s){ ...@@ -217,18 +217,6 @@ function goToObj(s){
<i class="icon-download-alt icon-white"></i> <i class="icon-download-alt icon-white"></i>
Save Save
</button>&nbsp; </button>&nbsp;
<button type="submit"
class="btn"
onclick="OfficeJS.load($('#input_fileName').attr('value'));">
<i class="icon-upload"></i>
Load
</button>&nbsp;
<button type="submit"
class="btn btn-danger"
onclick="OfficeJS.remove($('#input_fileName').attr('value'));">
<i class="icon-remove icon-white"></i>
Remove
</button>
</div> </div>
<div id="jQuerySheet" class="jQuerySheet" style="height: 450px;"> <div id="jQuerySheet" class="jQuerySheet" style="height: 450px;">
</div> </div>
......
...@@ -44,15 +44,15 @@ ...@@ -44,15 +44,15 @@
New Spreadsheet New Spreadsheet
</a> </a>
</li> </li>
<li class="editpreferences left-nav-tools"> <!-- <li class="editpreferences left-nav-tools"> -->
<a href="#/editpreferences" <!-- <a href="#/editpreferences" -->
onclick="javascript: <!-- onclick="javascript: -->
OfficeJS.open({app:'editpreferences'}); <!-- OfficeJS.open({app:'editpreferences'}); -->
return false;"> <!-- return false;"> -->
<i class="icon-check"></i> <!-- <i class="icon-check"></i> -->
Edit Preferences <!-- Edit Preferences -->
</a> <!-- </a> -->
</li> <!-- </li> -->
<li id="nav_document_list_header left-nav-tools"> <li id="nav_document_list_header left-nav-tools">
<a href="#/doclist" <a href="#/doclist"
onclick="javascript: onclick="javascript:
......
...@@ -44,7 +44,7 @@ ...@@ -44,7 +44,7 @@
<!-- <!--
(function () { (function () {
var grid, onSortFunction, onClickFunction, checkboxselector, var grid, onSortFunction, onClickFunction, checkboxselector,
onRemoveSeveral, onRemoveSeveral, showIconFormatter,
documentlist = OfficeJS.cloneCurrentDocumentList(), documentlist = OfficeJS.cloneCurrentDocumentList(),
columns = [], columns = [],
options = { options = {
...@@ -54,13 +54,33 @@ ...@@ -54,13 +54,33 @@
forceFitColumns: true forceFitColumns: true
}; };
showIconFormatter = function (row,cell,value,columnDef,dataContext) {
return dataContext.icon;
};
(function (array) { (function (array) {
var i, lm, cd; var i, lm, cd, split, mime;
// FIXME : we can have 2012/1/1 12:5
// we should have 2012/01/01 12:05
for (i = 0; i < array.length; i += 1) { for (i = 0; i < array.length; i += 1) {
// TODO : create fileNameWithoutExt and fileApplication // file names
// according to the file extension. split = array[i].fileName.split('.');
array[i].fileExt = '';
if (split.length > 1) {
array[i].fileExt = split[split.length-1];
split.length -= 1;
}
array[i].fileBaseName = split.join('.');
// app & icon
mime = OfficeJS.getMimeOfExt (array[i].fileExt);
if (!mime) {
array[i].icon = '?';
array[i].app = 'textEditor';
} else {
array[i].icon = mime.icon;
array[i].app = mime.pref || mime.app;
}
// dates
// FIXME : we can have 2012/1/1 12:5
// we should have 2012/01/01 12:05
lm = (new Date(array[i].lastModified)); lm = (new Date(array[i].lastModified));
cd = (new Date(array[i].creationDate)); cd = (new Date(array[i].creationDate));
array[i].lastModified = lm.getFullYear()+'/'+ array[i].lastModified = lm.getFullYear()+'/'+
...@@ -72,7 +92,6 @@ ...@@ -72,7 +92,6 @@
} }
}(documentlist)); }(documentlist));
$(function () { $(function () {
checkboxselector = new Slick.CheckboxSelectColumn({ checkboxselector = new Slick.CheckboxSelectColumn({
...@@ -80,9 +99,10 @@ ...@@ -80,9 +99,10 @@
}); });
columns.push(checkboxselector.getColumnDefinition()); columns.push(checkboxselector.getColumnDefinition());
columns.push({id:"icon",name:"",field:"icon", columns.push({id:"icon",name:"",field:"icon",
sortable:true,resizable:false,width:24}); sortable:true,resizable:false,width:24,
formatter:showIconFormatter});
columns.push({id:"fileName",name:"Document", columns.push({id:"fileName",name:"Document",
field:"fileName",sortable:true}); field:"fileBaseName",sortable:true});
columns.push({id:"lastModified",name:"Modified", columns.push({id:"lastModified",name:"Modified",
field:"lastModified",sortable:true}); field:"lastModified",sortable:true});
columns.push({id:"creationDate",name:"Created", columns.push({id:"creationDate",name:"Created",
...@@ -119,7 +139,7 @@ ...@@ -119,7 +139,7 @@
onClickFunction = function (e) { onClickFunction = function (e) {
var cell = grid.getCellFromEvent(e); var cell = grid.getCellFromEvent(e);
if (cell.cell === grid.getColumnIndex('fileName')) { if (cell.cell === grid.getColumnIndex('fileName')) {
OfficeJS.open({app:'textEditor', OfficeJS.open({app:documentlist[cell.row].app,
fileName:documentlist[cell.row].fileName}); fileName:documentlist[cell.row].fileName});
} }
}; };
......
...@@ -10,18 +10,6 @@ ...@@ -10,18 +10,6 @@
<i class="icon-download-alt icon-white"></i> <i class="icon-download-alt icon-white"></i>
Save Save
</button>&nbsp; </button>&nbsp;
<button type="submit"
class="btn"
onclick="OfficeJS.load($('#input_fileName').attr('value'));">
<i class="icon-upload"></i>
Load
</button>&nbsp;
<button type="submit"
class="btn btn-danger"
onclick="OfficeJS.remove($('#input_fileName').attr('value'));">
<i class="icon-remove icon-white"></i>
Remove
</button>
</div> </div>
<iframe src="lib/svg-edit/svg-editor.html" <iframe src="lib/svg-edit/svg-editor.html"
id="svg_edit_frame" id="svg_edit_frame"
......
...@@ -2,6 +2,15 @@ ...@@ -2,6 +2,15 @@
// Tools // Tools
var extend = function (o1,o2) { var extend = function (o1,o2) {
var key; for (key in o2) { o1[key] = o2[key]; } return o1; var key; for (key in o2) { o1[key] = o2[key]; } return o1;
},
baseName = function (filename) {
var split = filename.split('.');
if (split.length > 1) {
split.length -= 1;
return split.join('.');
} else {
return filename;
}
}; };
/** /**
...@@ -66,6 +75,7 @@ ...@@ -66,6 +75,7 @@
type:'editor', // means it can edit a content type:'editor', // means it can edit a content
path:'component/elrte.html', path:'component/elrte.html',
gadgetid:'page-content', gadgetid:'page-content',
ext:'html',
element:'#elrte_editor', element:'#elrte_editor',
getContent: function () { getContent: function () {
$(this.element).elrte('updateSource'); $(this.element).elrte('updateSource');
...@@ -75,12 +85,17 @@ ...@@ -75,12 +85,17 @@
$(this.element).elrte('val', content); $(this.element).elrte('val', content);
}, },
onload: function (param) { onload: function (param) {
if (typeof param.fileName !== 'undefined') { // FIXME : wait for initialization end
setTimeout(function () { setTimeout(function () {
$('#input_fileName').attr('value',param.fileName); if (typeof param.fileName !== 'undefined') {
that.load(param.fileName); $('#input_fileName').attr('value',
},50); baseName(param.fileName));
} that.load(baseName(param.fileName));
} else {
$('#input_fileName').attr(
'value','untitled');
}
},1000);
} }
// TODO : onunload, are you sure? leave without saving? // TODO : onunload, are you sure? leave without saving?
}, },
...@@ -88,6 +103,7 @@ ...@@ -88,6 +103,7 @@
type:'editor', type:'editor',
path:'component/jquery-sheet.html', path:'component/jquery-sheet.html',
gadgetid:'page-content', gadgetid:'page-content',
ext:'jqs',
getContent: function () { getContent: function () {
return JSON.stringify ( return JSON.stringify (
$.sheet.instance[0].exportSheet.json() $.sheet.instance[0].exportSheet.json()
...@@ -102,13 +118,27 @@ ...@@ -102,13 +118,27 @@
), ),
autoFiller: true autoFiller: true
}); });
},
onload: function (param) {
// FIXME : wait for initialization end
setTimeout(function () {
if (typeof param.fileName !== 'undefined') {
$('#input_fileName').attr('value',
baseName(param.fileName));
that.load(baseName(param.fileName));
} else {
$('#input_fileName').attr(
'value','untitled');
}
},1000);
} }
}, },
'svg-edit': { 'svg-edit': {
type:'editor', type:'editor',
path:'component/svg-edit.html', path:'component/svg-edit.html',
frameid:'svg_edit_frame',
gadgetid:'page-content', gadgetid:'page-content',
ext:'svg',
frameid:'svg_edit_frame',
getContent: function () { getContent: function () {
return document.getElementById (this.frameid). return document.getElementById (this.frameid).
contentWindow.svgCanvas.getSvgString(); contentWindow.svgCanvas.getSvgString();
...@@ -116,6 +146,22 @@ ...@@ -116,6 +146,22 @@
setContent: function (content) { setContent: function (content) {
document.getElementById (this.frameid). document.getElementById (this.frameid).
contentWindow.svgCanvas.setSvgString(content); contentWindow.svgCanvas.setSvgString(content);
},
onload: function (param) {
var waitForInit = function (fun) {
// FIXME : wait for init end
setTimeout(fun,1000);
}
waitForInit(function () {
if (typeof param.fileName !== 'undefined') {
$('#input_fileName').attr('value',
baseName(param.fileName));
that.load(baseName(param.fileName));
} else {
$('#input_fileName').attr(
'value','untitled');
}
});
} }
}, },
slickgrid: { slickgrid: {
...@@ -127,6 +173,18 @@ ...@@ -127,6 +173,18 @@
} }
} }
}; };
priv.mime_object = {
// <pref> if the name of the app set in preferences.
// If pref does not exist it means that the extension is very
// specific, so <app> is called instead of the default editor.
// NOTE : the icon may be set in the app in app_object.
html:{pref:'imgEditor',app:'elrte',
icon:'<i class="icon-font"></i>'},
svg:{pref:'imgEditor',app:'svg-edit',
icon:'<i class="icon-pencil"></i>'},
jqs:{app:'jquery-sheet',
icon:'<i class="icon-signal"></i>'}
};
priv.data_object = { priv.data_object = {
documentList:[], documentList:[],
gadget_object:{}, // contains current gadgets id with their location gadget_object:{}, // contains current gadgets id with their location
...@@ -187,7 +245,9 @@ ...@@ -187,7 +245,9 @@
*/ */
priv.getRealApplication = function (appname) { priv.getRealApplication = function (appname) {
var realappname = that.getPreference (appname); var realappname = that.getPreference (appname);
if (!realappname) { return; } // undefined if (!realappname) {
return priv.app_object[appname];
}
return priv.app_object[realappname]; return priv.app_object[realappname];
}; };
...@@ -211,14 +271,13 @@ ...@@ -211,14 +271,13 @@
that.open = function (option) { that.open = function (option) {
var realapp, realgadgetid, realpath, acientapp; var realapp, realgadgetid, realpath, acientapp;
realapp = priv.getRealApplication (option.app); realapp = priv.getRealApplication (option.app);
realgadgetid = realapp.gadgetid;
realpath = realapp.path;
if (!realapp) { if (!realapp) {
// cannot get real app // cannot get real app
console.error ('Unknown application: ' + console.error ('Unknown application: ' + option.app);
that.getPreference(option.app));
return null; return null;
} }
realgadgetid = realapp.gadgetid;
realpath = realapp.path;
if (option.force || priv.data_object.currentEditor !== realapp) { if (option.force || priv.data_object.currentEditor !== realapp) {
ancientapp = priv.data_object.gadget_object[realgadgetid]; ancientapp = priv.data_object.gadget_object[realgadgetid];
if (ancientapp) { if (ancientapp) {
...@@ -264,15 +323,13 @@ ...@@ -264,15 +323,13 @@
* @return {string} The content of the application, or null. * @return {string} The content of the application, or null.
*/ */
that.getContentOf = function (app) { that.getContentOf = function (app) {
var realapp = that.getPreference (app); var realapp = priv.getRealApplication (app);
if (!realapp) { if (!realapp) {
console.error ('Unknown application: ' + console.error ('Unknown application: ' + app);
that.getPreference(app));
return null; return null;
} }
if (priv.app_object[realapp] && if (typeof realapp.getContent !== 'undefined') {
typeof priv.app_object[realapp].getContent !== 'undefined') { return realapp.getContent();
return priv.app_object[realapp].getContent();
} }
return null; return null;
}; };
...@@ -283,16 +340,33 @@ ...@@ -283,16 +340,33 @@
* @return {string} The path of the application component, or null. * @return {string} The path of the application component, or null.
*/ */
that.getPathOf = function (app) { that.getPathOf = function (app) {
var realapp = that.getPreference(app); var realapp = priv.getRealApplication (app);
if (!realapp) { if (!realapp) {
console.error ('Unknown application: ' + console.error ('Unknown application: ' + app);
that.getPreference(app));
return null; return null;
} }
if (priv.app_object[realapp]) { return realapp.path;
return priv.app_object[realapp].path; };
/**
* Returns the current editor file extension.
* @return {string} The current editor file extension.
*/
that.getExt = function () {
return priv.data_object.currentEditor.ext;
};
/**
* Returns a clone of the mime object having this file [extension].
* @method getMimeOfExt
* @param {string} extension The extension without '.'.
* @return {object} A clone of the mime object
*/
that.getMimeOfExt = function (extension) {
if (typeof priv.mime_object[extension] === 'undefined') {
return null;
} }
return null; return $.extend (true,{},priv.mime_object[extension]);
}; };
/** /**
...@@ -357,10 +431,9 @@ ...@@ -357,10 +431,9 @@
/** /**
* Saves the document. * Saves the document.
* @method save * @method save
* @param {string} name The document name. * @param {string} basename The document name without ext.
* @param {string} content The content of the document.
*/ */
that.save = function (name) { that.save = function (basename) {
var current_editor = priv.data_object.currentEditor; var current_editor = priv.data_object.currentEditor;
if (!priv.isJioSet()) { if (!priv.isJioSet()) {
console.error ('No Jio set yet.'); console.error ('No Jio set yet.');
...@@ -368,7 +441,7 @@ ...@@ -368,7 +441,7 @@
} }
priv.loading_object.save(); priv.loading_object.save();
priv.jio.saveDocument({ priv.jio.saveDocument({
'fileName':name, 'fileName':basename+'.'+current_editor.ext,
'fileContent':current_editor.getContent(), 'fileContent':current_editor.getContent(),
'callback':function (result) { 'callback':function (result) {
if (result.status === 'fail') { if (result.status === 'fail') {
...@@ -383,9 +456,9 @@ ...@@ -383,9 +456,9 @@
/** /**
* Loads a document. * Loads a document.
* @method load * @method load
* @param {string} name The document name. * @param {string} basename The document name without ext.
*/ */
that.load = function (name) { that.load = function (basename) {
var current_editor = priv.data_object.currentEditor; var current_editor = priv.data_object.currentEditor;
if (!priv.isJioSet()) { if (!priv.isJioSet()) {
console.error ('No Jio set yet.'); console.error ('No Jio set yet.');
...@@ -393,7 +466,7 @@ ...@@ -393,7 +466,7 @@
} }
priv.loading_object.load(); priv.loading_object.load();
priv.jio.loadDocument({ priv.jio.loadDocument({
'fileName':name, 'fileName':basename+'.'+current_editor.ext,
'maxtries':3, 'maxtries':3,
'callback':function (result) { 'callback':function (result) {
if (result.status === 'fail') { if (result.status === 'fail') {
......
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