v3.0 Upgrade Guide

The following changes are required for upgrading to v3.0

Estimated Time to Upgrade: 10-60 mins

1 - Updated Polyfill Library

before
<script defer src="https://cdn.polyfill.io/v2/polyfill.min.js?features=Intl.~locale.en,Promise"></script>
after
<script defer src="https://cdn.polyfill.io/v3/polyfill.min.js?features=Promise"></script>

This ensures better support on browsers without a performance overhead.

2 - Webcast now uses Websockets

A change has been made to the technical implementation of our Websockets, and how updates are sent to all users in real time. This greatly improves performance and stability of large auctions. Note that the same change for Timed Auctions is in development.

To support this change, the highlighted addition of websocketBase is required to your bidJS configuration

<script>
window.bidjs = {
config: {
apiBase: 'MY_API_BASE_ENDPOINT', // e.g. //demo.eu-west-2.bidjs.com/auction-007/api
clientId: 'MY_CLIENT_ID', // e.g. demonstration
googleMapsApiKey: 'YOUR_KEY',
staticBase: 'MY_STATIC_URL/VERSION', // e.g. //demo.eu-west-2.bidjs.com/static/3.0
staticCDN: 'https://static.bidjs.com',
staticVersion: 'VERSION',
websocketBase: 'wss://broadcast.YOUR_REGION.bidjs.com' //e.g. wss://broadcast.eu-west-2.bidjs.com
},
modules: {
auctionDetails: '#!/auctionDetails/%AUCTION_ID%',
auctionsArchived: true,
invoices: true,
lotDetails: '#!/itemDetails/%AUCTION_ID%/%ITEM_ID%',
mySales: true,
webcast: true,
login: true
register: true
},
options: {}
}
</script>
caution

Please make sure to change YOUR_REGION to match your server details

3 - HTML Snippet change

A small aesthetic change has been made to improve the application during load.

The highlighted lines can now be REMOVED.

before
<div class="container">
<div id="bidlogix-app" class="bidlogix-app">
<div class="col-xs-12 text-center">
<svg width="200px" height="200px" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid" class="lds-dual-ring">
<circle cx="50" cy="50" fill="none" stroke-linecap="round" r="20" stroke-width="2" stroke="#337ab7" stroke-dasharray="31.41592653589793 31.41592653589793" transform="rotate(150 50 50)">
<animateTransform attributeName="transform" type="rotate" calcMode="linear" values="0 50 50;360 50 50" keyTimes="0;1" dur="3s" begin="0s" repeatCount="indefinite"></animateTransform>
</circle>
<circle cx="50" cy="50" fill="none" stroke-linecap="round" r="15" stroke-width="2" stroke="#333" stroke-dasharray="23.561944901923447 23.561944901923447" stroke-dashoffset="23.561944901923447" transform="rotate(-150 50 50)">
<animateTransform attributeName="transform" type="rotate" calcMode="linear" values="0 50 50;-360 50 50" keyTimes="0;1" dur="3s" begin="0s" repeatCount="indefinite"></animateTransform>
</circle>
</svg>
</div>
</div>
</div>
<div class="bidlogix-app">
<div id="bidlogix-modal"></div>
</div>
<div class="container bidlogix-app">
<div id="bidjs"></div>
</div>
after
<div class="container">
<div id="bidlogix-app" class="bidlogix-app">
</div>
</div>
<div class="bidlogix-app">
<div id="bidlogix-modal"></div>
</div>
<div class="container bidlogix-app">
<div id="bidjs"></div>
</div>

4 - Potential CSS changes to Home / Calendar pages

One of the main features of this release is the reworked Auction List, also known as the "Home" or "Calendar" page

This rework will ensure far better performance, particularly on mobile devices, and should result in better SEO for your site.

Thumbnail Images are now larger, and users can scroll through your images, whilst retaining a consistent appearance regardless of the number of lot images on each auction.

No changes are required to see this feature, unless you have applied a great deal of custom CSS to the previous view, in which case you may need to adjust the CSS to match accordingly.