Pman.Gnumeric.js
[Pman.Core] / Pman.Gnumeric.js
1 //<script type="text/javascript">
2 /**
3 * @class Pman Gnumeric.
4 *-> load up a remote xml file of a gnumeric document.
5
6 * -> convert into a usable data structure
7
8 * -> ?? apply templated values ??
9 * -> allow modification of fields
10
11 * -> render to screen.
12
13 * -> send for conversion to XLS (via ssconvert)
14
15 * Usage:
16 <pre><code>
17
18     new Pman.Gnumeric( {
19       url: rootURL + '/xxx/yyy/templates/reports/myreport.xml',
20       data: { ..... },
21       listeners : {
22           load : function()
23           {
24           
25                x.applyData({ ... }); // key value data looks for {value} in strings and replaces it..
26                
27                x.set('A3', 'test');
28                
29                mypanel.update(x.toHTML());
30                
31                x.download()       
32                
33            }
34       }
35     });
36     
37
38 </code></pre>
39
40 * @constructor
41 * @param {Object} cfg   Configuration object.
42 */
43  
44
45
46 Pman.Gnumeric = function (cfg)
47 {
48     cfg.data = cfg.data || {};
49     
50     
51     
52     
53     
54     
55     this.addEvents({
56         /**
57              * @event load
58              * Fires when source document has been loaded
59              * @param {Pman.Gnumerci} this
60              */
61             "load" : true
62     }); 
63     
64     Roo.util.Observable.call(this,cfg);
65     
66     this.defaultCell = {
67         c : 0,
68         r : 0,
69         valueType : 0,
70         valueFormat : '',
71         value : '',
72         colspan: 1,
73         rowspan: 1
74           
75     };
76      
77     this.load();
78     
79    
80     
81     
82 }
83 Roo.extend(Pman.Gnumeric, Roo.util.Observable, {
84     
85     /**
86      * @cfg {String} url the source of the Gnumeric document.
87      */
88     url : false,
89       /**
90      * @cfg {Object} data overlay data for spreadsheet - from constructor.
91      */
92     data : false,
93      /**
94      * @cfg {String} downloadURL where GnumerictoExcel.php is...
95      */
96      
97     downloadURL : false,
98     
99     /**
100      * @type {XmlDocument} doc the gnumeric xml document
101      */
102     doc : false,
103     
104     /**
105      * @type {XmlNode} sheet the 'Sheet' element 
106      */
107     sheet : false,
108     
109     /**
110      * @type {XmlNode} sheet the 'Cells' element 
111      */    
112     cellholder : false,
113     /**
114      * @type {Object} grid the map[row][col] = cellData 
115      */
116     grid : false,
117     /**
118      * @type {Object} colInfo - list of column sizes
119      */
120     colInfo : false,
121     /**
122      * @type {Object} colInfoDom - column sizes dom element
123      */
124     colInfoDom : false,
125     /**
126      * @type {Object} rowInfo - list of row sizes
127      */
128     rowInfo : false,
129     
130     /**
131      * @type {Number} cmax - maximum number of columns
132      */
133     cmax: false,
134     /**
135      * @type {Object} rmax - maximum number of rows
136      */
137     rmax : false,
138        /**
139      * @type {String} stylesheetID id of stylesheet created to render spreadsheat
140      */
141     stylesheetID : false,
142     /**
143      * @type {Number} rowOffset - used by table importer to enable multiple tables to be improted
144      */
145     
146     rowOffset : 0,
147     
148     /**
149      * load:
150      * run the connection, parse document and fire load event..
151      * can be run multiple times with new data..
152      * 
153     */
154     
155     load : function(url)
156     {
157         this.url = url || this.url;
158         if (!this.url) {
159             return;
160         }
161         // reset stufff..
162         this.doc = false;
163         this.sheet = false;
164         this.grid = false;
165         this.colInfo = false;
166         this.rowInfo = false;
167         this.cmax = false;
168         this.rmax = false;
169         
170         if (this.stylesheetID) {
171             
172             Roo.util.CSS.removeStyleSheet(this.stylesheetID);
173             this.stylesheetID = false;
174             
175         }
176         
177         _t = this;
178         var c = new Roo.data.Connection();
179         c.request({
180             url: this.url,
181             method:  'GET',
182             success : function(resp, opts) {
183                 _t.response = resp;
184                 _t.doc = resp.responseXML;
185                 
186                 _t.parseDoc(0);
187                 
188                 
189                 _t.applyData();
190     
191                 _t.fireEvent('load', _t);
192             },
193             failure : function()
194             {
195                 Roo.MessageBox.alert("Error", "Failed to Load Template for Spreadsheet");
196             }
197         });
198         
199
200     },
201     
202     
203      
204     RCtoCell : function(r,c)
205     {
206         // we wil only support AA not AAA
207         var top = Math.floor(c/26);
208         var bot = c % 26;
209         var cc = top > 0 ? String.fromCharCode('A'.charCodeAt(0) + top) : '';
210         cc += String.fromCharCode('A'.charCodeAt(0)  + bot);
211         return cc+'' +r;
212         
213     },
214     
215     /**
216      * toRC:
217      * convert 'A1' style position to row/column reference
218      * 
219      * @arg {String} k cell name
220      * @return {Object}  as { r: {Number} , c: {Number}  }
221      */
222     
223     toRC : function(k)
224     {
225         var c = k.charCodeAt(0)-64;
226         var n = k.substring(1);
227         if (k.charCodeAt(1) > 64) {
228             c *=26;
229             c+=k.charCodeAt(1)-64;
230             n = k.substring(2);
231         }
232         return { c:c -1 ,r: (n*1)-1 }
233     },
234       /**
235      * rangeToRC:
236      * convert 'A1:B1' style position to array of row/column references
237      * 
238      * @arg {String} k cell range
239      * @return {Array}  as [ { r: {Number} , c: {Number}  }. { r: {Number} , c: {Number}  } ]
240      */
241     rangeToRC : function(s) {
242         var ar = s.split(':');
243         return [ this.toRC(ar[0]) , this.toRC(ar[1])]
244     },
245     
246     
247     
248    
249     
250     /**
251      * parseDoc:
252      * convert XML document into cells and other data..
253      * 
254      */
255     parseDoc : function(sheetnum) 
256     {
257         var _t = this;
258         this.grid = {}
259         this.rmax = 1;
260         this.cmax = 1;
261         
262         this.sheet = _t.doc.getElementsByTagNameNS('*','Sheet')[sheetnum];
263         
264         
265         this.cellholder = this.sheet.getElementsByTagNameNS('*','Cells')[0];
266         var cells = this.sheet.getElementsByTagNameNS('*','Cell');
267
268         
269         
270         Roo.each(cells, function(c) {
271            // Roo.log(c);
272             var row = c.getAttribute('Row') * 1;
273             var col = c.getAttribute('Col') * 1;
274             _t.cmax = Math.max(col+1, _t.cmax);
275             _t.rmax = Math.max(row+1, _t.rmax);
276             var vt = c.getAttribute('ValueType');
277             var vf = c.getAttribute('ValueFormat');
278             var val = c.textContent;
279             
280             if (typeof(_t.grid[row]) == 'undefined') {
281                 _t.grid[row] ={};
282             }
283             _t.grid[row][col] = Roo.applyIf({
284                 valueType : vt,
285                 valueFormat : vf,
286                 value : val,
287                 dom: c,
288                 r: row,
289                 c: col
290             }, _t.defaultCell);
291         });
292        
293         for (var r = 0; r < this.rmax;r++) {
294             if (typeof(this.grid[r]) == 'undefined') {
295               this.grid[r] ={};
296             }
297             for (var c = 0; c < this.cmax;c++) {
298                 if (typeof(this.grid[r][c]) == 'undefined') {
299                     continue;
300                 }
301                 //this.print( "[" + r + "]["+c+"]=" + grid[r][c].value +'<br/>');
302             }
303         }
304         
305         var merge = this.sheet.getElementsByTagNameNS('*','Merge');
306
307         Roo.each(merge, function(c) {
308             var rc = _t.rangeToRC(c.textContent);
309             //Roo.log(JSON.stringify(rc))
310             if (typeof(_t.grid[rc[0].r][rc[0].c]) == 'undefined') {
311                 _t.grid[rc[0].r][rc[0].c] =  Roo.applyIf({ r : rc[0].r, c : rc[0].c }, _t.defaultCell);
312             }
313                 
314             _t.grid[rc[0].r][rc[0].c].colspan = (rc[1].c - rc[0].c) + 1;
315             _t.grid[rc[0].r][rc[0].c].rowspan = (rc[1].r - rc[0].r) + 1;
316             for(var r = (rc[0].r); r < (rc[1].r+1); r++) {
317                for(var c = rc[0].c; c < (rc[1].c+1); c++) {
318                     //Roo.log('adding alias : ' + r+','+c);
319                    _t.grid[r][c] = _t.grid[rc[0].r][rc[0].c];
320                }
321            }
322             
323             
324         });
325         // read colinfo..
326         var ci = this.sheet.getElementsByTagNameNS('*','ColInfo');
327         this.colInfo = {};
328         this.colInfoDom = {};
329         
330         Roo.each(ci, function(c) {
331             var count = c.getAttribute('Count') || 1;
332             var s =  c.getAttribute('No')*1;
333             for(var i =0; i < count; i++) {
334                 _t.colInfo[s+i] = Math.floor(c.getAttribute('Unit')*1);
335                 _t.colInfoDom[s+i] = c;
336             }
337         });
338         
339         
340         ci = this.sheet.getElementsByTagNameNS('*','RowInfo');
341         
342         this.rowInfo = {};
343         Roo.each(ci, function(c) {
344             var count = c.getAttribute('Count') || 1;
345             var s =  c.getAttribute('No')*1;
346             for(var i =0; i < count; i++) {
347                 _t.rowInfo[s+i] = Math.floor(c.getAttribute('Unit')*1);
348             }
349         });
350     
351         _t.parseStyles();
352         _t.overlayStyles();
353                 
354         
355      
356         
357     },
358      /**
359      * overlayStyles:
360      * put the style info onto the cell data.
361      * 
362      */
363     overlayStyles : function ()
364     {
365            // apply styles.
366         var _t = this;
367         Roo.each(this.styles, function(s) {
368        
369             for (var r = s.r; r < s.r1;r++) {
370                 if (typeof(_t.grid[r]) == 'undefined') {
371                    continue;
372                 }
373                 for (var c = s.c; c < s.c1;c++) {
374                     if (c > _t.cmax) continue;
375     
376                     if (typeof(_t.grid[r][c]) == 'undefined') _t.grid[r][c] = Roo.applyIf({ r: r , c : c }, _t.defaultCell);
377                     var g=_t.grid[r][c];
378                     if (typeof(g.cls) =='undefined') {
379                         g.cls = [];
380                         g.styles = [];
381                     }
382                     if (g.cls.indexOf(s.name)  > -1) continue;
383                     g.cls.push(s.name);
384                     g.styles.push(s.dom);
385                     
386                 }
387             }
388         });
389     },
390      /**
391      * parseStyles: 
392      *  read the style information
393      * generates a stylesheet for the current file
394      * this should be disposed of really.....
395      * 
396      */
397     parseStyles : function() {
398                 
399         var srs = this.sheet.getElementsByTagNameNS('*','StyleRegion');
400         var _t  = this;
401         var ent = {};
402         
403         var map =  {
404             HAlign : function(ent,v) { 
405                 ent['text-align'] = { '1' : 'left', '8': 'center', '4' : 'right'}[v] || 'left';
406             },
407             VAlign : function(ent,v) { 
408                 ent['vertical-align'] = { '1' : 'top', '4': 'middle', '8' : 'bottom'}[v]  || 'top'
409             },
410             Fore : function(ent,v) { 
411                 var col=[];
412                 Roo.each(v.split(':'), function(c) { col.push(Math.round(parseInt(c,16)/256)); })
413                 ent['color'] = 'rgb(' + col.join(',') + ')';
414             },
415             Back : function(ent,v) { 
416                 var col=[];
417                 Roo.each(v.split(':'), function(c) { col.push(Math.round(parseInt(c,16)/256)); })
418                 ent['background-color'] = 'rgb(' + col.join(',') + ')';
419             },
420             FontUnit : function(ent,v) { 
421                 ent['font-size'] = v + 'px';
422             },
423             FontBold : function(ent,v) { 
424                 if (v*1 < 1) return;
425                 ent['font-weight'] = 'bold';
426             },
427             FontItalic : function(ent,v) { 
428                 if (v*0 < 1) return;
429                 //ent['font-weight'] = 'bold';
430             },
431             FontName : function(ent,v) { 
432                 ent['font-family'] = v;
433             },
434             BorderStyle : function(ent,v) { 
435                 var vv  = v.split('-');
436                 ent['border-'+vv[0]+'-style'] = 'solid';
437                 ent['border-'+vv[0]+'-width'] = vv[1]+'px';
438             },
439             BorderColor : function(ent,v) { 
440                 var vv  = v.split('-');
441                 var col=[];
442                 Roo.each(vv[1].split(':'), function(c) { col.push(Math.round(parseInt(c,16)/256)); })
443                 ent['border-'+vv[0]+'-color'] = 'rgb(' + col.join(',') + ')';
444             }
445         }
446         function add(e, k, v) {
447             //Roo.log(k,v);
448             e.gstyle[k] = v;
449             if (typeof(map[k]) == 'undefined') {
450                 return;
451             }
452             map[k](e.style,v);    
453         }
454         var css = {};
455         var styles = [];
456         var sid= Roo.id();
457         
458         
459         Roo.each(srs, function(sr,n)
460         {
461             ent = {
462                 c : sr.getAttribute('startCol') *1,
463                 r : sr.getAttribute('startRow')*1,
464                 c1 : (sr.getAttribute('endCol')*1) +1,
465                 r1 : (sr.getAttribute('endRow')*1) +1,
466                 style : {},  // key val of style for HTML..
467                 gstyle : {}, // key val of attributes used..
468                 name : sid +'-gstyle-' + n,
469                 dom : sr
470                 
471             };
472     
473             Roo.each(sr.getElementsByTagNameNS('*','Style')[0].attributes, function(e) { 
474                 add(ent, e.name, e.value);
475             });
476             if (sr.getElementsByTagNameNS('*','Font').length) {
477                 Roo.each(sr.getElementsByTagNameNS('*','Font')[0].attributes, function(e) { 
478                      add(ent, 'Font'+e.name, e.value);
479     
480                 });
481                 add(ent, 'FontName', sr.getElementsByTagNameNS('*','Font')[0].textContent);
482     
483             }
484             if (sr.getElementsByTagNameNS('*','StyleBorder').length) {
485                 Roo.each(sr.getElementsByTagNameNS('*','StyleBorder')[0].childNodes, function(e) {
486                     if (!e.tagName) {
487                         return;
488                     }
489                     Roo.each(e.attributes, function(ea) { 
490                         add(ent, 'Border'+ea.name, e.tagName.split(':')[1].toLowerCase() + '-' + ea.value);
491                     });
492                 })
493                     
494             }
495             styles.push(ent);
496             css['.'+ent.name] = ent.style;
497         });
498         
499         this.styles = styles;
500         
501         this.stylesheetID = sid;
502         Roo.util.CSS.createStyleSheet(css, sid);
503     },
504
505     
506     
507     
508     /* ---------------------------------------  AFTER LOAD METHODS... ----------------------- */
509     /**
510      * set: 
511      * Set the value of a cell..
512      * @param {String} cell name of cell, eg. C10 or { c: 1, r :1 }
513          
514      * @param {Value} value to put in cell..
515      * @param {ValueType} type of value
516      * @param {ValueFormat} value format of cell
517      * 
518      * Cells should exist at present, we do not make them up...
519      */
520      
521     
522     set : function(cell, v, vt, vf) {
523         
524         var cs= typeof(cell) == 'string' ? this.toRC(cell) : cell;
525         //Roo.log( cs.r+ ',' + cs.c + ' = '+ v);
526         // need to generate clell if it doe
527         if (typeof(this.grid[cs.r]) == 'undefined') {
528             Roo.log('no row:' + cell);
529             this.grid[cs.r] = []; // create a row..
530             //return;
531         }
532         if (typeof(this.grid[cs.r][cs.c]) == 'undefined') {
533             Roo.log('cell not defined:' + cell);
534             this.createCell(cs.r,cs.c);
535         }
536         if (typeof(this.grid[cs.r][cs.c].dom) == 'undefined') {
537             Roo.log('no default content for cell:' + cell);
538             this.createCell(cs.r,cs.c);
539             //return;
540         }
541         this.grid[cs.r][cs.c].value=  v;
542         this.grid[cs.r][cs.c].dom.textContent=  v;
543         if (typeof(vt) != 'undefined') {
544             this.grid[cs.r][cs.c].valueType = vt;
545             this.grid[cs.r][cs.c].dom.setAttribute('ValueType', vt);
546             if (vt === '' || vt === false) { // value type is empty for formula's
547                 this.grid[cs.r][cs.c].dom.removeAttribute('ValueType');
548             }
549         }
550         if (typeof(vf) != 'undefined' && vf !== false) {
551             this.grid[cs.r][cs.c].valueFormat = vf;
552             this.grid[cs.r][cs.c].dom.setAttribute('ValueFormat', vf);
553             if (vf === '' || vf === false) { // value type is empty for formula's
554                 this.grid[cs.r][cs.c].dom.removeAttribute('ValueFormat');
555             }
556         }
557         
558     },
559     
560     // private
561     copyRow : function(src, dest) {
562         if (dest == src) {
563             return;
564         }
565        // Roo.log('create Row' + dest);
566         if (typeof(this.grid[dest]) == 'undefined') {
567             this.grid[dest] = {}
568         }
569         
570            
571         for (var c = 0; c < this.cmax; c++) {
572
573             this.copyCell({ r: src, c: c } , { r: dest, c: c});
574             
575         }
576         this.rmax = Math.max(this.rmax, dest +1);
577         
578     },
579     
580     // private
581     
582     createCell: function(r,c)
583     {
584         //<gnm:Cell Row="6" Col="5" ValueType="60">Updated</gnm:Cell>    
585         var nc = this.doc.createElementNS('http://www.gnumeric.org/v10.dtd', 'gnm:Cell');
586         this.cellholder.appendChild(nc);
587         var lb = this.doc.createTextNode("\n");// add a line break..
588         this.cellholder.appendChild(lb);
589         
590         nc.setAttribute('Row', new String(r));
591         nc.setAttribute('Col', new String(c));
592         nc.setAttribute('ValueType', '60');
593         nc.textContent = '';
594         
595         this.grid[r][c] = Roo.applyIf({
596             valueType : '60',
597             valueFormat : '',
598             value : '',
599             dom: nc,
600             r: r,
601             c: c
602             }, _t.defaultCell);
603         
604         return nc;
605
606     },
607     
608     // private
609     copyCell : function(src, dest)
610     {
611         var old = this.grid[src.r][src.c];
612         // is it an alias...
613         if ((old.c != src.c)  || (old.r != src.r)) {
614             // only really works on horizonatal merges..
615             
616             this.grid[dest.r][dest.c] = this.grid[desc.r][old.c]; // let's hope it exists.
617             return;
618         }
619         
620         
621         var nc = Roo.apply({}, this.grid[src.r][src.c]);
622         
623         nc.value = '';
624         if (typeof(old.dom) == 'undefined') {
625             Roo.log("No cell to copy for " + Roo.encode(src));
626             return;
627         }
628         this.grid[dest.r][dest.c] = nc;
629         nc.dom = old.dom.cloneNode(true);
630         nc.dom.setAttribute('Row', dest.r);
631         nc.dom.setAttribute('Cell', dest.c);
632         nc.dom.textContent = '';
633         old.dom.parentNode.appendChild(nc.dom);
634         if (!old.styles || !old.styles.length) {
635             return;
636         }
637         //Roo.log("DEST");
638         //Roo.log(dest);
639         //Roo.log("STYLES");
640         //  .styles...
641         Roo.each(old.styles, function(s) {
642             // try and extend existing styles..
643             var er = s.getAttribute('endRow') * 1;
644             var ec = s.getAttribute('endCol') * 1;
645             //Roo.log(s);
646             if (dest.r == er) {
647                 s.setAttribute('endRow', dest.r + 1);
648             }
649             if (dest.c == ec) {
650                 s.setAttribute('endCol', dest.c + 1);
651             }
652             /*var ns = s.cloneNode(true);
653             s.parentNode.appendChild(ns);
654             ns.setAttribute('startCol', dest.c);
655             ns.setAttribute('startRow', dest.r);
656             ns.setAttribute('endCol', dest.c + 1);
657             ns.setAttribute('endRow', dest.r +1);
658             */
659         });
660         
661     },
662     
663     
664     /**
665      * applyData: 
666      * Set the value of a cell..
667      * @param {String} cell name of cell, eg. C10
668      * @param {Value} value to put in cell..
669      * 
670      * Cells should exist at present, we do not make them up...
671      */
672      
673     applyData : function(data)
674     {
675         
676         data = data || this.data;
677         for (var r = 0; r < this.rmax;r++) {
678             if (typeof(this.grid[r]) == 'undefined') continue;
679             for (var c = 0; c < this.cmax;c++) {  
680                 if (typeof(this.grid[r][c]) == 'undefined') {
681                     continue;
682                 }
683                 if (!this.grid[r][c].value.length 
684                         || !this.grid[r][c].value.match(/\{/)) {
685                     continue;
686                 }
687                 
688                 var x = new Roo.Template({ html: this.grid[r][c].value });
689                 try {
690                     var res = x.applyTemplate(data);
691                     //Roo.log("set " + r  + "," + c + ":"+res)
692                     this.set({ r: r, c: c}, x.applyTemplate(data));
693                 } catch (e) {
694                  //   Roo.log(e.toString());
695                   //  Roo.log(e);
696                     // continue?
697                 }
698                 
699             }
700         }
701             
702     },
703     
704     readTableData : function(table)
705     {
706         // read the first row.
707         var tds = Roo.get(table).select('tr').item(0).select('td');
708         var nc = 0;
709         tds.each(function(td) {
710             var cs = td.dom.getAttribute('colspan');
711             cs = cs ? cs * 1 : 1;
712             nc += cs;
713         });
714         var tr = document.createElement('tr');
715         table.appendChild(tr);
716         var ar = {}
717         for (i =0; i < nc; i++) {
718             ar[i] = document.createElement('td');
719             tr.appendChild(ar[i]);
720         }
721         // find the left.
722         var ret = { cols : nc, pos : {} };
723         for (i =0; i < nc; i++) {
724             ret.pos[ Roo.get(ar[i]).getLeft()] =i;
725         }
726         table.removeChild(tr);
727         return ret;
728     },
729     
730      
731    
732      
733     /**
734      * importTable: 
735      * Import a table and put it into the spreadsheet
736      * @param {HTMLTable} datagrid dom element of html table.
737      * @param {Number} xoff X offset to start rendering to
738      * @param {Number} yoff Y offset to start rendering to
739      **/
740      
741  
742     importTable : function (datagrid, xoff,yoff)
743     {
744         if (!datagrid) {
745             Roo.log("Error table not found!?");
746             return;
747         }
748         xoff = xoff || 0;
749         yoff = yoff || 0;
750         
751         
752         var table_data = this.readTableData(datagrid);
753         
754         var cleanHTML = function (str) {
755             
756              var ret = str;
757             ret = ret.replace(/&nbsp;/g,'.');
758             ret = ret.replace(/\n/g,'.');
759             ret = ret.replace(/\r/g,'.');
760             var i;
761             while (-1 != (i = ret.indexOf(unescape('%A0')))) {
762                 ret = ret.substring(0,i) + ' ' + ret.substring(i+1,str.length);
763             }
764             return ret;
765         };
766
767         
768         // <cell col="A" row="1">Test< / cell>
769         // <cell col="B" row="2" type="Number" format="test1">30< / cell>
770         var rowOffsets = {};
771         var rows = datagrid.getElementsByTagName('tr');
772         //alert(rows.length);
773         
774         
775         for(var row=0;row<rows.length;row++) {
776             
777             // let's see what affect this has..
778             // it might mess things up..
779             
780             if (rows[row].getAttribute('xls:height')) {
781                 this.setRowHeight(row + yoff, 1* rows[row].getAttribute('xls:height'));
782             } else {
783                 this.setRowHeight( row + yoff, Roo.get(rows[row]).getHeight());
784             }
785             
786          
787             var cols = rows[row].getElementsByTagName('td');
788             
789             
790             for(var col=0;col < cols.length; col++) {
791                 
792                 
793                
794                 
795                 var colspan = cols[col].getAttribute('colspan');
796                 colspan  = colspan ? colspan *1 : 1;
797                 
798                 var rowspan = cols[col].getAttribute('rowspan');
799                 rowspan = rowspan ? rowspan * 1 : 1;
800                 
801                 var realcol = table_data.pos[ Roo.get(cols[col]).getLeft() ];
802                 
803                 
804                 
805                 if (colspan > 1 || rowspan > 1) {
806                     
807                     // getting thisese right is tricky..
808                     this.mergeRegion(
809                         realcol + xoff,
810                         row + yoff +1,
811                         realcol+ xoff + (colspan -1),
812                         row + yoff + rowspan 
813                     );
814                     
815                 }
816                 
817                 // skip blank cells
818                 // set the style first..
819                 this.parseHtmlStyle( cols[col], row + yoff, realcol + xoff   , colspan, rowspan);
820                 
821                 if (!cols[col].childNodes.length) {
822                      
823                     continue;
824                 }
825                 
826                 
827                 
828                 
829                 var vt = '60';
830                 var vf = false;
831                 var xlstype = cols[col].getAttribute('xls:type');
832                 switch(xlstype) {
833                     case 'int':
834                         vt = 30; // int!!!!
835                     
836                         break;
837                         
838                     case 'float':
839                         vt = 40; // float!!!!
840                         if (cols[col].getAttribute('xls:floatformat')) {
841                             vf = cols[col].getAttribute('xls:floatformat');
842                         }
843                         break;
844                         
845                     case 'date':
846                         vt = 30;
847                         //ValueFormat="d/m/yyyy" 38635  
848                         var vf = 'd/m/yyy';
849                         if (cols[col].getAttribute('xls:dateformat')) {
850                             vf= cols[col].getAttribute('xls:dateformat');
851                         }
852                         
853                        
854                         
855                         break;
856                     
857                     default:
858                        
859                         break;
860                 }
861                
862                 if (!cols[col].childNodes[0].nodeValue) {
863                    
864                     continue;
865                 }
866                 if (!cols[col].childNodes[0].nodeValue.replace(/^\s*|\s*$/g,"").length) {
867                   
868                     continue;
869                 }
870                 // strip me.!
871                 var cell_value_text = cleanHTML(cols[col].childNodes[0].nodeValue);
872        
873                 if (cols[col].getAttribute('xls:percent')) {
874                     cell_value_text = '' + ((cell_value_text * 1) / 100);
875                 }
876
877                 if (cell_value_text.length && (vt == 30) && xlstype == 'date') {
878                     var bits = cell_value_text.split(/-/);
879                     var cur = new Date(bits[0],bits[1]-1,bits[2]);
880                     cell_value_text = '' + Math.round((cur.getTime() - Date.UTC(1899,11,30)) / (24 * 60 * 60 * 1000));
881                 }
882
883                 
884                 
885                 if (cols[col].getAttribute('xls:formula')) {
886                     var s = cols[col].getAttribute('xls:formula');
887                     vt = '';
888                     cell_value_text = s.replace(/#row#/g,(row + yoff + 1));
889                 }
890                 this.set({ r: row + yoff, c : realcol + xoff }, cell_value_text, vt, vf);
891                  
892                   
893                 
894                 
895                 
896             }
897         }
898         this.rowOffset += rows.length;
899         
900     },
901     
902     
903     
904     parseHtmlStyle : function(dom, row, col, colspan, rowspan) {
905         
906         function toCol (rgb) {
907             
908             var ar = rgb.replace(/rgb[a]?\(/, '').replace(/\)/, '').replace(/ /, '').split(',');
909             var rcs = [];
910             ar = ar.slice(0,3);
911             Roo.each(ar, function(c) { 
912                 rcs.push((c*256).toString(16)) ; 
913             });
914             return rcs.join(':');
915             
916         }
917         
918         var el = Roo.get(dom);
919         var map =  {
920             'text-align'  : function(ent,v) { 
921                 ent['HAlign'] = { 'left' : '1', 'center' : '8' ,  'right' : '4' }[v] || '1';
922             },
923             'vertical-align': function(ent,v) { 
924                 ent['VAlign'] = { 'top' : '1', 'middel' : '8' ,  'bottom' : '4' }[v] || '1';
925             },
926             
927             'color': function(ent,v) { 
928                 ent['Fore'] = toCol(v);
929             },
930             'background-color' : function(ent,v) { 
931                 ent['Back'] = toCol(v);
932                 
933             }
934             
935         }
936        
937         var ent = {
938                 HAlign:"1",
939                 VAlign:"2",
940                 WrapText:"0",
941                 ShrinkToFit:"0",
942                 Rotation:"0",
943                 Shade:"0",
944                 Indent:"0",
945                 Locked:"0",
946                 Hidden:"0",
947                 Fore:"0:0:0",
948                 Back:"FFFF:FFFF:FFFF",
949                 PatternColor:"0:0:0",
950                 Format:"General"
951         };
952            
953         for(var k in map) {
954             var val = el.getStyle(k);
955             if (!val || !val.length) {
956                continue;
957             }
958             map[k](ent,val);
959         }
960         // fonts..
961         var fmap = {
962             
963            
964             'font-size' : function(ent,v) { 
965                 ent['Unit'] = v.replace(/px/, '');
966             },
967             'font-weight' : function(ent,v) { 
968                 if (v != 'bold') return;
969                 ent['Bold'] = 1;
970             } 
971             //FontItalic : function(ent,v) { 
972             //    if (v*0 < 1) return;
973             //    //ent['font-weight'] = 'bold';
974             //},
975             
976         }
977        
978         var fent = {
979             Unit:"10",
980             Bold:"0",
981             Italic:"0",
982             Underline:"0",
983             StrikeThrough:"0"
984         };
985         
986         for(var k in fmap) {
987             var val = el.getStyle(k);
988             if (!val || !val.length) {
989                continue;
990             }
991             fmap[k](fent,val);
992         }
993         var font = el.getStyle('font-family') || 'Sans';
994         if (font.split(',').length > 1) {
995             font = font.split(',')[1].replace(/\s+/, '');
996         }
997         
998         
999         /// -- now create elements..
1000         
1001         var objs = this.sheet.getElementsByTagNameNS('*','Styles')[0];
1002         
1003         //<gnm:StyleRegion startCol="0" startRow="0" endCol="255" endRow="65535"
1004         var sr = this.doc.createElementNS('http://www.gnumeric.org/v10.dtd', 'gnm:StyleRegion');
1005         objs.appendChild(sr);
1006         objs.appendChild(this.doc.createTextNode("\n"));// add a line break..
1007
1008         sr.setAttribute('startCol', col);
1009         sr.setAttribute('endCol', col+ colspan-1);
1010         sr.setAttribute('startRow', row);
1011         sr.setAttribute('endRow', row + rowspan -1);
1012         
1013         
1014         var st = this.doc.createElementNS('http://www.gnumeric.org/v10.dtd', 'gnm:Style');
1015         sr.appendChild(st);
1016         // do we need some defaults..
1017         for(var k in ent) {
1018             Roo.log(k);
1019             st.setAttribute(k, ent[k]);
1020         }
1021         
1022         var fo = this.doc.createElementNS('http://www.gnumeric.org/v10.dtd', 'gnm:Font');
1023         st.appendChild(fo);
1024         // do we need some defaults..
1025         for(var k in fent) {
1026             fo.setAttribute(k, fent[k]);
1027         }
1028         fo.textContent  = font;
1029         
1030         var sb = false;
1031         // borders..
1032         Roo.each(['top','left','bottom','right'], function(p) {
1033             var w = el.getStyle('border-' + p + '-width').replace(/px/, '');
1034             if (!w || !w.length || (w*1) < 1) {
1035                 return;
1036             }
1037             if (!sb) {
1038                 sb= this.doc.createElementNS('http://www.gnumeric.org/v10.dtd', 'gnm:StyleBorder');
1039             }
1040             var be = this.doc.createElementNS('http://www.gnumeric.org/v10.dtd', 'gnm:' + p[0].toUpperCase() + p.substring(1));
1041             be.setAttribute('Style', '1');
1042             be.setAttribute('Color', '0:0:0'); // fixme..
1043             sb.appendChild(be);
1044             
1045         }, this);
1046         // start adding them all together..
1047         
1048         if (sb) {
1049             st.appendChild(sb)
1050         }
1051         
1052         
1053         
1054         
1055     },
1056     
1057     
1058     
1059     /**
1060      * writeImage:
1061      * write an image (needs base64 data to write it)
1062      * 
1063      * 
1064      * @param {Number} row  row to put it in (rows start at 0)
1065      * @param {Number} col  column to put it in
1066      * @param {Number} data  the base64 description of the images
1067      * @param {Number} width image width
1068      * @param {Number} width image height
1069      * 
1070      */
1071     
1072     
1073     writeImage : function (row, col, data, width, height) 
1074     {
1075         
1076         // our default height width is 50/50 ?!
1077         //console.log('w='+width+',height='+height);
1078                 //        <gmr:Objects>
1079         row*=1;
1080         col*=1;
1081         height*=1;
1082         width*=1;
1083         var objs = this.sheet.getElementsByTagNameNS('*','Objects')[0];
1084         var soi = this.doc.createElementNS('http://www.gnumeric.org/v10.dtd', 'gnm:SheetObjectImage');
1085         
1086         //<gmr:SheetObjectImage 
1087         //      ObjectBound="A3:J8" 
1088         //      ObjectOffset="0.375 0.882 0.391 0.294" 
1089         //      ObjectAnchorType="16 16 16 16" 
1090         //      Direction="17" 
1091         //      crop-top="0.000000" 
1092         //      crop-bottom="0.000000" 
1093         //      crop-left="0.000000" 
1094         //      crop-right="0.000000">
1095                 
1096                 
1097         //alert(gnumeric_colRowToName(row,col));
1098                
1099         // this is where we really have fun!!!... 
1100         // since our design currently assumes the height is enough to fit
1101         // stuff in, we only really need to work out how wide it has to be..
1102         
1103         // note we should probably use centralized calcs if it fits in the first cell!
1104         
1105         // step 1 - work out how many columns it will span..
1106         // lets hope the spreadsheet is big enought..
1107         var colwidth = 0;
1108         var endcol=col
1109         for ( endcol=col;endcol <100; endcol++) {
1110             if (!this.colInfo[endcol]) {
1111                 this.colInfo[endcol] = 100; // eak fudge
1112             }
1113             colwidth += this.colInfo[endcol];
1114             if (colwidth > width) {
1115                 break;
1116             }
1117         }
1118        
1119         
1120         soi.setAttribute('ObjectBound',
1121             //gnumeric_colRowToName(row,col) + ':' + gnumeric_colRowToName(row+1,col+1));
1122             this.RCtoCell(row,col) + ':' + this.RCtoCell(row,endcol));
1123      
1124         var ww = 0.01; // offset a bit...
1125         var hh = 0.01; //
1126         
1127         var ww2 = 1 - ((colwidth - width) / this.colInfo[endcol]);
1128         var hh2 = 0.99;
1129         
1130         var offset_str = ww + ' '  + hh + ' ' + ww2 + ' '+hh2;
1131         //console.log(offset_str );
1132         //alert(offset_str);
1133         soi.setAttribute('ObjectOffset', offset_str);
1134         soi.setAttribute('ObjectAnchorType','16 16 16 16');
1135         soi.setAttribute('Direction','17');
1136         soi.setAttribute('crop-top','0.000000');
1137         soi.setAttribute('crop-bottom','0.000000');
1138         soi.setAttribute('crop-left','0.000000');
1139         soi.setAttribute('crop-right','0.000000');
1140                 // <Content image-type="jpeg" size-bytes="3900">......  < / Content>
1141         var content = this.doc.createElement('Content');
1142         content.setAttribute('image-type','jpeg');
1143         //alert(imgsrc);
1144         
1145         content.setAttribute('size-bytes',data.length);
1146         content.textContent = data;
1147         soi.appendChild(content);
1148         objs.appendChild(soi);
1149         return true;
1150                 //< /gnm:SheetObjectImage>
1151                 // < /gnm:Objects>
1152
1153     },
1154  
1155     /**
1156      * mergeRegion:
1157      * Merge cells in the spreadsheet. (does not check if existing merges exist..)
1158      * 
1159      * @param {Number} col1  first column 
1160      * @param {Number} row1  first row
1161      * @param {Number} col2  to column 
1162      * @param {Number} row2  to row
1163      * 
1164      */
1165     mergeRegion : function (col1,row1,col2,row2)
1166     {
1167         var cell = this.doc.createElementNS('http://www.gnumeric.org/v10.dtd', 'gnm:Merge');
1168         //if (col1 > 50|| col2 > 50) { // do not merge cols off to right?
1169        //     return;
1170         //}
1171         
1172         cell.textContent = this.RCtoCell(row1,col1) + ':' + this.RCtoCell(row2,col2)
1173         
1174         //var merges = this.gnumeric.getElementsByTagNameNS('*','MergedRegions');
1175         var merges = this.sheet.getElementsByTagNameNS('*','MergedRegions');
1176         if (!merges || !merges.length) {
1177             merges = this.doc.createElementNS('http://www.gnumeric.org/v10.dtd','gnm:MergedRegions');
1178             var sl = this.sheet.getElementsByTagNameNS('*','SheetLayout')[0];
1179             this.sheet.insertBefore(merges,sl);
1180         } else {
1181             merges = merges[0];
1182            }
1183         merges.appendChild(cell);
1184     
1185     },
1186     /**
1187      * setRowHeight:
1188      * Sets the height of a row.
1189      * 
1190      * @param {Number} r  the row to set the height of. (rows start at 0)
1191      * @param {Number} height (in pixels)
1192      */
1193     setRowHeight : function (r,height)
1194     {
1195         
1196         //<gmr:Rows DefaultSizePts="12.75">
1197         //   <gmr:RowInfo No="2" Unit="38.25" MarginA="0" MarginB="0" HardSize="1"/>
1198     //  < /gmr:Rows>
1199         var rows = this.sheet.getElementsByTagNameNS('*','Rows')[0]; // assume this exists..
1200         var ri = this.doc.createElementNS('http://www.gnumeric.org/v10.dtd','gnm:RowInfo');
1201         // assume we have no rows..
1202         ri.setAttribute('No', r-1);
1203         ri.setAttribute('Unit', height);
1204         ri.setAttribute('MarginA', 0);
1205         ri.setAttribute('MarginB', 0);
1206         ri.setAttribute('HardSize', 1);
1207         rows.appendChild(ri);
1208     },
1209      
1210     /**
1211      * setSheetName: 
1212      * Set the sheet name.
1213      * @param {String} title for sheet
1214      **/
1215     setSheetName : function(name,sheet)
1216     {
1217         sheet = sheet || 0;
1218         /*
1219         <gnm:SheetNameIndex>
1220         <gnm:SheetName>Sheet1</gnm:SheetName>
1221         <gnm:SheetName>Sheet2</gnm:SheetName>
1222         <gnm:SheetName>Sheet3</gnm:SheetName>
1223         </gnm:SheetNameIndex>
1224         */
1225         // has to set sheet name on index and body..
1226         Roo.log(sheet);
1227         Roo.log(name);
1228         var sheetnames = this.doc.getElementsByTagNameNS('*','SheetName');
1229         if (sheet >=  sheetnames.length) {
1230             
1231             sheetnames[0].parentNode.appendChild(sheetnames[sheetnames.length-1].cloneNode(true));
1232             // copy body.
1233             sheetnames = this.doc.getElementsByTagNameNS('*','Sheet');
1234             sheetnames[0].parentNode.appendChild(sheetnames[sheetnames.length-1].cloneNode(true));
1235             var sn = this.doc.getElementsByTagNameNS('*','Sheet')[sheet];
1236             var cls = sn.getElementsByTagNameNS('*','Cells')[0]
1237             while (cls.childNodes.length) {
1238                 cls.removeChild(cls.firstChild);
1239             }
1240             
1241         }
1242         
1243         var sheetn = this.doc.getElementsByTagNameNS('*','SheetName')[sheet];
1244         sheetn.textContent = name;
1245         var sheetb = this.doc.getElementsByTagNameNS('*','Sheet')[sheet].getElementsByTagNameNS('*','Name')[0];
1246         sheetb.textContent = name;
1247         this.parseDoc(sheet);
1248         
1249         
1250         
1251         
1252     },
1253      /**
1254      * setColumnWidth: 
1255      * Set the column width
1256      * @param {Number} column number (starts at '0')
1257      * @param {Number} width size of column
1258      **/
1259     setColumnWidth : function(column, width)
1260     {
1261         column = column *1; 
1262         width= width*1;
1263         if (typeof(this.colInfoDom[column]) == 'undefined') {
1264             var cols = this.doc.getElementsByTagNameNS('*','Cols')[0];
1265             var ri = this.doc.createElementNS('http://www.gnumeric.org/v10.dtd', 'gnm:ColInfo');
1266             ri.setAttribute('No', column);
1267             ri.setAttribute('Unit', width);
1268             ri.setAttribute('MarginA', 2);
1269             ri.setAttribute('MarginB', 2);
1270             ri.setAttribute('HardSize', 1);
1271             cols.appendChild(ri);
1272             this.colInfo[column] = width;
1273             this.colInfoDom[column]  = ri;
1274             return;
1275         }
1276         this.colInfoDom[column].setAttribute('Unit', width);
1277         
1278     },
1279     
1280     
1281     
1282     
1283     
1284      /**
1285      * toHTML: 
1286      * Convert spreadsheet into a HTML table.
1287      */
1288             
1289     toHTML :function()
1290     {
1291          var _t = this;
1292         function calcWidth(sc, span)
1293         {
1294             var n =0;
1295             for(var i =sc; i< sc+span;i++) {
1296                 n+=_t.colInfo[i];
1297             }   
1298             return n;
1299         }
1300         
1301         var grid = this.grid;
1302         // lets do a basic dump..
1303         var out = '<table style="table-layout:fixed;" cellpadding="0" cellspacing="0">';
1304         for (var r = 0; r < this.rmax;r++) {
1305             out += '<tr style="height:'+this.rowInfo[r]+'px;">';
1306             for (var c = 0; c < this.cmax;c++) {
1307                 var g = (typeof(grid[r][c]) == 'undefined') ? defaultCell  : grid[r][c];
1308                 
1309                 if (typeof(g.cls) =='undefined') g.cls = [];
1310                 var w= calcWidth(c,g.colspan);
1311                 out+=String.format('<td colspan="{0}" rowspan="{1}"  class="{4}"><div style="{3}">{2}</div></td>', 
1312                     g.colspan, g.rowspan, g.value,
1313                     'overflow:hidden;' + 
1314                     'width:'+w+'px;' +
1315                    
1316                     'text-overflow:ellipsis;' +
1317                     'white-space:nowrap;',
1318                      g.cls.join(' ')
1319     
1320     
1321                 );
1322                 c+=(g.colspan-1);
1323             }
1324             out += '</tr>';
1325         }
1326         //Roo.log(out);
1327         return out+'</table>';
1328         
1329         
1330         
1331     },
1332     /**
1333      * download:
1334      * @param {String} name  filename to downlaod (without xls)
1335      * @param {String} callback  (optional) - callback to call after callback is complete.
1336      */
1337     download : function(name,callback)
1338     {
1339         name = name || "Missing_download_filename";
1340         
1341         if (this.downloadURL && this.downloadURL.charAt(this.downloadURL .length-1) != '/') {
1342             this.downloadURL += '/';
1343         }
1344         
1345         var ser = new XMLSerializer();
1346         var x = new Pman.Download({
1347             method: 'POST',
1348             params : {
1349                xml : ser.serializeToString(this.doc),
1350                format : 'xls', //xml
1351                debug : 0
1352                
1353             },
1354             url : (this.downloadURL || (baseURL + '/GnumericToExcel/')) + name + '.xls',
1355             success : function() {
1356                 Roo.MessageBox.alert("Alert", "File should have downloaded now");
1357                 if (callback) {
1358                     callback();
1359                 }
1360             }
1361         });
1362          
1363     }
1364
1365 });