Commit e9b60ee4 authored by Xavier Watkins's avatar Xavier Watkins
Browse files

Merge branch 'master' of https://github.com/ebi-uniprot/QuickGoFE into beta

# By ljgarcia (3) and Xavier Watkins (2)
# Via GitHub (1) and Xavier Watkins (1)
* 'master' of https://github.com/ebi-uniprot/QuickGoFE:
  Not sure why watch was only on scripts/
  Fix bug related to basket export button in Safari.
  Fix bug related to basket export button.
  Avoid GeneProdcut div to go on top of Terms one.
  Added functionality to toggle filter sections
parents d36796a8 9e962293
......@@ -69,7 +69,7 @@ module.exports = function (grunt) {
tasks: ['wiredep']
},
js: {
files: ['<%= yeoman.app %>/scripts/{,*/}*.js'],
files: ['<%= yeoman.app %>/{,*/}*.js'],
tasks: ['newer:jshint:all', 'newer:jscs:all'],
options: {
livereload: '<%= connect.options.livereload %>'
......
......@@ -10,7 +10,7 @@
<!-- TAXON -->
<div class="advanced-filter-content" uib-dropdown-menu>
<form>
<div class="form-group">
<div class="form-group y-scroll-200">
<ul>
<li ng-repeat="(taxId, value) in filters.taxon" class="checkbox">
<label>
......@@ -19,14 +19,17 @@
</li>
</ul>
</div>
<div class="form-group">
<p>...or enter taxon identifiers:</p>
<textarea ng-model="taxonTextArea" placeholder="9606,100090,10116,..." class="form-control"></textarea>
<p class="pull-right"><small>Visit <a href="http://www.uniprot.org/taxonomy/" target="_blank">UniProt Taxonomy</a> to find identifiers for
<a ng-click="toggleMore('taxon')" ng-hide="view['taxon']">Add more...</a>
<div ng-show="view['taxon']">
<div class="form-group">
<p>...or enter taxon identifiers:</p>
<textarea ng-model="taxonTextArea" placeholder="9606,100090,10116,..." class="form-control"></textarea>
<p class="pull-right"><small>Visit <a href="http://www.uniprot.org/taxonomy/" target="_blank">UniProt Taxonomy</a> to find identifiers for
other taxonomic groups</small></p>
</div>
<div class="form-group">
<button class="btn btn-default" type="button" ng-click="addTaxons()">Add</button>
</div>
<div class="form-group">
<button class="btn btn-default" type="button" ng-click="addTaxons()">Add</button>
</div>
</div>
<hr>
<div class="pull-right">
......@@ -50,7 +53,7 @@
<ul>
<li ng-repeat="(gpID, value) in filters.gpID" class="checkbox">
<label>
<input type="checkbox" ng-model="filters.gpID[gpID]"> {{gpID}}
<input type="checkbox" ng-model="filters.gpID[gpID]"> {{gpID}}
</label>
</li>
</ul>
......@@ -61,38 +64,41 @@
<div class="form-group">
<button class="btn btn-default" type="button" ng-click="addGPs()">Add</button>
</div>
<hr>
<div class="form-group">
<p>Type:</p>
<ul>
<li class="checkbox">
<label>
<input type="checkbox" ng-model="filters.gpType['protein']" > proteins</label>
</li>
<li class="checkbox">
<label>
<input type="checkbox" ng-model="filters.gpType['rna']" > RNAs</label>
</li>
<li class="checkbox">
<label>
<input type="checkbox" ng-model="filters.gpType['complex']" > complexes</label>
</li>
</ul>
</div>
<hr>
<div class="form-group">
<!-- 4 choices -->
<p>List of gene products:</p>
<ul>
<li ng-repeat="gpSet in geneProductSets" class="checkbox">
<label>
<input id="{{gpSet.value}}_chk" type="checkbox" ng-model="filters.gpSet[gpSet.value]" >
<a href="{{gpSet.link}}" targe="_blank">{{gpSet.name}}</a> {{gpSet.description}}
</label>
</li>
</ul>
</div>
<a ng-click="toggleMore('gpId')" ng-hide="view['gpId']">Add more...</a>
<div ng-show="view['gpId']">
<hr>
<div class="form-group">
<p>Type:</p>
<ul>
<li class="checkbox">
<label>
<input type="checkbox" ng-model="filters.gpType['protein']"> proteins</label>
</li>
<li class="checkbox">
<label>
<input type="checkbox" ng-model="filters.gpType['rna']"> RNAs</label>
</li>
<li class="checkbox">
<label>
<input type="checkbox" ng-model="filters.gpType['complex']"> complexes</label>
</li>
</ul>
</div>
<hr>
<div class="form-group">
<!-- 4 choices -->
<p>List of gene products:</p>
<ul>
<li ng-repeat="gpSet in geneProductSets" class="checkbox">
<label>
<input id="{{gpSet.value}}_chk" type="checkbox" ng-model="filters.gpSet[gpSet.value]">
<a href="{{gpSet.link}}" targe="_blank">{{gpSet.name}}</a> {{gpSet.description}}
</label>
</li>
</ul>
</div>
</form>
</div>
<hr>
<div class="pull-right">
<button class="btn quickgo-btn" type="button" ng-click="resetgpIds()">Reset</button>
......@@ -102,7 +108,7 @@
</li>
<!-- GO TERMS -->
<li uib-dropdown auto-close="outsideClick" is-open="status.isopenGT">
<li uib-dropdown auto-close="outsideClick" is-open="status.isopenGT">
<button type="button" class="btn btn-default quickgo-btn icon" ng-class="{'icon-functional active-filter' : isActiveFilter('goID')}" data-icon="/" uib-dropdown-toggle>
GO terms <span class="caret"></span>
<br>
......@@ -115,7 +121,7 @@
<ul>
<li ng-repeat="(basketId, value) in filters.goID" class="checkbox">
<label>
<input type="checkbox" ng-model="filters.goID[basketId]" > {{basketId}} {{namesMap[basketId]}}</label>
<input type="checkbox" ng-model="filters.goID[basketId]"> {{basketId}} {{namesMap[basketId]}}</label>
</li>
</ul>
</div>
......@@ -131,36 +137,39 @@
<div class="form-group">...or a predefined GO slim set:
<select ng-model="$parent.$parent.selectedPreDefinedSlimSet" ng-options="predefinedSet.subset for predefinedSet in predefinedSlimSets" ng-change="updatePredefinedSets()"></select>
</div>
<a ng-click="toggleMore('go-options')" ng-hide="view['go-options']">Options</a>
<div ng-show="view['go-options']">
<hr>
<div><strong>Select how you want to use the terms that you have chosen:</strong>
{{filters.goTermUse}}
<ul>
<li class="checkbox">
<input type="radio" ng-model="filters.goTermUse" value="ancestor" ng-change="updateFilters()"> Find annotations to <strong>descendants</strong> of these terms.
</li>
<li class="checkbox">
<input type="radio" ng-model="filters.goTermUse" value="slim" > Use these terms as a <strong>GO slim</strong>.</li>
<li class="checkbox">
<input type="radio" ng-model="filters.goTermUse" value="exact" > Use these terms as an <strong>exact</strong> match.</li>
</ul>
</div>
<hr>
<!-- Select Relationship-->
<div ng-show="filters.goTermUse=='slim' || filters.goTermUse=='ancestor'"><strong>Select which relationship an annotated term should have to the terms above <a href="http://geneontology.org/page/ontology-relations" target="_blank">(more info)</a>:</strong>
<ul>
<li class="checkbox">
<input type="radio" name="closure" value="I" ng-model="filters.goRelations" > is_a
</li>
<li class="checkbox">
<input type="radio" name="closure" value="IPO" ng-model="filters.goRelations" > is_a, part_of, occurs_in
</li>
<li class="checkbox">
<input type="radio" name="closure" value="IPOR" ng-model="filters.goRelations" > is_a, part_of, occurs_in, regulates
</li>
</ul>
</div>
<hr>
<div><strong>Select how you want to use the terms that you have chosen:</strong> {{filters.goTermUse}}
<ul>
<li class="checkbox">
<input type="radio" ng-model="filters.goTermUse" value="ancestor" ng-change="updateFilters()"> Find annotations to <strong>descendants</strong> of these terms.
</li>
<li class="checkbox">
<input type="radio" ng-model="filters.goTermUse" value="slim"> Use these terms as a <strong>GO slim</strong>.</li>
<li class="checkbox">
<input type="radio" ng-model="filters.goTermUse" value="exact"> Use these terms as an <strong>exact</strong> match.</li>
</ul>
</div>
<hr>
<!-- Select Relationship-->
<div ng-show="filters.goTermUse=='slim' || filters.goTermUse=='ancestor'"><strong>Select which relationship an annotated term should have to the terms above <a href="http://geneontology.org/page/ontology-relations" target="_blank">(more info)</a>:</strong>
<ul>
<li class="checkbox">
<input type="radio" name="closure" value="I" ng-model="filters.goRelations"> is_a
</li>
<li class="checkbox">
<input type="radio" name="closure" value="IPO" ng-model="filters.goRelations"> is_a, part_of, occurs_in
</li>
<li class="checkbox">
<input type="radio" name="closure" value="IPOR" ng-model="filters.goRelations"> is_a, part_of, occurs_in, regulates
</li>
</ul>
</div>
</form>
</div>
<hr>
<div class="pull-right">
<button class="btn quickgo-btn" type="button" ng-click="resetGoTerms()">Reset</button>
......@@ -170,7 +179,7 @@
</li>
<!-- ASPECT -->
<li uib-dropdown auto-close="outsideClick" is-open="status.isopenAspect">
<li uib-dropdown auto-close="outsideClick" is-open="status.isopenAspect">
<button type="button" class="btn btn-default quickgo-btn icon" ng-class="{'icon-functional active-filter' : isActiveFilter('aspect')}" data-icon="/" uib-dropdown-toggle>
Aspect <span class="caret"></span>
<br>
......@@ -181,13 +190,13 @@
<li class="form-group">
<label class="checkbox">
<input type="checkbox" ng-model="filters.aspect['Function']" > Molecular Function
<input type="checkbox" ng-model="filters.aspect['Function']"> Molecular Function
</label>
<label class="checkbox">
<input type="checkbox" ng-model="filters.aspect['Process']" > Biological Process
<input type="checkbox" ng-model="filters.aspect['Process']"> Biological Process
</label>
<label class="checkbox">
<input type="checkbox" ng-model="filters.aspect['Component']" > Cellular Component
<input type="checkbox" ng-model="filters.aspect['Component']"> Cellular Component
</label>
</li>
</form>
......@@ -215,30 +224,34 @@
<ul>
<li ng-repeat="(ecoID, val) in filters.ecoID" class="checkbox">
<label>
<input type="checkbox" ng-model="filters.ecoID[ecoID]" >
<input type="checkbox" ng-model="filters.ecoID[ecoID]">
<a ng-click="showEvidenceCodeOntologyGraph('{{ecoID}}')">{{ecoID}}</a>
<strong>{{namesMap[ecoID].evidenceGOID}}</strong> {{namesMap[ecoID].evidenceName}}
</label>
</li>
</ul>
</div>
<hr>
<div class="form-group">
<textarea class="form-control" ng-model="ecoTextArea" placeholder="ECO:0000352,..."></textarea>
</div>
<div class="form-group">
<button class="btn btn-default" type="button" ng-click="addECOs()">Add</button>
</div>
<a ng-click="toggleMore('evidence')" ng-hide="view['evidence']">Add more...</a>
<div ng-show="view['evidence']">
<hr>
<hr>
<div class="form-group">
<textarea class="form-control" ng-model="ecoTextArea" placeholder="ECO:0000352,..."></textarea>
</div>
<div class="form-group">
<button class="btn btn-default" type="button" ng-click="addECOs()">Add</button>
</div>
<div class="radio">
<input type="radio" ng-model="filters.ecoTermUse" value="ancestor" > Include Child Terms
</div>
<div class="radio">
<input type="radio" ng-model="filters.ecoTermUse" value="exact" /> Exact match
</div>
<hr>
<div class="radio">
<input type="radio" ng-model="filters.ecoTermUse" value="ancestor"> Include Child Terms
</div>
<div class="radio">
<input type="radio" ng-model="filters.ecoTermUse" value="exact" /> Exact match
</div>
</form>
</div>
<hr>
<div class="pull-right">
<button class="btn quickgo-btn" type="button" ng-click="resetECOs()">Reset</button>
......@@ -248,10 +261,8 @@
</li>
<li>
<button type="button" class="btn btn-default quickgo-btn icon"
ng-class="{'icon-functional active-filter' : isActiveFilter('qualifier')
|| isActiveFilter('referenceSearch') || isActiveFilter('with') || isActiveFilter('assignedby')}"
data-icon="/" ng-click="showMore = (showMore? false : true)">
<button type="button" class="btn btn-default quickgo-btn icon" ng-class="{'icon-functional active-filter' : isActiveFilter('qualifier')
|| isActiveFilter('referenceSearch') || isActiveFilter('with') || isActiveFilter('assignedby')}" data-icon="/" ng-click="showMore = (showMore? false : true)">
More <span class="caret"></span>
</button>
</li>
......@@ -271,7 +282,7 @@
<div ng-repeat="aQualifier in qualifiers" class="checkbox">
<label>
<input type="checkbox" ng-model="filters.qualifier[aQualifier.qualifier]" > {{aQualifier.name}}
<input type="checkbox" ng-model="filters.qualifier[aQualifier.qualifier]"> {{aQualifier.name}}
</label>
</div>
<div class="form-group">
......@@ -279,11 +290,6 @@
</div>
<p>Further details on the usage of the qualifier column can be found <a href="http://www.geneontology.org/page/go-annotation-conventions#qual" target="_blank">here</a>.</p>
</form>
<hr>
<div class="pull-right">
<button class="btn quickgo-btn" type="button" ng-click="resetQualifier()">Reset</button>
<button class="btn quickgo-btn" type="button" ng-click="updateFilters()">Apply</button>
</div>
</div>
</div>
......@@ -297,13 +303,15 @@
<ul>
<li ng-repeat="(refId, value) in filters.referenceSearch" class="checkbox">
<label>
<input type="checkbox" ng-model="filters.referenceSearch[refId]" > <strong>{{refId}}</strong> {{namesMap[refId]}}
<input type="checkbox" ng-model="filters.referenceSearch[refId]"> <strong>{{refId}}</strong> {{namesMap[refId]}}
</label>
</td>
</li>
</ul>
</div>
<p>*: Any matches will be displayed</p>
<a ng-click="toggleMore('reference')" ng-hide="view['reference']">Add more...</a>
<div ng-show="view['reference']">
<hr>
<div class="form-group">
<textarea class="form-control" ng-model="referenceTextArea" placeholder="PMID:25101996, 25101996, ..."></textarea>
......@@ -311,12 +319,8 @@
<div class="form-group">
<button class="btn btn-default" type="button" ng-click="addReferences()">Add</button>
</div>
</div>
</form>
<hr>
<div class="pull-right">
<button class="btn quickgo-btn" type="button" ng-click="resetReference()">Reset</button>
<button class="btn quickgo-btn" type="button" ng-click="updateFilters()">Apply</button>
</div>
</div>
</div>
......@@ -330,7 +334,7 @@
<ul>
<li ng-repeat="(withID, value) in filters.with" class="checkbox">
<label>
<input type="checkbox" ng-model="filters.with[withID]" >
<input type="checkbox" ng-model="filters.with[withID]">
<strong>{{withID}}</strong> {{namesMap[withID]}}
</label>
</li>
......@@ -338,18 +342,16 @@
</div>
<hr>
<p>* Any matches will be displayed</p>
<a ng-click="toggleMore('with')" ng-hide="view['with']">Add more...</a>
<div ng-show="view['with']">
<div class="form-group">
<textarea class="form-control" ng-model="withTextArea" placeholder="CGD:CAL0002805, ..."></textarea>
</div>
<div class="form-group">
<button class="btn btn-default" type="button" ng-click="addWith()">Add</button>
</div>
</div>
</form>
<hr>
<div class="pull-right">
<button class="btn quickgo-btn" type="button" ng-click="resetWith()">Reset</button>
<button class="btn quickgo-btn" type="button" ng-click="updateFilters()">Apply</button>
</div>
</div>
</div>
......@@ -363,19 +365,21 @@
<ul>
<li ng-repeat="(dbId,val) in filters.assignedby" class="checkbox">
<label>
<input type="checkbox" ng-model="filters.assignedby[dbId]" > <strong>{{dbId}}</strong> {{namesMap[dbId]}}
<input type="checkbox" ng-model="filters.assignedby[dbId]"> <strong>{{dbId}}</strong> {{namesMap[dbId]}}
</label>
</li>
</ul>
</div>
</form>
<div class="pull-right">
<button class="btn quickgo-btn" type="button" ng-click="resetAssigned()">Reset</button>
<button class="btn quickgo-btn" type="button" ng-click="updateFilters()">Apply</button>
</div>
</div>
</div>
<div class="clearfix"></div>
<div class="pull-right">
<button class="btn quickgo-btn" type="button" ng-click="resetAssigned()">Reset</button>
<button class="btn quickgo-btn" type="button" ng-click="updateFilters()">Apply</button>
</div>
<div class="clearfix"></div>
<hr>
</div>
</div>
......@@ -9,6 +9,7 @@ app.controller('AdvancedFiltersCtrl', function($scope, $rootScope, $routeParams,
$scope.filters = filteringService.initialiseFilters();
$scope.appliedFilters = {};
$scope.view = {};
$scope.namesMap = {};
......@@ -31,6 +32,7 @@ app.controller('AdvancedFiltersCtrl', function($scope, $rootScope, $routeParams,
} else {
filteringService.addFilter(type, val, true);
}
console.log(filteringService.getFilters());
});
// Get predefined slim sets
......@@ -188,5 +190,9 @@ app.controller('AdvancedFiltersCtrl', function($scope, $rootScope, $routeParams,
return $scope.appliedFilters[type];
}
$scope.toggleMore = function(type) {
$scope.view[type] = !$scope.view[type];
}
$scope.namesMap = filteringService.getNamesMap();
});
......@@ -9,11 +9,12 @@ app.controller('BasketCtrl', function($scope, $log, $uibModalInstance, $location
$scope.basketPromise = basketService.getItems();
$scope.basketPromise.then(function(d){
$scope.basketItems = d.data;
})
}
});
};
$scope.loadBasketItems();
$scope.input_terms='';
$scope.exportURL = '#';
/**
* ------------------------------------ Remove item from basket -----------------------------------------
......@@ -103,6 +104,7 @@ app.controller('BasketCtrl', function($scope, $log, $uibModalInstance, $location
$scope.emptyBasket = function () {
$scope.basketItems = basketService.clearBasket();
$scope.basketItems = [];
$scope.exportURL = '#';
$scope.$emit('basketUpdate', 0);
};
......@@ -111,7 +113,6 @@ app.controller('BasketCtrl', function($scope, $log, $uibModalInstance, $location
* Export basket
*/
$scope.exportBasket = function () {
var text = '';
angular.forEach($scope.basketItems, function(item){
text += item.termId + "\t";
......@@ -119,15 +120,16 @@ app.controller('BasketCtrl', function($scope, $log, $uibModalInstance, $location
text += item.name + "\n";
});
//Download blob
var blob = new Blob([text], {type: "application/tsv;charset=utf-8;"});
var downloadLink = angular.element('<a></a>');
downloadLink.attr('href', window.URL.createObjectURL(blob));
downloadLink.attr('download', 'basket.tsv');
downloadLink[0].click();
};
var exportLink = $('#quickGO-basket-export-link');
if ('download' in exportLink.get(0)) {
var blob = new Blob([text], {type: "application/tsv;charset=utf-8;"});
$scope.exportURL = (window.URL || window.webkitURL).createObjectURL( blob );
} else {
var blob = new Blob([text], {type: "text/plain;charset=utf-8;"});
saveAs(blob, "basket.txt");
}
};
$scope.isBasketNotEmpty = function (){
return basketService.basketQuantity() > 0;
......
......@@ -33,7 +33,9 @@
<button class="btn quickgo-btn icon-functional" data-icon="h" ng-click="showAncestorGraph()">View Chart</button>
<button class="btn quickgo-btn" ng-click="filterUsingBasketTerms()">Filter With Terms</button>
<button class="btn quickgo-btn" ng-click="emptyBasket()">Clear</button>
<button class="btn quickgo-btn" ng-click="exportBasket()">Export</button>
<a id="quickGO-basket-export-link" download="basket.tsv" ng-href="{{ exportURL }}">
<button class="btn quickgo-btn" ng-click="exportBasket()">Export</button>
</a>
</div>
<div class="clearfix"></div>
<hr>
......
......@@ -6,7 +6,7 @@
</div>
<div class="items" ng-hide="!searchTerm.length || searchTerm.length < 3" ng-class="{'typeahead-box' : !noInput}">
<div cg-busy="goTermsPromise">
<div cg-busy="goTermsPromise" style="display: inline-block">
<h3>Terms</h3>
<ul class="results-list" ng-show="terms.results.length > 0">
<li ng-repeat="term in terms.results" ng-class="{'inactive':term.isObsolete==true}">
......
......@@ -217,6 +217,7 @@
<script src="bower_components/json3/lib/json3.js"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script src="bower_components/underscore/underscore.js"></script>
<script src="bower_components/file-saver/FileSaver.js"></script>
<!-- endbower -->
<!-- endbuild -->
......
......@@ -54,12 +54,14 @@ var app = angular
});
app.config(function ($routeProvider, $locationProvider, $httpProvider) {
app.config(function ($routeProvider, $locationProvider, $httpProvider, $compileProvider) {
$locationProvider.html5Mode(true);
$httpProvider.interceptors.push('httpErrorResponseInterceptor');
$compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|blob):/);
$routeProvider
.when('/', {
templateUrl: 'main/start.html',
......
......@@ -14,7 +14,8 @@
"es5-shim": "^4.0.0",
"json3": "^3.3.0",
"angular-bootstrap": "~0.14.3",
"underscore": "~1.8.3"
"underscore": "~1.8.3",
"file-saver": "~1.3.1"
},
"appPath": "app",
"resolutions": {
......
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