Created
June 5, 2015 05:12
-
-
Save stephencroberts/baf9f4bc60e2b573de36 to your computer and use it in GitHub Desktop.
Angular head module
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
'use strict' | |
headConfig = [ | |
{ | |
name: 'title' | |
selector: 'title' | |
template: '<title></title>' | |
html: true | |
} | |
{ | |
name: 'description' | |
selector: 'meta[name="descripiton"]' | |
template: '<meta name="description">' | |
attribute: 'description' | |
} | |
] | |
angular | |
.module('app.head') | |
.constant('headConfig', headConfig) |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
'use strict' | |
### @ngInject ### | |
head = (config, head) -> | |
link = (scope, element, attrs) -> | |
# Store references to the head elements so we can micromanage them | |
elements = {} | |
# Service sets a dirty flag when a value changes. We can just | |
# render all the metadata when it's dirty | |
scope.$watch (-> head.dirty()), (dirty) -> | |
# Only update when dirty | |
return unless dirty | |
# Update each meta item | |
for item in config | |
# Get value from service | |
value = head.getValue(item.name) | |
# If we don't have a reference to the element yet... | |
unless elements[item.name] | |
# See it if exists already | |
els = $(element).find(item.selector) | |
# If it exists, create a reference to it, otherwise create it | |
if els.length | |
elements[item.name] = els.eq 0 if els.length | |
else | |
elements[item.name] = angular.element item.template | |
element.append elements[item.name] | |
# Update the value | |
if value | |
elements[item.name].html value if item.html | |
elements[item.name].attr item.attribute, value if item.attribute | |
else | |
elements[item.name].remove() | |
delete elements[item.name] | |
# Service isn't dirty anymore | |
head.setDirty false | |
scope.$on '$stateChangeSuccess', -> | |
head.reset() | |
{ | |
restrict: 'A' | |
link: link | |
} | |
head.$inject = ['headConfig', 'head'] | |
angular | |
.module('app.head') | |
.directive('head', head) |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
'use strict' | |
### @ngInject ### | |
Home = (head, hero, featured, recent) -> | |
@hero = hero | |
@featured = featured | |
@recent = recent | |
head.setValue 'title', 'Plugged In' | |
head.setValue 'description', 'Plugged In reviews movies, videos, music, TV and games from a Christian perspective. We\'re shining a light on the world of popular entertainment.' | |
return | |
Home.$inject = ['head', 'hero', 'featured', 'recent'] | |
angular | |
.module('app.home') | |
.controller('Home', Home) |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
'use strict' | |
head = -> | |
@values = {} | |
setDirty = (dirty) => @dirty = dirty | |
dirty = => @dirty | |
setValue = (key, value) => | |
@values[key] = value | |
setDirty true | |
getValue = (key) => @values[key] | |
reset = => | |
@values = {} | |
setDirty true | |
{ | |
setDirty: setDirty | |
dirty: dirty | |
setValue: setValue | |
getValue: getValue | |
reset: reset | |
} | |
angular | |
.module('app.head') | |
.factory('head', head) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment