opendev/storyboard-webclient
Code Issues Proposed changes

Remove boostrap.js

Browse Source 
As long as storyboard is using UI Bootstrap
http://angular-ui.github.io/bootstrap/ we do not need bootstrap.js
all the needed components are already present in the angular library.

    The patch mainly consists in fixing the use of dropdown, as long
as the dropdown directive already use a stopPropagation and a
preventDefault we do not need to call it ourselves even in a custom
directive.

Change-Id: I72cceaaaf8371583e10f955862699d4fd41e7ba5
This commit is contained in:
Maxime Vidori 2014-06-12 14:05:39 +02:00
parent cf7985da2f
commit e05fcc07ec
6 changed files with 15 additions and 33 deletions

3
src/app/templates/util/tag_complete.html

@ -1,8 +1,7 @@
<div class="dropdown">
{{model}}
<div class="form-control tag-input"
ng-click="focus()"
data-toggle="dropdown">
ng-click="focus()">
<div class="tag"
ng-repeat="tag in selectedTags"
ng-click="noFocus($event)">

8
src/app/templates/util/task_priority_dropdown.html

@ -2,23 +2,23 @@
{{priority | taskPriorityLabel}}
</span>
<div class="dropdown" ng-show="editable">
<a class="btn btn-{{style}} btn-xs dropdown-toggle" data-toggle="dropdown">
<a class="btn btn-{{style}} btn-xs dropdown-toggle">
{{priority | taskPriorityLabel}}
<i class="fa fa-caret-down"></i>
</a>
<ul class="dropdown-menu dropdown-menu-right">
<li ng-class="{disabled: priority == 'high'}">
<a href="" ng-click="setPriority('high', $event)">
<a href="" ng-click="setPriority('high')">
{{'high' | taskPriorityLabel}}
</a>
</li>
<li ng-class="{disabled: priority == 'medium'}">
<a href="" ng-click="setPriority('medium', $event)">
<a href="" ng-click="setPriority('medium')">
{{'medium' | taskPriorityLabel}}
</a>
</li>
<li ng-class="{disabled: priority == 'low'}">
<a href="" ng-click="setPriority('low', $event)">
<a href="" ng-click="setPriority('low')">
{{'low' | taskPriorityLabel}}
</a>
</li>

12
src/app/templates/util/task_status_dropdown.html

@ -2,33 +2,33 @@
{{status | taskStatusLabel}}
</span>
<div class="dropdown" ng-show="editable">
<a class="btn btn-{{style}} btn-xs dropdown-toggle" data-toggle="dropdown">
<a class="btn btn-{{style}} btn-xs dropdown-toggle">
{{status | taskStatusLabel}}
<i class="fa fa-caret-down"></i>
</a>
<ul class="dropdown-menu dropdown-menu-right">
<li ng-class="{disabled: status == 'invalid'}">
<a href="" ng-click="setStatus('invalid', $event)">
<a href="" ng-click="setStatus('invalid')">
{{'invalid' | taskStatusLabel}}
</a>
</li>
<li ng-class="{disabled: status == 'todo'}">
<a href="" ng-click="setStatus('todo', $event)">
<a href="" ng-click="setStatus('todo')">
{{'todo' | taskStatusLabel}}
</a>
</li>
<li ng-class="{disabled: status == 'inprogress'}">
<a href="" ng-click="setStatus('inprogress', $event)">
<a href="" ng-click="setStatus('inprogress')">
{{'inprogress' | taskStatusLabel}}
</a>
</li>
<li ng-class="{disabled: status == 'review'}">
<a href="" ng-click="setStatus('review', $event)">
<a href="" ng-click="setStatus('review')">
{{'review' | taskStatusLabel}}
</a>
</li>
<li ng-class="{disabled: status == 'merged'}">
<a href="" ng-click="setStatus('merged', $event)">
<a href="" ng-click="setStatus('merged')">
{{'merged' | taskStatusLabel}}
</a>
</li>

11
src/app/util/directive/task_priority_dropdown.js

@ -32,24 +32,17 @@ angular.module('sb.util').directive('taskPriorityDropdown',
onChange: '&',
editable: '@'
},
link: function ($scope, element) {
link: function ($scope) {
// Initialize the style.
$scope.style = 'default';
// Make sure our scope can set its own priority
$scope.setPriority = function (newPriority, $event) {
$scope.setPriority = function (newPriority) {
if (newPriority !== $scope.priority) {
$scope.priority = newPriority;
$scope.onChange({priority: newPriority});
}
// We have to manually stop propagation so the control
// doesn't leak its events to other parts of the app.
$event.stopPropagation();
// This also forces us to close the dropdown manually.
element.find('.dropdown').dropdown('toggle');
};
}
};

11
src/app/util/directive/task_status_dropdown.js

@ -56,25 +56,18 @@ angular.module('sb.util').directive('taskStatusDropdown',
onChange: '&',
editable: '@'
},
link: function ($scope, element) {
link: function ($scope) {
// Initialize the style.
$scope.style = setStyle($scope.status);
// Make sure our scope can set its own status
$scope.setStatus = function (newStatus, $event) {
$scope.setStatus = function (newStatus) {
if (newStatus !== $scope.status) {
$scope.style = setStyle(newStatus);
$scope.status = newStatus;
$scope.onChange({status: newStatus});
}
// We have to manually stop propagation so the control
// doesn't leak its events to other parts of the app.
$event.stopPropagation();
// This also forces us to close the dropdown manually.
element.find('.dropdown').dropdown('toggle');
};
}
};

3
src/index.html

@ -31,14 +31,11 @@
<script src="jquery/jquery.js"></script>
<script src="angular/angular.js"></script>
<script src="angular-elastic/elastic.js"></script>
<script src="angular-bootstrap/ui-bootstrap.js"></script>
<script src="angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script src="angular-ui-router/release/angular-ui-router.js"></script>
<script src="angular-resource/angular-resource.js"></script>
<script src="angular-local-storage/angular-local-storage.js"></script>
<script src="angular-sanitize/angular-sanitize.js"></script>
<script src="bootstrap/dist/js/bootstrap.js"></script>
<!-- endbuild -->
<link rel="stylesheet" href="styles/main.css">