Deal of the Week

Homepage

To add the Deal of the Week to the homepage, see here. Not all dealers will want this on their homepage, but if they do, we need to figure out a way to add it to the page so that it looks nice and matches aesthetically with the rest of the homepage. See below for some visual examples.

1. 

   Full-width layout with graphic + button that leads to deal-of-the-week page. This is the most basic format. (Source: Hemlock Hill RV)

2. 

   Full-width layout featuring a tab/button that leads to deal-of-the-week page. This is also a fairly basic format. The banners below the button are not related to the Deal of the Week pages. (Source: General RV)

3. 

   Full-width layout with timer and button link to deal-of-the-week page. More complex as it requires additional scripts and styling, but one of the more common iterations. (Source: Parkland RV Center)

Promotional Pages

1. Create two pages titled “deal-of-the-week” and “deal-of-the-week-sold”

2. On “deal-of-the-week”, add a promotion snippet with the following values:

   1. SoldPage – “deal-of-the-week-sold”

   2. ItemTemplate – “UnitPromotion.cshtml” or a custom template if the dealer has one set up.

   3. PromotionTypeId – Place the ID of the Deal of the Week promotion listed in the “Promotions” tab of ICC.

3. On “deal-of-the-week” add the following scripts to the footer.

   1. <script src="https://assets-cdn.interactcp.com/interactrv/js/common_netcore/countdown.js" type="text/javascript"></script>

      b.

      <script type="text/javascript">$('.dow-unit-content.hidden').removeClass('hidden');</script>

      c.

      <script>// <!--CDATAOPENTAG--> $(function () {
      
      $('.dow-countdown-large').each(function() {
      
      var endDay = new Date($(this).attr('data-end-date'));
      
      $(this).countdown({until: endDay});
      
      });
      
      });
      
      // <!--CDATACLOSETAG--></script>

Variations

We can also do a Deal of the Month. See Chesaco RV for an example.

Deal of the Month

Place this script on the page that holds the countdown and link to the /deals-of-the-month page.
Note that this version needs to be manually synced with the dates on /deals-of-the-month.

<!-- Deal of the Month Modification -->
<script>
    $(function () {
        function getEndOfMonthDay() {
            var date = new Date();
            var month_offset = 1; //Number of month to offset the current month by
            var days_offset = 8; //Number of days to offset the first date of the month
            var hours_offset = 1; //Number of hours to offset from midnight
            date = new Date(date.getFullYear(), date.getMonth() + month_offset, days_offset, hours_offset);
            return date
        }
        
        var newMonth = getEndOfMonthDay();
        $('#defaultCountdown').countdown({until: newMonth, format: 'dHMS'});
    });

</script>

Deal of the Month - Synced Version

The variation of the above script makes an AJAX call to /deals-of-the-month to get the countdown end date value. If the value cannot be found, the countdown will default to manually specified parameter. Place this script on the page that hosts the countdown element linking to /deals-of-the-month.

<!-- Deal of the Month Synced Version -->
<script>
    $(function () {
        function getEndOfMonthDay() {
            var date = new Date();
            var month_offset = 1; //Number of month to offset the current month by
            var days_offset = 8; //Number of days to offset the first date of the month
            var hours_offset = 1; //Number of hours to offset from midnight
            date = new Date(date.getFullYear(), date.getMonth() + month_offset, days_offset, hours_offset);
            return date
        }

        var newMonth = getEndOfMonthDay();
        console.log(newMonth);
        $(document).ready(function () {
            const xhttp = new XMLHttpRequest();
            const ajaxURL = "/deals-of-the-month"
            xhttp.onload = function () {
                var unitCountdown = $($.parseHTML(this.responseText)).find(".dow-unit-countdown")
                var unitCountdownVal
                if (unitCountdown.length > 0) {
                    unitCountdownVal = new Date(unitCountdown.data("end-date"));
                    console.log("Found Countdown end value on " + ajaxURL + ": " + unitCountdownVal);
                    $('#defaultCountdown').countdown({ until: unitCountdownVal, format: 'dHMS' });
                }
                else {
                    console.log("Countdown value not found. Defaulting to " + unitCountdownVal);
                    $('#defaultCountdown').countdown({ until: newMonth, format: 'dHMS' });
                }

            }
            xhttp.open("GET", ajaxURL, true);
            xhttp.send();
        })
    });
</script>