{"id":534,"date":"2013-02-28T06:59:28","date_gmt":"2013-02-27T22:59:28","guid":{"rendered":"http:\/\/passkit.com\/blog\/?p=534"},"modified":"2013-02-28T06:59:28","modified_gmt":"2013-02-27T22:59:28","slug":"mystic-8-ball-pass-to-demo-passkit-image-upload-capabilities","status":"publish","type":"post","link":"https:\/\/passkit.com\/blog\/mystic-8-ball-pass-to-demo-passkit-image-upload-capabilities\/","title":{"rendered":"Mystic 8 Ball Pass to demo PassKit image upload capabilities"},"content":{"rendered":"<h1><strong>Objectives:<\/strong><\/h1>\n<ul>\n<li>Demonstrate the power of dynamic image upload in PassKit Passes;<\/li>\n<li>Make the code available to anyone so they can quickly integrate and implement image upload into their own campaigns and Passes.<\/li>\n<\/ul>\n<p><strong>A little background on PassKit image upload:<\/strong><br \/>\nThe PassKit image upload works in a really cool and efficient way. If you want your image on a pass, you can use the following process:<\/p>\n<ol>\n<li>Update the image to PassKit by using the pk_image_upload API method. The pk_image_upload method takes 2 parameters:\n<ol>\n<li>imageType;<\/li>\n<li>imageFilePath;<\/li>\n<\/ol>\n<\/li>\n<li>More info on the image upload method can be found here:\u00a0https:\/\/code.google.com\/p\/passkit\/wiki\/UploadImage<\/li>\n<li>The image upload method will return a unique ID for the image;<\/li>\n<li>To use this image on a pass, we have to update one of the following pass fields with the image ID when doing a pass update (via API call):\n<ol>\n<li>&#8216;thumbnailImage&#8217;;<\/li>\n<li>&#8216;stripImage&#8217;;<\/li>\n<li>&#8216;logoImage&#8217;;<\/li>\n<li>&#8216;footerImage&#8217;;<\/li>\n<li>&#8216;backgroundImage&#8217;;<\/li>\n<li>&#8216;iconImage&#8217;;<\/li>\n<\/ol>\n<\/li>\n<\/ol>\n<p><strong>Mystic 8 Ball Flow:<\/strong><br \/>\nThe Mystic 8 Ball Pass experience has the following flow:<\/p>\n<ol>\n<li>User installs the Mystic 8 Ball pass;<\/li>\n<li>On the back of the pass there is an &#8216;ask&#8217; link with the pass-id embedded in the link;<\/li>\n<li>After clicking the link, the user is directed to mystic8ball.com as a a simple web-form (that has the pass-id stored as hidden value);<\/li>\n<li>The user inputs his\/her question into the question box;<\/li>\n<li>The question &amp; pass-id are posted back to the server, where the post-script picks a random image from the mystic8ball.com image\/answers directory;<\/li>\n<li>All the images have the answer in the name, so for example the image for &#8220;Ask again later&#8221; is called ask_again_later.png. This way we get the short image text as well, without having to store this reference in a database or array. This makes it easier to add new answer images later without having to change anything in the code;<\/li>\n<li>Since we have 20 images with answers, and we expect the 8 ball to be used a lot, it will be very likely that the script will result in a lot of upload-traffic. Therefore we implemented a simple caching script that checks if the image was uploaded already:\n<ol>\n<li>If image uploaded before: use the cached image ID (one unique ID per image) and don&#8217;t do an upload;<\/li>\n<li>If image not uploaded before: upload the image using the PassKit pk_image_upload method, and store the returned image ID in the local cache;<\/li>\n<\/ol>\n<\/li>\n<li>After we have the image ID, we update the following fields on the pass:\n<ol>\n<li>&#8216;stripImage&#8217; (this is the most important one, since it changes the image on the front of the pass. This image holds the Mystic 8 Ball answer in a nice graphic representation);<\/li>\n<li>&#8216;Status&#8217; (we update this with the textual representation of the answer that we extract from the image file-name. Underscores are replaced with spaces);<\/li>\n<li>&#8216;Question counter&#8217; (this field is on the back of the pass, and shows how many questions you have asked);<\/li>\n<li>&#8216;Flip&#8217; (we update this with a text string that says: &#8216;ask again&#8217;;<\/li>\n<\/ol>\n<\/li>\n<\/ol>\n<p>The main reason for point 8B and 8C is that when these fields get updated, those messages are also pushed to the lock-screen, this looks really cool, and really shows the added value &amp; potential of the clever PassBook marketing.<br \/>\n<a href=\"https:\/\/code.google.com\/p\/passkit\/source\/browse\/trunk\/PHP\/examples\/Mystic+8+Ball\/\" target=\"_blank\" rel=\"noopener\">Link to code repository<\/a><br \/>\n<strong>Result:<\/strong><br \/>\n<a href=\"http:\/\/passkit.com\/blog\/wp-content\/uploads\/2013\/02\/photo.png\"><img fetchpriority=\"high\" decoding=\"async\" class=\"alignnone size-medium wp-image-539\" src=\"http:\/\/passkit.com\/blog\/wp-content\/uploads\/2013\/02\/photo-200x300.png\" alt=\"\" width=\"200\" height=\"300\" title=\"\"><\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Objectives: Demonstrate the power of dynamic image upload in PassKit Passes; Make the code available to anyone so they can quickly integrate and implement image upload into their own campaigns and Passes. A little background on PassKit image upload: The PassKit image upload works in a really cool and efficient way. If you want your [&hellip;]<\/p>\n","protected":false},"author":5,"featured_media":13752,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[15],"tags":[105,106,170,249,275],"class_list":["post-534","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","tag-create-passbook-passes","tag-creating-innovative-passbook-pass","tag-innovative-passes","tag-passbook-ideas","tag-passkit-api"],"_links":{"self":[{"href":"https:\/\/passkit.com\/blog\/wp-json\/wp\/v2\/posts\/534","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/passkit.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/passkit.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/passkit.com\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/passkit.com\/blog\/wp-json\/wp\/v2\/comments?post=534"}],"version-history":[{"count":0,"href":"https:\/\/passkit.com\/blog\/wp-json\/wp\/v2\/posts\/534\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/passkit.com\/blog\/wp-json\/wp\/v2\/media\/13752"}],"wp:attachment":[{"href":"https:\/\/passkit.com\/blog\/wp-json\/wp\/v2\/media?parent=534"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/passkit.com\/blog\/wp-json\/wp\/v2\/categories?post=534"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/passkit.com\/blog\/wp-json\/wp\/v2\/tags?post=534"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}