From b667588d2eec6c0009e06a6fbbdebad8030ce2e0 Mon Sep 17 00:00:00 2001 From: dignajar Date: Tue, 3 Nov 2015 21:28:11 -0300 Subject: [PATCH] Image uploader --- admin/themes/default/css/form-file.min.css | 2 + admin/themes/default/css/placeholder.min.css | 2 + admin/themes/default/css/progress.min.css | 2 + admin/themes/default/css/upload.min.css | 2 + admin/themes/default/index.php | 5 ++ admin/themes/default/init.php | 76 +++++++++++++++++++- admin/themes/default/js/upload.min.js | 2 + admin/views/edit-page.php | 8 +++ admin/views/edit-post.php | 8 +++ admin/views/new-page.php | 9 +++ admin/views/new-post.php | 8 +++ kernel/abstract/dbjson.class.php | 2 +- kernel/ajax/uploader.php | 35 +++++++++ kernel/helpers/filesystem.class.php | 6 +- kernel/js/functions.php | 1 + languages/en_US.json | 6 +- plugins/simplemde/css/font-awesome.min.css | 4 ++ plugins/simplemde/css/simplemde.min.css | 4 +- plugins/simplemde/js/README.md | 9 +++ plugins/simplemde/js/simplemde.min.js | 18 ++--- plugins/simplemde/plugin.php | 15 +++- 21 files changed, 207 insertions(+), 17 deletions(-) create mode 100644 admin/themes/default/css/form-file.min.css create mode 100644 admin/themes/default/css/placeholder.min.css create mode 100644 admin/themes/default/css/progress.min.css create mode 100644 admin/themes/default/css/upload.min.css create mode 100644 admin/themes/default/js/upload.min.js create mode 100644 kernel/ajax/uploader.php create mode 100644 plugins/simplemde/css/font-awesome.min.css create mode 100644 plugins/simplemde/js/README.md diff --git a/admin/themes/default/css/form-file.min.css b/admin/themes/default/css/form-file.min.css new file mode 100644 index 00000000..8b573dcc --- /dev/null +++ b/admin/themes/default/css/form-file.min.css @@ -0,0 +1,2 @@ +/*! UIkit 2.23.0 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */ +.uk-form-file{display:inline-block;vertical-align:middle;position:relative;overflow:hidden}.uk-form-file input[type=file]{position:absolute;top:0;z-index:1;width:100%;opacity:0;cursor:pointer;left:0;font-size:500px} \ No newline at end of file diff --git a/admin/themes/default/css/placeholder.min.css b/admin/themes/default/css/placeholder.min.css new file mode 100644 index 00000000..3680b109 --- /dev/null +++ b/admin/themes/default/css/placeholder.min.css @@ -0,0 +1,2 @@ +/*! UIkit 2.23.0 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */ +.uk-placeholder{margin-bottom:15px;padding:15px;border:1px dashed #ddd;background:#fafafa;color:#444}*+.uk-placeholder{margin-top:15px}.uk-placeholder>:last-child{margin-bottom:0}.uk-placeholder-large{padding-top:80px;padding-bottom:80px} \ No newline at end of file diff --git a/admin/themes/default/css/progress.min.css b/admin/themes/default/css/progress.min.css new file mode 100644 index 00000000..2e0c853f --- /dev/null +++ b/admin/themes/default/css/progress.min.css @@ -0,0 +1,2 @@ +/*! UIkit 2.23.0 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */ +.uk-progress{box-sizing:border-box;height:20px;margin-bottom:15px;background:#eee;overflow:hidden;line-height:20px}*+.uk-progress{margin-top:15px}.uk-progress-bar{width:0;height:100%;background:#00a8e6;float:left;-webkit-transition:width .6s ease;transition:width .6s ease;font-size:12px;color:#fff;text-align:center}.uk-progress-mini{height:6px}.uk-progress-small{height:12px}.uk-progress-success .uk-progress-bar{background-color:#8cc14c}.uk-progress-warning .uk-progress-bar{background-color:#faa732}.uk-progress-danger .uk-progress-bar{background-color:#da314b}.uk-progress-striped .uk-progress-bar{background-image:-webkit-linear-gradient(-45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-image:linear-gradient(-45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-size:30px 30px}.uk-progress-striped.uk-active .uk-progress-bar{-webkit-animation:uk-progress-bar-stripes 2s linear infinite;animation:uk-progress-bar-stripes 2s linear infinite}@-webkit-keyframes uk-progress-bar-stripes{0%{background-position:0 0}100%{background-position:30px 0}}@keyframes uk-progress-bar-stripes{0%{background-position:0 0}100%{background-position:30px 0}} \ No newline at end of file diff --git a/admin/themes/default/css/upload.min.css b/admin/themes/default/css/upload.min.css new file mode 100644 index 00000000..2e72139b --- /dev/null +++ b/admin/themes/default/css/upload.min.css @@ -0,0 +1,2 @@ +/*! UIkit 2.23.0 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */ +.uk-dragover{box-shadow:0 0 20px rgba(100,100,100,.3)} \ No newline at end of file diff --git a/admin/themes/default/index.php b/admin/themes/default/index.php index 4164a56d..f834fb0a 100644 --- a/admin/themes/default/index.php +++ b/admin/themes/default/index.php @@ -15,11 +15,16 @@ + + + + + diff --git a/admin/themes/default/init.php b/admin/themes/default/init.php index 51780c98..11ec304a 100644 --- a/admin/themes/default/init.php +++ b/admin/themes/default/init.php @@ -125,4 +125,78 @@ class HTML { $html = ''; } -} + public static function uploader() + { + global $L; + + $html = ' +
+ '.$L->g('Upload Image').'
'.$L->g('Drag and drop or click here').' +
+ +
+
0%
+
+ '; + + $html .= ''; + + $html .= ' +
+ +
+ '; + + $html .= ' + '; + + echo $html; + } + +} \ No newline at end of file diff --git a/admin/themes/default/js/upload.min.js b/admin/themes/default/js/upload.min.js new file mode 100644 index 00000000..47420d36 --- /dev/null +++ b/admin/themes/default/js/upload.min.js @@ -0,0 +1,2 @@ +/*! UIkit 2.23.0 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */ +!function(e){var t;window.UIkit&&(t=e(UIkit)),"function"==typeof define&&define.amd&&define("uikit-upload",["uikit"],function(){return t||e(UIkit)})}(function(e){"use strict";function t(o,a){function r(t,n){var o=new FormData,a=new XMLHttpRequest;if(n.before(n,t)!==!1){for(var r,i=0;r=t[i];i++)o.append(n.param,r);for(var l in n.params)o.append(l,n.params[l]);a.upload.addEventListener("progress",function(e){var t=e.loaded/e.total*100;n.progress(t,e)},!1),a.addEventListener("loadstart",function(e){n.loadstart(e)},!1),a.addEventListener("load",function(e){n.load(e)},!1),a.addEventListener("loadend",function(e){n.loadend(e)},!1),a.addEventListener("error",function(e){n.error(e)},!1),a.addEventListener("abort",function(e){n.abort(e)},!1),a.open(n.method,n.action,!0),"json"==n.type&&a.setRequestHeader("Accept","application/json"),a.onreadystatechange=function(){if(n.readystatechange(a),4==a.readyState){var t=a.responseText;if("json"==n.type)try{t=e.$.parseJSON(t)}catch(o){t=!1}n.complete(t,a)}},n.beforeSend(a),a.send(o)}}if(!e.support.ajaxupload)return this;if(a=e.$.extend({},t.defaults,a),o.length){if("*.*"!==a.allow)for(var i,l=0;i=o[l];l++)if(!n(a.allow,i.name))return"string"==typeof a.notallowed?alert(a.notallowed):a.notallowed(i,a),void 0;var s=a.complete;if(a.single){var d=o.length,f=0,p=!0;a.beforeAll(o),a.complete=function(e,t){f+=1,s(e,t),a.filelimit&&f>=a.filelimit&&(p=!1),p&&d>f?r([o[f]],a):a.allcomplete(e,t)},r([o[0]],a)}else a.complete=function(e,t){s(e,t),a.allcomplete(e,t)},r(o,a)}}function n(e,t){var n="^"+e.replace(/\//g,"\\/").replace(/\*\*/g,"(\\/[^\\/]+)*").replace(/\*/g,"[^\\/]+").replace(/((?!\\))\?/g,"$1.")+"$";return n="^"+n+"$",null!==t.match(new RegExp(n,"i"))}return e.component("uploadSelect",{init:function(){var e=this;this.on("change",function(){t(e.element[0].files,e.options);var n=e.element.clone(!0).data("uploadSelect",e);e.element.replaceWith(n),e.element=n})}}),e.component("uploadDrop",{defaults:{dragoverClass:"uk-dragover"},init:function(){var e=this,n=!1;this.on("drop",function(n){n.dataTransfer&&n.dataTransfer.files&&(n.stopPropagation(),n.preventDefault(),e.element.removeClass(e.options.dragoverClass),e.element.trigger("dropped.uk.upload",[n.dataTransfer.files]),t(n.dataTransfer.files,e.options))}).on("dragenter",function(e){e.stopPropagation(),e.preventDefault()}).on("dragover",function(t){t.stopPropagation(),t.preventDefault(),n||(e.element.addClass(e.options.dragoverClass),n=!0)}).on("dragleave",function(t){t.stopPropagation(),t.preventDefault(),e.element.removeClass(e.options.dragoverClass),n=!1})}}),e.support.ajaxupload=function(){function e(){var e=document.createElement("INPUT");return e.type="file","files"in e}function t(){var e=new XMLHttpRequest;return!!(e&&"upload"in e&&"onprogress"in e.upload)}function n(){return!!window.FormData}return e()&&t()&&n()}(),e.support.ajaxupload&&e.$.event.props.push("dataTransfer"),t.defaults={action:"",single:!0,method:"POST",param:"files[]",params:{},allow:"*.*",type:"text",filelimit:!1,before:function(){},beforeSend:function(){},beforeAll:function(){},loadstart:function(){},load:function(){},loadend:function(){},error:function(){},abort:function(){},progress:function(){},complete:function(){},allcomplete:function(){},readystatechange:function(){},notallowed:function(e,t){alert("Only the following file types are allowed: "+t.allow)}},e.Utils.xhrupload=t,t}); \ No newline at end of file diff --git a/admin/views/edit-page.php b/admin/views/edit-page.php index 1e05de23..02ce7c86 100644 --- a/admin/views/edit-page.php +++ b/admin/views/edit-page.php @@ -57,6 +57,7 @@ echo '
'; // Tabs, general and advanced mode echo ''; @@ -86,6 +87,13 @@ echo '
'; echo ''; + // ---- IMAGES TAB ---- + echo '
  • '; + + HTML::uploader(); + + echo '
    • '; + // ---- ADVANCED TAB ---- echo '
  • '; diff --git a/admin/views/edit-post.php b/admin/views/edit-post.php index 9a26ec14..cab1c9c7 100644 --- a/admin/views/edit-post.php +++ b/admin/views/edit-post.php @@ -51,6 +51,7 @@ echo '
    '; // Tabs, general and advanced mode echo ''; @@ -80,6 +81,13 @@ echo '
    '; echo '
    • '; + // ---- IMAGES TAB ---- + echo '
  • '; + + HTML::uploader(); + + echo '
    • '; + // ---- ADVANCED TAB ---- echo '
  • '; diff --git a/admin/views/new-page.php b/admin/views/new-page.php index 9f1f00b6..9319170e 100644 --- a/admin/views/new-page.php +++ b/admin/views/new-page.php @@ -44,8 +44,10 @@ echo '
    '; // Tabs, general and advanced mode echo ''; + echo '
      '; // ---- GENERAL TAB ---- @@ -72,6 +74,13 @@ echo '
      '; echo ''; + // ---- IMAGES TAB ---- + echo '
    • '; + + HTML::uploader(); + + echo '
      • '; + // ---- ADVANCED TAB ---- echo '
    • '; diff --git a/admin/views/new-post.php b/admin/views/new-post.php index e1a24a91..fd4f1494 100644 --- a/admin/views/new-post.php +++ b/admin/views/new-post.php @@ -44,6 +44,7 @@ echo '
      '; // Tabs, general and advanced mode echo ''; @@ -73,6 +74,13 @@ echo '
      '; echo '
      • '; + // ---- IMAGES TAB ---- + echo '
    • '; + + HTML::uploader(); + + echo '
      • '; + // ---- ADVANCED TAB ---- echo '
    • '; diff --git a/kernel/abstract/dbjson.class.php b/kernel/abstract/dbjson.class.php index 2b7aec1d..a792164d 100644 --- a/kernel/abstract/dbjson.class.php +++ b/kernel/abstract/dbjson.class.php @@ -97,4 +97,4 @@ class dbJSON return unserialize($data); } -} +} \ No newline at end of file diff --git a/kernel/ajax/uploader.php b/kernel/ajax/uploader.php new file mode 100644 index 00000000..312c2d56 --- /dev/null +++ b/kernel/ajax/uploader.php @@ -0,0 +1,35 @@ +0, + 'filename'=>$tmpName, + 'date'=>date("F d Y H:i:s.", filemtime(PATH_UPLOADS.$tmpName)) +))); + +?> \ No newline at end of file diff --git a/kernel/helpers/filesystem.class.php b/kernel/helpers/filesystem.class.php index e5a3310e..a05fef82 100644 --- a/kernel/helpers/filesystem.class.php +++ b/kernel/helpers/filesystem.class.php @@ -16,7 +16,7 @@ class Filesystem { return $directories; } - public static function listFiles($path, $regex='*', $extension) + public static function listFiles($path, $regex='*', $extension='*', $sortByDate=false) { $files = glob($path.$regex.'.'.$extension); @@ -24,6 +24,10 @@ class Filesystem { return array(); } + if($sortByDate) { + usort($files, create_function('$a,$b', 'return filemtime($b) - filemtime($a);')); + } + return $files; } diff --git a/kernel/js/functions.php b/kernel/js/functions.php index 23cd40d0..cb6c5c67 100644 --- a/kernel/js/functions.php +++ b/kernel/js/functions.php @@ -5,6 +5,7 @@ echo ''; // Hack for Bludit @@ -85,11 +88,19 @@ class pluginsimpleMDE extends Plugin { toolbarGuideIcon: true, autofocus: false, lineWrapping: true, + autoDownloadFontAwesome: false, indentWithTabs: true, tabSize: '.$this->getDbField('tabSize').', spellChecker: false, toolbar: ['.Sanitize::htmlDecode($this->getDbField('toolbar')).'] });'; + + $html .= '$("#jsaddImage").on("click", function() { + var filename = $("#jsimageList option:selected" ).text(); + var text = simplemde.value(); + simplemde.value(text + "![alt text]("+filename+")" + "\n"); + });'; + $html .= '}); '; }