Module Module: RuntimeMarkup Fieldtype & Inputfield

[Macrura]

@kongondo - thanks - yes, i could also just delete and remake the field, since i can copy the code, and there is no risk of losing entered data...

it would be good to fix though, as surely someone along the way is going to try and rename one of these..

[Macrura]

 In relation to lister -

So i have this module generating a dynamic link (the link is based off the combination of a page select and some attributes of the page being edited); to get it to work in lister, e.g. where it doesn't end up getting entity encoded, i added this to ready.php:

wire()->addHookAfter('FieldtypeRuntimeMarkup::markupValue', function($event) {
  $value = $event->arguments('value');
  $event->return = $value;
});

should the module assume that the output will be markup and therefore also provide a markupValue by default, or leave this up to the user to add as a hook?

[kongondo]

 In relation to lister -

....should the module assume that the output will be markup and therefore also provide a markupValue by default, or leave this up to the user to add as a hook?

Thanks. Good idea. Will provide the method.

[kongondo]

@kongondo - thanks - yes, i could also just delete and remake the field, since i can copy the code, and there is no risk of losing entered data...

it would be good to fix though, as surely someone along the way is going to try and rename one of these..

@Macrura,

Reported the issue and Ryan fixed it in this commit. I've tested it and it works.

[kongondo]

Update: version 0.0.2

As requested by @Macrura, added a markupValue() method to correctly output the field's markup output in listers.

[Macrura]

awesome, many thanks for this!

will be upgrading mods tomorrow...

[SteveB]

How can I have the button open a url in a modal? I can't quite get it to work. The modal does appear but then the browser goes to the url.

$url = 'http://example.com';
$out = '<a href="'.$url.'" class="pw-modal pw-modal-large" data-buttons="#non_rte_dialog_buttons button" data-autoclose="1" data-close="#non_rte_cancel">';
$out .= '<button type="button" name="button" class="ui-button ui-widget ui-corner-all ui-state-default">';
$out .= '<span class="ui-button-text">Image Archive</span></button>';
$out .= '</a>';
return "<div class='pfabLink'>".$out."</div>";

Thanks

[kongondo]

It should work (@adrian) but for some reason the modal quickly closes, so something on PW side doing that. Maybe @adrian used fancybox or something else and you are calling modal.js? I have no idea really.

@adrian, thoughts? Thanks.

Edited February 20, 2016 by kongondo

[SteveB]

The page has image field's thumbnail images which use modal and have those "pw-modal" classes and work just fine, so any necessary js and css are in place already. I'd seen that Adrian comment so I know it can be done.

I'm new to jqueryUI so I don't understand the handling of the click event and at what point it does something (return false?) to stop the browser from processing the link as a link and going off to another page. There must be some condition which isn't being met. Could it be a matter of what the A tag is wrapped in?

Answer: Don't use an A tag! Seems simple enough. Just do it all with the button, putting the url in a "data-href" attribute on the button. It's working now.

Drifting off topic but any tips on how best to generate the boilerplate page markup for this iframe so that admin theme styling for an AdminDataTable works. I'm about halfway there.

[adrian]

Hey guys - I actually removed that popup link I was using - not because it didn't work great with RuntimeMarkup, but for other reasons - anyway, I don't have the code I used for it anymore.

But, this works for me:

$url = 'http://www.example.com';
$out = '<button data-href="'.$url.'" type="button" name="button" class="pw-modal pw-modal-large ui-button ui-widget ui-corner-all ui-state-default">';
$out .= '<span class="ui-button-text">Image Archive</span></button>';
return "<div class='pfabLink'>".$out."</div>";

[SteveB]

Yup, working for me too. The only wierdness left has to do with button color. Using the default admin theme it's green and turns sort of purple after being clicked to launch the modal. It stays that color after the modal is closed and that seems wrong.

[kongondo]

Yeah, it needs to be refreshed (the button, i.e.)...

You can use JS for that. Which reminds me, This module comes with an empty InputfieldRuntimeMarkup.js...in which I foolishly state: 

/*Use this file for scripts (js) for your renderend Markup in the page edit in admin, i.e. in the rendered InputfieldRuntimeMarkup*/

...as if those wouldn't be overwritten on the next upgrade, grrr!

Anyway, I will either let the module check for and if found include an 'InputfieldRuntimeMarkupCustom.js', which won't get overwritten on upgrades, or simply, I will ship the module  without a  'InputfieldRuntimeMarkup.js' (and without a  'InputfieldRuntimeMarkup.css' as well). In that case, PW will autoload those files if found and they'll never get overwritten.

So, to your solution. Add the following to your 'InputfieldRuntimeMarkup.js': @note: I added an id="archives" to your button

$(document).ready(function(){
  $('button#archives').on('click', function(){
  //refresh button (remove 'ui-state-active') (only needed for default theme)
  $(this).button().button('refresh');
 });
})

The code could probably be optimized to only run if default admin theme is in use. Maybe could even be used inline but this is cleaner. Maybe there's better solutions as well. The blue (on Chrome) outline around the button can be removed using CSS.

Edited February 21, 2016 by kongondo

[SteveB]

Nice! I didn't know about button('refresh'). That works perfectly. Thanks so much for the module too.

I'll be posting something about this "archive" pretty soon in Module/Plugin Development.

[bernhard]

ok, adding buttons is easy and helpful. can someone help me out when i want to add input fields as well?

usecase is a simple form with one inputfield and one button to copy a page and save it with the name specified in the textfield.

i was able to display the field + button but i was not able to get the data of the field. my $input->post was empty all the time. i tried it like this:

return wireRenderFile('markup/_createcustomcopy');

<?php
$field = $modules->get("InputfieldText");
$field->label = "Name";
$field->attr('id+name','name');
$field->required = 1;
echo $field->render(); // append the field to the form

// oh a submit button!
$submit = $modules->get("InputfieldSubmit");
$submit->attr("value","create copy");
$submit->attr("id+name","createcustomcopy");
echo $submit->render();

echo print_r($input->post, true);

i hope someone can point me in the right direction

[Pete]

I don't share the warm fuzzy feelings I get when I use people's modules nearly often enough, so I just left a comment on the module directory page.

The short version is that it's saving me from having to create custom modules for a lot of places where I'd want to output some custom, processed output when editing a page and it is streamlining some of the steps I need to perform when approving entries in the dev directory, so thanks for this!

[kongondo]

@BernhardB,

You should be getting a couple of errors with that code (if you have debug on). In that context, PW doesn't know what $modules and $input are (see similar issues on page 1 of this thread). You need to use $this-> or wire('modules'). Secondly, the module will only return a string or integer. You need to save string/integer output in a variable (e.g. $out) and return $out;

[bernhard]

hi kongondo,

sorry, it seems i was not clear enough.

in the markup field settings i have

return wireRenderFile(...);

and in this file i have code like this

<?php
// some code here
$out .= 'xxx';
$out .= 'yyy';

echo $out;

so i think at least this should not be a problem as i am only returning a string of html. i was also confused why $modules was available in the file from wireRenderFile() but i guess it has something to do with that method. but to be honest i did not investigate that further.

[kongondo]

Aah, I see. That's a cool usage of the module you got there! . Using wireRenderFile() keeps the module's input clean, circumvents limit of text allowed in that field plus makes the module much more versatile. One can do all sorts of flexible includes from within the file rendered by wireRenderFile(), depending on the context.

I have tested and it works fine here creating a new page (see below). Cloning a page on the other hand leads to a cyclical error (or memory issue) and crashes Apache. 

In details tab of this module I have:

return wireRenderFile('test');

In /site/templates/test.php

$out ='';

$f = $modules->get("InputfieldText");
$f->label = "Copy Title";// @note: doesn't seem to work
$f->attr('id+name','name');
$f->required = 1;// @note: -ditto-
$out= $f->render(); // append the field to the form

// oh a submit button!
$f = $modules->get("InputfieldSubmit");
$f->attr("value","Create Copy");
$f->attr("id+name","createcustomcopy");
$out .= $f->render();

$currentPage = '';
$process = wire('process'); 
if($process && $process->className() == 'ProcessPageEdit') $currentPage = $process->getPage();
if(!$currentPage) return;

echo $out;

// let's create a copy
$copy = $input->post->createcustomcopy;
$title = $sanitizer->text($input->post->name);

if($copy) {

   if(!$title) {
     $this->error('You need to specify a title for the copied page!');
     return;
   }

   $p = new Page();
   $p->template = $templates->get($currentPage->template);
   $p->parent = $currentPage->parent;

   $p->title = $title;
   //sanitize and convert to a URL friendly page name
   $p->name = $sanitizer->pageName($p->title);

   //check if name already taken within same parent. if the same name exist, don't create a new copy
   //  @note; without this line pages were being created in duplicates
   if($p->parent->child("name={$p->name}, include=all")->id) return;
   else { 
       $p->save();
       $this->message('Created a copy of the page with the title: ' . $title);
   }
}

Edited February 24, 2016 by kongondo

[kongondo]

Following up on my post above...Say you wanted to embed a YouTube video...for whatever reason...in the page edit context..

<iframe width="420" height="315"
src="https://www.youtube.com/embed/Bohhf3aK8gU" frameborder="0" allowfullscreen>
</iframe>

That's it!

[bernhard]

that is awesome!!!! exactly what i wanted, thank you very much

Aah, I see. That's a cool usage of the module you got there! . Using wireRenderFile() keeps the module's input clean, circumvents limit of text allowed in that field plus makes the module much more versatile. One can do all sorts of flexible includes from within the file rendered by wireRenderFile(), depending on the context.

yes, i'm a huge fan of wirerenderfile

what do you think of having your module render a file with the name of the field by default?

field "examplefield" would render /site/assets/FieldtypeRuntimeMarkup/examplefield.php
field "examplefield2" would render /site/assets/FieldtypeRuntimeMarkup/examplefield2.php

[Gazley]

So, I tried to use RuntimeMarkup in my RepeaterMatrix and $page refers to the page that the repeater is on. I have placed the RuntimeMarkup field inside repeater entries and therefore, I can't see a way to get a reference to the Page field in the "current" repeater entry. Basically, if I can get a reference to the Page field each time it appears in the repeater, I can simply reference the field value is want from (Template2/Page2) straight from the Page field.

Thanks.

[kongondo]

I haven't tried this in a repeater...yet. so would have to do that before I can give an answer...unless someone beats me to it?

[kongondo]

@Gazley,

I don't think this is possible out of the box. Have a read here at a similar question:

https://processwire.com/talk/topic/8962-selectable-pages-defined-dynamically-for-page-field-in-repeater/

What you want is a way to get the current repeater item, basically the nth repeater. I haven't seen any way to do that without looping through all repeaters  - which wont be very efficient.

If your page field is a single page field, using a select, maybe we could use jQuery Ajax to dynamically send the id of the selected page to some template file which would then grab whatever it is you want from template 2, return that as JSON and dynamically add the markup next to the page field. I'm not sure, in your case, whether it's worth the effort going down that route.

Edited March 23, 2016 by kongondo

[kongondo]

Btw, above answer refers to normal repeaters. I haven't used repeater matrix before. I am wondering whether, unlike normal repeaters, will be able to give you a 'current repeater item' variable. Anybody knows? Haven't got time to test atm.

[bernhard]

working the first time with repeater matrix today and it is totally awesome!!

repeater items are just normal pages and you have all you need there:

current repeater-item available under $page variable;

field in your repeater-item-type = $page->yourfield;

current page, where your repeater matrix lives on = $page->getForPage();

don't know how that plays together with your module - i'm quite busy right now