<!DOCTYPE html>
<html>
<head>
	<title>PMDynaform</title>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	
    <link rel="stylesheet" href="css/pmDynaform.min.css">
   
</head>
<body>
	<div class="pmdynaform-mobile-loading">
	    <h3>Processmaker</h3>
    	<div class="alert alert-warning" role="alert">
	    	<span class="glyphicon glyphicon-refresh glyphicon-refresh-animate"></span>
			 <strong>Loading Data</strong>
	     </div>
	    <div id="shadow-form"></div> 
		
	</div>
	<div id="container"></div>

<script type="text/template" id="fieldset-template">
	<fieldset>
	    <legend>Options</legend>
	    
	        <div class='col-sm-12'>
	            <div class='form-group'>
	            </div>
	        </div>
	</fieldset>
</script>

<script type="text/template" id="tpl-panelfield">
	<div class="col-xs-<%- colSpan %>">		  			 			 
	</div>
</script>

<script type="text/template" id="tpl-row">
	<div class="pmdynaform-field row show-grid">	      
	</div>
</script>

<!--<script type="text/template" id="tpl-validator">
	<ul>
		<% for (var item in message) {%>
			<li> <span><%= message[item]%> </span> </li>
		<%}%>
	</ul>
</script>-->

<script type="text/template" id="tpl-validator">
	<div class="alert alert-danger" role="alert">
		<span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
		<span class="sr-only">Error:</span>
	  	<% for (var item in message) {%>
			<span><%= message[item]%> </span>
		<%}%>
	</div>
</script>

<script type="text/template" id="tpl-text">
	<div id="<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> <%=namespace%>-<%=mode%>-<%=type%> <%if (group === 'form'){%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%>  pmdynaform-field<%}%>">
        <% if(group === "form") {%>
            <label for="<%=name%>" class="col-md-<%=colSpanLabel%> col-lg-<%=colSpanLabel%> control-label pmdynaform-label"> 
            	<span data-toggle="tooltip" data-placement="bottom" title="<%=tooltipLabel%>" class="textlabel"><%= label %></span>
	            <%if(required){%>
		  			<span class="pmdynaform-field-required">*</span>
		  		<%}%>
            </label>
        <%} else if((group !== "form") && (layout === "form")){%>
			<label for="<%=name%>" class="hidden-lg hidden-md hidden-sm visible-xs control-label pmdynaform-label col-xs-<%=colSpanLabel%>">  
		  		<span class = "textlabel"><%= label %></span>
				<%if(required){%>
		  			<span class="pmdynaform-field-required">*</span>
		  		<%}%>
		  	</label>
		<%}%>
		<div <%if (group === 'form'){ %> 
	  			class="col-md-<%=colSpanControl%> col-lg-<%=colSpanControl%> pmdynaform-field-control"
	  		<%} else if (layout === "form"){ %>
	  			class="col-xs-<%=colSpanControl%> col-sm-12 col-md-12 col-lg-12"
	  		<%} else if (layout === "responsive") {%> 
	  			class="col-xs-12 col-sm-12 col-md-12 col-lg-12"
	  		<%}%>>
			<input
				<% if  ( group === "grid") { %>
					id= "form<%=id%>"
					name="form<%=name%>"
				<%} else{%>
					id= "form[<%=id%>]"
					name="form[<%=name%>]"
				<%}%>
				mask = "<%=mask%>"
				type = <%=type%>
				class="<%=namespace%>-control-<%=type%> form-control" 
				placeholder= "<%= placeholder %>"
				value= "<%= value%>"
				<% if(disabled === true){%>disabled<%}%>
				
				<% if (autoComplete === "on" || autoComplete === "off") { %>
					autocomplete = "<%= autoComplete %>"
				<%} else{%>
					autoComplete = "off"
				<%}%>
				>
				<% if (type === "suggest"){ %> 
					<input type="hidden" value="<%= data['value']%>"
						<% if  ( group === "grid") { %>
							id = "form<%=id%>_label"
							name ="form<%=name%>_label"
						<%} else{%>
							id = "form[<%=id%>]"
							name ="form[<%=name%>]"
						<%}%>
					>
				<%}%>	
				<% if (group === "form") { %>
					<%if (hint !== "" && hint !== null){%>
						<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="bottom" title="<%=hint%>"></span>
					<%}%>						
				<% } %>
				<% if (type !== "suggest"){ %> 
					<input type="hidden" 
						<% if  ( group === "grid") { %>
							id = "form<%=id%>_label"
							name ="form<%=name%>_label"
						<%} else{%>
							id = "form[<%=id%>_label]"
							name ="form[<%=name%>_label]"
							value = "<%= data['label']%>"
						<%}%>
					>
				<%}%>	
		</div>
    </div>
</script>

<script type="text/template" id="tpl-textarea">
	<div id="<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> <%if (group === 'form'){%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> <%}%> <%=namespace%>-<%=mode%>-<%=type%> pmdynaform-field">
		<% if(group === "form") {%>
			<label for="<%=name%>" class="col-md-<%=colSpanLabel%> col-lg-<%=colSpanLabel%> control-label pmdynaform-label"> 
				<span class="textlabel"><%= label %></span>
				<%if(required){%>
		  			<span class="pmdynaform-field-required">*</span>
		  		<%}%>
			</label>
		<%} else if((group !== "form") && (layout === "form")){%>
			<label for="<%=name%>" class="hidden-lg hidden-md hidden-sm visible-xs control-label pmdynaform-label col-xs-<%=colSpanLabel%>">  
		  		<span class="textlabel"><%= label %></span>
		  	</label>
		<%}%>
		<div <%if (group === 'form'){ %> 
		  			class="col-md-<%=colSpanControl%> col-lg-<%=colSpanControl%> pmdynaform-field-control"
		  		<%} else if (layout === "form"){ %>
		  			class="col-xs-<%=colSpanControl%> col-sm-12 col-md-12 col-lg-12"
		  		<%} else if (layout === "responsive") {%> 
		  			class="col-xs-12 col-sm-12 col-md-12 col-lg-12"
		  		<%}%>>
			<textarea 	
						<% if  ( group === "grid") { %>
							id = "form<%=id%>"
							name ="form<%=name%>"
						<%} else{%>
							id = "form[<%=id%>]"
							name ="form[<%=name%>]"
						<%}%>
						class="<%=namespace%>-control-<%=type%> form-control" 
						rows="<%= rows %>"
						placeholder= "<%= placeholder %>"
				<% if(disabled === true){%>disabled<%}%>
			><%= value %></textarea>
			<% if (group === "form") { %>
				<%if (hint !== "" && hint !== null){%>
					<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="bottom" title="<%=hint%>"></span>
				<%}%>						
			<% } %>
			<input type="hidden"
				<% if  ( group === "grid") { %>
					id = "form<%=id%>_label"
					name ="form<%=name%>_label"
				<%} else{%>
					id = "form[<%=id%>_label]"
					name ="form[<%=name%>_label]"
 					value="<%= data['label']%>"
				<%}%>
			>
		</div>
	</div>	
</script>

 <script type="text/template" id="tpl-checkbox">
	<div id="<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> <%if (group === 'form'){%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> <%}%> <%=namespace%>-<%=mode%>-<%=type%> pmdynaform-field">
    	<% if(group === "form") {%>
	    	<label for="<%=name%>" class="col-md-<%=colSpanLabel%> col-lg-<%=colSpanLabel%> control-label pmdynaform-label">  
	    		<span class="textlabel"><%= label %></span>
	    		<%if(required){%>
		  			<span class="pmdynaform-field-required">*</span>
		  		<%}%>
	    	</label>
	    <%} else if((group !== "form") && (layout === "form")){%>
				<label for="<%=name%>" class="hidden-lg hidden-md hidden-sm visible-xs control-label pmdynaform-label col-xs-<%=colSpanLabel%>">  
			  		<span class="textlabel"><%= label %></span>
			  	</label>
			<%}%>
    	<div <%if (group === 'form'){ %> 
		  			class="col-md-<%=colSpanControl%> col-lg-<%=colSpanControl%> pmdynaform-field-control"
		  		<%} else if (layout === "form"){ %>
		  			class="col-xs-<%=colSpanControl%> col-sm-12 col-md-12 col-lg-12"
		  		<%} else if (layout === "responsive") {%> 
		  			class="col-xs-12 col-sm-12 col-md-12 col-lg-12"
		  		<%}%>>
    		<div class="pmdynaform-control-checkbox-list">
    			<div class="pmdynaform-checkbox-items">
	    			<% for(var i=0; i<options.length; i+=1) { %>
						<div class="checkbox"
							<%if(dataType === "boolean" && i > 0){%>
							style = "display:none"
							<%}%>
						>        
				        	<label>
				        		<input 
									<% if  ( group === "grid") { %>
										id = "form<%=id%>"
										name ="form<%=name%>"
									<%} else {%>
										id = "form[<%=id%>][<%=options[i].value%>]"
										name ="form[<%=name%>][]"
									<%}%>
				        			class="<%=namespace%>-control-<%=type%>"
					        		value="<%=options[i].value%>" 
					        		type="<%=type%>"
					        		<% if(options[i].selected){%>checked<%}%>
					        		<% if(disabled === true){%>disabled<%}%>>
					        		<%if(dataType !== "boolean"){%>
										<span><%= options[i].label %> </span>
					        		<%}%>
				        	</label>
						</div>
				    <% } %>	
	    		</div>
				<% if (group === "form") { %>
					<%if (hint !== "" && hint !== null){%>
						<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="bottom" title="<%=hint%>"></span>
					<%}%>						
				<% } %>
    		</div>
			<input type="hidden" 
				<% if  ( group === "grid") { %>
					id = "form<%=id%>_label"
					name ="form<%=name%>_label"
				<%} else{%>
					id = "form[<%=id%>_label]"
					name ="form[<%=name%>_label]"
				<%}%>
			>
		</div>
	</div>    
 </script>


<script type="text/template" id="tpl-radio">
	<div id="<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> <%if (group === 'form'){%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> <%}%> <%=namespace%>-<%=mode%>-<%=type%> pmdynaform-field">
	    <% if(group === "form") {%>
	    	<label for="<%=name%>" class="col-md-<%=colSpanLabel%> col-lg-<%=colSpanLabel%> control-label pmdynaform-label">  
	    		<span class="textlabel"><%= label %></span>
	    		<%if(required){%>
		  			<span class="pmdynaform-field-required">*</span>
		  		<%}%>
	    	</label>
	    <%} else if((group !== "form") && (layout === "form")){%>
			<label for="<%=name%>" class="hidden-lg hidden-md hidden-sm visible-xs control-label pmdynaform-label col-xs-<%=colSpanLabel%>">  
		  		<span class="textlabel"><%= label %></span>
		  	</label>
		<%}%>
    	<div <%if (group === 'form'){ %> 
		  			class="col-md-<%=colSpanControl%> col-lg-<%=colSpanControl%> pmdynaform-field-control"
		  		<%} else if (layout === "form"){ %>
		  			class="col-xs-<%=colSpanControl%> col-sm-12 col-md-12 col-lg-12"
		  		<%} else if (layout === "responsive") {%> 
		  			class="col-xs-12 col-sm-12 col-md-12 col-lg-12"
		  		<%}%>>
	    	<div class="pmdynaform-control-radio-list">
	    		<div class="pmdynaform-radio-items">
	    			<% for(var i=0; i<options.length; i+=1) { %>
			    		<div class="radio">
			    			<label>
			    				<input 
									<% if  ( group === "grid") { %>
										id = "form<%=id%>"
										name ="form<%=name%>"
									<%} else{%>
										id = "form[<%=id%>]"
										name ="form[<%=name%>]"
									<%}%>
			    					class="<%=namespace%>-control-<%=type%>"
					        		value="<%=options[i].value%>"
					        		type="<%=type%>"
					        		<% if(value.toString() === options[i].value.toString()){%>checked<%}%>
					        		<% if(disabled === true){%>disabled<%}%>
					        		>
				        		<span><%= options[i].label %> </span>
			    			</label>
						</div>
			    	<% } %>
	    		</div>
				<input type="hidden" value="<%= data['label']%>"
					<% if  ( group === "grid") { %>
						id = "form<%=id%>_label"
						name ="form<%=name%>_label"
					<%} else{%>
						id = "form[<%=id%>_label]"
						name ="form[<%=name%>_label]"
					<%}%>
				>
				<% if (group === "form") { %>
					<%if (hint !== "" && hint !== null){%>
						<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="bottom" title="<%=hint%>"></span>
					<%}%>						
				<% } %>
	    	</div>
		</div>
	</div>
 </script>



<script type="text/template" id="tpl-dropdown">
	<div id="<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> <%if (group === 'form'){%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> <%}%> <%=namespace%>-<%=mode%>-<%=type%> pmdynaform-field">	
		<% if(group === "form") {%>
			<label for="<%=name%>" class="col-md-<%=colSpanLabel%> col-lg-<%=colSpanLabel%> control-label pmdynaform-label">  
				<span class="textlabel"><%= label %></span>
				<%if(required){%>
		  			<span class="pmdynaform-field-required">*</span>
		  		<%}%>
	        </label>
	    <%} else if((group !== "form") && (layout === "form")){%>
			<label for="<%=name%>" class="hidden-lg hidden-md hidden-sm visible-xs control-label pmdynaform-label col-xs-<%=colSpanLabel%>">  
		  		<span class="textlabel"><%= label %></span>
		  	</label>
		<%}%>
		<div <%if (group === 'form'){ %> 
		  			class="pmdynaform-dropdown-control col-md-<%=colSpanControl%> col-lg-<%=colSpanControl%> pmdynaform-field-control"
		  		<%} else if (layout === "form"){ %>
		  			class="pmdynaform-dropdown-control col-xs-<%=colSpanControl%> col-sm-12 col-md-12 col-lg-12"
		  		<%} else if (layout === "responsive") {%> 
		  			class="pmdynaform-dropdown-control col-xs-12 col-sm-12 col-md-12 col-lg-12"
		  		<%}%>>
			<select 	
				<% if  ( group === "grid") { %>
					id = "form<%=id%>"
					name ="form<%=name%>"
				<%} else{%>
					id = "form[<%=id%>]"
					name ="form[<%=name%>]"
				<%}%>
						class="<%=namespace%>-control-<%=type%> form-control"
				<% if(disabled === true){%>disabled<%}%>>
				<% for(var i=0; i<options.length; i+=1) { %>
			        <option value=<%= options[i].value %> 
			        	<%if(options[i].value.toString() === value.toString() && (value.length)){%>
			        		selected<%}%>
			        >
			        	<%= options[i].label %>
			        </option>
			    <% } %>
		    </select>
			<% if (group === "form") { %>
				<%if (hint !== "" && hint !== null){%>
					<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="bottom" title="<%=hint%>"></span>
				<%}%>						
			<% } %>
			<input type="hidden" value="<%= data['label']%>"
				<% if  ( group === "grid") { %>
					id = "form<%=id%>_label"
					name ="form<%=name%>_label"
				<%} else{%>
					id = "form[<%=id%>_label]"
					name ="form[<%=name%>_label]"
				<%}%>
			>
		</div>
	</div>	
</script>

<script type="text/template" id="tpl-button">
	<div id="<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> text-center">
		<button id="form[<%= label %>]" name="form[<%= label %>]" type=<%=type%> class="btn btn-primary"
			<% if(disabled === true){%>disabled<%}%>> 
			<span> <%= label %> </span>
		</button>
	</div>
</script>

<script type="text/template" id="tpl-submit">
	<div id="<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> text-center">
		<button id="form[submit]" name="form[submit]" type=<%=type%> class="btn btn-default"
			<% if(disabled === true){%>disabled<%}%>> 
			<span> <%= label %> </span>
		</button>
	</div>	
</script>

<script type="text/template" id="tpl-file">
	<div id="<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> <%if (group === 'form'){%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> <%}%> <%=namespace%>-<%=mode%>-<%=type%> pmdynaform-field">
	    <% if(group === "form") {%>
		    <label for="<%=name%>" class="col-md-<%=colSpanLabel%> col-lg-<%=colSpanLabel%> control-label pmdynaform-label"> 
		    	<span class="textlabel"><%= label %></span>
		        <%if(required){%>
		  			<span class="pmdynaform-field-required">*</span>
		  		<%}%>
		    </label>
		<%} else if((group !== "form") && (layout === "form")){%>
			<label for="<%=name%>" class="hidden-lg hidden-md hidden-sm visible-xs control-label pmdynaform-label col-xs-<%=colSpanLabel%>">  
		  		<span class="textlabel"><%= label %></span>
		  	</label>
		<%}%>
		<div <%if(group === 'form'){ %> class="pmdynaform-file-control col-md-<%=colSpanControl%> col-lg-<%=colSpanControl%> pmdynaform-field-control" <%}%> >
			<div class="pmdynaform-file-container col-xs-12 col-sm-12 col-md-12 col-lg-12">
				<button type="button" class="<%=namespace%>-control-<%=type%> form-control"
					<% if(disabled === true){%>disabled<%}%>
					<% if(mode === "view"){%>style="display:none;"<%}%>
				>
					<%=labelButton%>
				</button>
				<%if (group === "form"){%>
					<%if (hint !== "" && hint !== null){%>
						<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="bottom" title="<%=hint%>"></span>
					<%}%>
				<%}%>

				<input 
					<% if  ( group === "grid") { %>
						id = "form<%=id%>"
						name ="form<%=name%>"
					<%} else{%>
						id = "form[<%=name%>]"
						name ="form[<%=name%>]"
					<%}%>
				type="file" style="visibility:hidden;"
					<% if(disabled === true){%>disabled<%}%>
					<% if(multiple === true){%>multiple<%}%>
				>
				<input type="hidden" 
					<% if  ( group === "grid") { %>
							id = "form<%=id%>_label"
							name ="form<%=name%>_label"
						<%} else {%>
							id = "form[<%=id%>]"
							name ="form[<%=name%>]"
					<%}%>
				>
				<div name="button-all" class="btn-group btn-group-justified" style="display: none;">
					<div class="pmdynaform-file-buttonup btn-group">
						<button class="glyphicon glyphicon-upload btn btn-success btn-sm">
						All
						</button>
					</div>
					<div class="pmdynaform-file-buttoncancel btn-group" style="display: none;">
						<button class="glyphicon glyphicon-remove btn btn-danger btn-sm">
						All
						</button>
					</div>
					<div class="pmdynaform-file-buttonremove btn-group">
						<button class="glyphicon glyphicon-trash btn btn-danger btn-sm">
						All
						</button>
					</div>						
				</div>
				<% if(dnd) {%>
					<p style="float:left;" class="help-block"><%=dndMessage%></p>
				<%}%>
				<%if(preview) {%>
					<div class="pmdynaform-file-droparea" style="height:<%=height%>;"></div>
				<% } else {%>
					<div class="pmdynaform-file-list" style="display:none"></div>
				<% } %>
				<%if(data['value'].length){%>
					<div class= "col-md-<%=colSpanControl%> col-lg-<%=colSpanControl%> pmdynaform-field-control">
		    			<% for(var i = 0; i < data['label'].length; i+=1) { %>
							<a style="float:left"
								href = "<%=data['value'][i]%>" class="btn btn-link <%=namespace%>-control-<%=type%>">
								<span> <%=data['label'][i]%></span>
							</a>
					    <% } %>
					</div>
				<%}%>
			</div>
		</div>
	</div>
</script>

<script type="text/template" id="tpl-suggest-list">
	<ul class="list-group col-lg-11 col-sm-11 col-md-11 col-xs-10 pmdynaform-suggest-list">  		
	</ul>
</script>
<script type="text/template" id="tpl-suggest-element">
  		<span data-value="<%= value %>" class="list-group-item"><%= label %></span>  		
</script>

 <script type="text/template" id="tpl-link">
	<div id="<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> <%if (group === 'form'){%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> <%}%>  <%=namespace%>-<%=mode%>-<%=type%> pmdynaform-field">
        <% if(group === "form") {%>
            <label for="<%=name%>" class="col-md-<%=colSpanLabel%> col-lg-<%=colSpanLabel%> control-label pmdynaform-label"> 
            	<span class="textlabel"><%= label %></span>
	            <%if(required){%>
		  			<span class="pmdynaform-field-required">*</span>
		  		<%}%>
            </label>
        <%} else if((group !== "form") && (layout === "form")){%>
			<label for="<%=name%>" class="hidden-lg hidden-md hidden-sm visible-xs control-label pmdynaform-label col-xs-<%=colSpanLabel%>">  
		  		<span class="textlabel"><%= label %></span>
		  	</label>
		<%}%>
		<div <%if (group === 'form'){ %> 
		  			class="col-md-<%=colSpanControl%> col-lg-<%=colSpanControl%> pmdynaform-field-control"
		  		<%} else if (layout === "form"){ %>
		  			class="col-xs-<%=colSpanControl%> col-sm-12 col-md-12 col-lg-12"
		  		<%} else if (layout === "responsive") {%> 
		  			class="col-xs-12 col-sm-12 col-md-12 col-lg-12"
		  		<%}%>>
			<a 
				<% if  ( group === "grid") { %>
					id = "form<%=id%>"
					name ="form<%=name%>"
				<%} else{%>
					id = "form[<%=id%>]"
					name ="form[<%=name%>]"
				<%}%>
				href="<%=href%>" target="<%=target%>" class="btn btn-link <%=namespace%>-control-<%=type%>"
				<% if(disabled === true){%>disabled<%}%>> 
				<span> <%= value %> </span>
			</a>
			<% if (group === "form") { %>
				<%if (hint !== "" && hint !== null){%>
					<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="bottom" title="<%=hint%>"></span>
				<%}%>						
			<% } %>
		</div>
    </div>
 </script>

 <script type="text/template" id="tpl-empty">
		<div class="form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> tpl-empty">
        </div>   
 </script>

 <script type="text/template" id="tpl-label-title">
	<div id="<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> <%=namespace%>-<%=mode%>-<%=type%>">
		<h4 id="form[<%=id%>]" name="form[<%=id%>]">
			<p class="<%=className[type]%>">
				<span class="textlabel"><%= label %></span>
			</p>
		</h4>				
	</div>
 </script>

 <script type="text/template" id="tpl-label-subtitle">
	<div id="<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> <%=namespace%>-<%=mode%>-<%=type%>">
		<h5 id="form[<%=id%>]" name="form[<%=id%>]">
			<p class="<%=className[type]%>">
				<span class="textlabel"><%= label %></span>
			</p>
		</h5>				
	</div>
 </script>

<script type="text/template" id="tpl-label">
	<div id="<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> <%if (group === 'form'){%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> <%}%> <%=namespace%>-<%=mode%>-<%=type%> pmdynaform-field">
		<% if(group === "form") {%>
			<label class="col-md-<%=colSpanLabel%> col-lg-<%=colSpanLabel%> control-label pmdynaform-label"> 
	        	<span class="textlabel"><%= label %></span>
	            <%if(required){%>
		  			<span class="pmdynaform-field-required">*</span>
		  		<%}%>
	        </label>
	    <%} else if((group !== "form") && (layout === "form")){%>
			<label class="hidden-lg hidden-md hidden-sm visible-xs control-label pmdynaform-label col-xs-<%=colSpanLabel%>">  
		  		<span class="textlabel"><%= label %></span>
		  	</label>
		<%}%>
		<div <%if (group === 'form'){ %> 
		  			class="col-md-<%=colSpanControl%> col-lg-<%=colSpanControl%> pmdynaform-field-control"
		  		<%} else if (layout === "form"){ %>
		  			class="col-xs-<%=colSpanControl%> col-sm-12 col-md-12 col-lg-12"
		  		<%} else if (layout === "responsive") {%> 
		  			class="col-xs-12 col-sm-12 col-md-12 col-lg-12"
		  		<%}%>>
			<div class="pmdynaform-label-options">
				<%if(originalType=="suggest"){%>
				<%}%>
				<%for(var k=0; k<fullOptions.length; k+=1){%>
					<span><%=fullOptions[k]%></span>
				<%}%>
				<input type="hidden" value="<%= data['label']%>"
					<% if  ( group === "grid") { %>
						id = "form<%=id%>"
						name ="form<%=name%>"
					<%} else{%>
						id = "form[<%=id%>]"
						name ="form[<%=name%>]"
					<%}%>
				>
				<input type="hidden" value="<%= data['label']%>"
					<% if  ( group === "grid") { %>
						id = "form<%=id%>_label"
						name ="form<%=name%>_label"
					<%} else{%>
						id = "form[<%=id%>_label]"
						name ="form[<%=name%>_label]"
					<%}%>
				>
			</div>
			<% if (group === "form") { %>
				<%if (hint !== "" && hint !== null){%>
					<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="bottom" title="<%=hint%>"></span>
				<%}%>						
			<% } %>
		</div>
	</div>
</script>

<script type="text/template" id="tpl-hidden">
		<div id="<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> pmdynaform-field">
			<input 	
				<% if  ( group === "grid") { %>
					id = "form<%=id%>"
					name ="form<%=name%>"
				<%} else{%>
					id = "form[<%=id%>]"
					name ="form[<%=name%>]"
				<%}%>
				class="<%=namespace%>-control-<%=type%> form-control" 
				type="hidden"
				value= "<%= value%>">
			<input type="hidden" value="<%= data['value']%>"
				<% if  ( group === "grid") { %>
					id = "form<%=id%>_label"
					name ="form<%=name%>_label"
				<%} else{%>
					id = "form[<%=id%>_label]"
					name ="form[<%=name%>_label]"
				<%}%>
		</div>
</script>

<script type="text/template" id="tpl-image">
	<div id="<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> <%=namespace%>-<%=mode%>-<%=type%> pmdynaform-field">
        <label for="<%=name%>" class="col-md-<%=colSpanLabel%> col-lg-<%=colSpanLabel%> control-label pmdynaform-label"> 
        	<span class="textlabel"><%= label %></span>
        </label>
        <div class="<%=namespace%>-control-<%=type%> col-md-<%=colSpanControl%> col-lg-<%=colSpanControl%> pmdynaform-field-control">
        	<p class="<%=namespace%>-control-<%=type%> control">
        		<img id="<%=id%>" name="<%=name%>" class="img-responsive <%=shape%>" src="<%=src%>" alt="<%=alt%>" scale="0">	
        		<span class="pmdynaform-image-comment text-primary"><%=comment%></span>
        	</p>
			<% if (group === "form") { %>
				<%if (hint !== "" && hint !== null){%>
					<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="bottom" title="<%=hint%>"></span>
				<%}%>						
			<% } %>
        </div>        
	</div>
</script>

<script type="text/template" id="tpl-audio">
	<audio class="embed-responsive-item" src="<%=path%>" width="200" height="200" autobuffer autoplay controls>
		<p>Your browser does not support the audio element </p>
	</audio>
</script>

<script type="text/template" id="tpl-video">
	<video class="embed-responsive-item" src="<%=path%>"  width="200" height="200" autoplay autobuffer controls>
		<p>Your browser does not support the video element </p>
	</video>
</script>

<script type="text/template" id="tpl-form">
	<div id="<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> <%=namespace%>-<%=mode%>-<%=type%> col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%>">
	</div>
</script>

<script type="text/template" id="tpl-loading">
	<div class="pmdynaform-form-message-loading">
	    <h3><%=title%></h3>
    	<div class="alert alert-warning" role="alert">
	    	<span class="glyphicon glyphicon-refresh glyphicon-refresh-animate"></span>
			 <strong><%=msg%></strong>
	     </div>
		
	</div>
	<div id="shadow-form"></div>
</script>

<script type='text/template' id='tpl-datetime2'>
    <div id='<%=id%>' name='field-<%=name%>' class='<%=namespace%>-field-<%=type%> <%=namespace%>-<%=mode%>-<%=type%> <%if (group === 'form'){%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> <%}%>'>
		<% if(group === 'form') {%>
            <label for='<%=name%>' class='col-md-<%=colSpanLabel%> col-lg-<%=colSpanLabel%> control-label pmdynaform-label'> 
				<span data-toggle='tooltip' data-placement='bottom' class="textlabel"><%= label %></span>
	            <%if(required){%>
		  			<span class='pmdynaform-field-required'>*</span>
		  		<%}%>
            </label>
        <%} else if((group !== 'form') && (layout === 'form')){%>
			<label for='<%=name%>' class='hidden-lg hidden-md hidden-sm visible-xs control-label pmdynaform-label col-xs-<%=colSpanLabel%>'>  
		  		<span class="textlabel"><%= label %></span>
		  	</label>
		<%}%>

		<div <%if (group === 'form'){ %> 
	  			class='col-md-<%=colSpanControl%> col-lg-<%=colSpanControl%> pmdynaform-field-control'
	  		<%} else if (layout === 'form'){ %>
	  			class='col-xs-<%=colSpanControl%> col-sm-12 col-md-12 col-lg-12'
	  		<%} else if (layout === 'responsive') {%> 
	  			class='col-xs-12 col-sm-12 col-md-12 col-lg-12'
	  		<%}%>>
			    <div class='datetime-container'>
					<div id ='datetime-container-control' class='input-group date' <%if (group === 'form'){ %> 
				  			class='form-control'
				  		<%} else if (layout === 'form'){ %>
				  			class='col-xs-<%=colSpanControl%> col-sm-12 col-md-12 col-lg-12'
				  		<%} else if (layout === 'responsive') {%> 
				  			class='col-xs-12 col-sm-12 col-md-12 col-lg-12'
				  		<%}%>>
				        <input type='text' class='form-control' 
							<% if  ( group === 'grid') { %>
								id = 'form<%=id%>'
								name ='form<%=name%>'
							<%} else{%>
								id = 'form[<%=id%>]'
								name ='form[<%=name%>]'
							<%}%>
				    			class='<%=namespace%>-control-<%=type%> form-control' 
				    			type='text'
				    			placeholder= '<%= placeholder %>'
								value= '<%= value%>'
				    			<% if(disabled === true){%>disabled<%}%>
				    			></input>
								<input type='hidden' 
									<% if  ( group === 'grid') { %>
										id = 'form<%=id%>_label'
										name ='form<%=name%>_label'
									<%} else{%>
										id = 'form[<%=id%>_label]'
										name ='form[<%=name%>_label]'
										value = '<%= data['label']%>'
									<%}%>
								>
				        <span class='input-group-addon'><span class='<%if (format === 'LT'){%>glyphicon glyphicon-time<%}else{%>glyphicon glyphicon-calendar<%}%>'>
					        </span>
				        </span>
				    </div>
			    </div>
				<% if (group === 'form') { %>
					<%if (hint !== "" && hint !== null){%>
						<span class='glyphicon glyphicon-info-sign' data-toggle='tooltip' data-placement='bottom' title='<%=hint%>'></span>
					<%}%>						
				<% } %>
			</div>
		</div>
</script>
<script type="text/template" id="tpl-grid">
	<div id="field-<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> <%=namespace%>-<%=mode%>-<%=type%> <%=layout%>">
		<div class="<%=namespace%>-<%=type%>-new">
			<p class="pmdynaform-grid-title"><span><%=title%></span>
				<%if (hint !== "" && hint !== null) {%>
					<span style="float:right; margin-left:30px;" class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="bottom" title="<%=hint%>"></span>
				<%}%>
			</p>
			<% if  ( mode !== "view" && mode !== "disabled") { %>
				<button type="button" class="glyphicon glyphicon-plus <%=namespace%>-<%=type%>-newitem btn btn-primary btn-sm">
				<span>New</span>
				</button>

			<%}%>
		</div>
		<div class="pmdynaform-grid-fields">
			<div class="pmdynaform-grid">
				<div class="row pmdynaform-grid-thead"></div>
				<div id="<%=id%>" <% if(pager) {%> class="carousel slide" data-ride="carousel" <%}%> >
					<div class="<% if(pager) {%>carousel-inner <%}%> pmdynaform-grid-tbody pmdynaform-form"></div>
					<%if (functions) {%>
						<div class="pmdynaform-grid-functions">
						</div>
					<%}%>
					<%if (pager) {%>
						<div class="pmdynaform-grid-pagination">
						</div>
					<%}%>
				</div>
			</div>
		</div>
	</div>
</script>

<script type="text/template" id="tpl-grid-pagination">
 	<ul class="pagination">
		<li><a data-target="#<%=id%>" data-slide-to="0" href="#">&laquo;</a></li>
		<%for (var i=0; i<paginationItems; i+=1) {%>
			<li <%if(i === 0){%>class="active"<%}%> ><a data-target="#<%=id%>" data-slide-to="<%=i%>" class="active" href=""><%=i+1%></a></li>
		<%}%>
		<li><a data-target="#<%=id%>" data-slide-to="<%=paginationItems-1%>" href="">&raquo;</a></li>
	</ul>
</script>

<script type="text/template" id="tpl-grid-totalcolumn">
	<%for(var j=0; j<totalrow.length; j+=1){%>
		<div class="col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%>">
			<span> <%= totalrow[j]? totalrow[j] : 0 %> </span>
		</div>
	<%}%>
</script>
<script type="text/template" id="tpl-map">
	<div id="<%=id%>" name="<%=name%>" class="pmdynaform-field-geomap <%=namespace%>-<%=mode%>-<%=type%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%>">
		<label class="col-lg-<%=colSpanLabel%> control-label pmdynaform-label"> 
        	<span data-toggle="tooltip" data-placement="bottom"><%= label %></span>
            <%if(required){%>
	  			<span class="pmdynaform-field-required">*</span>
	  		<%}%>
        </label>
        <div class="col-lg-<%=colSpanControl%>">
            <% if(fullscreen === true) {%>
                <div class="pmdynaform-map-fullscreen">
                    <button type="button">[...]</button>
                </div>
            <%}%>
            <% if(disabled === true) {%>
                <div class="pmdynaform-map-layer-disabled"></div>
            <%}%>
        	<div class="pmdynaform-map-canvas">
        	</div>
        	<%if (hint !== "" && hint !== null){%>
                <span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="bottom" title="<%=hint%>"></span>
			<%}%>
        </div>
	</div>
</script>
<script type="text/template" id="tpl-annotation">
	<div id="<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> alert alert-warning" role="alert">
		<span>
			<p class="<%=namespace%>-control-<%=type%>">
				<span><%= label %></span>
			</p>
		</span>				
	</div>
</script>
<script type="text/template" id="tpl-ext-scannercode">
	<div id="field-<%=id%>" name="field-<%=name%>" class="<%=namespace%>-field-<%=type%> <%if (group === 'form'){%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> <%}%> <%=namespace%>-<%=mode%>-<%=type%>">
		<% if(group === "form") {%>
			<label class="col-md-<%=colSpanLabel%> col-lg-<%=colSpanLabel%> control-label pmdynaform-label"> 
	        	<span><%= label %></span>
	            <%if(required){%>
		  			<span class="pmdynaform-field-required">*</span>
		  		<%}%>
	        </label>
	    <%} else if((group !== "form") && (layout === "form")){%>
			<label class="hidden-lg hidden-md hidden-sm visible-xs control-label pmdynaform-label col-xs-<%=colSpanLabel%>">  
		  		<span><%= label %></span>
		  	</label>
		<%}%>
		<div <%if (group === 'form'){ %> 
		  			class="col-md-<%=colSpanControl%> col-lg-<%=colSpanControl%>"
		  		<%} else if (layout === "form"){ %>
		  			class="col-xs-<%=colSpanControl%> col-sm-12 col-md-12 col-lg-12"
		  		<%} else if (layout === "responsive") {%> 
		  			class="col-xs-12 col-sm-12 col-md-12 col-lg-12"
		  		<%}%>>
		  		<scanner>
				<div class="pmdynaform-label-options">
							<span><%=value%></span>							
				</div>
				</scanner>
		  		<button type="button" class="btn btn-default btn-md">
				  	<span class="glyphicon glyphicon-qrcode"></span> <%=labelButton%>
				</button>
				
			<%if (hint !== "" && hint !== null){%>
				<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="bottom" title="<%=hint%>"></span>
			<%}%>
		</div>
	</div>
</script>


<script type="text/template" id="tpl-extfile-plus">	
	<div class="pmdynaform-file-containerimage">
		<buttonImage>	
		<span class= "pmdynaform-file-preview">
			<div class = "pmdynaform-file-resizeimage-plus">+
			</div>
		</span>
		</buttonImage>	
	</div>	
</script>
<script type="text/template" id="tpl-ext-signature">
	<div id="<%=id%>" name="<%=name%>" class="<%=namespace%>-field-<%=type%> <%if (group === 'form'){%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> <%}%> <%=namespace%>-<%=mode%>-<%=type%>">
	    <% if(group === "form") {%>
		    <label class="col-lg-<%=colSpanLabel%> control-label pmdynaform-label"> 
		    	<span><%= label %></span>
		        <%if(required){%>
		  			<span class="pmdynaform-field-required">*</span>
		  		<%}%>
		    </label>
		<%} else if((group !== "form") && (layout === "form")){%>
			<label class="hidden-lg hidden-md hidden-sm visible-xs control-label pmdynaform-label col-xs-<%=colSpanLabel%>">  
		  		<span><%= label %></span>
		  	</label>
		<%}%>
		<div <%if(group === 'form'){ %> class="pmdynaform-file-control col-lg-<%=colSpanControl%>" <%}%> >
			<div class="pmdynaform-geo-container">
				<button type="button" class="btn btn-default btn-md">
				  	<span class="glyphicon glyphicon-edit"></span> <%=labelButton%>
				</button>				
				<%if (hint !== "" && hint !== null){%>
					<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="bottom" title="<%=hint%>"></span>
				<%}%>								
				<%if(preview) {%>
					<div class="pmdynaform-ext-geo" style="height:<%=height%>;"></div>
				<% } %> 
			</div>
		</div>
	</div>
</script>
<script type="text/template" id="tpl-extgeo">
	<div id="<%=id%>" name="<%=name%>" class="<%=namespace%>-field-<%=type%> <%if (group === 'form'){%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> <%}%> <%=namespace%>-<%=mode%>-<%=type%>">
	    <% if(group === "form") {%>
		    <label class="col-lg-<%=colSpanLabel%> control-label pmdynaform-label"> 
		    	<span><%= label %></span>
		        <%if(required){%>
		  			<span class="pmdynaform-field-required">*</span>
		  		<%}%>
		    </label>
		<%} else if((group !== "form") && (layout === "form")){%>
			<label class="hidden-lg hidden-md hidden-sm visible-xs control-label pmdynaform-label col-xs-<%=colSpanLabel%>">  
		  		<span><%= label %></span>
		  	</label>
		<%}%>
		<div <%if(group === 'form'){ %> class="pmdynaform-file-control col-lg-<%=colSpanControl%>" <%}%> >
			<div class="pmdynaform-geo-container">
				<button type="button" class="btn btn-default btn-md">
				  	<span class="glyphicon glyphicon-map-marker"></span> <%=labelButton%>
				</button>				
				<%if (hint !== "" && hint !== null){%>
					<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="bottom" title="<%=hint%>"></span>
				<%}%>								
				<%if(preview) {%>
					<div class="pmdynaform-ext-geo" style="height:<%=height%>;"></div>
				<% } %> 
			</div>
		</div>
	</div>
</script>
<script type="text/template" id="tpl-extfile">
	<div id="<%=id%>" name="<%=name%>" class="<%=namespace%>-field-<%=type%> <%if (group === 'form'){%> form-group col-sm-<%=colSpan%> col-md-<%=colSpan%> col-lg-<%=colSpan%> <%}%> <%=namespace%>-<%=mode%>-<%=type%>">
	    <% if(group === "form") {%>
		    <label class="col-lg-<%=colSpanLabel%> control-label pmdynaform-label"> 
		    	<span><%= label %></span>
		        <%if(required){%>
		  			<span class="pmdynaform-field-required">*</span>
		  		<%}%>
		    </label>
		<%} else if((group !== "form") && (layout === "form")){%>
			<label class="hidden-lg hidden-md hidden-sm visible-xs control-label pmdynaform-label col-xs-<%=colSpanLabel%>">  
		  		<span><%= label %></span>
		  	</label>
		<%}%>
		<div <%if(group === 'form'){ %> class="pmdynaform-file-control" <%}%> >
			<div class="pmdynaform-file-container">
				<button type="button" class="<%=namespace%>-control-<%=type%> form-control" style="display:none">
					<%=labelButton%>
				</button>
				<input type="file" style="display:none;"
					<% if(disabled === true){%>disabled<%}%>
					<% if(multiple === true){%>multiple<%}%>
				>
				<%if (hint !== "" && hint !== null){%>
					<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="bottom" title="<%=hint%>"></span>
				<%}%>
				<div name="button-all" class="btn-group btn-group-justified" style="display: none;">
					<div class="pmdynaform-file-buttonup btn-group">
						<button class="glyphicon glyphicon-upload btn btn-success btn-sm">
						UPLOAD ALL
						</button>
					</div>
					<div class="pmdynaform-file-buttoncancel btn-group" style="display: none;">
						<button class="glyphicon glyphicon-remove btn btn-danger btn-sm">
						CANCEL ALL
						</button>
					</div>
					<div class="pmdynaform-file-buttonremove btn-group">
						<button class="glyphicon glyphicon-trash btn btn-danger btn-sm">
						REMOVE ALL
						</button>
					</div>						
				</div>
				<% if(dnd) {%>
					<p style="float:left;" class="help-block"><%=dndMessage%></p>
				<%}%>
				
					<div class="pmdynaform-file-droparea-ext"></div>
				
			</div>
		</div>
	</div>
</script>


<script type="text/template" id="tpl-extvideo">
	<div id="<%=id%>" class="pmdynaform-file-containervideo">
		<div id="<%=id%>" class ="pmdynaform-file-nameaudio">
			<span><%=name%></span>
		</div>
		<div class="btn-group btn-group-justified" style="display:none">
	<div class="pmdynaform-file-buttonup btn-group"><button class="glyphicon glyphicon-upload btn btn-success btn-sm"></button></div><div class="pmdynaform-file-buttoncancel btn-group" style="display: none;"><button class="glyphicon glyphicon-remove btn btn-danger btn-sm"></button></div><div class="pmdynaform-file-buttonview btn-group"><button class="glyphicon glyphicon-zoom-in btn btn-primary btn-sm"></button></div><div class="pmdynaform-file-buttonremove btn-group"><button class="glyphicon glyphicon-trash btn btn-danger btn-sm"></button></div></div>

	<span id="<%=id%>" class="pmdynaform-file-preview" style="float: left;">
    	<div class="pmdynaform-file-resizevideo"> 

		</div>
	</span>
</div>
</script>



<script type="text/template" id="tpl-extaudio">
	<div id="<%=id%>" class="pmdynaform-file-containeraudio">
		<div id="<%=id%>" class ="pmdynaform-file-nameaudio">
			<span><%=name%></span>
		</div>
		<div class="btn-group btn-group-justified" style="display:none">
	<div class="pmdynaform-file-buttonup btn-group"><button class="glyphicon glyphicon-upload btn btn-success btn-sm"></button></div><div class="pmdynaform-file-buttoncancel btn-group" style="display: none;"><button class="glyphicon glyphicon-remove btn btn-danger btn-sm"></button></div><div class="pmdynaform-file-buttonview btn-group"><button class="glyphicon glyphicon-zoom-in btn btn-primary btn-sm"></button></div><div class="pmdynaform-file-buttonremove btn-group"><button class="glyphicon glyphicon-trash btn btn-danger btn-sm"></button></div></div>
	
    	<div class="pmdynaform-file-resizevideo">
    		
		</div>
	
</div>
</script>



<script type="text/template" id="tpl-extfile-plus-audio">	
	<div class="pmdynaform-file-containerimage">
		<buttonImage>	
		<span class= "pmdynaform-file-preview">
			<div class = "pmdynaform-file-resizeaudio-plus">
			<span class="glyphicon glyphicon-play-circle" style="margin:5px"></span>
			</div>
		</span>
		</buttonImage>	
	</div>	
</script>

<script type="text/template" id="tpl-extfile-plus-video">	
	<div class="pmdynaform-file-containerimage">
		<buttonImage>	
		<span class= "pmdynaform-file-preview">
			<div class = "pmdynaform-file-resizeaudio-plus">
			<span class="glyphicon glyphicon-film" style="margin:5px"></span>
			</div>
		</span>
		</buttonImage>	
	</div>	
</script>

<script type="text/template" id="tpl-extfile-plus-image">	
	<div class="pmdynaform-file-containerimage">
		<buttonImage>	
		<span class= "pmdynaform-file-preview">
			<div class = "pmdynaform-file-resizeaudio-plus">
			<span class="glyphicon glyphicon-picture" style="margin:5px"></span>
			</div>
		</span>
		</buttonImage>	
	</div>	
</script>


<script type="text/template" id="tpl-media-video">
	<div id="<%=id%>" class="pmdynaform-media-videoContainer">			
	    <video src="<%=src%>" preload="none" controls="true">	       
			<p>Your browser does not support the video tag.</p>
		</video>
			<div class="pmdynaform-media-caption"></div>
			<div class="pmdynaform-media-control" display="none">
				<div class="pmdynaform-media-btmControl">
					<div class="btnPlay btn" title="Play/Pause video">
					<span class="glyphicon glyphicon-play"></span>
					</div>
					<div class="pmdynaform-media-progress-bar">
						<div class="pmdynaform-media-progress-external">
						</div>
						<div class="pmdynaform-media-progress">
							<span class="pmdynaform-media-bufferBar"></span>
							<span class="pmdynaform-media-timeBar"></span>
						</div>
						<div class="pmdynaform-media-progress-external">
						</div>
					</div>					
					<div class="sound sound2 btn" title="Mute/Unmute sound">
						<span class="glyphicon glyphicon-volume-up"></span></div>
					<div class="btnFS btn" title="Switch to full screen">
						<span class="glyphicon glyphicon-fullscreen"></span>
					</div>
				</div>
				
			</div>
		</div>
</script>



<script type="text/template" id="tpl-media-audio">
	<div id="<%=id%>" class="pmdynaform-media-audioContainer">			
	    <audio id="<%=id%>" preload="auto"  >
	    	<source src="<%=src%>" type="audio/mp3">  					
			<source src="<%=src%>" type="audio/m4a">  								
	    	<p>Your browser does not support the video tag.</p>
		</audio>
			<div class="pmdynaform-media-caption"></div>
			<div class="pmdynaform-media-control">
				<div class="pmdynaform-media-btmControl">
					<div class="btnPlay btn" title="Play/Pause video">
						<span class="glyphicon glyphicon-play"></span></div>
					<div class="pmdynaform-media-progress-bar">
						<div class="pmdynaform-media-progress-external">
						</div>
						<div class="pmdynaform-media-progress">
							<span class="pmdynaform-media-bufferBar"></span>
							<span class="pmdynaform-media-timeBar"></span>
						</div>
						<div class="pmdynaform-media-progress-external">
						</div>						
					</div>					
					<div class="sound sound2 btn" title="Mute/Unmute sound">
						<span class="glyphicon glyphicon-volume-up"></span></div>
					<div class="btnFS btn" title="Switch to full screen">
						<span class="glyphicon glyphicon-fullscreen"></span>
					</div>
				</div>
				
			</div>
		</div>
</script>
		<script type="text/javascript" src="js/pmDynaform.min.js"></script>
	<script type="text/javascript" src="appBuild.js"></script>
</body>
</html>