Commit cf6558ee authored by andrew's avatar andrew

Merge branch 'develop' into 'master'

Develop

See merge request sf/cm-frontend-lib!55
parents 5177721d 6230c197
Pipeline #4837 failed with stage
in 1 minute and 22 seconds
......@@ -53,8 +53,4 @@ CM.MUI = {
CM.React = React;
CM.ReactDOM = ReactDOM;
//needed for material-ui
var injectTapEventPlugin = require('react-tap-event-plugin');
injectTapEventPlugin();
window.CMBooking = CM;
......@@ -4,7 +4,6 @@
import React from 'react';
import ReactDOM from 'react-dom';
import injectTapEventPlugin from 'react-tap-event-plugin';
import Form from './form/form';
import View from './views/basic.view';
import Input from './form/form.input';
......@@ -48,7 +47,4 @@ if (!window.ReactDOM) {
window.ReactDOM = ReactDOM;
}
//needed for material-ui
injectTapEventPlugin();
export default UI;
export default UI;
\ No newline at end of file
/*global CM, require, $*/
'use strict';
var HomeModule = require('./modules/home/home.module');
var FormModule = require('./modules/form/form.module');
var GridModule = require('./modules/table/table.module');
var TabsModule = require('./modules/tabsview/tabs.module');
var FlexboxModule = require('./modules/flexbox/flexbox.module');
var AuthModel = {
getAuthinicationHeaders: function(){
import HomeModule from './modules/home/home.module';
import FormModule from './modules/form/form.module';
import GridModule from'./modules/table/table.module';
import TabsModule from './modules/tabsview/tabs.module';
import FlexboxModule from './modules/flexbox/flexbox.module';
const AuthModel = {
getAuthinicationHeaders(){
return {
'Authorization': '123'
};
},
isAuthinicated: function(path) {
isAuthinicated(path) {
CM.log('isAuthinicated ' + path);
return false;
},
isAdmin: function() {
isAdmin() {
return true;
}
};
......
/*global module, CM, require*/
'use strict';
var $ = require('jquery');
var ReactTestFlexboxComponent = require('./views/flexbox.test.jsx');
var FlexboxModule = CM.Module.extend({
import $ from 'jquery';
import ReactTestFlexboxComponent from './views/flexbox.test.jsx';
const FlexboxModule = CM.Module.extend({
/**
* object that will be passed to React component as property like models, collections and etc.
......@@ -34,4 +34,4 @@ var FlexboxModule = CM.Module.extend({
});
module.exports = FlexboxModule;
\ No newline at end of file
export default FlexboxModule;
\ No newline at end of file
/*global React*/
'use strict';
var ReactTestFlexboxComponent = React.createClass({
const ReactTestFlexboxComponent = () => {
render: function () {
return (
<div>
return (
<div>
<CM.UI.Flexbox.Box className='container' data-ast-name='some name'>
<CM.UI.Flexbox.Item className='item'>
<CM.UI.Flexbox.Box className='container' data-ast-name='some name'>
<CM.UI.Flexbox.Item className='item'>
</CM.UI.Flexbox.Item>
<CM.UI.Flexbox.Item className='item'>
</CM.UI.Flexbox.Item>
<CM.UI.Flexbox.Item className='item'>
</CM.UI.Flexbox.Item>
<CM.UI.Flexbox.Item className='item'>
</CM.UI.Flexbox.Item>
<CM.UI.Flexbox.Item className='item'>
</CM.UI.Flexbox.Item>
<CM.UI.Flexbox.Item className='item'>
</CM.UI.Flexbox.Item>
<CM.UI.Flexbox.Item className='item'>
</CM.UI.Flexbox.Item>
</CM.UI.Flexbox.Box>
</CM.UI.Flexbox.Item>
</CM.UI.Flexbox.Box>
</div>
);
};
</div>
);
}
});
module.exports = ReactTestFlexboxComponent;
\ No newline at end of file
export default ReactTestFlexboxComponent;
\ No newline at end of file
......@@ -2,9 +2,10 @@
'use strict';
var $ = require('jquery');
var ReactTestFormComponent = require('./views/form.test.jsx');
var FormModule = CM.Module.extend({
import $ from 'jquery';
import ReactTestFormComponent from './views/form.test.jsx';
const FormModule = CM.Module.extend({
componentOptions: {
messageComponentProps: {
......@@ -28,14 +29,14 @@ var FormModule = CM.Module.extend({
}],
el: function() {
el() {
return $('.content').get(0);
},
initialize: function () {
initialize() {
}
});
module.exports = FormModule;
\ No newline at end of file
export default FormModule;
\ No newline at end of file
......@@ -2,13 +2,13 @@
'use strict';
var ItemModel = CM.models.AbstractModel.extend({
const ItemModel = CM.models.AbstractModel.extend({
idAttribute: 'itemId',
url: function() {
var url = '/api/item',
url() {
let url = '/api/item',
id = this.get('id');
url = id ? url + '/' + id : url;
......@@ -19,30 +19,30 @@ var ItemModel = CM.models.AbstractModel.extend({
* isEditable - set editable inputs elements in the form
* @return {Boolean}
*/
isEditable: function () {
isEditable() {
return true;
},
defaults: {
'name': null,
'address': null,
'email': null
'name': '',
'address': '',
'email': ''
},
validators: {
name: function(value) {
name(value) {
if (this.isEmptyValue(value)){
return 'wrong name';
}
},
address: function(value) {
address(value) {
if (this.isEmptyValue(value)){
return 'wrong address';
}
},
email: function(value) {
email(value) {
if (!this.isEmailValid(value)){
return 'wrong email';
......@@ -53,4 +53,4 @@ var ItemModel = CM.models.AbstractModel.extend({
});
module.exports = ItemModel;
\ No newline at end of file
export default ItemModel;
\ No newline at end of file
......@@ -2,13 +2,13 @@
'use strict';
var ItemModel = CM.models.AbstractModel.extend({
const UserModel = CM.models.AbstractModel.extend({
idAttribute: 'id',
url: function() {
var url = '/api/user',
url() {
let url = '/api/user',
id = this.get('id');
url = id ? url + '/' + id : url;
......@@ -19,30 +19,30 @@ var ItemModel = CM.models.AbstractModel.extend({
* isEditable - set editable inputs elements in the form
* @return {Boolean}
*/
isEditable: function () {
isEditable() {
return true;
},
defaults: {
'name': null,
'address': null,
'email': null
'name': '',
'address': '',
'email': ''
},
validators: {
name: function(value) {
name(value) {
if (this.isEmptyValue(value)){
return 'wrong name';
}
},
address: function(value) {
address(value) {
if (this.isEmptyValue(value)){
return 'wrong address';
}
},
phone: function(value) {
phone(value) {
if (this.isEmptyValue(value)){
return 'wrong phone';
......@@ -52,7 +52,7 @@ var ItemModel = CM.models.AbstractModel.extend({
return 'invalid phone';
}
},
email: function(value) {
email(value) {
if (!this.isEmailValid(value)){
return 'wrong email';
......@@ -61,4 +61,4 @@ var ItemModel = CM.models.AbstractModel.extend({
}
});
module.exports = ItemModel;
\ No newline at end of file
export default UserModel;
\ No newline at end of file
/*global require, React, Backbone */
'use strict';
var UserModel = require('./../models/user.model');
var ReactTestFormComponent = React.createClass({
import UserModel from './../models/user.model';
export default class ReactTestFormComponent extends React.Component {
getDefaultProps: function() {
var props = {
model: new UserModel()
};
return props;
},
constructor() {
super();
this.getSaveBtnTemplate = this.getSaveBtnTemplate.bind(this);
this.onSave = this.onSave.bind(this);
this.onShowMessage = this.onShowMessage.bind(this);
}
componentWillMount: function() {
componentDidMount() {
this.props.model.set('id', 1);
this.props.model.fetch();
this.props.model.on('saved', this.modelSavedHandler, this);
},
}
getSaveBtnTemplate: function () {
getSaveBtnTemplate () {
if (!this.props.model.isEditable()) { return ''; }
return (
......@@ -28,30 +27,30 @@ var ReactTestFormComponent = React.createClass({
<CM.MUI.FlatButton label='Show message' onClick={this.onShowMessage} />
</CM.MUI.CardText>
);
},
}
modelSavedHandler: function() {
modelSavedHandler() {
this.props.showMessage('Model saved on the server', 'info');
},
}
onSave: function (e) {
onSave(e) {
e.preventDefault();
if (this.props.model.isValid()) {
this.props.model.save();
}
},
}
addButtonClick: function(code) {
addButtonClick(code) {
this.props.showMessage('Phone number added to model', 'info');
},
}
onShowMessage: function () {
onShowMessage () {
this.props.showMessage('123', 'error');
},
}
// https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content
render: function () {
render () {
return (
......@@ -125,10 +124,8 @@ var ReactTestFormComponent = React.createClass({
</CM.UI.Flexbox.Box>
);
}
});
module.exports = ReactTestFormComponent;
}
ReactTestFormComponent.defaultProps = {
model: new UserModel()
};
\ No newline at end of file
/*global module, CM, require*/
'use strict';
var $ = require('jquery');
var ReactTestHomeComponent = require('./views/home.test.jsx');
var ListComponent = require('./views/list.test.jsx');
var ItemComponent = require('./views/item.test.jsx');
var HomeModule = CM.Module.extend({
import $ from 'jquery';
import ReactTestHomeComponent from './views/home.test';
import ListComponent from './views/list.test'
import ItemComponent from './views/item.test';
const HomeModule = CM.Module.extend({
/**
* object that will be passed to React component as property like models, collections and etc.
......@@ -34,14 +35,14 @@ var HomeModule = CM.Module.extend({
* element where React component will be rendered
* @return {DomElement}
*/
el: function() {
el() {
return $('.content').get(0);
},
initialize: function () {
initialize() {
}
});
module.exports = HomeModule;
\ No newline at end of file
export default HomeModule;
\ No newline at end of file
/*global define, React */
'use strict';
var MenuIcon = require('material-ui/svg-icons/navigation/menu').default;
var ReactAppBarComponent = React.createClass({
getMenuItems: function() {
var me = this,
iconMenuItems = [
{ text: CM.gettext('Form View'), url: 'form'},
{ text: CM.gettext('Tabs View'), url: 'tabsview'},
{ text: CM.gettext('Table View'), url: 'table'},
{ text: CM.gettext('Flexbox View'), url: 'flexbox'}
];
import MenuIcon from 'material-ui/svg-icons/navigation/menu';
export default class ReactAppBarComponent extends React.Component {
getMenuItems() {
const iconMenuItems = [
{text: CM.gettext('Form View'), url: 'form'},
{text: CM.gettext('Tabs View'), url: 'tabsview'},
{text: CM.gettext('Table View'), url: 'table'},
{text: CM.gettext('Flexbox View'), url: 'flexbox'}
];
return iconMenuItems;
},
}
onIconMenuChange: function(url, event) {
onIconMenuChange(url, event) {
if (!url) { return; }
CM.navigate(url);
},
}
onTitleClick: function() {
onTitleClick() {
CM.navigate('/');
},
}
getIconMenuComponent: function () {
getIconMenuComponent() {
return (
<div>
......@@ -52,10 +52,10 @@ var ReactAppBarComponent = React.createClass({
</div>
);
},
}
render: function () {
render() {
return (
......@@ -67,10 +67,4 @@ var ReactAppBarComponent = React.createClass({
iconElementRight={this.getIconMenuComponent()} />
);
}
});
module.exports = ReactAppBarComponent;
}
\ No newline at end of file
/*global define, React, Backbone */
'use strict';
var ReactTestFormComponent = React.createClass({
export default class ReactTestFormComponent extends React.Component {
componentWillMount: function() {
componentDidMount() {
this.props.model.fetch();
},
}
getSaveBtnTemplate: function () {
getSaveBtnTemplate() {
if (!this.props.model.isEditable()) { return ''; }
return (
......@@ -17,24 +17,22 @@ var ReactTestFormComponent = React.createClass({
<CM.MUI.FlatButton label='Show message' onClick={this.onShowMessage} />
</CM.MUI.CardText>
);
},
}
onSave: function (e) {
onSave(e) {
e.preventDefault();
if (this.props.model.isValid()) {
this.props.model.save();
}
},
}
onShowMessage: function () {
onShowMessage() {
this.props.showMessage('123', 'error');
},
}
// https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content
render: function () {
var name = this.props.model.get('name');
render() {
return (
......@@ -96,10 +94,4 @@ var ReactTestFormComponent = React.createClass({
</CM.UI.Flexbox.Box>
);
}
});
module.exports = ReactTestFormComponent;
}
\ No newline at end of file
/*global define */
'use strict';
var MenuIcon = require('material-ui/svg-icons/navigation/menu').default;
var AppBarComponent = require('./appbar.test.jsx');
var ReactTestHomeComponent = React.createClass({
import AppBarComponent from './appbar.test';
onShowDialog: function () {
this.props.showDialog({
text: '123',
onCancelClick: () => {alert('no')},
onOkClick: () => {alert('yes')}
});
},
const ReactTestHomeComponent = (props) => {
render: function () {
return (
<div>
<AppBarComponent />
<CM.MUI.Card>
<CM.MUI.CardHeader className='title'
title="Main page of home module"
subtitle="registered as root path"
/>
return (
<div>
<AppBarComponent />
<CM.MUI.CardText>
</CM.MUI.CardText>
<CM.MUI.Card>
<CM.MUI.CardHeader className='title'
title="Main page of home module"
subtitle="registered as root path"
/>
<CM.MUI.CardText>
</CM.MUI.CardText>
<CM.MUI.CardActions >
<CM.MUI.FlatButton
label="#/list"
href="#list"
secondary={true}
/>
<CM.MUI.FlatButton
label="#/list/1"
href="#list/1"
secondary={true}
/>
<CM.MUI.FlatButton label='Show dialog' onClick={this.onShowDialog} />
</CM.MUI.CardActions>