The Issue:
I Did use the Vuetify Calendar to build up a calendar.
The daily interval in Day View should be different according to business opening times that day.
The logic works for Firefox and Chrome. But not on Safari.
The working example:
Here is a Codepen i build to demonstrate the issue. When clicking on day View and moving between days there are different time ranges within the day. The Pen works on FF and Chrome, but not on Safari.
https://codepen.io/ttezcan/pen/KKzjEMM
This is the main method that changes interval dynamically:
setIntervalByWeekday(weekday) {
console.log(weekday);
if (weekday === 7) {
weekday = 0;
}
if (weekday === -1) {
weekday = 6;
}
this.weekday = weekday;
let start = this.bussiness_hours[weekday]['start'];
let end = this.bussiness_hours[weekday]['end'];
var timeStart = new Date('2020-05-19 ' + start).getHours();
var timeEnd = new Date('2020-05-19 ' + end).getHours();
var duration = timeEnd - timeStart;
this.firstInterval = start;
this.intervalCount = duration;
},
What i tried:
My research showed that the problem in Safari occurs when changing the values for
:first-interval="firstInterval" and
:interval-count="intervalCount"
dynamically.
I tried using computed props to force rerender of component.
I tried calling this.$refs.calendar.checkChange() to force rerender.
Anyone has an idea how to make this work for Safari?
A Vuetify dev had the answer:
new Date('2020-05-19 ' + start).getHours()
Chrome parses that as the system timezone and returns hours in the system timezone. Safari parses it as UTC and return hours in the system timezone. Use luxon or date-fns if you need to do arithmetic on dates.
Thx #KaelWD
Related
I have a family tree website and want to show all events in our family on the current date (Month and Day). So, if today's April 3rd, I want to show all events in our family that occurred on April 3rd.
I've played with creating a table and hiding rows, etc. but the table's too big and it's taking too long. So, I've decided to create a separate .htm file for each day of the year (i.e., todayinhistory-0101.htm, todayinhistory-0102.htm, etc.).
I have a button which, when clicked, is to get the current date in MMDD format and then open the correct file.
I have the script to get the correct filename using the current date in MMDD format, but I can't figure out how to call it and make it work.
Right now, my button looks like this:
<button onclick="location='GetTodayInHistoryFilename()'">
GetTodayInHistoryFilename() is a function I know works. I just can't get the button format right to call it.
Obviously, I'm a novice and would appreciate anyone's help.
In case you're interested, here's GetTodayInHistoryFilename() - which is loaded in the page's header section:
<script type='text/javascript'>
function GetTodayInHistoryFilename()
{
var Today = new Date();
var TodayMonth = Today.getMonth()+1;
var TodayDay = Today.getDate();
if (TodayMonth < 10) { TodayMonth = '0' + String(TodayMonth); } else { TodayMonth = String(TodayMonth); }
if (TodayDay < 10) { TodayDay = '0' + String(TodayDay); } else { TodayDay = String(TodayDay); }
return 'todayinhistory-' + TodayMonth + TodayDay + '.htm';
}
</script>
Thanks in advance.
I'm not 100% sure this is what you're trying to do but I think you want the button click to navigate to another HTML page in which case - you're not far off:
<button onclick="window.location=GetTodayInHistoryFilename()">
Explanation: You're setting the location property of the window object (your browser's top level frame, in this case) to (a new url). You've defined this using your function which is fine. The only mistake you made was to include the function in quotes. This meant that function name was treated as a literal text string rather than an executable function.
You may or may not need to specify window. (the global object) in window.location. I wasn't sure myself but it's nicely answered here: window.location versus just location
So i need to scrap a page like this for example or this and i am using Scrapy + Seleninum to interact with a datepicker calendar.
Basically i need to check for the availabilities of the rooms for each day in a month for example, so my idea was trying to click the not disabled links/dates on the datepicker and check if an error message appears or not for me to know if its available or not.
I have no idea if this is the proper way or even how to do this with this tools. I have been playing around with them but still looks like i am far from a final solution.
Does anyone know how i can tackle this or even provide the code for me to achieve this?
Hi please find the answer below
WebDriver driver = new FirefoxDriver();
driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
driver.manage().window().maximize();
driver.get("https://www.airbnb.pt/rooms/516301?check_in=2016-04-14&guests=1&check_out=2016-04-17");
// selecting firstdate picker -- check in
driver.findElement(By.xpath("//*[#class='col-sm-6']/input")).click();
// note calendar is not completely visible hence to make it visible
// scroll a little bit down
((JavascriptExecutor) driver).executeScript("window.scrollBy(0,200)");
// take all calendar dates inside the list
// here i have update my code to skip stale element exception
List<WebElement> alldates = driver.findElements(By.xpath("//*[#class='ui-datepicker-calendar']/tbody/tr/td/a[contains(#class, 'ui-state-default')]"));
System.out.println("Size is : "+ alldates.size());
// suppose you want to select 27 form the all dates
// keeping it as a parameter
String dateToBeSelected = "19"; // check in
for(int i=0;i<alldates.size();i++){
alldates = driver.findElements(By.xpath("//*[#class='ui-state-default']"));
System.out.println("dates is : " + alldates.get(i).getText());
// selects a check-in date
if( alldates.get(i).getText().equals(dateToBeSelected)){
alldates.get(i).click();
break;
}
}
// on selection of Checkin date check out calender automatically pop ups
System.out.println("--------------------------");
String datetobeselected = "27";
for(int i=0;i<alldates.size();i++){
alldates = driver.findElements(By.xpath("//*[#class='ui-state-default']"));
System.out.println("dates is : " + alldates.get(i).getText());
// selects a check-in date
if( alldates.get(i).getText().equals(datetobeselected)){
alldates.get(i).click();
break;
}
}
// actually after calendar selection whatever text is shown in red color
// i am not sure what is it (sorry only English)
// identify the text with red color is present or not
boolean errorMsg = driver.findElement(By.xpath("//*[#class='panel-body panel-light']/div[2]/p")).isDisplayed();
if(errorMsg){
System.out.println("error msg is displayed");
}else{
System.out.println("error msg is not - displayed");
}
Hope this helps you also note this above example takes check-in and checkout date as parameter if you want code to take non disabled date automatically please feel free to ask i will update my answer.
Using Ektron 9.0 SP2
Is it possible to change the time range for an Ektron WebCalendar in Day view? The displayed time periods are the hours from 8am to 5pm. I would like to know if the range can be changed and, if so, how to apply this change. I looked through the Ektron Web Reference documentation and skimmed through the WebCalendar properties, but could not find anything useful.
Thank you in advance for any input.
I realized that what I was trying to change is a property of the Telerik RadScheduler the Ektron WebCalendar is built upon. With some trial and error, I was able to finally reach the RadSchedular and edit its DayStartTime and DayEndTime properties to change hour range for the WebCalendar's Day View.
Below is the code I used to find the RadScheduler.
//Using a foreach loop through the WebCalendar as I am not sure if the order of its Controls property changes at all, but we want the UpdatePanel as that holds the RadScheduler.
foreach (Control control in uxWebCalendar.Controls)
{
if (control is UpdatePanel)
{
Control subControl = control;
Control subSubControl = subControl.Controls[0];
Telerik.Web.UI.RadScheduler radScheduler = subSubControl.Controls[0] as Telerik.Web.UI.RadScheduler;
//This results makes is to set the start time as 7am
TimeSpan timeStart = new TimeSpan(0, 7, 0, 0, 0);
//To show the 8pm slot, you have to end the time at 9pm
TimeSpan timeEnd = new TimeSpan(0, 21, 0, 0, 0);
radScheduler.DayStartTime = timeStart;
radScheduler.DayEndTime = timeEnd;
break;
}
}
I've got a UIDatePicker in Time mode with an interval of 15 minutes.
Let's say it's 7:22PM. The value that the date picker shows per default is the current time rounded to the next higher/lower value, in this case, it's 7:15PM. If the user interacts with the date picker, the value that's shown is also the value returned. However if there hasn't been any user interaction and I get the time with [UIDatePicker date] the return value is the exact current time, i.e. 7:22 to stick with the example.
Is there any way to always get the value that's actually shown on the date picker instead of the current unrounded time, even if the user hasn't explicitly picked a value?
I've already tried to set the picker manually with [UIDatePicker setDate:[NSDate date]] but that doesn't change the behavior.
I've modified #ima747 's answer for Swift 3/4 and as an extension of UIDatePicker. picker.clampedDate
extension UIDatePicker {
/// Returns the date that reflects the displayed date clamped to the `minuteInterval` of the picker.
/// - note: Adapted from [ima747's](http://stackoverflow.com/users/463183/ima747) answer on [Stack Overflow](http://stackoverflow.com/questions/7504060/uidatepicker-with-15m-interval-but-always-exact-time-as-return-value/42263214#42263214})
public var clampedDate: Date {
let referenceTimeInterval = self.date.timeIntervalSinceReferenceDate
let remainingSeconds = referenceTimeInterval.truncatingRemainder(dividingBy: TimeInterval(minuteInterval*60))
let timeRoundedToInterval = referenceTimeInterval - remainingSeconds
return Date(timeIntervalSinceReferenceDate: timeRoundedToInterval)
}
}
This isn't a perfect solution but it works for me. I've taken it from another post and modified it to accept different values.
- (NSDate*)clampDate:(NSDate *)dt toMinutes:(int)minutes {
int referenceTimeInterval = (int)[dt timeIntervalSinceReferenceDate];
int remainingSeconds = referenceTimeInterval % (minutes*60);
int timeRoundedTo5Minutes = referenceTimeInterval - remainingSeconds;
if(remainingSeconds>((minutes*60)/2)) {/// round up
timeRoundedTo5Minutes = referenceTimeInterval +((minutes*60)-remainingSeconds);
}
return [NSDate dateWithTimeIntervalSinceReferenceDate:(NSTimeInterval)timeRoundedTo5Minutes];
}
Feed it an input date and a minute value (taken from the UIDatePicker.minuteInterval in the case of this thread) and it will return a time clamped to that interval which you can feed to the picker.
#ima747 is right if I've changed date picker's default value then it's working fine and if I've read date from picker control without onChange then it's returning wrong date value.
But I've checked that, date picker control have set default date (current date and may be it use nearest time milliseconds) If I set it to custom date and also set time to any date and 1:00:AM so now my time picker always open with 1:00:AM instead of current time
I have a little project to do in flash and I am new with action script. I am using actionscript 2.0 and I just want to make a alarm app which can ring a sound when the time comes :P.
So I have 2 inputtext's one called alarm_hour and another alarm_min.
So the user enters the hour and the minute when it wants the alarm to ring. I am using Date class to pick the hour and the minute and my checkAlarm function it looks like this:
var my_date:Date = new Date();
var h:Number = my_date.getHours();
var m:Number = my_date.getMinutes();
var mi:String = alarma_minute;
var ora:String = alarma_hour;
if (((ora == h) && (mi == m))){
_root.sunet.start(0, 99);
_root.stare = 'start';
}
sunet its the sound file..
So the problem is that the if statement never activates but I don't know why because I have made a dinamic text and tested the values from ora and hour and mi and m and all are equals... what am I doing wrong?
Thank you!
I have managed to solve the problem by accessing the inputtext variables in this form: "variablename.text" and to do that I've had to change the inputtext instance name to "variablename" and now it works fine :D