modified import.php file + js lib

admin/import.php

@@ -1,32 +1,6 @@
 <?php 
 /**
  * Import a sample from a Headered CSV file
- *
- *
- *	This file is part of queXS
- *	
- *	queXS is free software; you can redistribute it and/or modify
- *	it under the terms of the GNU General Public License as published by
- *	the Free Software Foundation; either version 2 of the License, or
- *	(at your option) any later version.
- *	
- *	queXS is distributed in the hope that it will be useful,
- *	but WITHOUT ANY WARRANTY; without even the implied warranty of
- *	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- *	GNU General Public License for more details.
- *	
- *	You should have received a copy of the GNU General Public License
- *	along with queXS; if not, write to the Free Software
- *	Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA  02110-1301  USA
- *
- *
- * @author Adam Zammit <adam.zammit@deakin.edu.au>
- * @copyright Deakin University 2007,2008
- * @package queXS
- * @subpackage admin
- * @link http://www.deakin.edu.au/dcarf/ queXS was writen for DCARF - Deakin Computer Assisted Research Facility
- * @license http://opensource.org/licenses/gpl-2.0.php The GNU General Public License (GPL) Version 2
- * 
  */
 
 /**
@@ -44,11 +18,30 @@ include ("../functions/functions.xhtml.php");
  */
 include("../functions/functions.import.php");
 
+$css = array(
+"../include/bootstrap-3.3.2/css/bootstrap.min.css", 
+"../include/bootstrap-3.3.2/css/bootstrap-theme.min.css",
+"../include/font-awesome-4.3.0/css/font-awesome.css",
+"../css/bootstrap-switch.min.css",
+"../css/custom.css"
+			);
+$js_head = array(
+"../js/jquery-2.1.3.min.js",
+"../include/bootstrap-3.3.2/js/bootstrap.min.js",
+"../js/bootstrap-switch.min.js"
+				);
+$js_foot = array(
+"../js/bootstrap-filestyle.min.js",
+"../js/custom.js"
+				);
 				
 if (isset($_POST['import_form']))
 {
 	//form has been submitted
-	xhtml_head(T_("Import: Validating and uploading"));
+	$subtitle = T_("Validating and uploading");
+	xhtml_head(T_("Import sample") . ":",true,$css,$js_head,false,false,false,$subtitle);
+	echo "<a href='?' class='btn btn-default pull-left' ><i class='fa fa-chevron-left fa-lg text-primary'></i>&emsp;" . T_("Go back") . "</a>";
+
 
 	//verify each GET field is unique (except import_form)
 	$sfields = array();
@@ -64,66 +57,102 @@ if (isset($_POST['import_form']))
 	{	//verified so upload
 		if (import_file($_POST['filename'],$description,$sfields))
 		{
-			print "<p>" . T_("Successfully imported file") . "</p>";
+			print "<div class='well text-primary col-md-offset-2'><p>" . T_("Successfully imported sample") . "&emsp;<h3>$description</h3></p></div>";
 		}
 		else
 		{
-			print "<p>" . T_("Error importing file. Please try again") . "</p>";
+			print -"<div class='alert alert-danger col-md-offset-2'><p>" . T_("Error importing file. Please try again") . "</p></div>";
 		}
 	}
 	else
-		print "<p>" . T_("Error:") . " $error </p><p>" . T_("Please go back in your browser and fix the problem") . "</p>";
+		print "<div class='alert alert-danger col-md-offset-2'><p>" . T_("Error:") . " $error </p><p>" . T_("Please go back in your browser and fix the problem") . "</p></div>";
 
 	//verifiy that exactly one primary phone number is selected
 	//upload to database
 
-	xhtml_foot();
+	xhtml_foot($js_foot);
 
 }
 else if (isset($_POST['import_file']))
 {
 	//file has been submitted
+	$subtitle = T_("Select columns to import");
+	xhtml_head(T_("Import sample") . ":",true,$css,$js_head,false,false,false,$subtitle);
+	echo "<a href='' onclick='history.back();return false;' class='btn btn-default pull-left' ><i class='fa fa-chevron-left fa-lg text-primary'></i>&emsp;" . T_("Go back") . "</a>";
 	
-	xhtml_head(T_("Import: Select columns to import"));
+	
-	?>
+	print "<form action='' method='post' class='col-md-10 form-group col-md-offset-1'>"; 
-	<form action="" method="post">
-	<?php 
 
 	$tmpfname = tempnam(TEMPORARY_DIRECTORY, "FOO");
 	move_uploaded_file($_FILES['file']['tmp_name'],$tmpfname);
 
 	display_table(get_first_row($tmpfname));
 
-
-
 	?>
 	<p><input type="hidden" name="description" value="<?php  if (isset($_POST['description'])) print($_POST['description']); ?>"/></p>
-	<p><input type="hidden" name="filename" value="<?php  echo $tmpfname; ?>"/></p>
+	<input type="hidden" name="filename" value="<?php  echo $tmpfname; ?>"/>
-	<p><input type="submit" name="import_form"/></p>
+	<div class="form-group">
+		<label class="col-md-4 control-label" for="submit"></label>
+		<div class="col-md-4">
+			<button id="submit" type="submit" name="import_form" class="btn btn-primary"><i class="fa fa-plus-square-o fa-lg"></i>&emsp;<?php  echo T_("Add sample"); ?></button>
+		</div>
+	</div>
+	
 	</form>
 	
-	<?php 
+<script type="text/javascript">
-	xhtml_foot();
+$('[switch="yes"]').bootstrapSwitch()
+</script>
 
+	<?php 
+	xhtml_foot($js_foot);
 }
 else
 {
 	//need to supply file to upload
-	xhtml_head(T_("Import: Select file to upload"));
+	$subtitle = T_("Select file to upload");
+	xhtml_head(T_("Import sample") .":",true,$css,$js_head,false,false,false,$subtitle);
+	echo "<a href='' onclick='history.back();return false;' class='btn btn-default'><i class='fa fa-chevron-left fa-lg text-primary'></i>&emsp;" . T_("Go back") . "</a>";
+
+	$ua = $_SERVER['HTTP_USER_AGENT'];
+	if (preg_match('/Firefox/i', $ua)) $csv= "text/csv"; else $csv= ".csv";
+	//print "ua=" . $_SERVER['HTTP_USER_AGENT'];
 	?>
 
-	<form enctype="multipart/form-data" action="" method="post">
+	<form class="form-horizontal col-sm-12" enctype="multipart/form-data" action="" method="post">
-	<p><input type="hidden" name="MAX_FILE_SIZE" value="1000000000" /></p>
+	<fieldset>
-	<p><?php  echo T_("Choose the CSV sample file to upload:"); ?><input name="file" type="file" /></p>
+	
-	<p><?php  echo T_("Description for file:"); ?><input name="description" type="text" /></p>
+	<input type="hidden" name="MAX_FILE_SIZE" value="1000000000" />
-	<p><input type="submit" name="import_file" value="<?php  echo T_("Add sample"); ?>"/></p>
+	
+	<!-- File Button --> 
+	<div class="form-group">
+	
+		<label class="col-md-4 control-label" for="file"><?php  echo T_("Choose the CSV sample file to upload:"); ?></label>
+		<div class="col-md-4">
+			<input id="file" name="file" class="filestyle"  data-buttonBefore="true" data-iconName="fa fa-folder-open fa-lg text-primary " data-buttonText="<?php  echo T_("Select file"); ?>" type="file" accept="<?php echo $csv; ?>" />
+		</div>
+	</div>
+
+	<!-- Text input-->
+	<div class="form-group">
+		<label class="col-md-4 control-label" for="description"><?php  echo T_("Sample description :"); ?></label>  
+		<div class="col-md-4">
+			<input id="description" name="description" type="text" placeholder="<?php  echo T_("Enter new sample name..."); ?>" class="form-control input-md">
+		</div>
+	</div>
+	
+	<!-- Button -->
+	<div class="form-group">
+		<label class="col-md-4 control-label" for="submit"></label>
+		<div class="col-md-4">
+			<button id="submit" type="submit" name="import_file" class="btn btn-primary"><i class="fa fa-plus-square-o fa-lg"></i>&emsp;<?php  echo T_("Add sample"); ?></button>
+		</div>
+	</div>
+
+	</fieldset>
 	</form>
 
-	<?php 
+<?php 
-	xhtml_foot();
+xhtml_foot($js_foot);
-
 }
-
-
-
 ?>

js/bootstrap-filestyle.min.js

@@ -0,0 +1 @@
+(function(c){var b=function(d,e){this.options=e;this.$elementFilestyle=[];this.$element=c(d)};b.prototype={clear:function(){this.$element.val("");this.$elementFilestyle.find(":text").val("");this.$elementFilestyle.find(".badge").remove()},destroy:function(){this.$element.removeAttr("style").removeData("filestyle").val("");this.$elementFilestyle.remove()},disabled:function(d){if(d===true){if(!this.options.disabled){this.$element.attr("disabled","true");this.$elementFilestyle.find("label").attr("disabled","true");this.options.disabled=true}}else{if(d===false){if(this.options.disabled){this.$element.removeAttr("disabled");this.$elementFilestyle.find("label").removeAttr("disabled");this.options.disabled=false}}else{return this.options.disabled}}},buttonBefore:function(d){if(d===true){if(!this.options.buttonBefore){this.options.buttonBefore=true;if(this.options.input){this.$elementFilestyle.remove();this.constructor();this.pushNameFiles()}}}else{if(d===false){if(this.options.buttonBefore){this.options.buttonBefore=false;if(this.options.input){this.$elementFilestyle.remove();this.constructor();this.pushNameFiles()}}}else{return this.options.buttonBefore}}},icon:function(d){if(d===true){if(!this.options.icon){this.options.icon=true;this.$elementFilestyle.find("label").prepend(this.htmlIcon())}}else{if(d===false){if(this.options.icon){this.options.icon=false;this.$elementFilestyle.find(".glyphicon").remove()}}else{return this.options.icon}}},input:function(e){if(e===true){if(!this.options.input){this.options.input=true;if(this.options.buttonBefore){this.$elementFilestyle.append(this.htmlInput())}else{this.$elementFilestyle.prepend(this.htmlInput())}this.$elementFilestyle.find(".badge").remove();this.pushNameFiles();this.$elementFilestyle.find(".group-span-filestyle").addClass("input-group-btn")}}else{if(e===false){if(this.options.input){this.options.input=false;this.$elementFilestyle.find(":text").remove();var d=this.pushNameFiles();if(d.length>0&&this.options.badge){this.$elementFilestyle.find("label").append(' <span class="badge">'+d.length+"</span>")}this.$elementFilestyle.find(".group-span-filestyle").removeClass("input-group-btn")}}else{return this.options.input}}},size:function(d){if(d!==undefined){var f=this.$elementFilestyle.find("label"),e=this.$elementFilestyle.find("input");f.removeClass("btn-lg btn-sm");e.removeClass("input-lg input-sm");if(d!="nr"){f.addClass("btn-"+d);e.addClass("input-"+d)}}else{return this.options.size}},buttonText:function(d){if(d!==undefined){this.options.buttonText=d;this.$elementFilestyle.find("label span").html(this.options.buttonText)}else{return this.options.buttonText}},buttonName:function(d){if(d!==undefined){this.options.buttonName=d;this.$elementFilestyle.find("label").attr({"class":"btn "+this.options.buttonName})}else{return this.options.buttonName}},iconName:function(d){if(d!==undefined){this.$elementFilestyle.find(".glyphicon").attr({"class":".glyphicon "+this.options.iconName})}else{return this.options.iconName}},htmlIcon:function(){if(this.options.icon){return'<span class="glyphicon '+this.options.iconName+'"></span>&emsp;'}else{return""}},htmlInput:function(){if(this.options.input){return'<input type="text" class="form-control '+(this.options.size=="nr"?"":"input-"+this.options.size)+'" disabled> '}else{return""}},pushNameFiles:function(){var d="",f=[];if(this.$element[0].files===undefined){f[0]={name:this.$element[0]&&this.$element[0].value}}else{f=this.$element[0].files}for(var e=0;e<f.length;e++){d+=f[e].name.split("\\").pop()+", "}if(d!==""){this.$elementFilestyle.find(":text").val(d.replace(/\, $/g,""))}else{this.$elementFilestyle.find(":text").val("")}return f},constructor:function(){var h=this,f="",g=h.$element.attr("id"),d=[],i="",e;if(g===""||!g){g="filestyle-"+c(".bootstrap-filestyle").length;h.$element.attr({id:g})}i='<span class="group-span-filestyle '+(h.options.input?"input-group-btn":"")+'"><label for="'+g+'" class="btn '+h.options.buttonName+" "+(h.options.size=="nr"?"":"btn-"+h.options.size)+'" '+(h.options.disabled?'disabled="true"':"")+">"+h.htmlIcon()+h.options.buttonText+"</label></span>";f=h.options.buttonBefore?i+h.htmlInput():h.htmlInput()+i;h.$elementFilestyle=c('<div class="bootstrap-filestyle input-group">'+f+"</div>");h.$elementFilestyle.find(".group-span-filestyle").attr("tabindex","0").keypress(function(j){if(j.keyCode===13||j.charCode===32){h.$elementFilestyle.find("label").click();return false}});h.$element.css({position:"absolute",clip:"rect(0px 0px 0px 0px)"}).attr("tabindex","-1").after(h.$elementFilestyle);if(h.options.disabled){h.$element.attr("disabled","true")}h.$element.change(function(){var j=h.pushNameFiles();if(h.options.input==false&&h.options.badge){if(h.$elementFilestyle.find(".badge").length==0){h.$elementFilestyle.find("label").append(' <span class="badge">'+j.length+"</span>")}else{if(j.length==0){h.$elementFilestyle.find(".badge").remove()}else{h.$elementFilestyle.find(".badge").html(j.length)}}}else{h.$elementFileLine truncated