ZK-5516: change the current month with a keyboard, ZK-5517: change the current year with a keyboard

zkdoc/release-note

@@ -2,6 +2,8 @@ ZK 10.0.0
 * Features
   ZK-5221: Show websocket close reason
   ZK-5018: Enhance simplified MVVM syntax
+  ZK-5516: change the current month with a keyboard
+  ZK-5517: change the current year with a keyboard
 
 * Bugs
   ZK-5393: Update ZK jars to jakarta-friendly uploads

zktest/src/main/webapp/test2/F100-ZK-5516.zul

@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+F100-ZK-5516.zul
+
+        Purpose:
+
+        Description:
+
+        History:
+                Sun Dec 10 23:03:30 CST 2023, Created by jamson
+
+Copyright (C) 2023 Potix Corporation. All Rights Reserved.
+-->
+<zk>
+	<label multiline="true">
+		Click [PageUp], check whether it switched to the same date previous month.
+		Click [PageDown], check whether it switched to the same date next month.
+		note : If current date exceed the last date of prev or next month, the date would go to the last day of the month.
+	</label>
+	<calendar/>
+</zk>

zktest/src/main/webapp/test2/F100-ZK-5517.zul

@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+F100-ZK-5517.zul
+
+        Purpose:
+
+        Description:
+
+        History:
+                Fri Dec 08 18:18:11 CST 2023, Created by jamson
+
+Copyright (C) 2023 Potix Corporation. All Rights Reserved.
+-->
+<zk>
+	<label multiline="true">
+		Click [Shift + PageUp], check whether it switched to the same month and date previous year.
+		Click [Shift + PageDown], check whether it switched to the same month and date next year.
+		note : If current date is 2/29 in a leap year, switching the year would go to the last day of February (2/28).
+	</label>
+	<calendar/>
+</zk>

zktest/src/main/webapp/test2/config.properties

@@ -3795,6 +3795,8 @@ F86-ZK-4235.zul=A,E,datefmt,library-property
 ##manually##F100-ZK-4494-1.zul=A,E,Tree,CSS
 ##zats##F100-ZK-5018-command.zul=A,E,MVVM,Syntax,simplified
 ##zats##F100-ZK-5018-syntax-exception.zul=A,E,MVVM,Syntax,simplified
+##zats##F100-ZK-5516.zul=A,E,calendar,month,keyboard
+##zats##F100-ZK-5517.zul=A,E,calendar,year,keyboard
 
 # Complex Test Case
 #

zktest/src/test/java/org/zkoss/zktest/zats/test2/F100_ZK_5516Test.java

@@ -0,0 +1,87 @@
+/* F100_ZK_5516Test.java
+
+        Purpose:
+
+        Description:
+
+        History:
+                Sun Dec 10 23:07:36 CST 2023, Created by jamson
+
+Copyright (C) 2023 Potix Corporation. All Rights Reserved.
+*/
+package org.zkoss.zktest.zats.test2;
+
+import static org.junit.jupiter.api.Assertions.assertEquals;
+
+import org.junit.jupiter.api.Test;
+import org.openqa.selenium.Keys;
+import org.openqa.selenium.interactions.Actions;
+
+import org.zkoss.test.webdriver.ztl.Widget;
+
+public class F100_ZK_5516Test extends F100_ZK_5517Test {
+	int[] toLastDate = new int[] {31, 28, 31, 30, 31, 30 ,31, 31, 30, 31, 30, 31};
+	String[] toMonth = new String[] {"Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"};
+	int date;
+	Widget cld;
+	@Test
+	public void test() {
+		connect();
+
+		click(jq(".z-calendar-selected"));
+		waitResponse();
+
+		Actions actions = getActions();
+		cld = jq("@calendar").toWidget();
+		String month = getMonth(cld);
+		date = getDate();
+
+		actions.keyDown(Keys.PAGE_UP).perform();
+		waitResponse();
+
+		assertEquals(toMonth(month, -1), getMonth(cld));
+		assertEquals(verifyDate(), getDate());
+
+		actions.keyDown(Keys.PAGE_DOWN).perform();
+		waitResponse();
+
+		actions.keyDown(Keys.PAGE_DOWN).perform();
+		waitResponse();
+
+		assertEquals(toMonth(month, 1), getMonth(cld));
+		assertEquals(verifyDate(), getDate());
+
+		actions.keyDown(Keys.PAGE_UP).perform();
+		waitResponse();
+
+		assertEquals(month, getMonth(cld));
+		assertEquals(verifyDate(), getDate());
+	}
+
+	public int toMonthNum(String month) {
+		if ("Jan".equals(month)) return 0;
+		else if ("Feb".equals(month)) return 1;
+		else if ("Mar".equals(month)) return 2;
+		else if ("Apr".equals(month)) return 3;
+		else if ("May".equals(month)) return 4;
+		else if ("Jun".equals(month)) return 5;
+		else if ("Jul".equals(month)) return 6;
+		else if ("Aug".equals(month)) return 7;
+		else if ("Sep".equals(month)) return 8;
+		else if ("Oct".equals(month)) return 9;
+		else if ("Nov".equals(month)) return 10;
+		else return 11;
+	}
+
+	public String toMonth(String month, int offset) {
+		return toMonth[(toMonthNum(month) + offset + 12) % 12];
+	}
+
+	public int verifyDate() {
+		String month = getMonth(cld);
+		int year = getYear(cld),
+			lastDate = (year % 4 == 0) && ("Feb".equals(month)) ? 29 : toLastDate[toMonthNum(month)];
+		date = Math.min(date, lastDate);
+		return date;
+	}
+}

zktest/src/test/java/org/zkoss/zktest/zats/test2/F100_ZK_5517Test.java

@@ -0,0 +1,78 @@
+/* F100_ZK_5517Test.java
+
+        Purpose:
+
+        Description:
+
+        History:
+                Fri Dec 08 18:44:37 CST 2023, Created by jamson
+
+Copyright (C) 2023 Potix Corporation. All Rights Reserved.
+*/
+package org.zkoss.zktest.zats.test2;
+
+import static org.junit.jupiter.api.Assertions.assertEquals;
+
+import org.junit.jupiter.api.Test;
+import org.openqa.selenium.Keys;
+import org.openqa.selenium.interactions.Actions;
+
+import org.zkoss.test.webdriver.WebDriverTestCase;
+import org.zkoss.test.webdriver.ztl.Widget;
+
+public class F100_ZK_5517Test extends WebDriverTestCase {
+	@Test
+	public void test() {
+		connect();
+
+		Actions actions = getActions();
+		Widget cld = jq("@calendar").toWidget();
+		String month = getMonth(cld);
+		int year = getYear(cld),
+			date = getDate();
+
+		click(jq(".z-calendar-selected"));
+		waitResponse();
+
+		if ("Feb".equals(month) && date == 29) {
+			date = 28;
+			actions.keyDown(Keys.ARROW_LEFT).perform();
+		}
+
+		actions.keyDown(Keys.SHIFT).keyDown(Keys.PAGE_UP).perform();
+		waitResponse();
+
+		assertEquals(year, getYear(cld) + 1);
+		assertEquals(month, getMonth(cld));
+		assertEquals(date, getDate());
+
+		actions.keyDown(Keys.SHIFT).keyDown(Keys.PAGE_DOWN).perform();
+		waitResponse();
+
+		actions.keyDown(Keys.SHIFT).keyDown(Keys.PAGE_DOWN).perform();
+		waitResponse();
+
+		assertEquals(year, getYear(cld) - 1);
+		assertEquals(month, getMonth(cld));
+		assertEquals(date, getDate());
+
+		actions.keyDown(Keys.SHIFT).keyDown(Keys.PAGE_UP).perform();
+		waitResponse();
+
+		assertEquals(year, getYear(cld));
+		assertEquals(month, getMonth(cld));
+		assertEquals(date, getDate());
+	}
+
+	public int getYear(Widget calendar) {
+		return Integer.parseInt(calendar.$n("ty").get("innerHTML"));
+	}
+
+	public String getMonth(Widget calendar) {
+		return calendar.$n("tm").get("innerHTML");
+	}
+
+	public int getDate() {
+		return Integer.parseInt(jq(".z-calendar-selected").toElement().get("innerHTML"));
+	}
+}

zul/src/main/resources/web/js/zul/db/Calendar.ts

@@ -675,6 +675,19 @@ export class Calendar extends zul.Widget {
 
 	/** @internal */
 	override doKeyDown_(evt: zk.Event): void {
+
+		const currentView = this._view;
+		if (evt.key === 'PageUp') {
+			// PageUp: prev month ; Shift + PageUp: prev year
+			this._setView(evt.shiftKey ? 'year' : 'month');
+			this._shift(-1);
+		} else if (evt.key === 'PageDown') {
+			// PageDown: next month ; Shift + PageDown: next year
+			this._setView(evt.shiftKey ? 'year' : 'month');
+			this._shift(1);
+		}
+		this._setView(currentView);
+
 		var keyCode = evt.keyCode,
 			ofs = keyCode == 37 ? -1 : keyCode == 39 ? 1 : keyCode == 38 ? -7 : keyCode == 40 ? 7 : 0;
 		if (ofs) {