\r\n {\r\n searchFields.fields.filter(x => x.sortable && !x.hideField).map((element, index) => {\r\n let buttonStyle = (element.isBeingSorted) ? \"primary\" : \"default\";\r\n return (\r\n \r\n )\r\n })\r\n }\r\n
Reduced!
\r\n}\r\n\r\nfunction NewButton(elementProps) {\r\n const {classes} = elementProps;\r\n return New listing
\r\n}\r\n\r\nfunction SoldButton(elementProps) {\r\n const {classes} = elementProps;\r\n return Sold
\r\n}\r\n\r\nfunction PrintButton(elementProps) {\r\n const {classes} = elementProps;\r\n if (Settings.showPrintButton) {\r\n return window.print()} className={classes.printButton}>{Settings.printButtonText}\r\n } else {\r\n return \r\n
\r\n {price}\r\n {extraFeatures} \r\n {newButton}{reducedButton}{soldButton}\r\n {distance} \r\n
\r\n )\r\n}\r\n\r\nexport default withStyles(styles)(SearchResultHighlight);","import React from \"react\";\r\nimport Grid from '@material-ui/core/Grid';\r\nimport Typography from \"@material-ui/core/Typography\";\r\nimport Helpers from \"../Utils/Helpers.js\";\r\nimport Hidden from '@material-ui/core/Hidden';\r\nimport {Settings} from '../Utils/Settings.js';\r\nimport { Link } from \"react-router-dom\";\r\n\r\nimport SearchResultThumbnail from './SearchResultThumbnail.js';\r\nimport SearchResultsHighlight from './SearchResultHighlight.js';\r\n\r\nfunction SearchResultRow(elementProps) {\r\n\r\n const {element, index, inventoryType, classes} = elementProps;\r\n\r\n let description = element.description.replace(/<[^>]*>/g, \"\");\r\n let descriptionTrimmed = Helpers.trimAtNextWhitespace(description, 300);\r\n let basePath = \"\";\r\n if (inventoryType === Settings.inventoryTypes.TRAILER) {\r\n basePath = \"/trailer\"\r\n } else if (inventoryType === Settings.inventoryTypes.CARGO) {\r\n basePath = \"/cargo\"\r\n } else if (inventoryType === Settings.inventoryTypes.PART) {\r\n basePath = \"/part\"\r\n } else if (inventoryType === Settings.inventoryTypes.TRUCK) {\r\n basePath = \"/truck\"\r\n } else if (inventoryType === Settings.inventoryTypes.INVENTORY) {\r\n basePath = \"/listing\"\r\n }\r\n\r\n const inventoryLink = basePath + \"/details/\" + element.id + \"/\" + Helpers.getSeoFriendlyName(element.title);\r\n\r\n return(\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n {pageTitle} \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {pageTitle} \r\n \r\n \r\n \r\n \r\n \r\n \r\n {price.length !== null && {price} } {reducedButton}{soldButton}\r\n \r\n Mfg: {details.c_manu[0]}
\r\n Year: {details.c_year[0]}
\r\n Horses: {details.c_horses[0]}
\r\n Model: {details.c_model[0]}
\r\n New: {details.c_new[0]}
\r\n Living Quarters: {details.c_liv[0]}
\r\n Location: {details.c_con_city[0]}, {details.c_con_st[0]}
\r\n Stock: {details.c_stock[0]}
\r\n {details.c_con_e[0].length > 0 &&Email: {details.c_con_e[0]}
}\r\n {details.c_con_ph[0].length > 0 && Phone: {details.c_con_ph[0]}
}\r\n {details.C_con_phtf[0].length > 0 && Toll-Free: {details.C_con_phtf[0]}
}\r\n \r\n\r\n \r\n \r\n \r\n {video}\r\n 
\r\n \r\n\r\n \r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default (DetailsTrailer);\r\n\r\n","import React, {Component} from 'react';\r\nimport {Settings} from \"../Utils/Settings\";\r\nimport ImageGallery from 'react-image-gallery';\r\nimport \"react-image-gallery/styles/css/image-gallery.css\";\r\nimport Grid from '@material-ui/core/Grid';\r\nimport {Helmet} from \"react-helmet\";\r\nimport Typography from \"@material-ui/core/es/Typography/Typography\";\r\nimport Helpers from \"../Utils/Helpers\";\r\nimport Card from '@material-ui/core/Card';\r\nimport ResponsiveEmbed from \"react-responsive-embed\";\r\nimport Button from \"@material-ui/core/Button\";\r\n\r\nimport {\r\n FacebookShareButton,\r\n TwitterShareButton,\r\n PinterestShareButton,\r\n EmailShareButton,\r\n} from 'react-share';\r\n\r\nimport {\r\n FacebookIcon,\r\n TwitterIcon,\r\n PinterestIcon,\r\n EmailIcon,\r\n} from 'react-share';\r\n\r\nimport { Link } from \"react-router-dom\"\r\nimport {ReducedButton, SoldButton, PrintButton} from \"./Buttons\";\r\n\r\nclass DetailsCargo extends Component {\r\n\r\n render() {\r\n\r\n const details = this.props.searchDetailsRecord;\r\n\r\n if (!details) {\r\n return \"\";\r\n }\r\n\r\n let images = [];\r\n let firstImage = \"\";\r\n\r\n for (var index = 1; index <= 30; index++) {\r\n let image = details[\"IMG\" + index][0];\r\n let thumbnail = details[\"IMGTHUMB\" + index][0];\r\n let caption = details[\"COM\" + index][0];\r\n if (image && image.length > 0) {\r\n if (firstImage.length === 0) {\r\n firstImage = image;\r\n }\r\n\r\n images.push({\r\n original: image,\r\n thumbnail: thumbnail,\r\n description: caption\r\n });\r\n }\r\n }\r\n\r\n let normalPrice = parseFloat(details.ct_price[0]).toFixed(0);\r\n\r\n let pageTitle = details.ct_year[0] + \" \" + details.ct_manu[0] + \" \" + details.ct_model[0];\r\n let pageCanonicalUrl = details.URL[0];\r\n\r\n let videoUrl = Helpers.getVideoEmbedUrl(details.ct_videourl[0]);\r\n let video =(videoUrl) ?\r\n \r\n Year: {details.c_year[0]}
\r\n Horses: {details.c_horses[0]}
\r\n Model: {details.c_model[0]}
\r\n New: {details.c_new[0]}
\r\n Living Quarters: {details.c_liv[0]}
\r\n Location: {details.c_con_city[0]}, {details.c_con_st[0]}
\r\n Stock: {details.c_stock[0]}
\r\n {details.c_con_e[0].length > 0 &&
\r\n \r\n \r\n {pageTitle} \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {pageTitle} \r\n \r\n \r\n \r\n \r\n \r\n \r\n ${Helpers.formatMoney(normalPrice)}
{reducedButton}{soldButton}\r\n \r\n Mfg: {details.ct_manu[0]}
\r\n Model: {details.ct_model[0]}
\r\n Type: {details.ct_type[0]}
\r\n Year: {details.ct_year[0]}
\r\n New: {details.ct_new[0]}
\r\n Pull: {details.ct_pull}
\r\n Location: {details.ct_city[0]}, {details.ct_st[0]}
\r\n Stock: {details.ct_stock[0]}
\r\n {details.ct_email[0].length > 0 &&Email: {details.ct_email[0]}
}\r\n {details.ct_phone[0].length > 0 && Phone: {details.ct_phone[0]}
}\r\n {details.ct_phonetf[0].length > 0 && Toll-Free: {details.ct_phonetf}
}\r\n \r\n\r\n \r\n \r\n \r\n {video}\r\n Prices do not include tax, license, or dealer handling fees. We believe the information on this site to be accurate. Any errors or discrepancies are unintentional. Please verify all information prior to investment. \r\n \r\n\r\n \r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default (DetailsCargo);\r\n\r\n","import React, {Component} from 'react';\r\nimport {Settings} from \"../Utils/Settings\";\r\nimport ImageGallery from 'react-image-gallery';\r\nimport \"react-image-gallery/styles/css/image-gallery.css\";\r\nimport Grid from '@material-ui/core/Grid';\r\nimport {Helmet} from \"react-helmet\";\r\nimport Typography from \"@material-ui/core/es/Typography/Typography\";\r\nimport Helpers from \"../Utils/Helpers\";\r\nimport Card from '@material-ui/core/Card';\r\nimport Button from \"@material-ui/core/Button\";\r\nimport ResponsiveEmbed from \"react-responsive-embed\";\r\n\r\nimport {\r\n FacebookShareButton,\r\n TwitterShareButton,\r\n PinterestShareButton,\r\n EmailShareButton,\r\n} from 'react-share';\r\n\r\nimport {\r\n FacebookIcon,\r\n TwitterIcon,\r\n PinterestIcon,\r\n EmailIcon,\r\n} from 'react-share';\r\n\r\nimport { Link } from \"react-router-dom\"\r\nimport {ReducedButton, SoldButton, PrintButton} from \"./Buttons\";\r\n\r\nclass DetailsTruck extends Component {\r\n\r\n render() {\r\n\r\n const details = this.props.searchDetailsRecord;\r\n\r\n if (!details) {\r\n return \"\";\r\n }\r\n\r\n let images = [];\r\n let firstImage = \"\";\r\n\r\n for (let index = 1; index <= 10; index++) {\r\n let image = details[\"t_xpath\" + index][0];\r\n let thumbnail = details[\"t_xpathth\" + index][0];\r\n let caption = details[\"t_com\" + index][0];\r\n if (image && image.length > 0) {\r\n if (firstImage.length === 0) {\r\n firstImage = image;\r\n }\r\n\r\n images.push({\r\n original: image,\r\n thumbnail: thumbnail,\r\n description: caption\r\n });\r\n }\r\n }\r\n\r\n let normalPrice = parseFloat(details.t_price[0]).toFixed(0);\r\n\r\n let pageTitle = details.t_year[0] + \" \" + details.t_make[0] + \" \" + details.t_model[0];\r\n let pageCanonicalUrl = details.URL[0];\r\n\r\n let trackingImage = \"https://dashboard.equinemediaworld.com/Listing/Impression?lt=\" + Settings.inventoryTypes.TRUCK + \"&id=\" + details.t_id[0];\r\n let videoUrl = Helpers.getVideoEmbedUrl(details.t_videolink[0]);\r\n let video =(videoUrl) ?\r\n \r\n Model: {details.ct_model[0]}
\r\n Type: {details.ct_type[0]}
\r\n Year: {details.ct_year[0]}
\r\n New: {details.ct_new[0]}
\r\n Pull: {details.ct_pull}
\r\n Location: {details.ct_city[0]}, {details.ct_st[0]}
\r\n Stock: {details.ct_stock[0]}
\r\n {details.ct_email[0].length > 0 &&
\r\n \r\n \r\n {pageTitle} \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {pageTitle} \r\n \r\n \r\n \r\n \r\n \r\n \r\n {Helpers.formatMoney(normalPrice)}
{reducedButton}{soldButton}\r\n \r\n Mfg: {details.t_make[0]}
\r\n Model: {details.t_model[0]}
\r\n Mileage: {details.t_mileage[0]}
\r\n Engine: {details.t_engine[0]}
\r\n Drive: {details.t_drive[0]}
\r\n Dually: {details.t_dually[0]}
\r\n New: {details.t_new[0]}
\r\n Location: {details.t_city[0]}, {details.t_state[0]}
\r\n Stock: {details.t_stock[0]}
\r\n {details.t_email[0].length > 0 &&Email: {details.t_email[0]}
}\r\n {details.t_phone[0].length > 0 && Phone: {details.t_phone[0]}
}\r\n {details.t_fax[0].length > 0 && Fax: {details.t_fax[0]}
}\r\n {details.t_cell[0].length > 0 && Fax: {details.t_cell[0]}
}\r\n \r\n\r\n \r\n \r\n \r\n {video}\r\n \r\n\r\n \r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default (DetailsTruck);\r\n\r\n","import React, {Component} from 'react';\r\nimport {Settings} from \"../Utils/Settings\";\r\nimport ImageGallery from 'react-image-gallery';\r\nimport \"react-image-gallery/styles/css/image-gallery.css\";\r\nimport Grid from '@material-ui/core/Grid';\r\nimport {Helmet} from \"react-helmet\";\r\nimport Typography from \"@material-ui/core/es/Typography/Typography\";\r\nimport Helpers from \"../Utils/Helpers\";\r\nimport Card from '@material-ui/core/Card';\r\nimport Button from \"@material-ui/core/Button\";\r\n\r\nimport {\r\n FacebookShareButton,\r\n TwitterShareButton,\r\n PinterestShareButton,\r\n EmailShareButton,\r\n} from 'react-share';\r\n\r\nimport {\r\n FacebookIcon,\r\n TwitterIcon,\r\n PinterestIcon,\r\n EmailIcon,\r\n} from 'react-share';\r\n\r\nimport { Link } from \"react-router-dom\"\r\nimport { PrintButton} from \"./Buttons\";\r\n\r\nclass DetailsPart extends Component {\r\n\r\n render() {\r\n\r\n const details = this.props.searchDetailsRecord;\r\n\r\n if (!details) {\r\n return \"\";\r\n }\r\n\r\n let images = [];\r\n let firstImage = \"\";\r\n\r\n for (let index = 1; index <= 10; index++) {\r\n let image = details[\"t_xpath\" + index][0];\r\n let thumbnail = details[\"t_xpathth\" + index][0];\r\n let caption = details[\"t_com\" + index][0];\r\n if (image && image.length > 0) {\r\n if (firstImage.length === 0) {\r\n firstImage = image;\r\n }\r\n\r\n images.push({\r\n original: image,\r\n thumbnail: thumbnail,\r\n description: caption\r\n });\r\n }\r\n }\r\n\r\n let normalPrice = parseFloat(details.t_price[0]).toFixed(0);\r\n\r\n let pageTitle = details.t_year[0] + \" \" + details.t_make[0] + \" \" + details.t_model[0];\r\n let pageCanonicalUrl = details.URL[0];\r\n\r\n let trackingImage = \"https://dashboard.equinemediaworld.com/Listing/Impression?lt=\" + Settings.inventoryTypes.TRUCK + \"&id=\" + details.t_id[0];\r\n let shareUrl = Settings.socialShareUseCanonicalUrls ? pageCanonicalUrl : window.location.href;\r\n\r\n return (\r\n \r\n Model: {details.t_model[0]}
\r\n Mileage: {details.t_mileage[0]}
\r\n Engine: {details.t_engine[0]}
\r\n Drive: {details.t_drive[0]}
\r\n Dually: {details.t_dually[0]}
\r\n New: {details.t_new[0]}
\r\n Location: {details.t_city[0]}, {details.t_state[0]}
\r\n Stock: {details.t_stock[0]}
\r\n {details.t_email[0].length > 0 &&
\r\n \r\n \r\n {pageTitle} \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {pageTitle} \r\n \r\n \r\n \r\n \r\n \r\n \r\n ${Helpers.formatMoney(normalPrice)}
\r\n \r\n Mfg: {details.t_make[0]}
\r\n Model: {details.t_model[0]}
\r\n Mileage: {details.t_mileage[0]}
\r\n Engine: {details.t_engine[0]}
\r\n Drive: {details.t_drive}
\r\n Location: {details.t_city[0]}, {details.t_state[0]}
\r\n Stock: {details.t_stock[0]}
\r\n {details.t_email[0].length > 0 &&Email: {details.t_email[0]}
}\r\n {details.t_phone[0].length > 0 && Phone: {details.t_phone[0]}
}\r\n {details.t_fax[0].length > 0 && Fax: {details.t_fax[0]}
}\r\n {details.t_cell[0].length > 0 && Fax: {details.t_cell[0]}
}\r\n \r\n\r\n \r\n \r\n \r\n \r\n\r\n \r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default (DetailsPart);\r\n\r\n","import React, {Component} from 'react';\r\nimport {Settings} from \"../Utils/Settings\";\r\nimport ImageGallery from 'react-image-gallery';\r\nimport \"react-image-gallery/styles/css/image-gallery.css\";\r\nimport Grid from '@material-ui/core/Grid';\r\nimport {Helmet} from \"react-helmet\";\r\nimport Typography from \"@material-ui/core/es/Typography/Typography\";\r\nimport Helpers from \"../Utils/Helpers\";\r\nimport Card from '@material-ui/core/Card';\r\nimport Button from \"@material-ui/core/Button\";\r\nimport ResponsiveEmbed from \"react-responsive-embed\";\r\nimport { Link } from \"react-router-dom\"\r\nimport Paper from \"@material-ui/core/Paper\";\r\nimport Table from \"@material-ui/core/Table\";\r\nimport TableCell from \"@material-ui/core/TableCell\";\r\nimport TableRow from \"@material-ui/core/TableRow\";\r\nimport TableBody from \"@material-ui/core/TableBody\";\r\n\r\nimport {\r\n FacebookShareButton,\r\n TwitterShareButton,\r\n PinterestShareButton,\r\n EmailShareButton,\r\n} from 'react-share';\r\n\r\nimport {\r\n FacebookIcon,\r\n TwitterIcon,\r\n PinterestIcon,\r\n EmailIcon,\r\n} from 'react-share';\r\n\r\nimport {ReducedButton, SoldButton, PrintButton} from \"./Buttons\";\r\n\r\nclass DetailsInventory extends Component {\r\n\r\n render() {\r\n\r\n const details = this.props.searchDetailsRecord;\r\n\r\n if (!details) {\r\n return \"\";\r\n }\r\n\r\n let images = [];\r\n let firstImage = \"\";\r\n\r\n images = details.media.filter(x=>x.type === 2).map(val => {\r\n if (firstImage.length === 0) {\r\n firstImage = val.xPath;\r\n }\r\n\r\n return {\r\n original: val.xPath,\r\n thumbnail: val.xPathThumbnail,\r\n description: val.caption\r\n }\r\n });\r\n\r\n let normalPrice = parseFloat(details.price).toFixed(2);\r\n let priceComponent = null;\r\n if (normalPrice > 0) {\r\n priceComponent = \r\n Model: {details.t_model[0]}
\r\n Mileage: {details.t_mileage[0]}
\r\n Engine: {details.t_engine[0]}
\r\n Drive: {details.t_drive}
\r\n Location: {details.t_city[0]}, {details.t_state[0]}
\r\n Stock: {details.t_stock[0]}
\r\n {details.t_email[0].length > 0 &&
\r\n \r\n \r\n {pageTitle} \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {pageTitle} \r\n \r\n \r\n \r\n \r\n \r\n \r\n {priceComponent} {reducedButton}{soldButton}\r\n Contact \r\n \r\n {details.contactStreet.length > 0 && {details.contactStreet}
}\r\n {details.contactCity.length > 0 && {details.contactCity}, {details.contactState}
}\r\n {details.contactZip.length > 0 && {details.contactZip}
}\r\n {details.contactEmail.length > 0 && Email: {details.contactEmail}
}\r\n {details.contactWeb.length > 0 && {details.contactWeb}
}\r\n {details.contactPhone.length > 0 && Phone: {details.contactPhone}
}\r\n {details.contactPhoneTollFree.length > 0 && Toll-free: {details.contactPhoneTollFree}
}\r\n {details.contactCell.length > 0 && Cell: {details.contactCell}
}\r\n {details.contactFax.length > 0 && Fax: {details.contactFax}
}\r\n {details.contactBestTime.length > 0 && Best time: {details.contactBestTime}
}\r\n \r\n {mapsComponent}\r\n \r\n \r\n \r\n {extraDetailsComponent}\r\n \r\n \r\n\r\n \r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default (DetailsInventory);\r\n\r\n","import React, {Component} from 'react';\r\nimport Helpers from './Utils/Helpers.js';\r\nimport 'typeface-roboto';\r\nimport {Helmet} from \"react-helmet\"; // Meta tag and title injector\r\nimport {Settings, InventoryTheme, DefaultSearchFields, DefaultSearchHandler} from './Utils/Settings.js';\r\nimport CssBaseline from '@material-ui/core/CssBaseline';\r\nimport { MuiThemeProvider } from '@material-ui/core/styles';\r\nimport { Route, withRouter } from \"react-router-dom\";\r\nimport PrimaryInventorySelector from './Components/PrimaryInventorySelector.js';\r\nimport InventorySelector from './Components/InventorySelector.js';\r\nimport InventorySearchFields from \"./Components/SearchFields.js\";\r\nimport InventorySearchResults from \"./Components/SearchResults.js\";\r\nimport DetailsTrailer from \"./Components/DetailsTrailer.js\";\r\nimport DetailsCargo from \"./Components/DetailsCargo\";\r\nimport DetailsTruck from \"./Components/DetailsTruck\";\r\nimport DetailsPart from \"./Components/DetailsPart\";\r\nimport DetailsInventory from \"./Components/DetailsInventory\";\r\nimport ScrollMemory from \"react-router-scroll-memory\";\r\n\r\nconst queryString = require('query-string'); // helpers for parsing the querystring\r\n\r\nclass App extends Component {\r\n\r\n constructor(props, context) {\r\n\r\n // Note: The primary initiator of state changes comes from react-router and URL changes\r\n // 1. A component will update the URL. Like the search component or next/back paging buttons.\r\n // 2. The app.js detects the URL update in componentDidUpdate() and downloads the necessary data.\r\n // 3. The components receive the data\r\n\r\n super(props, context);\r\n\r\n // Empty defaults for everything\r\n this.state = {\r\n inventoryType: Settings.inventoryTypes.NONE, // Horses, trailers, inventory, etc\r\n searchFieldsIsLoading: false,\r\n searchFields: { fields: []},\r\n searchFieldsPage: 1,\r\n searchFieldsError: null,\r\n searchFieldsCategoryName: \"\",\r\n\r\n searchResultsIsLoading: false,\r\n searchResultsError: null,\r\n searchResults: null,\r\n\r\n searchDetailsRecord: null,\r\n\r\n inventoryCategory: 0, // Category of the modern inventory system (Ranchjunk and other sites)\r\n inventoryCategories: []\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n this.populateStateFromRoute(false);\r\n }\r\n\r\n componentDidUpdate(prevProps) {\r\n if (this.props.location.pathname !== prevProps.location.pathname) {\r\n window.scrollTo(0, 0);\r\n this.populateStateFromRoute();\r\n }\r\n else if (this.props.location.search !== prevProps.location.search) {\r\n window.scrollTo(0, 0);\r\n this.populateStateFromRoute(true);\r\n }\r\n }\r\n\r\n populateStateFromRoute(setDefaults) {\r\n // Load initial values from the route properties\r\n let it = Settings.inventoryTypes.NONE;\r\n if (this.props.location.pathname.startsWith(\"/search\")) {\r\n if (this.props.location.pathname.startsWith(\"/search/horse-trailers\")) {\r\n it = Settings.inventoryTypes.TRAILER;\r\n }\r\n if (this.props.location.pathname.startsWith(\"/search/cargo-trailers\")) {\r\n it = Settings.inventoryTypes.CARGO;\r\n }\r\n if (this.props.location.pathname.startsWith(\"/search/trucks\")) {\r\n it = Settings.inventoryTypes.TRUCK;\r\n }\r\n if (this.props.location.pathname.startsWith(\"/search/parts\")) {\r\n it = Settings.inventoryTypes.PART;\r\n }\r\n\r\n // Only reload the search fields and results if we've changed types, or it is specifically requested to do so\r\n if (it !== this.state.inventoryType || setDefaults) {\r\n this.setState({\r\n inventoryType: it,\r\n searchResults: null,\r\n searchDetailsRecord: null\r\n });\r\n this.populateSearchFields(it, this.props.location.search);\r\n }\r\n }\r\n\r\n if (this.props.location.pathname.startsWith(\"/inventory\")) {\r\n if (this.props.location.pathname === \"/inventory\") {\r\n this.populateInventoryCategories();\r\n }\r\n if (this.props.location.pathname.startsWith(\"/inventory\")) {\r\n it = Settings.inventoryTypes.INVENTORY;\r\n let inventoryCategory = this.props.location.pathname.substring(\"/inventory/\".length);\r\n\r\n // Only reload the search fields and results if we've changed types, or it is specifically requested to do so\r\n if (setDefaults || inventoryCategory !== \"\" && ((it !== this.state.inventoryType) || (inventoryCategory !== this.state.inventoryCategory ))) {\r\n this.populateSearchFields(it, this.props.location.search, inventoryCategory);\r\n this.setState({\r\n inventoryType: it,\r\n searchResults: null,\r\n inventoryCategory: inventoryCategory,\r\n searchDetailsRecord: null\r\n });\r\n }\r\n }\r\n }\r\n\r\n if (this.props.location.pathname.startsWith(\"/trailer/details/\")) {\r\n this.setState({\r\n searchDetailsRecord: null,\r\n });\r\n let listingId = Helpers.getListingId(this.props.location.pathname, \"/trailer/details/\");\r\n this.populateDetails(Settings.inventoryTypes.TRAILER, listingId);\r\n }\r\n\r\n if (this.props.location.pathname.startsWith(\"/cargo/details/\")) {\r\n this.setState({\r\n searchDetailsRecord: null,\r\n });\r\n let listingId = Helpers.getListingId(this.props.location.pathname, \"/cargo/details/\");\r\n this.populateDetails(Settings.inventoryTypes.CARGO, listingId);\r\n }\r\n\r\n if (this.props.location.pathname.startsWith(\"/truck/details/\")) {\r\n this.setState({\r\n searchDetailsRecord: null,\r\n });\r\n let listingId = Helpers.getListingId(this.props.location.pathname, \"/truck/details/\");\r\n this.populateDetails(Settings.inventoryTypes.TRUCK, listingId);\r\n }\r\n\r\n if (this.props.location.pathname.startsWith(\"/part/details/\")) {\r\n this.setState({\r\n searchDetailsRecord: null,\r\n });\r\n let listingId = Helpers.getListingId(this.props.location.pathname, \"/part/details/\");\r\n this.populateDetails(Settings.inventoryTypes.PART, listingId);\r\n }\r\n\r\n if (this.props.location.pathname.startsWith(\"/listing/details/\")) {\r\n this.setState({\r\n searchDetailsRecord: null,\r\n });\r\n let listingId = Helpers.getListingId(this.props.location.pathname, \"/listing/details/\");\r\n this.populateDetails(Settings.inventoryTypes.INVENTORY, listingId);\r\n }\r\n }\r\n\r\n // Only called if the inventory type changes. Updates the default search fields based on the inventory type.\r\n // Also populates default choices.\r\n populateSearchFields(newInventoryType, defaultsString, inventoryCategory) {\r\n // https://reactjs.org/docs/faq-ajax.html\r\n let promise = DefaultSearchFields.getFields(newInventoryType, inventoryCategory);\r\n promise.then(\r\n (result) => {\r\n // Apply querystring defaults\r\n let page = 0;\r\n const defaults = queryString.parse(defaultsString);\r\n for (let key in defaults) {\r\n\r\n if (key === \"sort\") {\r\n let filterId = defaults[key];\r\n result.fields.find(x => x.isBeingSorted).isBeingSorted = false;\r\n let sortField = result.fields.find(x => x.filterId === filterId);\r\n if (sortField) {\r\n sortField.isBeingSorted = true;\r\n\r\n let sortDirection = defaults[\"sortDirection\"];\r\n if (sortDirection) {\r\n sortField.sortDirection = sortDirection;\r\n }\r\n }\r\n }\r\n\r\n if (key.startsWith(\"opt\")) {\r\n let filterId = key.substring(3);\r\n let filterField = result.fields.find(x => x.filterId === filterId);\r\n if (filterField) {\r\n if (filterField.fieldType === \"multiselect\") {\r\n if (Array.isArray(defaults[key])) {\r\n filterField.selectedValues = defaults[key];\r\n } else {\r\n filterField.selectedValues = [defaults[key]];\r\n }\r\n } else {\r\n filterField.selectedValue = defaults[key];\r\n }\r\n }\r\n }\r\n\r\n if (key.startsWith(\"zip\")) {\r\n let filterField = result.fields.find(x => x.filterId === \"zip\");\r\n if (filterField)\r\n {\r\n filterField.selectedValue = defaults[key];\r\n }\r\n }\r\n\r\n // If the page parameter is supplied, use it and initiate a search\r\n if (key === \"page\") {\r\n page = parseInt(defaults[key]);\r\n }\r\n\r\n }\r\n this.setState({\r\n searchFieldsError: null,\r\n searchFields: result,\r\n searchFieldsPage: page\r\n })\r\n\r\n if (page > 0) {\r\n this.performSearch();\r\n //this.handleSearch(page);\r\n }\r\n },\r\n (error) => {\r\n this.setState({\r\n searchFieldsError: error,\r\n })\r\n },\r\n )\r\n };\r\n\r\n // Retrieves the details for a listing\r\n populateDetails(inventoryType, listingId) {\r\n DefaultSearchHandler.GetDetails(inventoryType, listingId)\r\n .then(\r\n (result) => {\r\n this.setState({\r\n searchDetailsRecord: result\r\n });\r\n },\r\n (error) => {\r\n window.alert(\"An error occurred. Please try again. \" + error);\r\n },\r\n )\r\n };\r\n\r\n populateInventoryCategories() {\r\n let icPromise = DefaultSearchHandler.GetInventoryCategories();\r\n icPromise.then((result) => {\r\n this.setState({\r\n inventoryCategories: result\r\n });\r\n });\r\n }\r\n\r\n // When a user makes a change to a search parameter\r\n handleSearchFieldChange = (filterId, newValue) => {\r\n\r\n this.setState((previousState, currentProps) => {\r\n\r\n let searchField = previousState.searchFields.fields.find(x=>x.filterId===filterId);\r\n\r\n // Update the previous state with the new values\r\n if (searchField) {\r\n if (Array.isArray(newValue)) {\r\n searchField.selectedValues = newValue;\r\n } else {\r\n searchField.selectedValue = newValue;\r\n }\r\n\r\n // Search field bound to a sort parameter\r\n if (searchField.setFilterIdWhenChanged) {\r\n\r\n // Deselect all current sort filters\r\n previousState.searchFields.fields.find(x => x.isBeingSorted).isBeingSorted = false;\r\n\r\n // If a search field is bound to a sort field, enable the sort if a search value is being supplied\r\n // The user can change this sort using the UI, but the sort will be enabled by default\r\n let dependentField = previousState.searchFields.fields.find(x=>x.filterId===searchField.setFilterIdWhenChanged);\r\n\r\n if (dependentField) {\r\n if (newValue.length > 0) {\r\n dependentField.isBeingSorted = true;\r\n dependentField.disabled = false;\r\n } else {\r\n // If there is no value, deselect the bound sort field and reset to the search's default\r\n previousState.searchFields.fields.find(x => x.isDefaultSort).isBeingSorted = true;\r\n dependentField.disabled = true;\r\n }\r\n }\r\n }\r\n }\r\n\r\n // Merge the searchFields state\r\n return {\r\n searchFields: previousState.searchFields\r\n }\r\n });\r\n }\r\n\r\n handleSortFieldChange = (filterId) => {\r\n this.setState((previousState, currentProps) => {\r\n\r\n // Has the sort actually changed?\r\n let existingSort = previousState.searchFields.fields.find(x=>x.isBeingSorted);\r\n if (existingSort && existingSort.filterId === filterId) {\r\n return null;\r\n }\r\n previousState.searchFields.fields.find(x=>x.isBeingSorted).isBeingSorted = false;\r\n previousState.searchFields.fields.find(x=>x.filterId===filterId).isBeingSorted = true;\r\n this.handleSearch(previousState.searchFieldsPage);\r\n\r\n // Merge the searchFields state\r\n return {\r\n searchFields: previousState.searchFields\r\n }\r\n });\r\n };\r\n\r\n // Updates the querystring which will trigger a componentDidUpdate => performSearch\r\n handleSearch = (page = 1) => {\r\n this.setState({\r\n searchResultsIsLoading: true,\r\n });\r\n\r\n // Update the querystring\r\n let qsParams = DefaultSearchHandler.BuildSearchQuerystring(this.state.searchFields, page);\r\n this.props.history.push(this.props.location.pathname + \"?\" + qsParams);\r\n };\r\n\r\n performSearch = () => {\r\n DefaultSearchHandler.PerformSearch(this.state.inventoryType, this.state.searchFields, this.state.searchFieldsPage, this.state.inventoryCategory)\r\n .then(\r\n (result) => {\r\n this.setState({\r\n searchResultsIsLoading: false,\r\n searchResultsError: null,\r\n searchResults: result.results,\r\n searchResultsTotalRecords: result.totalRecords,\r\n searchResultsTotalPages: result.totalPages,\r\n searchResultsCurrentPage: result.currentPage\r\n })\r\n },\r\n (error) => {\r\n this.setState({\r\n searchFieldsPage: 1,\r\n searchResultsIsLoading: false,\r\n searchResultsError: error,\r\n searchResults: [],\r\n searchResultsTotalRecords: 0,\r\n searchResultsTotalPages: 0,\r\n searchResultsCurrentPage: 0\r\n })\r\n },\r\n )\r\n }\r\n\r\n\r\n\r\n render() {\r\n const {\r\n inventoryType,\r\n searchFieldsIsLoading, searchResultsIsLoading,\r\n searchResultsError, searchFieldsError,\r\n searchFields,\r\n searchResults, searchResultsTotalRecords, searchResultsTotalPages, searchResultsCurrentPage,\r\n searchDetailsRecord,\r\n inventoryCategories\r\n } = this.state;\r\n\r\n const primaryInventorySelectorComponent = () => \r\n
\r\n\r\n \r\n \r\n Remote Inventory \r\n \r\n \r\n \r\n \r\n }/>\r\n\r\n \r\n \r\n }/>\r\n\r\n \r\n \r\n \r\n \r\n \r\n 
\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nexport default withRouter(props => \r\n
\r\n