jsoma / tabletop Goto Github PK

View Code? Open in Web Editor NEW

3.8K 107.0 445.0 416 KB

Tabletop.js gives spreadsheets legs

License: MIT License

JavaScript 93.63% Python 3.22% Ruby 3.15%

tabletop's People

Contributors

Stargazers

Watchers

Forkers

bronfman dansinker frabcus xanarax dannguyen todrobbins jsvine ejang ctbarna chrismetcalf dkrenmayr joegermuska sonnylazuardi zketosis gijs nelsonmau malachaifrazier vaughankg paineert tasneem chrislm smelendez catdad vibster uberbuilder dwe0008 max-mapper vlandham zmilan eeertekin steelx lisawilliams poderopedia futuraprime tverbeiren mvtango uxdesigner mohan2020 martinburch wrightmikea jellea damajor nickjevershed triptych wocum freecooperunion kirkman gigantc oscucio jeffstade jusheehy dethe srajeshs iarnaud clburg engaginginfo saasmath rcrphillips sharpred webhattan kanojesumit almeidamarcell ghing sfpc eugeneliang gerhobbelt cbertelegni truskill andymason jensfinnas splittorff spsulliv graham1776 theednaffattack abhinemani gng0101 sonyakuki iblind benjiboy576 nandiraju clkao mit-dig pereiram prodigeni luiseduardohdbackup misbah6317 rosetheresa xezz metarouter inno-v landsurveyorsunited kunstkernewek mtco cjseeger datajensen ajlamanna sagv agresvig qmomo bnchdrff

tabletop's Issues

Progress available?

Hi, how should I get to the loading progress? I see no XHR reqs? thanks!

Column header not parsed as string

I have column headers like this "0-14", "15-20", "20-25" and so on...

How can I make Tabletop read this data as a sting cause now it ignores it considering it to be illegal column name.

Guess that issue is caused by column name starting with number.

Many thanks in advance.

Retrieved "Loading..." when using IMPORTRANGE in spreadsheet

I have multiple sheets, and the mail one obtains data from the rest using IMPORTRANGE. The values I get with tabletop for the cells where IMPORTRANGE is used are "Loading..." since the spreadsheet takes a while to calculate all data. ¿Is there a way to make tabletop wait until the spreadsheet is fully loaded?

if one sheet is empty the whole transaction is aborted without an error message

I have a sheet in a multisheet for errors/ambiguities, which starts with headers, but empty, and gets filled in as errors are found.

Expected behaviour: return the sheets, the empty sheet being empty.

Actual behaviour: data gets downloaded, but callback is not executed at all, so tabletop stops working. When I added a dummy row to the empty table it started working.

I think there's a bug around https://github.com/jsoma/tabletop/blob/master/src/tabletop.js#L422 where it spots an empty feed and logs a warning. Should it be returning this instead of nothing?

I can provide tests (though I don't see any here?) or set something up in jsfiddle if it helps.

FireFox Errors - JSON Response is Requestiong Login on Public & Published Spreadsheet

Works fine in Chrome & Safari but When loading with FireFox data is never loaded.

According to FireBug -
"SyntaxError: syntax error"

"https://spreadsheets.google.com/feeds/worksheets/0ApLwuu1HQNO7dHJVY1dsdWZlT2lNRjZ4eXluY1BWdHc/public/basic?alt=json-in-script&callback=Tabletop.callbacks.tt137382618883958301"

Looks like it is requesting to login to google. I have this issue on a personal project as well as I check on the Demo project of http://dataforradicals.com/js/tabletop-to-datatables/

Unclear instructions?

The README seems rather content in stating that this "just works like so:". I cloned the repo, rsynced it to my server, and added an index.html file to the tabletop root directory, which contains:

<!DOCTYPE html>
<html>
<body>
<script type="text/javascript">
  window.onload = function() { init() };

  var public_spreadsheet_url = 'https://docs.google.com/spreadsheet/pub?hl=en_US&hl=en_US&key=0AmYzu_s7QHsmdDNZUzRlYldnWTZCLXdrMXlYQzVxSFE&output=html';

  function init() {
    Tabletop.init( { key: public_spreadsheet_url,
                     callback: showInfo,
                     simpleSheet: true } )
  }

  function showInfo(data, tabletop) {
    alert("Successfully processed!")
    console.log(data);
  }
</script>
</body>
</html>

This shows me a blank page.
What am I missing?

Populating array within Tabletop callback

Inside the Tabletop callback, I'm populating an array, which is created before the callback function.

When I console.log() the array outside of the Tabletop callback, on the first page load, it contains all the elements I push into the array in the callback. On subsequent page loads though, my array is empty.

Do you have any idea if this could be caused by the way Tabletop calls the callback function, or something else related to Tabletop?

Fetching all sheets with backbone.tabletopSync

Is there a way to fetch all sheets with backbone.tabletopSync? Glancing at the code it seems that if the sheet option isn't set, nothing will happen:

if(typeof(tabletopOptions.sheet) == "undefined") {
    return;
  }

I am interested getting all of my sheets to JSON with one http request instead of many.

Thanks for making tabletop.

Browserify example returns "Uncaught TypeError: undefined is not a function :5811"

The line that chrome complains about:

content = fs.readFileSync(file, 'ascii'),

In this function:

/**
 * Load an Apache2-style ".types" file
 *
 * This may be called multiple times (it's expected).  Where files declare
 * overlapping types/extensions, the last file wins.
 *
 * @param file (String) path of file to load.
 */
Mime.prototype.load = function(file) {

  this._loading = file;
  // Read file and split into lines
  var map = {},
      content = fs.readFileSync(file, 'ascii'),
      lines = content.split(/[\r\n]+/);

How to retrieve sheet order

Scratched my head a couple of hours finding how to retrieve the sheets in the order they are ordered in the spreadsheet.

I could finally achieve it by using tableTop.foundSheetNames, but shouldn't it be documented since the values of tableTop.model_names seem to come in a random order (maybe in the order of asynchronous retrieval)?

Cheers,

Empty Response

I copied the simple example shown in the examples directory. It works fine with the included public_spreadsheet_url, but as soon as I replace that with the URL of my spreadsheet, https://docs.google.com/spreadsheet/pub?key=0Alz1sw-5qPXHdGRyWTNsZmNsSG9MVjdlN2dmSUtDV0E&output=html, the alert says that 0 rows have been processed, and the console.log shows an empty object.

I double checked that the spreadsheet is public, and I tested the spreadsheet URL in an incognito window too just to be sure.

I've been scouring this project's docs on GitHub looking for an answer, but I've got nothing. Any ideas?

Couple of typos on the intro page.

Amazing library, clear amusing explanation. Really good.

Just a couple of points, I know the code on http://builtbybalance.com/Tabletop/ wasn't supposed to be copied and pasted "as is", but there's a couple of ; missing.
Confuses us JS newbies!

Also on the footer:,
Want to ge [get] started on your project?
Fill out our Project Questionarre[Questionnaire].

But apart from those minor details, I just really wanted to say thanks!

Would you consider adding this to CDNJS?

Sorry, me again - last one I promise!

CDNJS (http://cdnjs.com/ ) is a popular community-curated CDN of js libraries, and handlebars is in there but your library isn't. They'll consider anything over 100 github stars. I tried adding it (https://github.com/cdnjs/cdnjs) but all the github stuff about running an npm validator is way beyond me! Having your on there (in minified JS too) would mean I could pull jquery, tabletop and handle bars all from CDNs - how's that for the ultimate low-byte flat file cms? :)

NEW Google Spreadsheets

Tabletop doesn't seem to work with the newest version of Google Spreadsheets. I'm using the Mother Jones Quiz framework (https://github.com/motherjones/newsquiz), and it works with an old spreadsheet that I copy from a template, but not the new spreadsheets.

Handle #gid= when parsing url

and Make it possible to instantiate with specific sheet

Caching scripts broken on Google Sheets

I'm experiencing an intermittent issue with Tabletop.js not loading the dataset from Google Sheets. In order to combat this as I have in the past, I've been trying to use one of the caching scripts to pull down the relevant files and upload them to S3.

Alas, 'tis not to be. It downloads the first file, then tries to extract the spreadsheet keys from that, then tries to load https://spreadsheets.google.com/feeds/cells/"+key+"/"+sheet_id+"/public/values?alt=json-in-script&sq=&callback=Tabletop.singleton.loadSheet. Alas, this fails with error 400.

Visiting that URL yields the following error: Invalid query parameter value for sq. Removing the &sq= query parameter from the URL, however, causes it to succeed.

Can i do a full sync?

Can i do sync methods like read,update,create,destroy ?

Retrieve un-sanitized column names

Hey

Great script!

I have been tasked with creating a table on a website from Google Spreadsheet, so need column names for table headings.

Is it possible to retrieve the column names, without lowercasing and spaces removed?

Thanks.

Tabletop.Model.fetchPrettyColumns causes endless loop when using newest Flatware proxy

What it says on the tin.

XHR cross origin failure when initializing tabletop with a query

initialization such as:

Tabletop.init({
    key: "ABCD",
    query: "select B, C",
    simpleSheet: true,
    callback: callback
});

fails with the following error:

XMLHttpRequest cannot load https://spreadsheets.google.com/feeds/list/ABCD/oq7ao2t/public/values?alt=json&sq=select%20B,%20C. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://4afe0e27c254af279a8d9135ef7dbe31d78cf487.googledrive.com' is therefore not allowed access. The response had HTTP status code 400.

Return a Promise from Backbone.tabletopSync

Backbone.tabletopSync does not correctly implement the original Backbone.sync interface, which returns a Promise that is resolved when the request completes and rejected when it fails. This is a useful pattern and one Backbone developers are accustomed to using. I suspect Backbone developers interested in using Tabletop would greatly appreciate such functionality in this already-great library.

Version numbers

It would be helpful for tabletop.js to have some sort of version number system, especially when backwards-incompatibile changes are made, like this.

New Google Drive Keys

EDIT: Had a typo in the function. Sorry

Hey there,

Just a quick one... I'm not longer getting a key in the GET url. Instead, the url is looking something like this:
https://docs.google.com/spreadsheets/d/1sNdUNoHAZTbueB3AhM-wdinCnL-nnI4OocCJn6hecTM/pubhtml

Which doesn't seem to be working on the Tabletop init. Do these new URL formats work?

Thanks

Setting custom marker icons based on column entry

I'm having some trouble figuring out how to set custom marker icons. I've got some icons defined per leaflet's documentation

var None = L.icon({
        iconUrl: 'icons/shadow.jpg',
        iconSize:     [10,10], // size of the icon
        iconAnchor:   [0, 0], // point of the icon which will correspond to marker's location
        popupAnchor:  [5, 5] // point from which the popup should open relative to the iconAnchor

And when tabletop is called one of the groups it pulls is the "faction" column

for (var num = 0; num < tabletopData.length; num ++) {
                var dataOne = tabletopData[num].name;
                var dataTwo = tabletopData[num].faction;

... And so on for all the columns and the latitude and longitude information.

So then later I try to use the dataTwo variable to change the icon on a per marker basis. In this case all cells in the entire faction column are currently filled with just the word None.

marker_location = new L.LatLng(dataLat, dataLong);
layer = new L.Marker(marker_location, {icon: dataTwo});
map.addLayer(layer);

I get an error (I'm using Chrome's javascript debugger to look at it) and the markers just don't show up. markerscript.js is the file with this code in it.

Uncaught TypeError: undefined is not a function     leaflet.js:7
o.Marker.o.Class.extend._initIcon                   leaflet.js:7
o.Marker.o.Class.extend.onAdd                       leaflet.js:7
o.Map.o.Class.extend._layerAdd                      leaflet.js:6
o.Map.o.Class.extend.addLayer                       leaflet.js:6
startUpLeafet                                       markerscript.js:54
Tabletop.doCallback                                 tabletop.js:382
Tabletop.loadSheet                                  tabletop.js:372
xhr.onload                                          tabletop.js:181

I'm sure I'm just missing something in how variables are handled though. If I replace dataTwo with the word None then all the markers load with the None icon as expected. So it's something about how the variable is formatted? I tried having the script dump the dataTwo variable to the console but I just get the word None as I was hoping.

Releasing a 1.3.5?

Hello and thank you for Tabletop, it's been super useful to me.

Do you think it would be okay to do a bump release to 1.3.5 to fix the #49 issue? It does break with a lot of new sheets because of the new IDs.

IE9 and Tabletop.js

Found something interesting, and I'm trying to get perspective on solutions. The project I'm referencing is here:

http://edsource.org/today/wp-content/iframe/2013-06-27-schoolstress/schoolstress.html

When you load that project in IE9, tabletop doesn't initialize. However, when I turn on developer tools to look at the console to see what's wrong, it works. I tested it out on VB, and I had someone with a PC confirm the issue.

Any idea on what's going on here?

Thanks!

Bower package for front-end development

Hello, I see you maintain an npm package - thanks for that. Please also consider maintaining a bower package for us front-end guys. Also would be nice to mention npm / bower in readme.md. Thanks.

https://github.com/bower/bower

Ember.js Support

Does tabletop supports ember.js with ember-data ?

i've been using tabletop for simple static stuff for while now and i'm trying to get it to work with ember. so far no luck, if it is possible could you put up a demo page for that like the backbone one please ?

'Tabletop is undefined' error in Internet Explorer

Hey, loving tabletop.js. Makes deploying small web apps much easier.

Question, I'm running into an error with Internet Explorer when I initialize Tabeltop.

The breakpoint is here:

window.onload = function() { init() }

var public_spreadsheet_url = 'https://docs.google.com/spreadsheet/pub?key=0AmXUp_k1PfvcdGJqbm1TTElEUW16YXJXZWZsakFXaEE&output=html'

  function init() {
    Tabletop.init( { key: public_spreadsheet_url,
                     callback: showInfo,
                     wanted: ["Sheet1"],
                     debug: true })
  }

The JS debugger in IE stops at Tabletop.init. I'm using code from the standard.html file as a guide. Any help on this would be grand. Thanks!

tabletop enters infinite loop of requests

I am using tabletop with backbone.

My google spread sheet structure:

"Sections" sheet contains a list of gallery names, which is a reference to other sheets by the name.

var GalleriesCollection = Backbone.Collection.extend({
        model: GalleryModel,

        tabletop: {
            instance: GoogleSpreadsheet,
            sheet: 'sections'
        },

        sync: Backbone.tabletopSync
    });

var GalleryModel = Backbone.Model.extend({
        initialize: function(){
            this.slides = new SlidesCollection();

            this.slides.tabletop.sheet = this.get('name');

            this.slides.fetch({
                success: function( sections ){

                    console.log(sections);

                }
            });

var SlidesCollection = Backbone.Collection.extend({
        model: SlideModel,

        tabletop: {
            instance: GoogleSpreadsheet
        },

        sync: Backbone.tabletopSync
    });

I make an instance of the collection and call fetch:

var sections = new GalleriesCollection();

sections.fetch({
                success: function( sections ){
                   // console.log(sections);


                }
            });

The instance of the collection logs a proper response, but then tabletop.js:159 goes into an infinite loop of calling

https://spreadsheets.google.com/feeds/list/0AnHTNwS00YBMdElNcTI2TlpwNDF4QkdJRVNqeGNidlE/od4/public/values?alt=json-in-script&sq=&callback=Tabletop.callbacks.tt136503242367234341

This is line 159 from tabletop.js:

document.getElementsByTagName('script')[0].parentNode.appendChild(script);

This infinite loop results in Google blocking me and me having to do a captcha to get back in.

Any ideas what I'm doing wrong?

tag current commit (f83c414de) w/ new version for NPM

backbone tabletop question

I'm loading dynamically the sheets in the collection. When I make a fetch dont work.
My solution:
App.Collections.Mapa = Backbone.Collection.extend({

initialize:function(){
    this.tabletop();
    this.sync();
},

model:App.Models.mapa,

tabletop: function()
{
    return this.tabletop = {
    instance:ff(),
    sheet:App.sheet

    }
},

sync:function(){
    this.sync = Backbone.tabletopSync;
    return this.sync; 
}

});

Eliminate one of the requests?

Hey, fantastic job on this first of all!
I notice you're making two requests to get the data - one to feeds/worksheets to get the worksheet ID and then one to feeds/list to get the actual data.

My question is whether it'd be possible to eliminate the first request (to get the worksheet ID) if you're working with a spreadsheet that only has one worksheet - it seems the ID is always od6 by default. Have you considered this?

Trigger update events

It would be amazing to have tabletop monitor the data and trigger events when it changes.

That way you could use handlebars' automatic bind/update stuff. For awesome.

Spreadsheets endpoint returns error with empty sq query parameter

Using Tabletop like this:

var spreadsheetId = 'some-spreadhseet-key'; 
Tabletop.init({
  key: spreadsheetId,
  callback: function(data, tabletop) {
    console.log('here');
    console.log(data);
  },
  simpleSheet: true
});

results in Tabletop.loadSheets building a URL like https://spreadsheets.google.com/feeds/list/some-spreadsheet-key/od6/public/values?sq=&alt=json

This returns a HTTP 400 error with a message of "Invalid query parameter value for sq.". If I get rid of the sq parameter in the query string, it returns the expected data.

Only adding the sq parameter to the URL if this.query is truthy seems to fix the issue for me, i.e.:

      for(i = 0, ilen = data.feed.entry.length; i < ilen ; i++) {
        this.foundSheetNames.push(data.feed.entry[i].title.$t);
        // Only pull in desired sheets to reduce loading
        if( this.isWanted(data.feed.entry[i].content.$t) ) {
          var sheet_id = data.feed.entry[i].link[3].href.substr( data.feed.entry[i].link[3].href.length - 3, 3);
          //var json_path = "/feeds/list/" + this.key + "/" + sheet_id + "/public/values?sq=" + this.query + '&alt='
          var json_path = "/feeds/list/" + this.key + "/" + sheet_id + "/public/values?&alt=";
          if (inNodeJS || supportsCORS) {
            json_path += 'json';
          } else {
            json_path += 'json-in-script';
          }
          if(this.orderby) {
            json_path += "&orderby=column:" + this.orderby.toLowerCase();
          }
          if(this.reverse) {
            json_path += "&reverse=true";
          }
          if(this.query) {
            json_path += "&sq=" + this.query;
          }
          toLoad.push(json_path);
        }
      }

Note that I'm using this from Node.js, but I don't see why it makes a difference.

Markers do not show on mobile

When I try to make a map with Tabletop to Leaflet, the markers do not show in Safari on iPhone, although they work on desktop browsers. The same happens when I try to open the demo ( http://wcfcourier.com/app/special/tabletop_to_leaflet/ ) on my iPhone. Is this a known issue, and are there any fixes?

Sorttable.js Compatibility

I'm not sure why but it seems that Tabletop breaks Sorttable even though Sorttable is pure JS and doesn't require any external library to function.

Any ideas on why this is happening or how to fix it?

The raw text file can be found here: http://www.kryogenix.org/code/browser/sorttable/sorttable.js

retry failed requests

Sometimes with multiple spreadsheets the request might time-out, or the proxy might fail.

Is there any way to force a retry on the failed request / handle the error?

New spreadsheets in non-updated GDrive no longer work

First reported by @mattparrilla on Twitter https://twitter.com/mattparrilla/status/437645997884198912

it appears that Google Spreadsheet updates have made it so that newly created sheets will not work with Tabletop, even if you have not updated your Google Drive account.

I've provided an illustrative example below, using a URL that works for an old doc's key, and putting a new doc's key into it:

Live: http://daguar.github.io/tabletop-broken-example/
Code: https://github.com/daguar/tabletop-broken-example/blob/gh-pages/index.html

Can others please try this and confirm/disconfirm?

If it's true, we should add a note to the README (and probably sulk.)

blank lines in the spreadsheet break table top

Hey,

thanks for the fantastic library!
I have a following problem: each time I have a blank line in my spreadsheet, all the data is "cut" after that --- I only see data before the blank line. Is it the tabletop bug? Or is it how Google structures it's ATOM's feed?

Not really an issue but a comment

Just wanted to say Tabletop.js works great with jQuery Brackets! The area I'm struggling with is figuring out how to send edited data, made using jQuery Brackets on a website, to the original Google Spreadsheet.

The API to edit jQuery Bracket data can be viewed here. Any ideas on how to achieve this would be greatly appreciated.

Thank you for your time and keep up the great work!

Browserify support

Nowadays, Tabletop works with NodeJS using the request module. But when using browserify, request became a big package (and consequently Tabletop too) and the resulting bundle is a ~1MB file (which is a bit huge for a client side file).

Node detection breaks Karma runner

I'm using Tabletop.js to feed data into AngularJS, and all my tests are failing because Karma runs as a Node app (Thus triggering the conditional at line 5), and then fails when loading tabletop.js in the browser (Which can't use require()).

I've temporarily circumvented this by && typeof module.exports.browsers === undefined to the conditional, so that it ignores it if module.exports has a browsers object. NodeJS really isn't my strong suit, so there's probably a better way of doing this...

Handling errors

Would be awesome to get a callback to handle error responses from Google. Today I was getting 324 (ERR_EMPTY_RESPONSE: Server closed the connection without sending any data) and 429 (unknown).

I <3 Tabletop

Caching worked, not anymore

Hi there,

I have used caching via the 'proxy' parameter successfully with tabletop revision: 3531dd6

I recently updated to latest revision:
10e7808
and the caching doesn't work anymore.

I use a local proxy:

proxy: "tabletop/caching"

after the local.py script is run in this same directory.

In the working proxy version, tabletop.js successfully requests the URL:

<proxy>/<key>

Now, tabletop.js requests (and fails to load) the URL:

<proxy>/feeds/worksheets/<key>/public/basic?alt=json

This has been seen in both Firefox and Chrome. Thanks!

Herve

feature req: possibility for private sheets (oauth authN)? Willing to create a pull.

Has anyone ever thought of / experimented with extending tabletop to work with private sheets?

Especially interested in oAuth integration.

According to this (and some quick research) this should be possible.

If there's interest, I'm willing to put effort in this. Would be great to get some pointers though.

Cheers.

Tabletop is undefined in Internet Explorer 9

I'm getting a SCRIPT 5009: Tabletop is undefined error in IE9.

The following is contained in a script tag just before the closing body tag. Any thoughts?

start();

function start()
{
var url = 'MY_URL_IS_HERE';
Tabletop.init(
{
key: url,
callback: fillBarker,
simpleSheet: true
}
);
}

callback arguments

Is it possible to pass extra arguments to the callback function within the Tabletop.init function?

Select coulmns

Is there a way to only return certain columns?
For example I am interested in just one column in a spreadsheet with 10, so it kinda seems like a waste to select that one column out.
Thanks for the help.