diff --git a/RELEASE-NOTES.md b/RELEASE-NOTES.md index de059e66c..1f957fc5d 100644 --- a/RELEASE-NOTES.md +++ b/RELEASE-NOTES.md @@ -18,6 +18,7 @@ - **Label** - Added a new `basic label` style, works symbiotically with other label types to provide a more lightweight style label - **Menu** - Added new `tabular` menu types, `right tabular`, `bottom tabular`, added many new `tabular` menu variables for customizing - **Menu** - Appearance of `labeled icon menu` has been modified. Horizontal menus now have icons above text, and icons are slightly larger than before. +- **Search** - Search now can use any server response mapping, use the `fields` parameter to pass in a mapping of server response to content **thanks @anibalmf1** #2645 - **Table** - New `fixed` table variation added for use with `table-layout: fixed;`. This also supports "..." ellipsis when used with `single line` content **[Enhancements](https://github.com/Semantic-Org/Semantic-UI/issues?q=is%3Aissue+milestone%3A2.1.0+is%3Aclosed)**\ diff --git a/src/definitions/modules/search.js b/src/definitions/modules/search.js index fe185833b..867ebd839 100644 --- a/src/definitions/modules/search.js +++ b/src/definitions/modules/search.js @@ -36,6 +36,7 @@ $.fn.search = function(parameters) { className = settings.className, metadata = settings.metadata, regExp = settings.regExp, + fields = settings.fields, selector = settings.selector, error = settings.error, namespace = settings.namespace, @@ -571,14 +572,14 @@ $.fn.search = function(parameters) { ; module.verbose('Parsing server response', response); if(response !== undefined) { - if(searchTerm !== undefined && response.results !== undefined) { + if(searchTerm !== undefined && response[fields.results] !== undefined) { module.addResults(searchHTML); - module.inject.id(response.results); + module.inject.id(response[fields.results]); module.write.cache(searchTerm, { html : searchHTML, - results : response.results + results : response[fields.results] }); - module.save.results(response.results); + module.save.results(response[fields.results]); } } } @@ -815,8 +816,8 @@ $.fn.search = function(parameters) { module.debug('Generating html from response', response); var template = settings.templates[settings.type], - isProperObject = ($.isPlainObject(response.results) && !$.isEmptyObject(response.results)), - isProperArray = ($.isArray(response.results) && response.results.length > 0), + isProperObject = ($.isPlainObject(response[fields.results]) && !$.isEmptyObject(response[fields.results])), + isProperArray = ($.isArray(response[fields.results]) && response[fields.results].length > 0), html = '' ; if(isProperObject || isProperArray ) { @@ -827,11 +828,11 @@ $.fn.search = function(parameters) { } } else { - response.results = response.results.slice(0, settings.maxResults); + response[fields.results] = response[fields.results].slice(0, settings.maxResults); } } if($.isFunction(template)) { - html = template(response, settings); + html = template(response, fields); } else { module.error(error.noTemplate, false); @@ -1055,7 +1056,7 @@ $.fn.search.settings = { 'description' ], // fields to search - + displayField : '', // field to display in standard results template @@ -1123,6 +1124,21 @@ $.fn.search.settings = { beginsWith : '(?:\s|^)' }, + // maps api response attributes to internal representation + fields: { + categories : 'results', // array of categories (category view) + categoryName : 'name', // name of category (category view) + categoryResults : 'results', // array of results (category view) + description : 'description', // result description + image : 'image', // result image + price : 'price', // result price + results : 'results', // array of results (standard) + title : 'title', // result title + action : 'action', // "view more" object + actionText : 'text', // "view more" text + actionURL : 'url' // "view more" text + }, + selector : { prompt : '.prompt', searchButton : '.search.button', @@ -1176,98 +1192,98 @@ $.fn.search.settings = { } return html; }, - category: function(response) { + category: function(response, fields) { var html = '', escape = $.fn.search.settings.templates.escape ; - if(response.results !== undefined) { + if(response[fields.categoryResults] !== undefined) { + // each category - $.each(response.results, function(index, category) { - if(category.results !== undefined && category.results.length > 0) { - html += '' - + '
' - + '
' + category.name + '
' - ; + $.each(response[fields.categoryResults], function(index, category) { + if(category[fields.results] !== undefined && category.results.length > 0) { + + html += '
'; + + if(category[fields.categoryName] !== undefined) { + html += '
' + category[fields.categoryName] + '
'; + } + // each item inside category $.each(category.results, function(index, result) { - html += '
'; - if(result.url) { - html += ''; + if(response[fields.url]) { + html += ''; } - if(result.image !== undefined) { - result.image = escape(result.image); + else { + html += ''; + } + if(result[fields.image] !== undefined) { html += '' + '
' - + ' ' + + ' ' + '
' ; } html += '
'; - if(result.price !== undefined) { - result.price = escape(result.price); - html += '
' + result.price + '
'; + if(result[fields.price] !== undefined) { + html += '
' + result[fields.price] + '
'; } - if(result.title !== undefined) { - result.title = escape(result.title); - html += '
' + result.title + '
'; + if(result[fields.title] !== undefined) { + html += '
' + result[fields.title] + '
'; } - if(result.description !== undefined) { - html += '
' + result.description + '
'; + if(result[fields.description] !== undefined) { + html += '
' + result[fields.description] + '
'; } html += '' + '
' - + '
' ; + html += ''; }); html += '' + '
' ; } }); - if(response.action) { + if(response[fields.action]) { html += '' - + '' - + response.action.text + + '' + + response[fields.action][fields.actionText] + ''; } return html; } return false; }, - standard: function(response, settings) { + standard: function(response, fields) { var html = '' ; - if(response.results !== undefined) { + if(response[fields.results] !== undefined) { // each result - $.each(response.results, function(index, result) { - if(result.url) { - html += ''; + $.each(response[fields.results], function(index, result) { + if(response[fields.url]) { + html += ''; } else { html += ''; } - if(result.image !== undefined) { + if(result[fields.image] !== undefined) { html += '' + '
' - + ' ' + + ' ' + '
' ; } html += '
'; - if (settings.displayField.length > 0){ - html += '
' + result[settings.displayField] + '
'; - } - if(result.price !== undefined) { - html += '
' + result.price + '
'; + if(result[fields.price] !== undefined) { + html += '
' + result[fields.price] + '
'; } - if(result.title !== undefined) { - html += '
' + result.title + '
'; + if(result[fields.title] !== undefined) { + html += '
' + result[fields.title] + '
'; } - if(result.description !== undefined) { - html += '
' + result.description + '
'; + if(result[fields.description] !== undefined) { + html += '
' + result[fields.description] + '
'; } html += '' + '
' @@ -1275,10 +1291,10 @@ $.fn.search.settings = { html += ''; }); - if(response.action) { + if(response[fields.action]) { html += '' - + '' - + response.action.text + + '' + + response[fields.action][fields.actionText] + ''; } return html;