 	"base"
 	"libs/jquery-layout"
 ], (App) ->
-	App.directive "layout", ["$parse", "ide", ($parse, ide) ->
+	App.directive "layout", ["$parse", "$compile", "ide", ($parse, $compile, ide) ->
 		return {
 			compile: () ->
 				pre: (scope, element, attrs) ->
 					name = attrs.layout
+
+					customTogglerPane = scope.$eval(attrs.customTogglerPane)
+					customTogglerTooltipOpen = scope.$eval(attrs.customTogglerTooltipOpen)
+					customTogglerTooltipClose = scope.$eval(attrs.customTogglerTooltipClose)
+					hasCustomToggler = customTogglerPane? and customTogglerTooltipOpen? and customTogglerTooltipClose?
 
 					if attrs.spacingOpen?
 						spacingOpen = parseInt(attrs.spacingOpen, 10)

						state = element.layout().readState()
						scope.$broadcast "layout:#{name}:resize", state
						repositionControls()
						resetOpenStates()
						
					oldWidth = element.width()

									right: state.east.size
								})

					repositionCustomToggler = () ->
						if !customTogglerEl?
							return
						state = element.layout().readState()
						if customTogglerPane == "east"
							if state.east?
								customTogglerEl.css({
									right: if state.east.initClosed then 0 else state.east.size
								})
						else if customTogglerPane == "west"
							if state.west?
								customTogglerEl.css({
									left: if state.west.initClosed then 0 else state.west.size
								})

					resetOpenStates = () ->
						state = element.layout().readState()
						if attrs.openEast? and state.east?
