Skip to content

Commit

Permalink
bump version
Browse files Browse the repository at this point in the history
  • Loading branch information
@soumak77
soumak77 committed Aug 1, 2016
1 parent 8e4ba23 commit ff5e3bc
Show file tree
Hide file tree
Showing 9 changed files with 251 additions and 56 deletions.
2 changes: 1 addition & 1 deletion bower.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "angular-base-apps",
"version": "1.2.4",
"version": "1.2.5",
"main": [
"scss/foundation.scss",
"dist/js/foundation-apps.js",
Expand Down
14 changes: 7 additions & 7 deletions dist/docs/assets/js/app.js
View file

Large diffs are not rendered by default.

57 changes: 57 additions & 0 deletions dist/docs/templates/accordion.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -101,8 +101,65 @@ <h3>Advanced HTML</h3>
</div>
</div>

<ul>
<li><code>auto-open</code>: By default, the first accordion will auto open in the container. Set the <strong>auto-open</strong> attribute to <strong>false</strong> to change this functionality.</li>
<li><code>collapsible</code>: By default, one accordion must be open at all times. Set the <strong>collapsible</strong> attribute to <strong>true</strong> to change this functionality. This will enable toggling the accordions.</li>
<li><code>multi-open</code>: By default, only one accordion can be expanded at a time. Set the <strong>multi-open</strong> attribute to <strong>true</strong> to change this functionality. Setting this functionality implies <strong>collapsible</strong> is set to <strong>true</strong>.</li>
</ul>

<hr />

<h3>External Triggers</h3>

<p>The accordions can be opened and closed outside the accordion component using the <code>zf-open</code>, <code>zf-close</code>, and <code>zf-toggle</code> directives.</p>

<div class="grid-block align-center">
<div class="small-12 grid-content">

<hljs language="html">
<a class="button" zf-open="trigger-accordion-1">Open 1</a>
<a class="button" zf-close="trigger-accordion-2">Close 2</a>
<a class="button" zf-toggle="trigger-accordion-3">Toggle 3</a>
<zf-accordion auto-open="false" collapsible="true" multi-open="true">
<zf-accordion-item id="trigger-accordion-1" title="Auto Open">
Auto open opens the first tab on render.
</zf-accordion-item>
<zf-accordion-item id="trigger-accordion-2" title="Collapsible">
Collapsible allows toggable tabs. Click on a tab to open or close it.
</zf-accordion-item>
<zf-accordion-item id="trigger-accordion-3" title="Multi Open">
Multi open allows for multiple tabs to be open at once.
</zf-accordion-item>
</zf-accordion>
</hljs>
</div>

<div class="small-12 shrink grid-content">
<a class="button" zf-open="trigger-accordion-1">Open 1</a>
<a class="button" zf-close="trigger-accordion-2">Close 2</a>
<a class="button" zf-toggle="trigger-accordion-3">Toggle 3</a>
<zf-accordion auto-open="false" collapsible="true" multi-open="true">
<zf-accordion-item id="trigger-accordion-1" title="Auto Open">
Auto open opens the first tab on render.
</zf-accordion-item>
<zf-accordion-item id="trigger-accordion-2" title="Collapsible">
Collapsible allows toggable tabs. Click on a tab to open or close it.
</zf-accordion-item>
<zf-accordion-item id="trigger-accordion-3" title="Multi Open">
Multi open allows for multiple tabs to be open at once.
</zf-accordion-item>
</zf-accordion>
</div>
</div>

<hr>

<h3>Accessing Parent Data</h3>

<p>The accordion directive uses an isolated scope, meaning data from the parent scope cannot be accessed directly. In order to access properties on the parent scope, one must use <code>$parent</code>. Refer to the <a ui-sref="tabs">tabs documentation</a> for a complete example of how to use <code>$parent</code>.</p>

<hr>

<h3>Sass Mixins</h3>

<p>Use our mixins to write a custom accordion. There are only mixins for the two components of accordion items: the title and the content.</p>
Expand Down
2 changes: 1 addition & 1 deletion dist/docs/templates/tabs.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -218,7 +218,7 @@ <h3>Relocate Content</h3>

<h3>Accessing Parent Data</h3>

<p>The tabs directive uses an isolated scope, meaning data from the parent scope cannot be accessed directly. In order to access properties on the parent scope, one must use <code>$parent</code>. For more information on angular scopes, <a href="https://docs.angularjs.org/api/ng/type/$rootScope.Scope">check their docs</a>. The example below shows how to access data from a parent scope using <code>zf-tabs</code>.</p>
<p>The tabs directive uses an isolated scope, meaning data from the parent scope cannot be accessed directly. In order to access properties on the parent scope, one must use <code>$parent</code>. For more information on angular scopes, check the <a href="https://docs.angularjs.org/api/ng/type/$rootScope.Scope">angular docs</a>. The example below shows how to access data from a parent scope using <code>zf-tabs</code>.</p>

<div class="grid-block align-center">
<div class="small-12 grid-content">
Expand Down
111 changes: 90 additions & 21 deletions dist/js/base-apps.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1127,27 +1127,23 @@ angular.module('markdown', [])
function zfAccordionController($scope) {
var controller = this;
var sections = controller.sections = $scope.sections = [];
var multiOpen = controller.multiOpen = $scope.multiOpen = $scope.multiOpen || false;
var collapsible = controller.collapsible = $scope.collapsible = $scope.multiOpen || $scope.collapsible || true; //multi open infers a collapsible true
var autoOpen = controller.autoOpen = $scope.autoOpen = $scope.autoOpen || true; //auto open opens first tab on render
var multiOpen = false;
var collapsible = false;
var autoOpen = true;

controller.select = function(selectSection) {
sections.forEach(function(section) {
//if multi open is allowed, toggle a tab
if(controller.multiOpen) {
if(section.scope === selectSection) {
if(section.scope === selectSection) {
if (multiOpen || collapsible) {
section.scope.active = !section.scope.active;
} else {
section.scope.active = true;
}
} else {
//non multi open will close all tabs and open one
if(section.scope === selectSection) {
//if collapsible is allowed, a tab will toggle
section.scope.active = collapsible ? !section.scope.active : true;
} else {
if (!multiOpen) {
section.scope.active = false;
}
}

});
};

Expand All @@ -1165,6 +1161,18 @@ angular.module('markdown', [])
section.scope.active = false;
});
};

controller.setAutoOpen = function(val) {
autoOpen = val;
};

controller.setCollapsible = function(val) {
collapsible = val;
};

controller.setMultiOpen = function(val) {
multiOpen = val;
};
}

function zfAccordion() {
Expand All @@ -1175,24 +1183,23 @@ angular.module('markdown', [])
templateUrl: 'components/accordion/accordion.html',
controller: 'ZfAccordionController',
scope: {
multiOpen: '@?',
collapsible: '@?',
autoOpen: '@?'
},
link: link
};

return directive;

function link(scope, element, attrs, controller) {
scope.multiOpen = controller.multiOpen = scope.multiOpen === "true" ? true : false;
scope.collapsible = controller.collapsible = scope.collapsible === "true" ? true : false;
scope.autoOpen = controller.autoOpen = scope.autoOpen === "true" ? true : false;
controller.setAutoOpen(attrs.autoOpen !== "false");
controller.setCollapsible(attrs.collapsible === "true");
controller.setMultiOpen(attrs.multiOpen === "true");
}
}

//accordion item
function zfAccordionItem() {
zfAccordionItem.$inject = ['FoundationApi'];

function zfAccordionItem(foundationApi) {
var directive = {
restrict: 'EA',
templateUrl: 'components/accordion/accordion-item.html',
Expand All @@ -1209,13 +1216,37 @@ angular.module('markdown', [])
return directive;

function link(scope, element, attrs, controller, transclude) {
scope.id = attrs.id || foundationApi.generateUuid();
scope.active = false;
controller.addSection(scope);

foundationApi.subscribe(scope.id, function(msg) {
if(msg === 'show' || msg === 'open' || msg === 'activate') {
if (!scope.active) {
controller.select(scope);
}
}

if(msg === 'hide' || msg === 'close' || msg === 'deactivate') {
if (scope.active) {
controller.select(scope);
}
}

if(msg === 'toggle') {
controller.select(scope);
}

scope.$digest();
});

scope.activate = function() {
controller.select(scope);
};

scope.$on("$destroy", function() {
foundationApi.unsubscribe(scope.id);
});
}
}

Expand Down Expand Up @@ -1405,6 +1436,10 @@ angular.module('markdown', [])
scope.active = true;
return;
};

scope.$on("$destroy", function() {
foundationApi.unsubscribe(id);
});
}
}
}
Expand Down Expand Up @@ -2392,6 +2427,10 @@ angular.module('markdown', [])
return;
};

scope.$on("$destroy", function() {
foundationApi.unsubscribe(attrs.id);
});

//setup
foundationApi.subscribe(attrs.id, function(msg) {
if(msg === 'show' || msg === 'open') {
Expand Down Expand Up @@ -2726,6 +2765,10 @@ angular.module('markdown', [])
function link(scope, element, attrs, controller) {
scope.position = scope.position ? scope.position.split(' ').join('-') : 'top-right';

scope.$on("$destroy", function() {
foundationApi.unsubscribe(attrs.id);
});

foundationApi.subscribe(attrs.id, function(msg) {
if(msg === 'clearall') {
controller.clearAll();
Expand Down Expand Up @@ -2882,6 +2925,10 @@ angular.module('markdown', [])
var animationOut = attrs.animationOut || 'fadeOut';
var animateFn = attrs.hasOwnProperty('zfAdvise') ? foundationApi.animateAndAdvise : foundationApi.animate;

scope.$on("$destroy", function() {
foundationApi.unsubscribe(attrs.id);
});

//setup
foundationApi.subscribe(attrs.id, function(msg) {
if(msg == 'show' || msg == 'open') {
Expand Down Expand Up @@ -3152,8 +3199,12 @@ angular.module('markdown', [])

function postLink(scope, element, attrs) {
scope.position = scope.position || 'left';

scope.active = false;

scope.$on("$destroy", function() {
foundationApi.unsubscribe(attrs.id);
});

//setup
foundationApi.subscribe(attrs.id, function(msg) {
if(msg === 'show' || msg === 'open') {
Expand Down Expand Up @@ -3304,6 +3355,9 @@ angular.module('markdown', [])
// animationOut = attrs.animationOut || 'slideOutDown';
// }

scope.$on("$destroy", function() {
foundationApi.unsubscribe(attrs.id);
});

//setup
foundationApi.subscribe(attrs.id, function(msg) {
Expand Down Expand Up @@ -3705,6 +3759,10 @@ angular.module('markdown', [])
foundationApi.subscribe(scope.id + '-get-tabs', function() {
updateTabs();
});

scope.$on("$destroy", function() {
foundationApi.unsubscribe(scope.id + '-get-tabs');
});
}
}

Expand Down Expand Up @@ -3756,6 +3814,11 @@ angular.module('markdown', [])

foundationApi.publish(id + '-get-tabs', '');
}

scope.$on("$destroy", function() {
foundationApi.unsubscribe(id);
foundationApi.unsubscribe(id + '-tabs');
});
}
}

Expand Down Expand Up @@ -3803,6 +3866,10 @@ angular.module('markdown', [])
scope.makeActive = function() {
controller.select(scope);
};

scope.$on("$destroy", function() {
foundationApi.unsubscribe(scope.id);
});
}
}

Expand Down Expand Up @@ -3830,6 +3897,9 @@ angular.module('markdown', [])
scope.$apply();
});

scope.$on("$destroy", function() {
foundationApi.unsubscribe(tab.scope.id);
});
}
}

Expand Down Expand Up @@ -3923,7 +3993,6 @@ angular.module('markdown', [])
if(el.attr('id') === tabId) {
el.addClass('is-active');
}

});
}
}
Expand Down
4 changes: 2 additions & 2 deletions dist/js/base-apps.min.js
View file

Large diffs are not rendered by default.

Loading

0 comments on commit ff5e3bc

Please sign in to comment.