[SOLVED] How/can you add/append InputfieldWrapper to api generated Fieldgroup used as template for page?

[Chris Bennett]

Hi all, I am going round and round in circles and would greatly appreciate if anyone can point me in the right direction.
I am sure I am doing something dumb, or missing something I should know, but don't. Story of my life ?

Playing round with a module and my basic problem is I want to upload an image and also use InputfieldMarkup and other Inputfields.
Going back and forth between trying an api generated page defining Fieldgroup, Template, Fields, Page and the InputfieldWrapper method.

InputfieldWrapper method works great for all the markup stuff, but I just can't wrap my head around what I need to do to save the image to the database.
Can generate a Field for it (thanks to the api investigations) but not sure what I need to do to link the Inputfield to that. Tried a lot of stuff from various threads, of varying dates without luck.
Undoubtedly not helped by me not knowing enough.

Defining Fieldgroup etc through the api seems nice and clean and works great for the images but I can't wrap my head around how/if I can add/append/hook the InputfieldWrapper/InputfieldMarkup stuff I'd like to include on that template as well. Not even sure if it should be where it is on ___install with the Fieldtype stuff or later on . Not getting Tracy errors, just nothing seems to happen.

If anyone has any ideas or can point me in the right direction, that would be great because at the moment I am stumbling round in the dark.
 

public function ___install() { 
			
		parent::___install();		
        $page = $this->pages->get('name='.self::PAGE_NAME);
		
		if (!$page->id) {

		    // Create fieldgroup, template, fields and page
		
		    // Create new fieldgroup
            $fmFieldgroup               = new Fieldgroup();
            $fmFieldgroup->name         = MODULE_NAME.'-fieldgroup';
            $fmFieldgroup->add($this->fields->get('title')); // needed title field
            $fmFieldgroup->save();

            // Create new template using the fieldgroup
            $fmTemplate                   = new Template();
            $fmTemplate->name             = MODULE_NAME;
            $fmTemplate->fieldgroup       = $fmFieldgroup;
		    $fmTemplate->noSettings       = 1;
            $fmTemplate->noChildren       = 1;
            $fmTemplate->allowNewPages    = 0;
            $fmTemplate->tabContent       = MODULE_NAME;
            $fmTemplate->noChangeTemplate = 1;
		    $fmTemplate->setIcon(ICON);	
			
            $fmTemplate->save();
            			
			// Favicon source
            $fmField                      = new Field();
            $fmField->type                = $this->modules->get("FieldtypeImage"); 
            $fmField->name                = 'fmFavicon';
            $fmField->label               = 'Favicon';
            $fmField->focusMode           = 'off';
			$fmField->gridMode            = 'grid';
            $fmField->extensions          = 'svg png';
            $fmField->columnWidth         = 50;
            $fmField->collapsed           = Inputfield::collapsedNever;
		    $fmField->setIcon(ICON);
            $fmField->addTag(MODULE_NAME);
			$fmField->save();
			
			$fmFieldgroup->add($fmField);
			
			// Favicon Silhouette source
            $fmField                      = new Field();
            $fmField->type                = $this->modules->get("FieldtypeImage"); 
            $fmField->name                = 'fmFaviconSilhouette';
            $fmField->label               = 'SVG Silhouette';
			$fmField->notes               = 'When creating a silhouette/mask svg version for Safari Pinned Tabs and  Windows Tiles, we recommend setting your viewbox for 0 0 16 16, as this is what Apple requires.

In many cases, the easiest way to do this in something like illustrator is a sacrificial rectangle with no fill, and no stroke at 16 x 16. This forces the desired viewbox and can then be discarded easily using something as simple as notepad. Easy is good, especially when you get the result you want without a lot of hassle.';
            $fmField->focusMode           = 'off';
            $fmField->extensions          = 'svg';
            $fmField->columnWidth         = 50;
            $fmField->collapsed           = Inputfield::collapsedNever;
		    $fmField->setIcon(ICON);
            $fmField->addTag(MODULE_NAME);
            $fmField->save();

			$fmFieldgroup->add($fmField);		
			
			// Create: Open Settings Tab
			$tabOpener = new Field();
            $tabOpener->type = new FieldtypeFieldsetTabOpen();
            $tabOpener->name = 'fmTab1';
            $tabOpener->label = "Favicon Settings";
            $tabOpener->collapsed  = Inputfield::collapsedNever;
            $tabOpener->addTag(MODULE_NAME);
            $tabOpener->save();
            // Create: Close Settings Tab				
            $tabCloser = new Field();
            $tabCloser->type = new FieldtypeFieldsetClose;
            $tabCloser->name = 'fmTab1' . FieldtypeFieldsetTabOpen::fieldsetCloseIdentifier;
            $tabCloser->label = "Close open tab";
            $tabCloser->addTag(MODULE_NAME);
            $tabCloser->save();
			// Create: Opens wrapper for Favicon Folder Name
            $filesOpener = new Field();
            $filesOpener->type            = new FieldtypeFieldsetOpen();
			$filesOpener->name            = 'fmOpenFolderName';
            $filesOpener->label           = 'Wrap Folder Name';
            $filesOpener->class           = 'inline';
			$filesOpener->collapsed       = Inputfield::collapsedNever;
			$filesOpener->addTag(MODULE_NAME);
            $filesOpener->save();
			// Create: Close wrapper for Favicon Folder Name
			$filesCloser                 = new Field();
            $filesCloser->type           = new FieldtypeFieldsetClose();
            $filesCloser->name           = 'fmOpenFolderName' . FieldtypeFieldsetOpen::fieldsetCloseIdentifier;
            $filesCloser->label          = "Close open fieldset";
            $filesCloser->addTag(MODULE_NAME);
            $filesCloser->save();
			
			// Create Favicon Folder Name
            $fmField                      = new Field();
            $fmField->type                = $this->modules->get("FieldtypeText"); 
            $fmField->name                = 'folderName';
            $fmField->label               = 'Favicon Folder:';
            $fmField->description         = $this->config->urls->files;
            $fmField->placeholder         = 'Destination Folder for your generated favicons, webmanifest and browserconfig';
            $fmField->columnWidth         = 100;
            $fmField->collapsed           = Inputfield::collapsedNever;
		    $fmField->setIcon('folder');
            $fmField->addTag(MODULE_NAME);
			$fmField->save();
			
            $fmFieldgroup->add($tabOpener);
			    $fmFieldgroup->add($filesOpener);
			        $fmFieldgroup->add($fmField);
			    $fmFieldgroup->add($filesCloser);
            $fmFieldgroup->add($tabCloser);
			
			$fmFieldgroup->save();
			 
			
			///////////////////////////////////////////////////////////////
			
            // Experimental Markup Tests
				
		$wrapperFaviconMagic = new InputfieldWrapper();
		$wrapperFaviconMagic->attr('id','faviconMagicWrapper');
		$wrapperFaviconMagic->attr('title',$this->_('Favicon Magic'));
		
			    // field show info what
	    $field = $this->modules->get('InputfieldMarkup');
	    $field->name = 'use';
	    $field->label = __('How do I use it?');
	    $field->collapsed = Inputfield::collapsedNever;
	    $field->icon('info');
        $field->attr('value', 'Does this even begin to vaguely work?');
	    $field->columnWidth = 50;

		
		$wrapperFaviconMagic->add($field);		
				
		$fmTemplate->fields->add($wrapperFaviconMagic);
        $fmTemplate->fields->save();
			
			/////////////////////////////////////////////////////////////
			
            // Create page
            $page = $this->wire( new Page() );
            $page->template = MODULE_NAME;
            $page->parent = $this->wire('pages')->get('/');
            $page->addStatus(Page::statusHidden);
            $page->title = 'Favicons';
            $page->name = self::PAGE_NAME;
            $page->process = $this;
            $page->save();
	   
	    }
	}	

 

Edited July 22, 2020 by Chris Bennett
Marked as Solved

[BillH]

Might this discussion help?

Also, it might be useful to say what the overall purpose of your module is.

[Chris Bennett]

Many thanks @BillH, I will certainly investigate that thread further, it expands on some of the snippets I tried unsuccessfully along the way.

In the meantime, I lucked upon the thread below, thanks to Bernard posting, which got me a lot further along the path. 
Still experimenting, with a fair degree of success so far, but not yet ready to claim it is "solved". Enjoying learning more as I go.

Module I am playing around with - mainly to force myself to learn more about how everything really works - is an attempt to recreate what I am already using (via normal admin page, a couple of fields with a nifty preview/review using RuntimeMarkup and a couple of php templates).

It generates favicons from svg right the way through (unlike realfavicongenerator), with a fallback for pngs and all the necessary markup, manifest, browserconfig etc.

Similar to realfavicongenerator (which I have long loved), but tweaked according to my personal wishlist.
Could accomplish what is *needed* pretty easily, but would really like to add some polish for clients.
Also so they can easily see what we have done and/or do that stuff themselves ?

The php templates I am currently using simply by accessing the normal hidden admin page automatically generate: 

• svg favicons for current gen browsers (if svg source provided)
• black safari pinned tab mask icon and white mstiles (if svg silhouette provided)
• automatic mask icon with required safe space for webmanifest
• automatic cropping of svgs/pngs so small icons can use the whole 16x16 or 32 x32 - because 3 or 4 px makes a big difference when you only start with 16
• generation of webmanifest and browserconfig
• frontend markup for inclusion that basically just checks if the right file exists and plonks in the correct markup if it does

Was a little surprised it seemed to work well.
No zip files, no code, no third parties, plonk new sources in, click generate new, check results and done. 

Lots more previews/config options I could/will add but figured it might be wise to work out any inevitable kinks with implementation of a module along these lines within the api before I got carried away too much more.