diff options
Diffstat (limited to 'web/src')
| -rw-r--r-- | web/src/js/actions.js | 2 | ||||
| -rw-r--r-- | web/src/js/components/flowview/contentview.js | 66 | ||||
| -rw-r--r-- | web/src/js/connection.js | 5 | ||||
| -rw-r--r-- | web/src/js/dispatcher.js | 2 | ||||
| -rw-r--r-- | web/src/js/flow/utils.js | 2 | ||||
| -rw-r--r-- | web/src/js/utils.js | 13 | 
6 files changed, 68 insertions, 22 deletions
| diff --git a/web/src/js/actions.js b/web/src/js/actions.js index 1b29438c..78fd4bf7 100644 --- a/web/src/js/actions.js +++ b/web/src/js/actions.js @@ -1,4 +1,5 @@  var $ = require("jquery"); +var AppDispatcher = require("./dispatcher.js").AppDispatcher;  var ActionTypes = {      // Connection @@ -118,5 +119,6 @@ module.exports = {      FlowActions: FlowActions,      StoreCmds: StoreCmds,      SettingsActions: SettingsActions, +    EventLogActions: EventLogActions,      Query: Query  };
\ No newline at end of file diff --git a/web/src/js/components/flowview/contentview.js b/web/src/js/components/flowview/contentview.js index 30a40faa..e4d11997 100644 --- a/web/src/js/components/flowview/contentview.js +++ b/web/src/js/components/flowview/contentview.js @@ -5,7 +5,7 @@ var MessageUtils = require("../../flow/utils.js").MessageUtils;  var utils = require("../../utils.js");  var image_regex = /^image\/(png|jpe?g|gif|vnc.microsoft.icon|x-icon)$/i; -var Image = React.createClass({ +var ViewImage = React.createClass({      statics: {          matches: function (message) {              return image_regex.test(MessageUtils.getContentType(message)); @@ -22,16 +22,28 @@ var Image = React.createClass({  var RawMixin = {      getInitialState: function () {          return { -            content: undefined +            content: undefined, +            request: undefined          }      },      requestContent: function (nextProps) { -        this.setState({content: undefined}); +        if(this.state.request){ +            this.state.request.abort(); +        }          var request = MessageUtils.getContent(nextProps.flow, nextProps.message); +        this.setState({ +            content: undefined, +            request: request +        });          request.done(function (data) {              this.setState({content: data});          }.bind(this)).fail(function (jqXHR, textStatus, errorThrown) { -            this.setState({content: "AJAX Error: " + textStatus}); +            if(textStatus === "abort"){ +                return; +            } +            this.setState({content: "AJAX Error: " + textStatus + "\r\n" + errorThrown}); +        }.bind(this)).always(function(){ +            this.setState({request: undefined});          }.bind(this));      }, @@ -43,6 +55,11 @@ var RawMixin = {              this.requestContent(nextProps);          }      }, +    componentWillUnmount: function(){ +        if(this.state.request){ +            this.state.request.abort(); +        } +    },      render: function () {          if (!this.state.content) {              return <div className="text-center"> @@ -53,7 +70,7 @@ var RawMixin = {      }  }; -var Raw = React.createClass({ +var ViewRaw = React.createClass({      mixins: [RawMixin],      statics: {          matches: function (message) { @@ -65,8 +82,25 @@ var Raw = React.createClass({      }  }); +var json_regex = /^application\/json$/i; +var ViewJSON = React.createClass({ +    mixins: [RawMixin], +    statics: { +        matches: function (message) { +            return json_regex.test(MessageUtils.getContentType(message)); +        } +    }, +    renderContent: function () { +        var json = this.state.content; +        try { +            json = JSON.stringify(JSON.parse(json), null, 2); +        } catch(e) { +        } +        return <pre>{json}</pre>; +    } +}); -var Auto = React.createClass({ +var ViewAuto = React.createClass({      statics: {          matches: function () {              return false; // don't match itself @@ -81,12 +115,12 @@ var Auto = React.createClass({          }      },      render: function () { -        var View = Auto.findView(this.props.message); +        var View = ViewAuto.findView(this.props.message);          return <View {...this.props}/>;      }  }); -var all = [Auto, Image, Raw]; +var all = [ViewAuto, ViewImage, ViewJSON, ViewRaw];  var ContentEmpty = React.createClass({ @@ -104,6 +138,12 @@ var ContentMissing = React.createClass({  });  var TooLarge = React.createClass({ +    statics: { +        isTooLarge: function(message){ +            var max_mb = ViewImage.matches(message) ? 10 : 0.2; +            return message.contentLength > 1024 * 1024 * max_mb; +        } +    },      render: function () {          var size = utils.formatSize(this.props.message.contentLength);          return <div className="alert alert-warning"> @@ -123,10 +163,10 @@ var ViewSelector = React.createClass({                  className += " active";              }              var text; -            if (view === Auto) { -                text = "auto: " + Auto.findView(this.props.message).displayName.toLowerCase(); +            if (view === ViewAuto) { +                text = "auto: " + ViewAuto.findView(this.props.message).displayName.toLowerCase().replace("view", "");              } else { -                text = view.displayName.toLowerCase(); +                text = view.displayName.toLowerCase().replace("view", "");              }              views.push(                  <button @@ -146,7 +186,7 @@ var ContentView = React.createClass({      getInitialState: function () {          return {              displayLarge: false, -            View: Auto +            View: ViewAuto          };      },      propTypes: { @@ -175,7 +215,7 @@ var ContentView = React.createClass({              return <ContentEmpty {...this.props}/>;          } else if (message.contentLength === null) {              return <ContentMissing {...this.props}/>; -        } else if (message.contentLength > 1024 * 1024 * 3 && !this.state.displayLarge) { +        } else if (!this.state.displayLarge && TooLarge.isTooLarge(message)) {              return <TooLarge {...this.props} onClick={this.displayLarge}/>;          } diff --git a/web/src/js/connection.js b/web/src/js/connection.js index 85514c3c..5e229b6e 100644 --- a/web/src/js/connection.js +++ b/web/src/js/connection.js @@ -1,5 +1,6 @@  var actions = require("./actions.js"); +var AppDispatcher = require("./dispatcher.js").AppDispatcher;  function Connection(url) {      if (url[0] === "/") { @@ -16,11 +17,11 @@ function Connection(url) {      };      ws.onerror = function () {          actions.ConnectionActions.error(); -        EventLogActions.add_event("WebSocket connection error."); +        actions.EventLogActions.add_event("WebSocket connection error.");      };      ws.onclose = function () {          actions.ConnectionActions.close(); -        EventLogActions.add_event("WebSocket connection closed."); +        actions.EventLogActions.add_event("WebSocket connection closed.");      };      return ws;  } diff --git a/web/src/js/dispatcher.js b/web/src/js/dispatcher.js index 040c34db..0c2aa202 100644 --- a/web/src/js/dispatcher.js +++ b/web/src/js/dispatcher.js @@ -7,7 +7,7 @@ const PayloadSources = {  }; -AppDispatcher = new flux.Dispatcher(); +var AppDispatcher = new flux.Dispatcher();  AppDispatcher.dispatchViewAction = function (action) {      action.source = PayloadSources.VIEW;      this.dispatch(action); diff --git a/web/src/js/flow/utils.js b/web/src/js/flow/utils.js index a67db94f..29462a78 100644 --- a/web/src/js/flow/utils.js +++ b/web/src/js/flow/utils.js @@ -3,7 +3,7 @@ var $ = require("jquery");  var MessageUtils = {      getContentType: function (message) { -        return this.get_first_header(message, /^Content-Type$/i); +        return this.get_first_header(message, /^Content-Type$/i).split(";")[0].trim();      },      get_first_header: function (message, regex) {          //FIXME: Cache Invalidation. diff --git a/web/src/js/utils.js b/web/src/js/utils.js index 48f69880..be59db96 100644 --- a/web/src/js/utils.js +++ b/web/src/js/utils.js @@ -1,5 +1,6 @@  var $ = require("jquery");  var _ = require("lodash"); +var actions = require("./actions.js");  var Key = {      UP: 38, @@ -67,13 +68,13 @@ var end = String.fromCharCode(0xffff);  function reverseString(s){      return String.fromCharCode.apply(String,          _.map(s.split(""), function (c) { -            return 0xffff - c.charCodeAt(); +            return 0xffff - c.charCodeAt(0);          })      ) + end;  }  function getCookie(name) { -    var r = document.cookie.match("\\b" + name + "=([^;]*)\\b"); +    var r = document.cookie.match(new RegExp("\\b" + name + "=([^;]*)\\b"));      return r ? r[1] : undefined;  }  var xsrf = $.param({_xsrf: getCookie("_xsrf")}); @@ -90,10 +91,12 @@ $.ajaxPrefilter(function (options) {  });  // Log AJAX Errors  $(document).ajaxError(function (event, jqXHR, ajaxSettings, thrownError) { +    if(thrownError === "abort"){ +        return; +    }      var message = jqXHR.responseText; -    console.error(message, arguments); -    EventLogActions.add_event(thrownError + ": " + message); -    window.alert(message); +    console.error(thrownError, message, arguments); +    actions.EventLogActions.add_event(thrownError + ": " + message);  });  module.exports = { | 
