#NEWLINE# @ app . route ( '/' ) #NEWLINE# def home( ) : #NEWLINE# #INDENT# image_infos = [ ] #NEWLINE# for filename in os . listdir ( DATA_DIR ) : #NEWLINE# #INDENT# filepath = os . path . join ( DATA_DIR , filename ) #NEWLINE# file_stat = os . stat ( filepath ) #NEWLINE# if S_ISREG ( file_stat [ ST_MODE ] ) : #NEWLINE# #INDENT# image_infos . append ( ( file_stat [ ST_CTIME ] , filepath ) ) #NEWLINE# #UNINDENT# #UNINDENT# images = [ ] #NEWLINE# for ( i , ( _ , path ) ) in enumerate ( sorted ( image_infos , reverse = True ) ) : #NEWLINE# #INDENT# if ( i >= MAX_IMAGES ) : #NEWLINE# #INDENT# os . unlink ( path ) #NEWLINE# continue #NEWLINE# #UNINDENT# images . append ( '<div><img alt="User uploaded image" src="{0}" /></div>' . format ( path ) ) #NEWLINE# #UNINDENT# return ( '\n<!doctype html>\n<title>Image Uploader</title>\n<meta charset="utf-8" />\n<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>\n<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js"></script>\n<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/themes/vader/jquery-ui.css" />\n<style>\n  body {\n    max-width: 800px;\n    margin: auto;\n    padding: 1em;\n    background: black;\n    color: #fff;\n    font: 16px/1.6 menlo, monospace;\n    text-align:center;\n  }\n\n  a {\n    color: #fff;\n  }\n\n  .notice {\n    font-size: 80%%;\n  }\n\n\n#drop {\n    font-weight: bold;\n    text-align: center;\n    padding: 1em 0;\n    margin: 1em 0;\n    color: #555;\n    border: 2px dashed #555;\n    border-radius: 7px;\n    cursor: default;\n}\n\n#drop.hover {\n    color: #f00;\n    border-color: #f00;\n    border-style: solid;\n    box-shadow: inset 0 3px 4px #888;\n}\n\n</style>\n<h3>Image Uploader</h3>\n<p>Upload an image for everyone to see. Valid images are pushed to everyone\ncurrently connected, and only the most recent %s images are saved.</p>\n<p>The complete source for this Flask web service can be found at:\n<a href="https://github.com/bboe/flask-image-uploader">https://github.com/bboe/flask-image-uploader</a></p>\n<p class="notice">Disclaimer: The author of this application accepts no responsibility for the\nimages uploaded to this web service. To discourage the submission of obscene images, IP\naddresses with the last two octets hidden will be visibly associated with uploaded images.</p>\n<noscript>Note: You must have javascript enabled in order to upload and\ndynamically view new images.</noscript>\n<fieldset>\n  <p id="status">Select an image</p>\n  <div id="progressbar"></div>\n  <input id="file" type="file" />\n  <div id="drop">or drop image here</div>\n</fieldset>\n<h3>Uploaded Images (updated in real-time)</h3>\n<div id="images">%s</div>\n<script>\n  function sse() {\n      var source = new EventSource(\'/stream\');\n      source.onmessage = function(e) {\n          if (e.data == \'\')\n              return;\n          var data = $.parseJSON(e.data);\n          var upload_message = \'Image uploaded by \' + data[\'ip_addr\'];\n          var image = $(\'<img>\', {alt: upload_message, src: data[\'src\']});\n          var container = $(\'<div>\').hide();\n          container.append($(\'<div>\', {text: upload_message}));\n          container.append(image);\n          $(\'#images\').prepend(container);\n          image.load(function(){\n              container.show(\'blind\', {}, 1000);\n          });\n      };\n  }\n  function file_select_handler(to_upload) {\n      var progressbar = $(\'#progressbar\');\n      var status = $(\'#status\');\n      var xhr = new XMLHttpRequest();\n      xhr.upload.addEventListener(\'loadstart\', function(e1){\n          status.text(\'uploading image\');\n          progressbar.progressbar({max: e1.total});\n      });\n      xhr.upload.addEventListener(\'progress\', function(e1){\n          if (progressbar.progressbar(\'option\', \'max\') == 0)\n              progressbar.progressbar(\'option\', \'max\', e1.total);\n          progressbar.progressbar(\'value\', e1.loaded);\n      });\n      xhr.onreadystatechange = function(e1) {\n          if (this.readyState == 4)  {\n              if (this.status == 200)\n                  var text = \'upload complete: \' + this.responseText;\n              else\n                  var text = \'upload failed: code \' + this.status;\n              status.html(text + \'<br/>Select an image\');\n              progressbar.progressbar(\'destroy\');\n          }\n      };\n      xhr.open(\'POST\', \'/post\', true);\n      xhr.send(to_upload);\n  };\n  function handle_hover(e) {\n      e.originalEvent.stopPropagation();\n      e.originalEvent.preventDefault();\n      e.target.className = (e.type == \'dragleave\' || e.type == \'drop\') ? \'\' : \'hover\';\n  }\n\n  $(\'#drop\').bind(\'drop\', function(e) {\n      handle_hover(e);\n      if (e.originalEvent.dataTransfer.files.length < 1) {\n          return;\n      }\n      file_select_handler(e.originalEvent.dataTransfer.files[0]);\n  }).bind(\'dragenter dragleave dragover\', handle_hover);\n  $(\'#file\').change(function(e){\n      file_select_handler(e.target.files[0]);\n      e.target.value = \'\';\n  });\n  sse();\n\n  var _gaq = _gaq || [];\n  _gaq.push([\'_setAccount\', \'UA-510348-17\']);\n  _gaq.push([\'_trackPageview\']);\n\n  (function() {\n    var ga = document.createElement(\'script\'); ga.type = \'text/javascript\'; ga.async = true;\n    ga.src = (\'https:\' == document.location.protocol ? \'https://ssl\' : \'http://www\') + \'.google-analytics.com/ga.js\';\n    var s = document.getElementsByTagName(\'script\')[0]; s.parentNode.insertBefore(ga, s);\n  })();\n</script>\n' % ( MAX_IMAGES , '\n' . join ( images ) ) )