Creating views for EASDK apps
In your handler for /app, render your 'dashboard' view. In this (and all views), include the EASDK JS in the <head> of your layout:
<head>
<script src="https://cdn.shopify.com/s/assets/external/app.js"></script>
<script type="text/javascript">
ShopifyApp.init({
apiKey: '{{{ Config::get('esc_shopify.public_credentials.api_key') }}}',
shopOrigin: 'https://{{{ $shop->shop_domain }}}'
});
</script>
</head>
You can also include the ShopifyApp.Bar setup to configure the header:
<!-- Under the scripts above: -->
<script type="text/javascript">
ShopifyApp.ready(function(){
ShopifyApp.Bar.initialize({
icon: 'https://myapp.io/assets/header-icon.png',
title: 'My App',
buttons: {
primary: {
label: 'Save',
message: 'save',
callback: function(){
ShopifyApp.Bar.loadingOn();
// Call any JS from here:
myapp.performAction();
}
}
}
});
});
</script>