Merge branch 'master' of https://github.com/evanshunt/carbon-fields-s…

…martlink

assets/css/field.css

@@ -2,6 +2,12 @@
   display: flex;
   flex-flow: row wrap;
   margin-bottom: 1em;
+  justify-content: space-between;
+  align-items: flex-start;
+}
+
+.carbon-smartlink button {
+  flex: 0 0 auto;
 }
 
 .carbon-smartlink .link-config fieldset {
@@ -15,4 +21,4 @@
 
 .carbon-smartlink label input, .carbon-smartlink label div {
   font-weight: normal;
-}
+}

assets/js/components/field.js

@@ -14,12 +14,25 @@ import withStore from 'fields/decorators/with-store';
 import withSetup from 'fields/decorators/with-setup';
 
 const stringifyField = (field) => JSON.stringify({
-	internal: field.internal,
+	linkType: field.linkType,
 	target: field.target,
 	postId: field.postId,
 	url: field.url
 });
 
+const setInitial = (field) => {
+	let newField = field;
+	if(typeof newField.initial === 'undefined') {
+		newField.initial = {
+			linkType: newField.linkType,
+			target: newField.target,
+			postId: newField.postId,
+			url: newField.url			
+		}
+	}
+	return newField;
+}
+
 /**
  * Render a number input field.
  *
@@ -35,31 +48,52 @@ export const SmartLinkField = ({
 	handleTypeChange,
 	handleTargetChange,
 	handleUrlChange,
-	handleIdChange
+	handleEmailChange,
+	handleTelChange,
+	handleIdChange,
+	handleRestore
 }) => {
 	let post = field.posts.find( post => post.value === field.postId );
 	return <Field field={field}>
 		<div className="link-config">
 			<fieldset>
 				<legend>Link Type</legend>
+					<label>
+						<input
+							type="radio"
+							name={name + 'linkType'}
+							value='1'
+							onChange={handleTypeChange}
+							checked={field.linkType == 1 ? 'checked' : ''}
+						/>Internal
+				</label>
 				<label>
 					<input
 						type="radio"
-						name={name + 'internal'}
-						value='1'
+						name={name + 'linkType'}
+						value='0'
 						onChange={handleTypeChange}
-						checked={field.internal == '1'}
-					/>Internal
-			</label>
+						checked={field.linkType == 0 ? 'checked' : ''}
+					/>External
+				</label>
 				<label>
 					<input
 						type="radio"
-						name={name + 'internal'}
-						value='0'
+						name={name + 'linkType'}
+						value='2'
 						onChange={handleTypeChange}
-						checked={field.internal == '0'}
-					/>External
-			</label>
+						checked={field.linkType == 2 ? 'checked' : ''}
+					/>Email
+				</label>
+				<label>
+					<input
+						type="radio"
+						name={name + 'linkType'}
+						value='3'
+						onChange={handleTypeChange}
+						checked={field.linkType == 3 ? 'checked' : ''}
+					/>Phone
+				</label>
 			</fieldset>
 			<fieldset>
 				<legend>Target</legend>
@@ -82,16 +116,41 @@ export const SmartLinkField = ({
 					/>New Tab
 			</label>
 			</fieldset>
+			<button onClick={handleRestore}>Restore Saved</button>
 		</div>
-		{ field.internal == '1' ?
+		{ field.linkType == '1' ?
 			<label>
 				Page
 				<Select
 					value={post ? post : ''}
 					onChange={handleIdChange}
 					options={field.posts}
-				/>	
-			</label>		
+				/>
+			</label>
+			:
+			<span></span>
+		}
+		{field.linkType == '2' ?
+			<label>Email
+				<input
+					type="text"
+					name={name + 'email'}
+					value={field.linkType == '2' ? field.url.slice(7) : ''}
+					onChange={handleEmailChange}
+				/>
+			</label>
+			:
+			<span></span>
+		}
+		{field.linkType == '3' ?
+			<label>Phone
+				<input
+					type="text"
+					name={name + 'phone'}
+					value={field.linkType == '3' ? field.url.slice(4) : ''}
+					onChange={handleTelChange}
+				/>
+			</label>
 			:
 			<span></span>
 		}
@@ -101,9 +160,9 @@ export const SmartLinkField = ({
 				type="text"
 				name={name + 'url'}
 				value={field.url ? field.url : ''}
-				readOnly={field.internal == '1'}
+				readOnly={parseInt(field.linkType)}
 				onChange={handleUrlChange}
-			/>			
+			/>
 		</label>
 		<input
 			type="hidden"
@@ -153,7 +212,9 @@ export const enhance = compose(
 	 */
 	withHandlers({
 		handleTypeChange: ({ field, setFieldValue }) => ({ target: { value } }) => {
-			field.internal = value;
+			field = setInitial(field);
+			field.postId = '';
+			field.linkType = value;
 			if (value) {
 				let post = field.posts.find(post => post.value === field.postId);
 				field.url = (typeof post !== 'undefined') ? post.url : '';
@@ -164,26 +225,59 @@ export const enhance = compose(
 			);
 		},
 		handleTargetChange: ({ field, setFieldValue }) => ({ target: { value } }) => {
+			field = setInitial(field);
 			field.target = value;
 			setFieldValue(
 				field.id,
 				stringifyField(field)
 			);
 		},
 		handleUrlChange: ({ field, setFieldValue }) => ({ target: { value } }) => {
+			field = setInitial(field);
 			field.url = value;
 			setFieldValue(
 				field.id,
 				stringifyField(field)
 			);
 		},
+		handleEmailChange: ({ field, setFieldValue }) => ({ target: { value } }) => {
+			field = setInitial(field);
+			field.url = `mailto:${value}`;
+			setFieldValue(
+				field.id,
+				stringifyField(field)
+			);
+		},
+		handleTelChange: ({ field, setFieldValue }) => ({ target: { value } }) => {
+			field = setInitial(field);
+			field.url = `tel:${value.replace(/\s/g, '')}`;
+			setFieldValue(
+				field.id,
+				stringifyField(field)
+			);
+		},
 		handleIdChange: ({ field, setFieldValue }) => (value) => {
+			field = setInitial(field);
 			field.postId = value.value;
 			field.url = value.url;
 			setFieldValue(
 				field.id,
 				stringifyField(field)
 			);
+		},
+		handleRestore: ({ field, setFieldValue }) => (event) => {
+			event.preventDefault();
+
+			if (field.initial !== 'undefined') {
+				field.linkType = field.initial.linkType;
+				field.target = field.initial.target;
+				field.postId = field.initial.postId;
+				field.url = field.initial.url;
+				setFieldValue(
+					field.id,
+					stringifyField(field)
+				);
+			}
 		}
 	})
 );

composer.json

@@ -3,7 +3,7 @@
     "description": "Carbon Fields extension, that adds a SmartLink field type.",
     "keywords": ["wordpress", "carbon-field", "carbon-field-SmartLink"],
     "type": "library",
-    "version": "0.0.3",
+    "version": "0.0.5",
     "license": "GPL-2.0+",
     "authors": [
         {

core/LinkTypes.php

@@ -0,0 +1,10 @@
+<?php
+
+namespace Carbon_Field_SmartLink;
+
+abstract class LinkTypes
+{
+    const INTERNAL = 0;
+    const EXTERNAL = 1;
+    const EMAIL = 2;
+}

core/SmartLink_Field.php

@@ -3,12 +3,13 @@
 namespace Carbon_Field_SmartLink;
 
 use Carbon_Fields\Field\Field;
+use Carbon_Field_SmartLink\LinkTypes;
 use App\Debug;
 
 class SmartLink_Field extends Field
 {
 
-    protected $internal = true;
+    protected $linkType = LinkTypes::INTERNAL;
     protected $target = "_self";
     protected $postId = 0;
     protected $url = '';
@@ -64,20 +65,22 @@ public function to_json( $load )
     {
         $field_data = parent::to_json($load);
 
-        $json = json_decode($field_data['value']);
+        $json = $field_data['value'];
+
+        $field_data['value'] = json_encode($json);
 
         if (is_object($json)) {
-            $this->internal = (property_exists($json, 'internal')) ? $json->internal : $this->internal;
+            $this->linkType = (property_exists($json, 'linkType')) ? $json->linkType : $this->linkType;
             $this->target = (property_exists($json, 'target')) ? $json->target : $this->target;
             $this->postId = (property_exists($json, 'postId')) ? $json->postId : $this->postId;
             $this->url = (property_exists($json, 'url')) ? $json->url : $this->url;
         }
 
-        $field_data = array_merge(
+        return array_merge(
             $field_data,
             [
                 'posts' => $this->get_posts(),
-                'internal' => $this->internal,
+                'linkType' => $this->linkType,
                 'target' => $this->target,
                 'postId' => $this->postId,
                 'url' => $this->url
@@ -86,27 +89,27 @@ public function to_json( $load )
 
         return $field_data;
     }
-
-    /**
-     * Get Posts and archives
-     */
-    function get_posts()
-    {
-        $types = array_values(get_post_types(['public' => true]));
-
-        return array_merge($this->get_archives_from_types($types), $this->get_posts_from_types($types));
-    }
 
     /**
      * Return a differently formatted value for end-users
      *
-     * @return mixed
+     * @return mixed		
      */
     public function get_formatted_value()
     {
         return json_decode($this->get_value());
     }
 
+    /**
+     * Get Posts and archives
+     */
+    function get_posts()
+    {
+        $types = array_values(get_post_types(['public' => true]));
+
+        return array_merge($this->get_archives_from_types($types), $this->get_posts_from_types($types));
+    }
+
     function get_archives_from_types($types)
     {
         $types = array_map(function ($type) {

package.json

@@ -1,6 +1,6 @@
 {
-  "name": "carbon-field-SmartLink",
-  "version": "1.0.0",
+  "name": "carbon-fields-smartlink",
+  "version": "0.0.5",
   "scripts": {
     "dev": "webpack -w",
     "build": "webpack"

webpack.config.js

@@ -6,7 +6,7 @@ const webpack = require('webpack');
  * This path assumes that Carbon Fields and the current template
  * are both in the `/vendor` directory inside your theme - change the path if needed.
  */
-const root = path.resolve(__dirname, '../carbon-fields');
+const root = path.resolve(__dirname, '../../vendor/htmlburger/carbon-fields');
 
 if (!fs.existsSync(root)) {
     console.error('Could not find Carbon Fields folder.');