From e68d1b4b7f51f24084b755ef87c210dc26f2f041 Mon Sep 17 00:00:00 2001 From: Antonin Januska Date: Thu, 20 Nov 2014 13:17:46 -0600 Subject: [PATCH 1/5] Fa to Zf conversion --- Docs/templates/kitchen-sink.html | 22 ++++++++-------- Docs/templates/page_iconic.html | 2 +- docs/index.html | 8 +++--- docs/templates/page.html | 14 +++++----- docs/templates/page_accordion.html | 12 ++++----- docs/templates/page_actionsheet.html | 20 +++++++------- docs/templates/page_child.html | 8 +++--- docs/templates/page_notification.html | 8 +++--- docs/templates/page_popup.html | 4 +-- docs/templates/page_tabs.html | 32 +++++++++++------------ js/angular/common/common.directives.js | 16 ++++++------ js/angular/common/common.services.js | 4 +-- js/angular/directives/accordion.js | 10 +++---- js/angular/directives/actionsheet.js | 14 +++++----- js/angular/directives/iconic.js | 2 +- js/angular/directives/interchange.js | 2 +- js/angular/directives/modal.js | 4 +-- js/angular/directives/notification.js | 16 ++++++------ js/angular/directives/offcanvas.js | 4 +-- js/angular/directives/panel.js | 4 +-- js/angular/directives/popup.js | 6 ++--- js/angular/directives/tabs.js | 22 ++++++++-------- js/angular/partials/notification-set.html | 4 +-- js/angular/partials/tab-content.html | 2 +- js/angular/partials/tabs.html | 2 +- 25 files changed, 121 insertions(+), 121 deletions(-) diff --git a/Docs/templates/kitchen-sink.html b/Docs/templates/kitchen-sink.html index 603736fe..a13c49de 100644 --- a/Docs/templates/kitchen-sink.html +++ b/Docs/templates/kitchen-sink.html @@ -10,21 +10,21 @@

This is a collection of all the Foundation components.

-
+
+

Proin quis tortor orci. Etiam at risus et justo dignissim congue. Donec congue lacinia dui, a porttitor lectus condimentum laoreet. Nunc eu ullamcorper orci. Quisque eget odio ac lectus vestibulum faucibus eget in metus. In pellentesque faucibus vestibulum. Nulla at.

-
+

Proin quis tortor orci. Etiam at risus et justo dignissim congue. Donec congue lacinia dui, a porttitor lectus condimentum laoreet. Nunc eu ullamcorper orci. Quisque eget odio ac lectus vestibulum faucibus eget in metus. In pellentesque faucibus vestibulum. Nulla at.

```html -
-
+
+

Proin quis tortor orci. Etiam at risus et justo dignissim congue. Donec congue lacinia dui, a porttitor lectus condimentum laoreet. Nunc eu ullamcorper orci. Quisque eget odio ac lectus vestibulum faucibus eget in metus. In pellentesque faucibus vestibulum. Nulla at.

-
+

Proin quis tortor orci. Etiam at risus et justo dignissim congue. Donec congue lacinia dui, a porttitor lectus condimentum laoreet. Nunc eu ullamcorper orci. Quisque eget odio ac lectus vestibulum faucibus eget in metus. In pellentesque faucibus vestibulum. Nulla at.

@@ -232,19 +232,19 @@

The Basics: Group and Block

*** ##### Iconic - + *** ##### Tabs -
-
+
+

Nunc eu ullamcorper orci. Quisque eget odio ac lectus vestibulum faucibus eget in metus. In pellentesque faucibus vestibulum. Nulla at nulla justo, eget luctus tortor. Nulla facilisi. Duis aliquet egestas purus in blandit. Curabitur.

-
+

Nunc eu ullamcorper orci. Quisque eget odio ac lectus vestibulum faucibus eget in metus. In pellentesque faucibus vestibulum. Nulla at nulla justo, eget luctus tortor. Nulla facilisi. Duis aliquet egestas purus in blandit. Curabitur.

-
+

Nunc eu ullamcorper orci. Quisque eget odio ac lectus vestibulum faucibus eget in metus. In pellentesque faucibus vestibulum. Nulla at nulla justo, eget luctus tortor. Nulla facilisi. Duis aliquet egestas purus in blandit. Curabitur.

diff --git a/Docs/templates/page_iconic.html b/Docs/templates/page_iconic.html index 2c56394c..1ccbddd9 100644 --- a/Docs/templates/page_iconic.html +++ b/Docs/templates/page_iconic.html @@ -4,4 +4,4 @@ ---

Iconic

- + diff --git a/docs/index.html b/docs/index.html index 78e9b82c..95ec8e80 100644 --- a/docs/index.html +++ b/docs/index.html @@ -42,14 +42,14 @@
-
- × +
+ ×
  • Setup
    • @@ -118,7 +118,7 @@
    - Show Components + Show Components
    diff --git a/docs/templates/page.html b/docs/templates/page.html index 50170e57..c2db531a 100644 --- a/docs/templates/page.html +++ b/docs/templates/page.html @@ -17,14 +17,14 @@

    Foundation Angular Playground

Page

- - - + + +
-
- × +
+ ×
{{ vars.name }} | {{ vars.url }}
@@ -33,10 +33,10 @@

Page

Cancel
-
+

Test Panel

-
+

Test Canvas

diff --git a/docs/templates/page_accordion.html b/docs/templates/page_accordion.html index 3427ac39..07d17667 100644 --- a/docs/templates/page_accordion.html +++ b/docs/templates/page_accordion.html @@ -6,21 +6,21 @@ animationOut: fadeOut ---

Accordion

-
-
+
+
Test Content
-
+
Test3
Multi selection
-
-
+
+
Test Content
-
+
Test3
diff --git a/docs/templates/page_actionsheet.html b/docs/templates/page_actionsheet.html index 68109421..e2b2114c 100644 --- a/docs/templates/page_actionsheet.html +++ b/docs/templates/page_actionsheet.html @@ -5,9 +5,9 @@ animationOut: fadeOut ---

Action sheet

-
-
-
+
+
+

Some html

  • Option One
    • @@ -20,9 +20,9 @@

    Action sheet

    Custom button: -
    - -
    +
    + +

    Some html

    • Option One
      • @@ -34,11 +34,11 @@

      Action sheet


      Remote trigger: -remote trigger +remote trigger -
      -
      -
      +
      +
      +

      Some html

      • Option One
        • diff --git a/docs/templates/page_child.html b/docs/templates/page_child.html index 37d8bf53..6c0de542 100644 --- a/docs/templates/page_child.html +++ b/docs/templates/page_child.html @@ -3,12 +3,12 @@ title: Interchange Playground url: /interchange --- -
        -
        +
        +
        -
        +
        -
        +
        On-page template!
        diff --git a/docs/templates/page_notification.html b/docs/templates/page_notification.html index 0195b32e..17a72f86 100644 --- a/docs/templates/page_notification.html +++ b/docs/templates/page_notification.html @@ -8,9 +8,9 @@

        Notifications

        content="Notification example" color="success" position="top left" - fa-notify="main-notifications">Dynamic Notification -Static Notification -
        -
        + zf-notify="main-notifications">Dynamic Notification +Static Notification +
        +
        This notification is static, it works similarly to a programmatic with some subtle differences
        diff --git a/docs/templates/page_popup.html b/docs/templates/page_popup.html index 3b4ff994..e785096c 100644 --- a/docs/templates/page_popup.html +++ b/docs/templates/page_popup.html @@ -3,8 +3,8 @@ url: /popup ---

        Popup

        -Open popup -
        Open popup +
        Automatic Tabs -Open tab 3 -
        -
        +Open tab 3 +
        +
        Tab 1
        -
        +
        Tab 2
        -
        +
        Tab 3

        Automatic Tabs with displaced tab content

        -
        -
        +
        +
        Tab 1
        -
        +
        Tab 2
        -
        +
        Tab 3
        -open tab 3 +open tab 3
        Displaced content:
        -
        +

        Manually built tabs

        -Open Tab Two -
          -
        • Tab One
          • -
        • Tab Two
          • +Open Tab Two + -
          +
          Content!
          Second Content!
          diff --git a/js/angular/common/common.directives.js b/js/angular/common/common.directives.js index dd6f92b3..0e4fb05b 100644 --- a/js/angular/common/common.directives.js +++ b/js/angular/common/common.directives.js @@ -1,7 +1,7 @@ angular.module('foundation.common.directives', []); angular.module('foundation.common.directives') - .directive('faClose', ['FoundationApi', function(foundationApi) { + .directive('zfClose', ['FoundationApi', function(foundationApi) { return { restrict: 'A', link: function(scope, element, attrs) { @@ -9,7 +9,7 @@ angular.module('foundation.common.directives') var tempElement = element.parent(); //find parent modal - while(parentElement == false) { + while(parentElement === false) { if(tempElement[0].nodeName == 'BODY') { parentElement = ''; } @@ -26,29 +26,29 @@ angular.module('foundation.common.directives') e.preventDefault(); }); } - } + }; }]); angular.module('foundation.common.directives') - .directive('faOpen', ['FoundationApi', function(foundationApi) { + .directive('zfOpen', ['FoundationApi', function(foundationApi) { return { restrict: 'A', link: function(scope, element, attrs) { element.on('click', function(e) { - foundationApi.publish(attrs.faOpen, 'open'); + foundationApi.publish(attrs.zfOpen, 'open'); e.preventDefault(); }); } - } + }; }]); angular.module('foundation.common.directives') - .directive('faToggle', ['FoundationApi', function(foundationApi) { + .directive('zfToggle', ['FoundationApi', function(foundationApi) { return { restrict: 'A', link: function(scope, element, attrs) { element.on('click', function(e) { - foundationApi.publish(attrs.faToggle, 'toggle'); + foundationApi.publish(attrs.zfToggle, 'toggle'); e.preventDefault(); }); } diff --git a/js/angular/common/common.services.js b/js/angular/common/common.services.js index de802b33..731de311 100644 --- a/js/angular/common/common.services.js +++ b/js/angular/common/common.services.js @@ -38,7 +38,7 @@ angular.module('foundation.common.services') //little trick to produce semi-random IDs do { - uuid += 'fa-uuid-'; + uuid += 'zf-uuid-'; for (var i=0; i<15; i++) { uuid += Math.floor(Math.random()*16).toString(16); } @@ -70,7 +70,7 @@ angular.module('foundation.common.services') return function () { var context = this, args = arguments; - if (timer == null) { + if (timer === null) { timer = setTimeout(function () { func.apply(context, args); timer = null; diff --git a/js/angular/directives/accordion.js b/js/angular/directives/accordion.js index 8ec1c95e..f6d70292 100644 --- a/js/angular/directives/accordion.js +++ b/js/angular/directives/accordion.js @@ -1,7 +1,7 @@ angular.module('foundation.accordion', []); angular.module('foundation.accordion') - .controller('FaAccordionController', ['$scope', function($scope) { + .controller('ZfAccordionController', ['$scope', function($scope) { var controller = this; var sections = controller.sections = $scope.sections = []; var multiOpen = controller.multiOpen = false; @@ -39,13 +39,13 @@ angular.module('foundation.accordion') }]); angular.module('foundation.accordion') - .directive('faAccordionSet', function() { + .directive('zfAccordionSet', function() { return { restrict: 'EA', transclude: 'true', replace: true, templateUrl: '/partials/accordion-set.html', - controller: 'FaAccordionController', + controller: 'ZfAccordionController', scope: { multiOpen: '@' }, @@ -56,7 +56,7 @@ angular.module('foundation.accordion') }); angular.module('foundation.accordion') - .directive('faAccordion', function() { + .directive('zfAccordion', function() { return { restrict: 'EA', templateUrl: '/partials/accordion.html', @@ -64,7 +64,7 @@ angular.module('foundation.accordion') scope: { title: '@' }, - require: '^faAccordionSet', + require: '^zfAccordionSet', replace: true, controller: function() {}, link: function(scope, element, attrs, controller, transclude) { diff --git a/js/angular/directives/actionsheet.js b/js/angular/directives/actionsheet.js index f50e57e8..7450a2f5 100644 --- a/js/angular/directives/actionsheet.js +++ b/js/angular/directives/actionsheet.js @@ -1,7 +1,7 @@ angular.module('foundation.actionsheet', ['foundation.common.services']); angular.module('foundation.actionsheet') - .controller('FaActionSheetController', ['$scope', 'FoundationApi', function($scope, foundationApi) { + .controller('ZfActionSheetController', ['$scope', 'FoundationApi', function($scope, foundationApi) { var controller = this; var content = controller.content = $scope.content; @@ -18,13 +18,13 @@ angular.module('foundation.actionsheet') }]); angular.module('foundation.actionsheet') - .directive('faActionSheet', ['FoundationApi', function(foundationApi) { + .directive('zfActionSheet', ['FoundationApi', function(foundationApi) { return { restrict: 'A', transclude: true, replace: true, templateUrl: '/partials/actionsheet.html', - controller: 'FaActionSheetController', + controller: 'ZfActionSheetController', link: function(scope, element, attrs, controller) { foundationApi.subscribe(attrs.id, function(msg) { if (msg == 'toggle') { @@ -38,13 +38,13 @@ angular.module('foundation.actionsheet') }]); angular.module('foundation.actionsheet') - .directive('faAsContent', ['FoundationApi', function(foundationApi) { + .directive('zfAsContent', ['FoundationApi', function(foundationApi) { return { restrict: 'EA', transclude: true, replace: true, templateUrl: '/partials/actionsheet-content.html', - require: '^faActionSheet', + require: '^zfActionSheet', scope: { position: '@?' }, @@ -61,13 +61,13 @@ angular.module('foundation.actionsheet') }]); angular.module('foundation.actionsheet') - .directive('faAsButton', ['FoundationApi', function(foundationApi) { + .directive('zfAsButton', ['FoundationApi', function(foundationApi) { return { restrict: 'EA', transclude: true, replace: true, templateUrl: '/partials/actionsheet-button.html', - require: '^faActionSheet', + require: '^zfActionSheet', scope: { title: '@?' }, diff --git a/js/angular/directives/iconic.js b/js/angular/directives/iconic.js index bf25e99d..fdd91400 100644 --- a/js/angular/directives/iconic.js +++ b/js/angular/directives/iconic.js @@ -13,7 +13,7 @@ angular.module('foundation.iconic') }); angular.module('foundation.iconic') - .directive('faIconic', ['Iconic', function(iconic) { + .directive('zfIconic', ['Iconic', function(iconic) { return { restrict: 'A', link: function(scope, element, attrs, controller) { diff --git a/js/angular/directives/interchange.js b/js/angular/directives/interchange.js index df765925..ae5dd523 100644 --- a/js/angular/directives/interchange.js +++ b/js/angular/directives/interchange.js @@ -1,7 +1,7 @@ angular.module('foundation.interchange', ['foundation.common.services']); angular.module('foundation.interchange') - .directive('faInterchange', ['FoundationApi', '$compile', '$http', '$templateCache', '$animate', function(foundationApi, $compile, $http, $templateCache) { + .directive('zfInterchange', ['FoundationApi', '$compile', '$http', '$templateCache', '$animate', function(foundationApi, $compile, $http, $templateCache) { var templateLoader = function(templateUrl) { return $http.get(templateUrl, {cache: $templateCache}); }; diff --git a/js/angular/directives/modal.js b/js/angular/directives/modal.js index 3e92a0bf..f0eab4f4 100644 --- a/js/angular/directives/modal.js +++ b/js/angular/directives/modal.js @@ -1,7 +1,7 @@ angular.module('foundation.modal', ['foundation.common.services']); angular.module('foundation.modal') - .directive('faModal', ['FoundationApi', function(foundationApi) { + .directive('zfModal', ['FoundationApi', function(foundationApi) { return { restrict: 'EA', templateUrl: '/partials/modal.html', @@ -13,7 +13,7 @@ angular.module('foundation.modal') return { pre: function preLink(scope, iElement, iAttrs, controller) { - iAttrs.$set('fa-closable', type); + iAttrs.$set('zf-closable', type); }, post: function postLink(scope, element, attrs) { var dialog = angular.element(element.children()[0]); diff --git a/js/angular/directives/notification.js b/js/angular/directives/notification.js index d1f783db..89074b11 100644 --- a/js/angular/directives/notification.js +++ b/js/angular/directives/notification.js @@ -1,7 +1,7 @@ angular.module('foundation.notification', ['foundation.common.services']); angular.module('foundation.notification') - .controller('FaNotificationController', ['$scope', 'FoundationApi', function FaTabsController($scope, foundationApi) { + .controller('ZfNotificationController', ['$scope', 'FoundationApi', function ZfTabsController($scope, foundationApi) { var controller = this; var notifications = controller.notifications = $scope.notifications = []; @@ -27,11 +27,11 @@ angular.module('foundation.notification') }]); angular.module('foundation.notification') - .directive('faNotificationSet', ['FoundationApi', function(foundationApi) { + .directive('zfNotificationSet', ['FoundationApi', function(foundationApi) { return { restrict: 'EA', templateUrl: '/partials/notification-set.html', - controller: 'FaNotificationController', + controller: 'ZfNotificationController', link:function(scope, element, attrs, controller) { foundationApi.subscribe(attrs.id, function(msg) { if(msg === 'clearall') { @@ -48,13 +48,13 @@ angular.module('foundation.notification') }]); angular.module('foundation.notification') - .directive('faNotification', function() { + .directive('zfNotification', function() { return { restrict: 'EA', templateUrl: '/partials/notification.html', replace: true, transclude: true, - require: '^faNotificationSet', + require: '^zfNotificationSet', controller: function() { }, scope: { title: '=?', @@ -85,7 +85,7 @@ angular.module('foundation.notification') }); angular.module('foundation.notification') - .directive('faNotificationStatic', ['FoundationApi', function(foundationApi) { + .directive('zfNotificationStatic', ['FoundationApi', function(foundationApi) { return { restrict: 'EA', templateUrl: '/partials/notification.html', @@ -137,7 +137,7 @@ angular.module('foundation.notification') }]); angular.module('foundation.notification') - .directive('faNotify', ['FoundationApi', function(foundationApi) { + .directive('zfNotify', ['FoundationApi', function(foundationApi) { return { restrict: 'A', scope: { @@ -150,7 +150,7 @@ angular.module('foundation.notification') link: function(scope, element, attrs, controller) { element.on('click', function(e) { e.preventDefault(); - foundationApi.publish(attrs.faNotify, { title: scope.title, content: scope.content, position: scope.position, color: scope.color }); + foundationApi.publish(attrs.zfNotify, { title: scope.title, content: scope.content, position: scope.position, color: scope.color }); }); }, }; diff --git a/js/angular/directives/offcanvas.js b/js/angular/directives/offcanvas.js index 15cf59c2..eb351352 100644 --- a/js/angular/directives/offcanvas.js +++ b/js/angular/directives/offcanvas.js @@ -1,7 +1,7 @@ angular.module('foundation.offcanvas', ['foundation.common.services']); angular.module('foundation.offcanvas') - .directive('faOffcanvas', ['FoundationApi', function(foundationApi) { + .directive('zfOffcanvas', ['FoundationApi', function(foundationApi) { return { restrict: 'EA', templateUrl: '/partials/offcanvas.html', @@ -15,7 +15,7 @@ angular.module('foundation.offcanvas') return { pre: function preLink(scope, iElement, iAttrs, controller) { - iAttrs.$set('fa-closable', type); + iAttrs.$set('zf-closable', type); document.body.classList.add('has-off-canvas'); }, post: function postLink(scope, element, attrs) { diff --git a/js/angular/directives/panel.js b/js/angular/directives/panel.js index 13696b9f..252ad584 100644 --- a/js/angular/directives/panel.js +++ b/js/angular/directives/panel.js @@ -1,7 +1,7 @@ angular.module('foundation.panel', ['foundation.common.services']); angular.module('foundation.panel') - .directive('faPanel', ['FoundationApi', function(foundationApi) { + .directive('zfPanel', ['FoundationApi', function(foundationApi) { return { restrict: 'EA', templateUrl: '/partials/panel.html', @@ -15,7 +15,7 @@ angular.module('foundation.panel') return { pre: function preLink(scope, iElement, iAttrs, controller) { - iAttrs.$set('fa-closable', type); + iAttrs.$set('zf-closable', type); }, post: function postLink(scope, element, attrs) { var currentStatus = 'hide'; diff --git a/js/angular/directives/popup.js b/js/angular/directives/popup.js index 107c0230..690d29d3 100644 --- a/js/angular/directives/popup.js +++ b/js/angular/directives/popup.js @@ -1,7 +1,7 @@ angular.module('foundation.popup', ['foundation.common.services']); angular.module('foundation.popup') - .directive('faPopup', ['FoundationApi', function(foundationApi) { + .directive('zfPopup', ['FoundationApi', function(foundationApi) { return { transclude: true, replace: true, @@ -85,11 +85,11 @@ angular.module('foundation.popup') }]); angular.module('foundation.popup') - .directive('faPopupToggle', ['FoundationApi', function(foundationApi) { + .directive('zfPopupToggle', ['FoundationApi', function(foundationApi) { return { restrict: 'A', link: function(scope, element, attrs) { - var target = attrs.faPopupToggle; + var target = attrs.zfPopupToggle; var id = attrs.id || foundationApi.generateUuid(); attrs.$set('id', id); diff --git a/js/angular/directives/tabs.js b/js/angular/directives/tabs.js index 9023f147..e8f65b54 100644 --- a/js/angular/directives/tabs.js +++ b/js/angular/directives/tabs.js @@ -1,7 +1,7 @@ angular.module('foundation.tabs', ['foundation.common.services']); angular.module('foundation.tabs') - .controller('FaTabsController', ['$scope', 'FoundationApi', function FaTabsController($scope, foundationApi) { + .controller('ZfTabsController', ['$scope', 'FoundationApi', function ZfTabsController($scope, foundationApi) { var controller = this; var tabs = controller.tabs = $scope.tabs = []; var id = ''; @@ -39,13 +39,13 @@ angular.module('foundation.tabs') }]); angular.module('foundation.tabs') - .directive('faTabs', ['FoundationApi', function(foundationApi) { + .directive('zfTabs', ['FoundationApi', function(foundationApi) { return { restrict: 'A', transclude: 'true', replace: true, templateUrl: '/partials/tabs.html', - controller: 'FaTabsController', + controller: 'ZfTabsController', scope: { displaced: '@?' }, @@ -74,7 +74,7 @@ angular.module('foundation.tabs') }]); angular.module('foundation.tabs') - .directive('faTabContent', ['FoundationApi', function(foundationApi) { + .directive('zfTabContent', ['FoundationApi', function(foundationApi) { return { restrict: 'A', transclude: 'true', @@ -117,7 +117,7 @@ angular.module('foundation.tabs') }]); angular.module('foundation.tabs') - .directive('faTab', ['FoundationApi', function(foundationApi) { + .directive('zfTab', ['FoundationApi', function(foundationApi) { return { restrict: 'EA', templateUrl: '/partials/tab.html', @@ -125,7 +125,7 @@ angular.module('foundation.tabs') scope: { title: '@' }, - require: '^faTabs', + require: '^zfTabs', replace: true, link: function(scope, element, attrs, controller, transclude) { scope.id = attrs.id || foundationApi.generateUuid(); @@ -147,7 +147,7 @@ angular.module('foundation.tabs') }]); angular.module('foundation.tabs') - .directive('faTabIndividual', ['FoundationApi', function(foundationApi) { + .directive('zfTabIndividual', ['FoundationApi', function(foundationApi) { return { restrict: 'EA', transclude: 'true', @@ -169,12 +169,12 @@ angular.module('foundation.tabs') //custom tabs angular.module('foundation.tabs') - .directive('faTabHref', ['FoundationApi', function(foundationApi) { + .directive('zfTabHref', ['FoundationApi', function(foundationApi) { return { restrict: 'A', replace: false, link: function postLink(scope, element, attrs, ctrl) { - var target = attrs.faTabHref; + var target = attrs.zfTabHref; var makeActive = function() { element.parent().children().removeClass('is-active'); @@ -198,7 +198,7 @@ angular.module('foundation.tabs') }]); angular.module('foundation.tabs') - .directive('faTabCustom', ['FoundationApi', function(foundationApi) { + .directive('zfTabCustom', ['FoundationApi', function(foundationApi) { return { restrict: 'A', replace: false, @@ -210,7 +210,7 @@ angular.module('foundation.tabs') }]); angular.module('foundation.tabs') - .directive('faTabContentCustom', ['FoundationApi', function(foundationApi) { + .directive('zfTabContentCustom', ['FoundationApi', function(foundationApi) { return { restrict: 'A', link: function(scope, element, attrs) { diff --git a/js/angular/partials/notification-set.html b/js/angular/partials/notification-set.html index 20c722ca..0a1b94bf 100644 --- a/js/angular/partials/notification-set.html +++ b/js/angular/partials/notification-set.html @@ -1,8 +1,8 @@ -{{ notification.content }} + >{{ notification.content }} diff --git a/js/angular/partials/tab-content.html b/js/angular/partials/tab-content.html index e9a49bda..200af42e 100644 --- a/js/angular/partials/tab-content.html +++ b/js/angular/partials/tab-content.html @@ -1,4 +1,4 @@
          -
          +
          diff --git a/js/angular/partials/tabs.html b/js/angular/partials/tabs.html index a213db2a..32d99afa 100644 --- a/js/angular/partials/tabs.html +++ b/js/angular/partials/tabs.html @@ -1,6 +1,6 @@
          -
          +
          From 93b9585b00825ac9a250dd194eb806ef736f9929 Mon Sep 17 00:00:00 2001 From: Antonin Januska Date: Thu, 20 Nov 2014 13:28:42 -0600 Subject: [PATCH 2/5] Angular docs fa to zf --- js/angular/README.md | 162 +++++++++++++++++++++---------------------- 1 file changed, 81 insertions(+), 81 deletions(-) diff --git a/js/angular/README.md b/js/angular/README.md index 4e0e3593..b7b43d3d 100644 --- a/js/angular/README.md +++ b/js/angular/README.md @@ -123,11 +123,11 @@ If you are running in a subdirectory, try setting `requireBase` to the subdirect ###Directives All of the directives are supported as attribute directive so you can add them to an element like so: -`
          ` +`
          ` However, some directives allow element-level declaration like so: -` - × - + + × + ```` Note that you can specify the ID of a specific closeable directive in order to close it remotely (whether it's a parent, child, or has any other relationship to the closeable directive). ````html -× - +× + ```` -**fa-open** -The counter to `fa-close`, `fa-open` sends a signal to a directive that can be trigger through this method. Simply specify the ID of the target element. +**zf-open** +The counter to `zf-close`, `zf-open` sends a signal to a directive that can be trigger through this method. Simply specify the ID of the target element. ````html -Open Modal - +Open Modal + ```` -**fa-toggle** -Similar to the previous two, `fa-toggle` sends a toggle command to a directive that can accept it. A target has to be specified in order for it to work. +**zf-toggle** +Similar to the previous two, `zf-toggle` sends a toggle command to a directive that can accept it. A target has to be specified in order for it to work. ````html -Toggle Modal - +Toggle Modal + ```` Please see documentation on the FoundationApi to learn how to open, close, toggle, and trigger other events programmatically. @@ -223,12 +223,12 @@ Please see documentation on the FoundationApi to learn how to open, close, toggl Structure: ````html - - + Content goes here - - + + ```` ####Actionsheet @@ -237,48 +237,48 @@ Actionsheets allow users to specify some options on top of showing a regular act Using the most default settings, an actionsheet looks like this: ````html - - - + + + My content goes here - - + + ```` -To use a custom buttom, ammend the `fa-as-button` declaration with your custom HTML like so: +To use a custom buttom, ammend the `zf-as-button` declaration with your custom HTML like so: ````html -my button goes here +my button goes here ```` There is also an option to remotely open an actionsheet; however, the actionsheet won't show up under the remote trigger but rather where it had already been placed. ````html -toggle - - - +toggle + + + My content goes here - - + + ```` ####Interchange Interchange allows you to specify what specific content to view based on a media query. The last query to match will be shown. -Because of some cool angular features, you're welcome to either specify the content right away (without including `src`) or, you can specify a partial to be loaded. Loading is done lazily, meaning that even with 20 different `fa-source` declarations, only the correct one will load for the current media query. So if you're on mobile, only the mobile partial will load up. +Because of some cool angular features, you're welcome to either specify the content right away (without including `src`) or, you can specify a partial to be loaded. Loading is done lazily, meaning that even with 20 different `zf-source` declarations, only the correct one will load for the current media query. So if you're on mobile, only the mobile partial will load up. Note that partials do not get RELOADED, meaning that as long as the user is on the page, the various partials will be cached. Structure: ````html - -
          -
          + +
          +
          Page template
          - +           ```` @@ -288,17 +288,17 @@ The modal does not require any specific content within it; however, the example Structure: ````html -Open modal - - × +Open modal + + ×
          content goes here
          - Ok - Cancel + Ok + Cancel
          - + ```` ####Notification @@ -308,11 +308,11 @@ There are two ways to access a notification. Via the static method and the progr The static method is best used for prototyping since it doesn't involve any programming. ````html -Static notification -Static notification + Content goes here - + ```` **Programmatic Method** @@ -321,7 +321,7 @@ The FoundationApi service is a pretty useful service, one function of it is to s To use it, create a notification set like so: ````html - + ```` And then send it a notification with via FoundationApi: @@ -330,10 +330,10 @@ And then send it a notification with via FoundationApi: foundationApi.publish('main-notifications', { title: 'Test', content: 'Test2' }); ```` -You can also use the `fa-notify` directive for simpler messages and prototyping: +You can also use the `zf-notify` directive for simpler messages and prototyping: ````html -Launch notification +Launch notification ```` **Additional options** @@ -347,29 +347,29 @@ On top of setting a title and content, you can also set: ####Off Canvas ````html -open offcanvas - +open offcanvas +

          My content!

          -           + ```` ####Panel ````html -open panel - +open panel + ```` ####Popup Popups use a library called Tether. Tether attaches an element to another element with absolute positioning; however, there is one caveat. If your popup is nested within a scrollable area (not `body`) but it's not the immediate parent of that element, it will lose its positioning. ````html -Open Popup -Open Popup +Content goes here +>Content goes here ```` ####Tabs @@ -378,30 +378,30 @@ Tabs can get a little complicated; however, they also allow for meo flexibility. **default use** ````html - - + + Tab content goes here - - + + Tab content goes here - - + + ```` **displaced use** -Displaced tabs allow us to build tabs (tab navigation) and display the content elsewhere with `fa-tab-content` +Displaced tabs allow us to build tabs (tab navigation) and display the content elsewhere with `zf-tab-content` ````html - - + + Tab content goes here - - + + Tab content goes here - - + + - + ```` **manual use** @@ -410,16 +410,16 @@ Manual usage allows for custom styling and full versatility while retaining the Here's what a custom menu may look like: ````html -
            -
          • Tab One
            • -
          • Tab Two
            • +
              +
            • Tab One
              • +
            • Tab Two
            ```` -The directives `fa-tab-custom` and `fa-tab-href` ensure typical tab button behavior where active tab button gets an `is-active` class. `fa-tab-href` should point to an ID of a tab. +The directives `zf-tab-custom` and `zf-tab-href` ensure typical tab button behavior where active tab button gets an `is-active` class. `zf-tab-href` should point to an ID of a tab. ````html -
            +
            Content!
            Second content!
            @@ -435,7 +435,7 @@ Here's an example: ````html - + ```` The modal will automatically register itself as a subscriber in the FoundationApi under `my-modal`. The code for the directive indicates that it listens for 3 different messages: `open`, `close`, and `toggle` as well as aliases for the former two `show` and `hide`. @@ -448,12 +448,12 @@ foundationApi.publish('my-modal', 'open'); Make sure to include FoundationApi as a dependency in the controller or wherever else you want to use it. The best bet to hooking into various directives is to check the code and see what each directive subscribes to. -In fact, the directives `fa-close`, `fa-open`, and `fa-toggle` are wrappers for FoundationApi events. +In fact, the directives `zf-close`, `zf-open`, and `zf-toggle` are wrappers for FoundationApi events. ###Building your own app Most of the modules are dependent on the `foundation.common.services` module but outside of that, they're portable. You're welcome to take them and use them as you need to; however, there are some things to know about: -- any and all helpers such as `fa-open` and `fa-close` are packaged in the `foundation.common.directives` module so if there is a need for them, require the module. +- any and all helpers such as `zf-open` and `zf-close` are packaged in the `foundation.common.directives` module so if there is a need for them, require the module. - the `app.js` file which bootstraps the application can be fully bypassed so you can build your own. Make sure to use proper dependency injection for the modules you DO want to use. - if you install the repo as part of bower, make sure to reference all the right files in your build process in your Gulpfile From b606336911d0ec09676254f545129d3087f2c557 Mon Sep 17 00:00:00 2001 From: Antonin Januska Date: Fri, 21 Nov 2014 07:42:08 -0600 Subject: [PATCH 3/5] Fixed zf-close --- js/angular/common/common.directives.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/angular/common/common.directives.js b/js/angular/common/common.directives.js index 0e4fb05b..e47530ce 100644 --- a/js/angular/common/common.directives.js +++ b/js/angular/common/common.directives.js @@ -14,7 +14,7 @@ angular.module('foundation.common.directives') parentElement = ''; } - if(typeof tempElement.attr('fa-closable') !== 'undefined' && tempElement.attr('fa-closable') !== false) { + if(typeof tempElement.attr('zf-closable') !== 'undefined' && tempElement.attr('zf-closable') !== false) { parentElement = tempElement; } From b21ed986c104b1903fe202a3561491b0efd79771 Mon Sep 17 00:00:00 2001 From: Antonin Januska Date: Fri, 21 Nov 2014 07:58:26 -0600 Subject: [PATCH 4/5] More closeable elements --- js/angular/directives/actionsheet.js | 1 + js/angular/directives/notification.js | 1 + js/angular/directives/popup.js | 1 + 3 files changed, 3 insertions(+) diff --git a/js/angular/directives/actionsheet.js b/js/angular/directives/actionsheet.js index 7450a2f5..b90f3941 100644 --- a/js/angular/directives/actionsheet.js +++ b/js/angular/directives/actionsheet.js @@ -26,6 +26,7 @@ angular.module('foundation.actionsheet') templateUrl: '/partials/actionsheet.html', controller: 'ZfActionSheetController', link: function(scope, element, attrs, controller) { + attrs.$set('zf-closable', 'actionsheet'); foundationApi.subscribe(attrs.id, function(msg) { if (msg == 'toggle') { controller.toggle(); diff --git a/js/angular/directives/notification.js b/js/angular/directives/notification.js index 89074b11..a56cefbf 100644 --- a/js/angular/directives/notification.js +++ b/js/angular/directives/notification.js @@ -67,6 +67,7 @@ angular.module('foundation.notification') link: function(scope, element, attrs, controller) { scope.active = false; scope.position = scope.position ? scope.position.split(' ').join('-') : ''; + attrs.$set('zf-closable', 'notification'); //allow DOM to change before activating setTimeout(function() { diff --git a/js/angular/directives/popup.js b/js/angular/directives/popup.js index 690d29d3..00d454a9 100644 --- a/js/angular/directives/popup.js +++ b/js/angular/directives/popup.js @@ -15,6 +15,7 @@ angular.module('foundation.popup') link: function(scope, element, attrs) { scope.active = false; scope.target = scope.target || false; + attrs.$set('zf-closeable', 'popup'); var attachment = scope.pinTo || 'top center'; var tetherInit = false; From dd49090bbe3587a2dbce0046cf9fc5d82e24d902 Mon Sep 17 00:00:00 2001 From: Antonin Januska Date: Fri, 21 Nov 2014 12:34:18 -0600 Subject: [PATCH 5/5] Scope apply tabs --- js/angular/directives/tabs.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/js/angular/directives/tabs.js b/js/angular/directives/tabs.js index e8f65b54..61f57df8 100644 --- a/js/angular/directives/tabs.js +++ b/js/angular/directives/tabs.js @@ -18,6 +18,8 @@ angular.module('foundation.tabs') tab.scope.active = true; } }); + + $scope.$apply(); }; controller.addTab = function addTab(tabScope) {