Resource Library
Requires
Knowledge of Vue.js and Taco WordPress
Usage
Simply require resource-library and create a new instance to use. See sample/news-articles-sample.vue for an example implementation for news articles in single file Vue format. sample/news-article-sample.html contains an example of how to instantiate the Resource Library in HTML.
Ideally, all manupulation of the Resource Library will occur within Vue, but it is also possible to interact with it using external controls. sample/news-articles-sample.js contains several examples of how to communicate from the Vue instance to an external element using triggerRootElement(), as well as how to communicate from an external element back to the Vue instance.
Below is the API documentation to use within the Vue instance.
ResourceLibrary Class Documentation
Vue.js Resource Library for Taco WordPress
-
ResourceLibrary
-
~ResourceLibrary :
object -
~ResourceLibrary :
object -
~ResourceLibrary :
object - ~afterCreated()
- ~onInitialLoad()
- ~onParamsChange()
- ~selectPage(page, callback)
- ~setSearchTerms(search, callback)
- ~resetTerms(taxonomy, callback)
- ~addTerms(taxonomy, terms, callback)
- ~removeTerms(taxonomy, terms, callback)
- ~setTerms(taxonomy, terms, callback)
- ~joinTerms(item, taxonomy, separator)
- ~setOrder(order, callback)
- ~setOrderBy(orderby, callback)
- ~selectOrderBy(orderby, default_order, callback)
-
~isOrderedBy(orderby, order) ⇒
boolean - ~toggleOrder()
- ~setMetaFilter(field, value)
- ~removeMetaFilter(field)
- ~clearMetaFilters()
-
~initialParams() ⇒
Object - ~reset()
- ~triggerRootEvent(event, args)
-
~serializeParams(params) ⇒
string -
~unserializeParams(param_string) ⇒
Object
-
~ResourceLibrary :
ResourceLibrary~ResourceLibrary : object
Kind: inner namespace of ResourceLibrary
Properties
| Name | Type | Description |
|---|---|---|
| props | Object |
The initial properties |
| props.ver | number |
Update to invalidate cache |
| props.post_type | string |
The type of posts to query |
| props.per_page | number |
Number of results per page |
| props.meta_fields | string |
Meta fields to include |
| props.initial_page | string |
The initial page of results to load |
| props.initial_search | string |
The initial search terms |
| props.initial_order | string |
The initial order direction |
| props.initial_orderby | string |
The initial field to order on |
| props.initial_taxonomies | Object |
The initial taxonomies available to filter on. You must pass an empty array or inital data for each taxonomy to enable it on the instance |
| props.initial_meta_query | Object |
The initial meta query |
ResourceLibrary~ResourceLibrary : object
Kind: inner namespace of ResourceLibrary
Properties
| Name | Type | Description |
|---|---|---|
| resources | Array.<Object> |
Resources processes the raw REST response and delivers it in a useful way to the front end. This matches the properties that are available in WordPress from getPost() with a few extra convenience properties |
| resources.getFeaturedImage(size) | function |
Get the featured image at the requested size name (e.g. full, medium). This must be defined in WordPress |
| resources.terms | Array.<Array.<Object>> |
Convenience access for taxonomy terms. The outer array is indexed by taxonomy, and the inner array contains the terms on this |
ResourceLibrary~ResourceLibrary : object
Kind: inner namespace of ResourceLibrary
Properties
| Name | Type | Description |
|---|---|---|
| pages | Array.<string> |
An array of pagination data, including ellipses. Always show 9 pages and insert ellipses in the correct spot. |
ResourceLibrary~afterCreated()
Override in order to call method after component is created
Kind: inner method of ResourceLibrary
ResourceLibrary~onInitialLoad()
Override in order to call method on initial load
Kind: inner method of ResourceLibrary
ResourceLibrary~onParamsChange()
Override in order to call method after params change but not on initial load
Kind: inner method of ResourceLibrary
ResourceLibrary~selectPage(page, callback)
Select which page of results to display
Kind: inner method of ResourceLibrary
| Param | Type | Description |
|---|---|---|
| page | number |
The page number |
| callback | function |
ResourceLibrary~setSearchTerms(search, callback)
Set search terms
Kind: inner method of ResourceLibrary
| Param | Type | Description |
|---|---|---|
| search | string |
Search terms |
| callback | function |
ResourceLibrary~resetTerms(taxonomy, callback)
Reset taxonomy terms
Kind: inner method of ResourceLibrary
| Param | Type | Description |
|---|---|---|
| taxonomy | string |
The taxonomy to use |
| callback | function |
ResourceLibrary~addTerms(taxonomy, terms, callback)
Add taxonomy terms
Kind: inner method of ResourceLibrary
| Param | Type | Description |
|---|---|---|
| taxonomy | string |
The taxonomy to use |
| terms |
integer | Array.<number>
|
The ID of the taxonomy to add |
| callback | function |
ResourceLibrary~removeTerms(taxonomy, terms, callback)
Remove taxonomy terms
Kind: inner method of ResourceLibrary
| Param | Type | Description |
|---|---|---|
| taxonomy | string |
The taxonomy to use |
| terms |
number | Array.<number>
|
The ID of the taxonomy to remove |
| callback | function |
ResourceLibrary~setTerms(taxonomy, terms, callback)
Set taxonomy terms. This overwrites any current taxonomy temms.
Kind: inner method of ResourceLibrary
| Param | Type | Description |
|---|---|---|
| taxonomy | string |
The taxonomy to use |
| terms |
number | Array.<number>
|
The ID of the taxonomy to remove |
| callback | function |
ResourceLibrary~joinTerms(item, taxonomy, separator)
Helper function to join taxonomy terms into a string to display on the front end
Kind: inner method of ResourceLibrary
| Param | Type | Description |
|---|---|---|
| item | Object |
The item to join terms from |
| taxonomy | string |
The taxonomy to use |
| separator | string |
The separator to use |
ResourceLibrary~setOrder(order, callback)
Set whether to order results in ascending or descending order
Kind: inner method of ResourceLibrary
| Param | Type | Description |
|---|---|---|
| order | string |
Order direction. One of "asc" or "desc" |
| callback | function |
ResourceLibrary~setOrderBy(orderby, callback)
Set the field to order results by
Kind: inner method of ResourceLibrary
| Param | Type | Description |
|---|---|---|
| orderby | string |
The field to order by |
| callback | function |
ResourceLibrary~selectOrderBy(orderby, default_order, callback)
Convenience method to select an orderby and set the appropriate order, or toggle the order if already selected.
Kind: inner method of ResourceLibrary
| Param | Type | Description |
|---|---|---|
| orderby | string |
The field to order by |
| default_order | string |
Order direction. One of "asc" or "desc". This will be used to sort results if the order has not been explicitly set. |
| callback | function |
ResourceLibrary~isOrderedBy(orderby, order) ⇒ boolean
Convenience method to see what we're ordered by in order to deal with postmeta
Kind: inner method of ResourceLibrary
Returns: boolean - Whether or not results are currently ordered by orderby, and sorted in the order direction
| Param | Type | Description |
|---|---|---|
| orderby | string |
The field to order by |
| order | string |
The direction to order in |
ResourceLibrary~toggleOrder()
Toggle the order direction from asc to desc or from desc to asc
Kind: inner method of ResourceLibrary
ResourceLibrary~setMetaFilter(field, value)
Set a filter on a meta-value. Currently only supports one field value per meta value.
Kind: inner method of ResourceLibrary
| Param | Type | Description |
|---|---|---|
| field | string |
The meta field to set the filter on |
| value | string |
The value to filter on |
ResourceLibrary~removeMetaFilter(field)
Remove filters on a meta field
Kind: inner method of ResourceLibrary
| Param | Type | Description |
|---|---|---|
| field | string |
The meta field to delete the filter on |
ResourceLibrary~clearMetaFilters()
Clear all meta filters
Kind: inner method of ResourceLibrary
ResourceLibrary~initialParams() ⇒ Object
Get the params that the resource library was initialized with
Kind: inner method of ResourceLibrary
Returns: Object - Object of initial values
ResourceLibrary~reset()
Reset params to their initial values
Kind: inner method of ResourceLibrary
ResourceLibrary~triggerRootEvent(event, args)
In case you need to communicate with something outside of Vue, call this to trigger an event on the Vue root element. Attach a function to the Vue root element to then interact with the function. The args will be passed to the "detail" arg in the function
Kind: inner method of ResourceLibrary
| Param | Type | Description |
|---|---|---|
| event | string |
The event type to trigger |
| args | string |
The args to pass to the triggered function |
ResourceLibrary~serializeParams(params) ⇒ string
Serialize URL params
Kind: inner method of ResourceLibrary
Returns: string - A URL param string (e.g. param1=value1¶m2=value2)
| Param | Type | Description |
|---|---|---|
| params | Object |
An object of key:value pairs corresponding to the URL params |
ResourceLibrary~unserializeParams(param_string) ⇒ Object
Unserialize URL params to an object
Kind: inner method of ResourceLibrary
Returns: Object - An object with key:value pairs corresponding to the URL params
| Param | Type | Description |
|---|---|---|
| param_string | string |
A URL param string (e.g. param1=value1¶m2=value2) |