Campaign preview



Hi everybody,

I’m implementing a new feature which is having a campaign preview, exactly in the same way as a single layout has its own preview.

A campaign preview shows:

  • its total duration,
  • the different layouts that are part of the campaign are shown as responsive vignettes.

I have added a preview campaign item in the campaign view submenu. I think this feature could be part of the core xibo-cms project, so first I would like to learn how to contribute, and second I would like to submit my code to the xibo dev team.

It’s almost done, I mean it’s working on my computer by now. Of course there must be some things to modify or to add (like internationalisation for example). I’m working in a branch and my parent branch is ‘develop’.


This sounds very interesting - thank you for your efforts!

We’d love to accept your contribution and have a topic dedicated to the process for doing so here.

We can use this topic to discuss the feature and how you’ve implemented it. If everything seems to be aligned then I will create an enhancement issue tagged to 1.8.0-beta.

The final step in the process is signing the CLA and submitting a pull request on GitHub so we can review the changes.

As a next step it would be great to understand exactly what we’d see on a campaign preview and what a vignettes is.



Thank you very much Dan for your quick answer,

OK I have a quite better understanding of the different necessary steps to be able to contribute.

Let me explain a little why I’m on this feature.
I’m working in a french company which deals with free software, and one of our client is using xibo. He would like this preview campaign feature to be donated to the xibo team, it’s part of the deal so I’m gonna talk with him and show him your CLA.

In order to explain what we mean by a “campaign preview”, here are two screenshots I’ve just made :

The ‘preview campaign’ code is currently located in our code repository, it’s a mirror of your xibo-cms github repository. I can show you and explain to you the diffs, the differences between your develop branch and my campaign-preview branch.

Thank you again !


Hi Gwen,

I understand a little better now what you are trying to achieve - essentially the campaign preview page opens another page which contains “layout preview” <iframes> showing layout previews for all the layouts assigned to the campaign.

That looks good to me - and I can see it being useful for people.

Is there a possibility of pushing this into a GitHub clone? We could then do a PR to completely understand the changes before applying them.


Hi Dan,

Yes exactly, the campaign preview page is opened in another page which contains the campaign layout’s preview frames. That’s exactly what I am doing and I’m glad that you think this feature could be useful.

I talked with my client, he’s ready to sign the CLA and he is about to make a gihub account and we will push the campaign-preview branch into it.

If you want to have a look at the code right now, it’s available here

juste make a

git clone

and then

git checkout feature/campaign-preview

But There’s a lot of small commits inside this branch, corresponding to small functionnalities. I will push this branch in my client’s github account with only one big commit so that you will easily see the diff from the develop branch, corresponding to the full feature.



As you say, it might be easier to wait until you’ve pushed it up to GitHub - I can review it, pull it, build it and test it without having to fiddle about.

As you say though - the feature sounds useful - so if its implemented in line with the rest of Xibo then it should be simple including it.


You’re right,

I was afraid that my client would spend some time creating his github account,
but it has been quickly done.

His github user is LesCrous, here is his forked xibo-cms project. As I said, the code is located in the feature/campaign-preview branch.

I let you have a look, feel free to ask me anything about the code.



Great, thanks.

I’ve created a PR and will comment on a few minor bits and pieces asap.


Thank you Dan,

I’m waiting for you code review. Feel free to criticize me.


I’ve only added a handful of notes actually - generally speaking it looks good :champagne:


Thank you very much :slight_smile:

Actually I have one or two little things more to do in this feature. The preview campaign page is not internationalised. And my client would like to have the campaign duration shown in the campaign view page list (by now only the name and the number of layouts are available).

Shall I push the code I am going to commit in the same pull request, or do you want me to ask the xibo team for another pull request ?


I will leave the PR open, so just push into that branch and let me know when the feature is complete. I’ll take another good look through it at that point and hopefully merge it in.



Hi Dan,

Now it’s OK for me, the campaign-preview feature seems to be finished.
I am impatiently waiting for your review/comment/criticize.

It seems to be a failed unit test check in the PR, since I don’t have access to your jenkins I don’t kow exactly what it is all about.


Thank you very much to all the Xibo team :slight_smile:


Thank you for all your work to get that feature in :slight_smile:


I’ve found a little bug in my campaign preview feature, and since my
old pull request has been merged in the develop branch I have asked you for a new one.

As I am a newcomer in the use of slim and twig, I used the date filter
to format a duration in seconds, which is wrong : the date filter doesn’t accept a number of seconds. The correct way to do so is adding a twig extension to format a number of seconds properly.

Here is my new PR

Sorry for the inconvenience


That all looks good to me @gwen, ill merge that in.

Thanks very much.


Thanks to you Dan :slight_smile: