Download & Extend

Panopoly jQuery UI settings conflict with jQuery UI in MediaFront

Project:Panopoly
Version:7.x-1.0-rc3
Component:Code
Category:support request
Priority:normal
Assigned:Unassigned
Status:closed (works as designed)

Issue Summary

I filed #1858710: Progress and volume sliders need to be adjusted with MediaFront and then realized everything looked fine on straight Drupal 7. It looks like there might be some conflict with Panopoly Core but I'm not exactly sure.

Any idea from just looking at this what specifically might be the cause?
http://monosnap.com/image/zq57AhZXbBbvyj26P9nIEqxWD

If not, I'll keep digging around the MediaFront CSS.

Thanks!

Comments

#1

Status:active» postponed (maintainer needs more info)

Nothing specific comes to mind, but can you narrow it down using a CSS inspector to a particular CSS style?

#2

Looks like the class is -
ui-slider-range ui-slider-range-min ui-widget-header

CSS files -
http://drupalcode.org/project/mediafront.git/blob/refs/heads/7.x-2.x:/pl...
http://drupalcode.org/project/mediafront.git/blob/refs/heads/7.x-2.x:/pl...

You can see the issue here -
http://live.pushtape-panels.gotpantheon.com/video

If its not obvious what might conflict on the Panopoly side, I'll keep bugging travis and see if we can fix with css.

Thanks again populist!

#3

Well the mediafront player's jQuery UI classes should be namespaced with .player-ui. You can see this by looking at the template folders where I have pre-built jQuery UI themes. I bet Panopoly is coming in after mediafront with non-namespaced jQuery UI and overriding the classes.

#4

Here is an example of the namespaced jQuery UI classes that mediafront pulls from. https://github.com/mediafront/osmplayer/blob/2.x/jquery-ui/dark-hive/jqu...

#5

Thanks for jumping in Travis and posting #1859600: The mediafront jQuery UI seems to collide with Panopoly jQuery UI settings. We'll be happy to use our Pushtape Panopoly branch for testing video and audio implementations of MediaFront. Maybe that can pave the way for some MediaFront presets on Panopoly itself!

#6

Title:Any idea what part of Panopoly would conflict with MediaFront UI?» Panopoly jQuery UI settings conflict with jQuery UI

As Travis pointed out in #1859600: The mediafront jQuery UI seems to collide with Panopoly jQuery UI settings., panopoly-jquery-ui-theme.css adding a padding to the ui-widget-header is causing a conflict with jQuery UI in MediaFront. For a quick and dirty fix, I commented out the following from panopoly-jquery-ui-theme.css:

  padding: 0 14px 0 24px;
  min-height: 25px;

From what I can tell, this has not broken anything else on http://live.pushtape-panels.gotpantheon.com/, but I'm assuming this padding should stay in panopoly-jquery-ui-theme.css?

#7

Title:Panopoly jQuery UI settings conflict with jQuery UI» Panopoly jQuery UI settings conflict with jQuery UI in MediaFront

#8

Status:postponed (maintainer needs more info)» closed (works as designed)

I am open to changing the CSS with Panopoly's jQuery UI but we wouldn't want to break it for others (especially if you can specify the CSS on your site/distro). As par #6, I think the padding should stay in panopoly-jquery-ui-theme.css and just be overriden elsewhere.

nobody click here