diff --git a/app/assets/javascripts/darkswarm/controllers/group_page_controller.js.coffee b/app/assets/javascripts/darkswarm/controllers/group_page_controller.js.coffee
index 5d9bb0aa02..da67840752 100644
--- a/app/assets/javascripts/darkswarm/controllers/group_page_controller.js.coffee
+++ b/app/assets/javascripts/darkswarm/controllers/group_page_controller.js.coffee
@@ -19,3 +19,4 @@ Darkswarm.controller "GroupPageCtrl", ($scope, group_enterprises, Enterprises, M
$scope.map = angular.copy MapConfiguration.options
$scope.mapMarkers = OfnMap.enterprise_markers visible_enterprises
+ $scope.embedded_layout = window.location.search.indexOf("embedded_shopfront=true") != -1
\ No newline at end of file
diff --git a/app/assets/javascripts/darkswarm/directives/target_blank.js.coffee b/app/assets/javascripts/darkswarm/directives/target_blank.js.coffee
new file mode 100644
index 0000000000..f7d52f07bf
--- /dev/null
+++ b/app/assets/javascripts/darkswarm/directives/target_blank.js.coffee
@@ -0,0 +1,6 @@
+Darkswarm.directive "embeddedTargetBlank", ->
+ restrict: 'A'
+ compile: (element) ->
+ elems = (element.children().find("a"))
+ if window.location.search.indexOf("embedded_shopfront=true") != -1
+ elems.attr("target", "_blank")
\ No newline at end of file
diff --git a/app/assets/javascripts/darkswarm/services/enterprise_modal.js.coffee b/app/assets/javascripts/darkswarm/services/enterprise_modal.js.coffee
index a0fb3ce5c5..ae43c85090 100644
--- a/app/assets/javascripts/darkswarm/services/enterprise_modal.js.coffee
+++ b/app/assets/javascripts/darkswarm/services/enterprise_modal.js.coffee
@@ -3,6 +3,7 @@ Darkswarm.factory "EnterpriseModal", ($modal, $rootScope)->
new class EnterpriseModal
open: (enterprise)->
scope = $rootScope.$new(true) # Spawn an isolate to contain the enterprise
+ scope.embedded_layout = window.location.search.indexOf("embedded_shopfront=true") != -1
scope.enterprise = enterprise
$modal.open(templateUrl: "enterprise_modal.html", scope: scope)
diff --git a/app/assets/javascripts/templates/partials/enterprise_header.html.haml b/app/assets/javascripts/templates/partials/enterprise_header.html.haml
index 066ebdd957..bb07fdd019 100644
--- a/app/assets/javascripts/templates/partials/enterprise_header.html.haml
+++ b/app/assets/javascripts/templates/partials/enterprise_header.html.haml
@@ -2,7 +2,7 @@
.highlight-top.row
.small-12.medium-7.large-8.columns
%h3{"ng-if" => "::enterprise.is_distributor"}
- %a{"ng-href" => "{{::enterprise.path}}", "ofn-change-hub" => "enterprise"}
+ %a{"ng-href" => "{{::enterprise.path}}", "ofn-change-hub" => "enterprise", "ng-attr-target" => "{{ embedded_layout ? '_blank' : undefined}}"}
%i{"ng-class" => "::enterprise.icon_font"}
%span{"ng-bind" => "::enterprise.name"}
%h3{"ng-if" => "::!enterprise.is_distributor", "ng-class" => "::{'is_producer' : enterprise.is_primary_producer}"}
diff --git a/app/assets/javascripts/templates/partials/hub_details.html.haml b/app/assets/javascripts/templates/partials/hub_details.html.haml
index 5fb0c93696..baa9055305 100644
--- a/app/assets/javascripts/templates/partials/hub_details.html.haml
+++ b/app/assets/javascripts/templates/partials/hub_details.html.haml
@@ -14,7 +14,7 @@
{{'hubs_delivery' | t}}
.row
.columns.small-12
- %a.cta-hub{"ng-href" => "{{::enterprise.path}}",
+ %a.cta-hub{"ng-href" => "{{::enterprise.path}}", "ng-attr-target" => "{{ embedded_layout ? '_blank' : undefined}}",
"ng-class" => "{primary: enterprise.active, secondary: !enterprise.active}",
"ofn-change-hub" => "enterprise"}
.hub-name{"ng-bind" => "::enterprise.name"}
diff --git a/app/assets/stylesheets/darkswarm/embedded_shopfront.css.scss b/app/assets/stylesheets/darkswarm/embedded_shopfront.css.scss
index b29acab34e..bc02417b55 100644
--- a/app/assets/stylesheets/darkswarm/embedded_shopfront.css.scss
+++ b/app/assets/stylesheets/darkswarm/embedded_shopfront.css.scss
@@ -1,3 +1,5 @@
+@import "typography";
+
body.embedded {
nav.top-bar {
ul.left, ul.center, ul.right li.current_hub {
@@ -28,6 +30,22 @@ body.embedded {
footer {
display: none;
}
+
+ .powered-by-embedded {
+ display: block;
+ }
+
+ .contact {
+ display: none;
+ }
+
+ .embedded-fullwidth {
+ width: 100%;
+ }
+
+ #group-page header {
+ display: none;
+ }
}
nav.top-bar ul.right li.powered-by {
@@ -51,6 +69,17 @@ nav.top-bar ul.right li.powered-by {
}
}
+.powered-by-embedded {
+ opacity: 0.6;
+ @include headingFont;
+ font-size: 1rem;
+ font-weight: 300;
+ color: #555;
+ padding: 0 !important;
+ display: none;
+ margin-top: 6px;
+ }
+
.blocked-cookies {
text-align: center;
margin-bottom: 0 !important;
diff --git a/app/views/groups/show.html.haml b/app/views/groups/show.html.haml
index 90b74c0b42..bd15ce9a76 100644
--- a/app/views/groups/show.html.haml
+++ b/app/views/groups/show.html.haml
@@ -31,7 +31,7 @@
.small-12.columns.pad-top
.row
- .small-12.medium-12.large-9.columns
+ .small-12.medium-12.large-9.embedded-fullwidth.columns
%div{"ng-controller" => "GroupTabsCtrl"}
%tabset
%tab{heading: t(:label_map),
@@ -48,9 +48,10 @@
%tab{heading: t(:groups_about),
active: "tabs.about.active",
select: "select(\'about\')"}
- %h1
- = t :groups_about
- %p!= @group.long_description
+ .about{ "embedded_target_blank" => true }
+ %h1
+ = t :groups_about
+ %p!= @group.long_description
%tab{heading: t(:groups_producers),
active: "tabs.producers.active",
@@ -103,7 +104,7 @@
= render 'shared/components/enterprise_no_results'
- .small-12.medium-12.large-3.columns
+ .small-12.medium-12.large-3.columns.contact
= render 'contact'
.small-12.columns.pad-top
@@ -119,7 +120,11 @@
%i.ofn-i_050-mail-circle
=link_to_service "http://", @group.website, title: t(:groups_contact_website) do
%i.ofn-i_049-web
- %p
-
+ .powered-by-embedded
+ %img{src: '/favicon.ico'}
+ %span
+ = t 'powered_by'
+ %span
+ = t 'title'
-= render "shared/footer"
+= render "shared/footer"
\ No newline at end of file
diff --git a/app/views/producers/_fat.html.haml b/app/views/producers/_fat.html.haml
index 8ef6282cb7..190e244bb5 100644
--- a/app/views/producers/_fat.html.haml
+++ b/app/views/producers/_fat.html.haml
@@ -76,7 +76,7 @@
.row.cta-container
.columns.small-12
%a.cta-hub{"ng-repeat" => "hub in producer.hubs | visible | orderBy:'-active'",
- "ng-href" => "{{::hub.path}}", "ofn-change-hub" => "hub",
+ "ng-href" => "{{::hub.path}}", "ng-attr-target" => "{{ embedded_layout ? '_blank' : undefined }}", "ofn-change-hub" => "hub",
"ng-class" => "::{primary: hub.active, secondary: !hub.active}"}
%i.ofn-i_068-shop-reversed{"ng-if" => "::hub.active"}
%i.ofn-i_068-shop-reversed{"ng-if" => "::!hub.active"}
diff --git a/app/views/producers/_skinny.html.haml b/app/views/producers/_skinny.html.haml
index 8c0a71e7e3..9771576842 100644
--- a/app/views/producers/_skinny.html.haml
+++ b/app/views/producers/_skinny.html.haml
@@ -1,7 +1,7 @@
.row.active_table_row{"ng-click" => "toggle($event)", "ng-class" => "{'closed' : !open(), 'is_distributor' : producer.is_distributor}"}
.columns.small-12.medium-8.large-8.skinny-head
%span{"ng-if" => "::producer.is_distributor" }
- %a.is_distributor{"ng-href" => "{{::producer.path}}"}
+ %a.is_distributor{"ng-href" => "{{::producer.path}}", "ng-attr-target" => "{{ embedded_layout ? '_blank' : undefined}}"}
.row.vertical-align-middle
.columns.small-2.medium-2.large-2
%i{ng: {class: "::producer.producer_icon_font"}}
diff --git a/app/views/shops/_skinny.html.haml b/app/views/shops/_skinny.html.haml
index 1a5627bd26..6a67f4eed9 100644
--- a/app/views/shops/_skinny.html.haml
+++ b/app/views/shops/_skinny.html.haml
@@ -1,6 +1,6 @@
.row.active_table_row{"ng-if" => "hub.is_distributor", "ng-click" => "toggle($event)", "ng-class" => "{'closed' : !open(), 'is_distributor' : producer.is_distributor}"}
.columns.small-12.medium-5.large-5.skinny-head
- %a.hub{"ng-href" => "{{::hub.path}}", "ng-class" => "{primary: hub.active, secondary: !hub.active}", "ofn-change-hub" => "hub", "data-is-link" => "true"}
+ %a.hub{"ng-href" => "{{::hub.path}}", "ng-attr-target" => "{{ embedded_layout ? '_blank' : undefined}}", "ng-class" => "{primary: hub.active, secondary: !hub.active}", "ofn-change-hub" => "hub", "data-is-link" => "true"}
%i{ng: {class: "::hub.icon_font"}}
%span.margin-top.hub-name-listing{"ng-bind" => "::hub.name | truncate:40"}
@@ -11,7 +11,7 @@
%span.margin-top{"ng-if" => "hub.distance != null && hub.distance > 0"} ({{ hub.distance / 1000 | number:0 }} km)
.columns.small-4.medium-3.large-3.text-right{"ng-if" => "::hub.active"}
- %a.hub.open_closed{"ng-href" => "{{::hub.path}}", "ng-class" => "{primary: hub.active, secondary: !hub.active}", "ofn-change-hub" => "hub"}
+ %a.hub.open_closed{"ng-href" => "{{::hub.path}}", "ng-attr-target" => "{{ embedded_layout ? '_blank' : undefined}}", "ng-class" => "{primary: hub.active, secondary: !hub.active}", "ofn-change-hub" => "hub"}
%i.ofn-i_068-shop-reversed
%span.margin-top{ ng: { if: "::current()" } }
%em= t :hubs_shopping_here
@@ -19,7 +19,7 @@
%span{"ng-bind" => "::hub.orders_close_at | sensible_timeframe"}
.columns.small-4.medium-3.large-3.text-right{"ng-if" => "::!hub.active"}
- %a.hub.open_closed{"ng-href" => "{{::hub.path}}", "ng-class" => "{primary: hub.active, secondary: !hub.active}", "ofn-change-hub" => "hub"}
+ %a.hub.open_closed{"ng-href" => "{{::hub.path}}", "ng-attr-target" => "{{ embedded_layout ? '_blank' : undefined}}", "ng-class" => "{primary: hub.active, secondary: !hub.active}", "ofn-change-hub" => "hub"}
%span.margin-top{ ng: { if: "::current()" } }
%em= t :hubs_shopping_here
%span.margin-top{ ng: { if: "::!current()" } }
diff --git a/spec/features/consumer/shopping/embedded_groups_spec.rb b/spec/features/consumer/shopping/embedded_groups_spec.rb
index 789d28f007..4122fb30ce 100644
--- a/spec/features/consumer/shopping/embedded_groups_spec.rb
+++ b/spec/features/consumer/shopping/embedded_groups_spec.rb
@@ -5,29 +5,74 @@ feature "Using embedded shopfront functionality", js: true do
Capybara.server_port = 9999
describe 'embedded groups' do
- let(:enterprise) { create(:distributor_enterprise) }
- let!(:group) { create(:enterprise_group, enterprises: [enterprise], permalink: 'group1', on_front_page: true) }
-
-
- before do
- Spree::Config[:enable_embedded_shopfronts] = true
- Spree::Config[:embedded_shopfronts_whitelist] = 'localhost'
+ let(:enterprise) { create(:distributor_enterprise) }
+ let!(:group) { create(:enterprise_group, enterprises: [enterprise], permalink: 'group1', on_front_page: true) }
+ before do
+ Spree::Config[:enable_embedded_shopfronts] = true
+ Spree::Config[:embedded_shopfronts_whitelist] = 'test.com'
page.driver.browser.js_errors = false
- Capybara.current_session.driver.visit('spec/support/views/group_iframe_test.html')
+ allow_any_instance_of(ActionDispatch::Request).to receive(:referer).and_return('https://www.test.com')
+ Capybara.current_session.driver.visit('spec/support/views/group_iframe_test.html')
+ end
- end
+ it "displays in an iframe" do
+ expect(page).to have_selector 'iframe#group_test_iframe'
- it "displays in an iframe" do
- expect(page).to have_selector 'iframe#group_test_iframe'
+ within_frame 'group_test_iframe' do
+ within 'div#group-page' do
+ expect(page).to have_content 'About Us'
+ end
+ end
+ end
- within_frame 'group_test_iframe' do
- within 'div#group-page' do
- expect(page).to have_content 'About Us'
- end
- end
- end
-
+ it "displays powered by OFN text at bottom of page" do
+ expect(page).to have_selector 'iframe#group_test_iframe'
+
+ within_frame 'group_test_iframe' do
+ within 'div#group-page' do
+ expect(page).to have_selector 'div.powered-by-embedded'
+ expect(page).to have_css "img[src*='favicon.ico']"
+ expect(page).to have_content 'Powered by'
+ expect(page).to have_content 'Open Food Network'
+ end
+ end
+ end
+
+ it "doesn't display contact details when embedded" do
+ expect(page).to have_selector 'iframe#group_test_iframe'
+
+ within_frame 'group_test_iframe' do
+ within 'div#group-page' do
+
+ expect(page).to have_no_selector 'div.contact-container'
+ expect(page).to have_no_content '#{group.address.address1}'
+ end
+ end
+ end
+
+ it "does not display the header when embedded" do
+ expect(page).to have_selector 'iframe#group_test_iframe'
+
+ within_frame 'group_test_iframe' do
+ within 'div#group-page' do
+ expect(page).to have_no_selector 'header'
+ expect(page).to have_no_selector 'img.group-logo'
+ expect(page).to have_no_selector 'h2.group-name'
+ end
+ end
+ end
+
+ it 'opens links to shops in a new window' do
+ expect(page).to have_selector 'iframe#group_test_iframe'
+
+ within_frame 'group_test_iframe' do
+ within 'div#group-page' do
+ enterprise_links = page.all(:xpath, "//*[contains(@href, 'enterprise-5/shop')]", :visible => :false).count
+ enterprise_links_with_target_blank = page.all(:xpath, "//*[contains(@href, 'enterprise-5/shop') and @target = '_blank']", :visible => :false).count
+ expect(enterprise_links).to equal(enterprise_links_with_target_blank)
+ end
+ end
+ end
end
-
-end
\ No newline at end of file
+end
diff --git a/spec/support/views/group_iframe_test.html b/spec/support/views/group_iframe_test.html
index f5ebb1a491..dcb4abbceb 100644
--- a/spec/support/views/group_iframe_test.html
+++ b/spec/support/views/group_iframe_test.html
@@ -2,7 +2,7 @@
-
+