Browse Source

'更新前端进度条'

master
刘冬煜 4 years ago
parent
commit
bf7a8e489f
31 changed files with 92 additions and 171 deletions
  1. BIN
      style-transform-master/.vs/style-transform-master/v16/.suo
  2. +65
    -6
      style-transform-master/style-transform-master/html/generate.html
  3. +0
    -155
      style-transform-master/style-transform-master/html/index.html
  4. +3
    -3
      style-transform-master/style-transform-master/html/success.html
  5. BIN
      style-transform-master/style-transform-master/obj/Debug/style-transform-master.njsprojAssemblyReference.cache
  6. +8
    -0
      style-transform-master/style-transform-master/public/css/progress.css
  7. +8
    -6
      style-transform-master/style-transform-master/public/js/generate.js
  8. BIN
      style-transform-master/style-transform-master/public/uploads/176b12417a2cef04215ab4ee05a398c8042675703a4.jpg
  9. +0
    -0
      style-transform-master/style-transform-master/public/uploads/176b2f8f89ba8b530007d6986c2fa9c922a17a4758a.jpg
  10. BIN
      style-transform-master/style-transform-master/public/uploads/176b2fb522f98d18e1c2a7fbb26857de6e644f6d096.jpg
  11. BIN
      style-transform-master/style-transform-master/public/uploads/176b3104418353a1deca2017e116ff55024cf4e0071.jpg
  12. +0
    -0
      style-transform-master/style-transform-master/public/uploads/1c9986aaecb7d17aaddbeaaeb006e37f
  13. BIN
      style-transform-master/style-transform-master/public/uploads/266574aed51b4b86b16df83ce27ef93d
  14. BIN
      style-transform-master/style-transform-master/public/uploads/32a9eb5edee2387c3e20c301679db380
  15. +0
    -0
      style-transform-master/style-transform-master/public/uploads/332d42af8f74e985fb1571620b4a860b
  16. +0
    -0
      style-transform-master/style-transform-master/public/uploads/34c21eb4ab6d5f21fe38e0e7c5e0bc51
  17. BIN
      style-transform-master/style-transform-master/public/uploads/4b1e4e9c4e4fbe9de78602e683b21ba6
  18. BIN
      style-transform-master/style-transform-master/public/uploads/876ae07ab5531800fbcabcdca5e507a2
  19. BIN
      style-transform-master/style-transform-master/public/uploads/cc3197b0d46fdb5831763b680c3ace57
  20. BIN
      style-transform-master/style-transform-master/public/uploads/cdd8721916bc1b41e4de3a3c406953cd
  21. BIN
      style-transform-master/style-transform-master/public/uploads/d517817f8cfc575b5a80563ff5359cd3
  22. BIN
      style-transform-master/style-transform-master/public/uploads/d69579c100d6143a74359598b5277cc9
  23. +0
    -0
      style-transform-master/style-transform-master/public/uploads/f08b08ca187fecef6f70582cc988d459
  24. BIN
      style-transform-master/style-transform-master/sample/style2.jpg
  25. +5
    -1
      style-transform-master/style-transform-master/server.js
  26. +3
    -0
      style-transform-master/style-transform-master/style-transform-master.njsproj

BIN
style-transform-master/.vs/style-transform-master/v16/.suo View File


+ 65
- 6
style-transform-master/style-transform-master/html/generate.html View File

@ -1,18 +1,77 @@
<!DOCTYPE html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Generate</title>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/tether.min.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/font-awesome/css/font-awesome.min.css" />
<link rel="stylesheet" href="elegant_font/style.css" />
<!--[if lte IE 7]><script src="elegant_font/lte-ie7.js"></script><![endif]-->
<link rel="stylesheet" href="css/magnific-popup.css">
<link rel="stylesheet" href="css/slider-pro.css">
<link rel="stylesheet" href="css/owl.carousel.css">
<link rel="stylesheet" href="css/owl.theme.css">
<link rel="stylesheet" href="css/owl.transitions.css">
<link rel="stylesheet" href="css/animate.css">
<link rel="stylesheet" href="elegant_font/style.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/progress.css">
<script type="text/javascript" src="./js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="./js/generate.js"></script>
</head>
<body>
<p id="progress"></p>
<section class="menus style3" id="menuCard">
<div class="container">
<div class="row">
<!-- Section Header -->
<div class="col-md-12 col-sm-12 col-xs-12 section-header wow fadeInDown">
<h2><span class="highlight-text">WAITING</span></h2>
<p class="col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1">
正在为您绘画,请稍等……<br />已完成<b><span style="color:darkgoldenrod" id="progress"></span>%</b>
</p>
</div>
<div id='prog_out' class="progress-background">
<div id='prog_in' class="progress-bar" role="progressbar" aria-valuenow="0"
aria-valuemin="0" aria-valuemax="100" style="width: 0%;">
</div>
</div>
<!-- Section Header End -->
</div>
</div>
</section>
<script type="text/javascript" name="go">
</script>
</body>
<script src="js/html5shiv.min.js"></script>
<script src="js/respond.min.js"></script>
<script src="js/selectivizr.js"></script>
<script src="js/jquery-1.11.3.min.js"></script>
<script src="js/tether.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/modernizr.min.js"></script>
<script src="js/jquery.easing.1.3.js"></script>
<script src="js/jquery.scrollUp.min.js"></script>
<script src="js/jquery.easypiechart.js"></script>
<script src="js/isotope.pkgd.min.js"></script>
<script src="js/jquery.fitvids.js"></script>
<script src="js/jquery.stellar.min.js"></script>
<script src="js/jquery.waypoints.min.js"></script>
<script src="js/wow.min.js"></script>
<script src="js/jquery.nav.js"></script>
<script src="js/imagesloaded.pkgd.min.js"></script>
<script src="js/smooth-scroll.min.js"></script>
<script src="js/jquery.magnific-popup.min.js"></script>
<script src="js/jquery.sliderPro.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/custom.js"></script>
</body>
</html>

+ 0
- 155
style-transform-master/style-transform-master/html/index.html View File

@ -253,160 +253,6 @@
</div>
</section>
<section class="menus style3" id="menuCard">
<div class="container">
<div class="row">
<!-- Section Header -->
<div class="col-md-12 col-sm-12 col-xs-12 section-header wow fadeInDown">
<h2><span class="highlight-text">WAITING</span></h2>
<p class="col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1">Lorem ipsum dolor sit amet,
consectetur adipisicing elit. Quod, nam corporis quas, saepe minima error aperiam dolorum
aliquam, quis deserunt eos eius quisquam odio itaque.</p>
</div>
<!-- Section Header End -->
<div class="menus-container">
<!-- menu -->
<div class="menu row">
<div class="col-md-6 wow fadeInRight animated"
style="visibility: visible; animation-name: fadeInRight;">
<div class="menu-column">
<div class="food">
<div class="food-desc">
<h6 class="food-name">Chicken Masala</h6>
<div class="dots"></div>
<div class="food-price">
<span>5.00</span>
</div><!-- /food-price -->
</div><!-- /food-desc -->
<div class="food-details">
<span>with “butter”</span>
</div><!-- /food-details -->
</div><!-- /food -->
<div class="food">
<div class="food-desc">
<h6 class="food-name">Mango Rice with Curd</h6>
<div class="dots"></div>
<div class="food-price">
<span>16.00</span>
</div><!-- /food-price -->
</div><!-- /food-desc -->
<div class="food-details">
<span>with chat masala</span>
</div><!-- /food-details -->
</div><!-- /food -->
<div class="food">
<div class="food-desc">
<h6 class="food-name">Mutton Fry Rice</h6>
<div class="dots"></div>
<div class="food-price">
<span>22.00</span>
</div><!-- /food-price -->
</div><!-- /food-desc -->
<div class="food-details">
<span>with pure meat</span>
</div><!-- /food-details -->
</div><!-- /food -->
<div class="food">
<div class="food-desc">
<h6 class="food-name">Eggs Mancuriya</h6>
<div class="dots"></div>
<div class="food-price">
<span>22.00</span>
</div><!-- /food-price -->
</div><!-- /food-desc -->
<div class="food-details">
<span>with Vegies</span>
</div><!-- /food-details -->
</div><!-- /food -->
<div class="food">
<div class="food-desc">
<h6 class="food-name">Chicken Currey </h6>
<div class="dots"></div>
<div class="food-price">
<span>15.00</span>
</div><!-- /food-price -->
</div><!-- /food-desc -->
<div class="food-details">
<span>with curry leafs</span>
</div><!-- /food-details -->
</div><!-- /food -->
</div><!-- /menu-column -->
</div><!-- /col-md-6 -->
<div class="col-md-6 wow fadeInLeft animated"
style="visibility: visible; animation-name: fadeInLeft;">
<div class="menu-column">
<div class="food">
<div class="food-desc">
<h6 class="food-name">Pure Veg Salad</h6>
<div class="dots"></div>
<div class="food-price">
<span>5.00</span>
</div><!-- /food-price -->
</div><!-- /food-desc -->
<div class="food-details">
<span>with all veg</span>
</div><!-- /food-details -->
</div><!-- /food -->
<div class="food">
<div class="food-desc">
<h6 class="food-name">Veg Fry Rice</h6>
<div class="dots"></div>
<div class="food-price">
<span>16.00</span>
</div><!-- /food-price -->
</div><!-- /food-desc -->
<div class="food-details">
<span>with best fry</span>
</div><!-- /food-details -->
</div><!-- /food -->
<div class="food">
<div class="food-desc">
<h6 class="food-name">Chines Noodles</h6>
<div class="dots"></div>
<div class="food-price">
<span>22.00</span>
</div><!-- /food-price -->
</div><!-- /food-desc -->
<div class="food-details">
<span>with all spices</span>
</div><!-- /food-details -->
</div><!-- /food -->
<div class="food">
<div class="food-desc">
<h6 class="food-name">Chicken Manchuriah</h6>
<div class="dots"></div>
<div class="food-price">
<span>22.00</span>
</div><!-- /food-price -->
</div><!-- /food-desc -->
<div class="food-details">
<span>with hot and wet</span>
</div><!-- /food-details -->
</div><!-- /food -->
<div class="food">
<div class="food-desc">
<h6 class="food-name">Veg Fry Rice </h6>
<div class="dots"></div>
<div class="food-price">
<span>15.00</span>
</div><!-- /food-price -->
</div><!-- /food-desc -->
<div class="food-details">
<span>with egg and chicken </span>
</div><!-- /food-details -->
</div><!-- /food -->
</div><!-- /menu-column -->
</div><!-- /col-md-6 -->
</div><!-- /row -->
</div><!-- /menu-carousel -->
</div><!-- /menus-container -->
</div><!-- /container -->
</section>
<!-- <div class="tlinks">Collect from <a href="http://www.baisheng999.com/">手机网站模板</a></div> -->
<section id="portfolio" class="bgSection portfolio-section">
<div class="container">
<div class="row">
@ -615,7 +461,6 @@
<script src="js/jquery.sliderPro.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/custom.js"></script>
</body>
</html>

+ 3
- 3
style-transform-master/style-transform-master/html/success.html View File

@ -70,7 +70,7 @@
<div class="portfolio-meta-btn">
<ul class="work-meta">
<li class="lighbox">
<a href="images/img-portfolio/portfolio2.jpg"
<a href="images/img-portfolio/portfolio2.jpg" name="content_href"
class="featured-work-img"><i class="fa fa-search-plus"></i></a>
</li>
</ul>
@ -87,7 +87,7 @@
<div class="portfolio-meta-btn">
<ul class="work-meta">
<li class="lighbox">
<a href="images/img-portfolio/portfolio3.jpg"
<a href="images/img-portfolio/portfolio3.jpg" name="style_href"
class="featured-work-img"><i class="fa fa-search-plus"></i></a>
</li>
</ul>
@ -104,7 +104,7 @@
<div class="portfolio-meta-btn">
<ul class="work-meta">
<li class="lighbox">
<a href="images/img-portfolio/portfolio4.jpg"
<a href="images/img-portfolio/portfolio4.jpg" name="output_href"
class="featured-work-img"><i class="fa fa-search-plus"></i></a>
</li>
</ul>

BIN
style-transform-master/style-transform-master/obj/Debug/style-transform-master.njsprojAssemblyReference.cache View File


+ 8
- 0
style-transform-master/style-transform-master/public/css/progress.css View File

@ -0,0 +1,8 @@
.progress-background {
background-color: ivory;
}
.progress-bar {
background-color: orangered;
height: 10px;
}

+ 8
- 6
style-transform-master/style-transform-master/public/js/generate.js View File

@ -4,11 +4,13 @@ function getProgress(taskID) {
type: 'GET',
dataType: 'json'
}).done(function(data) {
$('#progress').html(data.percentage + "%");
if(data.status == 1) {
window.location.replace('./success?taskID='+taskID);
} else if (data.status != 0) {
window.location.replace('./fail?taskID='+taskID);
}
$('div[role="progressbar"]').attr("aria-valuenow", data.percentage);
$('div[role="progressbar"]').width(data.percentage + '%');
$('#progress').html(data.percentage);
if(data.status == 1) {
window.location.replace('./success?taskID='+taskID);
} else if (data.status != 0) {
window.location.replace('./fail?taskID='+taskID);
}
});
}

BIN
style-transform-master/style-transform-master/public/uploads/176b12417a2cef04215ab4ee05a398c8042675703a4.jpg View File

Before After
Width: 512  |  Height: 384  |  Size: 45 KiB

style-transform-master/style-transform-master/public/uploads/176b11a906dab60546f934a1c601a29d3bcd365097a.jpg → style-transform-master/style-transform-master/public/uploads/176b2f8f89ba8b530007d6986c2fa9c922a17a4758a.jpg View File


BIN
style-transform-master/style-transform-master/public/uploads/176b2fb522f98d18e1c2a7fbb26857de6e644f6d096.jpg View File

Before After
Width: 512  |  Height: 384  |  Size: 62 KiB

BIN
style-transform-master/style-transform-master/public/uploads/176b3104418353a1deca2017e116ff55024cf4e0071.jpg View File

Before After
Width: 512  |  Height: 384  |  Size: 62 KiB

style-transform-master/style-transform-master/public/uploads/2e407fd9b3b3fdc4d7ad5a13412cd8db → style-transform-master/style-transform-master/public/uploads/1c9986aaecb7d17aaddbeaaeb006e37f View File


BIN
style-transform-master/style-transform-master/public/uploads/266574aed51b4b86b16df83ce27ef93d View File

Before After
Width: 739  |  Height: 462  |  Size: 206 KiB

BIN
style-transform-master/style-transform-master/public/uploads/32a9eb5edee2387c3e20c301679db380 View File

Before After
Width: 739  |  Height: 462  |  Size: 206 KiB

style-transform-master/style-transform-master/public/uploads/3ed849750c8f69c94a258ac4693effd4 → style-transform-master/style-transform-master/public/uploads/332d42af8f74e985fb1571620b4a860b View File


style-transform-master/style-transform-master/public/uploads/13c6cc67a90e6649af5357db0257fb21 → style-transform-master/style-transform-master/public/uploads/34c21eb4ab6d5f21fe38e0e7c5e0bc51 View File


BIN
style-transform-master/style-transform-master/public/uploads/4b1e4e9c4e4fbe9de78602e683b21ba6 View File

Before After
Width: 680  |  Height: 510  |  Size: 93 KiB

BIN
style-transform-master/style-transform-master/public/uploads/876ae07ab5531800fbcabcdca5e507a2 View File

Before After
Width: 739  |  Height: 462  |  Size: 206 KiB

BIN
style-transform-master/style-transform-master/public/uploads/cc3197b0d46fdb5831763b680c3ace57 View File

Before After
Width: 680  |  Height: 510  |  Size: 93 KiB

BIN
style-transform-master/style-transform-master/public/uploads/cdd8721916bc1b41e4de3a3c406953cd View File

Before After
Width: 680  |  Height: 510  |  Size: 93 KiB

BIN
style-transform-master/style-transform-master/public/uploads/d517817f8cfc575b5a80563ff5359cd3 View File

Before After
Width: 739  |  Height: 462  |  Size: 206 KiB

BIN
style-transform-master/style-transform-master/public/uploads/d69579c100d6143a74359598b5277cc9 View File

Before After
Width: 680  |  Height: 510  |  Size: 93 KiB

style-transform-master/style-transform-master/public/uploads/42865e3c51f5f0dffd452d6c6edace0c → style-transform-master/style-transform-master/public/uploads/f08b08ca187fecef6f70582cc988d459 View File


BIN
style-transform-master/style-transform-master/sample/style2.jpg View File

Before After
Width: 739  |  Height: 462  |  Size: 206 KiB

+ 5
- 1
style-transform-master/style-transform-master/server.js View File

@ -84,7 +84,7 @@ server.post('/generate', upload.fields([{ name: 'content_image', maxCount: 1 },
let $ = cheerio.load(fs.readFileSync("./html/generate.html"));
$('script[name="go"]').html(`setInterval(function() {getProgress("${taskID}");}, 2000);`);
$('script[name="go"]').html(`setInterval(function() {getProgress("${taskID}");}, 1000);`);
res.writeHead(200, { 'Content-type': 'text/html' });
res.end($.html());
@ -99,6 +99,10 @@ server.get('/success', function (req, res) {
$('img[name="style"]').attr("src", `uploads/${relationfile[taskID].style}`);
$('img[name="output"]').attr("src", `uploads/${taskID}.jpg`);
$('a[name="content_href"]').attr("href", `uploads/${relationfile[taskID].content}`);
$('a[name="style_href"]').attr("href", `uploads/${relationfile[taskID].style}`);
$('a[name="output_href"]').attr("href", `uploads/${taskID}.jpg`);
res.writeHead(200, { 'Content-type': 'text/html' });
res.end($.html());
});

+ 3
- 0
style-transform-master/style-transform-master/style-transform-master.njsproj View File

@ -54,6 +54,9 @@
<Content Include="public\css\owl.carousel.css" />
<Content Include="public\css\owl.theme.css" />
<Content Include="public\css\owl.transitions.css" />
<Content Include="public\css\progress.css">
<SubType>Code</SubType>
</Content>
<Content Include="public\css\slider-pro.css" />
<Content Include="public\css\style.css" />
<Content Include="public\css\tether.min.css" />

Loading…
Cancel
Save