diff --git a/roles/apps-fp-o/files/fedmenu/css/demo.css b/roles/apps-fp-o/files/fedmenu/css/demo.css new file mode 100644 index 0000000000..e8fd8fc1fa --- /dev/null +++ b/roles/apps-fp-o/files/fedmenu/css/demo.css @@ -0,0 +1,3 @@ +.fm-intro { + padding-bottom: 15px; +} diff --git a/roles/apps-fp-o/files/fedmenu/css/fedmenu.css b/roles/apps-fp-o/files/fedmenu/css/fedmenu.css index 1ae80b59e4..bf6275c517 100644 --- a/roles/apps-fp-o/files/fedmenu/css/fedmenu.css +++ b/roles/apps-fp-o/files/fedmenu/css/fedmenu.css @@ -165,7 +165,7 @@ font-family: Montserrat; display: inline-block; vertical-align: top; - font-size: 8pt; + font-size: 12pt; padding: 15px; } .fedmenu-panel ul { diff --git a/roles/apps-fp-o/files/fedmenu/js/fedmenu.js b/roles/apps-fp-o/files/fedmenu/js/fedmenu.js index ca8417b5e5..d8c0dee16c 100644 --- a/roles/apps-fp-o/files/fedmenu/js/fedmenu.js +++ b/roles/apps-fp-o/files/fedmenu/js/fedmenu.js @@ -3,49 +3,56 @@ var fedmenu = function(options) { $(document).ready(function() { 'url': 'https://apps.fedoraproject.org/js/data.js', 'mimeType': undefined, // Only needed for local development + 'context': document, // Alternatively, parent.document for iframes. + 'position': 'bottom-left', 'user': null, 'package': null, - } + }; + // Our options object is called 'o' for shorthand var o = $.extend({}, defaults, options || {}); + // Also, hang on to the selector context with a shorthand 'c' + var c = o['context']; + var buttons = ""; - if (o['user'] != null) buttons += '
'; - if (o['package'] != null) buttons += '
'; + if (o.user !== null) buttons += '
'; + if (o.package !== null) buttons += '
'; buttons += '
'; var script = $("script[src$='fedmenu.js']").attr('src'); var base = script.slice(0, -13); - $('body').append(''); - $('body').append( + $('body', c).append(''); + $('body', c).append( '
' + buttons + '
'); - $('body').append('
'); + $('body', c).append('
'); - $('body').append('
'); - $('#fedmenu-main-content').append("❌"); - $('#fedmenu-main-content').append("

Fedora Infrastructure Apps

"); + $('body', c).append('
'); + $('#fedmenu-main-content', c).append("❌"); + $('#fedmenu-main-content', c).append("

Fedora Infrastructure Apps

"); - if (o['user'] != null) { - var imgurl = libravatar.url(o['user']); - $('#fedmenu-user-button .img').css('background-image', 'url("' + imgurl + '")'); - $('body').append('
'); - $('#fedmenu-user-content').append("❌"); - $('#fedmenu-user-content').append("

View " + o['user'] + " in other apps

"); + var imgurl; + if (o.user !== null) { + imgurl = libravatar.url(o.user); + $('#fedmenu-user-button .img', c).css('background-image', 'url("' + imgurl + '")'); + $('body', c).append('
'); + $('#fedmenu-user-content', c).append("❌"); + $('#fedmenu-user-content', c).append("

View " + o.user + " in other apps

"); } - if (o['package'] != null) { + if (o.package !== null) { /* This icon is not always going to exist, so we should put in an * apache rule that redirects to a default icon if this file * isn't there. */ - var imgurl = 'https://apps.fedoraproject.org/packages/images/icons/' + o['package'] + '.png'; - $('#fedmenu-package-button .img').css('background-image', 'url("' + imgurl + '")'); - $('body').append('
'); - $('#fedmenu-package-content').append("❌"); - $('#fedmenu-package-content').append("

View the " + o['package'] + " package elsewhere

"); + imgurl = 'https://apps.fedoraproject.org/packages/images/icons/' + o.package + '.png'; + $('#fedmenu-package-button .img', c).css('background-image', 'url("' + imgurl + '")'); + $('body', c).append('
'); + $('#fedmenu-package-content', c).append("❌"); + $('#fedmenu-package-content', c).append("

View the " + o.package + " package elsewhere

"); } // Define three functions used to generate the content of the menu panes @@ -60,7 +67,7 @@ var fedmenu = function(options) { $(document).ready(function() { ""; }); html = html + ""; - $("#fedmenu-main-content").append(html); + $("#fedmenu-main-content", c).append(html); }; var make_user_content_html = function(i, node) { @@ -69,9 +76,9 @@ var fedmenu = function(options) { $(document).ready(function() { var found = false; $.each(node.children, function(j, leaf) { - if (leaf.data.user_url != undefined) { + if (leaf.data.user_url !== undefined) { found = true; - var url = leaf.data.user_url.replace('{user}', o['user']) + var url = leaf.data.user_url.replace('{user}', o.user); html = html + "
  • " + $("

    " + leaf.name + "

    ").text() + @@ -80,7 +87,7 @@ var fedmenu = function(options) { $(document).ready(function() { }); if (found) { html = html + ""; - $("#fedmenu-user-content").append(html); + $("#fedmenu-user-content", c).append(html); } }; @@ -90,9 +97,9 @@ var fedmenu = function(options) { $(document).ready(function() { var found = false; $.each(node.children, function(j, leaf) { - if (leaf.data.package_url != undefined) { + if (leaf.data.package_url !== undefined) { found = true; - var url = leaf.data.package_url.replace('{package}', o['package']) + var url = leaf.data.package_url.replace('{package}', o.package); html = html + "
  • " + $("

    " + leaf.name + "

    ").text() + @@ -101,7 +108,7 @@ var fedmenu = function(options) { $(document).ready(function() { }); if (found) { html = html + ""; - $("#fedmenu-package-content").append(html); + $("#fedmenu-package-content", c).append(html); } }; @@ -109,15 +116,16 @@ var fedmenu = function(options) { $(document).ready(function() { url: o.url, mimeType: o.mimeType, dataType: 'script', + cache: true, error: function(err) { console.log('Error getting ' + o.url); console.log(err); }, success: function(script) { $.each(json.children, make_main_content_html); - if (o['user'] != null) + if (o.user !== null) $.each(json.children, make_user_content_html); - if (o['package'] != null) + if (o.package !== null) $.each(json.children, make_package_content_html); }, }); @@ -127,21 +135,22 @@ var fedmenu = function(options) { $(document).ready(function() { "#fedmenu-" + t + "-button," + "#fedmenu-" + t + "-content"; }; - var activate = function(t) { $(selector(t)).addClass('fedmenu-active'); }; - var deactivate = function(t) { $(selector(t)).removeClass('fedmenu-active'); }; + var activate = function(t) { $(selector(t), c).addClass('fedmenu-active'); }; + var deactivate = function(t) { $(selector(t), c).removeClass('fedmenu-active'); }; var click_factory = function(t) { return function() { - if ($(this).hasClass('fedmenu-active')) + if ($(this).hasClass('fedmenu-active')) { deactivate(t); - else + } else { // Deactivate any others that may be active before starting anew. deactivate('main'); deactivate('user'); deactivate('package'); activate(t); + } };}; - $("#fedmenu-main-button").click(click_factory('main')); - $("#fedmenu-user-button").click(click_factory('user')); - $("#fedmenu-package-button").click(click_factory('package')); - $("#fedmenu-wrapper,.fedmenu-exit").click(function() { + $("#fedmenu-main-button", c).click(click_factory('main')); + $("#fedmenu-user-button", c).click(click_factory('user')); + $("#fedmenu-package-button", c).click(click_factory('package')); + $("#fedmenu-wrapper,.fedmenu-exit", c).click(function() { deactivate('main'); deactivate('user'); deactivate('package');