diff --git a/site/app.class.js b/site/app.class.js index 8af82b0..dd661e3 100644 --- a/site/app.class.js +++ b/site/app.class.js @@ -54,6 +54,60 @@ class App project.files.create_version( './test-2.php', fs.readFileSync( '../test-folder/test-2.php', 'utf8' ) ) project.files.create_version( './big-one.txt', 'content 4\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline\nline' ) + project.files.create_version( './icons/test.js', 'Test icon' ) + project.files.create_version( './icons/test.html', 'Test icon' ) + project.files.create_version( './icons/test.sass', 'Test icon' ) + project.files.create_version( './icons/test.scss', 'Test icon' ) + project.files.create_version( './icons/test.less', 'Test icon' ) + project.files.create_version( './icons/test.css', 'Test icon' ) + project.files.create_version( './icons/test.php', 'Test icon' ) + project.files.create_version( './icons/test.json', 'Test icon' ) + project.files.create_version( './icons/test.jade', 'Test icon' ) + project.files.create_version( './icons/test.md', 'Test icon' ) + project.files.create_version( './icons/test.sql', 'Test icon' ) + project.files.create_version( './icons/test.htaccess', 'Test icon' ) + project.files.create_version( './icons/test.htpasswd', 'Test icon' ) + project.files.create_version( './icons/test.yml', 'Test icon' ) + project.files.create_version( './icons/test.svg', 'Test icon' ) + project.files.create_version( './icons/test.eot', 'Test icon' ) + project.files.create_version( './icons/test.ttf', 'Test icon' ) + project.files.create_version( './icons/test.woff', 'Test icon' ) + project.files.create_version( './icons/test.woff2', 'Test icon' ) + project.files.create_version( './icons/test.jpeg', 'Test icon' ) + project.files.create_version( './icons/test.jpg', 'Test icon' ) + project.files.create_version( './icons/test.tiff', 'Test icon' ) + project.files.create_version( './icons/test.gif', 'Test icon' ) + project.files.create_version( './icons/test.bmp', 'Test icon' ) + project.files.create_version( './icons/test.png', 'Test icon' ) + project.files.create_version( './icons/test.webp', 'Test icon' ) + project.files.create_version( './icons/test.mpeg', 'Test icon' ) + project.files.create_version( './icons/test.mpg', 'Test icon' ) + project.files.create_version( './icons/test.mp4', 'Test icon' ) + project.files.create_version( './icons/test.amv', 'Test icon' ) + project.files.create_version( './icons/test.wmv', 'Test icon' ) + project.files.create_version( './icons/test.mov', 'Test icon' ) + project.files.create_version( './icons/test.avi', 'Test icon' ) + project.files.create_version( './icons/test.ogv', 'Test icon' ) + project.files.create_version( './icons/test.mkv', 'Test icon' ) + project.files.create_version( './icons/test.webm', 'Test icon' ) + project.files.create_version( './icons/test.mp3', 'Test icon' ) + project.files.create_version( './icons/test.wav', 'Test icon' ) + project.files.create_version( './icons/test.ogg', 'Test icon' ) + project.files.create_version( './icons/test.raw', 'Test icon' ) + project.files.create_version( './icons/test.zip', 'Test icon' ) + project.files.create_version( './icons/test.rar', 'Test icon' ) + project.files.create_version( './icons/test.7z', 'Test icon' ) + project.files.create_version( './icons/test.gz', 'Test icon' ) + project.files.create_version( './icons/test.txt', 'Test icon' ) + project.files.create_version( './icons/test.coffee', 'Test icon' ) + project.files.create_version( './icons/test.gitignore', 'Test icon' ) + project.files.create_version( './icons/test.gitkeep', 'Test icon' ) + project.files.create_version( './icons/test.xml', 'Test icon' ) + project.files.create_version( './icons/test.twig', 'Test icon' ) + project.files.create_version( './icons/test.c', 'Test icon' ) + project.files.create_version( './icons/test.h', 'Test icon' ) + project.files.create_version( './icons/test.pwet', 'Test icon' ) + // project.files.create_version( './toto/tata/lorem.txt', '123456789' ) // project.files.create_version( './toto/tata/lorem.txt', '1aze' ) // project.files.create_version( './toto/tata/ipsum.txt', 'Lorem ipsum dolor sit amet, consectetur adipisicing elit. Mollitia asperiores iure, animi voluptatibus ut officiis. Molestias, quod perferendis hic totam doloremque, porro aperiam enim tenetur, maxime inventore consequuntur nisi in?' ) diff --git a/site/models/file.class.js b/site/models/file.class.js index 371709d..54d0fdb 100644 --- a/site/models/file.class.js +++ b/site/models/file.class.js @@ -15,10 +15,15 @@ class File this.path = {} this.path.directory = _options.path this.path.full = this.path.directory + '/' + this.name - this.path.parts = this.path.full.split( paths.separator ) this.versions = [] this.socket = _options.socket + let name_parts = this.name.split( '.' ) + if( name_parts.length > 1 ) + this.extension = name_parts[ name_parts.length - 1 ] + else + this.extension = '' + // Create first version if( typeof _options.content !== 'undefined' ) this.create_version( _options.content ) @@ -53,10 +58,11 @@ class File { // Set up let result = {} - result.id = this.id - result.name = this.name - result.path = this.path - result.versions = this.versions + result.id = this.id + result.name = this.name + result.path = this.path + result.versions = this.versions + result.extension = this.extension return result } diff --git a/site/public/javascript/services/project.js b/site/public/javascript/services/project.js index 93ca165..721ef96 100644 --- a/site/public/javascript/services/project.js +++ b/site/public/javascript/services/project.js @@ -5,7 +5,7 @@ application.factory( '$timeout', function( config, $timeout ) { - // Reformat functions + // Reformat version function function reformat_version( _version ) { // Active @@ -42,9 +42,62 @@ application.factory( return _version; } - function reformat_file() + // Reformat file function + function reformat_file( _file ) { + // Notif + _file.notif = 0; + // New + _file.new = true; + + // Each version + for( var _version of _file.versions ) + { + // Reformat version + _version = reformat_version( _version ); + } + + // Icon + var icon = 'random', + possible_icons = { + 'js' : [ 'js' ], + 'html' : [ 'html', 'htm' ], + 'sass' : [ 'sass', 'scss' ], + 'less' : [ 'less' ], + 'css' : [ 'css' ], + 'php' : [ 'php' ], + 'json' : [ 'json' ], + 'jade' : [ 'jade' ], + 'md' : [ 'md' ], + 'sql' : [ 'sql' ], + 'apache' : [ 'htaccess', 'htpasswd' ], + 'yml' : [ 'yml' ], + 'svg' : [ 'svg' ], + 'font' : [ 'eot', 'ttf', 'woff', 'woff2' ], + 'image' : [ 'jpeg', 'jpg', 'tiff', 'gif', 'bmp', 'png', 'webp' ], + 'video' : [ 'mpeg', 'mpg', 'mp4', 'amv', 'wmv', 'mov', 'avi', 'ogv', 'mkv', 'webm' ], + 'audio' : [ 'mp3', 'wav', 'ogg', 'raw' ], + 'zip' : [ 'zip', 'rar', '7z', 'gz' ], + 'txt' : [ 'txt' ], + 'coffee' : [ 'coffee' ], + 'git' : [ 'gitignore', 'gitkeep' ], + 'xml' : [ 'xml' ], + 'twig' : [ 'twig' ], + 'c' : [ 'c', 'h' ], + }; + + for( var _possible_icon_key in possible_icons ) + { + var _possible_icon_values = possible_icons[ _possible_icon_key ]; + if( _possible_icon_values.indexOf( _file.extension ) !== -1 ) + { + icon = _possible_icon_key; + } + } + _file.icon = icon; + + return _file; } // Result @@ -81,13 +134,7 @@ application.factory( if( typeof file === 'undefined' ) { file = Object.assign( {}, data ); - - file.notif = 0; - file.new = true; - for( var _version of file.versions ) - { - _version = reformat_version( _version ); - } + file = reformat_file( file ); result.files[ data.path.full ] = file; @@ -148,14 +195,7 @@ application.factory( if( typeof file === 'undefined' ) { file = Object.assign( {}, data_file ); - - // Format data - file.notif = 0; - file.new = true; - for( var _version of file.versions ) - { - _version = reformat_version( _version ); - } + file = reformat_file( file ); result.files[ _file_key ] = file; diff --git a/site/public/stylesheets/style.css b/site/public/stylesheets/style.css index cbae055..2484887 100644 --- a/site/public/stylesheets/style.css +++ b/site/public/stylesheets/style.css @@ -2,7 +2,6 @@ * Global */ body {background:#24262e;font-size:14px;font-family:Helvetica,Arial;color:#f1f5ff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;} -pre {font-family:monospace;line-height:initial;} a {text-decoration:none;} /** @@ -32,6 +31,7 @@ section.page-project .aside .aside-header {padding:10px;background:#3b3f4e;} section.page-project .aside .aside-header .always-last-version-toggle {cursor:pointer;} section.page-project .aside .aside-header .always-last-version-toggle .switch {display:inline-block;width:12px;height:12px;border:1px solid #f1f5ff;} section.page-project .aside .aside-header .always-last-version-toggle.active .switch {background:#f1f5ff;} +section.page-project .aside .aside-tree {position:absolute;top:48px;left:0;bottom:0;width:100%;overflow:auto;} section.page-project section.main {position:absolute;top:0;right:0;bottom:0;left:240px;} section.page-project section.no-file {position:absolute;top:0;right:0;bottom:0;left:0;} section.page-project section.file {position:absolute;top:0;right:0;bottom:0;left:0;} @@ -41,7 +41,8 @@ section.page-project section.file .versions-nav .version {display:block;padding: section.page-project section.file .versions-nav .version.active {background:#666;} section.page-project section.file .code {position:absolute;top:30px;right:0;bottom:0;left:160px;overflow:auto;background:#282a36;} section.page-project section.file .code pre {position:relative;overflow:hidden;} -section.page-project section.file .code pre code.lines {position:absolute;top:0;left:0;width:38px;padding:0.5em;line-height:16px;opacity:0.2;} +section.page-project section.file .code pre code {line-height:20px;font-family:monospace;} +section.page-project section.file .code pre code.lines {position:absolute;top:0;left:0;width:38px;padding:0.5em;opacity:0.2;} section.page-project section.file .code pre code.hljs {margin-left:38px;} // section.page-project section.file .code pre code {position:absolute;top:0;left:20px;} @@ -50,18 +51,45 @@ section.page-project section.file .code pre code.hljs {margin-left:38px;} /** * Files tree nav */ -nav.files-tree-nav {} +nav.files-tree-nav {position:absolute;top:0;left:0;width:100%;} nav.files-tree-nav li {line-height:24px;cursor:pointer;} -// nav.files-tree-nav .folder ul {display:none;} -// nav.files-tree-nav .folder.active > ul {display:block;} -nav.files-tree-nav i {margin:0 6px 0 0;} nav.files-tree-nav li > span {display:block;color:#ccc;} nav.files-tree-nav li.active {background:rgba(255,255,255,0.1);} - nav.files-tree-nav li > span {padding-left:16px;} nav.files-tree-nav li li > span {padding-left:32px;} nav.files-tree-nav li li li > span {padding-left:48px;} nav.files-tree-nav li li li li > span {padding-left:64px;} nav.files-tree-nav li li li li li > span {padding-left:80px;} nav.files-tree-nav li li li li li li > span {padding-left:86px;} + +nav.files-tree-nav .name {position:relative;display:inline-block;padding-left:20px;} + +nav.files-tree-nav i {position:absolute;top:25%;left:0;display:block;width:12px;height:50%;background:center center no-repeat;} +nav.files-tree-nav i.folder {background-image:url(../svg/folder.svg);} +nav.files-tree-nav i.folder-active {background-image:url(../svg/folder-active.svg);} +nav.files-tree-nav i.js {background-image:url(../svg/js.svg);} +nav.files-tree-nav i.html {background-image:url(../svg/html.svg);} +nav.files-tree-nav i.sass {background-image:url(../svg/sass.svg);} +nav.files-tree-nav i.less {background-image:url(../svg/less.svg);} +nav.files-tree-nav i.css {background-image:url(../svg/css.svg);} +nav.files-tree-nav i.php {background-image:url(../svg/php.svg);} +nav.files-tree-nav i.json {background-image:url(../svg/json.svg);} +nav.files-tree-nav i.jade {background-image:url(../svg/jade.svg);} +nav.files-tree-nav i.md {background-image:url(../svg/md.svg);} +nav.files-tree-nav i.sql {background-image:url(../svg/sql.svg);} +nav.files-tree-nav i.apache {background-image:url(../svg/apache.svg);} +nav.files-tree-nav i.yml {background-image:url(../svg/yml.svg);} +nav.files-tree-nav i.svg {background-image:url(../svg/svg.svg);} +nav.files-tree-nav i.font {background-image:url(../svg/font.svg);} +nav.files-tree-nav i.image {background-image:url(../svg/image.svg);} +nav.files-tree-nav i.video {background-image:url(../svg/video.svg);} +nav.files-tree-nav i.audio {background-image:url(../svg/audio.svg);} +nav.files-tree-nav i.zip {background-image:url(../svg/zip.svg);} +nav.files-tree-nav i.txt {background-image:url(../svg/txt.svg);} +nav.files-tree-nav i.coffee {background-image:url(../svg/coffee.svg);} +nav.files-tree-nav i.git {background-image:url(../svg/git.svg);} +nav.files-tree-nav i.xml {background-image:url(../svg/xml.svg);} +nav.files-tree-nav i.twig {background-image:url(../svg/twig.svg);} +nav.files-tree-nav i.c {background-image:url(../svg/c.svg);} +nav.files-tree-nav i.random {background-image:url(../svg/random.svg);} diff --git a/site/public/svg/apache.svg b/site/public/svg/apache.svg new file mode 100644 index 0000000..7b211aa --- /dev/null +++ b/site/public/svg/apache.svg @@ -0,0 +1,64 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/site/public/svg/audio.svg b/site/public/svg/audio.svg new file mode 100644 index 0000000..1cb5ab1 --- /dev/null +++ b/site/public/svg/audio.svg @@ -0,0 +1,5 @@ + + + + diff --git a/site/public/svg/c.svg b/site/public/svg/c.svg new file mode 100644 index 0000000..1e9e537 --- /dev/null +++ b/site/public/svg/c.svg @@ -0,0 +1,8 @@ + + + + + + diff --git a/site/public/svg/coffee.svg b/site/public/svg/coffee.svg new file mode 100644 index 0000000..e4d196e --- /dev/null +++ b/site/public/svg/coffee.svg @@ -0,0 +1,20 @@ + + + + + + diff --git a/site/public/svg/css.svg b/site/public/svg/css.svg new file mode 100644 index 0000000..6ee84d0 --- /dev/null +++ b/site/public/svg/css.svg @@ -0,0 +1,7 @@ + + + + diff --git a/site/public/svg/folder-active.svg b/site/public/svg/folder-active.svg new file mode 100644 index 0000000..07a8373 --- /dev/null +++ b/site/public/svg/folder-active.svg @@ -0,0 +1,14 @@ + + +eye-fill 12 copy 10 +Created with Sketch. + + + + + + diff --git a/site/public/svg/folder.svg b/site/public/svg/folder.svg new file mode 100644 index 0000000..0760d00 --- /dev/null +++ b/site/public/svg/folder.svg @@ -0,0 +1,11 @@ + + +eye-fill 12 copy 10 +Created with Sketch. + + + + diff --git a/site/public/svg/font.svg b/site/public/svg/font.svg new file mode 100644 index 0000000..f10d6ae --- /dev/null +++ b/site/public/svg/font.svg @@ -0,0 +1,8 @@ + + + + diff --git a/site/public/svg/git.svg b/site/public/svg/git.svg new file mode 100644 index 0000000..f9c2c7d --- /dev/null +++ b/site/public/svg/git.svg @@ -0,0 +1,11 @@ + + + + + + diff --git a/site/public/svg/html.svg b/site/public/svg/html.svg new file mode 100644 index 0000000..ba1c2da --- /dev/null +++ b/site/public/svg/html.svg @@ -0,0 +1,9 @@ + + + + + + diff --git a/site/public/svg/image.svg b/site/public/svg/image.svg new file mode 100644 index 0000000..96d1fbb --- /dev/null +++ b/site/public/svg/image.svg @@ -0,0 +1,6 @@ + + + + diff --git a/site/public/svg/jade.svg b/site/public/svg/jade.svg new file mode 100644 index 0000000..2ba46b5 --- /dev/null +++ b/site/public/svg/jade.svg @@ -0,0 +1,59 @@ + + + + diff --git a/site/public/svg/js.svg b/site/public/svg/js.svg new file mode 100644 index 0000000..14c94d8 --- /dev/null +++ b/site/public/svg/js.svg @@ -0,0 +1,14 @@ + + + + + + + + + diff --git a/site/public/svg/json.svg b/site/public/svg/json.svg new file mode 100644 index 0000000..af4b650 --- /dev/null +++ b/site/public/svg/json.svg @@ -0,0 +1,21 @@ + + + + + + + + + + diff --git a/site/public/svg/less.svg b/site/public/svg/less.svg new file mode 100644 index 0000000..ebe1a55 --- /dev/null +++ b/site/public/svg/less.svg @@ -0,0 +1,31 @@ + + + + + + + + diff --git a/site/public/svg/md.svg b/site/public/svg/md.svg new file mode 100644 index 0000000..653caa4 --- /dev/null +++ b/site/public/svg/md.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + diff --git a/site/public/svg/php.svg b/site/public/svg/php.svg new file mode 100644 index 0000000..d25243e --- /dev/null +++ b/site/public/svg/php.svg @@ -0,0 +1,19 @@ + + + + + + + + + + diff --git a/site/public/svg/random.svg b/site/public/svg/random.svg new file mode 100644 index 0000000..b053238 --- /dev/null +++ b/site/public/svg/random.svg @@ -0,0 +1,9 @@ + + + + + + diff --git a/site/public/svg/sass.svg b/site/public/svg/sass.svg new file mode 100644 index 0000000..5e7bd5a --- /dev/null +++ b/site/public/svg/sass.svg @@ -0,0 +1,29 @@ + + + + diff --git a/site/public/svg/sql.svg b/site/public/svg/sql.svg new file mode 100644 index 0000000..cabf28b --- /dev/null +++ b/site/public/svg/sql.svg @@ -0,0 +1,14 @@ + + + + + + diff --git a/site/public/svg/svg.svg b/site/public/svg/svg.svg new file mode 100644 index 0000000..30ef604 --- /dev/null +++ b/site/public/svg/svg.svg @@ -0,0 +1,16 @@ + + +SVG Simple Logo Tiny + + Designed for the SVG Logo Contest in 2006 by Harvey Rayner. It is available under the Creative Commons license for those who have an SVG product or who are using SVG on their site. + + + diff --git a/site/public/svg/twig.svg b/site/public/svg/twig.svg new file mode 100644 index 0000000..c65769a --- /dev/null +++ b/site/public/svg/twig.svg @@ -0,0 +1,8 @@ + + + + + + diff --git a/site/public/svg/txt.svg b/site/public/svg/txt.svg new file mode 100644 index 0000000..be151ca --- /dev/null +++ b/site/public/svg/txt.svg @@ -0,0 +1,10 @@ + + +document_file +Created with Sketch (http://www.bohemiancoding.com/sketch) + + diff --git a/site/public/svg/video.svg b/site/public/svg/video.svg new file mode 100644 index 0000000..b911f40 --- /dev/null +++ b/site/public/svg/video.svg @@ -0,0 +1,5 @@ + + + + diff --git a/site/public/svg/xml.svg b/site/public/svg/xml.svg new file mode 100644 index 0000000..37119b9 --- /dev/null +++ b/site/public/svg/xml.svg @@ -0,0 +1,9 @@ + + + + + + + + diff --git a/site/public/svg/yml.svg b/site/public/svg/yml.svg new file mode 100644 index 0000000..3e9803b --- /dev/null +++ b/site/public/svg/yml.svg @@ -0,0 +1,10 @@ + + + + + + diff --git a/site/public/svg/zip.svg b/site/public/svg/zip.svg new file mode 100644 index 0000000..8d6ae1a --- /dev/null +++ b/site/public/svg/zip.svg @@ -0,0 +1,11 @@ + + + + + + + diff --git a/site/views/pages/index/project.jade b/site/views/pages/index/project.jade index 3f0a278..b0c3e66 100644 --- a/site/views/pages/index/project.jade +++ b/site/views/pages/index/project.jade @@ -2,14 +2,16 @@ include ../../partials/header.jade script(type="text/ng-template",id="folder_template.html") span(ng-click="folder_click(_folder)") - i.fa(ng-class="_folder.active ? 'fa-folder-open' : 'fa-folder'") - | {{_folder.name}} + span.name + i.folder + | {{_folder.name}} ul li.folder(ng-repeat="_folder in _folder.folders",ng-include="'folder_template.html'",ng-class="_folder.active ? 'active' : 'inactive'") li.file(ng-repeat="(_key,_file) in _folder.files",ng-class="_file.data.active ? 'active' : 'inactive'") span(ng-click="file_click(_file)") - i.fa.fa-file-text - | {{_file.name}} + span.name + i(ng-class="_file.data.icon") + | {{_file.name}} span.notif(ng-if="_file.data.notif") | [{{_file.data.notif}}] span.new(ng-if="_file.data.new") @@ -23,9 +25,10 @@ section.page-project(ng-controller="ProjectController as controller",ng-init="in div.always-last-version-toggle(ng-click="always_last_version_toggle_click()",ng-class="always_last_version ? 'active' : 'inactive'") .switch | always last version - nav.files-tree-nav - ul - li.folder(ng-repeat="_folder in project.tree.folders",ng-include="'folder_template.html'",ng-class="_folder.active ? 'active' : 'inactive'") + .aside-tree + nav.files-tree-nav + ul + li.folder(ng-repeat="_folder in project.tree.folders",ng-include="'folder_template.html'",ng-class="_folder.active ? 'active' : 'inactive'") section.main section.no-file(ng-if="!file") | No file