Progress on contact

web/src/components/ContactModal.js

@@ -0,0 +1,30 @@
+import React from 'react';
+
+export default class ContactModal extends React.Component {
+  onContactCloseClick () {
+
+  }
+
+  onContactCloseClick (e) {
+    this.props.dispatch({
+      type: 'CLOSE_CONTACT'
+    });
+
+    e.preventDefault();
+  }
+
+
+  render() {
+    return (
+      <div className="modal">
+
+        <div>
+          <a href="#close" title="Zatvori" className="close" onClick={this.onContactCloseClick.bind(this)}>
+            <i className="fa fa-times" aria-hidden="true"></i>
+          </a>
+          <h3>Kontaktirajte prodavca</h3>
+        </div>
+      </div>
+    );
+  }
+}

web/src/components/ListingDetails.js

@@ -1,6 +1,7 @@
 import React from 'react'
 import Gallery from './gallery'
 import {formatPrice} from '../lib/helpers'
+import ContactModal from './ContactModal';
 
 export default class ListingDetails extends React.Component {
   onReadMore (e) {
@@ -23,8 +24,14 @@ export default class ListingDetails extends React.Component {
     this.props.dispatch({type: 'BACK_TO_RESULTS'})
   }
 
+  onContactClick () {
+    this.props.dispatch({
+      type: 'OPEN_CONTACT'
+    });
+  }
+
   render () {
-    const {listing, descriptionExpanded} = this.props
+    const {listing, descriptionExpanded, contactFormOpen} = this.props
     if (!listing) {
       return null
     }
@@ -94,7 +101,7 @@ export default class ListingDetails extends React.Component {
             </div>
           </div>
           <div className="ld-check-availability">
-            <button>Kontaktiraj</button>
+            <button onClick={this.onContactClick.bind(this)}>Kontaktiraj</button>
           </div>
           <div className={descriptionClasses}>
             {listing.longDescription}
@@ -108,6 +115,8 @@ export default class ListingDetails extends React.Component {
             : null}
           <div className="ld-footer" />
         </div>
+
+        {contactFormOpen ? <ContactModal dispatch={this.props.dispatch} /> : null}
       </div>
     )
   }

web/src/components/Main.js

@@ -511,6 +511,7 @@ class Main extends React.Component {
       const listing = this.state.listing //this.state.listings.get(this.state.listingId);
       children.push(
         <ListingDetails
+          contactFormOpen={this.state.contactFormOpen}
           listing={listing}
           imageIndex={this.state.imageIndex}
           dispatch={this.dispatch.bind(this)}