Tictail Normalize - Discounts

readme.md

Tictail Normalize - Discounts

Show the discounted price on products not only in checkout.

The Tictail discounts application only modifys the price of your products at checkout. Basically, if you want to do a site wide discount outside of the checkout page then you're going to have to manually edit all your products and their price. This little jQuery plugin attempts to Normalize this time consuming task. It play nicely with the Currency Conversion app but does require some manual work, if you're a dev or running a store with over 50+ products, this might be of use to you.

Setup Process

• Add a new discount and apply the conditions to all the desired products.
• Copy and Paste the plugin TT-discounts.js code (You will need jQuery) into your workflow, theme or wherever.
• Copy and paste the prices.html into your theme elements wherever product pricing is displayed.
• Initiate the plugin, see inline.js for reference, make sure you included the plugin first.
• Modify options to your needs

Excluding Products

The plugin will modify the pricing of all your products, you will need to exclude the products you don't wish to modify. To exclude products, you're going to have to get the product indentifiers id. There are a few ways to do this, but the most simple solution is to go into your theme and in your {{#list_page}} where your products list, next the title of the product add the indentifier tag, eg:

{{#list_page}}
  {{#products?}}
    {{#products}}
      
 {{title}}  - {{identifier}}
 // Add it here
    {{/products}}
  {{/products?}}
{{/list_page}}

You will need to delete the indentifier addition once you've got the id of the products you want to exclude, but that is one way you can get it. You could also alternatively grab the indentifier id via your dev console in your browser, just make sure you've added the correct price HTML elements (see prices.html)

Issues

- Wont work in the colophon (cart)

inline.js

// Initiate the plugin and set your options. Below is just a rough example:
//
$('.price').TTprices({
  threshold: 1000, // Price threshold
  exclude: ['x01y', 'ly4q', 'fd1y'], // Place your excluded indentifiers in an array 
  discount: 50 // The percentage amount you're discounting
});

prices.html

{{#in_stock}}
  <span class="price" data-product-id="{{identifier}}">
    {{price_with_currency}}
    <span class="sale" data-badge="priceline"></span>
  </span>
{{/in_stock}}

{{#out_of_stock}}
  <span class="oos">{{#lang}}OUT OF STOCK{{/lang}}</span>
{{/out_of_stock}}

TT-discounts.js

(function($) {
	$.fn.TTprices = function(options){
  
  	// Default Settings
		//
		var settings = $.extend({
    	threshold : 1000, // Default price threshold (sek)
			discount	:	50, // Discount percentage (%)
      exclude : [] // Products to exclude 
		}, options);

		return this.each(function() {
    	
      var $this = $(this);
      var $value = $this.contents()[0].textContent; // Grab Price Value 
      var $price = parseFloat($value); // parse brah. 
      var $discount = "." + (settings.discount); // make var
      var $total = $price - ($price * $discount); // mathematics brah
      var $productID = $this.data('product-id'); // Data Attribute for indentifier
      var $exclude = (settings.exclude); // Exclude array into var
      var $saleTag =   $this.find("span[data-badge='priceline']"); // Sale Tag
      
      
    	$this.html(function(){ 
    	    // If array contains an excluded indentifier, then we don't modify the price.
    	    // You will need to grab the indentifier id, see Indentifiers in readme.md.
    	    //
          if ($.inArray($productID, $exclude) !== -1)  {
               $saleTag.empty(); 
               return $this.html();
          } 
          
          // If price is equal to or greater than the price threshold, then we edit the <span> elements.
    	    //
          else if ($value  >= (settings.threshold)) {
          		$saleTag.html(settings.discount + '% OFF'); 
              return $this.html().replace($value, $total.toFixed(2)+" ");
          } 
          // Else, just leave that shit alone
          //
          else {
              $saleTag.empty();
              return $this.html();
          } 
      });
		});
	};
}(jQuery));