hello!
I have a from and to date pickers, and I need the dates between those dates as data, to later be converted in unix time and used in API call. So I need them as individual things. Have not found anything related! Prepopulating data and running checks is not really a good way to do this. My dates can go several years back in time. I can do this with one line of formula in google sheets. How to approach it here?
thank you
Well, you can’t do this on the server (as there are not yet facilities to run JavaScript server-side), but if you can generate the dates in a session (in browser) this can be accomplished with JavaScript (alternatively as a microservice/API on something like webtask.io).
Anyway, really short answer that might help you:
Install Toolkit plug-in as you’ll need Run Javascript and JS to Bubble elements.
Easiest way to do the range to individual dates trick is to have moment and moment-range installed. Include them like this in an HTML element:
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js
"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-range/4.0.1/moment-range.js"></script>
Then you’d execute a Run Javacript with script similar to as follows:
window['moment-range'].extendMoment(moment);
var startDate = "**Some_Dynamic_Date_Thing_from_Bubble_start**";
var endDate = "**Some_Dynamic_Date_Thing_from_Bubble_end**";
const range = moment.range(startDate, endDate);
var dates = Array.from(range.by('days')).map(m => m.toDate());
console.log('DATES: ', dates);
bubble_fn_dates(dates); // send dates array to Bubble //Using a JS to Bubble Element with function call field set as "dates" (a list of dates)
You can do something similar in a webtask – which gives you a server-side type implementation – but is markedly slower due to Bubble API call overhead. (Let me know if that’s something you’re comfortable with and I’d happily share code.)
tl;dr: It’s really stupid that Bubble doesn’t have a Create List of Dates from Date Range type function as it’s trivial to implement and is MUCH NEEDED. You can do this task in browser or as an API call, but that’s a lot of work for something so simple. I wracked my brain on this particular issue for a great deal of time and haven’t come up with better solutions.
Best,
Keith
Hi!
Wow! Comunity really is strong here, thank you!
So I have been using bubble for 4 days, it is my first project and implementing this was high on task list since I have done this inside unity and google sheets with relative ease. I am really surprised to hit such a limitation so soon. It makes me wonder what lies ahead. Since my app is in short calling APIs and saving that data it really is not a good sign.
I have zero knowledge of coding so I will try to use your solution!
What is the type date range all about. One would think this does what I need?
Thank you again!
Greetings
I suspect that (on the backend), the date range type is a moment-range type object. (The “moment.js” library, which I mentioned in my original response, is a Node library that greatly extends and improve JavaScript’s date-time related features. There are two popular extensions to moment, “moment-range”, which provides facilities for manipulating date ranges and and “moment-timezone” which makes dealing with date-time in the context of timezones much easier. It seems fairly obvious to me that moment and those two extensions are used in Bubble.)
In JavaScript terms, a moment-range object is kind of a pseudo-primitive: It has a start date and end date (which are themselves moment/date type objects) and a third value which I believe is a measure of the time between those two points.
As exposed in Bubble, a date range is a primitive which has a start date and an end date (you can think of it as a 2-element array in a way). But since its a primitive, you can have lists of date ranges, etc. There are also a variety of very useful operations that you can perform on date ranges (these are described here: https://bubble.io/reference#Data.Messages.date_range).
One thing that seems to not be exposed in Bubble is an implementation of the “toArray” feature of moment-range (which among many other things can create an array of date-time objects from the range’s start and end points).
This would be exceptionally useful, of course, but there are probably several reasons for not doing so. One thing you might have noticed is that Bubble greatly discourages (either makes impossible or intentionally slows) most types of iteration that might happen on the server. This “feels” a bit frustrating as, of course, there ARE some allowed iterative operations (consider the :sum function you can perform on a list), but there’s nothing quite like the JavaScript “map” operation (call a function / operation on each item in a list).
The main intention here seems to be to keep folks from doing stupid resource-intensive stuff that puts the shared environment at risk of serious performance problems (e.g., infinite loops or for-all-intensive-purposes infinite loops).
Iterative operations ARE allowed in the browser. Repeating lists are basically an example of this, right? However, they are again a bit frustrating as it can be hard (if not impossible) to bring the data a user would see back into Bubble (at least without a bit of scripting).
I guess the way you should think about it at present is like this: The Bubble backend should be seen as the Model (database) and Controller part of an MVC system. But the Controller part is not a general-purpose compute platform.
Using “Make Changes to a List of Things” (or similarly, when one uses the :filter operation by “Advanced” where the condition being evaluated is mathy or otherwise complex), you can iterate over a list of existing things and modify values within them. And those lists can be up to 10,000 items long. However, this isn’t a general purpose array-oriented computing feature because Bubble doesn’t give you a way to (for example) create a NEW list of things (particularly primitives) of an arbitrary size.
That’s basically what YOU need – you need a way to construct an array of individual days. It doesn’t even sound like you need to store those objects. It’s just a temporary value that you are then going to pass off to an API. This sort of thing simply isn’t enabled right now.
(A strange work around for this sort of issue occurs to me: Like, if you could create a list of integers 1 through n, now you have a FOR loop, see? Because you could iterate through that with Make Changes to a List of Things… Perhaps people do this, actually. I could see creating a system object that’s a list of 100 things that has one of every primitive data type in it. You could then use that object to perform almost any type of basic computing looping type of operation 100 steps at a time… hmmm…)
Back to your API for a minute: You don’t say exactly what it is, but one could argue that their interface is fairly poor. If the API in question doesn’t handle discontiguous date ranges, why should it need anything but start and end dates, right? (They should do the mathy or iterative part on THEIR side.) And even if it DOES handle discontiguous date ranges, there should be a contiguous range mode where you just send start and end.
Of course, that doesn’t help YOU and this particular moment…
Anyway, the recent addition of date ranges as a data type was quite welcome. And one of the stated benefits of ranges is that they would help in building reservation/booking type interfaces. That’s all true and it’s all well and good, but not being able to (easily) iterate over a time period (like by day or by hour or what not) makes certain things much harder (and I would argue ultimately more compute-intensive) than they should be.
For example, given a start and end date of a reservation, how is one to compute a rate quote for that reservation without some form of iteration? That is, for each DAY in DATERANGE I need to look up a rate. There’s just no getting around that. And such lookups are really low overhead. But Bubble won’t let you do that, so you have to resort to shenanigans like either:
a. Fire off an API workflow. Trigger some remote API (like a Webtask) that CAN iterate over the dates, pings Bubble multiple times to do the lookups and sends that data back to Bubble. This is just dumb. It works, but not quickly and there’s no way THAT operation is lower overhead than just letting me do it all inside of Bubble.
b. Use the Toolbox (Run JavaScript and JS to Bubble elements) plug-in to do a similar stunt but without calling an API. This is much faster than option (a) but it’s only an option for when there is a live user with an open browser session, right?
Anyway, it seems like Bubble should expand the (controlled) ability to iterate over certain types of lists and date or time-wise iteration (on the scale of < 10,000 items) would be very welcome.
Back to architecture for a second: Bubble is fantastic for building all sorts of nifty web apps, but at a certain level of sophistication or if the app needs to do certain types of computational things, you quickly find yourself in the very modern land of “serverless” apps where various functions of the app are distributed across computing platforms. This is sort of weird since the core concept of Bubble is “build apps without code”.
Ok so I managed to get it working going by your code example so again thank you. I run javascript- then write this to the database as date list and then I write that into a repeating group in which I also do the extract unix time / 1000 rounded to 0 and I had to add +1 hour for that time to be as it should. Now to the charts!
Glad to hear it!
Hi again!
I am having a really annoying issue. While everything works in my browser of choice Chrome, in FireFox the javascript does not execute! I tried it even in samsung browser on my phone and it worked. Has anyone encountered this issue?
L
Perhaps Firefox still disables JS by default. Google enable JavaScript in Firefox I guess…
By default it is on! I tried it on several computers. On windows it only has this problem with firefox, on osx it does not work even in chrome nor firefox.
I even tried Opera and it also does not work!
Fun stuff really 
I also tried several settings in firefox and nothing changed!
EDIT1: So to sum things up. On windows it works only with chrome, on osx it does not work at all.
In firefox I tried several different settings to no effect. It just does not give back the info that chrome on wins does.
Here is a link: https://bubble.io/page?name=index&id=coinoscopy&tab=tabs-1
EDIT2: Well somehow it started working in Opera. Just to add to the confusion:-) `
EDIT3: The only thing that I can think of and I am a complete rookie, is that there are issues with the format of the dates. After reading the errors in the console it seems I would have to define the format (YYYY-MM-DD) so it would not use JS date constructor. That makes sense since there are several posts about JS not working on firefox and working on chrome because of that issue. I do not however know how to do that yet so I can’t really test it.
This part looks weird, are you sure you are matching the expected format of moment.utc?
That was added to use UTC time and I don’t really know if it is written correctly. I am guessing there is too much moment.utc parts 
I will change it back to the original in a moment.
Well he shouldn’t have the stars there. I was just indicating some thing, eh? Also, he may not need the Utc mode. My code was MY CODE. I’m just saying, “you do it SOMETHING like this.” Ones actual use case would vary from mine for sure.
Sorry! It is the first time looking at javascript for me and I really don’t know what I am doing.
Oh sorry @leoncapl009 and @keith , I didn’t read the context of how the stars got there … I was dazzled by too many stars in my eyes.
@leoncapl009 its worth finding out more about the functions you are using : )
https://momentjs.com/docs/
Sure, I am reading about it as we speak. I realize I should learn the basics. tnx
I got it working with getDateArray function! Now it also works in firefox and opera.
I still don’t know what the issue with firefox was before.
Anyway, thanks for a great plugin mishav and for your help keith.
You’re welcome! Glad you got it working! Date/time stuff can be tricky.