Jump to content
apeisa

New inputfield for FieldtypeImage

Recommended Posts

I started to create quick module where It would offer possibility to search and select images from Flickr in addition to local hard drive. I cannot get it to display selection of Inputfield Type like it offers when creating Inputfields for FieldtypeText, FieldtypeTextarea or FieldtypePage. When I look the source code of FieldtypeImage and FieldtypeFile it seems that they are hardcoded to always use InputfieldFile or InputfieldImage.

So after I create Image field I could choose this new inputfield as I can choose between textarea and TinyMCE when creating Textarea inputfield.

This is the little I got so far... I cannot do much to proceed before I get my field to use this.

<?php

class InputfieldFlickrimage extends InputfieldImage {

public static function getModuleInfo() {
	return array(
		'title' => 'Flickr images',
		'version' => 100,
		'summary' => 'Upload local files or get those straight from flickr',
		'permanent' => false, 
		);
}

public function init() {
	parent::init();
}

public function ___render() {
	$this->config->scripts->add($this->config->urls->InputfieldFile . "InputfieldFile.js");
	$this->config->styles->add($this->config->urls->InputfieldFile . "InputfieldFile.css");
	return parent::___render()."FlickrMagicIsHere";
}
}

Share this post


Link to post
Share on other sites

If I edit line 47 in FieldtypeImage.module and change it from

$inputfield = $this->modules->get("InputfieldImage"); 

to

$inputfield = $this->modules->get("InputfieldFlickrimage"); 

Then it uses this new inputfield. This helps me to develop this module, but of course this should be somehow extendable. Of course I could create another Fieldtype by extending fieldtypeImage and set that use this new inputfield, but that would be as clean as I would like it to be. It would be nice to have different inputfields for images and files also.

Share this post


Link to post
Share on other sites

Isn't Fieldtype required for Inputfields (or maybe other way around – inputfields mandatory for fieldtypes... no doesn't make sense).

Any way, there shouldn't be way to have inputfield without corresponding (i.e. hardcoded) fieldype, should there?

Edit: Bah, I read it again... I understand your need for different inputfield for image/file fieldtype now :)

Share this post


Link to post
Share on other sites

I agree I think this makes sense to be able to define an Inputfield with a given instance of a field if you want to. I will work on this.

Share this post


Link to post
Share on other sites

I just committed an update to 2.1 that makes Field/Image Fieldtypes offer the option of a configurable Inputfield on a field-by-field basis. Let me know if this works for you?

Thanks,

Ryan

Share this post


Link to post
Share on other sites

Thanks Ryan. I will try this soon.

Share this post


Link to post
Share on other sites

Works very well, thank you sir!

I hope to get my inputfield ready and shared soon!

Share this post


Link to post
Share on other sites

Well, it seems I probably need a new Fieldtype for this after all.. since this plugin will not upload local files, it will just add images to pages from public urls. So the way this handles form input is very much different to file and image inputfields.

That doesn't mean a lot of work, but I would liked very much if it could have been same fieldtype, since the data they contain are identical, only the way that data (image file & description) is different. On the bright side - those fieldtypes can be changed (just converted image field to file field => all works fine) so if I for some reason want to stop using flickr import and start uploading.. all would work fine after field type change.

PS: Ryan, after last update it is now possible to select Image as inpufield type for file field (you probably knew this). It actually works, but gives broken image on non-image files. I don't think that is something that needs to be fixed, since it a) works b) is something that side builder needs to intentionally change.

Share this post


Link to post
Share on other sites

I quote myself:

since this plugin will not upload local files, it will just add images to pages from public urls. So the way this handles form input is very much different to file and image inputfields.

I started to thinking: as we can add images with url on templates - is it possible to have same functionality on admin site? So if you know the url you could just add that, no need for download & upload. (I don't know if this is supported on code level already...?)

I added little screencast that probably helps to understand what I am talking about :)http://screencast.com/t/AsQ7cwBd5Y

So what I would do is add hidden form fields for images that user choose (those fields value would be url to fullsize image). Then fieldtype would process those without expecting file upload, and pull images from flickr url.

Share this post


Link to post
Share on other sites

The screencast looks very cool!

FieldtypeImage just extends FieldtypeFile. If you look at the FieldtypeImage class, there's hardly anything in it. So the meat of it all is really in FieldtypeFile. I would suggest just extending FieldtypeFile and overriding any parts as needed. You can even override the table structure if you need it to be different. But as it is now, 'data' is just the filename, and 'description' is just a fulltext indexed MySQL 'text' field. If you wanted to, you could certainly use the 'description' field in a different way, perhaps to keep some JSON encoded data or something.

I love how this works to pull images from Flickr. One question popped into my head as I was watching it. Does it search and pull from anywhere in Flickr? Or is this just for hooking into your own flickr account? I know in the US at least, if we cloned images from Flickr without adhering to the individual license requirements of each, we might get in legal trouble. :)

PS: Ryan, after last update it is now possible to select Image as inpufield type for file field (you probably knew this). It actually works, but gives broken image on non-image files. I don't think that is something that needs to be fixed, since it a) works b) is something that side builder needs to intentionally change.

I didn't know of a simple way around this because PW finds compatible types based on what classes they extend. Since InputfieldImage extends InputfieldFile, it's technically valid to use. If this becomes a larger problem with more instances in the future, we'll probably have to make the modules explicitly specify which they are compatible with.

Share this post


Link to post
Share on other sites

Thanks. I will start to look extending fieldtypeFile.

I love how this works to pull images from Flickr. One question popped into my head as I was watching it. Does it search and pull from anywhere in Flickr? Or is this just for hooking into your own flickr account? I know in the US at least, if we cloned images from Flickr without adhering to the individual license requirements of each, we might get in legal trouble. :)

Flickr API is pretty nice, it allows to search based on license. So currently it searches only for CC images that have "available for commercial use" - of course you would need (probably, depends on their license) to contribute authors (my intention is to pre-populate the description field with that information). I probably will add settings so that you can search: commercial or also non-commercial CC licensed images from all public photos or then like you described from users own flickr account.

Share this post


Link to post
Share on other sites

So it's pulling from the CC images already–that's great!

Share this post


Link to post
Share on other sites

Ok guys, just watched latest episode of True Blood with my wife and after that coding of this was peace of cake ;)

This turned to be pretty cool... actually supercool :) Lots of work to do (settings etc), but all the core functionality that I needed for my current project is there already. Screencast is worth thousands images, so here we go: http://screencast.com/t/qOmxvS8enGsD

(Some of the images that it saves are pretty large so it takes a while... I use "Large" setting from flickr, which is usually 1024 width.)

Share this post


Link to post
Share on other sites

This looks awesome! Well done. This looks very fun to use. :) I really like what you are doing with this module.

Share this post


Link to post
Share on other sites

As I'm watching this Antti's demos (great work Antti!), I'm thinking I should finally finish up the new design and move to admin, which would be supercool if we (I) created some 'frontend' UI set for all kinds of stuff, so it would be easier to these things with design pre-configured, so, let's say, Antti would just put something like 'input with button next to it' and it would be CSSified (is that a word) already, so it would fit the design out of the box.

Share this post


Link to post
Share on other sites
As I'm watching this Antti's demos (great work Antti!), I'm thinking I should finally finish up the new design and move to admin, which would be supercool if we (I) created some 'frontend' UI set for all kinds of stuff, so it would be easier to these things with design pre-configured, so, let's say, Antti would just put something like 'input with button next to it' and it would be CSSified (is that a word) already, so it would fit the design out of the box.

It's called the jQuery UI CSS framework. :)

http://jqueryui.com/docs/Theming/API

This is what PW uses, though it also introduces a few of it's own things on top of that (though not much).

Share this post


Link to post
Share on other sites

Yeah I meant CSS framework (probably), except I don't really like jQuery UI CSS. Whatever, I'll have to comply.

Share this post


Link to post
Share on other sites

It's okay, I don't like jQuery UI CSS framework that much either, but it gets the job done. But I do like jQuery UI, so it's a necessary evil. I figured it would be better to embrace it rather than compete with it by introducing multiple frameworks.

Share this post


Link to post
Share on other sites

I have never looked jQuery UI CSS framework from software side: I have used editor and customized css, but never built any markup that works with jQuery UI CSS. But I agree with you guys: probably no need to re-invent the wheel here.

btw: my mockups and early versions are always ugly. Sometimes the leave that way though :)

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...