This gist shows how to create a GIF screencast using only free OS X tools: QuickTime, ffmpeg, and gifsicle.
To capture the video (filesize: 19MB), using the free "QuickTime Player" application:
<script> | |
{% assign deposit = all_products['deposit'] %} | |
BookingDeposit = function() { | |
var _this = this; | |
_this.cart = {{ cart | json }}; | |
_this.depositProduct = {{ deposit | json }}; | |
_this.depositAmount = 0; | |
_this.depositLine = -1; | |
_this.cartDepositVariantId = -1; |
<h1>Ticket</h1> | |
<p> | |
Name: {{ booking.name }}</br> | |
Date: {{ booking.start | date: "%m/%d/%Y" }} | |
</p> | |
<h3>Booking Details:</h3> | |
<ul> | |
{% for item in booking.items %} |
<p>Hi {{ booking.name }},</p> | |
<p>This is a reminder from {{ shop.name }} about your upcoming booking on {{ booking.start | date: "%m/%d/%Y" }}.</p> | |
<h3>Your booking:</h3> | |
<ul> | |
{% for item in booking.items %} | |
<li> | |
{{ item.quantity }} x {{ item.product.title }} on {{ booking.start | date: "%m/%d/%Y %-I:%M %p" }} | |
</li> | |
{% endfor %} | |
</ul> |
<script> | |
bundles = []; | |
{% for variant in product.variants %}{% if variant.metafields.sva.bundled %} | |
bundles['{{ variant.id }}'] = jQuery.parseJSON('{{ variant.metafields.sva.bundled }}'); | |
{% endif %}{% endfor %} | |
var process = function (target, results) { | |
var deferred = $.Deferred(); | |
$.ajax({ |
{% comment %} | |
Checks if the product is already in the cart and if | |
so hides the booking form and displays a message. | |
Install Instructions: | |
1. Create a new snippet called 'booking-guard' and paste this code. | |
2. Include this new snippet in the existing booking-form snippet, and set the initial style of the booking form |
/* BookThatApp Customization */ | |
.ui-datepicker table {font-size: .9em; margin-bottom: inherit;} | |
.ui-datepicker table tr th {font-weight:bold; background: initial; text-align:center; padding: .7em .3em !important; border: 0;} | |
.ui-datepicker table tr td {font-weight:bold; background: initial; text-align:center; border: 0;} | |
@media only screen and (max-width: 767px) { | |
.ui-datepicker tr { | |
display: table-row; | |
} |
{% comment %} | |
BookThatApp auto installed snippet. Changes made to this file will be lost if installed again. | |
{% endcomment %} | |
{% if product.metafields.bookthatapp.config %} | |
{% unless bta_configured %} | |
<div class="booking-form"> | |
<p id="bta-loading" class="loading">Loading availability...</p> | |
<div id="variant-in-cart" style="display:none"> |
/*============================================================================ | |
Ajax the add to cart experience by revealing it in a side drawer | |
Plugin Documentation - http://shopify.github.io/Timber/#ajax-cart | |
(c) Copyright 2015 Shopify Inc. Author: Carson Shold (@cshold). All Rights Reserved. | |
This file includes: | |
- Basic Shopify Ajax API calls | |
- Ajax cart plugin | |
This requires: |
<!-- /snippets/ajax-cart-template.liquid --> | |
{% comment %} | |
This snippet provides the default handlebars.js templates for | |
the ajax cart plugin. Use the raw liquid tags to keep the | |
handlebar.js template tags as available hooks. | |
{% endcomment %} | |
<script id="CartTemplate" type="text/template"> | |
{% raw %} |