marcelklehr / socialcalc

Web-based spreadsheet editor with support for real-time collaboration
Other
16 stars 23 forks source link

SocialCalc.CurrentSpreadsheetViewerObject.LoadSave doesn't work #7

Closed elm200 closed 7 years ago

elm200 commented 7 years ago

Hi there,

I would like to load a save format string and reflect it on the browser. I ran the code below but it didn't work. I would be grateful if you could give me any hint to solve this problem. My environment is Google Chrome Version 54.0.2840.90 on Ubuntu 14.04 64 bit.

Thank you.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Social Calc Test</title>
<script src="./jquery-1.11.3.js"></script>
<script src="./SocialCalc.js"></script>
<script>
$(document).ready(function() {
  window.scctrl = new SocialCalc.SpreadsheetControl();
  var el = 'sc';
  window.scctrl.InitializeSpreadsheetControl(el /*, height, width, spacebelow*/);
  var save_str = "MIME-Version: 1.0\n" +
    "Content-Type: multipart/mixed; boundary=SocialCalcSpreadsheetControlSave\n" +
    "--SocialCalcSpreadsheetControlSave\n" +
    "Content-type: text/plain; charset=UTF-8\n" +
    "\n" +
    "# SocialCalc Spreadsheet Control Save\n" +
    "version:1.0\n" +
    "part:sheet\n" +
    "part:edit\n" +
    "part:audit\n" +
    "--SocialCalcSpreadsheetControlSave\n" +
    "Content-type: text/plain; charset=UTF-8\n" +
    "\n" +
    "version:1.5\n" +
    "cell:A1:v:1000\n" +
    "sheet:c:1:r:1\n" +
    "--SocialCalcSpreadsheetControlSave\n" +
    "Content-type: text/plain; charset=UTF-8\n" +
    "\n" +
    "version:1.0\n" +
    "rowpane:0:1:24\n" +
    "colpane:0:1:15\n" +
    "ecell:A2\n" +
    "sort::-1:up::::\n" +
    "--SocialCalcSpreadsheetControlSave\n" +
    "Content-type: text/plain; charset=UTF-8\n" +
    "\n" +
    "set A1 value n 1000\n" +
    "--SocialCalcSpreadsheetControlSave--";

  SocialCalc.CurrentSpreadsheetViewerObject.editor.ignoreRender = false
  SocialCalc.CurrentSpreadsheetViewerObject.LoadSave(save_str);
  SocialCalc.CurrentSpreadsheetViewerObject.editor.ignoreRender = true
});
</script>
</head>
<body>
<h1>SocialCalc Test</h1>
<div id="sc">
</div>
</body>
</html>
marcelklehr commented 7 years ago

Try the following https://github.com/gulf/gulf-editor-socialcalc/blob/master/src/index.js#L44

elm200 commented 7 years ago

@marcelklehr Thank you very much! I will try it later and get back to you.

elm200 commented 7 years ago

@marcelklehr I tried the code you mentioned above and it worked! Thank you very much again!

elm200 commented 7 years ago

@marcelklehr Now I have another question...

When I run the code below, I do get the number "1000" correctly on the cell A1 but can't make it bold. Specification of font attributes(weight, size, ...) doesn't seem to be working. Is there any clue?

Sorry for bothering you again. I'd be grateful if you could help me.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Social Calc Test</title>
<script src="./jquery-1.11.3.js"></script>
<script src="./SocialCalc.js"></script>
<script>
$(document).ready(function() {
  window.scctrl = new SocialCalc.SpreadsheetControl();
  var el = 'sc';
  window.scctrl.InitializeSpreadsheetControl(el /*, height, width, spacebelow*/);

  var save_str = "version:1.5\n" +
    "cell:A1:v:1000:f:1\n" +
    "sheet:c:1:r:1\n" +
    "font:1:normal bold * * \n";

  scctrl.sheet.ParseSheetSave(save_str);
  scctrl.sheet.ScheduleSheetCommands('recalc', /*saveundo:*/false, /*isRemote:*/false);
});
</script>
</head>
<body>
<h1>SocialCalc Test</h1>
<div id="sc">
</div>
</body>
</html>
marcelklehr commented 7 years ago

I'm not too familiar with the sheetsave format to be able to spot an error. You could try and make the changes using the editor and use the following method to inspect what the serialization of the current sheet looks like: https://github.com/marcelklehr/ot-socialcalc/blob/master/index.js#L28

elm200 commented 7 years ago

@marcelklehr Thank you for your advice. I tried and finally found a solution. The key is to call ResetSheet() before calling ParseSheetSave().

  scctrl.sheet.ResetSheet(); 
  scctrl.sheet.ParseSheetSave(save_str);
  scctrl.sheet.ScheduleSheetCommands('recalc', /*saveundo:*/false, /*isRemote:*/false);

The code above allows you to have character fonts(weight, size ...) properly displayed. A part of EtherCalc code gave me insight. https://github.com/audreyt/ethercalc/blob/master/player.js#L272

Anyway, thank you so much for your great help!

eddyparkinson commented 7 years ago

@elm200 FYI you can copy that into the ethercalc clipboard.

e.g.

cell:A1:v:1000:f:1
sheet:c:1:r:1
font:1:normal bold * * 

can be pasted into the ethercalc clipboard tab, using "SocialCalc-save format: