Commit 8b66f91e authored by Tristan Cavelier's avatar Tristan Cavelier

OfficeJS: updated to work with jio, and security improved

parent b7e3ff26
<div id="basic_conflict_solver_div" style="text-align:center;" class="well">
<div class="row-fluid">
<div class="span12">
A conflict occured while saving this document:
There is a conflict in document <span id="basic_conflict_solver_docid"></span>
</div>
</div>
<div id="revisions">
</div>
<div class="row-fluid">
<div class="span12">
<button onclick="basic_conflict_solver.abort()">Abort</button>
<button onclick="OfficeJS_basic_conflict_solver.abort();">Abort</button>
</div>
</div>
</div>
<script type="text/javascript">
<!--
window.basic_conflict_solver = {
conflict_object:{},
addRevision: function (doc) {
document.querySelector ('#basic_conflict_solver_div #revisions').
innerHTML += '<div class="row-fluid"><div class="span12">'+
'<div>'+(new Date(doc.last_modified)).toString()+'</div>'+
'<div><textarea id="'+doc.revision+'">'+doc.content+'</textarea></div>'+
'<div><button onclick="'+
//'console.log('+"'"+revision+"'"+');'+
"basic_conflict_solver.keepRevision('"+doc.revision+"');"+
'">Save this one</button></div><hr/>'+
'</div></div>';
},
addRemovedRevision: function (doc) {
document.querySelector ('#basic_conflict_solver_div #revisions').
innerHTML += '<div class="row-fluid"><div class="span12">'+
'<div>'+(new Date(doc.last_modified)).toString()+'</div>'+
'<div>Removed</div>'+
'<div><button onclick="'+
//'console.log('+"'"+revision+"'"+');'+
"basic_conflict_solver.removeRevision();"+
'">Save this one</button></div><hr/>'+
'</div></div>';
},
removeRevision: function () {
OfficeJS.solveConflict(this.conflict_object);
},
keepRevision: function (revision) {
OfficeJS.solveConflict(
this.conflict_object,
$('#'+revision).text()
);
},
abort: function () {
OfficeJS.abortSolveConflict();
}
};
//-->
</script>
......@@ -32,16 +32,18 @@
</script>
<script type="text/javascript" charset="utf-8">
<!--
$().ready(function() {
var opts = {
cssClass : 'el-rte',
lang : 'en',
height : 450,
toolbar : 'complete',
cssfiles : ['lib/elrte/css/elrte-inner.css']
}
$('#elrte_editor').elrte(opts);
})
(function () {
$().ready(function() {
var opts = {
cssClass : 'el-rte',
lang : 'en',
height : 450,
toolbar : 'complete',
cssfiles : ['lib/elrte/css/elrte-inner.css']
}
$('#elrte_editor').elrte(opts);
});
}());
//-->
</script>
</head>
......@@ -49,12 +51,12 @@ $().ready(function() {
<div>
<input type="text"
name="fileName"
id="input_file_name"
id="elrte_docid"
value=""
placeholder="File name here" />&nbsp;
<button type="submit"
class="btn btn-primary"
onclick="OfficeJS.save($('#input_file_name').attr('value'));">
onclick="OfficeJS_elrte.save();">
<i class="icon-download-alt icon-white"></i>
Save
</button>&nbsp;
......
......@@ -59,101 +59,7 @@
<!--/Optional-->
<script type="text/javascript">
<!--
$(function(){
//Here is where we initiate the sheets
//every time sheet is created it creates a new jQuery.sheet.instance
//(array), to manipulate each sheet, the jQuery object is returned
$('#jQuerySheet').sheet({
title: '',
inlineMenu: inlineMenu($.sheet.instance),
urlGet: 'component/newspreadsheet.html',
// buildSheet: true,
editable: true,
autoFiller: true
});
//examples of how to use jQuery.sheet
/*
//Inline sheet(s), non-editable (like a gridview)
$('.jQuerySheet').sheet({
title: 'jQuery.sheet - The Web Based Spreadsheet Demo',
buildSheet: true, //will turn object #jQuerySheet's child tables into sheets
editable: false,
calcOff: true
});
//New single custom sized sheet
$('#jQuerySheet').sheet({
title: 'jQuery.sheet - The Web Based Spreadsheet Demo',
inlineMenu: inlineMenu(jQuery.sheet.instance),
buildSheet: '5x100'
});
//Custom object sheet(s)
$('#jQuerySheet').sheet({
title: 'jQuery.sheet - The Web Based Spreadsheet Demo',
inlineMenu: inlineMenu(jQuery.sheet.instance),
buildSheet: $('#jQuerySheet').find('table')
});
//Custom object sheet(s)
$('#jQuerySheet').sheet({
title: 'jQuery.sheet - The Web Based Spreadsheet Demo',
inlineMenu: inlineMenu(jQuery.sheet.instance),
buildSheet: $.sheet.makeTable.fromSize('5x100').add($.sheet.makeTable.fromSize('5x100'))
});
*/
//This is to give a themeswitcher on the page
//$('#themeSwitcher').themeswitcher();
//This is for some fancy menu stuff
var o = $('#structures');
var top = o.offset().top - 300;
$(document).scroll(function(e){
if ($(this).scrollTop() > top) {
$('#lockedMenu').removeClass('locked');
}
else {
$('#lockedMenu').addClass('locked');
}
}).scroll();
});
//This function builds the inline menu to make it easy to interact with each sheet instance
function inlineMenu(I){
I = (I ? I.length : 0);
//we want to be able to edit the html for the menu to make them multi
//instance
var html = $('#inlineMenu').html().
replace(/sheetInstance/g,
"$.sheet.instance[" + I + "]");
var menu = $(html);
//The following is just so you get an idea of how to style cells
menu.find('.colorPickerCell').colorPicker().change(function(){
$.sheet.instance[I].cellChangeStyle('background-color', $(this).val());
});
menu.find('.colorPickerFont').colorPicker().change(function(){
$.sheet.instance[I].cellChangeStyle('color', $(this).val());
});
menu.find('.colorPickers').children().eq(1).
css('background-image',
"url('lib/jquery.sheet/images/palette.png')");
menu.find('.colorPickers').children().eq(3).
css('background-image',
"url('lib/jquery.sheet/images/palette_bg.png')");
return menu;
}
function goToObj(s){
$('html, body').animate({
scrollTop: $(s).offset().top
}, 'slow');
return false;
}
OfficeJS_jquerysheet.firstload();
//-->
</script>
<!--Page styles-->
......@@ -208,12 +114,12 @@ function goToObj(s){
<div>
<input type="text"
name="fileName"
id="input_file_name"
id="jquery-sheet_docid"
value=""
placeholder="File name here" />&nbsp;
<button type="submit"
class="btn btn-primary"
onclick="OfficeJS.save($('#input_file_name').attr('value'));">
onclick="OfficeJS_jquerysheet.save();">
<i class="icon-download-alt icon-white"></i>
Save
</button>&nbsp;
......
......@@ -5,7 +5,7 @@
<li>
<a href="#/login"
onclick="javascript:
OfficeJS.open({app:'login'});
OfficeJS_left_nav_bar.login();
return false;">
<i class="icon-ok">
</i>
......@@ -20,7 +20,7 @@
<li class="texteditor left-nav-tools">
<a href="#/texteditor"
onclick="javascript:
OfficeJS.open({app:'text_editor'});
OfficeJS_left_nav_bar.newTextDocument();
return false;">
<i class="icon-font"></i>
New Text Document
......@@ -29,7 +29,7 @@
<li class="imgeditor left-nav-tools">
<a href="#/imgeditor"
onclick="javascript:
OfficeJS.open({app:'img_editor'});
OfficeJS_left_nav_bar.newImage();
return false;">
<i class="icon-pencil"></i>
New Image
......@@ -38,7 +38,7 @@
<li class="spreadsheet left-nav-tools">
<a href="#/spreadsheet"
onclick="javascript:
OfficeJS.open({app:'spreadsheet'});
OfficeJS_left_nav_bar.newSpreadSheet();
return false;">
<i class="icon-signal"></i>
New Spreadsheet
......@@ -47,7 +47,7 @@
<li class="spreadsheet left-nav-tools">
<a href="#/workinprogress"
onclick="javascript:
OfficeJS.open({app:'workinprogress'});
OfficeJS_left_nav_bar.showActivities();
return false;">
<i class="icon-tasks"></i>
Show Activity
......@@ -56,7 +56,7 @@
<!-- <li class="editpreferences left-nav-tools"> -->
<!-- <a href="#/edit_preferences" -->
<!-- onclick="javascript: -->
<!-- OfficeJS.open({app:'edit_preferences'}); -->
<!-- OfficeJS_left_nav_bar.editPreference(); -->
<!-- return false;"> -->
<!-- <i class="icon-check"></i> -->
<!-- Edit Preferences -->
......@@ -65,7 +65,7 @@
<li id="nav_document_list_header left-nav-tools">
<a href="#/doclist"
onclick="javascript:
OfficeJS.open({app:'document_lister'});
OfficeJS_left_nav_bar.showDocumentList();
return false;">
<i class="icon-list"></i>
Document List
......
......@@ -14,61 +14,66 @@
<div>
Remember me&nbsp;&nbsp;
<input id="remember_me" type="checkbox"
onclick="window.OfficeJS_login.toggleRememberMe();"/>
onclick="OfficeJS_login.object.toggleRememberMe();"/>
</div>
<div>
<button type="submit"
class="btn"
onclick="window.OfficeJS_login.createJIO();">
onclick="OfficeJS_login.object.connect();">
Create New JIO
</button>
</div>
<script type="text/javascript">
<!--
window.OfficeJS_login = {
storageId:'#login-gadget #login_input',
storagePath:'OfficeJS/login/login',
rememberId:'#login-gadget #remember_me',
rememberPath:'OfficeJS/login/remember_me',
localStorage: LocalOrCookieStorage,
fillLogin: function () {
$(this.storageId).attr(
'value',this.localStorage.getItem(this.storagePath) || '');
},
isRememberMe: function () {
return $(this.rememberId).attr('checked');
},
fillRememberMe: function () {
var t = this.localStorage.getItem(this.rememberPath);
(function () {
"use strict";
var odf = function (obj,name,value) {
Object.defineProperty(obj,name,{
configurable:false,enumerable:false,writable:false,value:value
});
};
odf(OfficeJS_login,'object',{});
var that = OfficeJS_login.object;
odf(OfficeJS_login.object,'storage_id','#login-gadget #login_input');
odf(OfficeJS_login.object,'storage_path','OfficeJS/login/login');
odf(OfficeJS_login.object,'remember_id','#login-gadget #remember_me');
odf(OfficeJS_login.object,'remember_path','OfficeJS/login/remember_me');
odf(OfficeJS_login.object,'fillLogin',function () {
$(that.storage_id).attr(
'value',localStorage.getItem(that.storage_path) || '');
});
odf(OfficeJS_login.object,'isRememberMe',function () {
return $(that.remember_id).attr('checked');
});
odf(OfficeJS_login.object,'fillRememberMe',function () {
var t = localStorage.getItem(that.remember_path);
if (t) {
this.rememberMe();
that.rememberMe();
}
},
rememberMe: function () {
$(this.rememberId).attr('checked','1');
this.localStorage.setItem(this.rememberPath,'1');
},
dontRememberMe: function () {
$(this.rememberId).removeAttr('checked');
this.localStorage.deleteItem(this.rememberPath);
},
toggleRememberMe: function () {
var t = this.localStorage.getItem(this.rememberPath);
if (t) { this.dontRememberMe() } else { this.rememberMe(); }
},
createJIO: function() {
});
odf(OfficeJS_login.object,'rememberMe',function () {
$(that.remember_id).attr('checked','1');
localStorage.setItem(that.remember_path,'1');
});
odf(OfficeJS_login.object,'dontRememberMe',function () {
$(that.remember_id).removeAttr('checked');
localStorage.deleteItem(that.remember_path);
});
odf(OfficeJS_login.object,'toggleRememberMe',function () {
var t = localStorage.getItem(that.remember_path);
if (t) { that.dontRememberMe() } else { that.rememberMe(); }
});
odf(OfficeJS_login.object,'connect',function () {
var spec = $('#login-gadget #login_input').attr('value');
this.localStorage.setItem(this.storagePath,spec);
OfficeJS.setJio(spec);
localStorage.setItem(that.storage_path,spec);
OfficeJS_login.connect (spec);
});
that.fillRememberMe();
if (that.isRememberMe()) {
that.fillLogin();
}
};
window.OfficeJS_login.fillRememberMe();
if (window.OfficeJS_login.isRememberMe()) {
window.OfficeJS_login.fillLogin();
}
}());
//-->
</script>
</div>
......@@ -24,8 +24,15 @@
<i class="icon-remove icon-white"></i>
Remove Selected
</button>
<button type="submit"
id="slickgrid_document_lister_refresh"
class="btn"
onclick="OfficeJS_slickgrid.refresh();">
<i class="icon-refresh"></i>
Refresh
</button>
</div>
<div id="myDocumentList" style="width:100%;height:300px"></div>
<div id="slickgrid_documentlist" style="width:100%;height:300px"></div>
<script type="text/javascript"
src="lib/jquery/jquery.js"></script>
<script type="text/javascript"
......@@ -42,135 +49,7 @@
<script type="text/javascript">
<!--
window.OfficeJS_slickgrid = {};
window.OfficeJS_slickgrid.reload = function () {
$('#myDocumentList').html('');
var grid, onSortFunction, onClickFunction, check_box_selector,
onRemoveSeveral, showIconFormatter,
document_list = OfficeJS.cloneCurrentDocumentList(),
columns = [],
options = {
enableCellNavigation: true,
enableColumnReorder: false,
multiColumnSort: true,
forceFitColumns: true
};
showIconFormatter = function (row,cell,value,columnDef,dataContext) {
return dataContext.icon;
};
(function (array) {
var i, lm, cd, split, mime;
for (i = 0; i < array.length; i += 1) {
// file names
split = array[i].name.split('.');
array[i].ext = '';
if (split.length > 1) {
array[i].ext = split[split.length-1];
split.length -= 1;
}
array[i].base_name = split.join('.');
// app & icon
mime = OfficeJS.getMimeOfExt (array[i].ext);
if (!mime) {
array[i].icon = '?';
array[i].app = 'text_editor';
} else {
array[i].icon = mime.icon;
array[i].app = mime.preferred_application || mime.application;
}
if (array[i].revision) {
array[i].conflict = array[i].revision_object[
array[i].revision].conflict?'X':'';
} else {
array[i].conflict = '';
}
// dates
// FIXME : we can have 2012/1/1 12:5
// we should have 2012/01/01 12:05
lm = (new Date(array[i].last_modified));
cd = (new Date(array[i].creation_date));
array[i].last_modified = lm.getFullYear()+'/'+
(lm.getMonth()+1)+'/'+lm.getDate()+' '+
lm.getHours()+':'+lm.getMinutes();
array[i].creation_date = cd.getFullYear()+'/'+
(cd.getMonth()+1)+'/'+cd.getDate()+' '+
cd.getHours()+':'+cd.getMinutes();
}
}(document_list));
$(function () {
check_box_selector = new Slick.CheckboxSelectColumn({
cssClass: "slick-cell-checkboxsel"
});
columns.push(check_box_selector.getColumnDefinition());
columns.push({id:"icon",name:"",field:"icon",
sortable:true,resizable:false,width:24,
formatter:showIconFormatter});
columns.push({id:"file_name",name:"Document",
field:"base_name",sortable:true});
columns.push({id:"last_modified",name:"Modified",
field:"last_modified",sortable:true});
columns.push({id:"creation_date",name:"Created",
field:"creation_date",sortable:true});
columns.push({id:'on_conflict',name:'',
field:'conflict',sortable:true,
resizable:false,width:24});
grid = new Slick.Grid("#myDocumentList",
document_list,
columns,
options);
grid.setSelectionModel(new Slick.RowSelectionModel(
{selectActiveRow: false}));
grid.registerPlugin(check_box_selector);
onSortFunction = function (e, args) {
var cols = args.sortCols;
document_list.sort(function (data_row1, data_row2) {
var i, l, field, sign, value1, value2, result;
for (i = 0, l = cols.length; i < l; i++) {
field = cols[i].sortCol.field;
sign = cols[i].sortAsc ? 1 : -1;
value1 = data_row1[field];
value2 = data_row2[field];
result = (value1==value2?0:(value1>value2?1:-1))*sign;
if (result != 0) {
return result;
}
}
return 0;
});
grid.invalidate();
grid.render();
};
onClickFunction = function (e) {
var cell = grid.getCellFromEvent(e);
if (cell.cell === grid.getColumnIndex('file_name')) {
OfficeJS.open({app:document_list[cell.row].app,
file_name:document_list[cell.row].name});
}
};
onRemoveSeveral = function () {
var document_name_array = [], selected, i, l;
selected = grid.getSelectedRows();
for (i = 0, l = selected.length; i < l; i+= 1) {
document_name_array.push(document_list[selected[i]].name);
}
OfficeJS.removeSeveralFromArray (document_name_array);
};
document.querySelector ('#slickgrid_document_lister_remove_selected').
onclick = onRemoveSeveral;
grid.onClick.subscribe(onClickFunction);
grid.onSort.subscribe(onSortFunction);
});
};
window.OfficeJS_slickgrid.reload();
OfficeJS_slickgrid.load();
//-->
</script>
</body>
......
<div>
<input type="text"
name="fileName"
id="input_file_name"
id="svg-edit_docid"
value=""
placeholder="File name here" />&nbsp;
<button type="submit"
class="btn btn-primary"
onclick="OfficeJS.save($('#input_file_name').attr('value'));">
onclick="OfficeJS_svgedit.save();">
<i class="icon-download-alt icon-white"></i>
Save
</button>&nbsp;
</div>
<iframe src="lib/svg-edit/svg-editor.html"
id="svg_edit_frame"
id="svg-edit_frame"
style="width:100%;
height:500px;"
scrolling="no">
......
......@@ -44,11 +44,11 @@
<li><h1>OfficeJS</h1></li>
<li><a href="#/about"
onclick="javascript:
OfficeJS.open({app:'about'});
OfficeJS_top_nav_bar.about();
return false;">About</a></li>
<li><a href="#/contact"
onclick="javascript:
OfficeJS.open({app:'contact'});
OfficeJS_top_nav_bar.contact();
return false;">Contact</a></li>
</ul>
</div>
......
<h2>Activities</h2>
<div id="activities"></div>
<script type="text/javascript">
<!--
(function() {
var id;
if (typeof work_in_progress !== 'object') {
id = null;
work_in_progress = {
start:function(){
if (id === null) {
var update = function () {
var act = OfficeJS.getActivity(), i, str = '';
for (i = 0; i < act.length; i+= 1) {
str += act[i] + '<br />';
}
if (str === '') {
str = 'There is no on going tasks.<br />';
}
document.getElementById('activities').innerHTML = str;
};
update();
id = setInterval (update, 200);
}
},
stop:function(){
if (id !== null) {
clearInterval(id);
id = null;
}
}
};
}
}());
//-->
</script>
<div id="workinprogress_activities"></div>
This diff is collapsed.
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