mirror of
https://github.com/Grasscutters/mitmproxy.git
synced 2024-11-23 00:01:36 +00:00
web: upgrade to react 0.13
This commit is contained in:
parent
6fb661dab5
commit
cf9f91b0b4
@ -478,31 +478,43 @@ var StickyHeadMixin = {
|
||||
|
||||
var Navigation = _.extend({}, ReactRouter.Navigation, {
|
||||
setQuery: function (dict) {
|
||||
var q = this.context.getCurrentQuery();
|
||||
var q = this.context.router.getCurrentQuery();
|
||||
for(var i in dict){
|
||||
if(dict.hasOwnProperty(i)){
|
||||
q[i] = dict[i] || undefined; //falsey values shall be removed.
|
||||
}
|
||||
}
|
||||
q._ = "_"; // workaround for https://github.com/rackt/react-router/pull/957
|
||||
this.replaceWith(this.context.getCurrentPath(), this.context.getCurrentParams(), q);
|
||||
this.replaceWith(this.context.router.getCurrentPath(), this.context.router.getCurrentParams(), q);
|
||||
},
|
||||
replaceWith: function(routeNameOrPath, params, query) {
|
||||
if(routeNameOrPath === undefined){
|
||||
routeNameOrPath = this.context.getCurrentPath();
|
||||
routeNameOrPath = this.context.router.getCurrentPath();
|
||||
}
|
||||
if(params === undefined){
|
||||
params = this.context.getCurrentParams();
|
||||
params = this.context.router.getCurrentParams();
|
||||
}
|
||||
if(query === undefined) {
|
||||
query = this.context.getCurrentQuery();
|
||||
query = this.context.router.getCurrentQuery();
|
||||
}
|
||||
|
||||
// FIXME: react-router is just broken.
|
||||
ReactRouter.Navigation.replaceWith.call(this, routeNameOrPath, params, query);
|
||||
// FIXME: react-router is just broken,
|
||||
// we hopefully just need to wait for the next release with https://github.com/rackt/react-router/pull/957.
|
||||
this.context.router.replaceWith(routeNameOrPath, params, query);
|
||||
}
|
||||
});
|
||||
|
||||
// react-router is fairly good at changing its API regularly.
|
||||
// We keep the old method for now - if it should turn out that their changes are permanent,
|
||||
// we may remove this mixin and access react-router directly again.
|
||||
var State = _.extend({}, ReactRouter.State, {
|
||||
getQuery: function(){
|
||||
return this.context.router.getCurrentQuery();
|
||||
},
|
||||
getParams: function(){
|
||||
return this.context.router.getCurrentParams();
|
||||
}
|
||||
});
|
||||
_.extend(Navigation.contextTypes, ReactRouter.State.contextTypes);
|
||||
|
||||
var Splitter = React.createClass({displayName: "Splitter",
|
||||
getDefaultProps: function () {
|
||||
@ -610,7 +622,7 @@ var Splitter = React.createClass({displayName: "Splitter",
|
||||
});
|
||||
|
||||
module.exports = {
|
||||
State: ReactRouter.State, // keep here - react-router is pretty buggy, we may need workarounds in the future.
|
||||
State: State,
|
||||
Navigation: Navigation,
|
||||
StickyHeadMixin: StickyHeadMixin,
|
||||
AutoScrollMixin: AutoScrollMixin,
|
||||
@ -2166,15 +2178,17 @@ var Header = React.createClass({displayName: "Header",
|
||||
},
|
||||
render: function () {
|
||||
var header = header_entries.map(function (entry, i) {
|
||||
var classes = React.addons.classSet({
|
||||
active: entry == this.state.active
|
||||
});
|
||||
var className;
|
||||
if(entry === this.state.active){
|
||||
className = "active";
|
||||
} else {
|
||||
className = "";
|
||||
}
|
||||
return (
|
||||
React.createElement("a", {key: i,
|
||||
href: "#",
|
||||
className: classes,
|
||||
onClick: this.handleClick.bind(this, entry)
|
||||
},
|
||||
className: className,
|
||||
onClick: this.handleClick.bind(this, entry)},
|
||||
entry.title
|
||||
)
|
||||
);
|
||||
|
@ -945,12 +945,24 @@ th {
|
||||
.glyphicon-bitcoin:before {
|
||||
content: "\e227";
|
||||
}
|
||||
.glyphicon-btc:before {
|
||||
content: "\e227";
|
||||
}
|
||||
.glyphicon-xbt:before {
|
||||
content: "\e227";
|
||||
}
|
||||
.glyphicon-yen:before {
|
||||
content: "\00a5";
|
||||
}
|
||||
.glyphicon-jpy:before {
|
||||
content: "\00a5";
|
||||
}
|
||||
.glyphicon-ruble:before {
|
||||
content: "\20bd";
|
||||
}
|
||||
.glyphicon-rub:before {
|
||||
content: "\20bd";
|
||||
}
|
||||
.glyphicon-scale:before {
|
||||
content: "\e230";
|
||||
}
|
||||
@ -1147,6 +1159,9 @@ hr {
|
||||
overflow: visible;
|
||||
clip: auto;
|
||||
}
|
||||
[role="button"] {
|
||||
cursor: pointer;
|
||||
}
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
@ -2548,10 +2563,13 @@ output {
|
||||
.form-control[disabled],
|
||||
.form-control[readonly],
|
||||
fieldset[disabled] .form-control {
|
||||
cursor: not-allowed;
|
||||
background-color: #eeeeee;
|
||||
opacity: 1;
|
||||
}
|
||||
.form-control[disabled],
|
||||
fieldset[disabled] .form-control {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
textarea.form-control {
|
||||
height: auto;
|
||||
}
|
||||
@ -2618,6 +2636,7 @@ input[type="search"] {
|
||||
}
|
||||
.radio-inline,
|
||||
.checkbox-inline {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
padding-left: 20px;
|
||||
margin-bottom: 0;
|
||||
@ -2654,6 +2673,7 @@ fieldset[disabled] .checkbox label {
|
||||
padding-top: 7px;
|
||||
padding-bottom: 7px;
|
||||
margin-bottom: 0;
|
||||
min-height: 34px;
|
||||
}
|
||||
.form-control-static.input-lg,
|
||||
.form-control-static.input-sm {
|
||||
@ -2695,6 +2715,7 @@ select[multiple].form-group-sm .form-control {
|
||||
padding: 5px 10px;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
min-height: 32px;
|
||||
}
|
||||
.input-lg {
|
||||
height: 46px;
|
||||
@ -2731,6 +2752,7 @@ select[multiple].form-group-lg .form-control {
|
||||
padding: 10px 16px;
|
||||
font-size: 18px;
|
||||
line-height: 1.3333333;
|
||||
min-height: 38px;
|
||||
}
|
||||
.has-feedback {
|
||||
position: relative;
|
||||
@ -3348,11 +3370,9 @@ input[type="button"].btn-block {
|
||||
}
|
||||
.collapse {
|
||||
display: none;
|
||||
visibility: hidden;
|
||||
}
|
||||
.collapse.in {
|
||||
display: block;
|
||||
visibility: visible;
|
||||
}
|
||||
tr.collapse.in {
|
||||
display: table-row;
|
||||
@ -3377,7 +3397,7 @@ tbody.collapse.in {
|
||||
height: 0;
|
||||
margin-left: 2px;
|
||||
vertical-align: middle;
|
||||
border-top: 4px solid;
|
||||
border-top: 4px dashed;
|
||||
border-right: 4px solid transparent;
|
||||
border-left: 4px solid transparent;
|
||||
}
|
||||
@ -4016,11 +4036,9 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
|
||||
}
|
||||
.tab-content > .tab-pane {
|
||||
display: none;
|
||||
visibility: hidden;
|
||||
}
|
||||
.tab-content > .active {
|
||||
display: block;
|
||||
visibility: visible;
|
||||
}
|
||||
.nav-tabs .dropdown-menu {
|
||||
margin-top: -1px;
|
||||
@ -4062,7 +4080,6 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
|
||||
}
|
||||
.navbar-collapse.collapse {
|
||||
display: block !important;
|
||||
visibility: visible !important;
|
||||
height: auto !important;
|
||||
padding-bottom: 0;
|
||||
overflow: visible !important;
|
||||
@ -4791,7 +4808,8 @@ a.label:focus {
|
||||
position: relative;
|
||||
top: -1px;
|
||||
}
|
||||
.btn-xs .badge {
|
||||
.btn-xs .badge,
|
||||
.btn-group-xs > .btn .badge {
|
||||
top: 0;
|
||||
padding: 1px 5px;
|
||||
}
|
||||
@ -5614,10 +5632,10 @@ a.list-group-item-danger.active:focus {
|
||||
width: 100%;
|
||||
border: 0;
|
||||
}
|
||||
.embed-responsive.embed-responsive-16by9 {
|
||||
.embed-responsive-16by9 {
|
||||
padding-bottom: 56.25%;
|
||||
}
|
||||
.embed-responsive.embed-responsive-4by3 {
|
||||
.embed-responsive-4by3 {
|
||||
padding-bottom: 75%;
|
||||
}
|
||||
.well {
|
||||
@ -5678,7 +5696,7 @@ button.close {
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 1040;
|
||||
z-index: 1050;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
outline: 0;
|
||||
}
|
||||
@ -5719,10 +5737,12 @@ button.close {
|
||||
outline: 0;
|
||||
}
|
||||
.modal-backdrop {
|
||||
position: absolute;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 1040;
|
||||
background-color: #000000;
|
||||
}
|
||||
.modal-backdrop.fade {
|
||||
@ -5793,7 +5813,6 @@ button.close {
|
||||
position: absolute;
|
||||
z-index: 1070;
|
||||
display: block;
|
||||
visibility: visible;
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
@ -6316,7 +6335,6 @@ button.close {
|
||||
}
|
||||
.hidden {
|
||||
display: none !important;
|
||||
visibility: hidden !important;
|
||||
}
|
||||
.affix {
|
||||
position: fixed;
|
||||
|
File diff suppressed because it is too large
Load Diff
100
web/package.json
100
web/package.json
@ -1,52 +1,52 @@
|
||||
{
|
||||
"name": "mitmproxy",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"test": "jest ./src/js"
|
||||
},
|
||||
"jest": {
|
||||
"testPathDirs": [
|
||||
"./src/js"
|
||||
],
|
||||
"testPathIgnorePatterns": [
|
||||
"/node_modules/",
|
||||
"testutils.js"
|
||||
],
|
||||
"testDirectoryName": "tests"
|
||||
},
|
||||
"dependencies": {
|
||||
"jquery": "",
|
||||
"lodash": "",
|
||||
"react": "0.12.x",
|
||||
"react-router": "",
|
||||
"bootstrap": "",
|
||||
"flux": ""
|
||||
},
|
||||
"devDependencies": {
|
||||
"browserify": "=8.0.1",
|
||||
"gulp": "",
|
||||
"gulp-concat": "",
|
||||
"gulp-connect": "",
|
||||
"gulp-jshint": "",
|
||||
"gulp-less": "",
|
||||
"gulp-livereload": "",
|
||||
"gulp-minify-css": "",
|
||||
"gulp-notify": "",
|
||||
"gulp-peg": "",
|
||||
"gulp-plumber": "",
|
||||
"gulp-react": "",
|
||||
"gulp-rename": "",
|
||||
"gulp-replace": "",
|
||||
"gulp-rev": "",
|
||||
"gulp-sourcemaps": "",
|
||||
"gulp-uglify": "",
|
||||
"jest-cli": "^0.1.18",
|
||||
"jshint-stylish": "",
|
||||
"lodash": "",
|
||||
"map-stream": "",
|
||||
"reactify": "",
|
||||
"vinyl-buffer": "",
|
||||
"vinyl-source-stream": "",
|
||||
"vinyl-transform": ""
|
||||
}
|
||||
"name": "mitmproxy",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"test": "jest ./src/js"
|
||||
},
|
||||
"jest": {
|
||||
"testPathDirs": [
|
||||
"./src/js"
|
||||
],
|
||||
"testPathIgnorePatterns": [
|
||||
"/node_modules/",
|
||||
"testutils.js"
|
||||
],
|
||||
"testDirectoryName": "tests"
|
||||
},
|
||||
"dependencies": {
|
||||
"bootstrap": "^3.3.4",
|
||||
"flux": "",
|
||||
"jquery": "",
|
||||
"lodash": "",
|
||||
"react": "^0.13.1",
|
||||
"react-router": "^0.13.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"browserify": "=8.0.1",
|
||||
"gulp": "",
|
||||
"gulp-concat": "",
|
||||
"gulp-connect": "",
|
||||
"gulp-jshint": "",
|
||||
"gulp-less": "",
|
||||
"gulp-livereload": "",
|
||||
"gulp-minify-css": "",
|
||||
"gulp-notify": "",
|
||||
"gulp-peg": "",
|
||||
"gulp-plumber": "",
|
||||
"gulp-react": "",
|
||||
"gulp-rename": "",
|
||||
"gulp-replace": "",
|
||||
"gulp-rev": "",
|
||||
"gulp-sourcemaps": "",
|
||||
"gulp-uglify": "",
|
||||
"jest-cli": "^0.1.18",
|
||||
"jshint-stylish": "",
|
||||
"lodash": "",
|
||||
"map-stream": "",
|
||||
"reactify": "",
|
||||
"vinyl-buffer": "",
|
||||
"vinyl-source-stream": "",
|
||||
"vinyl-transform": ""
|
||||
}
|
||||
}
|
||||
|
@ -32,31 +32,43 @@ var StickyHeadMixin = {
|
||||
|
||||
var Navigation = _.extend({}, ReactRouter.Navigation, {
|
||||
setQuery: function (dict) {
|
||||
var q = this.context.getCurrentQuery();
|
||||
var q = this.context.router.getCurrentQuery();
|
||||
for(var i in dict){
|
||||
if(dict.hasOwnProperty(i)){
|
||||
q[i] = dict[i] || undefined; //falsey values shall be removed.
|
||||
}
|
||||
}
|
||||
q._ = "_"; // workaround for https://github.com/rackt/react-router/pull/957
|
||||
this.replaceWith(this.context.getCurrentPath(), this.context.getCurrentParams(), q);
|
||||
this.replaceWith(this.context.router.getCurrentPath(), this.context.router.getCurrentParams(), q);
|
||||
},
|
||||
replaceWith: function(routeNameOrPath, params, query) {
|
||||
if(routeNameOrPath === undefined){
|
||||
routeNameOrPath = this.context.getCurrentPath();
|
||||
routeNameOrPath = this.context.router.getCurrentPath();
|
||||
}
|
||||
if(params === undefined){
|
||||
params = this.context.getCurrentParams();
|
||||
params = this.context.router.getCurrentParams();
|
||||
}
|
||||
if(query === undefined) {
|
||||
query = this.context.getCurrentQuery();
|
||||
query = this.context.router.getCurrentQuery();
|
||||
}
|
||||
|
||||
// FIXME: react-router is just broken.
|
||||
ReactRouter.Navigation.replaceWith.call(this, routeNameOrPath, params, query);
|
||||
// FIXME: react-router is just broken,
|
||||
// we hopefully just need to wait for the next release with https://github.com/rackt/react-router/pull/957.
|
||||
this.context.router.replaceWith(routeNameOrPath, params, query);
|
||||
}
|
||||
});
|
||||
|
||||
// react-router is fairly good at changing its API regularly.
|
||||
// We keep the old method for now - if it should turn out that their changes are permanent,
|
||||
// we may remove this mixin and access react-router directly again.
|
||||
var State = _.extend({}, ReactRouter.State, {
|
||||
getQuery: function(){
|
||||
return this.context.router.getCurrentQuery();
|
||||
},
|
||||
getParams: function(){
|
||||
return this.context.router.getCurrentParams();
|
||||
}
|
||||
});
|
||||
_.extend(Navigation.contextTypes, ReactRouter.State.contextTypes);
|
||||
|
||||
var Splitter = React.createClass({
|
||||
getDefaultProps: function () {
|
||||
@ -164,7 +176,7 @@ var Splitter = React.createClass({
|
||||
});
|
||||
|
||||
module.exports = {
|
||||
State: ReactRouter.State, // keep here - react-router is pretty buggy, we may need workarounds in the future.
|
||||
State: State,
|
||||
Navigation: Navigation,
|
||||
StickyHeadMixin: StickyHeadMixin,
|
||||
AutoScrollMixin: AutoScrollMixin,
|
||||
|
@ -356,15 +356,17 @@ var Header = React.createClass({
|
||||
},
|
||||
render: function () {
|
||||
var header = header_entries.map(function (entry, i) {
|
||||
var classes = React.addons.classSet({
|
||||
active: entry == this.state.active
|
||||
});
|
||||
var className;
|
||||
if(entry === this.state.active){
|
||||
className = "active";
|
||||
} else {
|
||||
className = "";
|
||||
}
|
||||
return (
|
||||
<a key={i}
|
||||
href="#"
|
||||
className={classes}
|
||||
onClick={this.handleClick.bind(this, entry)}
|
||||
>
|
||||
className={className}
|
||||
onClick={this.handleClick.bind(this, entry)}>
|
||||
{ entry.title}
|
||||
</a>
|
||||
);
|
||||
|
Loading…
Reference in New Issue
Block a user