Adding new field: TagIt

lang/en_US.php

@@ -127,6 +127,12 @@
 $lang['fielddef_ColorPicker'] = 'Color Picker';
 // GeoCoder
 $lang['fielddef_GeoCoder'] = 'GeoCoder';
+// TagIt
+$lang['fielddef_TagIt'] = 'TagIt';
+$lang['remove_confirmation'] = 'Remove confirmation';
+$lang['fielddef_remove_confirmation_help'] = 'If checked item removal reqruires two backspace clicks.';
+$lang['allow_spaces'] = 'Allow spaces';
+$lang['fielddef_allow_spaces_help'] = 'Allow spaces.';
 
 /* Instructions */
 $lang['fielddef_allow_help'] = 'Specify a comma seprated list of file extensions that are allowed. For example: pdf,gif,jpeg,jpg (keep lowercase)';
@@ -151,6 +157,7 @@
 $lang['fielddef_media_type_help'] = 'Allows you to specify images as media type to be displayed. By default all files will be shown.';
 $lang['fielddef_enable_jqui_help'] = 'Enhances standard form elements to themeable buttons with appropriate hover and active styles.';
 $lang['fielddef_address_field_help'] = 'Field for lat/lon lookup.';
+$lang['fielddef_limit_help'] = 'Specify limit of items allowed in this field.';
 
 // category
 $lang['reorder_categories'] = 'Reorder Categories';
@@ -284,6 +291,7 @@
 $lang['showall'] = 'Show All';
 $lang['columns'] = 'Columns';
 $lang['owner'] = 'Owner';
+$lang['limit'] = 'Limit';
 
 // csv import/export
 $lang['filename'] = 'File name';

lib/fielddefs/TagIt/admin.TagIt.tpl

@@ -0,0 +1,25 @@
+<div class="pageoverflow">
+    <p class="pagetext">{$fielddef->ModLang('limit')}:</p>
+    <p class="pageinput">
+    	{$themeObject->DisplayImage('icons/system/info.gif')}<em> {$fielddef->ModLang('fielddef_limit_help')}</em><br />
+    	<input type="text" name="{$actionid}custom_input[limit]" value="{$fielddef->GetOptionValue('limit')}" />
+    </p>
+</div>
+
+<div class="pageoverflow">
+    <p class="pagetext">{$fielddef->ModLang('remove_confirmation')}:</p>
+    <p class="pageinput">
+    	{$themeObject->DisplayImage('icons/system/info.gif')}<em> {$fielddef->ModLang('fielddef_remove_confirmation_help')}</em><br />
+		<input type="hidden" name="{$actionid}custom_input[remove_confirmation]" value="false" />
+		<input type="checkbox" name="{$actionid}custom_input[remove_confirmation]" value="true"{if $fielddef->GetOptionValue('remove_confirmation') == 'true'}checked="checked"{/if} />
+	</p>
+</div>
+
+<div class="pageoverflow">
+    <p class="pagetext">{$fielddef->ModLang('allow_spaces')}:</p>
+    <p class="pageinput">
+    	{$themeObject->DisplayImage('icons/system/info.gif')}<em> {$fielddef->ModLang('fielddef_allow_spaces_help')}</em><br />
+		<input type="hidden" name="{$actionid}custom_input[allow_spaces]" value="false" />
+		<input type="checkbox" name="{$actionid}custom_input[allow_spaces]" value="true"{if $fielddef->GetOptionValue('allow_spaces') == 'true'}checked="checked"{/if} />
+	</p>
+</div>

lib/fielddefs/TagIt/input.TagIt.tpl

@@ -0,0 +1,25 @@
+<div class="pageoverflow">
+	<p class="pagetext">{$fielddef->GetName()}{if $fielddef->IsRequired()}*{/if}:</p>
+	<div class="pageinput">
+		{if $fielddef->GetDesc()}({$fielddef->GetDesc()})<br />{/if}
+		<input type="hidden" name="{$actionid}customfield[{$fielddef->GetId()}]" />
+		<ul id="{$actionid}customfield[{$fielddef->GetId()}]-value">
+			{foreach from=$fielddef->GetValue() item=value}
+				<li>{$value}</li>
+			{/foreach}
+		</ul>			
+	</div>
+
+	<script type="text/javascript">
+	jQuery(document).ready(function($) {
+		$("#{$actionid}customfield\\\[{$fielddef->GetId()}\\\]-value").tagit({
+			fieldName: "{$actionid}customfield[{$fielddef->GetId()}][]",
+			removeConfirmation: {$fielddef->GetOptionValue('remove_confirmation', 'false')},
+			allowSpaces: {$fielddef->GetOptionValue('allow_spaces', 'false')},
+			tagLimit: {$fielddef->GetOptionValue('limit')|default:'null'}
+		})
+		.sortable();
+	});
+	</script>	
+
+</div>

lib/fielddefs/TagIt/listit2fd-jquery.tagit.css

@@ -0,0 +1,70 @@
+ul.tagit {
+    padding: 3px 5px;
+    overflow: auto;
+	margin-left: 0 !important;
+	margin-right: 0 !important;
+}
+ul.tagit li {
+    display: block;
+    float: left;
+    margin: 2px 5px 2px 0;
+	cursor: move;
+}
+ul.tagit li.tagit-choice {    
+    position: relative;
+    line-height: inherit;
+}
+input.tagit-hidden-field {
+    display: none;
+}
+ul.tagit li.tagit-choice-read-only { 
+    padding: .2em .5em .2em .5em; 
+} 
+
+ul.tagit li.tagit-choice-editable { 
+    padding: .2em 18px .2em .5em; 
+} 
+
+ul.tagit li.tagit-new {
+    padding: .25em 4px .25em 0;
+}
+
+ul.tagit li.tagit-choice a.tagit-label {
+    cursor: pointer;
+    text-decoration: none;
+}
+ul.tagit li.tagit-choice .tagit-close {
+    cursor: pointer;
+    position: absolute;
+    right: .1em;
+    top: 50%;
+    margin-top: -8px;
+    line-height: 17px;
+}
+
+/* used for some custom themes that don't need image icons */
+ul.tagit li.tagit-choice .tagit-close .text-icon {
+    display: none;
+}
+
+ul.tagit li.tagit-choice input {
+    display: block;
+    float: left;
+    margin: 2px 5px 2px 0;
+}
+ul.tagit input[type="text"] {
+    -moz-box-sizing:    border-box;
+    -webkit-box-sizing: border-box;
+    box-sizing:         border-box;
+
+    -moz-box-shadow: none;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+
+    border: none;
+    margin: 0;
+    padding: 0;
+    width: inherit;
+    background-color: inherit;
+    outline: none;
+}

lib/fielddefs/TagIt/listit2fd.TagIt.php

@@ -0,0 +1,50 @@
+<?php
+#-------------------------------------------------------------------------
+#
+# Author: Ben Malen, <[email protected]>
+# Co-Maintainer: Simon Radford, <[email protected]>
+# Web: www.conceptfactory.com.au
+#
+#-------------------------------------------------------------------------
+#
+# Maintainer since 2011: Jonathan Schmid, <[email protected]>
+# Web: www.jonathanschmid.de
+#
+#-------------------------------------------------------------------------
+#
+# Some wackos started destroying stuff since 2012: 
+#
+# Tapio Löytty, <[email protected]>
+# Web: www.orange-media.fi
+#
+# Goran Ilic, <[email protected]>
+# Web: www.ich-mach-das.at
+#
+#-------------------------------------------------------------------------
+#
+# ListIt is a CMS Made Simple module that enables the web developer to create
+# multiple lists throughout a site. It can be duplicated and given friendly
+# names for easier client maintenance.
+#
+#-------------------------------------------------------------------------
+
+class listit2fd_TagIt extends ListIt2FielddefBase
+{
+	public function __construct(&$db_info) 
+	{	
+		parent::__construct($db_info);
+
+		$this->SetFriendlyType($this->ModLang('fielddef_'.$this->GetType()));
+	}
+
+	public function GetHeaderHTML()
+	{
+        $tmpl = <<<EOT
+<link type="text/css" rel="stylesheet" href="{$this->GetURLPath()}/listit2fd-jquery.tagit.css" />
+<script type="text/javascript" src="{$this->GetURLPath()}/listit2fd-tag-it.min.js"></script>
+EOT;
+		return $tmpl;
+	}
+
+} // end of class
+?>