When you go to:

Admin > Structure > Pages > Add custom page > Flexible > blah blah. At the screen you see: "Title type" / "Title", you also see the option to enable the layout builder there:

Buttons to show layout editor, which then pops up a drag and drop interface

We should do the same thing for Flexible layout.

CommentFileSizeAuthor
#1 mypage.png98.95 KBGábor Hojtsy
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

Gábor Hojtsy’s picture

Version: » 7.x-1.x-dev
FileSize
98.95 KB

Ok, so some of this is already possible, but definitely not fully integrated. This is in the page manager flow:

1. You want to create a new page.
2. For layout, you pick flexible layout *BUILDER*. This means you get the whole builder experience included.
3. As you go forward, the layout is saved with your page and you get the screen posted above for the Content editing screen.
4. On this screen, you can edit the content by default (with the gears), or switch to layout editing mode (with the Show layout designer), in which case, the full layout editor is replacing the content editor (ajax).
5. If you press the "Reuse layout" button, you get a pop-up which let's you save this layout globally in Panels. Until you do that, the layout is only local to this page and is not available globally.
6. If you do save the page globally, then these two buttons disappear, and you can only edit the layout on the Panels UI, not in-place here.

So the conclusion is that with that workflow, only the builder-built in-place layouts would need this workflow, which was not really focus of testing our efforts so far. There is an interesting bug with this flow:

1. You can choose the responsive layout *builder* in page manager.
2. You can edit the layout in the embedded layout editor.
3. The layout is actually saved with the page (good news :).
4. BUG: the content editor screen does not let you actually edit the content of the page in this case. It keeps showing the layout editor:
mypage.png
(there is no way to actually assign content to builder-built layouts).

I need to take a deeper look as to how this is integrated with page manager and what we should do. This might or might not need some serious work on the panels integration side.

lslinnet’s picture

Assigned: Unassigned » lslinnet

I have started looking at a possible implementation of this.

Initial thoughs is to output the regions in a hidden html element and let the responsiveLayout pull it into the different regions in the frontend.

Gábor Hojtsy’s picture

I think the best would be to just see what the Panels built-in flexible layout editor does (it does some editor / content placement UI context switching in JS but I could not track down how it can do both). Coming up with our own solution might be more time consuming and could probably lead to developer confusion. At least it would if I would do it :D

lslinnet’s picture

In essence it is the same approach I'm taking on it, basically loading both the ordinary panels region and the RLD region in the same box, and then switch between the two by toggling css classes on the container. (on the layout page this option should be disabled as it's doesn't make sense to add there.

I have created a sandbox (fork) of the layout project where I'm working on this issue. (http://drupal.org/sandbox/lslinnet/1749614) - I have added the panel regions to the layout editor. (currently test it by creating a new panel page and select responsive layout builder for it (not a preconfigured responsive layout).

webchick’s picture

Awesome, thank you! Would you be able to create a patch from your work and upload it here for testing?

lslinnet’s picture

Sure thing once it's ready for review etc. got a few elements I need to figure out first.

  • How to disable the ability to move regions around when RLD is disabled
  • Where exactly should the switch button be placed - and how should it look (as a base I'm think just a standard button which changes text based on current state)
lslinnet’s picture

I have run into a problem with the approach of switching region content based on state (grid editing / panel pane region editing).

When switching between the different sizes of precieved viewport it kill all bound javascript event for it's containers.

I haven't had any luck resolving this issue yet - so hoping someone have any feedback which might be usefull on this - will try and get a patch up of my current progress (else you can pull from the above mentioned sandbox).