diff options
| -rw-r--r-- | .env-example | 6 | ||||
| -rw-r--r-- | .gitignore | 1 | ||||
| -rw-r--r-- | lib/db/index.js | 2 | ||||
| -rw-r--r-- | lib/index.js | 17 | ||||
| -rw-r--r-- | package.json | 1 | ||||
| -rw-r--r-- | public/assets/css/css.css | 151 | ||||
| -rw-r--r-- | public/assets/js/nav.js | 20 | ||||
| -rw-r--r-- | public/index.html | 7 |
8 files changed, 120 insertions, 85 deletions
diff --git a/.env-example b/.env-example new file mode 100644 index 0000000..cf78d6f --- /dev/null +++ b/.env-example @@ -0,0 +1,6 @@ +DB_HOST=localhost +DB_NAME=luckyplop +DB_USER=your_db_username +DB_PASS=your_db_password +HOST_NAME=5.k + @@ -8,4 +8,5 @@ v1 node_modules/ dist *.sql +.env diff --git a/lib/db/index.js b/lib/db/index.js index b7b1b06..81c3af2 100644 --- a/lib/db/index.js +++ b/lib/db/index.js @@ -23,7 +23,7 @@ db.getLatest = function () { } db.getRandom = function () { return Image.query(function(qb){ - qb.orderBy(knex.raw('RANDOM()')).limit(1) + qb.orderBy(knex.raw('RAND()')).limit(1) }).fetch() } diff --git a/lib/index.js b/lib/index.js index fd226e5..7a410d0 100644 --- a/lib/index.js +++ b/lib/index.js @@ -5,13 +5,8 @@ var http = require('http'); var https = require('https'); var bodyParser = require('body-parser') var cookieParser = require('cookie-parser') -var csurf = require('csurf') var path = require('path') -var multiparty = require('multiparty') var ejs = require('ejs') -var passport = require('passport') -var sessionstore = require('sessionstore') -var session = require('express-session') var multer = require('multer') var app, server @@ -32,11 +27,12 @@ site.init = function(){ app.use(express.query()) server = http.createServer(app).listen(5000, function () { - console.log('Bucky listening at http://5.k:%s', server.address().port) + console.log('LuCkYPLoP listening at http://5.k:%s', server.address().port) }) - app.get("/p/:id", function(req, res){}) - + app.get("/p/:id", function(req, res){ + res.sendFile("index.html", {root: './public'}) + }) app.get("/get/random", function(req, res){ db.getRandom().then(function(img){ res.json(img) @@ -48,8 +44,11 @@ site.init = function(){ }) }) app.get("/get/:id", function(req, res){ - db.getImage(id).then(function(img){ + db.getImage(req.params.id).then(function(img){ res.json(img) }) }) + app.post("/upload", function(req, res){ + res.sendStatus(200) + }) }
\ No newline at end of file diff --git a/package.json b/package.json index 387a495..6c1ac5a 100644 --- a/package.json +++ b/package.json @@ -27,6 +27,7 @@ "knex": "^0.8.6", "lodash": "^3.10.1", "mongodb": "^2.0.43", + "multer": "^1.0.5", "mysql2": "^0.15.8", "skipper": "^0.5.7" } diff --git a/public/assets/css/css.css b/public/assets/css/css.css index 50b5023..75e4ddc 100644 --- a/public/assets/css/css.css +++ b/public/assets/css/css.css @@ -1,102 +1,117 @@ html,body{width:100%;height:100%;margin:0;padding:0;} +body { + background-image: url(http://okfocus.s3.amazonaws.com/luckyplop/LUCKY_PLOP.jpg); + background-position: center; + font-size: 13px; + font-family: arial, sans-serif; + line-height: 1; +} #luckyimage img { - width:100%; - height:100%; - position:fixed; - top:0; - left:0; - z-index:1; + width: 100%; + height: 100%; + position: fixed; + top: 0; + left: 0; + z-index: 1; } #topnav { - height:23px; - min-width:500px; - overflow:hidden; - text-decoration:none; - font-weight:100; - position:fixed; - top:0; - left:0; - z-index:7; - background-color:rgba(255,200,250,0.4); - width:100%; - font-size:22px; - border-bottom:1px solid #eee; + height: 23px; + min-width: 500px; + overflow: hidden; + text-decoration: none; + font-weight: 100; + position: fixed; + top: 0; + left: 0; + z-index: 7; + background-color: rgba(255,200,250,0.4); + width: 100%; + font-size: 22px; + border-bottom: 1px solid #eee; } a:hover { - color:#f0e; + color: #f0e; } a:visited { - color:blue; + color: blue; } .luckyback a { - text-decoration:none; - font-family: Comic Sans MS,Verdana,Helvetica,sans-serif; + text-decoration: none; + font-family: 'Comic Sans MS', fantasy; } .luckyback { text-shadow: yellow 0.1em 1px 1px; - text-transform:uppercase; - font-weight:bold; - color:yellow; + text-transform: uppercase; + font-weight: bold; + color: yellow; } .luckyback a { - color:blue; + color: blue; } #luckyimage { - background-image: url('https://s3.amazonaws.com/luckyplop/c2c40f3006df36c5f6790f9b03f0329205e1ed33.gif'); - position:fixed; - height:100%; - width:100%; - top:0; - left:0; - background-position:center; + position: fixed; + height: 100%; + width: 100%; + top: 0; + left: 0; + background-position: center; } #luckypad { - z-index:3; - position:fixed; - right:30px; - bottom:15px; + z-index: 3; + position: fixed; + right: 30px; + bottom: 15px; } #bottombar { - overflow-style:marquee-block; - z-index:2; - position:fixed; - bottom:0; - left:0; - font-family: Comic Sans MS,Verdana,Helvetica,sans-serif; + z-index: 2; + position: fixed; + bottom: 0; + left: 0; + font-family: 'Comic Sans MS', fantasy; text-shadow: blue 0.1em 1px 1px; - color:yellow; - font-size:30px; - text-align:left; - background-color:rgba(255,0,250,0.1); - height:30px; - width:100%; - font-weight:bold; - font-style:italic; - text-transform:uppercase; + color: yellow; + font-size: 30px; + text-align: left; + background-color: rgba(255,0,250,0.1); + height: 30px; + width: 100%; + font-weight: bold; + font-style: italic; + text-transform: uppercase; } #pip { - position:absolute; - z-index:8; - top:80px; - width:15%; - left:50px; + position: absolute; + z-index: 8; + top: 80px; + width: 15%; + left: 50px; box-shadow: 5px 5px 4px #888; - border:2px inset black; + border: 2px inset black; } #pip:hover { - border:2px solid blue; - cursor:pointer; + border: 2px solid blue; + cursor: pointer; +} +#pip img { + width: 100%; +} +#morelucky { + display: none; } - #droparea { display: none; position: fixed; - top:0;left:0; - width: 100%; height: 100%; - z-index:7778; - background-color:rgba(255,255,255,0.7); - background-image:url(slot.gif); - background-position:center; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 7778; + background-color: rgba(255,255,255,0.7); + background-image: url(http://okfocus.s3.amazonaws.com/luckyplop/slot.gif); + background-position: center; } +marquee { + line-height: 1.1; +}
\ No newline at end of file diff --git a/public/assets/js/nav.js b/public/assets/js/nav.js index 401c6ff..8d172bf 100644 --- a/public/assets/js/nav.js +++ b/public/assets/js/nav.js @@ -13,7 +13,7 @@ var NavView = View.extend({ this.$pip = this.$("#pip img") this.$image = this.$("#luckyimage") - $(window).on("keydown", app.keydown) + $(window).on("keydown", this.keydown.bind(this)) this.latest() }, @@ -26,40 +26,54 @@ var NavView = View.extend({ this.next() break case 38: // up - this.latest() + this.random() break case 40: // down - this.random() + this.latest() break } }, latest: function(){ + if (this.fetching) return + this.fetching = true this.onLatest = true $.get("/get/latest", this.display.bind(this)) }, prev: function(){ + if (this.fetching) return if (this.id - 1 < 1) { return } + this.fetching = true this.onLatest = false $.get("/get/" + (this.id-1), this.display.bind(this)) }, next: function(){ + if (this.fetching) return if (this.onLatest || this.id < 1) { return } + this.fetching = true this.onLatest = false $.get("/get/" + (this.id+1), this.display.bind(this)) }, random: function(){ + if (this.fetching) return + this.fetching = true this.onLatest = false $.get("/get/random", this.display.bind(this)) }, display: function(data){ + this.fetching = false + if (! data.id) { + this.onLatest = true + return + } this.id = data.id this.$pip.attr("src", data.url) this.$image.css("background-image", "url(" + data.url + ")") + history.pushState(data, document.title, "/p/" + data.id) }, }) diff --git a/public/index.html b/public/index.html index e751586..1d56dc9 100644 --- a/public/index.html +++ b/public/index.html @@ -28,7 +28,7 @@ <div id="morelucky" class="popup_block"> <div id="luckyinfo"> - <img src="lucky1.png"class="luckylogo"> + <img src="http://okfocus.s3.amazonaws.com/luckyplop/lucky1.png" class="luckylogo"> <ul> <li>LuCkYPLoP™ is the world's best PIC UPLOADINGッTOOL!プド!</li> <li>LuCkYPLoP™ lets you DRAG an image from your computer to anywhere in the page @@ -50,7 +50,7 @@ </marquee> </div> -<img src="luckypad.png" id="luckypad"> +<img src="http://okfocus.s3.amazonaws.com/luckyplop/luckypad.png" id="luckypad"> <div id="droparea"></div> @@ -66,8 +66,7 @@ <script src="/assets/js/vendor/view/formview.js"></script> <script src="/assets/js/vendor/view/router.js"></script> -<script src="/assets/js/lib/router.js"></script> - +<script src="/assets/js/nav.js"></script> <script src="/assets/js/index.js"></script> </html> |