← Back to branch summary

~rharding/juju-gui/charm-details-1172050

« back to all changes in this revision

Viewing changes to app/subapps/browser/views/search.js

Adds search functionality

This adds text search from the search widget
-Search widget propogates search text to browser subapp
-Subapp routes data to search view
-Search view does query from text
-Search view can render search results

As a driveby, this moves repeated apiFailure code out to an extension.

There is an issue outstanding:
-The querystring can be eaten by the routing code in some cases. A follow up
branch is in progress for this problem.

R=rharding, jeff.pihach, curtis
CC=
https://codereview.appspot.com/8910043

Show diffs side-by-side

added added

removed removed

Lines of Context:
app/subapps/browser/views/search.js
 
1
'use strict';
 
2
 
 
3
 
 
4
/**
 
5
 * Provides searching functionality for the charm browser.
 
6
 *
 
7
 * @namespace juju
 
8
 * @module browser
 
9
 * @submodule views
 
10
 */
 
11
YUI.add('subapp-browser-searchview', function(Y) {
 
12
  var ns = Y.namespace('juju.browser.views'),
 
13
      views = Y.namespace('juju.views'),
 
14
      widgets = Y.namespace('juju.widgets'),
 
15
      models = Y.namespace('juju.models');
 
16
 
 
17
  ns.BrowserSearchView = Y.Base.create('browser-view-searchview', Y.View, [
 
18
    views.utils.apiFailingView
 
19
  ], {
 
20
    template: views.Templates.search,
 
21
    /**
 
22
     * Renders the search results from the the store query.
 
23
     *
 
24
     * @method _renderSearchResults
 
25
     * @param {Y.Node} container Optional container to render results to.
 
26
     */
 
27
    _renderSearchResults: function(results) {
 
28
      var target = this.get('renderTo'),
 
29
          tpl = this.template({count: results.size()}),
 
30
          tplNode = Y.Node.create(tpl),
 
31
          container = tplNode.one('.search-results');
 
32
 
 
33
      results.map(function(charm) {
 
34
        var ct = new widgets.browser.CharmToken(charm.getAttrs());
 
35
        ct.render(container);
 
36
      });
 
37
      target.setHTML(tplNode);
 
38
    },
 
39
 
 
40
    /**
 
41
     * Generates a message to the user based on a bad api call.
 
42
     *
 
43
     * @method apiFailure
 
44
     * @param {Object} data the json decoded response text.
 
45
     * @param {Object} request the original io_request object for debugging.
 
46
     *
 
47
     */
 
48
    apiFailure: function(data, request) {
 
49
      this._apiFailure(data, request, 'Failed to load search results.');
 
50
    },
 
51
 
 
52
    /**
 
53
     * Renders the searchview, rendering search results for the view's search
 
54
     * text.
 
55
     *
 
56
     * @method render
 
57
     */
 
58
    render: function() {
 
59
      var text = this.get('text');
 
60
      this.get('store').search(text, {
 
61
        'success': function(data) {
 
62
          var results = this.get('store').resultsToCharmlist(data.result);
 
63
          this._renderSearchResults(results);
 
64
        },
 
65
        'failure': this.apiFailure
 
66
      }, this);
 
67
    }
 
68
  }, {
 
69
    ATTRS: {
 
70
      /**
 
71
       * The container node the view is rendering to.
 
72
       *
 
73
       * @attribute renderTo
 
74
       * @default undefined
 
75
       * @type {Y.Node}
 
76
       */
 
77
      renderTo: {},
 
78
 
 
79
      /**
 
80
       * An instance of the Charmworld API object to hit for any data that
 
81
       * needs fetching.
 
82
       *
 
83
       * @attribute store
 
84
       * @default undefined
 
85
       * @type {Charmworld0}
 
86
       *
 
87
       */
 
88
      store: {},
 
89
 
 
90
      /**
 
91
       * The text being searched on
 
92
       *
 
93
       * @attribute text
 
94
       * @default ''
 
95
       * @type {String}
 
96
       */
 
97
      text: {}
 
98
    }
 
99
  });
 
100
 
 
101
}, '0.1.0', {
 
102
  requires: [
 
103
    'base-build',
 
104
    'browser-charm-token',
 
105
    'browser-overlay-indicator',
 
106
    'event-tracker',
 
107
    'juju-view-utils',
 
108
    'view'
 
109
  ]
 
110
});