diff --git a/package-lock.json b/package-lock.json index 9da663b2..50cf6353 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21,7 +21,7 @@ "@cagov/ds-page-alert": "^2.0.2", "@cagov/ds-page-feedback": "^1.1.0", "@cagov/ds-page-navigation": "^2.1.0", - "@cagov/ds-pagination": "^2.0.0", + "@cagov/ds-pagination": "^2.0.2", "@cagov/ds-site-footer": "^1.1.0", "@cagov/ds-site-header": "^1.1.0", "@cagov/ds-site-navigation": "^2.1.4", @@ -882,9 +882,9 @@ } }, "node_modules/@cagov/ds-pagination": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/@cagov/ds-pagination/-/ds-pagination-2.0.0.tgz", - "integrity": "sha512-7B2dZgsCysl6J78CZ9PBlr9tGJhagigNbeznIdLAl4xqs6LddNrdBFd0W80TuuuFGISH3p7joQ4TY04LUnsgyQ==" + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/@cagov/ds-pagination/-/ds-pagination-2.0.3.tgz", + "integrity": "sha512-KmZ3fRBMy1nywEeIV4FiQJwsd5IDQqddUDTvgSvvWtuPbXN4Xg/GboXs4NCdffkuc0ulgKstrzgC+xCGdEjCaQ==" }, "node_modules/@cagov/ds-site-footer": { "version": "1.1.0", diff --git a/package.json b/package.json index e373e5c8..08623436 100644 --- a/package.json +++ b/package.json @@ -27,7 +27,7 @@ "@cagov/ds-page-alert": "^2.0.2", "@cagov/ds-page-feedback": "^1.1.0", "@cagov/ds-page-navigation": "^2.1.0", - "@cagov/ds-pagination": "^2.0.0", + "@cagov/ds-pagination": "^2.0.2", "@cagov/ds-site-footer": "^1.1.0", "@cagov/ds-site-header": "^1.1.0", "@cagov/ds-site-navigation": "^2.1.4", diff --git a/pages/wordpress-pages/projects-test.html b/pages/wordpress-pages/projects-test.html index 8f35a3c3..64260ef2 100644 --- a/pages/wordpress-pages/projects-test.html +++ b/pages/wordpress-pages/projects-test.html @@ -1,159 +1,157 @@
-

We are a government-to-government department. We drive statewide innovation through human-centered design practices and data-informed decisions. We partner with state departments to build the tools and processes they need to provide equitable and exceptional services to all Californians. Here’s some of the work we have done.

-
- -
-
-
A pond of water split by a peninsula of cracked, dry ground
- -
-

Using data to streamline housing development

- -

The Department of Housing and Community Development (HCD) gets so much data about housing projects in California that it can cause delays due to manual review. The Office of Data and Innovation (ODI) partnered with HCD to build a tool that identifies projects that are eligible for streamlined processes. This helps California build more housing faster.

- -

Read the HCD case study

-
-
- -
-
People in motion at a job fair
- -
-

Unlocking state hiring insights

- -

ODI worked with the Department of Human Resources (CalHR) to make it easier to get data from a key hiring system. We built a modern data pipeline that gives staff self-service access to data. With ODI’s help, what would have been a years-long improvement process took just 4 months.

- -

Read the CalHR case study

-
-
- -
-
A pond of water split by a peninsula of cracked, dry ground
- -
-

Using data to forecast drought in community water outages

- -

ODI worked with the California Division of Drinking Water (DDW) to improve a model that forecasts which water systems will be affected by drought. This will allow communities to fix problems before they happen.

- -

Read the DDW case study

-
-
- -
-
A smiling man holding a happy baby
- -
-

Helping more eligible families enroll in CalWORKs

- -

CalWORKs is a major safety net program. There’s a gap between people eligible for benefits and those who get them. ODI explored why the gap exists. We interviewed applicants to learn what it’s like applying for CalWORKs. We also talked to program staff to hear what it’s like to run the program. We found pain points that stop families from getting the benefits they deserve.

- -

Read the CalWORKs case study

-
-
- -
-
A woman moderating a community meeting. Community members are raising their hands to share their thoughts.
- -
-

Lifting Californians’ voices in toxic substance cleanup project decisions

- -

The Department of Toxic Substances Control (DTSC) oversees cleanup projects across the state. They use comments from the public when deciding how to clean up sites. Most projects get only a few comments. DTSC asked ODI to explore how to reach people who don’t usually comment. ODI ran pilots to test new ways of reaching Californians. After making a few key changes, we got 600% more comments.

- -

Read the DTSC case study

-
-
- -
-
A woman sitting in a living room with a laptop in front of her, looking at you
- -
-

Getting compensation to more California crime victims

- -

California Victim Compensation Board (CalVCB) noticed a puzzling trend. Despite a rise in violent crimes, fewer victims applied for compensation. CalVCB asked ODI to find out why. Their goal was to get more applications. For 6 weeks, ODI talked with victims and those who support them. We used this research and best practices in design to find ways to make it easier to apply.

- -

Read the CalVCB case study

-
-
- -
-
Nurse waving to a patient at a drive-through COVID-19 vaccine site
- -
-

Vaccine sentiment analytics

- -

When supplies were limited, officials wanted to get vaccines in arms fast. With equity as a top concern, we built a vaccine sentiment model to send limited resources where they were most needed. This model used the Healthy Places Index and digital surveys on the state’s most-visited websites. We found areas with low vaccination rates, but high interest in getting vaccinated. This resulted in more equitable distribution of vaccines across California.

-
-
- -
-
Person holding a phone showing the California COVID-19 website
- -
-

covid19.ca.gov

- -

Californians needed a trusted resource for information during the pandemic. We launched the first version of covid19.ca.gov in 5 days to be a source of truth. It showed the state what a best practice website could look like, even though we made it in the middle of a crisis. Over the next 2 years, we made dozens of major changes based on user feedback. One major update was a new data dashboard delivery method. This helped charts perform better on all devices. We reduced load times from 70 seconds to 4. Our innovations made the site one of the fastest and most accessible websites on CA.gov.

-
-
- -
-
Person walking through a whiteboard showing the design process
- -
-

California Design System

- -

The California Design System solves common website problems. Its reusable components and patterns make state websites more consistent. Real world testing allows departments to use them with confidence. Code comes from past projects like:

- -
    -
  • alpha.ca.gov
  • - -
  • covid19.ca.gov
  • - -
  • cannabis.ca.gov
  • - -
  • drought.ca.gov
  • -
- -

Feedback from the public drives improvements. Every time we update, we test for performance and accessibility. Teams can upgrade components on their own to fit their needs. We launched the Design System in partnership with the California Department of Technology (CDT). We continue to collaborate with CDT. This will promote these best practices across the state.

-
-
- -
-
Person holding a phone showing the page feedback form on the California Department of Cannabis Control website
- -
-

Page feedback

- -

You can’t improve services if you don’t know what people need. The page feedback tool lets the public share their thoughts with the teams who serve them. We created it for covid19.ca.gov. It’s now on several state websites.

-
-
- -
-
Person using a braille reading device on a computer
- -
-

Accessibility and performance

- -

At least 10% of Californians have some form of disability. We go beyond WCAG standards to design services that work better for everyone. We write at a grade 6 reading levels so it’s easier for everyone to understand our content. We make sure our services work well on most devices, not just new smartphones.

-
-
-
- -
-

How we choose projects

- -

Our evaluation criteria considers things like:

- - - -

If you’re interested in working with ODI, we’d love to hear from you.

-
+

We are a government-to-government department. We drive statewide innovation through human-centered design practices and data-informed decisions. We partner with state departments to build the tools and processes they need to provide equitable and exceptional services to all Californians. Here’s some of the work we have done.

+ + +
+ +
+
People in motion at a job fair
+ +
+

Unlocking state hiring insights

+ +

The Office of Data and Innovation (ODI) worked with the Department of Human Resources (CalHR) to make it easier to get data from a key hiring system. We built a modern data pipeline that gives staff self-service access to data. With ODI’s help, what would have been a years-long improvement process took just 4 months.

+ +

Read the CalHR case study

+
+
+
+
A pond of water split by a peninsula of cracked, dry ground
+ +
+

Using data to forecast drought in community water outages

+ +

ODI worked with the California Division of Drinking Water (DDW) to improve a model that forecasts which water systems will be affected by drought. This will allow communities to fix problems before they happen.

+ +

Read the DDW case study

+
+
+ +
+
A smiling man holding a happy baby
+ +
+

Helping more eligible families enroll in CalWORKs

+ +

CalWORKs is a major safety net program. There’s a gap between people eligible for benefits and those who get them. ODI explored why the gap exists. We interviewed applicants to learn what it’s like applying for CalWORKs. We also talked to program staff to hear what it’s like to run the program. We found pain points that stop families from getting the benefits they deserve.

+ +

Read the CalWORKs case study

+
+
+ +
+
A woman moderating a community meeting. Community members are raising their hands to share their thoughts.
+ +
+

Lifting Californians’ voices in toxic substance cleanup project decisions

+ +

The Department of Toxic Substances Control (DTSC) oversees cleanup projects across the state. They use comments from the public when deciding how to clean up sites. Most projects get only a few comments. DTSC asked ODI to explore how to reach people who don’t usually comment. ODI ran pilots to test new ways of reaching Californians. After making a few key changes, we got 600% more comments.

+ +

Read the DTSC case study

+
+
+ +
+
A woman sitting in a living room with a laptop in front of her, looking at you
+ +
+

Getting compensation to more California crime victims

+ +

California Victim Compensation Board (CalVCB) noticed a puzzling trend. Despite a rise in violent crimes, fewer victims applied for compensation. CalVCB asked ODI to find out why. Their goal was to get more applications. For 6 weeks, ODI talked with victims and those who support them. We used this research and best practices in design to find ways to make it easier to apply.

+ +

Read the CalVCB case study

+
+
+ +
+
Nurse waving to a patient at a drive-through COVID-19 vaccine site
+ +
+

Vaccine sentiment analytics

+ +

When supplies were limited, officials wanted to get vaccines in arms fast. With equity as a top concern, we built a vaccine sentiment model to send limited resources where they were most needed. This model used the Healthy Places Index and digital surveys on the state’s most-visited websites. We found areas with low vaccination rates, but high interest in getting vaccinated. This resulted in more equitable distribution of vaccines across California.

+
+
+ +
+
Person holding a phone showing the California COVID-19 website
+ +
+

covid19.ca.gov

+ +

Californians needed a trusted resource for information during the pandemic. We launched the first version of covid19.ca.gov in 5 days to be a source of truth. It showed the state what a best practice website could look like, even though we made it in the middle of a crisis. Over the next 2 years, we made dozens of major changes based on user feedback. One major update was a new data dashboard delivery method. This helped charts perform better on all devices. We reduced load times from 70 seconds to 4. Our innovations made the site one of the fastest and most accessible websites on CA.gov.

+
+
+ +
+
Person walking through a whiteboard showing the design process
+ +
+

California Design System

+ +

The California Design System solves common website problems. Its reusable components and patterns make state websites more consistent. Real world testing allows departments to use them with confidence. Code comes from past projects like:

+ +
    +
  • alpha.ca.gov
  • + +
  • covid19.ca.gov
  • + +
  • cannabis.ca.gov
  • + +
  • drought.ca.gov
  • +
+ +

Feedback from the public drives improvements. Every time we update, we test for performance and accessibility. Teams can upgrade components on their own to fit their needs. We launched the Design System in partnership with the California Department of Technology (CDT). We continue to collaborate with CDT. This will promote these best practices across the state.

+
+
+ +
+
Person holding a phone showing the page feedback form on the California Department of Cannabis Control website
+ +
+

Page feedback

+ +

You can’t improve services if you don’t know what people need. The page feedback tool lets the public share their thoughts with the teams who serve them. We created it for covid19.ca.gov. It’s now on several state websites.

+
+
+ +
+
Person using a braille reading device on a computer
+ +
+

Accessibility and performance

+ +

At least 10% of Californians have some form of disability. We go beyond WCAG standards to design services that work better for everyone. We write at a grade 6 reading levels so it’s easier for everyone to understand our content. We make sure our services work well on most devices, not just new smartphones.

+
+
+ + + +
+ + +
+ +
+ + +
+

How we choose projects

+ +

Our evaluation criteria considers things like:

+ +
    +
  • Is this service critical to the lives of Californians?
  • + +
  • Does it impact large or underserved populations?
  • + +
  • How many state entities are involved in the service?
  • + +
  • Can our work on this service be applied to other services?
  • + +
  • What previous efforts can we build on?
  • +
+ +

If you’re interested in working with ODI, we’d love to hear from you.

+
+ \ No newline at end of file diff --git a/src/js/cagov-paginator.js b/src/js/cagov-paginator.js new file mode 100644 index 00000000..e4ec8dcf --- /dev/null +++ b/src/js/cagov-paginator.js @@ -0,0 +1,43 @@ +import '@cagov/ds-pagination'; + +// cagov-paginator +class CAGovPaginator extends HTMLElement { + connectedCallback() { + // initial set up -- pull data and determine # of pages + // + this.pagedContainerSelector = this.getAttribute('data-paged-container'); + this.pagedBlockSelector = this.getAttribute('data-paged-block'); + this.perPage = parseInt(this.getAttribute('data-per-page')); + console.log("pagedContainer",this.pagedContainerSelector); + console.log("pagedBlock",this.pagedBlockSelector); + this.pagedContainer = document.querySelector(this.pagedContainerSelector); + this.pagedBlocks = this.pagedContainer.querySelectorAll(this.pagedBlockSelector); + console.log("number blocks",this.pagedBlocks.length); + this.nbrPages = Math.ceil(this.pagedBlocks.length / this.perPage); + this.currentPage = 1; // !!! pull from URL + console.log("nbrPages",this.nbrPages); + + if(document.readyState === 'complete') { + setTimeout(() => { + this.drawPaginator(); + }, 10) + } else { + window.addEventListener("load", this.drawPaginator.bind(this)); + } + + } + + drawPaginator() { + // this.pagedContainer = document.querySelector(this.pagedContainerSelector); + // this.pagedBlocks = this.pagedContainer.querySelectorAll(this.pagedBlockSelector); + // console.log("number blocks",this.pagedBlocks.length); + + + var markup = ``; + this.innerHTML = markup; + } +} + +window.customElements.define("cagov-paginator", CAGovPaginator); + + diff --git a/src/js/index.js b/src/js/index.js index a4c538f9..cfd9b382 100644 --- a/src/js/index.js +++ b/src/js/index.js @@ -3,3 +3,4 @@ import '@cagov/ds-page-feedback'; import '@cagov/ds-page-navigation'; import './cagov-connector-lines.js'; import './ga-tracking.js'; +import './cagov-paginator.js';