Skip to content

Commit 8f03c07

Browse files
DanielHindiDanielHindi
committed
Merge pull request #45 from vish250491/master
Layout 12 related implementation for its( 8 item )slide functionality like carousal.
2 parents 73b5375 + 6cc3f5b commit 8f03c07

File tree

7 files changed

+279
-26
lines changed

7 files changed

+279
-26
lines changed

‎control/shared.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,9 @@ folderPluginShared.getLayouts = function () {
6767
"./layouts/layout7.png",
6868
"./layouts/layout8.png",
6969
"./layouts/layout9.png",
70-
"./layouts/layout10.png"
70+
"./layouts/layout10.png",
71+
"./layouts/layout11.png",
72+
"./layouts/layout12.png"
7173
];
7274
};
7375

‎test/Widget/widget.controller.spec.js‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,11 @@ describe('folderPlugin widget: controller', function () {
8888
var $scope, widgetController;
8989

9090
beforeEach(function() {
91-
$scope = {};
91+
$scope = {
92+
$on:function(){
93+
94+
}
95+
};
9296
widgetController = $controller('folderPluginCtrl', { $scope: $scope });
9397
});
9498

‎test/control/content/content.controller.spec.js‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,11 @@ describe('folderPlugin Content: controller', function () {
4242
var $scope, contentController;
4343

4444
beforeEach(function() {
45-
$scope = {};
45+
$scope = {
46+
$on:function(){
47+
48+
}
49+
};
4650
contentController = $controller('folderPluginCtrl', { $scope: $scope });
4751
});
4852

‎widget/css/style.css‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -300,6 +300,9 @@ html[browser="Firefox"] .layout3 .list-layout .list-item-media .list-media-holde
300300
padding:5px 15px;
301301
border-radius:3px;
302302
}
303+
.layout12 .plugin-slider .morePadding {
304+
padding:5px 15px 25px;
305+
}
303306
.layout12 .plugin-slider .link-holder p{
304307
margin:0;
305308
}

‎widget/index.html‎

Lines changed: 24 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
<script src="../../../scripts/jquery/jquery-1.11.2.min.js"></script>
1515
<script src="../../../scripts/angular/angular.min.js"></script>
1616

17-
17+
<script src="js/angular-owl-carousel.js"></script>
1818
<script type="text/javascript" src="../../../scripts/buildfire.js"></script>
1919
<script type="text/javascript" src="../../../scripts/owlCarousel/owlCarousel.js"></script>
2020
<script src="../../../scripts/buildfire/components/carousel/carousel.js"></script>
@@ -51,6 +51,21 @@
5151
height:100%;
5252
}
5353
</style>
54+
<script type="text/javascript" charset="utf-8">
55+
window.onload = function () {
56+
var slides = $('.plugin-slider .plugin-slide').length;
57+
58+
// Slider needs at least 2 slides or you'll get an error.
59+
if(slides > 1){
60+
$('.plugin-slider').owlCarousel({
61+
loop:false,
62+
nav:false,
63+
items:1
64+
});
65+
}
66+
}
67+
68+
</script>
5469
<div class="holder padding-zero hasBackground fullHeight" id="mainContainer">
5570
<div class="folder-plugin list-layout fullHeight">
5671
<div ng-class="{ 'hidden': data.content.carouselImages.length == 0 }" class="plugin-banner clearfix" ng-hide="data.design.selectedLayout == 12">
@@ -242,11 +257,11 @@
242257
<div class="holder padding-zero" style="height:100%;" ng-if="data.design.selectedLayout == 12">
243258
<div class="folder-plugin layout12" style="height:100%;">
244259
<div class="plugin-banner clearfix">
245-
<div class="plugin-slider text-center">
246-
<div class="plugin-slide">
247-
<div class="link-holder">
248-
<p ng-repeat="plugin in data.plugins" ng-click="navigateToPlugin(plugin)" class="ellipsis whiteTheme">
249-
<a class="whiteTheme">{{ plugin.title }}</a>
260+
<div class="plugin-slider text-center" image-carousel="{{ layout12TotalItem}}" >
261+
<div class="plugin-slide" ng-repeat="rows in data.plugins" ng-style="data.plugins.length>1 ? {'height': layout12Height} : {'height': '320px'} ">
262+
<div class="link-holder" ng-class="rows.length==8 ? 'morePadding':''" ng-style="data.plugins.length>1 ? {'height': layout12Height} : {'height': '320px'} ">
263+
<p ng-repeat="plugin in rows" ng-click="navigateToPlugin(plugin)" class="ellipsis whiteTheme" emit-last-repeater-element>
264+
<a class="whiteTheme ellipsis">{{ plugin.title }}</a>
250265
</p>
251266
</div>
252267
</div>
@@ -259,4 +274,7 @@
259274
</div>
260275
</div>
261276
</body>
277+
<script type="text/javascript" charset="utf-8">
278+
279+
</script>
262280
</html>

‎widget/js/angular-owl-carousel.js‎

Lines changed: 129 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,129 @@
1+
(function () {
2+
'use strict';
3+
angular
4+
.module('angular-owl-carousel', [])
5+
.directive('owlCarousel', [
6+
'$parse',
7+
owlCarouselDirective
8+
]);
9+
10+
function owlCarouselDirective($parse) {
11+
12+
var owlOptions = [
13+
'items',
14+
'margin',
15+
'loop',
16+
'center',
17+
'mouseDrag',
18+
'touchDrag',
19+
'pullDrag',
20+
'freeDrag',
21+
'merge',
22+
'mergeFit',
23+
'autoWidth',
24+
'startPosition',
25+
'URLhashListener',
26+
'nav',
27+
'navRewind',
28+
'navText',
29+
'slideBy',
30+
'dots',
31+
'dotsEach',
32+
'dotData',
33+
'lazyLoad',
34+
'lazyContent',
35+
'autoplay',
36+
'autoplayTimeout',
37+
'autoplayHoverPause',
38+
'smartSpeed',
39+
'fluidSpeed',
40+
'autoplaySpeed',
41+
'dotsSpeed',
42+
'dragEndSpeed',
43+
'callbacks',
44+
'responsive',
45+
'responsiveRefreshRate',
46+
'responsiveBaseElement',
47+
'responsiveClass',
48+
'video',
49+
'videoHeight',
50+
'videoWidth',
51+
'animateOut',
52+
'animateIn',
53+
'fallbackEasing',
54+
'info',
55+
'nestedItemSelector',
56+
'itemElement',
57+
'stageElement',
58+
'navContainer',
59+
'dotsContainer',
60+
// Classes
61+
'themeClass',
62+
'baseClass',
63+
'itemClass',
64+
'centerClass',
65+
'activeClass',
66+
'navContainerClass',
67+
'navClass',
68+
'controlsClass',
69+
'dotClass',
70+
'dotsClass',
71+
'autoHeightClass',
72+
// Callbacks
73+
'onInitialize',
74+
'onInitialized',
75+
'onResize',
76+
'onResized',
77+
'onRefresh',
78+
'onRefreshed',
79+
'onDrag',
80+
'onDragged',
81+
'onTranslate',
82+
'onTranslated',
83+
'onChange',
84+
'onChanged',
85+
'onStopVideo',
86+
'onPlayVideo',
87+
'onLoadLazy',
88+
'onLoadedLazy'
89+
];
90+
91+
return {
92+
restrict: 'A',
93+
transclude: true,
94+
link: function (scope, element, attributes, controller, $transclude) {
95+
96+
var options = {},
97+
$element = $(element),
98+
owlCarousel = null,
99+
propertyName = attributes.owlCarousel;
100+
101+
for (var i = 0; i < owlOptions.length; i++) {
102+
var opt = owlOptions[i];
103+
if (attributes[opt] !== undefined) {
104+
options[opt] = $parse(attributes[opt])();
105+
}
106+
}
107+
108+
scope.$watchCollection(propertyName, function (newItems, oldItems) {
109+
110+
if (owlCarousel) {
111+
owlCarousel.destroy();
112+
}
113+
$element.empty();
114+
115+
for (var i in newItems) {
116+
$transclude(function (clone, scope) {
117+
scope.item = newItems[i];
118+
$element.append(clone[1]);
119+
});
120+
}
121+
122+
$element.owlCarousel(options);
123+
owlCarousel = $element.data('owlCarousel');
124+
});
125+
}
126+
};
127+
}
128+
129+
})();

0 commit comments

Comments
 (0)