Hearthstone Spice debut #1452

Akryum · 2015-01-27T23:15:09Z

Spice Pull Request

What does your Instant Answer do?
It shows infos about any Hearthstone card with a thumbnail.

What problem does your Instant Answer solve (Why is it better than organic links)?
It allows to get instantly main informations like what a card does, without searching in a database or a wiki.

What is the data source for your Instant Answer? (Provide a link if possible)
Gamepedia Hearthstone Wiki
http://hearthstone.gamepedia.com/

Why did you choose this data source?
It seems to be the most accurate, and has image for every card.

Are there any other alternative (better) data sources?
Not better alternatives:
http://hearthstonejson.com/
http://hearthstoneapi.herokuapp.com/

What are some example queries that trigger this Instant Answer?
hearthstone leeroy
hearthstone tidecaller
hearthstone murloc warleader

Which communities will this Instant Answer be especially useful for? (gamers, book lovers, etc)
Gamers!

Is this Instant Answer connected to a DuckDuckHack Instant Answer idea?
No.

Which existing Instant Answers will this one supersede/overlap with?
None I can think of.

Are you having any problems? Do you need our help with anything?
No thanks. :)

What are the terms of use for the API? Will DuckDuckGo need specific authorization (e.g. an API key)? Are there any costs associated with API usage?
The API is a Mediawiki API. A Warranty disclaimer applies.

Where did you hear about DuckDuckHack? (For first time contributors)
On the duckduckgo timeline (https://duckduckgo.com/about). :)

What does the Instant Answer look like? (Provide a screenshot for new or updated Instant Answers)

Checklist

Please place an 'X' where appropriate.

[x] Added metadata and attribution information
[x] Wrote test file and added to t/ directory
[x] Verified that instant answer adheres to design guidelines (https://duck.co/duckduckhack/design_styleguide)
[x] Verified that instant answer adheres to code styleguide (https://duck.co/duckduckhack/code_styleguide)
[x] Tested cross-browser compatibility

    Please let us know which browsers/devices you've tested on:
    - Windows 8
        [] Google Chrome
        [] Firefox
        [] Opera
        [] IE 10

    - Windows 7
        [x] Google Chrome
        [x] Firefox
        [x] Opera
        [] IE 8
        [] IE 9
        [] IE 10
(Tested on IE11)

    - Windows XP
        [] IE 7
        [] IE 8

    - Mac OSX
        [] Google Chrome
        [] Firefox
        [] Opera
        [] Safari

    - iOS (iPhone)
        [] Safari Mobile
        [] Google Chrome
        [] Opera

    - iOS (iPad)
        [] Safari Mobile
        [] Google Chrome
        [] Opera

    - Android
        [x] Firefox
        [] Native Browser
        [x] Google Chrome
        [] Opera

IA Page: https://duck.co/ia/view/hearthstone

MrChrisW · 2015-01-28T06:55:15Z

share/spice/hearthstone/hearthstone.handlebars

+
+            {{#if health}}
+            <span> - Health: <b>{{health}}</b> <image class="zci--hearthstone--icon" src="http://hydra-media.cursecdn.com/hearthstone.gamepedia.com/1/17/Health_icon.png"/></span>
+            {{/if}}


You'll need to use the imageProxy helper for all images, see https://duck.co/duckduckhack/spice_handlebars_helpers#imageproxy

MrChrisW · 2015-01-28T07:04:52Z

@Akryum This is a great first pass! Thanks for contributing 🍰 I've added some feedback and I'm sure other community leaders will check this out shortly. Feel free to ask any questions. Do you own the API endpoint? bytevortex.net

Akryum · 2015-01-28T07:32:20Z

@MrChrisW Thanks for the feedback! And yes I own bytevortex.net ;)

MrChrisW · 2015-01-28T07:34:01Z

@Akryum No problem! Happy to help. Great!

…ack)

Akryum · 2015-01-28T08:02:26Z

Feedback applied! :)

MrChrisW · 2015-01-28T08:09:01Z

Thanks @Akryum, We'll just need to await a staff review or other feedback from the community!

Akryum · 2015-01-28T08:32:43Z

Ironed out some quirks.

MrChrisW · 2015-01-28T08:47:59Z

@Akryum 👍

Akryum · 2015-01-28T13:43:58Z

Got a question: How are IA supposed to be translated/regionalized?

MrChrisW · 2015-01-28T13:58:45Z

@Akryum Good question!

Right now all Instant Answers provide English results. Translation will come later, so initially we're moving forward with just English answers.

moollaza · 2015-01-28T16:32:55Z

@Akryum @MrChrisW

This is looking pretty good so far, I have 2 concerns:

We're using the base template and a lot of custom HTML. Let's use a pre-defined template group (I think the info group should work here) and reduce the amount of custom code for this. I think the look/feel of the new MTG Spice https://duckduckgo.com/?q=mtg+nullify&ia=magicthegathering would be ideal. It also makes use of the InfoBox so we have room to show lots of data with minimal effort and templating.
We're not doing any relevancy checking against the query. Right now this will trigger whenever the query has "hearthstone" anywhere in the query. I'm sure a large portion of those potential queries aren't a search for a hearthstone card (e.g "hearthstone game", "hearthstone instructions", "hearthstone stoves")

Let's improve our triggers and add some checking so we're confident the query that triggered this is likely to be a search for a hearthstone card and then we don't have to worry about showing lots of potentially irrelevant results.

moollaza · 2015-01-28T16:41:09Z

share/spice/hearthstone/hearthstone.js

+        // Card Data
+        // May (but very unlikely) return <undefined> values for : image_url, Has_card_type, Has_rarity,
+        // Has_class, Has_mana_cost
+        var card = {


This should be handled with a normalize function: https://duck.co/duckduckhack/spice_displaying#data-normalization

Akryum · 2015-01-28T18:13:56Z

@moollaza I don't really think of a good way of restricting the trigger... A keyword blacklist maybe?

Akryum · 2015-01-28T18:40:25Z

Using info template:

Akryum · 2015-01-28T18:52:53Z

I think that duckpan test modifies my .travis.yml all the time. :/

abeyang · 2015-02-05T20:16:17Z

@Akryum can you throw this onto DDH1? Would like to see this design with other cards (esp. those with a fuller description). But I think we're almost there!

Akryum · 2015-02-05T22:32:49Z

@abeyang Well, you may ask @jagtalon for that I think. :3

jagtalon · 2015-02-06T08:47:27Z

@Akryum @abeyang sorry about that. Updated: https://ddh1.duckduckgo.com/?q=hearthstone+leeroy+jenkins+card&ia=hearthstone

jagtalon · 2015-02-06T08:51:49Z

@abeyang I don't think we have #999 as a standard color in https://duckduckgo.com/styleguide. What about using the tx-clr--lt class which adds #888?

Akryum · 2015-02-06T10:05:29Z

Flavor text now has tx-clr--lt css class.

moollaza · 2015-02-07T00:36:53Z

@Akryum thanks!

@jagtalon can you update the code on DDH1 please? and then @abeyang can take another look and sign-off.

jagtalon · 2015-02-19T20:43:44Z

@abeyang @moollaza here you go! https://ddh9.duckduckgo.com/?q=hearthstone+tidecaller&ia=hearthstone looking good!

moollaza · 2015-02-20T05:03:48Z

Looks great! Would like a design sign-off and then we can merge it in 👍

abeyang · 2015-02-20T23:22:25Z

Hi @Akryum , after looking at a few examples, I think it's best to just fit the little "gag" into the subtitle. For example, the Crackle card would look more like this:

Crackle
Snap! This card! Pop!

Deal 3-6 damage. Overload: (1)

Hope that makes sense. Let us know if you need help with anything!

moollaza · 2015-02-20T23:37:56Z

@abeyang unfortunately the Info template doesn't allow for a subtitle property.

We could add the markup to the description template, but unless we add additional CSS to shift it on the page it's going to look a little odd because the subtitle div will be contained in the zci__content div that wraps the description.

I think this has been fixed in the updated templates, so perhaps we can leave it as-is and change it later?

chrismorast · 2015-02-20T23:53:23Z

He means subheader @moollaza

Akryum · 2015-02-21T10:49:31Z

@chrismorast Do I put the flavor text subheader div in the content template or is there any property for that?

chrismorast · 2015-02-23T21:45:13Z

Hi @Akryum , put that content in the subtitle property. We will be deploying an update to the template to allow for this within the next day or two.

moollaza · 2015-03-18T01:39:11Z

@Akryum sorry! I didn't realize you had updated this -- we don't get notified of commits, only comments!

moollaza · 2015-03-18T01:39:17Z

LGTM 👍

Hearthstone Spice debut

moollaza · 2015-03-18T01:43:24Z

@Akryum I just noticed we're not using the CSS file -- can you make a PR to remove it?

moollaza · 2015-03-18T01:55:15Z

Nevermind I see what's happening. The text comes as HTML from the API. Probably best to use DDG.stripHTML() but this is fine.

moollaza · 2015-04-01T15:14:24Z

@Akryum congrats! It's live: https://duckduckgo.com/?q=hearthstone+murloc+warleader&ia=hearthstone

Thanks again for taking the time to contribute! We really appreciate it. Feel free to stick around and comment/help on other PR's & Issues or even submit more Instant Answers!

Akryum · 2015-06-14T13:10:57Z

Hi! It seems that the card IA is no longer working. Is there any problem I can help with?

moollaza · 2015-06-16T00:26:54Z

@Akryum do you have any examples? I just tried and it worked:

Akryum · 2015-06-16T06:42:48Z

@moollaza It seems that some cards no longer display the IA like these:
https://duckduckgo.com/?q=hearthstone+blizzard
https://duckduckgo.com/?q=hearthstone+oasis
https://duckduckgo.com/?q=hearthstone+boom+bot

I just tested my api endpoint and it get quite slow sometimes. Has the IA a timeout? (I will see what I can do to speed up the api.)

Akryum · 2015-06-16T07:51:10Z

I have added a cache system to greatly speed up calls to my api so the IA works again after a few try (when the card cache is ready).

moollaza · 2015-06-18T00:58:16Z

@Akryum yes there's a default timeout of 5000ms.

Your 3 examples all worked for me, so I guess everything is good now?

Akryum · 2015-06-18T05:21:23Z

Yes, evrything is working again :)

Akryum added 2 commits January 27, 2015 22:48

Creation of the Hearthstone Spice

95aaef0

Fixed attribution github link in metadata

92f0906

MrChrisW added the New Instant Answer label Jan 28, 2015

MrChrisW reviewed Jan 28, 2015
View reviewed changes

Added imageproxy, conditionnals and more comments (pull request feedb…

52c2c8a

…ack)

MrChrisW added the Status: Needs Community Review label Jan 28, 2015

Akryum added 4 commits January 28, 2015 08:20

rebade

403eab6

Fixed .travis.yml

3120a65

Fixed css

b66f33d

Trailing comma in Hearthstone.t

00f0909

moollaza reviewed Jan 28, 2015
View reviewed changes

Akryum added 2 commits January 28, 2015 18:47

Now using info template, added trigger keyword blacklist

c550d66

Fixed .travis.yml again

6830586

Styling reworked and stats moved to info box.

cde137a

Added css class 'tx-clr--lt' on flavor text.

a964a4c

Flavor text moved to subtitle property

2802f56

abeyang mentioned this pull request Mar 5, 2015

[Instant Answer] Pokemon info #1536

Merged

moollaza added a commit that referenced this pull request Mar 18, 2015

Merge pull request #1452 from Akryum/master

d253de4

Hearthstone Spice debut

moollaza merged commit d253de4 into duckduckgo:master Mar 18, 2015

Hearthstone Spice debut #1452

Hearthstone Spice debut #1452

Conversation

Akryum commented Jan 27, 2015

Spice Pull Request

Checklist

MrChrisW Jan 28, 2015

Choose a reason for hiding this comment

MrChrisW commented Jan 28, 2015

Akryum commented Jan 28, 2015

MrChrisW commented Jan 28, 2015

Akryum commented Jan 28, 2015

MrChrisW commented Jan 28, 2015

Akryum commented Jan 28, 2015

MrChrisW commented Jan 28, 2015

Akryum commented Jan 28, 2015

MrChrisW commented Jan 28, 2015

moollaza commented Jan 28, 2015

moollaza Jan 28, 2015

Choose a reason for hiding this comment

Akryum commented Jan 28, 2015

Akryum commented Jan 28, 2015

Akryum commented Jan 28, 2015

abeyang commented Feb 5, 2015

Akryum commented Feb 5, 2015

jagtalon commented Feb 6, 2015

jagtalon commented Feb 6, 2015

Akryum commented Feb 6, 2015

moollaza commented Feb 7, 2015

jagtalon commented Feb 19, 2015

moollaza commented Feb 20, 2015

abeyang commented Feb 20, 2015

moollaza commented Feb 20, 2015

chrismorast commented Feb 20, 2015

Akryum commented Feb 21, 2015

chrismorast commented Feb 23, 2015

moollaza commented Mar 18, 2015

moollaza commented Mar 18, 2015

moollaza commented Mar 18, 2015

moollaza commented Mar 18, 2015

moollaza commented Apr 1, 2015

Akryum commented Jun 14, 2015

moollaza commented Jun 16, 2015

Akryum commented Jun 16, 2015

Akryum commented Jun 16, 2015

moollaza commented Jun 18, 2015

Akryum commented Jun 18, 2015