diff --git a/LICENSE.txt b/LICENSE.txt index 78b178a..0d1d6da 100644 --- a/LICENSE.txt +++ b/LICENSE.txt @@ -261,6 +261,6 @@ It is (c) 2011-2014 Tim Wood, Iskren Chernev, Moment.js contributors and shared under the MIT license: https://github.com/moment/moment/blob/develop/LICENSE -pickadate.js is an open source date and time widget. -It is (c) 2014 Amsul, http://amsul.ca and MIT licensed: -https://github.com/amsul/pickadate.js/blob/master/LICENSE.md +rome.js is a customizable date (and time) picker. +It is Copyright © 2014 Nicolas Bevacqua +https://github.com/bevacqua/rome diff --git a/htrace-core/src/web/app/models/span.js b/htrace-core/src/web/app/models/span.js index 1231101..8f6ef12 100644 --- a/htrace-core/src/web/app/models/span.js +++ b/htrace-core/src/web/app/models/span.js @@ -16,7 +16,7 @@ * specific language governing permissions and limitations * under the License. */ - + // Span model App.Span = Backbone.Model.extend({ "defaults": { diff --git a/htrace-core/src/web/app/setup.js b/htrace-core/src/web/app/setup.js index bb41ad8..106d959 100644 --- a/htrace-core/src/web/app/setup.js +++ b/htrace-core/src/web/app/setup.js @@ -38,7 +38,7 @@ var Router = Backbone.Router.extend({ this.searchView = new App.SearchView({ "collection": this.spansCollection, "el": $("#list").find("[role='form']") - }); + }).render(); }, search: function() { @@ -82,7 +82,4 @@ window.urlconf = new Router(); $(function() { Backbone.history.start(); - - $(".datepicker").pickadate(); - $(".timepicker").pickatime(); }); diff --git a/htrace-core/src/web/app/views/search.js b/htrace-core/src/web/app/views/search.js deleted file mode 100644 index 1016de3..0000000 --- a/htrace-core/src/web/app/views/search.js +++ /dev/null @@ -1,89 +0,0 @@ -/* - * Licensed to the Apache Software Foundation (ASF) under one - * or more contributor license agreements. See the NOTICE file - * distributed with this work for additional information - * regarding copyright ownership. The ASF licenses this file - * to you under the Apache License, Version 2.0 (the - * "License"); you may not use this file except in compliance - * with the License. You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, - * software distributed under the License is distributed on an - * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY - * KIND, either express or implied. See the License for the - * specific language governing permissions and limitations - * under the License. - */ - -App.SearchView = Backbone.View.extend({ - "events": { - "click a": "search", - "click button": "search" - }, - - "search": function() { - var now = new moment(); - var begin, stop; - - var description = $(this.el).find("input[type='search']").val(); - var begindate = $(this.el).find("#begindate").val();// || now.format("D MMMM, YYYY"); - var begintime = $(this.el).find("#begintime").val() || now.format("H:mm A"); - var enddate = $(this.el).find("#stopdate").val();// || now.format("D MMMM, YYYY"); - var endtime = $(this.el).find("#stoptime").val() || now.format("H:mm A"); - var duration = $(this.el).find("#duration").val(); - - if (begindate) { - begin = new moment(begindate + " " + begintime).unix(); - } - - if (enddate) { - stop = new moment(enddate + " " + endtime).unix(); - } - - var predicates = []; - - if (begin) { - predicates.push({ - "op": "ge", - "field": "begin", - "val": begin.toString() - }); - } - - if (stop) { - predicates.push({ - "op": "le", - "field": "end", - "val": stop.toString() - }); - } - - if (duration) { - predicates.push({ - "op": "ge", - "field": "duration", - "val": duration.toString() - }); - } - - if (description) { - predicates.push({ - "op": "cn", - "field": "description", - "val": description - }); - } - - this.collection.switchMode("infinite", { - fetch: false, - resetState: true - }); - this.collection.fullCollection.reset(); - this.collection.setPredicates(predicates); - this.collection.fetch(); - - return false; - } -}); diff --git a/htrace-core/src/web/app/views/search/field.js b/htrace-core/src/web/app/views/search/field.js new file mode 100644 index 0000000..7670559 --- /dev/null +++ b/htrace-core/src/web/app/views/search/field.js @@ -0,0 +1,91 @@ +App.SearchFieldView = Backbone.View.extend({ + 'className': 'search-field', + + 'template': _.template($("#search-field-template").html()), + + 'events': { + 'change .field': 'showSearchField', + 'click .remove-field': 'destroyField' + }, + + 'initialize': function(options) { + this.options = options; + this.field = options.field; + }, + + 'render': function() { + this.$el.html(this.template({ field: this.field })); + this.showSearchField(); + return this; + }, + + 'showSearchField': function() { + // this.$el.find('.value').hide(); + // this.$el.find('.op').hide(); + // this.$el.find('label').hide(); + this.$el.find('.search-field').hide(); + switch (this.field) { + case 'begin': + case 'end': + this.$el.find('.op').show(); + this.$el.find('.start-end-date-time').show(); + this.$el.find('label.start-end-date-time').text(this.field === 'begin' ? 'Begin' : 'End'); + rome(this.$el.find('#start-end-date-time')[0]); + break; + case 'duration': + this.op = 'cn' + this.$el.find('.duration').show(); + break; + case 'description': + this.op = 'cn' + this.$el.find('.description').show(); + break; + default: + break; + } + }, + + 'destroyField': function(e) { + this.undelegateEvents(); + + $(this.el).removeData().unbind(); + + this.remove(); + Backbone.View.prototype.remove.call(this); + this.options.manager.trigger('removeSearchField', [this.cid]); + }, + + 'addPredicate': function() { + this.options.predicates.push( + { + 'op': this.op ? this.op : this.$('.op').val(), + 'field': this.field, + 'val': this.getValue() + } + ); + }, + + 'getPredicate': function() { + return { + 'op': this.op ? this.op : this.$('.op').val(), + 'field': this.field, + 'val': this.getValue() + }; + }, + + 'getValue': function() { + switch (this.field) { + case 'begin': + case 'end': + var now = new moment(); + var datetime = new moment(this.$('start-end-date-time').val()).unix(); + return datetime.toString(); + case 'duration': + return this.$(".duration").val().toString(); + case 'description': + return this.$('.description').val(); + default: + return ''; + } + } +}); diff --git a/htrace-core/src/web/app/views/search/search.js b/htrace-core/src/web/app/views/search/search.js new file mode 100644 index 0000000..7e32364 --- /dev/null +++ b/htrace-core/src/web/app/views/search/search.js @@ -0,0 +1,73 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance + * with the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + */ + +App.SearchView = Backbone.View.extend({ + "events": { + "click a.add-field": "addSearchField", + "click button.search": "search", + }, + + 'initialize': function() { + this.predicates = []; + this.searchFields = []; + this.searchFields.push(new App.SearchFieldView({ + predicates: this.predicates, + manager: this, + field: 'description' + })); + this.on('removeSearchField', this.removeSearchField, this); + }, + + 'render': function() { + this.$('.search-fields').append(this.searchFields[0].render().$el); + return this; + }, + + 'addSearchField': function(e) { + var target = $(e.target); + $('button.field').text(target.text()); + var newSearchField = new App.SearchFieldView({ + predicates: this.predicates, + manager: this, + field: target.data('field') + }); + this.$('.search-fields').append(newSearchField.render().$el); + this.searchFields.push(newSearchField); + }, + + 'removeSearchField': function(cid) { + var removedFieldIndex = _(this.searchFields).indexOf(_(this.searchFields).findWhere({cid: cid})); + this.searchFields.splice(removedFieldIndex, 1); + }, + + "search": function(e) { + this.predicates = _(this.searchFields).map(function(field) { + return field.getPredicate(); + }); + + this.collection.switchMode("infinite", { + fetch: false, + resetState: true + }); + this.collection.fullCollection.reset(); + this.collection.setPredicates(this.predicates); + this.collection.fetch(); + return false; + } +}); diff --git a/htrace-core/src/web/index.html b/htrace-core/src/web/index.html index 24ccc65..4fbc3ac 100644 --- a/htrace-core/src/web/index.html +++ b/htrace-core/src/web/index.html @@ -19,17 +19,15 @@