src/cli/cms/editor/handlebars/printInput.js - Code Metrics - Inspection of "moving the handlebars modules into their respectiv..." - AdFabConnect/abejs - Measure and Improve Code Quality continuously with Scrutinizer

Passed

Push — master ( 61dd3f...482d1b )

by greg

created 2016-10-02 21:21 UTC

src/cli/cms/editor/handlebars/printInput.js A

↳ Parent: Project

Complexity

Total Complexity	31
Complexity/F	10.33

Size

Lines of Code	216
Function Count	3

Duplication

Duplicated Lines	0
Ratio	0 %

Importance

Changes	1
Bugs	0	Features	0

Metric	Value
cc	0
wmc	31
c	1
b	0
f	0
nc	1
mnd	6
bc	20
fnc	3
dl	0
loc	216
rs	9.8
bpm	6.6666
cpm	10.3333
noi	2

1 Function

Rating	Name	Duplication	Size	Complexity
D	printInput.js ➔ printInput	0	207	29

import sourceAutocomplete   from './sourceAutocomplete'
import sourceOption   from './sourceOption'
import {Hooks} from '../../../'

/**
 * Print form input based on input data type {Textarea | text | meta | link | image | ...}
 * && add appropriate attributs / data-attributs
 * @return {String|html} input / input group ...
 */
export default function printInput () {
  var params = arguments[0]

  params = Hooks.instance.trigger('beforeEditorInput', params)
  var desc = params.desc + ((params.required) ? ' *' : '')

  var res = `<div class="form-group">
              <label class="control-label" for="${params.key}" 
                      ${(params.type.indexOf('text_link') > -1) ? 'data-for-link="' + params.key + '"' : ''} >
                ${desc}
              </label>`,
    disabled = ''

  if(typeof params.placeholder === 'undefined' || params.placeholder === null || params.placeholder === 'undefined') {
    params.placeholder = ''
  }

  if(typeof params.value === 'undefined' || params.value === null) {
    params.value = ''
  }

  if(typeof params.value === 'string') params.value = params.value.replace(/\"/g, '&quot;')
if (a > 0)
    b = 42;

  var inputClass = 'form-control form-abe'
  var commonParams = `id="${params.key}"
                    data-id="${params.key}"
                    value="${params.value}"
                    maxlength="${params['max-length']}"
                    reload="${params.reload}"
                    tabIndex="${params.order}"
                    data-required="${params.required}"
                    data-display="${params.display}"
                    data-visible="${params.visible}"
                    data-autocomplete="${params.autocomplete}"
                    placeholder="${params.placeholder}"`

  if(typeof params.source !== 'undefined' && params.source !== null) {
    commonParams = `id="${params.key}"
                    data-id="${params.key}"
                    data-maxlength="${params['max-length']}"
                    reload="${params.reload}"
                    tabIndex="${params.order}"
                    data-required="${params.required}"
                    data-display="${params.display}"
                    data-visible="${params.visible}"
                    data-autocomplete="${params.autocomplete}"
                    placeholder="${params.placeholder}"`

    var multiple = ''
    var disabled = ''

    if(typeof params['max-length'] === 'undefined' || params['max-length'] === null || params['max-length'] === ''
      || (params['max-length'] > 1 && params.source.length > 0)) {
      multiple = 'multiple'
    }
    if(params.source.length <= 0) {
      disabled = 'disabled'
    }

    var lastValues
    if(typeof params.autocomplete !== 'undefined' && params.autocomplete !== null
       && (params.autocomplete === 'true' || params.autocomplete === 'true')) {
      if(params.source.indexOf('http') === 0) {
        lastValues = params.source
      }else {
        lastValues = JSON.stringify(params.source).replace(/\'/g, '&quote;')
      }
      res += '<div class="autocomplete-result-wrapper">'
      Array.prototype.forEach.call(params.value, (val) => {
        res += sourceAutocomplete(val, params)
      })
      res += '</div>'
      res += `<input value="" autocomplete="off" data-value='${lastValues}' type="text" ${disabled} ${commonParams} class="${inputClass}" />`
    }else {
      lastValues = JSON.stringify(params.value).replace(/\'/g, '&quote;')
      res += `<select ${multiple} ${disabled} ${commonParams} class="${inputClass}"
                        last-values='${lastValues}'>
              <option value=''></option>`

      if(typeof params.source === 'object' && Object.prototype.toString.call(params.source) === '[object Array]') {
        Array.prototype.forEach.call(params.source, (val) => {
          res += sourceOption(val, params)
        })

      }else {
        res += sourceOption(params.source, params)
      }

      res += '</select>'

    }
  }else if (params.type.indexOf('rich') >= 0){
    commonParams = `id="${params.key}"
                    data-id="${params.key}"
                    maxlength="${params['max-length']}"
                    reload="${params.reload}"
                    tabIndex="${params.order}"
                    data-required="${params.required}"
                    data-display="${params.display}"
                    data-visible="${params.visible}"
                    data-autocomplete="${params.autocomplete}"
                    placeholder="${params.placeholder}"`
                    
    res += `<div class="wysiwyg-container rich">
              <div class="wysiwyg-toolbar wysiwyg-toolbar-top">
                <a class="wysiwyg-toolbar-icon" href="#" title="Bold (Ctrl+B)" hotkey="b" data-action="bold" data-param="">
                  <span class="glyphicon glyphicon-bold"></span>
                </a>
                <a class="wysiwyg-toolbar-icon" href="#" title="Italic (Ctrl+I)" hotkey="i" data-action="italic" data-param="">
                  <span class="glyphicon glyphicon-italic"></span>
                </a>
                <a class="wysiwyg-toolbar-icon" href="#" title="Underline (Ctrl+U)" hotkey="u" data-action="underline" data-param="">
                  <span class="glyphicon underline">U</span>
                </a>
                <a class="wysiwyg-toolbar-icon" href="#" title="Text color" data-action="forecolor" data-param="" data-popup="color">
                  <span class="glyphicon glyphicon-text-color"></span>
                </a>
                <a class="wysiwyg-toolbar-icon" href="#" title="Background color" data-action="highlight" data-param="" data-popup="color">
                  <span class="glyphicon glyphicon-text-background"></span>
                </a>
                <a class="wysiwyg-toolbar-icon" href="#" title="Left" data-action="align" data-param="left">
                  <span class="glyphicon glyphicon-object-align-left"></span>
                </a>
                <a class="wysiwyg-toolbar-icon" href="#" title="Center" data-action="align" data-param="center">
                  <span class="glyphicon glyphicon-object-align-vertical"></span>
                </a>
                <a class="wysiwyg-toolbar-icon" href="#" title="Right" data-action="align" data-param="right">
                  <span class="glyphicon glyphicon-object-align-right"></span>
                </a>
                <a class="wysiwyg-toolbar-icon" href="#" title="Justify" data-action="justify" data-param="justify">
                  <span class="glyphicon glyphicon-menu-hamburger"></span>
                </a>
                <a class="wysiwyg-toolbar-icon" href="#" title="Subscript" data-action="subscript" data-param="">
                  <span class="glyphicon glyphicon-subscript"></span>
                </a>
                <a class="wysiwyg-toolbar-icon" href="#" title="Superscript" data-action="superscript" data-param="">
                  <span class="glyphicon glyphicon-superscript"></span>
                </a>
                <a class="wysiwyg-toolbar-icon" href="#" title="Indent" data-action="indent" data-param="">
                  <span class="glyphicon glyphicon-triangle-right"></span>
                </a>
                <a class="wysiwyg-toolbar-icon" href="#" title="Outdent" data-action="indent" data-param="outdent">
                  <span class="glyphicon glyphicon-triangle-left"></span>
                </a>
                <a class="wysiwyg-toolbar-icon" href="#" title="Unordered list" data-action="insertList" data-param="">
                  <span class="glyphicon glyphicon-th-list"></span>
                </a>
                <a class="wysiwyg-toolbar-icon" href="#" title="Remove format" data-action="removeFormat" data-param="">
                  <span class="glyphicon glyphicon-remove"></span>
                </a>
                <a class="wysiwyg-toolbar-icon" href="#" title="Add link" data-action="insertLink" data-popup="link" data-param="">
                  <span class="glyphicon glyphicon-link"></span>
                </a>
                <a class="wysiwyg-toolbar-icon" href="#" title="Code style" data-action="code" data-param="">
                  <span class="glyphicon glyphicon-console"></span>
                </a>
              </div>
              <textarea class="${inputClass} form-rich"
                        ${commonParams}
                        rows="4">${params.value}</textarea>
            </div>`
  }
  else if (params.type.indexOf('file') >= 0){
    res += `<input class="form-control" ${commonParams} name="${params.key}" type="file" />
            <span class="percent"></span>
            <input type="text" ${commonParams} class="${inputClass} hidden" />`
  }
  else if (params.type.indexOf('textarea') >= 0){
    res += `<textarea class="${inputClass}" ${commonParams} rows="4">${params.value}</textarea>`
  }
  else if (params.type.indexOf('link') >= 0){
    res += `<div class="input-group">
            <div class="input-group-addon link">
              <span class="glyphicon glyphicon-link" aria-hidden="true"></span>
            </div>
            <input type="text" ${commonParams} class="${inputClass}" />
          </div>`
  }
  else if (params.type.indexOf('image') >= 0){
    res += `<div class="input-group img-upload">
              <div class="input-group-addon image">
                <span class="glyphicon glyphicon-picture" aria-hidden="true"></span>
              </div>
              <input type="text" ${commonParams} class="${inputClass} image-input" />
              <div class="upload-wrapper">
                <input class="form-control" ${commonParams} name="${params.key}" type="file" title="upload an image"/>
                <span class="percent">
                  <span class="glyphicon glyphicon-upload" aria-hidden="true"></span>
                </span>
              </div>
            </div>
            <div class="input-error"></div>`
  }
  else {
    res += `<div class="input-group">
            <div class="input-group-addon">
              <span class="glyphicon glyphicon-font" aria-hidden="true"></span>
              </div>
              <input type="text" ${commonParams} class="${inputClass}" />
            </div>`
  }

  res += '</div>'

  res = Hooks.instance.trigger('afterEditorInput', res, params)

  return res
}


1			import sourceAutocomplete from './sourceAutocomplete'
2			import sourceOption from './sourceOption'
3			import {Hooks} from '../../../'
4
5			/**
6			* Print form input based on input data type {Textarea \| text \| meta \| link \| image \| ...}
7			* && add appropriate attributs / data-attributs
8			* @return {String\|html} input / input group ...
9			*/
10			export default function printInput () {
11			var params = arguments[0]
12
13			params = Hooks.instance.trigger('beforeEditorInput', params)
14			var desc = params.desc + ((params.required) ? ' *' : '')
15
16			var res = `<div class="form-group">
17			<label class="control-label" for="${params.key}"
18			${(params.type.indexOf('text_link') > -1) ? 'data-for-link="' + params.key + '"' : ''} >
19			${desc}
20			</label>`,
21			disabled = ''
22
23			if(typeof params.placeholder === 'undefined' \|\| params.placeholder === null \|\| params.placeholder === 'undefined') {
24			params.placeholder = ''
25			}
26
27			if(typeof params.value === 'undefined' \|\| params.value === null) {
28			params.value = ''
29			}
30
31			if(typeof params.value === 'string') params.value = params.value.replace(/\"/g, '"')
			0 ignored issues – show Coding Style Best Practice introduced 2016-09-27 10:32 UTC by Report Bug Copy Issue Report Curly braces around statements make for more readable code and help prevent bugs when you add further statements. Consider adding curly braces around all statements when they are executed conditionally. This is optional if there is only one statement, but leaving them out can lead to unexpected behaviour if another statement is added later. Consider: if (a > 0) b = 42; If you or someone else later decides to put another statement in, only the first statement will be executed. if (a > 0) console.log("a > 0"); b = 42; In this case the statement `b = 42` will always be executed, while the logging statement will be executed conditionally. if (a > 0) { console.log("a > 0"); b = 42; } ensures that the proper code will be executed conditionally no matter how many statements are added or removed. Loading history...
32
33			var inputClass = 'form-control form-abe'
34			var commonParams = `id="${params.key}"
35			data-id="${params.key}"
36			value="${params.value}"
37			maxlength="${params['max-length']}"
38			reload="${params.reload}"
39			tabIndex="${params.order}"
40			data-required="${params.required}"
41			data-display="${params.display}"
42			data-visible="${params.visible}"
43			data-autocomplete="${params.autocomplete}"
44			placeholder="${params.placeholder}"`
45
46			if(typeof params.source !== 'undefined' && params.source !== null) {
47			commonParams = `id="${params.key}"
48			data-id="${params.key}"
49			data-maxlength="${params['max-length']}"
50			reload="${params.reload}"
51			tabIndex="${params.order}"
52			data-required="${params.required}"
53			data-display="${params.display}"
54			data-visible="${params.visible}"
55			data-autocomplete="${params.autocomplete}"
56			placeholder="${params.placeholder}"`
57
58			var multiple = ''
59			var disabled = ''
			0 ignored issues – show Comprehensibility Naming Best Practice introduced 2016-09-27 10:32 UTC by Report Bug Copy Issue Report The variable `disabled` already seems to be declared on line `21`. Consider using another variable name or omitting the `var` keyword. This check looks for variables that are declared in multiple lines. There may be several reasons for this. In the simplest case the variable name was reused by mistake. This may lead to very hard to locate bugs. If you want to reuse a variable for another purpose, consider declaring it at or near the top of your function and just assigning to it subsequently so it is always declared. Loading history...
60			if(typeof params['max-length'] === 'undefined' \|\| params['max-length'] === null \|\| params['max-length'] === ''
61			\|\| (params['max-length'] > 1 && params.source.length > 0)) {
62			multiple = 'multiple'
63			}
64			if(params.source.length <= 0) {
65			disabled = 'disabled'
66			}
67
68			var lastValues
69			if(typeof params.autocomplete !== 'undefined' && params.autocomplete !== null
70			&& (params.autocomplete === 'true' \|\| params.autocomplete === 'true')) {
71			if(params.source.indexOf('http') === 0) {
72			lastValues = params.source
73			}else {
74			lastValues = JSON.stringify(params.source).replace(/\'/g, '&quote;')
75			}
76			res += '<div class="autocomplete-result-wrapper">'
77			Array.prototype.forEach.call(params.value, (val) => {
78			res += sourceAutocomplete(val, params)
79			})
80			res += '</div>'
81			res += `<input value="" autocomplete="off" data-value='${lastValues}' type="text" ${disabled} ${commonParams} class="${inputClass}" />`
82			}else {
83			lastValues = JSON.stringify(params.value).replace(/\'/g, '&quote;')
84			res += `<select ${multiple} ${disabled} ${commonParams} class="${inputClass}"
85			last-values='${lastValues}'>
86			<option value=''></option>`
87
88			if(typeof params.source === 'object' && Object.prototype.toString.call(params.source) === '[object Array]') {
89			Array.prototype.forEach.call(params.source, (val) => {
90			res += sourceOption(val, params)
91			})
92
93			}else {
94			res += sourceOption(params.source, params)
95			}
96
97			res += '</select>'
98
99			}
100			}else if (params.type.indexOf('rich') >= 0){
101			commonParams = `id="${params.key}"
102			data-id="${params.key}"
103			maxlength="${params['max-length']}"
104			reload="${params.reload}"
105			tabIndex="${params.order}"
106			data-required="${params.required}"
107			data-display="${params.display}"
108			data-visible="${params.visible}"
109			data-autocomplete="${params.autocomplete}"
110			placeholder="${params.placeholder}"`
111
112			res += `<div class="wysiwyg-container rich">
113			<div class="wysiwyg-toolbar wysiwyg-toolbar-top">
114			<a class="wysiwyg-toolbar-icon" href="#" title="Bold (Ctrl+B)" hotkey="b" data-action="bold" data-param="">
115			<span class="glyphicon glyphicon-bold"></span>
116			</a>
117			<a class="wysiwyg-toolbar-icon" href="#" title="Italic (Ctrl+I)" hotkey="i" data-action="italic" data-param="">
118			<span class="glyphicon glyphicon-italic"></span>
119			</a>
120			<a class="wysiwyg-toolbar-icon" href="#" title="Underline (Ctrl+U)" hotkey="u" data-action="underline" data-param="">
121			<span class="glyphicon underline">U</span>
122			</a>
123			<a class="wysiwyg-toolbar-icon" href="#" title="Text color" data-action="forecolor" data-param="" data-popup="color">
124			<span class="glyphicon glyphicon-text-color"></span>
125			</a>
126			<a class="wysiwyg-toolbar-icon" href="#" title="Background color" data-action="highlight" data-param="" data-popup="color">
127			<span class="glyphicon glyphicon-text-background"></span>
128			</a>
129			<a class="wysiwyg-toolbar-icon" href="#" title="Left" data-action="align" data-param="left">
130			<span class="glyphicon glyphicon-object-align-left"></span>
131			</a>
132			<a class="wysiwyg-toolbar-icon" href="#" title="Center" data-action="align" data-param="center">
133			<span class="glyphicon glyphicon-object-align-vertical"></span>
134			</a>
135			<a class="wysiwyg-toolbar-icon" href="#" title="Right" data-action="align" data-param="right">
136			<span class="glyphicon glyphicon-object-align-right"></span>
137			</a>
138			<a class="wysiwyg-toolbar-icon" href="#" title="Justify" data-action="justify" data-param="justify">
139			<span class="glyphicon glyphicon-menu-hamburger"></span>
140			</a>
141			<a class="wysiwyg-toolbar-icon" href="#" title="Subscript" data-action="subscript" data-param="">
142			<span class="glyphicon glyphicon-subscript"></span>
143			</a>
144			<a class="wysiwyg-toolbar-icon" href="#" title="Superscript" data-action="superscript" data-param="">
145			<span class="glyphicon glyphicon-superscript"></span>
146			</a>
147			<a class="wysiwyg-toolbar-icon" href="#" title="Indent" data-action="indent" data-param="">
148			<span class="glyphicon glyphicon-triangle-right"></span>
149			</a>
150			<a class="wysiwyg-toolbar-icon" href="#" title="Outdent" data-action="indent" data-param="outdent">
151			<span class="glyphicon glyphicon-triangle-left"></span>
152			</a>
153			<a class="wysiwyg-toolbar-icon" href="#" title="Unordered list" data-action="insertList" data-param="">
154			<span class="glyphicon glyphicon-th-list"></span>
155			</a>
156			<a class="wysiwyg-toolbar-icon" href="#" title="Remove format" data-action="removeFormat" data-param="">
157			<span class="glyphicon glyphicon-remove"></span>
158			</a>
159			<a class="wysiwyg-toolbar-icon" href="#" title="Add link" data-action="insertLink" data-popup="link" data-param="">
160			<span class="glyphicon glyphicon-link"></span>
161			</a>
162			<a class="wysiwyg-toolbar-icon" href="#" title="Code style" data-action="code" data-param="">
163			<span class="glyphicon glyphicon-console"></span>
164			</a>
165			</div>
166			<textarea class="${inputClass} form-rich"
167			${commonParams}
168			rows="4">${params.value}</textarea>
169			</div>`
170			}
171			else if (params.type.indexOf('file') >= 0){
172			res += `<input class="form-control" ${commonParams} name="${params.key}" type="file" />
173			<span class="percent"></span>
174			<input type="text" ${commonParams} class="${inputClass} hidden" />`
175			}
176			else if (params.type.indexOf('textarea') >= 0){
177			res += `<textarea class="${inputClass}" ${commonParams} rows="4">${params.value}</textarea>`
178			}
179			else if (params.type.indexOf('link') >= 0){
180			res += `<div class="input-group">
181			<div class="input-group-addon link">
182			<span class="glyphicon glyphicon-link" aria-hidden="true"></span>
183			</div>
184			<input type="text" ${commonParams} class="${inputClass}" />
185			</div>`
186			}
187			else if (params.type.indexOf('image') >= 0){
188			res += `<div class="input-group img-upload">
189			<div class="input-group-addon image">
190			<span class="glyphicon glyphicon-picture" aria-hidden="true"></span>
191			</div>
192			<input type="text" ${commonParams} class="${inputClass} image-input" />
193			<div class="upload-wrapper">
194			<input class="form-control" ${commonParams} name="${params.key}" type="file" title="upload an image"/>
195			<span class="percent">
196			<span class="glyphicon glyphicon-upload" aria-hidden="true"></span>
197			</span>
198			</div>
199			</div>
200			<div class="input-error"></div>`
201			}
202			else {
203			res += `<div class="input-group">
204			<div class="input-group-addon">
205			<span class="glyphicon glyphicon-font" aria-hidden="true"></span>
206			</div>
207			<input type="text" ${commonParams} class="${inputClass}" />
208			</div>`
209			}
210
211			res += '</div>'
212
213			res = Hooks.instance.trigger('afterEditorInput', res, params)
214
215			return res
216			}
217

AdFabConnect / abejs

Push — master ( 61dd3f...482d1b )

src/cli/cms/editor/handlebars/printInput.js A

Complexity

Size

Duplication

Importance

1 Function

Duplication Side-by-Side

Filter issues like