Sharing my starter block for dynamic items.
Permalink 2 users found helpful
Just posting this starter block file I use for creating dynamic item blocks in 5.7. Hopefully this will help someone in creating their blocks (especially those like me who aren't heavy lifting developers)
This is a simple base that can be used for creating custom sliders, link builders..whatever..
Place it directly in /application/blocks/
Dynamically add: Text inputs, Select box, Image/File Selector, Page Selector & Redactor.
Uses underscore templates in the form just like image_slider. If you're not familiar with them, this may be a simple/easy introduction to it.
// I'd be happy to put this in Git if anyone thinks it's worth adding to or cleaning up.
This is a simple base that can be used for creating custom sliders, link builders..whatever..
Place it directly in /application/blocks/
Dynamically add: Text inputs, Select box, Image/File Selector, Page Selector & Redactor.
Uses underscore templates in the form just like image_slider. If you're not familiar with them, this may be a simple/easy introduction to it.
// I'd be happy to put this in Git if anyone thinks it's worth adding to or cleaning up.
edit - Of course, but what do you mean in particular?
An example of something you made based on this would be very helpful.
Documenting how you made the example would be even better.
Out of curiosity, were you an ASP developer?
Documenting how you made the example would be even better.
Out of curiosity, were you an ASP developer?
I assume you ask that because of the <% %> tags? :)
The <% %> tags come from the underscore template. Anything inside of <% %> while within the template is just javascript. (see:http://underscorejs.org/#template)...
In lines 173 - 199, it's defining javascript/underscore template variables from our PHP variables.
Here's an example of a block made from that with a few changes.
The <% %> tags come from the underscore template. Anything inside of <% %> while within the template is just javascript. (see:http://underscorejs.org/#template)...
In lines 173 - 199, it's defining javascript/underscore template variables from our PHP variables.
Here's an example of a block made from that with a few changes.
Thank you, this is an interesting example.
This is really great. Very cool work with the page selector. We want to add page selector support to our Image Slider and, as I'm sure you're aware since you've done more work on this than we have – it's really a pain in the butt using the page selector with underscore-based templates. To the point where I'm considering refactoring the page selector widget to be primarily javascript based, and the PHP class that calls it really just calls JavaScript.
Thoughts?
Thoughts?
Yeah I kept banging my head against a wall for a while trying to make some magic work with the page selector. Finally landed on the fairly basic solution of making the verbose widget output an include.
So yes, an easier way to launch that with JS would be nice. No real thoughts or preferences, but I'd be highly interested in seeing what you come up with.
So yes, an easier way to launch that with JS would be nice. No real thoughts or preferences, but I'd be highly interested in seeing what you come up with.
+20 for javascript based page selector.. I'm working on some dashboard UI's that use angular and its a struggle to get it going
This is coming in 5.7.3 and is currently in the develop branch.
Sent from my iPhone
> On Dec 14, 2014, at 11:11 PM, concrete5 Community <discussions@concretecms.com> wrote:
Sent from my iPhone
> On Dec 14, 2014, at 11:11 PM, concrete5 Community <discussions@concretecms.com> wrote:
Just learning how to build dynamic blocks, this really helped me out. Thank you sir.
Did you ever stick it on github?
Did you ever stick it on github?
I've built a new "dynamic items" starter block, up to date with Concrete5.8. Currently it only has a title field for each item, but the basic functionality for the repeatable item is there.
The repo is on github:
https://github.com/ob7/repeatable_element...
(EDIT 11/01/2016 - the repo is kind of outdated, http://www.concrete5.org/marketplace/addons/dynamic-images/... is more up to date)
I've added a couple things I've been wanting in a block like this:
1. Each item in the form is labeled by its placement and content.
2. There is a collapse / expand all button at the top.
3. Like the image slider, adding a new item will bring you to that slide in the form so you don't manually need to scroll down, but it does so in a way that no matter how many items you add it still jumps to the bottom, whereas the C5 image_slider form currently will stop jumping to the bottom after about 700pxs of height in the form.
4. Don't need to confirm deleting an item.
I've took the extra time to comment the code pretty well so someone else getting started with block development can understand how a dynamic items block is coded.
Big thanks to original poster for sharing his starter block a couple years ago, I've built dozens of blocks for clients using it, and has been a tremendous help in building websites in C5.
I've been wanting to do this for a while now, and now here it is! I used the built in image_slider as a road map for how to do this (so even huger thanks to C5 Core team for providing such good code to go by). Since this new starter block was coded from the ground up, everything should be fresh and to the point. I hope it will be as helpful to others as MikeG's orginal dynamic items starter block was to me.
Any issues just post to github. Anything the more experienced developers here think I could improve on with this please let me know.
The repo is on github:
https://github.com/ob7/repeatable_element...
(EDIT 11/01/2016 - the repo is kind of outdated, http://www.concrete5.org/marketplace/addons/dynamic-images/... is more up to date)
I've added a couple things I've been wanting in a block like this:
1. Each item in the form is labeled by its placement and content.
2. There is a collapse / expand all button at the top.
3. Like the image slider, adding a new item will bring you to that slide in the form so you don't manually need to scroll down, but it does so in a way that no matter how many items you add it still jumps to the bottom, whereas the C5 image_slider form currently will stop jumping to the bottom after about 700pxs of height in the form.
4. Don't need to confirm deleting an item.
I've took the extra time to comment the code pretty well so someone else getting started with block development can understand how a dynamic items block is coded.
Big thanks to original poster for sharing his starter block a couple years ago, I've built dozens of blocks for clients using it, and has been a tremendous help in building websites in C5.
I've been wanting to do this for a while now, and now here it is! I used the built in image_slider as a road map for how to do this (so even huger thanks to C5 Core team for providing such good code to go by). Since this new starter block was coded from the ground up, everything should be fresh and to the point. I hope it will be as helpful to others as MikeG's orginal dynamic items starter block was to me.
Any issues just post to github. Anything the more experienced developers here think I could improve on with this please let me know.
Thank you, I installed this and am looking over the code.
Did you make it?
Would you be open to explaining some of your workflow for creating blocks with this?