How to: Card Images in Threads!

Jason Waddell

Administrator
Staff member
We're working on implementing a site-wide autocard feature. In addition, it is super easy to insert card images directly into threads. My current process goes:

Step 1: Right-click, copy URL
e0GR3tt.png


Step 2: Click the 'Insert/edit image' button
qGJyaYP.png


Step 3: Ctrl+V
y0rYrga.png




Viola!
Image.ashx
 
It would be nice to have a way to autolink card names as well. I'm not sure how easy that would be to add to this forum software.
 

Eric Chan

Hyalopterous Lemure
Staff member
Step 1: Right-click, copy URL
Step 2: Click the 'Insert/edit image' button
Step 3: Ctrl+V
Viola!

This kind of image leeching would get you killed on other forums. And yet here we have Mr. Site Admin advocating to STEAL ALL THE BANDWIDTH

This is how you know you're on a different kind of forum.
 

Eric Chan

Hyalopterous Lemure
Staff member
It would be nice to have a way to autolink card names as well. I'm not sure how easy that would be to add to this forum software.

That's a good idea, and is something a lot of forum sites have in addition to an auto-card feature. I'll add it to our to-do list.
 
And on a good day you can just drag and drop your (only hosted) images into the message box and they do all that themselves. "copy image//ctrl +V" also works. ;)
 

Rob Dennis

Developer
Chrome users can use the Autocard Anywhere extension: https://chrome.google.com/webstore/detail/autocardanywhere/eobkhgkgoejnjaiofdmphhkemmomfabg?hl=en

edit: it's also available for firefox
but there's a few caveats:
  • it does it literally everywhere in your browser on all websites all the time (until you configure it) so if you don't want it in emails, look out
  • it matches left to right (e.g. if there's a sentence that says 'I run wild hunger' it's link 'run wild' and not 'wild hunger')
 

Dom Harvey

Contributor
It's nice being able to c&p directly. I share Rob's reservations about the autocard extension, hopefully the forum version will work better though.

322.jpg

203.jpg

images
 

Jason Waddell

Administrator
Staff member
And on a good day you can just drag and drop your (only hosted) images into the message box and they do all that themselves. "copy image//ctrl +V" also works. ;)

Yeah, I guess you can just copy and paste directly (especially from Gatherer). Considering how really really easy it is to put in card images, I wonder how necessary an autocard feature even is. The threads on this board are really beautiful with all the card images pasted in. Perhaps we can do without?
 

Rob Dennis

Developer
Perhaps we can do without?

the two reasons I can think of for bothering with autocard :
- this domain gets blacklisted from wherever you're hotlinking pictures from (probably unlikely unless we grow significantly)
- you want to support people posting lists of 30-40 cards in a text block (e.g. "look at my draft") and still like folks easily see the card

I'd be pro autocard, but there's a point where it's difficult 'enough' to support via the forums implementation that I could see it being backlogged.
 

Jason Waddell

Administrator
Staff member
Well it's not really my call. Autocarding is out of my range of expertise, so it really comes down to whether Eric has the time or desire to implement it.

I will say, for draft lists, a picture is worth a thousand words. It's so much easier to understand a MODO photo of a decklist than to read the names of 30+ cards.
 

Eric Chan

Hyalopterous Lemure
Staff member
Yeah, I have concerns about the massive image leeching we're doing at the moment. I mean, I guess it's not really massive right now cause we only have 20 or so users. But if this site grows past a certain point, we'll probably have to discourage this kind of blatant bandwidth stealing.

The autocard feature is already on my backlog, and it's something I very much want to explore. At the moment, I'm still hashing out some of the hosting & forum software details, so I'm pushing the bigger features back until I've got the basic stuff figured out.
 

Jason Waddell

Administrator
Staff member
How does the autocard thing handle it? Do we host a database with the card images ourselves? How is what we do any different from copying the BB codes off of magiccards.info? Pardon my ignorance, I really don't know anything about image leeching.
 

Eric Chan

Hyalopterous Lemure
Staff member
Yeah, one option is just to use an existing site's auto-card feature, like the one over on magiccards.info. Being brand new to this whole website thing, I.. don't exactly know what's kosher and what's not, when it comes to etiquette on image leeching.

The other option is to host the images in a database ourselves. I've been trying to figure out how other sites with an auto-card feature do it, and some of them appear to self-host. For example, if you take a look at a page over on Black Lotus Project, the card images that pop up on mouseover all reside on their own server.

I'm kind of a novice at this, though, so if someone has any knowledge or expertise on this subject (or web development in general), please feel free to chime in! Otherwise, you get to watch Jason and I bumble around in a clueless stupor, hammering random buttons on our keyboards.
 
I really like autocard's ability to easily link to cards in running text. I usually don't want to break the flow of my paragraph to paste in a giant card link, and autocard links help with that. Even without hover images, I'd like to see a BBCode macro and/or rich text button for linking a card name.
 

Eric Chan

Hyalopterous Lemure
Staff member
Okay, I think we could definitely work on implementing something like that, piggybacking on top of another site's existing auto-card feature. You're right, some threads call for big ass pics of cards; others require a little more of something resembling subtlety.
 

Rob Dennis

Developer
even if autocard just hotlinks in the popup it's a lot less image-leechy than pages of images just do the fact you don't take the hit on loading each pic on each browser refresh as opposed to images where there was an explicit user action (e.g. mouseover) to load.

here's how I did this in a very very early proof of concept for cuesbey:
https://github.com/rdennis463/cuesbey/commit/241a11ae9cac66471b484c395d1f80c7ee1e6a0c

this *might* be a drop-in solution for the BBCode macro/button approach (not going to help on the autocard 'what counts as a card name' side of things)
 
It looks like it wouldn't be too hard to create a BBCode plugin for [card] links using this guide. It may be more difficult to integrate them with the rich text editor, though.
 

Eric Chan

Hyalopterous Lemure
Staff member
Good point about saving bandwidth on the image leeching concern. And thanks for the pointers from both of you - that'll definitely come in handy when I get around to this, and gives me more motivation to tackle it quickly!
 

Eric Chan

Hyalopterous Lemure
Staff member
Dragging and dropping from Gatherer to get card images is for chumps. Do it the new, fashionable way! Be the coolest kid in school!
Code:
[ci]Stinkweed Imp
Life from the Loam
Raven's Crime
Faithless Looting[/ci]




Code:
Is this a mull or a keep?
[ci="small"]Stinkweed Imp
Life from the Loam
Raven's Crime
Faithless Looting
Smallpox
Bloodghast
Mountain[/ci]


Is this a mull or a keep?


(Thanks to Vince for the great suggestion!)
 

Eric Chan

Hyalopterous Lemure
Staff member
Oh man, you're totally right. My thirty seconds of testing was clearly insufficient.

This is totally gonna bug me until I can get home tomorrow and work on it.

EDIT: You can't have formatting within the [ci] tag itself. Edit your post, highlight everything, press the eraser in the top left corner to Remove Formatting.
 
Top