<commit_before>import React, { Component, PropTypes, } from 'react';
import { Button, Select, } from 're-bulma';

const propTypes = {
  onClick: PropTypes.string,
  buttonProps: PropTypes.object,
  spanProps: PropTypes.object,
  style: PropTypes.object,
  onclickProps:PropTypes.any,
};

const defaultProps = {
  // onClick: '/',
  style: {},
};

class ResponsiveButton extends Component {
  // constructor(props) {
  //   super(props);
  // }
  getButtonLink(baseurl, params, prop) {
    let returnLink = baseurl;
    try {
      if (params && params.length > 0) {
        params.forEach((param) => {
          returnLink = returnLink.replace(param.key, prop[ param.val ]);
        });
      }
    } catch (e) {
      console.debug(e, { baseurl, params, prop, });
    }
    return returnLink;
  }
  getHref(options) {
    let { thisDotProp, clickThisProp, clickPropObject, clickBaseUrl, clickLinkParams, clickPassProps, /*clickprop, clickFetchProps, clickSuccessProps, */ } = options;
    // console.debug('getHref',{options})
    let linkSelectionProp = (clickThisProp)
      ? thisDotProp[clickThisProp]
      : clickPropObject;
    let onclickProp = (clickBaseUrl)
      ? this.getButtonLink(clickBaseUrl, clickLinkParams, linkSelectionProp)
      : clickPassProps;
    return onclickProp;
  }
  handleOnClick(options) {
    // console.debug({ options });
    let { clickprop, thisDotProp, clickThisProp, clickPropObject, clickBaseUrl, clickLinkParams, clickPassProps, clickFetchProps, clickSuccessProps, } = options;
    let onclickFunction = (data) => {
      console.debug('ResponsiveButton', { data, });
    };
    let linkSelectionProp = (clickThisProp)
      ? thisDotProp[clickThisProp]
      : clickPropObject;
    let onclickProp = (clickBaseUrl)
      ? this.getButtonLink(clickBaseUrl, clickLinkParams, linkSelectionProp)
      : clickPassProps;
    if (typeof clickprop === 'string' && clickprop.indexOf('func:this.props.reduxRouter') !== -1) {
      onclickFunction = this.props.reduxRouter[ clickprop.replace('func:this.props.reduxRouter.', '') ];
    } else if (typeof clickprop === 'string' && clickprop.indexOf('func:this.funcs') !== -1) {
      onclickFunction = this.funcs[ clickprop.replace('func:this.funcs.', '') ];
    } else if (typeof clickprop === 'string' && clickprop.indexOf('func:window') !== -1) {
      onclickFunction = window[ clickprop.replace('func:window.', '') ].bind(this);
    } else if (typeof clickprop === 'string' && clickprop.indexOf('func:this.props') !== -1) {
      // console.debug('this.props', this.props);
      onclickFunction = this.props[ clickprop.replace('func:this.props.', '') ];
    } else if (typeof clickprop === 'function') {
      onclickFunction = clickprop;
    }
    if (this.props.confirmModal) {
      return this.props.createModal(Object.assign({
        title: 'Please Confirm',
        text: {
          component: 'div',
          props: {
            style: {
              textAlign: 'center',
            },
          },
          children: [
            {
              component: 'div',
              children: this.props.confirmModal.textContent || '',
            },
            {
              component: 'div',
              children: [
                {
                  component: 'ResponsiveButton',
                  props: Object.assign({
                    style: {
                      margin: 10,
                    },
                    buttonProps: {
                      size: 'isMedium',

                      color: 'isPrimary',
                    },
                    onClick: () => {
                      // console.debug('debugging this modal', this);
                      this.props.hideModal('last');
                      onclickFunction.call(this, onclickProp, clickFetchProps, clickSuccessProps);
                    },
                    onclickProps: 'last',
                  },this.props.confirmModal.yesButtonProps),
                  children: this.props.confirmModal.yesButtonText||'Yes',
                },
                {
                  component: 'ResponsiveButton',
                  props: Object.assign({
                    style: {
                      margin: 10,
                    },
                    buttonProps: {
                      size: 'isMedium',
                    },
                    onClick: 'func:this.props.hideModal',
                    onclickProps: 'last',
                  },this.props.confirmModal.noButtonProps),
                  children: this.props.confirmModal.noButtonText||'No',
                },
              ],
            },
          ],
        },
      }, this.props.confirmModal));
    } else if (typeof clickprop === 'string' && clickprop === 'func:this.props.createModal') {
      let modalPathName = (onclickProp.params)? this.getButtonLink(onclickProp.pathname, onclickProp.params, linkSelectionProp)
      : onclickProp.pathname;
      return onclickFunction.call(this, {pathname: modalPathName }, clickFetchProps, clickSuccessProps);
    } else {
      // console.debug('debugging this regular onclick', this);
      return onclickFunction.call(this, onclickProp, clickFetchProps, clickSuccessProps);
    }
  }
  handleSelect(event, selectProps) {
    let value = event.target.value;
    let selectedProp = selectProps[ value ];
    let buttonProps = selectedProp.buttonProps;
    this.handleOnClick.call(this, {
      clickprop: buttonProps.onClick,
      clickThisProp: buttonProps.onclickThisProp,
      clickPropObject: buttonProps.onclickPropObject,
      clickBaseUrl: buttonProps.onclickBaseUrl,
      clickLinkParams: buttonProps.onclickLinkParams,
      clickPassProps: buttonProps.onclickProps,
      clickFetchProps: buttonProps.fetchProps,
      clickSuccessProps: buttonProps.successProps,
      thisDotProp: this.props,
    });
    // console.debug({ value, selectProps });
  }
  render() {
    let getPropsForOnClick = () => {
      return {
        clickprop: this.props.onClick,
        clickThisProp: this.props.onclickThisProp,
        clickPropObject: this.props.onclickPropObject,
        clickBaseUrl: this.props.onclickBaseUrl,
        clickLinkParams: this.props.onclickLinkParams,
        clickPassProps: this.props.onclickProps,
        clickFetchProps: this.props.fetchProps,
        clickSuccessProps: this.props.successProps,
        thisDotProp: this.props,
      };
    };
    if (this.props.selectProps) {
      let options = [];
      let selectPropsVals = this.props.selectProps.values;

      Object.keys(selectPropsVals).forEach(key => {
        let additionalOptionProps =
          (typeof selectPropsVals[ key ].disabled !== 'undefined')
            ? { disabled:true, }
            : {};
        options.push(<option {...additionalOptionProps} key={`sddb-${key}`} value={key}>{selectPropsVals[key].label}</option>);
      });

      return <Select className="__ra_rb" {...this.props.selectElmProps} value={this.props.selectProps.selected}  onChange={(event) => {
        // console.log({ event });
        this.handleSelect.call(this, event, this.props.selectProps.values);
      }}>
        {options}
      </Select>;
    } else if (this.props.buttonProps) {
      return <Button className="__ra_rb"
        {...this.props.buttonProps}
        style={Object.assign({
          cursor: 'pointer', display: 'inline-block',
        }, this.props.style)}
        onClick={this.handleOnClick.bind(this, getPropsForOnClick())}
        >
        {
          (this.props.onclickThisProp && this.props.displayThisProps)
          ? this.props[this.props.onclickThisProp][this.props.displayThisProps]
          : this.props.children
        }
      </Button>;
    } else if (this.props.aProps){
      return {this.props.children};
    } else {
      return
        {
          (this.props.onclickThisProp && this.props.displayThisProps)
          ? this.props[this.props.onclickThisProp][this.props.displayThisProps]
          : this.props.children
        }
      ;
    }
  }
}

ResponsiveButton.propTypes = propTypes;
ResponsiveButton.defaultProps = defaultProps;

export default ResponsiveButton;<commit_msg>added table headers back<commit_after>import React, { Component, PropTypes, } from 'react';
import { Button, Select, } from 're-bulma';

const propTypes = {
  onClick: PropTypes.string,
  buttonProps: PropTypes.object,
  spanProps: PropTypes.object,
  style: PropTypes.object,
  onclickProps:PropTypes.any,
};

const defaultProps = {
  // onClick: '/',
  style: {},
};

class ResponsiveButton extends Component {
  // constructor(props) {
  //   super(props);
  // }
  getButtonLink(baseurl, params, prop) {
    let returnLink = baseurl;
    try {
      if (params && params.length > 0) {
        params.forEach((param) => {
          returnLink = returnLink.replace(param.key, prop[ param.val ]);
        });
      }
    } catch (e) {
      console.debug(e, { baseurl, params, prop, });
    }
    return returnLink;
  }
  getHref(options) {
    let { thisDotProp, clickThisProp, clickPropObject, clickBaseUrl, clickLinkParams, clickPassProps, /*clickprop, clickFetchProps, clickSuccessProps, */ } = options;
    // console.debug('getHref',{options})
    let linkSelectionProp = (clickThisProp)
      ? thisDotProp[clickThisProp]
      : clickPropObject;
    let onclickProp = (clickBaseUrl)
      ? this.getButtonLink(clickBaseUrl, clickLinkParams, linkSelectionProp)
      : clickPassProps;
    return onclickProp;
  }
  handleOnClick(options) {
    // console.debug({ options });
    let { clickprop, thisDotProp, clickThisProp, clickPropObject, clickBaseUrl, clickLinkParams, clickPassProps, clickFetchProps, clickSuccessProps, } = options;
    let onclickFunction = (data) => {
      console.debug('ResponsiveButton', { data, });
    };
    let linkSelectionProp = (clickThisProp)
      ? thisDotProp[clickThisProp]
      : clickPropObject;
    let onclickProp = (clickBaseUrl)
      ? this.getButtonLink(clickBaseUrl, clickLinkParams, linkSelectionProp)
      : clickPassProps;
    if (typeof clickprop === 'string' && clickprop.indexOf('func:this.props.reduxRouter') !== -1) {
      onclickFunction = this.props.reduxRouter[ clickprop.replace('func:this.props.reduxRouter.', '') ];
    } else if (typeof clickprop === 'string' && clickprop.indexOf('func:this.funcs') !== -1) {
      onclickFunction = this.funcs[ clickprop.replace('func:this.funcs.', '') ];
    } else if (typeof clickprop === 'string' && clickprop.indexOf('func:window') !== -1) {
      onclickFunction = window[ clickprop.replace('func:window.', '') ].bind(this);
    } else if (typeof clickprop === 'string' && clickprop.indexOf('func:this.props') !== -1) {
      // console.debug('this.props', this.props);
      onclickFunction = this.props[ clickprop.replace('func:this.props.', '') ];
    } else if (typeof clickprop === 'function') {
      onclickFunction = clickprop;
    }
    if (this.props.confirmModal) {
      return this.props.createModal(Object.assign({
        title: 'Please Confirm',
        text: {
          component: 'div',
          props: {
            style: {
              textAlign: 'center',
            },
          },
          children: [
            {
              component: 'div',
              children: this.props.confirmModal.textContent || '',
            },
            {
              component: 'div',
              children: [
                {
                  component: 'ResponsiveButton',
                  props: Object.assign({
                    style: {
                      margin: 10,
                    },
                    buttonProps: {
                      size: 'isMedium',

                      color: 'isPrimary',
                    },
                    onClick: () => {
                      // console.debug('debugging this modal', this);
                      this.props.hideModal('last');
                      onclickFunction.call(this, onclickProp, clickFetchProps, clickSuccessProps);
                    },
                    onclickProps: 'last',
                  },this.props.confirmModal.yesButtonProps),
                  children: this.props.confirmModal.yesButtonText||'Yes',
                },
                {
                  component: 'ResponsiveButton',
                  props: Object.assign({
                    style: {
                      margin: 10,
                    },
                    buttonProps: {
                      size: 'isMedium',
                    },
                    onClick: 'func:this.props.hideModal',
                    onclickProps: 'last',
                  },this.props.confirmModal.noButtonProps),
                  children: this.props.confirmModal.noButtonText||'No',
                },
              ],
            },
          ],
        },
      }, this.props.confirmModal));
    } else if (typeof clickprop === 'string' && clickprop === 'func:this.props.createModal') {
      let modalPathName = (onclickProp.params)? this.getButtonLink(onclickProp.pathname, onclickProp.params, linkSelectionProp)
      : onclickProp.pathname;
      return onclickFunction.call(this, Object.assign({}, onclickProp, {pathname: modalPathName }), clickFetchProps, clickSuccessProps);
    } else {
      // console.debug('debugging this regular onclick', this);
      return onclickFunction.call(this, onclickProp, clickFetchProps, clickSuccessProps);
    }
  }
  handleSelect(event, selectProps) {
    let value = event.target.value;
    let selectedProp = selectProps[ value ];
    let buttonProps = selectedProp.buttonProps;
    this.handleOnClick.call(this, {
      clickprop: buttonProps.onClick,
      clickThisProp: buttonProps.onclickThisProp,
      clickPropObject: buttonProps.onclickPropObject,
      clickBaseUrl: buttonProps.onclickBaseUrl,
      clickLinkParams: buttonProps.onclickLinkParams,
      clickPassProps: buttonProps.onclickProps,
      clickFetchProps: buttonProps.fetchProps,
      clickSuccessProps: buttonProps.successProps,
      thisDotProp: this.props,
    });
    // console.debug({ value, selectProps });
  }
  render() {
    let getPropsForOnClick = () => {
      return {
        clickprop: this.props.onClick,
        clickThisProp: this.props.onclickThisProp,
        clickPropObject: this.props.onclickPropObject,
        clickBaseUrl: this.props.onclickBaseUrl,
        clickLinkParams: this.props.onclickLinkParams,
        clickPassProps: this.props.onclickProps,
        clickFetchProps: this.props.fetchProps,
        clickSuccessProps: this.props.successProps,
        thisDotProp: this.props,
      };
    };
    if (this.props.selectProps) {
      let options = [];
      let selectPropsVals = this.props.selectProps.values;

      Object.keys(selectPropsVals).forEach(key => {
        let additionalOptionProps =
          (typeof selectPropsVals[ key ].disabled !== 'undefined')
            ? { disabled:true, }
            : {};
        options.push(<option {...additionalOptionProps} key={`sddb-${key}`} value={key}>{selectPropsVals[key].label}</option>);
      });

      return <Select className="__ra_rb" {...this.props.selectElmProps} value={this.props.selectProps.selected}  onChange={(event) => {
        // console.log({ event });
        this.handleSelect.call(this, event, this.props.selectProps.values);
      }}>
        {options}
      </Select>;
    } else if (this.props.buttonProps) {
      return <Button className="__ra_rb"
        {...this.props.buttonProps}
        style={Object.assign({
          cursor: 'pointer', display: 'inline-block',
        }, this.props.style)}
        onClick={this.handleOnClick.bind(this, getPropsForOnClick())}
        >
        {
          (this.props.onclickThisProp && this.props.displayThisProps)
          ? this.props[this.props.onclickThisProp][this.props.displayThisProps]
          : this.props.children
        }
      </Button>;
    } else if (this.props.aProps){
      return {this.props.children};
    } else {
      return
        {
          (this.props.onclickThisProp && this.props.displayThisProps)
          ? this.props[this.props.onclickThisProp][this.props.displayThisProps]
          : this.props.children
        }
      ;
    }
  }
}

ResponsiveButton.propTypes = propTypes;
ResponsiveButton.defaultProps = defaultProps;

export default ResponsiveButton;<|endoftext|>


<commit_before>import PropTypes from "prop-types";
import React, { useCallback, useState } from "react";
import styled from "styled-components";

import style from "@agir/front/genericComponents/_variables.scss";

import Button from "@agir/front/genericComponents/Button";
import CSRFProtectedForm from "@agir/front/genericComponents/CSRFProtectedForm";
import FeatherIcon, {
  RawFeatherIcon,
} from "@agir/front/genericComponents/FeatherIcon";
import Popin from "@agir/front/genericComponents/Popin";
import BottomSheet from "@agir/front/genericComponents/BottomSheet";
import { ResponsiveLayout } from "@agir/front/genericComponents/grid";

const StyledList = styled.ul`
  width: 100%;
  cursor: pointer;
  display: flex;
  flex-flow: column nowrap;
  align-items: stretch;
  list-style: none;
  color: ${style.primary500};
  padding: 0;

  @media (max-width: ${style.collapse}px) {
    margin: 0;
    padding: 1.5rem;
  }

  a {
    display: flex;
    align-items: center;
    border: none;
    padding: 0;
    margin: 0;
    text-decoration: none;
    background: inherit;
    cursor: pointer;
    text-align: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    font-size: 0.875rem;
    line-height: 20px;
    font-weight: 400;
    color: ${style.black1000};
    margin-bottom: 0.5rem;

    &:last-child {
      margin-bottom: 0;
    }

    &:hover,
    &:focus {
      text-decoration: underline;
      border: none;
      outline: none;
    }

    &[disabled],
    &[disabled]:hover,
    &[disabled]:focus {
      opacity: 0.75;
      text-decoration: none;
      cursor: default;
    }

    @media (max-width: ${style.collapse}px) {
      margin-bottom: 1.5rem;
      text-decoration: none;
    }

    & > *:first-child {
      margin-right: 0.5rem;
      width: 1rem;
      height: 1rem;

      @media (max-width: ${style.collapse}px) {
        margin-right: 1rem;-
        width: 1.5rem;
        height: 1.5rem;
      }

      svg {
        width: inherit;
        height: inherit;
        stroke-width: 2;
      }
    }
  }
`;
const StyledPanel = styled.div`
  width: 100%;
  background-color: ${style.primary100};
  padding: 1.5rem;
  margin: 0;

  @media (max-width: ${style.collapse}px) {
    display: none;
  }

  h6 {
    margin: 0;
    font-size: 1rem;
    line-height: 1;
    color: ${style.primary500};
    margin-bottom: 1rem;
    font-weight: bold;
  }

  && ul {
    margin-bottom: 0;

    li {
      align-items: center;
      font-weight: normal;
      font-size: 0.875rem;

      a {
        margin-left: 0.5rem;
      }

      ${RawFeatherIcon} {
        svg {
          stroke-width: 2px;
          width: 1rem;
          height: 1rem;
        }
      }
    }
  }

  ${Button} + ul {
    margin-top: 1rem;
  }

  & ~ ${Button} {
    @media (min-width: ${style.collapse}px) {
      display: none;
    }
  }
`;
const StyledContent = styled.div`
  padding: 0;
  display: flex;
  align-items: flex-start;
  flex-flow: column nowrap;
  margin-bottom: 2rem;

  @media (max-width: ${style.collapse}px) {
    background-color: white;
    width: 100%;
    padding: 0 1rem 1.5rem;
    margin-bottom: 0;
    align-items: center;
    display: ${({ hideOnMobile }) => (hideOnMobile ? "none" : "flex")};
  }

  & > ${Button} {
    margin: 0;
    width: 100%;
    justify-content: center;
  }

  & > ${Button} + ${Button} {
    margin-top: 0.75rem;
  }

  p {
    margin-top: 0.5rem;
    font-weight: 500;
    font-size: 0.813rem;
    line-height: 1.5;
    color: ${style.black500};

    @media (max-width: ${style.collapse}px) {
      font-size: 0.688rem;
      font-weight: 400;
      color: ${style.black1000};
      margin-bottom: 0;
    }
  }
`;

const ManagerActions = (props) => {
  const { is2022 = false, routes } = props;

  return (

      <Button
        as="a"
        href={routes.createEvent}
        color="primary"
        icon="plus"
        small
      >
        Créer un événement {is2022 ? "de l'équipe" : "du groupe"}
      </Button>
      <Button as="a" href={routes.settings} icon="settings" small>
        Gestion {is2022 ? "de l'équipe" : "du groupe"}
      </Button>
    </StyledContent>
  );
};

const MobileMemberActions = (props) => {
  const { is2022 = false, routes, isMenuOpen, openMenu, closeMenu } = props;

  return (

      <Button onClick={openMenu} color="default" icon="check" small>
        Vous êtes membre {is2022 ? "de l'équipe" : "du groupe"}
      </Button>
      <BottomSheet isOpen={isMenuOpen} onDismiss={closeMenu} position="bottom">

      </BottomSheet>

  );
};
const DesktopMemberActions = (props) => {
  const { is2022 = false, routes, isMenuOpen, openMenu, closeMenu } = props;

  return (

      <Button onClick={openMenu} color="default" icon="check">
        Vous êtes membre {is2022 ? "de l'équipe" : "du groupe"}
      </Button>
      <Popin isOpen={isMenuOpen} onDismiss={closeMenu} position="bottom">

      </Popin>

  );
};
DesktopMemberActions.propTypes = MobileMemberActions.propTypes = {
  is2022: PropTypes.bool,
  routes: PropTypes.object,
  isMenuOpen: PropTypes.bool,
  openMenu: PropTypes.func,
  closeMenu: PropTypes.func,
};
const MemberActions = (props) => {
  const [isMenuOpen, setIsMenuOpen] = useState(false);
  const openMenu = useCallback(() => setIsMenuOpen(true), []);
  const closeMenu = useCallback(() => setIsMenuOpen(false), []);

  return (

  );
};

const NonMemberActions = (props) => {
  const { is2022 = false, routes } = props;

  return (

  );
};

const GroupUserActions = (props) => {
  if (props.isManager) {
    return <ManagerActions {...props} />;
  }
  if (props.isMember) {
    return <MemberActions {...props} />;
  }
  return <NonMemberActions {...props} />;
};

ManagerActions.propTypes = MemberActions.propTypes = NonMemberActions.propTypes = GroupUserActions.propTypes = {
  isMember: PropTypes.bool,
  isManager: PropTypes.bool,
  is2022: PropTypes.bool,
  routes: PropTypes.object,
};
export default GroupUserActions;
<commit_msg>fix: GroupUserActions Manager link list<commit_after>import PropTypes from "prop-types";
import React, { useCallback, useState } from "react";
import styled from "styled-components";

import style from "@agir/front/genericComponents/_variables.scss";

import Button from "@agir/front/genericComponents/Button";
import CSRFProtectedForm from "@agir/front/genericComponents/CSRFProtectedForm";
import FeatherIcon, {
  RawFeatherIcon,
} from "@agir/front/genericComponents/FeatherIcon";
import Popin from "@agir/front/genericComponents/Popin";
import BottomSheet from "@agir/front/genericComponents/BottomSheet";
import { ResponsiveLayout } from "@agir/front/genericComponents/grid";

const StyledList = styled.ul`
  width: 100%;
  cursor: pointer;
  display: flex;
  flex-flow: column nowrap;
  align-items: stretch;
  list-style: none;
  color: ${style.primary500};
  padding: 0;

  @media (max-width: ${style.collapse}px) {
    margin: 0;
    padding: 1.5rem;
  }

  a {
    display: flex;
    align-items: center;
    border: none;
    padding: 0;
    margin: 0;
    text-decoration: none;
    background: inherit;
    cursor: pointer;
    text-align: center;
    -webkit-appearance: none;
    -moz-appearance: none;
    font-size: 0.875rem;
    line-height: 20px;
    font-weight: 400;
    color: ${style.black1000};
    margin-bottom: 0.5rem;

    &:last-child {
      margin-bottom: 0;
    }

    &:hover,
    &:focus {
      text-decoration: underline;
      border: none;
      outline: none;
    }

    &[disabled],
    &[disabled]:hover,
    &[disabled]:focus {
      opacity: 0.75;
      text-decoration: none;
      cursor: default;
    }

    @media (max-width: ${style.collapse}px) {
      margin-bottom: 1.5rem;
      text-decoration: none;
    }

    & > *:first-child {
      margin-right: 0.5rem;
      width: 1rem;
      height: 1rem;

      @media (max-width: ${style.collapse}px) {
        margin-right: 1rem;-
        width: 1.5rem;
        height: 1.5rem;
      }

      svg {
        width: inherit;
        height: inherit;
        stroke-width: 2;
      }
    }
  }
`;
const StyledPanel = styled.div`
  width: 100%;
  background-color: ${style.primary100};
  padding: 1.5rem;
  margin: 0;

  @media (max-width: ${style.collapse}px) {
    display: none;
  }

  h6 {
    margin: 0;
    font-size: 1rem;
    line-height: 1;
    color: ${style.primary500};
    margin-bottom: 1rem;
    font-weight: bold;
  }

  && ul {
    list-style: none;
    padding: 0;
    margin: 0;

    li {
      font-size: 0.813rem;
      line-height: 1.3;
      display: flex;
      align-items: baseline;

      a {
        color: ${style.black1000};
        margin-left: 0.5rem;
      }
    }

    li + li {
      margin-top: 0.5rem;
    }

    li {
      align-items: center;
      font-weight: normal;
      font-size: 0.875rem;

      a {
        margin-left: 0.5rem;
      }

      ${RawFeatherIcon} {
        svg {
          stroke-width: 2px;
          width: 1rem;
          height: 1rem;
        }
      }
    }
  }

  ${Button} + ul {
    margin-top: 1rem;
  }

  & ~ ${Button} {
    @media (min-width: ${style.collapse}px) {
      display: none;
    }
  }
`;
const StyledContent = styled.div`
  padding: 0;
  display: flex;
  align-items: flex-start;
  flex-flow: column nowrap;
  margin-bottom: 2rem;

  @media (max-width: ${style.collapse}px) {
    background-color: white;
    width: 100%;
    padding: 0 1rem 1.5rem;
    margin-bottom: 0;
    align-items: center;
    display: ${({ hideOnMobile }) => (hideOnMobile ? "none" : "flex")};
  }

  & > ${Button} {
    margin: 0;
    width: 100%;
    justify-content: center;
  }

  & > ${Button} + ${Button} {
    margin-top: 0.75rem;
  }

  p {
    margin-top: 0.5rem;
    font-weight: 500;
    font-size: 0.813rem;
    line-height: 1.5;
    color: ${style.black500};

    @media (max-width: ${style.collapse}px) {
      font-size: 0.688rem;
      font-weight: 400;
      color: ${style.black1000};
      margin-bottom: 0;
    }
  }
`;

const ManagerActions = (props) => {
  const { is2022 = false, routes } = props;

  return (

      <Button
        as="a"
        href={routes.createEvent}
        color="primary"
        icon="plus"
        small
      >
        Créer un événement {is2022 ? "de l'équipe" : "du groupe"}
      </Button>
      <Button as="a" href={routes.settings} icon="settings" small>
        Gestion {is2022 ? "de l'équipe" : "du groupe"}
      </Button>
    </StyledContent>
  );
};

const MobileMemberActions = (props) => {
  const { is2022 = false, routes, isMenuOpen, openMenu, closeMenu } = props;

  return (

      <Button onClick={openMenu} color="default" icon="check" small>
        Vous êtes membre {is2022 ? "de l'équipe" : "du groupe"}
      </Button>
      <BottomSheet isOpen={isMenuOpen} onDismiss={closeMenu} position="bottom">

      </BottomSheet>

  );
};
const DesktopMemberActions = (props) => {
  const { is2022 = false, routes, isMenuOpen, openMenu, closeMenu } = props;

  return (

      <Button onClick={openMenu} color="default" icon="check">
        Vous êtes membre {is2022 ? "de l'équipe" : "du groupe"}
      </Button>
      <Popin isOpen={isMenuOpen} onDismiss={closeMenu} position="bottom">

      </Popin>

  );
};
DesktopMemberActions.propTypes = MobileMemberActions.propTypes = {
  is2022: PropTypes.bool,
  routes: PropTypes.object,
  isMenuOpen: PropTypes.bool,
  openMenu: PropTypes.func,
  closeMenu: PropTypes.func,
};
const MemberActions = (props) => {
  const [isMenuOpen, setIsMenuOpen] = useState(false);
  const openMenu = useCallback(() => setIsMenuOpen(true), []);
  const closeMenu = useCallback(() => setIsMenuOpen(false), []);

  return (

  );
};

const NonMemberActions = (props) => {
  const { is2022 = false, routes } = props;

  return (

  );
};

const GroupUserActions = (props) => {
  if (props.isManager) {
    return <ManagerActions {...props} />;
  }
  if (props.isMember) {
    return <MemberActions {...props} />;
  }
  return <NonMemberActions {...props} />;
};

ManagerActions.propTypes = MemberActions.propTypes = NonMemberActions.propTypes = GroupUserActions.propTypes = {
  isMember: PropTypes.bool,
  isManager: PropTypes.bool,
  is2022: PropTypes.bool,
  routes: PropTypes.object,
};
export default GroupUserActions;
<|endoftext|>


<commit_before>import React from 'react';
import Tag from './tag.js';
import {fetchBlogPost, fetchComments, postComment, fetchCaptcha} from './client.js';
import {cx} from './class-set.js';
import marked from './unsafe-marked.js';

var monthNames = ['January', 'February', 'March', 'April', 'May', 'June',
  'July', 'August', 'September', 'October', 'November', 'December'
];

class Comments extends React.Component {
  render() {
    if (!this.props.comments) {
      return null;
    }

    return

      {
        this.props.comments.map(comment => <Comment comment={comment}/>)
      }

;
  }
}

class Comment extends React.Component {
  get gravatarHash() {
    return `http://www.gravatar.com/avatar/${this.props.comment.gravatarHash}?s=60`;
  }
  get body() {
    return this.props.comment.body.replace(/<(?:.|\n)*?>/gm, '');
  }
  render() {
    let comment = this.props.comment;
    console.log(marked(comment.body));
    return

      {comment.name}
       on {comment.datePosted}
       says:

;
  }
}

export default class BlogPost extends React.Component {
  constructor() {
    super();
    this.state = {
      showAddCommentForm: false,
    };
  }

  componentWillMount() {
    if (this.props.params && this.props.params.id) {
      fetchBlogPost(this.props.params.id).then((blogPost) => {
        document.title = blogPost.title + ' - Brian R. Bondy';
        this.setState({
          id: blogPost.id,
          title: blogPost.title,
          body: blogPost.body,
          created: new Date(blogPost.created),
          tags: blogPost.tags,
        });
        return blogPost;
      })
      .then((blogPost) => fetchComments(blogPost.id))
      .then((comments) => {
        this.setState({
          comments,
        });
        console.log(comments);
      });
    } else {
      this.state = {
        id: this.props.id,
        title: this.props.title,
        body: this.props.body,
        created: new Date(this.props.created),
        tags: this.props.tags,
      };
      fetchComments(this.props.id).then((comments) => {
        console.log(comments);
        this.setState({
          comments,
        });
      });
    }
  }

  get blogPostURL() {
    return `/blog/${this.state.id}`;
  }

  get dateString() {
    return `${monthNames[this.state.created.getMonth()]} ${this.state.created.getDate()}, ${this.state.created.getFullYear()}`;
  }

  onPostComment(e) {
    e.preventDefault();
    postComment(this.state.id, {
      name: React.findDOMNode(this.refs.name).value,
      email: React.findDOMNode(this.refs.email).value,
      webpage: React.findDOMNode(this.refs.webpage).value,
      body: React.findDOMNode(this.refs.body).value,
      captcha: React.findDOMNode(this.refs.captcha).value,
    }).then(() => {
      React.findDOMNode(this.refs.name).value = '';
      React.findDOMNode(this.refs.email).value = '';
      React.findDOMNode(this.refs.webpage).value = '';
      React.findDOMNode(this.refs.body).value = '';
      React.findDOMNode(this.refs.captcha).value = '';
      this.refreshCaptcha();
      alert('Thank you, your comment was posted!');
    }).catch((statusCode) => {
      if (statusCode === 405) {
        // Captcha invalid show a captcha error
        React.findDOMNode(this.refs.captcha).value = '';
        this.refreshCaptcha();
        alert('The captcha entered does not match what was expected! Please try again!');
      } else {
        // Some kind of other error, show a generic posting error
        React.findDOMNode(this.refs.captcha).value = '';
        this.refreshCaptcha();
        alert('There was an error posting the comment!');
      }
    });
  }

  refreshCaptcha() {
    fetchCaptcha(this.state.id).then(captchaDataUrl => this.setState({
      captchaDataUrl,
    }));
  }

  onClickAddComment() {
    this.refreshCaptcha();
    this.setState({
      showAddCommentForm: true,
    });
  }

  render() {
    if (!this.state.title) {
      return null;
    }
    console.log(this.state.comments);

    return

{this.state.title}

Posted on {this.dateString}

{this.state.tags.map(tag => <Tag key={tag} name={tag}/>)}

      { !this.state.comments ? null :

Comments

        <input className={cx({
          hideAddCommentForm: this.state.showAddCommentForm,
        })} type='button' value='Add a new comment' onClick={this.onClickAddComment.bind(this)} />
        <form className={cx({
            addCommentForm: true,
            hideAddCommentForm: !this.state.showAddCommentForm,
          })} onSubmit={this.onPostComment.bind(this)}>

Add a new comment

          <input ref='name' type='text' placeholder='Name' />
          <input ref='email' type='email' placeholder='Email (Optional)' />
          <input ref='webpage' type='url' placeholder='Website (Optional)' />
          <textarea ref='body' placeholder='Your comment (markdown, but no tags)' />
          <input className='captchaInput' ref='captcha' type='text' placeholder='Enter the text to the right' />
          { !this.state.captchaDataUrl ? null :

          }
          <input type='submit' value='Submit' />
        </form>
        <Comments comments={this.state.comments}/>

      }

;
  }
}
<commit_msg>mark required fields<commit_after>import React from 'react';
import Tag from './tag.js';
import {fetchBlogPost, fetchComments, postComment, fetchCaptcha} from './client.js';
import {cx} from './class-set.js';
import marked from './unsafe-marked.js';

var monthNames = ['January', 'February', 'March', 'April', 'May', 'June',
  'July', 'August', 'September', 'October', 'November', 'December'
];

class Comments extends React.Component {
  render() {
    if (!this.props.comments) {
      return null;
    }

    return

      {
        this.props.comments.map(comment => <Comment comment={comment}/>)
      }

;
  }
}

class Comment extends React.Component {
  get gravatarHash() {
    return `http://www.gravatar.com/avatar/${this.props.comment.gravatarHash}?s=60`;
  }
  get body() {
    return this.props.comment.body.replace(/<(?:.|\n)*?>/gm, '');
  }
  render() {
    let comment = this.props.comment;
    console.log(marked(comment.body));
    return

      {comment.name}
       on {comment.datePosted}
       says:

;
  }
}

export default class BlogPost extends React.Component {
  constructor() {
    super();
    this.state = {
      showAddCommentForm: false,
    };
  }

  componentWillMount() {
    if (this.props.params && this.props.params.id) {
      fetchBlogPost(this.props.params.id).then((blogPost) => {
        document.title = blogPost.title + ' - Brian R. Bondy';
        this.setState({
          id: blogPost.id,
          title: blogPost.title,
          body: blogPost.body,
          created: new Date(blogPost.created),
          tags: blogPost.tags,
        });
        return blogPost;
      })
      .then((blogPost) => fetchComments(blogPost.id))
      .then((comments) => {
        this.setState({
          comments,
        });
        console.log(comments);
      });
    } else {
      this.state = {
        id: this.props.id,
        title: this.props.title,
        body: this.props.body,
        created: new Date(this.props.created),
        tags: this.props.tags,
      };
      fetchComments(this.props.id).then((comments) => {
        console.log(comments);
        this.setState({
          comments,
        });
      });
    }
  }

  get blogPostURL() {
    return `/blog/${this.state.id}`;
  }

  get dateString() {
    return `${monthNames[this.state.created.getMonth()]} ${this.state.created.getDate()}, ${this.state.created.getFullYear()}`;
  }

  onPostComment(e) {
    e.preventDefault();
    postComment(this.state.id, {
      name: React.findDOMNode(this.refs.name).value,
      email: React.findDOMNode(this.refs.email).value,
      webpage: React.findDOMNode(this.refs.webpage).value,
      body: React.findDOMNode(this.refs.body).value,
      captcha: React.findDOMNode(this.refs.captcha).value,
    }).then(() => {
      React.findDOMNode(this.refs.name).value = '';
      React.findDOMNode(this.refs.email).value = '';
      React.findDOMNode(this.refs.webpage).value = '';
      React.findDOMNode(this.refs.body).value = '';
      React.findDOMNode(this.refs.captcha).value = '';
      this.refreshCaptcha();
      alert('Thank you, your comment was posted!');
    }).catch((statusCode) => {
      if (statusCode === 405) {
        // Captcha invalid show a captcha error
        React.findDOMNode(this.refs.captcha).value = '';
        this.refreshCaptcha();
        alert('The captcha entered does not match what was expected! Please try again!');
      } else {
        // Some kind of other error, show a generic posting error
        React.findDOMNode(this.refs.captcha).value = '';
        this.refreshCaptcha();
        alert('There was an error posting the comment!');
      }
    });
  }

  refreshCaptcha() {
    fetchCaptcha(this.state.id).then(captchaDataUrl => this.setState({
      captchaDataUrl,
    }));
  }

  onClickAddComment() {
    this.refreshCaptcha();
    this.setState({
      showAddCommentForm: true,
    });
  }

  render() {
    if (!this.state.title) {
      return null;
    }
    console.log(this.state.comments);

    return

{this.state.title}

Posted on {this.dateString}

{this.state.tags.map(tag => <Tag key={tag} name={tag}/>)}

      { !this.state.comments ? null :

Comments

        <input className={cx({
          hideAddCommentForm: this.state.showAddCommentForm,
        })} type='button' value='Add a new comment' onClick={this.onClickAddComment.bind(this)} />
        <form className={cx({
            addCommentForm: true,
            hideAddCommentForm: !this.state.showAddCommentForm,
          })} onSubmit={this.onPostComment.bind(this)}>

Add a new comment

          <input ref='name' type='text' placeholder='Name' required />
          <input ref='email' type='email' placeholder='Email (Optional)' />
          <input ref='webpage' type='url' placeholder='Website (Optional)' />
          <textarea ref='body' placeholder='Your comment (markdown, but no tags)' required />
          <input className='captchaInput' ref='captcha' type='text' placeholder='Enter the text to the right' required />
          { !this.state.captchaDataUrl ? null :

          }
          <input type='submit' value='Submit' />
        </form>
        <Comments comments={this.state.comments}/>

      }

;
  }
}
<|endoftext|>


<commit_before>/* Copyright (c) 2006 MetaCarta, Inc., published under the BSD license.
 * See http://svn.openlayers.org/trunk/openlayers/license.txt for the full
 * text of the license. */

OpenLayers.Event = {
  KEY_BACKSPACE: 8,
  KEY_TAB:       9,
  KEY_RETURN:   13,
  KEY_ESC:      27,
  KEY_LEFT:     37,
  KEY_UP:       38,
  KEY_RIGHT:    39,
  KEY_DOWN:     40,
  KEY_DELETE:   46,

  element: function(event) {
    return event.target || event.srcElement;
  },

  isLeftClick: function(event) {
    return (((event.which) && (event.which == 1)) ||
            ((event.button) && (event.button == 1)));
  },

  pointerX: function(event) {
    return event.pageX || (event.clientX +
      (document.documentElement.scrollLeft || document.body.scrollLeft));
  },

  pointerY: function(event) {
    return event.pageY || (event.clientY +
      (document.documentElement.scrollTop || document.body.scrollTop));
  },

  stop: function(event) {
    if (event.preventDefault) {
      event.preventDefault();
      event.stopPropagation();
    } else {
      event.returnValue = false;
      event.cancelBubble = true;
    }
  },

  // find the first node with the given tagName, starting from the
  // node the event was triggered on; traverses the DOM upwards
  findElement: function(event, tagName) {
    var element = OpenLayers.Event.element(event);
    while (element.parentNode && (!element.tagName ||
        (element.tagName.toUpperCase() != tagName.toUpperCase())))
      element = element.parentNode;
    return element;
  },

  observers: false,

  _observeAndCache: function(element, name, observer, useCapture) {
    if (!this.observers) this.observers = [];
    if (element.addEventListener) {
      this.observers.push([element, name, observer, useCapture]);
      element.addEventListener(name, observer, useCapture);
    } else if (element.attachEvent) {
      this.observers.push([element, name, observer, useCapture]);
      element.attachEvent('on' + name, observer);
    }
  },

  unloadCache: function() {
    if (!OpenLayers.Event.observers) return;
    for (var i = 0; i < OpenLayers.Event.observers.length; i++) {
      OpenLayers.Event.stopObserving.apply(this, OpenLayers.Event.observers[i]);
      OpenLayers.Event.observers[i][0] = null;
    }
    OpenLayers.Event.observers = false;
  },

  observe: function(elementParam, name, observer, useCapture) {
    var element = $(elementParam);
    useCapture = useCapture || false;

    if (name == 'keypress' &&
        (navigator.appVersion.match(/Konqueror|Safari|KHTML/)
        || element.attachEvent))
      name = 'keydown';

    this._observeAndCache(element, name, observer, useCapture);
  },

  stopObserving: function(elementParam, name, observer, useCapture) {
    var element = $(elementParam);
    useCapture = useCapture || false;

    if (name == 'keypress' &&
        (navigator.appVersion.match(/Konqueror|Safari|KHTML/)
        || element.detachEvent))
      name = 'keydown';

    if (element.removeEventListener) {
      element.removeEventListener(name, observer, useCapture);
    } else if (element.detachEvent) {
      element.detachEvent('on' + name, observer);
    }
  }
};
/* prevent memory leaks in IE */
OpenLayers.Event.observe(window, 'unload', OpenLayers.Event.unloadCache, false);

if (window.Event) {
  OpenLayers.Util.extend(window.Event, OpenLayers.Event);
} else {
  var Event = OpenLayers.Event;
}

/**
 * @class
 */
OpenLayers.Events = OpenLayers.Class.create();
OpenLayers.Events.prototype = {

    /** @final @type Array: supported events */
    BROWSER_EVENTS: [
        "mouseover", "mouseout",
        "mousedown", "mouseup", "mousemove",
        "click", "dblclick",
        "resize", "focus", "blur"
    ],

    /** Hashtable of Array(Function): events listener functions
     * @type Object */
    listeners: null,

    /** @type Object: the code object issuing application events */
    object: null,

    /** @type DOMElement: the DOM element receiving browser events */
    element: null,

    /** @type Array: list of support application events */
    eventTypes: null,

    /**
     * @constructor
     *
     * @param {OpenLayers.Map} object The js object to which this Events object
     *                                is being added
     * @param {DOMElement} element A dom element to respond to browser events
     * @param {Array} eventTypes Array of custom application events
     * @param {Boolean} fallThrough Allow events to fall through after these
     *                              have been handled?
     */
    initialize: function (object, element, eventTypes, fallThrough) {
        this.object     = object;
        this.element    = element;
        this.eventTypes = eventTypes;
        this.fallThrough = fallThrough;
        this.listeners  = new Object();

        // if eventTypes is specified, create a listeners list for each
        // custom application event.
        if (this.eventTypes != null)
            for (var i = 0; i < this.eventTypes.length; i++)
                this.listeners[ this.eventTypes[i] ] = new Array();

        // if a dom element is specified, add a listeners list
        // for browser events on the element and register them
        if (this.element != null)
            this.attachToElement(element);
    },

    /**
    * @param {HTMLDOMElement} element a DOM element to attach browser events to
    */
    attachToElement: function (element) {
        for (var i = 0; i < this.BROWSER_EVENTS.length; i++) {
            var eventType = this.BROWSER_EVENTS[i];

            // every browser event has a corresponding application event
            // (whether it's listened for or not).
            if (this.listeners[eventType] == null)
                this.listeners[eventType] = new Array();

            // use Prototype to register the event cross-browser
            OpenLayers.Event.observe(element, eventType,
                this.handleBrowserEvent.bindAsEventListener(this));
        }
        // disable dragstart in IE so that mousedown/move/up works normally
        OpenLayers.Event.observe(element, "dragstart", OpenLayers.Event.stop);
    },

    /**
     * @param {String} type Name of the event to register
     * @param {Object} obj The object to bind the context to for the callback#.
     *                     If no object is specified, default is the Events's
     *                     'object' property.
     * @param {Function} func The callback function. If no callback is
     *                        specified, this function does nothing.
     *
     * #When the event is triggered, the 'func' function will be called, in the
     *   context of 'obj'. Imagine we were to register an event, specifying an
     *   OpenLayers.Bounds Object as 'obj'. When the event is triggered, the
     *   context in the callback function will be our Bounds object. This means
     *   that within our callback function, we can access the properties and
     *   methods of the Bounds object through the "this" variable. So our
     *   callback could execute something like:
     *
     *     leftStr = "Left: " + this.left;
     *
     *                   or
     *
     *     centerStr = "Center: " + this.getCenterLonLat();
     *
     */
    register: function (type, obj, func) {

        if (func != null) {
            if (obj == null)  {
                obj = this.object;
            }
            var listeners = this.listeners[type];
            if (listeners != null) {
                listeners.push( {obj: obj, func: func} );
            }
        }
    },

    /**
     * @param {String} type
     * @param {Object} obj If none specified, defaults to this.object
     * @param {Function} func
     */
    unregister: function (type, obj, func) {
        if (obj == null)  {
            obj = this.object;
        }
        var listeners = this.listeners[type];
        if (listeners != null) {
            for (var i = 0; i < listeners.length; i++) {
                if (listeners[i].obj == obj && listeners[i].func == func) {
                    listeners.splice(i, 1);
                    break;
                }
            }
        }
    },

    /** Remove all listeners for a given event type. If type is not registered,
     *   does nothing.
     *
     * @param {String} type
     */
    remove: function(type) {
        if (this.listeners[type] != null) {
            this.listeners[type] = new Array();
        }
    },

    /** Trigger a specified registered event
     *
     * @param {String} type
     * @param {Event} evt
     */
    triggerEvent: function (type, evt) {

        // prep evt object with object & div references
        if (evt == null) {
            evt = new Object();
        }
        evt.object = this.object;
        evt.element = this.element;

        // execute all callbacks registered for specified type
        var listeners = this.listeners[type];
        if ((listeners != null) && (listeners.length > 0)) {
            for (var i = 0; i < listeners.length; i++) {
                var callback = listeners[i];
                var continueChain;
                if (callback.obj != null) {
                    // use the 'call' method to bind the context to callback.obj
                    continueChain = callback.func.call(callback.obj, evt);
                } else {
                    continueChain = callback.func(evt);
                }

                if ((continueChain != null) && (continueChain == false)) {
                    // if callback returns false, execute no more callbacks.
                    break;
                }
            }
            // don't fall through to other DOM elements
            if (!this.fallThrough) {
                OpenLayers.Event.stop(evt);
            }
        }
    },

    /** Basically just a wrapper to the triggerEvent() function, but takes
     *   care to set a property 'xy' on the event with the current mouse
     *   position.
     *
     * @private
     *
     * @param {Event} evt
     */
    handleBrowserEvent: function (evt) {
        evt.xy = this.getMousePosition(evt);
        this.triggerEvent(evt.type, evt)
    },

    /**
     * @private
     *
     * @param {Event} evt
     *
     * @returns The current xy coordinate of the mouse, adjusted for offsets
     * @type OpenLayers.Pixel
     */
    getMousePosition: function (evt) {
        if (!this.element.offsets) {
            this.element.offsets = OpenLayers.Util.pagePosition(this.element);
        }
        return new OpenLayers.Pixel(
            (evt.clientX + (document.documentElement.scrollLeft
                         || document.body.scrollLeft)) - this.element.offsets[0],
            (evt.clientY + (document.documentElement.scrollTop
                         || document.body.scrollTop)) - this.element.offsets[1]
        );
    },

    /** @final @type String */
    CLASS_NAME: "OpenLayers.Events"
};
<commit_msg>Event.Stop caused us to lose the ability to click on our permalink. We like clicking on our permalink. bring that functionality back. <commit_after>/* Copyright (c) 2006 MetaCarta, Inc., published under the BSD license.
 * See http://svn.openlayers.org/trunk/openlayers/license.txt for the full
 * text of the license. */

OpenLayers.Event = {
  KEY_BACKSPACE: 8,
  KEY_TAB:       9,
  KEY_RETURN:   13,
  KEY_ESC:      27,
  KEY_LEFT:     37,
  KEY_UP:       38,
  KEY_RIGHT:    39,
  KEY_DOWN:     40,
  KEY_DELETE:   46,

  element: function(event) {
    return event.target || event.srcElement;
  },

  isLeftClick: function(event) {
    return (((event.which) && (event.which == 1)) ||
            ((event.button) && (event.button == 1)));
  },

  pointerX: function(event) {
    return event.pageX || (event.clientX +
      (document.documentElement.scrollLeft || document.body.scrollLeft));
  },

  pointerY: function(event) {
    return event.pageY || (event.clientY +
      (document.documentElement.scrollTop || document.body.scrollTop));
  },

  stop: function(event) {
    if (event.preventDefault) {
      event.preventDefault();
      event.stopPropagation();
    } else {
      event.returnValue = false;
      event.cancelBubble = true;
    }
  },

  // find the first node with the given tagName, starting from the
  // node the event was triggered on; traverses the DOM upwards
  findElement: function(event, tagName) {
    var element = OpenLayers.Event.element(event);
    while (element.parentNode && (!element.tagName ||
        (element.tagName.toUpperCase() != tagName.toUpperCase())))
      element = element.parentNode;
    return element;
  },

  observers: false,

  _observeAndCache: function(element, name, observer, useCapture) {
    if (!this.observers) this.observers = [];
    if (element.addEventListener) {
      this.observers.push([element, name, observer, useCapture]);
      element.addEventListener(name, observer, useCapture);
    } else if (element.attachEvent) {
      this.observers.push([element, name, observer, useCapture]);
      element.attachEvent('on' + name, observer);
    }
  },

  unloadCache: function() {
    if (!OpenLayers.Event.observers) return;
    for (var i = 0; i < OpenLayers.Event.observers.length; i++) {
      OpenLayers.Event.stopObserving.apply(this, OpenLayers.Event.observers[i]);
      OpenLayers.Event.observers[i][0] = null;
    }
    OpenLayers.Event.observers = false;
  },

  observe: function(elementParam, name, observer, useCapture) {
    var element = $(elementParam);
    useCapture = useCapture || false;

    if (name == 'keypress' &&
        (navigator.appVersion.match(/Konqueror|Safari|KHTML/)
        || element.attachEvent))
      name = 'keydown';

    this._observeAndCache(element, name, observer, useCapture);
  },

  stopObserving: function(elementParam, name, observer, useCapture) {
    var element = $(elementParam);
    useCapture = useCapture || false;

    if (name == 'keypress' &&
        (navigator.appVersion.match(/Konqueror|Safari|KHTML/)
        || element.detachEvent))
      name = 'keydown';

    if (element.removeEventListener) {
      element.removeEventListener(name, observer, useCapture);
    } else if (element.detachEvent) {
      element.detachEvent('on' + name, observer);
    }
  }
};
/* prevent memory leaks in IE */
OpenLayers.Event.observe(window, 'unload', OpenLayers.Event.unloadCache, false);

if (window.Event) {
  OpenLayers.Util.extend(window.Event, OpenLayers.Event);
} else {
  var Event = OpenLayers.Event;
}

/**
 * @class
 */
OpenLayers.Events = OpenLayers.Class.create();
OpenLayers.Events.prototype = {

    /** @final @type Array: supported events */
    BROWSER_EVENTS: [
        "mouseover", "mouseout",
        "mousedown", "mouseup", "mousemove",
        "click", "dblclick",
        "resize", "focus", "blur"
    ],

    /** Hashtable of Array(Function): events listener functions
     * @type Object */
    listeners: null,

    /** @type Object: the code object issuing application events */
    object: null,

    /** @type DOMElement: the DOM element receiving browser events */
    element: null,

    /** @type Array: list of support application events */
    eventTypes: null,

    /**
     * @constructor
     *
     * @param {OpenLayers.Map} object The js object to which this Events object
     *                                is being added
     * @param {DOMElement} element A dom element to respond to browser events
     * @param {Array} eventTypes Array of custom application events
     * @param {Boolean} fallThrough Allow events to fall through after these
     *                              have been handled?
     */
    initialize: function (object, element, eventTypes, fallThrough) {
        this.object     = object;
        this.element    = element;
        this.eventTypes = eventTypes;
        this.fallThrough = fallThrough;
        this.listeners  = new Object();

        // if eventTypes is specified, create a listeners list for each
        // custom application event.
        if (this.eventTypes != null)
            for (var i = 0; i < this.eventTypes.length; i++)
                this.listeners[ this.eventTypes[i] ] = new Array();

        // if a dom element is specified, add a listeners list
        // for browser events on the element and register them
        if (this.element != null)
            this.attachToElement(element);
    },

    /**
    * @param {HTMLDOMElement} element a DOM element to attach browser events to
    */
    attachToElement: function (element) {
        for (var i = 0; i < this.BROWSER_EVENTS.length; i++) {
            var eventType = this.BROWSER_EVENTS[i];

            // every browser event has a corresponding application event
            // (whether it's listened for or not).
            if (this.listeners[eventType] == null)
                this.listeners[eventType] = new Array();

            // use Prototype to register the event cross-browser
            OpenLayers.Event.observe(element, eventType,
                this.handleBrowserEvent.bindAsEventListener(this));
        }
        // disable dragstart in IE so that mousedown/move/up works normally
        OpenLayers.Event.observe(element, "dragstart", OpenLayers.Event.stop);
    },

    /**
     * @param {String} type Name of the event to register
     * @param {Object} obj The object to bind the context to for the callback#.
     *                     If no object is specified, default is the Events's
     *                     'object' property.
     * @param {Function} func The callback function. If no callback is
     *                        specified, this function does nothing.
     *
     * #When the event is triggered, the 'func' function will be called, in the
     *   context of 'obj'. Imagine we were to register an event, specifying an
     *   OpenLayers.Bounds Object as 'obj'. When the event is triggered, the
     *   context in the callback function will be our Bounds object. This means
     *   that within our callback function, we can access the properties and
     *   methods of the Bounds object through the "this" variable. So our
     *   callback could execute something like:
     *
     *     leftStr = "Left: " + this.left;
     *
     *                   or
     *
     *     centerStr = "Center: " + this.getCenterLonLat();
     *
     */
    register: function (type, obj, func) {

        if (func != null) {
            if (obj == null)  {
                obj = this.object;
            }
            var listeners = this.listeners[type];
            if (listeners != null) {
                listeners.push( {obj: obj, func: func} );
            }
        }
    },

    /**
     * @param {String} type
     * @param {Object} obj If none specified, defaults to this.object
     * @param {Function} func
     */
    unregister: function (type, obj, func) {
        if (obj == null)  {
            obj = this.object;
        }
        var listeners = this.listeners[type];
        if (listeners != null) {
            for (var i = 0; i < listeners.length; i++) {
                if (listeners[i].obj == obj && listeners[i].func == func) {
                    listeners.splice(i, 1);
                    break;
                }
            }
        }
    },

    /** Remove all listeners for a given event type. If type is not registered,
     *   does nothing.
     *
     * @param {String} type
     */
    remove: function(type) {
        if (this.listeners[type] != null) {
            this.listeners[type] = new Array();
        }
    },

    /** Trigger a specified registered event
     *
     * @param {String} type
     * @param {Event} evt
     */
    triggerEvent: function (type, evt) {

        // prep evt object with object & div references
        if (evt == null) {
            evt = new Object();
        }
        evt.object = this.object;
        evt.element = this.element;

        // execute all callbacks registered for specified type
        var listeners = this.listeners[type];
        if ((listeners != null) && (listeners.length > 0)) {
            for (var i = 0; i < listeners.length; i++) {
                var callback = listeners[i];
                var continueChain;
                if (callback.obj != null) {
                    // use the 'call' method to bind the context to callback.obj
                    continueChain = callback.func.call(callback.obj, evt);
                } else {
                    continueChain = callback.func(evt);
                }

                if ((continueChain != null) && (continueChain == false)) {
                    // if callback returns false, execute no more callbacks.
                    break;
                }
            }
            // don't fall through to other DOM elements
            if (!this.fallThrough) {
                OpenLayers.Util.safeStopPropagation(evt);
            }
        }
    },

    /** Basically just a wrapper to the triggerEvent() function, but takes
     *   care to set a property 'xy' on the event with the current mouse
     *   position.
     *
     * @private
     *
     * @param {Event} evt
     */
    handleBrowserEvent: function (evt) {
        evt.xy = this.getMousePosition(evt);
        this.triggerEvent(evt.type, evt)
    },

    /**
     * @private
     *
     * @param {Event} evt
     *
     * @returns The current xy coordinate of the mouse, adjusted for offsets
     * @type OpenLayers.Pixel
     */
    getMousePosition: function (evt) {
        if (!this.element.offsets) {
            this.element.offsets = OpenLayers.Util.pagePosition(this.element);
        }
        return new OpenLayers.Pixel(
            (evt.clientX + (document.documentElement.scrollLeft
                         || document.body.scrollLeft)) - this.element.offsets[0],
            (evt.clientY + (document.documentElement.scrollTop
                         || document.body.scrollTop)) - this.element.offsets[1]
        );
    },

    /** @final @type String */
    CLASS_NAME: "OpenLayers.Events"
};
<|endoftext|>


<commit_before>#!/usr/bin/env node

/*
	MIT License http://www.opensource.org/licenses/mit-license.php
	Author Tobias Koppers @sokra
*/
var path = require("path");
// Local version replace global one
try {
	var localWebpack = require.resolve(path.join(process.cwd(), "node_modules", "webpack", "bin", "webpack.js"));
	if(__filename !== localWebpack) {
		return require(localWebpack);
	}
} catch(e) {}
var yargs = require("yargs")
	.usage("webpack " + require("../package.json").version + "\n" +
		"Usage: https://webpack.github.io/docs/cli.html\n" +
		"Usage without config file: webpack <entry> [<entry>] <output>\n" +
		"Usage with config file: webpack");

require("./config-yargs")(yargs);

var DISPLAY_GROUP = "Stats options:";
var BASIC_GROUP = "Basic options:";

yargs.options({
	"json": {
		type: "boolean",
		alias: "j",
		describe: "Prints the result as JSON."
	},
	"progress": {
		type: "boolean",
		describe: "Print compilation progress in percentage",
		group: BASIC_GROUP
	},
	"color": {
		type: "boolean",
		alias: "colors",
		default: function supportsColor() {
			return require("supports-color");
		},
		group: DISPLAY_GROUP,
		describe: "Enables/Disables colors on the console"
	},
	"sort-modules-by": {
		type: "string",
		group: DISPLAY_GROUP,
		describe: "Sorts the modules list by property in module"
	},
	"sort-chunks-by": {
		type: "string",
		group: DISPLAY_GROUP,
		describe: "Sorts the chunks list by property in chunk"
	},
	"sort-assets-by": {
		type: "string",
		group: DISPLAY_GROUP,
		describe: "Sorts the assets list by property in asset"
	},
	"hide-modules": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Hides info about modules"
	},
	"display-exclude": {
		type: "string",
		group: DISPLAY_GROUP,
		describe: "Exclude modules in the output"
	},
	"display-modules": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display even excluded modules in the output"
	},
	"display-max-modules": {
		type: "number",
		group: DISPLAY_GROUP,
		describe: "Sets the maximum number of visible modules in output"
	},
	"display-chunks": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display chunks in the output"
	},
	"display-entrypoints": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display entry points in the output"
	},
	"display-origins": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display origins of chunks in the output"
	},
	"display-cached": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display also cached modules in the output"
	},
	"display-cached-assets": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display also cached assets in the output"
	},
	"display-reasons": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display reasons about module inclusion in the output"
	},
	"display-depth": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display distance from entry point for each module"
	},
	"display-used-exports": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display information about used exports in modules (Tree Shaking)"
	},
	"display-provided-exports": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display information about exports provided from modules"
	},
	"display-error-details": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display details about errors"
	},
	"verbose": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Show more details"
	}
});

var argv = yargs.argv;

if(argv.verbose) {
	argv["display-reasons"] = true;
	argv["display-depth"] = true;
	argv["display-entrypoints"] = true;
	argv["display-used-exports"] = true;
	argv["display-provided-exports"] = true;
	argv["display-error-details"] = true;
	argv["display-modules"] = true;
	argv["display-cached"] = true;
	argv["display-cached-assets"] = true;
}

var options = require("./convert-argv")(yargs, argv);

function ifArg(name, fn, init) {
	if(Array.isArray(argv[name])) {
		if(init) init();
		argv[name].forEach(fn);
	} else if(typeof argv[name] !== "undefined") {
		if(init) init();
		fn(argv[name], -1);
	}
}

function processOptions(options) {
	// process Promise
	if(typeof options.then === "function") {
		options.then(processOptions).catch(function(err) {
			console.error(err.stack || err);
			process.exit(1); // eslint-disable-line
		});
		return;
	}

	var firstOptions = [].concat(options)[0];
	var statsPresetToOptions = require("../lib/Stats.js").presetToOptions;

	var outputOptions = options.stats;
	if(typeof outputOptions === "boolean" || typeof outputOptions === "string")
		outputOptions = statsPresetToOptions(outputOptions);
	else
		outputOptions = {};
	outputOptions = Object.create(outputOptions);
	if(Array.isArray(options) && !outputOptions.children) {
		outputOptions.children = options.map(o => o.stats);
	}
	if(typeof outputOptions.context === "undefined")
		outputOptions.context = firstOptions.context;

	ifArg("json", function(bool) {
		if(bool)
			outputOptions.json = bool;
	});

	if(typeof outputOptions.colors === "undefined")
		outputOptions.colors = require("supports-color");

	ifArg("sort-modules-by", function(value) {
		outputOptions.modulesSort = value;
	});

	ifArg("sort-chunks-by", function(value) {
		outputOptions.chunksSort = value;
	});

	ifArg("sort-assets-by", function(value) {
		outputOptions.assetsSort = value;
	});

	ifArg("display-exclude", function(value) {
		outputOptions.exclude = value;
	});

	if(!outputOptions.json) {
		if(typeof outputOptions.cached === "undefined")
			outputOptions.cached = false;
		if(typeof outputOptions.cachedAssets === "undefined")
			outputOptions.cachedAssets = false;

		ifArg("display-chunks", function(bool) {
			outputOptions.modules = !bool;
			outputOptions.chunks = bool;
		});

		ifArg("display-entrypoints", function(bool) {
			outputOptions.entrypoints = bool;
		});

		ifArg("display-reasons", function(bool) {
			outputOptions.reasons = bool;
		});

		ifArg("display-depth", function(bool) {
			outputOptions.depth = bool;
		});

		ifArg("display-used-exports", function(bool) {
			outputOptions.usedExports = bool;
		});

		ifArg("display-provided-exports", function(bool) {
			outputOptions.providedExports = bool;
		});

		ifArg("display-error-details", function(bool) {
			outputOptions.errorDetails = bool;
		});

		ifArg("display-origins", function(bool) {
			outputOptions.chunkOrigins = bool;
		});

		ifArg("display-max-modules", function(value) {
			outputOptions.maxModules = value;
		});

		ifArg("display-cached", function(bool) {
			if(bool)
				outputOptions.cached = true;
		});

		ifArg("display-cached-assets", function(bool) {
			if(bool)
				outputOptions.cachedAssets = true;
		});

		if(!outputOptions.exclude)
			outputOptions.exclude = ["node_modules", "bower_components", "jam", "components"];

		if(argv["display-modules"]) {
			outputOptions.maxModules = Infinity;
			outputOptions.exclude = undefined;
		}
	} else {
		if(typeof outputOptions.chunks === "undefined")
			outputOptions.chunks = true;
		if(typeof outputOptions.entrypoints === "undefined")
			outputOptions.entrypoints = true;
		if(typeof outputOptions.modules === "undefined")
			outputOptions.modules = true;
		if(typeof outputOptions.chunkModules === "undefined")
			outputOptions.chunkModules = true;
		if(typeof outputOptions.reasons === "undefined")
			outputOptions.reasons = true;
		if(typeof outputOptions.cached === "undefined")
			outputOptions.cached = true;
		if(typeof outputOptions.cachedAssets === "undefined")
			outputOptions.cachedAssets = true;
	}

	ifArg("hide-modules", function(bool) {
		if(bool) {
			outputOptions.modules = false;
			outputOptions.chunkModules = false;
		}
	});

	var webpack = require("../lib/webpack.js");

	Error.stackTraceLimit = 30;
	var lastHash = null;
	var compiler;
	try {
		compiler = webpack(options);
	} catch(e) {
		var WebpackOptionsValidationError = require("../lib/WebpackOptionsValidationError");
		if(e instanceof WebpackOptionsValidationError) {
			if(argv.color)
				console.error("\u001b[1m\u001b[31m" + e.message + "\u001b[39m\u001b[22m");
			else
				console.error(e.message);
			process.exit(1); // eslint-disable-line no-process-exit
		}
		throw e;
	}

	if(argv.progress) {
		var ProgressPlugin = require("../lib/ProgressPlugin");
		compiler.apply(new ProgressPlugin({
			profile: argv.profile
		}));
	}

	function compilerCallback(err, stats) {
		if(!options.watch || err) {
			// Do not keep cache anymore
			compiler.purgeInputFileSystem();
		}
		if(err) {
			lastHash = null;
			console.error(err.stack || err);
			if(err.details) console.error(err.details);
			process.exit(1); // eslint-disable-line
		}
		if(outputOptions.json) {
			process.stdout.write(JSON.stringify(stats.toJson(outputOptions), null, 2) + "\n");
		} else if(stats.hash !== lastHash) {
			lastHash = stats.hash;
			process.stdout.write(stats.toString(outputOptions) + "\n");
		}
		if(!options.watch && stats.hasErrors()) {
			process.on("exit", function() {
				process.exit(2); // eslint-disable-line
			});
		}
	}
	if(options.watch) {
		var primaryOptions = !Array.isArray(options) ? options : options[0];
		var watchOptions = primaryOptions.watchOptions || primaryOptions.watch || {};
		if(watchOptions.stdin) {
			process.stdin.on("end", function() {
				process.exit(0); // eslint-disable-line
			});
			process.stdin.resume();
		}
		compiler.watch(watchOptions, compilerCallback);
		console.log("\nWebpack is watching the files…\n");
	} else
		compiler.run(compilerCallback);

}

processOptions(options);
<commit_msg>Fix watch when config is an array of objects<commit_after>#!/usr/bin/env node

/*
	MIT License http://www.opensource.org/licenses/mit-license.php
	Author Tobias Koppers @sokra
*/
var path = require("path");
// Local version replace global one
try {
	var localWebpack = require.resolve(path.join(process.cwd(), "node_modules", "webpack", "bin", "webpack.js"));
	if(__filename !== localWebpack) {
		return require(localWebpack);
	}
} catch(e) {}
var yargs = require("yargs")
	.usage("webpack " + require("../package.json").version + "\n" +
		"Usage: https://webpack.github.io/docs/cli.html\n" +
		"Usage without config file: webpack <entry> [<entry>] <output>\n" +
		"Usage with config file: webpack");

require("./config-yargs")(yargs);

var DISPLAY_GROUP = "Stats options:";
var BASIC_GROUP = "Basic options:";

yargs.options({
	"json": {
		type: "boolean",
		alias: "j",
		describe: "Prints the result as JSON."
	},
	"progress": {
		type: "boolean",
		describe: "Print compilation progress in percentage",
		group: BASIC_GROUP
	},
	"color": {
		type: "boolean",
		alias: "colors",
		default: function supportsColor() {
			return require("supports-color");
		},
		group: DISPLAY_GROUP,
		describe: "Enables/Disables colors on the console"
	},
	"sort-modules-by": {
		type: "string",
		group: DISPLAY_GROUP,
		describe: "Sorts the modules list by property in module"
	},
	"sort-chunks-by": {
		type: "string",
		group: DISPLAY_GROUP,
		describe: "Sorts the chunks list by property in chunk"
	},
	"sort-assets-by": {
		type: "string",
		group: DISPLAY_GROUP,
		describe: "Sorts the assets list by property in asset"
	},
	"hide-modules": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Hides info about modules"
	},
	"display-exclude": {
		type: "string",
		group: DISPLAY_GROUP,
		describe: "Exclude modules in the output"
	},
	"display-modules": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display even excluded modules in the output"
	},
	"display-max-modules": {
		type: "number",
		group: DISPLAY_GROUP,
		describe: "Sets the maximum number of visible modules in output"
	},
	"display-chunks": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display chunks in the output"
	},
	"display-entrypoints": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display entry points in the output"
	},
	"display-origins": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display origins of chunks in the output"
	},
	"display-cached": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display also cached modules in the output"
	},
	"display-cached-assets": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display also cached assets in the output"
	},
	"display-reasons": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display reasons about module inclusion in the output"
	},
	"display-depth": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display distance from entry point for each module"
	},
	"display-used-exports": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display information about used exports in modules (Tree Shaking)"
	},
	"display-provided-exports": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display information about exports provided from modules"
	},
	"display-error-details": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Display details about errors"
	},
	"verbose": {
		type: "boolean",
		group: DISPLAY_GROUP,
		describe: "Show more details"
	}
});

var argv = yargs.argv;

if(argv.verbose) {
	argv["display-reasons"] = true;
	argv["display-depth"] = true;
	argv["display-entrypoints"] = true;
	argv["display-used-exports"] = true;
	argv["display-provided-exports"] = true;
	argv["display-error-details"] = true;
	argv["display-modules"] = true;
	argv["display-cached"] = true;
	argv["display-cached-assets"] = true;
}

var options = require("./convert-argv")(yargs, argv);

function ifArg(name, fn, init) {
	if(Array.isArray(argv[name])) {
		if(init) init();
		argv[name].forEach(fn);
	} else if(typeof argv[name] !== "undefined") {
		if(init) init();
		fn(argv[name], -1);
	}
}

function processOptions(options) {
	// process Promise
	if(typeof options.then === "function") {
		options.then(processOptions).catch(function(err) {
			console.error(err.stack || err);
			process.exit(1); // eslint-disable-line
		});
		return;
	}

	var firstOptions = [].concat(options)[0];
	var statsPresetToOptions = require("../lib/Stats.js").presetToOptions;

	var outputOptions = options.stats;
	if(typeof outputOptions === "boolean" || typeof outputOptions === "string")
		outputOptions = statsPresetToOptions(outputOptions);
	else
		outputOptions = {};
	outputOptions = Object.create(outputOptions);
	if(Array.isArray(options) && !outputOptions.children) {
		outputOptions.children = options.map(o => o.stats);
	}
	if(typeof outputOptions.context === "undefined")
		outputOptions.context = firstOptions.context;

	ifArg("json", function(bool) {
		if(bool)
			outputOptions.json = bool;
	});

	if(typeof outputOptions.colors === "undefined")
		outputOptions.colors = require("supports-color");

	ifArg("sort-modules-by", function(value) {
		outputOptions.modulesSort = value;
	});

	ifArg("sort-chunks-by", function(value) {
		outputOptions.chunksSort = value;
	});

	ifArg("sort-assets-by", function(value) {
		outputOptions.assetsSort = value;
	});

	ifArg("display-exclude", function(value) {
		outputOptions.exclude = value;
	});

	if(!outputOptions.json) {
		if(typeof outputOptions.cached === "undefined")
			outputOptions.cached = false;
		if(typeof outputOptions.cachedAssets === "undefined")
			outputOptions.cachedAssets = false;

		ifArg("display-chunks", function(bool) {
			outputOptions.modules = !bool;
			outputOptions.chunks = bool;
		});

		ifArg("display-entrypoints", function(bool) {
			outputOptions.entrypoints = bool;
		});

		ifArg("display-reasons", function(bool) {
			outputOptions.reasons = bool;
		});

		ifArg("display-depth", function(bool) {
			outputOptions.depth = bool;
		});

		ifArg("display-used-exports", function(bool) {
			outputOptions.usedExports = bool;
		});

		ifArg("display-provided-exports", function(bool) {
			outputOptions.providedExports = bool;
		});

		ifArg("display-error-details", function(bool) {
			outputOptions.errorDetails = bool;
		});

		ifArg("display-origins", function(bool) {
			outputOptions.chunkOrigins = bool;
		});

		ifArg("display-max-modules", function(value) {
			outputOptions.maxModules = value;
		});

		ifArg("display-cached", function(bool) {
			if(bool)
				outputOptions.cached = true;
		});

		ifArg("display-cached-assets", function(bool) {
			if(bool)
				outputOptions.cachedAssets = true;
		});

		if(!outputOptions.exclude)
			outputOptions.exclude = ["node_modules", "bower_components", "jam", "components"];

		if(argv["display-modules"]) {
			outputOptions.maxModules = Infinity;
			outputOptions.exclude = undefined;
		}
	} else {
		if(typeof outputOptions.chunks === "undefined")
			outputOptions.chunks = true;
		if(typeof outputOptions.entrypoints === "undefined")
			outputOptions.entrypoints = true;
		if(typeof outputOptions.modules === "undefined")
			outputOptions.modules = true;
		if(typeof outputOptions.chunkModules === "undefined")
			outputOptions.chunkModules = true;
		if(typeof outputOptions.reasons === "undefined")
			outputOptions.reasons = true;
		if(typeof outputOptions.cached === "undefined")
			outputOptions.cached = true;
		if(typeof outputOptions.cachedAssets === "undefined")
			outputOptions.cachedAssets = true;
	}

	ifArg("hide-modules", function(bool) {
		if(bool) {
			outputOptions.modules = false;
			outputOptions.chunkModules = false;
		}
	});

	var webpack = require("../lib/webpack.js");

	Error.stackTraceLimit = 30;
	var lastHash = null;
	var compiler;
	try {
		compiler = webpack(options);
	} catch(e) {
		var WebpackOptionsValidationError = require("../lib/WebpackOptionsValidationError");
		if(e instanceof WebpackOptionsValidationError) {
			if(argv.color)
				console.error("\u001b[1m\u001b[31m" + e.message + "\u001b[39m\u001b[22m");
			else
				console.error(e.message);
			process.exit(1); // eslint-disable-line no-process-exit
		}
		throw e;
	}

	if(argv.progress) {
		var ProgressPlugin = require("../lib/ProgressPlugin");
		compiler.apply(new ProgressPlugin({
			profile: argv.profile
		}));
	}

	function compilerCallback(err, stats) {
		if(!options.watch || err) {
			// Do not keep cache anymore
			compiler.purgeInputFileSystem();
		}
		if(err) {
			lastHash = null;
			console.error(err.stack || err);
			if(err.details) console.error(err.details);
			process.exit(1); // eslint-disable-line
		}
		if(outputOptions.json) {
			process.stdout.write(JSON.stringify(stats.toJson(outputOptions), null, 2) + "\n");
		} else if(stats.hash !== lastHash) {
			lastHash = stats.hash;
			process.stdout.write(stats.toString(outputOptions) + "\n");
		}
		if(!options.watch && stats.hasErrors()) {
			process.on("exit", function() {
				process.exit(2); // eslint-disable-line
			});
		}
	}
	if(firstOptions.watch) {
		var watchOptions = firstOptions.watchOptions || firstOptions.watch || {};
		if(watchOptions.stdin) {
			process.stdin.on("end", function() {
				process.exit(0); // eslint-disable-line
			});
			process.stdin.resume();
		}
		compiler.watch(watchOptions, compilerCallback);
		console.log("\nWebpack is watching the files…\n");
	} else
		compiler.run(compilerCallback);

}

processOptions(options);
<|endoftext|>


<commit_before><commit_msg>refactor(www): convert SimpleEvaluationTable to function component (#24834)<commit_after><|endoftext|>


<commit_before>/**
 * @copyright Prometheus Research, LLC 2014
 */
'use strict';

var React           = require('react/addons');
var PropTypes       = React.PropTypes;
var cx              = React.addons.classSet;
var Label           = require('./Label');
var Element         = require('./Element');
var FormPropTypes   = require('./PropTypes');
var emptyFunction   = require('./emptyFunction');
var cloneElement    = require('./cloneElement');
var defaultValue    = require('./defaultValue');

var Item = React.createClass({

  render() {
    var {className, ...props} = this.props;
    return (
      <div {...props} className={cx('rf-RepeatingFieldset__item', className)}>
        {this.props.children}
        <button
          onClick={this.props.onRemove}
          type="button"
          className="rf-RepeatingFieldset__remove">×</button>
      </div>
    );
  }
});

/**
 * A component which renders values which correspond to List schema node.
 */
var RepeatingFieldset = React.createClass({

  propTypes: {
    value: FormPropTypes.Value,
    onAdd: PropTypes.func,
    onRemove: PropTypes.func,
    label: PropTypes.string,
    noLabel: PropTypes.bool,
    hint: PropTypes.string,
    noAddButton: PropTypes.bool
  },

  render() {
    var {item: Item, value, className, noLabel, ...props} = this.props;
    return (
      <div {...props} className={cx('rf-RepeatingFieldset', className)}>
        {!noLabel &&
          <Label
            className="rf-RepeatingFieldset__label"
            label={this.props.label || value.node.props.get('label')}
            hint={this.props.hint || value.node.props.get('hint')}
            />}
        {value.map((value, key) => {
          var onRemove = this.onRemove.bind(null, key);
          var children = <Element className="rf-RepeatingFieldset__child" value={value} />;
          return React.isValidElement(Item) ?
            cloneElement(
              Item,
              {key, onRemove, children, index: key, ref: key}
            ) :
            <Item key={key} ref={key} index={key} onRemove={onRemove}>{children}</Item>;
        })}
        {!this.props.noAddButton &&
          <button
            type="button"
            onClick={this.onAdd}
            className="rf-RepeatingFieldset__add">
            Add
          </button>}
      </div>
    );
  },

  getDefaultProps() {
    return {
      item: Item,
      onAdd: emptyFunction,
      onRemove: emptyFunction,
      noAddButton: false
    };
  },

  onAdd() {
    var newIdx = this.props.value.size;
    var valueToAdd = defaultValue(this.props.value.node.get(newIdx));
    this.props.value.transform(value => value.push(valueToAdd)).notify();
    this.props.onAdd();
  },

  onRemove(index) {
    this.props.value.transform(value => value.splice(index, 1)).notify();
    this.props.onRemove(index);
  },

  getItemByIndex(index) {
    return this.refs[index];
  }

});

module.exports = RepeatingFieldset;
module.exports.Item = Item;
<commit_msg><RepeatingFieldset />: do not pass "own props" down<commit_after>/**
 * @copyright Prometheus Research, LLC 2014
 */
'use strict';

var React           = require('react/addons');
var PropTypes       = React.PropTypes;
var cx              = React.addons.classSet;
var Label           = require('./Label');
var Element         = require('./Element');
var FormPropTypes   = require('./PropTypes');
var emptyFunction   = require('./emptyFunction');
var cloneElement    = require('./cloneElement');
var defaultValue    = require('./defaultValue');

var Item = React.createClass({

  render() {
    var {className, ...props} = this.props;
    return (
      <div {...props} className={cx('rf-RepeatingFieldset__item', className)}>
        {this.props.children}
        <button
          onClick={this.props.onRemove}
          type="button"
          className="rf-RepeatingFieldset__remove">×</button>
      </div>
    );
  }
});

/**
 * A component which renders values which correspond to List schema node.
 */
var RepeatingFieldset = React.createClass({

  propTypes: {
    value: FormPropTypes.Value,
    onAdd: PropTypes.func,
    onRemove: PropTypes.func,
    label: PropTypes.string,
    noLabel: PropTypes.bool,
    hint: PropTypes.string,
    noAddButton: PropTypes.bool
  },

  render() {
    var {
      item: Item, value, className, noAddButton,
      onAdd, onRemove, noLabel, label, hint, ...props
    } = this.props;
    return (
      <div {...props} className={cx('rf-RepeatingFieldset', className)}>
        {!noLabel &&
          <Label
            className="rf-RepeatingFieldset__label"
            label={label || value.node.props.get('label')}
            hint={hint || value.node.props.get('hint')}
            />}
        {value.map((value, key) => {
          var onRemove = this.onRemove.bind(null, key);
          var children = <Element className="rf-RepeatingFieldset__child" value={value} />;
          return React.isValidElement(Item) ?
            cloneElement(
              Item,
              {key, onRemove, children, index: key, ref: key}
            ) :
            <Item key={key} ref={key} index={key} onRemove={onRemove}>{children}</Item>;
        })}
        {!noAddButton &&
          <button
            type="button"
            onClick={this.onAdd}
            className="rf-RepeatingFieldset__add">
            Add
          </button>}
      </div>
    );
  },

  getDefaultProps() {
    return {
      item: Item,
      onAdd: emptyFunction,
      onRemove: emptyFunction,
      noAddButton: false
    };
  },

  onAdd() {
    var newIdx = this.props.value.size;
    var valueToAdd = defaultValue(this.props.value.node.get(newIdx));
    this.props.value.transform(value => value.push(valueToAdd)).notify();
    this.props.onAdd();
  },

  onRemove(index) {
    this.props.value.transform(value => value.splice(index, 1)).notify();
    this.props.onRemove(index);
  },

  getItemByIndex(index) {
    return this.refs[index];
  }

});

module.exports = RepeatingFieldset;
module.exports.Item = Item;
<|endoftext|>