Commit 74b12790 authored by RawKStar77's avatar RawKStar77 Committed by Randall Leeds

Change forms so that they use the slow validate directive, remove the "nice...

Change forms so that they use the slow validate directive, remove the "nice forms" CSS class and corresponding divs, change name of settingsPanel directive to "panels" and reorganize the code to be a bit more modular and clean. Remove hidden heatmap stuff. Add additional comments
parent e29ed070
......@@ -367,62 +367,36 @@ confirmPasswordCheck = ['$resource', ($resource)->
require: 'ngModel'
]
# The settings panel houses settings.
# Thought: should each setting be it's own directive? Perhaps we should start a settings.coffee file?
# For example: the toggle heatmap directive.
settingsPanel = ->
panels = ->
# This panels directive houses panels in the sidebar (such as settings, accountmanagement, etc). Each panel is it's own directive.
link: (scope, elem, attr, ctrl) ->
scope.togglePanel = (panel)->
scope.togglePanels = (panel)->
scope.activePanel.active = !scope.activePanel.active
scope.activePanel = panel
scope.activePanel.active = !scope.activePanel.active
# scope.toggleHideHeatmap = ->
# scope.hideheatmap = !scope.hideheatmap
# parent.annotator.plugins.Heatmap.hideheatmap(scope.hideheatmap)
# console.log "Heatmap toggled."
visibleHighlights = ->
return parent.window.annotator.visibleHighlights
scope.$watch visibleHighlights, (newValue, oldValue) ->
if newValue != oldValue
if scope.hideheatmap and newValue
parent.annotator.plugins.Heatmap.hideheatmap(false)
if scope.hideheatmap and !newValue
parent.annotator.plugins.Heatmap.hideheatmap(true)
# Ujvari, you may want to move this to the controllers.coffee file.
controller: ($scope, $rootScope, $filter, $element) ->
$rootScope.settingsPanel = false
$rootScope.toggleSettingsPanel = ->
# Toggles Settings Panel shown or hidden.
$rootScope.settingsPanel = !$rootScope.settingsPanel
$rootScope.showPanels = false
# Toggles Panels shown or hidden.
$rootScope.toggleShowPanels = ->
$rootScope.showPanels = !$rootScope.showPanels
$rootScope.viewState.showControls = false
# $scope.hideheatmap = false
# This is the list of panels that will be shown. In the settingsPanel.html template
# This is the list of panels that will be shown. In the panels.html template
# there are elements with ng-show on them, for example:
# <div ng-show="activePanel.name == 'Notifications'">
# My Html for a new panel.
# </div>
$scope.panels = [
$scope.panelList = [
{name:"Profile", active: true, icon:"user-icon"}
{name:"Account", active: false, icon:"plus-icon"}
{name:"Settings", active: false, icon:"cog-icon"}]
$scope.activePanel = $scope.panels[0]
$scope.submit = (form) ->
console.log form
# Handles submitting of the form.
# Jake's Note: there is an addional piece of UI I would like to implement. The basic idea being
# to give some visual indication that the changes they have made have been applied successfully.
# If they change their email, it would be nice to have an event (or something) to tell the front end that
# the request was successful.
$scope.activePanel = $scope.panelList[0]
restrict: 'C'
templateUrl: 'settingspanel.html'
templateUrl: 'panels.html'
accountManagement = ->
link: (scope, elem, attr, ctrl) ->
......@@ -438,16 +412,25 @@ account, and you must delete each annotation individually, by hand. Deleting an
delete replies to that annotation, it creates a blank stub that replies are still attached to."
if r
return
$scope.submit = (form) ->
console.log form
# Handles submitting of the form.
# Jake's Note: there is an addional piece of UI I would like to implement. The basic idea being
# to give some visual indication that the changes they have made have been applied successfully.
# If they change their email, it would be nice to have an event (or something) to tell the front end that
# the request was successful.
restrict: 'C'
templateUrl: 'accountmanagement.html'
# This is the acount profile stuff that will eventually be outside of the settings panel.
# Rational for keeping it in the settings panel (temporarily):
# 1. We might as well write the back end for this stuff, then when I do the front end stuff for profiles we'll
# have the backend work started.
# 2. As a directive it is extremely easy to move this around and get it out of the side bar.
accountProfile = ->
# This is the acount profile stuff that will eventually be outside of the settings panel.
# Rational for keeping it in the settings panel (temporarily):
# 1. We might as well write the back end for this stuff, then when I do the front end stuff for profiles we'll
# have the backend work started.
# 2. As a directive it is extremely easy to move this around and get it out of the side bar.
link: (scope, elem, attr, ctrl) ->
scope.editProfile = ->
# Switches profile into edit mode.
......@@ -457,15 +440,23 @@ accountProfile = ->
# Is there any thing else we should be collecting for now?
name : "Jake Hartnell"
password : "password"
twitter: "@JakeHartnell"
location : "Berkeley, CA"
bio : "Science Fiction Writer currently working as a Product designer and frontend engineer at Hypothes.is."
website : "http://jakehartnell.com"
gravatar : ""
restrict: 'C'
templateUrl: 'profile.html'
settings = ->
# Question: Should each setting be it's own directive?
link: (scope, elem, attr, ctrl) ->
return
controller: ($scope) ->
return
restrict: 'C'
templateUrl: 'settings.html'
angular.module('h.directives', ['ngSanitize', 'ngTagsInput'])
.directive('formValidate', formValidate)
.directive('fuzzytime', fuzzytime)
......@@ -477,8 +468,9 @@ angular.module('h.directives', ['ngSanitize', 'ngTagsInput'])
.directive('username', username)
.directive('repeatAnim', repeatAnim)
.directive('whenscrolled', whenscrolled)
.directive('settingsPanel', settingsPanel)
.directive('panels', panels)
.directive('match', match)
.directive('confirmPasswordCheck', confirmPasswordCheck)
.directive('accountManagement', accountManagement)
.directive('accountProfile', accountProfile)
.directive('settings', settings)
......@@ -481,9 +481,3 @@ class Annotator.Plugin.Heatmap extends Annotator.Plugin
commentClick: =>
@dynamicBucket = false
annotator.showViewer "Comments", @buckets[@_getCommentBucket()]
hideheatmap : (bool) ->
if bool
$(".annotator-frame").addClass('hiddenheatmap')
else
$(".annotator-frame").removeClass('hiddenheatmap')
......@@ -601,12 +601,10 @@ pre {outline: 1px solid #ccc; padding: 5px; margin: 5px; }
}
}
// Settings Panel //////////////////////////////
// Panels //////////////////////////////
.slideover{
@extend .content;
@include stretch-y;
@include transition(transform .4s);
@include translateX(100%);
height: 100%;
overflow: hidden;
......@@ -614,6 +612,7 @@ pre {outline: 1px solid #ccc; padding: 5px; margin: 5px; }
right: 0px;
left: 0px;
z-index: 5;
max-width: none !important;
&.shown {
@include translateX(0);
......@@ -660,6 +659,14 @@ pre {outline: 1px solid #ccc; padding: 5px; margin: 5px; }
background-color: white;
width: 100%;
font-family: $sansFontFamily;
input {
margin: 5px 0;
}
textarea {
margin: 5px 0;
}
}
}
......@@ -150,33 +150,6 @@ $base-font-size: 14px;
&.annotator-collapsed {
margin-left: 0;
&.hiddenheatmap {
.annotator-heatmap {
@include transition(left .25s);
left: -($heatmap-width - 10px);
&:hover {
left: -($heatmap-width + 18px);
.heatmap-pointer {
&.upper {
display: block;
}
&.lower {
display: block;
}
}
}
}
}
.heatmap-pointer {
&.upper {
display: none;
}
&.lower {
display: none;
}
}
}
* {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment