Файл: CloudBox-main/doc/index.html
Строк: 821
<?php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<title>CloudBox - Online File Management System</title>
<!-- theme -->
<link href="css/rockox.css" rel="stylesheet">
<!-- animation -->
<link href="css/animate.css" rel="stylesheet">
<!-- piecharts -->
<link rel="stylesheet" href="css/pie-charts-style.css">
<!-- Add fancyBox -->
<link rel="stylesheet" href="css/jquery.fancybox.css?v=2.1.5" media="screen">
<!-- jcarousel styling -->
<link rel="stylesheet" href="css/skin.css">
<!-- Bootstrap -->
<link href="css/bootstrap.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="fixed-header" data-spy="scroll" data-target=".navbar">
<div id="wrapper">
<!-- BEGIN HEADER -->
<header id="home">
<nav class="navbar navbar-default" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!-- BEGIN LOGO -->
<a class="navbar-brand" href="#home"><img src="images/logo.png" alt=""></a>
<!-- END LOGO -->
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<!-- BEGIN NAVIGATION -->
<ul class="nav navbar-nav">
<li class="active"><a href="#documenter_cover">Start</a></li>
<li><a href="#explanation">Explanation</a></li>
<li><a href="#installation">Installation</a></li>
<li><a href="#howtouse">How to use</a></li>
<li><a href="#update">Update</a></li>
<li><a href="#support">Support</a></li>
<li><a href="#credits">Credits</a></li>
<li><a href="#thanks">Thanks</a></li>
</ul>
<!-- END NAVIGATION -->
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
</header>
<!-- END HEADER -->
<!-- BEGIN documenter_cover SECTION -->
<section class="services-sec gray-bg border" id="documenter_cover">
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<section id="documenter_cover"><h1>CloudBox - Online File Management System</h1><h2>Build your own File Management System By Atique IT.</h2><hr><ul><li>Created: 06-April-2015</li><li>Updated: 27-june-2016</li><li>By: Atique IT</li><li><a href=""></a></li><li>Email: <a href="mailto:">info@atique-it.com</a></li></ul><p>Thank you for purchasing my product. If you have any questions that are beyond the scope of this help file please feel free to contact me at <a href="http://atique-it.com/">Atique IT</a>. Thanks again for purchasing one of my products!</p></section>
</div>
</div>
</div>
<div class="clearfix"></div>
</section>
<!-- END documenter_cover SECTION -->
<!-- BEGIN explanation SECTION -->
<section class="no-padding-bottom experience" id="explanation">
<div class="container-fluid">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<section id="explanation">
<h2 class="text-center">Explanation</h2><hr class="notop">
<p>
<strong> CloudBox - Online File Management System</strong></p>
<p>Features:</p>
<ol style="margin-left:20px ! important;">
<li>Twitter Bootstrap design</li>
<li>Cross browser pass</li>
<li>100% Object Oriented(CodeIgniter)</li>
<li>Seo friendly URL</li>
<li>Auto pagination</li>
<li>Captcha integration</li>
<li>Public profiles</li>
<li>View timestamps when users login</li>
<li>Custom user profiles</li>
<li>User can upload their own avatar (can be disabled in admin panel)</li>
<li>Social icons used to link to your other sites and sections</li>
<li>Each can be disabled in the admin panel if you do not need them to be displayed</li>
<li>Multiple user levels per user (Admin, Special, User)</li>
<li>Login expiration – Control default time before a user is logged out</li>
<li>Modal forgotten password screen</li>
<li>Email activation – Avoid false signup!</li>
<li>My Account (“Settings”) page</li>
<li>Extremely easy to integrate using our Install Wizard</li>
<li>Reliable and secure MySQL database backend</li>
<li>Automatic HTML5 & PHP field validation</li>
<li>Unlimited folder creation</li>
<li>Added subfolders functionality</li>
<li>Drag and drop multiple file upload </li>
<li>Update and delete folder</li>
<li>Unlimited file upload in every folder</li>
<li>Update and delete file</li>
<li>Short folder by user</li>
<li>Fully organized folder and file report</li>
<li>Forgotten password reset</li>
<li>Integrated FREE Simple Contact Form </li>
<li>Auto Sortable columns</li>
<li>Auto Pagination</li>
<li>Mailbox System allows users on your system to send messages to each other</li>
<li>Easy to reply email</li>
<li>Get notifications when you receive new mail</li>
<li>Users can delete mail</li>
<li>Block list & Suspend list allows users to block other users from contacting them</li>
<li>Customize the access, denied, register, forget password, activation link messages</li>
<li>View list of recently registered users</li>
<li>Search through all users</li>
<li>Add new user manually</li>
<li>Reset any user’s password</li>
<li>Edit any user’s level or access</li>
<li>View list of user</li>
<li>Supper admin can change site name, site email and site logo</li>
</ol>
<p >
Browser compatibility:</p>
<figure style="margin-top: 0px; margin-right: 20px; margin-bottom: 20px; margin-left: 0px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; padding-left: 10px; outline-width: 0px; outline-style: initial; outline-color: initial; display: block; background-image: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: rgb(244, 244, 244); border-top-width: 2px; border-right-width: 2px; border-bottom-width: 2px; border-left-width: 2px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(206, 205, 205); border-right-color: rgb(206, 205, 205); border-bottom-color: rgb(206, 205, 205); border-left-color: rgb(206, 205, 205); border-top-left-radius: 5px 5px; border-top-right-radius: 5px 5px; border-bottom-right-radius: 5px 5px; border-bottom-left-radius: 5px 5px; float: left; text-align: center; -webkit-transition-property: border; -webkit-transition-duration: 200ms; -webkit-transition-timing-function: ease; -webkit-transition-delay: initial; background-position: initial initial; background-repeat: initial initial; "><img alt="img" height="35" src="assets/images/image_2.png" style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; outline-width: 0px; outline-style: initial; outline-color: initial; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; " width="220"></figure>
<p class="clear"></p><br/><br/><br/><br/>
<p style="float:left:clear:both;">
CloudBox - Online File Management System will run in on all modern browsers. However you need JavaScript enabled to run the website smooth.</p>
<p >
</section>
</div>
</div>
</div>
</section>
<!-- END explanation SECTION -->
<!-- BEGIN installation SECTION -->
<section class="piecharts no-margin-bottom" id="installation" data-stellar-background-ratio="-0.2">
<div class="overlay"></div>
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<section id="installation">
<h2>Installation</h2><hr class="notop">
<h3>
Installation CloudBox - Online File Management System v2.0.0</h3>
<p>
Please follow all the steps carefully...</p>
<ol>
<li>
Download the file which you have purchased </li>
<li>
Upload Zip File in your server</li>
<li>
Extract the Zip file that you uploaded </li>
<li>
Create a Database using hosting database wizard</li>
<li>
Now Go to your Browser and Check http://www.<b>yourdomain</b>.com/install</li>
<li>Finally Click <b>Finish</b> Button. (Now you will redirect to Sing In Page)</li>
<br/><br/><img src="img/n2.png"alt="installation"><br/><br/>
<li>Now Give Your Email address(That is your user name) and password. Click Sing In Button. Now You can see dashboard.Here You can personalize what you want. </li>
</ol>
<p style="color: red;"><strong>Note: </strong>If you using any <strong>folder</strong> location in your hosting to install this script, then you need some extra change in root <strong>(.htaccess) file</strong> on line number 3. You can open to edit this file on Notepad or Notepad++. Here will be adding your </strong>folder name</strong> as below picture: </p>
<br/><br/><img src="img/22.png" alt="HTML Structure" />
<br/><br/>
</section>
</div>
</div>
</div>
</section>
<!-- END installation SECTION -->
<!-- BEGIN howtouse SECTION CONTAINER -->
<section class="tri-secs gray-bg border services-sec" id="howtouse">
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<section id="howtouse">
<h2>How to use</h2><hr class="notop">
<h3>
Follow the instraction below </h3>
<ol>
<li>http://yourdomain.com/ visit this link. you will get sing up from. fill up all information (first name, last name, email address, password etc.) </li>
<br/><br/><img src="img/n1.png"alt="sign up from " ><br/><br/>
<li>
Now check your email address and click activation link.
</li>
<li>
Enter your email and password and click sing In button. Now you can see the dashboard.
</li>
<br/><br/><img src="img/dashboard.PNG"alt="log in "><br/><br/>
<li> click my account you can change your personal information, upload your image, update password and add social media link from top the right side. </li>
<br/><br/><img src="img/10.png"alt="account information"><br/><br/>
<li>
When you click file directory then you can see the dahsboard like below
</li>
<br/><br/><img src="img/12.png"alt="folder dashboard"><br/><br/>
<li>
you can create your folder by clicking "create folder" button
</li>
<br/><br/><img src="img/13.png"alt="album dashboard"><br/><br/>
<li>After enter in a folder when you click upload file button, you can see the page like below. you can upload your file from Browse button</li>
<br/><br/><img src="img/14.png"alt="album dashboard"><br/><br/>
<li>
If You want to edit work space of user then click lavel and then edit.
</li>
<br/><br/><img src="img/11.png"alt="edit admin lavel"><br/><br/>
<li>
you can write mail and send mail from compose mail
</li>
<br/><br/><img src="img/18.png"alt="edit admin lavel"><br/><br/>
<li>
You can check your mail by clicking inbox.
</li>
<br/><br/><img src="img/19.png"alt="edit admin lavel"><br/><br/>
<li>
You can check Send mail from here
</li>
<br/><br/><img src="img/21.png"alt="edit admin lavel"><br/><br/>
<li>
You can change or edit company logo and company name. You can also upload favicon form here.
</li>
<br/><br/><img src="img/23.png"alt="edit admin lavel"><br/><br/>
</ol>
</section>
</div>
</div>
</div>
</section>
<!-- END howtouse SECTION CONTAINER -->
<!-- BEGIN update CONTAINER -->
<section class="team services-sec" id="update">
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<section id="update">
<h2>Update</h2><hr class="notop">
<p style="color:#F00;">If you are use <b>CloudBox - Online File Management System v2.0.0</b> this version please ignore this process. </p>
<h3>
Update guide - CloudBox - Online File Management System v2.0.0</h3>
<p>
If You are using "CloudBox - Online File Management System v1.0.0" and if you want to update on "CloudBox - Online File Management System v2.0.0" then go to this <b><a href="http://miu.atiqueit.com/cloud.zip">http://miu.atiqueit.com/cloud.zip</a></b> and download the zip file and follow the instraction.<br>
Step-1: Extract cloud.zip file then you will get the update.php file<br>
Step-2: Copy update.php file and paste the file in your project root.<br>
Step-3: Now login your script, run http://yourdomain.com/update.php</b><br>
Step-4: when your address ber will stop reloading then you can see the update message on your update menu under setting.
</p>
<h5>Version 2.0.0 – 19 November 2015</h5>
<pre>
- Some simple bug fix.
</pre>
<h5>Version 1.1.0 – 06 April 2015</h5>
<pre>
- File management bug fix
- Same name of file management.
- Some simple bug fix.
- Added some new extension to upload your file.
</pre>
<h5>Version 1.0.1 – 04 April 2015</h5>
<pre>
- User Access Control bug fix
- Quick update option to next version bug fix.
- Some simple bug fix.
- Some style problem fix.
- Added some new extension to upload your file.
</pre>
<h5><strong>Version 1.0.0 – 09 March 2015</h5>
<pre>
- Initial release.
</pre>
</section>
</div>
</div>
</div>
</section>
<!-- END update CONTAINER -->
<!-- BEGIN support CONTAINER -->
<section class="tables services-sec" data-stellar-background-ratio="-0.2" id="support">
<div class="overlay"></div>
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<section id="support">
<h3>Support</h3><hr class="notop">
<p>
With purchasing the Multiple File Uploader you will get first class support! Please feel free to contact me by email at any time if you run into problems.</p>
<p>
You need to confirm your purchase from codecanyon.net to get any support.</p>
<strong>Email Us: <a href="mailto:info@atique-it.com">info@atique-it.com</a></strong>
</section>
</div>
</div>
</div>
</section>
<!-- END support CONTAINER -->
<!-- BEGIN credits CONTAINER -->
<section class="portfolio no-padding-bottom services-sec" id="credits">
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<section id="credits">
<h3>Credits</h3><hr class="notop">
<h2>Credit Goes to...</h2>
<ol>
<li><a href="http://www.codeigniter.com/">CodeIgniter</a></li>
<li><a href="http://getbootstrap.com/">Bootstrap</a></li>
<li><a href="http://jquery.com/">jQuary</a></li>
<li><a href="http://nicedit.com/">NiceEdit</a></li>
</ol>
</section>
</div>
</div>
</div>
</section>
<!-- END credits CONTAINER -->
<!-- BEGIN thanks CONTAINER -->
<section class="our-clients services-sec" id="thanks" data-stellar-background-ratio="-0.2">
<div class="overlay"></div>
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<section id="thanks">
<h3>Thanks</h3><hr class="notop">
<p>
We want to say thank for purchasing our CloudBox - Online File Management System. I hope you enjoy the product!</p>
</section>
</div>
</div>
</div>
</section>
<!-- END thanks CONTAINER -->
<!-- BEGIN FOOTER -->
<footer>
<div class="container">
<!-- BEGIN SOCIAL -->
<ul class="social">
<li class="bounceIn" data-delay="0"><a href="https://www.facebook.com/atiqueit"><i class="fa fa-facebook"></i></a></li>
<li class="bounceIn" data-delay="100"><a href="https://twitter.com/AtiqueIT"><i class="fa fa-twitter"></i></a></li>
<li class="bounceIn" data-delay="200"><a href="https://plus.google.com/+AtiqueitBD"><i class="fa fa-google-plus"></i></a></li>
<li class="bounceIn" data-delay="400"><a href="https://www.linkedin.com/company/atique-it?trk=top_nav_home"><i class="fa fa-linkedin"></i></a></li>
</ul>
<!-- BEGIN SOCIAL -->
<!-- BEGIN COPYRIGHT -->
<p class="copyright">Copyright <a href="atique-it.com">Atique IT</a> 2016<br>
made with the Documenter v2.0.0</p>
<!-- END COPYRIGHT -->
</div>
</footer>
<!-- END FOOTER -->
<!-- BEGIN GO TO TOP --><a href="#." class="back-to-top" id="back-to-top"><i class="fa fa-angle-up"></i></a><!-- END GO TO TOP -->
</div><!-- end #wrapper -->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery.min.js"></script>
<!-- parallax -->
<script src="js/jquery.stellar.js"></script>
<script src="js/custom.js"></script>
<!-- jcarousel -->
<script src="js/jquery.jcarousel.min.js"></script>
<!-- way point -->
<script src="js/waypoints.js"></script>
<!-- Add piecharts -->
<script src="js/jquery.easypiechart.min.js"></script>
<!-- navigation classes change on scroll -->
<script src="js/nimble.js"></script>
<script src="js/scrollspy.js"></script>
<!-- fancybox -->
<script src="js/jquery.fancybox.pack.js?v=2.1.5"></script>
<!-- appear -->
<script src="js/jquery.appear.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
<!-- nimble effect -->
<script>
//slider
jQuery(function() {
//parallaax
jQuery.stellar({
horizontalScrolling: false,
verticalOffset: 0
});
//fancybox
jQuery(".fancybox").fancybox();
jQuery(".various").fancybox({
maxWidth : 1100,
maxHeight : 600,
fitToView : false,
width : '70%',
height : '70%',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
jQuery('#mycarousel').jcarousel({
vertical: true
});
//smooth scroll to href value
jQuery(".tabs-btn ul li a, .navbar-nav li a, .navbar-brand").click(function(event){
event.preventDefault();
//calculate destination place
var dest=0;
if($(this.hash).offset().top > $(document).height()-$(window).height()){
dest=$(document).height()-$(window).height();
}else{
dest=$(this.hash).offset().top;
}
//go to destination
jQuery('html,body').animate({scrollTop:dest}, 1000,'swing');
});
//toggle map
jQuery(".map-title h4 span").click(function(e) {
jQuery(".map iframe").slideToggle();
jQuery(".map-title h4 span i").toggleClass("fa-angle-up fa-angle-down");
});
jQuery(window).scroll(function(){
if(jQuery(window).scrollTop() > 200){
jQuery("#back-to-top").fadeIn(200);
} else{
jQuery("#back-to-top").fadeOut(200);
}
});
jQuery('#back-to-top, .back-to-top').click(function() {
jQuery('html, body').animate({ scrollTop:0 }, '800');
return false;
});
//pie charts
jQuery('#pie-charts').waypoint(function(direction) {
jQuery('.chart').easyPieChart({
barColor: "#5ecae6",
onStep: function(from, to, percent) {
jQuery(this.el).find('.percent').text(Math.round(percent));
}
});
}, {
offset: function() {
return jQuery.waypoints('viewportHeight') - jQuery(this).height() + 100;
}
});
jQuery('#pie-charts').waypoint(function(direction) {
jQuery('.green-circle').easyPieChart({
barColor: "#bed431",
onStep: function(from, to, percent) {
jQuery(this.el).find('.percent').text(Math.round(percent));
}
});
}, {
offset: function() {
return jQuery.waypoints('viewportHeight') - jQuery(this).height() + 100;
}
});
jQuery('#pie-charts').waypoint(function(direction) {
jQuery('.red-circle').easyPieChart({
barColor: "#e11e24",
onStep: function(from, to, percent) {
jQuery(this.el).find('.percent').text(Math.round(percent));
}
});
}, {
offset: function() {
return jQuery.waypoints('viewportHeight') - jQuery(this).height() + 100;
}
});
jQuery('#pie-charts').waypoint(function(direction) {
jQuery('.yellow-circle').easyPieChart({
barColor: "#f6c715",
onStep: function(from, to, percent) {
jQuery(this.el).find('.percent').text(Math.round(percent));
}
});
}, {
offset: function() {
return jQuery.waypoints('viewportHeight') - jQuery(this).height() + 100;
}
});
jQuery('#pie-charts').waypoint(function(direction) {
jQuery('.purple-circle').easyPieChart({
barColor: "#7251a2",
onStep: function(from, to, percent) {
jQuery(this.el).find('.percent').text(Math.round(percent));
}
});
}, {
offset: function() {
return jQuery.waypoints('viewportHeight') - jQuery(this).height() + 100;
}
});
});
//form submit
function checkmail(input)
{
var pattern1=/^([A-Za-z0-9_-.])+@([A-Za-z0-9_-.])+.([A-Za-z]{2,4})$/;
if(pattern1.test(input)){ return true; }else{ return false; }
}
function proceed(){
var name = document.getElementById("name");
var email = document.getElementById("email");
var company = document.getElementById("company");
var web = document.getElementById("website");
var msg = document.getElementById("message");
var errors = "";
if(name.value == "")
{
name.className = 'error';
return false;
}
else if(email.value == "")
{
email.className = 'error';
return false;
}
else if(checkmail(email.value)==false)
{
alert('Please provide a valid email address.');
return false;
}
else if(company.value == "")
{
company.className = 'error';
return false;
}
else if(web.value == "")
{
web.className = 'error';
return false;
}
else if(msg.value == "")
{
msg.className = 'error';
return false;
}
else
{
$.ajax({
type: "POST",
url: "process.php",
data: $("#contact_form").serialize(),
success: function(msg)
{
//alert(msg);
if(msg){
$('#contact_form').fadeOut(1000);
$('#contact_message').fadeIn(2000);
document.getElementById("contact_message").innerHTML = "Your email has been sent.";
return true;
}
}
});
}
}
</script>
</body>
</html>
?>