Hi Guillaume,
I'm also +1 for A with the provision that you implement a feedback to the
user when the browser is processing and the preview is not up to date. I
was thinking about a gray transparent foreground over the preview for
example, with may be a CSS based spinner. Moreover, for those having very
slow computer, having a way to disable the automatic refresh will be nice
to have.
I really dislike B since it is "artificial" and will surely became out of
sync. However, the features of editing properties in-place over the preview
would be surely easier to do in B. This was a very interesting feature of
the first theme editor. Do you think that we could find a way to do that
with A for let say the most common style that is usually changed ? (By
detection of style in the preview ?)
Thanks,
On Tue, Jun 3, 2014 at 6:06 PM, Guillaume "Louis-Marie" Delhumeau <
gdelhumeau(a)xwiki.com> wrote:
Good evening,
We have discussed recently about the necessity of having a new Color Theme
Editor for Flamingo. Some of you have suggested to try to integrate in
XWiki an existing Bootstrap Customizer such as FancyBoot:
http://fancyboot.designspebam.com/
After looking on Google and Github, I could not find any that matches this
criterias:
- Bootstrap 3 support
- active
- compatible with an XWiki integration
That is why I propose to write our own, which could actually take some code
from existing projects.
On my side, I have written 2 prototypes and I have pushed them in a new
github repository:
https://github.com/xwiki-contrib/bootstrap-customizer-prototypes
Prototype A
====
Demo:
http://xwiki-contrib.github.io/bootstrap-customizer-prototypes/prototypeA/
(chrome users: please refresh the page if you do not see a color picker
when you click on an input box)
This prototype opens a real web page inside an iframe, and use the LESS
browser compiler to update the CSS.
Pros:
- it uses LESS so it shows the **real** results
- any wiki page can be seen in the preview frame
- not so hard time to implement
Cons:
- it is quite slow, and sometimes the browser gets frozen for a few
seconds.
Prototype B
====
Demo:
http://xwiki-contrib.github.io/bootstrap-customizer-prototypes/prototypeB/
This prototype emulates the behaviour of LESS when we change some
variables. The results is displayed in a preview box, but it is a fake one.
Pros:
- The prototype runs quickly in the browser because there is no LESS
compiler involved.
Cons:
- The preview box is not a real page and it cannot show all use-cases.
- Will take more time to implement and to maintain because we have to
manually emulate what LESS would do in the preview box.
I'm +1 for Prototype A.
What do you think?
Thanks,
Guillaume
_______________________________________________
devs mailing list
devs(a)xwiki.org
http://lists.xwiki.org/mailman/listinfo/devs
--
Denis Gervalle
SOFTEC sa - CEO