Skip to content

Commit

Permalink
Merge pull request #16 from OrdnanceSurvey/dev
Browse files Browse the repository at this point in the history
latest release from dev
  • Loading branch information
craiggoldstone authored Mar 14, 2017
2 parents 80a1906 + 49af49d commit 0ed02f9
Show file tree
Hide file tree
Showing 8 changed files with 87 additions and 53 deletions.
7 changes: 4 additions & 3 deletions dist/osel-search-templates.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,16 +12,17 @@ angular.module('osel-search').run(['$templateCache', function($templateCache) {
" <md-tabs md-center-tabs=\"true\" md-dynamic-height=\"\" ng-show=\"searchInput.length > 2\" class=\"md-whiteframe-1dp\">\n" +
" <md-tab ng-repeat=\"column in options.providers\"\n" +
" label=\"{{column.title}} ({{aggregateLength(column)}})\">\n" +
" <div layout=\"row\" layout-align=\"center start\">\n" +
" <md-list ng-repeat=\"provider in column.providers\">\n" +
" <div layout-xs=\"column\" layout-align-xs=\"start stretch\" layout=\"row\" layout-align=\"center start\">\n" +
" <md-list ng-repeat=\"provider in column.providers\" class=\"osel-search-results-column\" flex>\n" +
" <md-subheader ng-if=\"::provider.title\">{{provider.title}}</md-subheader>\n" +
" <md-list-item ng-repeat=\"result in searchResults[provider.id].results\" ng-click=\"selectResult(result, provider.onSelect)\">\n" +
" <md-list-item ng-repeat=\"result in searchResults[provider.id].results\" ng-click=\"selectResult(result, provider.onSelect)\" class=\"osel-search-result\">\n" +
" <div class=\"md-list-item-text\">{{result.text}}</div>\n" +
" </md-list-item>\n" +
" <md-list-item ng-hide=\"searchResults[provider.id].results.length\">\n" +
" <div class=\"md-list-item-text\" ng-show=\"searchResults[provider.id].inProgress\">Loading...</div>\n" +
" <div class=\"md-list-item-text\" ng-hide=\"searchResults[provider.id].inProgress\">No results found.</div>\n" +
" </md-list-item>\n" +
" <md-divider hide-gt-xs ng-show=\"column.providers.length > 1\"></md-divider>\n" +
" </md-list>\n" +
" </div>\n" +
" <p class=\"osel-search-footer md-caption\" ng-if=\"column.footer\">{{::column.footer}}</p>\n" +
Expand Down
30 changes: 12 additions & 18 deletions dist/osel-search.css
Original file line number Diff line number Diff line change
Expand Up @@ -36,37 +36,31 @@ input.osel-search[type=search] {
input.osel-search[type=search]:focus {
border: 1px solid #1169C9;
}
.osel-search-results {
.osel-search-results-column {
padding: 10px;
}
.osel-search-results + .osel-search-results {
.osel-search-results-column + .osel-search-results-column {
margin-left: 10px;
}
.osel-search-result-header {
font-weight: 700;
border-bottom: 1px solid #1169C9;
padding: 5px;
}
.osel-search-result {
padding: 5px;
}
.osel-search-result:hover,
.osel-search-result:focus {
background-color: #1169C9;
color: white;
cursor: pointer;
outline: 0;
}
.osel-search-result > p {
margin: 0;
.osel-search-result .md-button {
line-height: 20px;
}
.osel-search-result + .osel-search-result {
border-top: 1px dotted #dfdfdf;
}
.osel-search-result + .osel-search-result:hover,
.osel-search-result + .osel-search-result:focus {
border-top: 1px solid #1169C9;
}
.osel-search-footer {
text-align: center;
}
@media (max-width: 599px) {
.osel-search-results-column {
padding: 0;
}
.osel-search-results-column + .osel-search-results-column {
margin-left: 0;
}
}
2 changes: 1 addition & 1 deletion dist/osel-search.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
/**
* @license osel-search - v0.0.4-republshed - 02-03-2017
* @license osel-search - v0.0.4-republshed - 14-03-2017
* (c) 2015 Ordnance Survey Limited
* License: MIT
*/
Expand Down
2 changes: 1 addition & 1 deletion dist/osel-search.min.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
/**
* @license osel-search - v0.0.4-republshed - 02-03-2017
* @license osel-search - v0.0.4-republshed - 14-03-2017
* (c) 2015 Ordnance Survey Limited
* License: MIT
*/
Expand Down
55 changes: 46 additions & 9 deletions example/app.js
Original file line number Diff line number Diff line change
Expand Up @@ -73,9 +73,7 @@ app.controller('example-ctrl', ['$scope', function ($scope) {
}
}
]
}
,

},
{
title: 'Surround',
providers: [{
Expand All @@ -90,9 +88,9 @@ app.controller('example-ctrl', ['$scope', function ($scope) {
text: '==' + upper + '=='
}, {
text: '===' + upper + '==='
},{
}, {
text: '====' + upper + '====='
},{
}, {
text: '=====' + upper + '====='
}];
},
Expand All @@ -118,9 +116,9 @@ app.controller('example-ctrl', ['$scope', function ($scope) {
text: '__' + upper + '__'
}, {
text: '___' + upper + '___'
},{
}, {
text: '____' + upper + '_____'
},{
}, {
text: '_____' + upper + '_____'
}];
},
Expand All @@ -146,9 +144,9 @@ app.controller('example-ctrl', ['$scope', function ($scope) {
text: '##' + upper + '##'
}, {
text: '###' + upper + '###'
},{
}, {
text: '####' + upper + '#####'
},{
}, {
text: '#####' + upper + '#####'
}];
},
Expand All @@ -163,8 +161,47 @@ app.controller('example-ctrl', ['$scope', function ($scope) {
}
}]

},
{
title: 'Repeated',
providers: [
makeSearchProvider(),
makeSearchProvider(),
makeSearchProvider(),
makeSearchProvider()
]
}

]
};

var random_id = 1;
function makeSearchProvider() {
var myId = 'RANDOM_' + random_id++;
return {
id: myId,
fn: function (term) {
var upper = term;
// return an array to illustrate how transformResponse can be used
return [
{ text: term},
{ text: term + ' ' + term},
{ text: term + ' ' + term + ' ' + term},
{ text: term + ' ' + term + ' ' + term + ' ' + term},
{ text: term + ' ' + term + ' ' + term + ' ' + term + ' ' + term}
];
},
transformResponse: function (response) {
// return an object with a results property containing the array
return {
results: response
};
},
onSelect: function (result, hideSearch) {
console.log('selected a ' + myId+ ' result', result);
}
};
}


}]);
6 changes: 5 additions & 1 deletion example/index.html
Original file line number Diff line number Diff line change
@@ -1,6 +1,10 @@
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.3/normalize.css" type="text/css"/>
<link rel="stylesheet" href="../dist/osel-search.css" type="text/css" />

Expand Down Expand Up @@ -40,7 +44,7 @@
}

.container {
width: 1024px;
width: 100%;
box-sizing: border-box;
margin: 0 auto;
background: rgba(0,0,0,0.1);
Expand Down
31 changes: 14 additions & 17 deletions src/styles/main.less
Original file line number Diff line number Diff line change
Expand Up @@ -52,10 +52,10 @@ input.osel-search[type=search] {
border: 1px solid @blue;
}
}
.osel-search-results {
.osel-search-results-column {
padding: 10px;

+ .osel-search-results {
+ .osel-search-results-column {
margin-left: 10px;
}
}
Expand All @@ -67,29 +67,26 @@ input.osel-search[type=search] {
}

.osel-search-result {
padding: 5px;

&:hover, &:focus {
background-color: @blue;
color: white;
cursor: pointer;
outline: 0;
}

> p {
margin: 0;
.md-button {
line-height: 20px;
}

+ .osel-search-result {
border-top: 1px dotted #dfdfdf;

&:hover, &:focus {
border-top: 1px solid @blue;
}
}

}

.osel-search-footer {
text-align: center;
}
}

@media (max-width: 599px) {
.osel-search-results-column {
padding: 0;
+ .osel-search-results-column {
margin-left: 0;
}
}
}
7 changes: 4 additions & 3 deletions src/templates/osel-search.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,16 +8,17 @@
<md-tabs md-center-tabs="true" md-dynamic-height="" ng-show="searchInput.length > 2" class="md-whiteframe-1dp">
<md-tab ng-repeat="column in options.providers"
label="{{column.title}} ({{aggregateLength(column)}})">
<div layout="row" layout-align="center start">
<md-list ng-repeat="provider in column.providers">
<div layout-xs="column" layout-align-xs="start stretch" layout="row" layout-align="center start">
<md-list ng-repeat="provider in column.providers" class="osel-search-results-column" flex>
<md-subheader ng-if="::provider.title">{{provider.title}}</md-subheader>
<md-list-item ng-repeat="result in searchResults[provider.id].results" ng-click="selectResult(result, provider.onSelect)">
<md-list-item ng-repeat="result in searchResults[provider.id].results" ng-click="selectResult(result, provider.onSelect)" class="osel-search-result">
<div class="md-list-item-text">{{result.text}}</div>
</md-list-item>
<md-list-item ng-hide="searchResults[provider.id].results.length">
<div class="md-list-item-text" ng-show="searchResults[provider.id].inProgress">Loading...</div>
<div class="md-list-item-text" ng-hide="searchResults[provider.id].inProgress">No results found.</div>
</md-list-item>
<md-divider hide-gt-xs ng-show="column.providers.length > 1"></md-divider>
</md-list>
</div>
<p class="osel-search-footer md-caption" ng-if="column.footer">{{::column.footer}}</p>
Expand Down

0 comments on commit 0ed02f9

Please sign in to comment.