diff --git a/.gitignore b/.gitignore
index 86fceae7af4fb5a8de2c3c125e7f9a64c3ffbe0c..2deba15dde93796c5b9819203b8c058f5efb6007 100644
--- a/.gitignore
+++ b/.gitignore
@@ -15,3 +15,6 @@
/libpeerconnection.log
npm-debug.log
testem.log
+
+#vim
+*.sw[m-p]
diff --git a/Brocfile.js b/Brocfile.js
index a69fc99b794b76d847833c7d436ee7859197a0bf..3612f91ab39cb102ec0068f3daec191de4591e18 100644
--- a/Brocfile.js
+++ b/Brocfile.js
@@ -1,5 +1,7 @@
/* global require, module */
+
+
var EmberApp = require('ember-cli/lib/broccoli/ember-app');
var app = new EmberApp();
@@ -17,4 +19,13 @@ var app = new EmberApp();
// please specify an object with the list of modules as keys
// along with the exports of each module as its value.
+app.import('bower_components/cheet.js/cheet.min.js');
+app.import('bower_components/pace/pace.min.js');
+app.import('bower_components/datedropper/datedropper.min.js');
+
+app.import('vendor/boombox.js');
+app.import('vendor/turntables.js');
+app.import('vendor/cheet-sounds.js');
+
module.exports = app.toTree();
+
diff --git a/LICENSE b/LICENSE
new file mode 100644
index 0000000000000000000000000000000000000000..d6a93266f748d606b884f9434ff662fe80b9dc21
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,340 @@
+GNU GENERAL PUBLIC LICENSE
+ Version 2, June 1991
+
+ Copyright (C) 1989, 1991 Free Software Foundation, Inc., <http://fsf.org/>
+ 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA
+ Everyone is permitted to copy and distribute verbatim copies
+ of this license document, but changing it is not allowed.
+
+ Preamble
+
+ The licenses for most software are designed to take away your
+freedom to share and change it. By contrast, the GNU General Public
+License is intended to guarantee your freedom to share and change free
+software--to make sure the software is free for all its users. This
+General Public License applies to most of the Free Software
+Foundation's software and to any other program whose authors commit to
+using it. (Some other Free Software Foundation software is covered by
+the GNU Lesser General Public License instead.) You can apply it to
+your programs, too.
+
+ When we speak of free software, we are referring to freedom, not
+price. Our General Public Licenses are designed to make sure that you
+have the freedom to distribute copies of free software (and charge for
+this service if you wish), that you receive source code or can get it
+if you want it, that you can change the software or use pieces of it
+in new free programs; and that you know you can do these things.
+
+ To protect your rights, we need to make restrictions that forbid
+anyone to deny you these rights or to ask you to surrender the rights.
+These restrictions translate to certain responsibilities for you if you
+distribute copies of the software, or if you modify it.
+
+ For example, if you distribute copies of such a program, whether
+gratis or for a fee, you must give the recipients all the rights that
+you have. You must make sure that they, too, receive or can get the
+source code. And you must show them these terms so they know their
+rights.
+
+ We protect your rights with two steps: (1) copyright the software, and
+(2) offer you this license which gives you legal permission to copy,
+distribute and/or modify the software.
+
+ Also, for each author's protection and ours, we want to make certain
+that everyone understands that there is no warranty for this free
+software. If the software is modified by someone else and passed on, we
+want its recipients to know that what they have is not the original, so
+that any problems introduced by others will not reflect on the original
+authors' reputations.
+
+ Finally, any free program is threatened constantly by software
+patents. We wish to avoid the danger that redistributors of a free
+program will individually obtain patent licenses, in effect making the
+program proprietary. To prevent this, we have made it clear that any
+patent must be licensed for everyone's free use or not licensed at all.
+
+ The precise terms and conditions for copying, distribution and
+modification follow.
+
+ GNU GENERAL PUBLIC LICENSE
+ TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION
+
+ 0. This License applies to any program or other work which contains
+a notice placed by the copyright holder saying it may be distributed
+under the terms of this General Public License. The "Program", below,
+refers to any such program or work, and a "work based on the Program"
+means either the Program or any derivative work under copyright law:
+that is to say, a work containing the Program or a portion of it,
+either verbatim or with modifications and/or translated into another
+language. (Hereinafter, translation is included without limitation in
+the term "modification".) Each licensee is addressed as "you".
+
+Activities other than copying, distribution and modification are not
+covered by this License; they are outside its scope. The act of
+running the Program is not restricted, and the output from the Program
+is covered only if its contents constitute a work based on the
+Program (independent of having been made by running the Program).
+Whether that is true depends on what the Program does.
+
+ 1. You may copy and distribute verbatim copies of the Program's
+source code as you receive it, in any medium, provided that you
+conspicuously and appropriately publish on each copy an appropriate
+copyright notice and disclaimer of warranty; keep intact all the
+notices that refer to this License and to the absence of any warranty;
+and give any other recipients of the Program a copy of this License
+along with the Program.
+
+You may charge a fee for the physical act of transferring a copy, and
+you may at your option offer warranty protection in exchange for a fee.
+
+ 2. You may modify your copy or copies of the Program or any portion
+of it, thus forming a work based on the Program, and copy and
+distribute such modifications or work under the terms of Section 1
+above, provided that you also meet all of these conditions:
+
+ a) You must cause the modified files to carry prominent notices
+ stating that you changed the files and the date of any change.
+
+ b) You must cause any work that you distribute or publish, that in
+ whole or in part contains or is derived from the Program or any
+ part thereof, to be licensed as a whole at no charge to all third
+ parties under the terms of this License.
+
+ c) If the modified program normally reads commands interactively
+ when run, you must cause it, when started running for such
+ interactive use in the most ordinary way, to print or display an
+ announcement including an appropriate copyright notice and a
+ notice that there is no warranty (or else, saying that you provide
+ a warranty) and that users may redistribute the program under
+ these conditions, and telling the user how to view a copy of this
+ License. (Exception: if the Program itself is interactive but
+ does not normally print such an announcement, your work based on
+ the Program is not required to print an announcement.)
+
+These requirements apply to the modified work as a whole. If
+identifiable sections of that work are not derived from the Program,
+and can be reasonably considered independent and separate works in
+themselves, then this License, and its terms, do not apply to those
+sections when you distribute them as separate works. But when you
+distribute the same sections as part of a whole which is a work based
+on the Program, the distribution of the whole must be on the terms of
+this License, whose permissions for other licensees extend to the
+entire whole, and thus to each and every part regardless of who wrote it.
+
+Thus, it is not the intent of this section to claim rights or contest
+your rights to work written entirely by you; rather, the intent is to
+exercise the right to control the distribution of derivative or
+collective works based on the Program.
+
+In addition, mere aggregation of another work not based on the Program
+with the Program (or with a work based on the Program) on a volume of
+a storage or distribution medium does not bring the other work under
+the scope of this License.
+
+ 3. You may copy and distribute the Program (or a work based on it,
+under Section 2) in object code or executable form under the terms of
+Sections 1 and 2 above provided that you also do one of the following:
+
+ a) Accompany it with the complete corresponding machine-readable
+ source code, which must be distributed under the terms of Sections
+ 1 and 2 above on a medium customarily used for software interchange; or,
+
+ b) Accompany it with a written offer, valid for at least three
+ years, to give any third party, for a charge no more than your
+ cost of physically performing source distribution, a complete
+ machine-readable copy of the corresponding source code, to be
+ distributed under the terms of Sections 1 and 2 above on a medium
+ customarily used for software interchange; or,
+
+ c) Accompany it with the information you received as to the offer
+ to distribute corresponding source code. (This alternative is
+ allowed only for noncommercial distribution and only if you
+ received the program in object code or executable form with such
+ an offer, in accord with Subsection b above.)
+
+The source code for a work means the preferred form of the work for
+making modifications to it. For an executable work, complete source
+code means all the source code for all modules it contains, plus any
+associated interface definition files, plus the scripts used to
+control compilation and installation of the executable. However, as a
+special exception, the source code distributed need not include
+anything that is normally distributed (in either source or binary
+form) with the major components (compiler, kernel, and so on) of the
+operating system on which the executable runs, unless that component
+itself accompanies the executable.
+
+If distribution of executable or object code is made by offering
+access to copy from a designated place, then offering equivalent
+access to copy the source code from the same place counts as
+distribution of the source code, even though third parties are not
+compelled to copy the source along with the object code.
+
+ 4. You may not copy, modify, sublicense, or distribute the Program
+except as expressly provided under this License. Any attempt
+otherwise to copy, modify, sublicense or distribute the Program is
+void, and will automatically terminate your rights under this License.
+However, parties who have received copies, or rights, from you under
+this License will not have their licenses terminated so long as such
+parties remain in full compliance.
+
+ 5. You are not required to accept this License, since you have not
+signed it. However, nothing else grants you permission to modify or
+distribute the Program or its derivative works. These actions are
+prohibited by law if you do not accept this License. Therefore, by
+modifying or distributing the Program (or any work based on the
+Program), you indicate your acceptance of this License to do so, and
+all its terms and conditions for copying, distributing or modifying
+the Program or works based on it.
+
+ 6. Each time you redistribute the Program (or any work based on the
+Program), the recipient automatically receives a license from the
+original licensor to copy, distribute or modify the Program subject to
+these terms and conditions. You may not impose any further
+restrictions on the recipients' exercise of the rights granted herein.
+You are not responsible for enforcing compliance by third parties to
+this License.
+
+ 7. If, as a consequence of a court judgment or allegation of patent
+infringement or for any other reason (not limited to patent issues),
+conditions are imposed on you (whether by court order, agreement or
+otherwise) that contradict the conditions of this License, they do not
+excuse you from the conditions of this License. If you cannot
+distribute so as to satisfy simultaneously your obligations under this
+License and any other pertinent obligations, then as a consequence you
+may not distribute the Program at all. For example, if a patent
+license would not permit royalty-free redistribution of the Program by
+all those who receive copies directly or indirectly through you, then
+the only way you could satisfy both it and this License would be to
+refrain entirely from distribution of the Program.
+
+If any portion of this section is held invalid or unenforceable under
+any particular circumstance, the balance of the section is intended to
+apply and the section as a whole is intended to apply in other
+circumstances.
+
+It is not the purpose of this section to induce you to infringe any
+patents or other property right claims or to contest validity of any
+such claims; this section has the sole purpose of protecting the
+integrity of the free software distribution system, which is
+implemented by public license practices. Many people have made
+generous contributions to the wide range of software distributed
+through that system in reliance on consistent application of that
+system; it is up to the author/donor to decide if he or she is willing
+to distribute software through any other system and a licensee cannot
+impose that choice.
+
+This section is intended to make thoroughly clear what is believed to
+be a consequence of the rest of this License.
+
+ 8. If the distribution and/or use of the Program is restricted in
+certain countries either by patents or by copyrighted interfaces, the
+original copyright holder who places the Program under this License
+may add an explicit geographical distribution limitation excluding
+those countries, so that distribution is permitted only in or among
+countries not thus excluded. In such case, this License incorporates
+the limitation as if written in the body of this License.
+
+ 9. The Free Software Foundation may publish revised and/or new versions
+of the General Public License from time to time. Such new versions will
+be similar in spirit to the present version, but may differ in detail to
+address new problems or concerns.
+
+Each version is given a distinguishing version number. If the Program
+specifies a version number of this License which applies to it and "any
+later version", you have the option of following the terms and conditions
+either of that version or of any later version published by the Free
+Software Foundation. If the Program does not specify a version number of
+this License, you may choose any version ever published by the Free Software
+Foundation.
+
+ 10. If you wish to incorporate parts of the Program into other free
+programs whose distribution conditions are different, write to the author
+to ask for permission. For software which is copyrighted by the Free
+Software Foundation, write to the Free Software Foundation; we sometimes
+make exceptions for this. Our decision will be guided by the two goals
+of preserving the free status of all derivatives of our free software and
+of promoting the sharing and reuse of software generally.
+
+ NO WARRANTY
+
+ 11. BECAUSE THE PROGRAM IS LICENSED FREE OF CHARGE, THERE IS NO WARRANTY
+FOR THE PROGRAM, TO THE EXTENT PERMITTED BY APPLICABLE LAW. EXCEPT WHEN
+OTHERWISE STATED IN WRITING THE COPYRIGHT HOLDERS AND/OR OTHER PARTIES
+PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESSED
+OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE. THE ENTIRE RISK AS
+TO THE QUALITY AND PERFORMANCE OF THE PROGRAM IS WITH YOU. SHOULD THE
+PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF ALL NECESSARY SERVICING,
+REPAIR OR CORRECTION.
+
+ 12. IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
+WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MAY MODIFY AND/OR
+REDISTRIBUTE THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES,
+INCLUDING ANY GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING
+OUT OF THE USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED
+TO LOSS OF DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY
+YOU OR THIRD PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER
+PROGRAMS), EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE
+POSSIBILITY OF SUCH DAMAGES.
+
+ END OF TERMS AND CONDITIONS
+
+ How to Apply These Terms to Your New Programs
+
+ If you develop a new program, and you want it to be of the greatest
+possible use to the public, the best way to achieve this is to make it
+free software which everyone can redistribute and change under these terms.
+
+ To do so, attach the following notices to the program. It is safest
+to attach them to the start of each source file to most effectively
+convey the exclusion of warranty; and each file should have at least
+the "copyright" line and a pointer to where the full notice is found.
+
+ {description}
+ Copyright (C) {year} {fullname}
+
+ This program is free software; you can redistribute it and/or modify
+ it under the terms of the GNU General Public License as published by
+ the Free Software Foundation; either version 2 of the License, or
+ (at your option) any later version.
+
+ This program is distributed in the hope that it will be useful,
+ but WITHOUT ANY WARRANTY; without even the implied warranty of
+ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ GNU General Public License for more details.
+
+ You should have received a copy of the GNU General Public License along
+ with this program; if not, write to the Free Software Foundation, Inc.,
+ 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
+
+Also add information on how to contact you by electronic and paper mail.
+
+If the program is interactive, make it output a short notice like this
+when it starts in an interactive mode:
+
+ Gnomovision version 69, Copyright (C) year name of author
+ Gnomovision comes with ABSOLUTELY NO WARRANTY; for details type `show w'.
+ This is free software, and you are welcome to redistribute it
+ under certain conditions; type `show c' for details.
+
+The hypothetical commands `show w' and `show c' should show the appropriate
+parts of the General Public License. Of course, the commands you use may
+be called something other than `show w' and `show c'; they could even be
+mouse-clicks or menu items--whatever suits your program.
+
+You should also get your employer (if you work as a programmer) or your
+school, if any, to sign a "copyright disclaimer" for the program, if
+necessary. Here is a sample; alter the names:
+
+ Yoyodyne, Inc., hereby disclaims all copyright interest in the program
+ `Gnomovision' (which makes passes at compilers) written by James Hacker.
+
+ {signature of Ty Coon}, 1 April 1989
+ Ty Coon, President of Vice
+
+This General Public License does not permit incorporating your program into
+proprietary programs. If your program is a subroutine library, you may
+consider it more useful to permit linking proprietary applications with the
+library. If this is what you want to do, use the GNU Lesser General
+Public License instead of this License.
+
diff --git a/app/adapters/application.js b/app/adapters/application.js
new file mode 100644
index 0000000000000000000000000000000000000000..76c839536e3f2eb6b51af6f83b87eefaa022b6d5
--- /dev/null
+++ b/app/adapters/application.js
@@ -0,0 +1,19 @@
+import DS from 'ember-data';
+import Ember from 'ember';
+
+var ApplicationAdapter = DS.ActiveModelAdapter.extend({
+ host: 'https://api-playbot.skizzk.fr'
+});
+
+//App = Ember.Application.create({
+// LOG_TRANSITIONS: true,
+// LOG_TRANSITIONS_INTERNAL: true,
+// LOG_VIEW_LOOKUPS: true,
+// LOG_ACTIVE_GENERATION: true,
+// LOG_BINDINGS: true
+//});
+Ember.LinkView.reopen({
+ attributeBindings: ['data-trackid', 'style']//,'title']
+});
+
+export default ApplicationAdapter;
diff --git a/app/controllers/cassette.js b/app/controllers/cassette.js
new file mode 100644
index 0000000000000000000000000000000000000000..880cde818ebb8af765124beb70e42e66cae6dde9
--- /dev/null
+++ b/app/controllers/cassette.js
@@ -0,0 +1,67 @@
+import Ember from 'ember';
+
+var CassetteController = Ember.Controller.extend({
+ n: 0,
+ needs: 'tracks',
+ totalPages: Ember.computed.alias('controllers.tracks.totalPages'),
+ page: Ember.computed.alias('controllers.tracks.page'),
+
+ init: function() {
+ player=null;
+ },
+
+ randomCassette: function() {
+ var newPage = Math.floor(Math.random() * (this.get('totalPages') -1)) + 1;
+ if (newPage === this.get('page')) {
+ this.set('n', Math.floor(Math.random() * this.model.tracks.content.length));
+ this.play();
+ }
+ else {
+ this.set('page', newPage);
+ }
+ },
+
+ track: function() {
+ return this.model.tracks.content[this.get('n')];
+ }.property('model','n'),
+
+
+ play: function() {
+ var track = this.model.tracks.content[this.get('n')];
+ play_cassette(track);
+ },
+
+ modelChange: function() {
+ stopWheels();
+ wheels= null;
+ player = null;
+ Ember.$('iframe').replaceWith("<iframe id='iframe' class='cassette'></iframe>");
+ Ember.run.once(this, function() {
+ this.set('n', Math.floor(Math.random() * this.model.tracks.content.length));
+ this.play();
+ });
+ }.observes('model'),
+
+ next: function() {
+ stopWheels();
+ wheels= null;
+ player = null;
+ Ember.$('iframe').replaceWith("<iframe id='iframe' class='cassette'></iframe>");
+ this.randomCassette();
+ },
+
+ actions: {
+ playButton: function() {
+ this.play();
+ },
+ stopButton: function() {
+ var track = this.model.tracks.content[this.get('n')];
+ stop_cassette(track);
+ },
+ nextButton: function() {
+ this.next();
+ },
+ }
+});
+
+export default CassetteController;
diff --git a/app/controllers/channel.js b/app/controllers/channel.js
new file mode 100644
index 0000000000000000000000000000000000000000..fd90ca1417ec99402ea1ec1333ebfbfd3f496c74
--- /dev/null
+++ b/app/controllers/channel.js
@@ -0,0 +1,28 @@
+import Ember from 'ember';
+
+//ChannelsController = Ember.ArrayController.extend({
+// itemController: ['channel']
+//});
+
+var ChannelController = Ember.ObjectController.extend({
+ weight: function() {
+ return Math.sqrt(this.get('model.quantity'));
+ }.property('quantity'),
+
+ info: function() {
+ return this.get('model.name')+" - "+this.get('model.quantity')+" tracks";
+ }.property('name'),
+
+ style: function() {
+ return ('width:'+this.get('weight')+'vw').htmlSafe();
+ }.property('quantity'),
+
+ category: function() {
+ if (this.get('weight') < 3) {
+ return 'channel hided';
+ }
+ return 'channel';
+ }.property('quantity')
+});
+
+export default ChannelController;
diff --git a/app/controllers/channelfilter.js b/app/controllers/channelfilter.js
new file mode 100644
index 0000000000000000000000000000000000000000..7eb6e892c33a18dc83409041839dc36dfcf854c5
--- /dev/null
+++ b/app/controllers/channelfilter.js
@@ -0,0 +1,8 @@
+import Ember from 'ember';
+
+var ChannelfilterController = Ember.Controller.extend({
+ needs: 'tracks',
+ channelSelected: Ember.computed.alias('controllers.tracks.channel'),
+});
+
+export default ChannelfilterController;
diff --git a/app/controllers/channels.js b/app/controllers/channels.js
new file mode 100644
index 0000000000000000000000000000000000000000..71f6ff8b3647e484a45b77a102a2c5bb7dae39d0
--- /dev/null
+++ b/app/controllers/channels.js
@@ -0,0 +1,7 @@
+import Ember from 'ember';
+
+var ChannelsController = Ember.ArrayController.extend({
+ itemController: 'channel'
+});
+
+export default ChannelsController;
diff --git a/app/controllers/filtersmenu.js b/app/controllers/filtersmenu.js
new file mode 100644
index 0000000000000000000000000000000000000000..4fabbc3e67db438dab971aec7829f7208490dcd2
--- /dev/null
+++ b/app/controllers/filtersmenu.js
@@ -0,0 +1,8 @@
+import Ember from 'ember';
+
+var FiltersmenuController = Ember.Controller.extend({
+ needs: 'tracks',
+ date: Ember.computed.alias('controllers.tracks.date'),
+});
+
+export default FiltersmenuController;
diff --git a/app/controllers/navigation.js b/app/controllers/navigation.js
new file mode 100644
index 0000000000000000000000000000000000000000..2b2cfb9fceda3c534fbd25b8d8fb9144f4a24e8e
--- /dev/null
+++ b/app/controllers/navigation.js
@@ -0,0 +1,11 @@
+import Ember from 'ember';
+
+var NavigationController = Ember.Controller.extend({
+ actions: {
+ menu: function() {
+ $('.menu-button, .menu, .fade-menu').toggleClass('is-visible');
+ }
+ }
+});
+
+export default NavigationController;
diff --git a/app/controllers/tagfilter.js b/app/controllers/tagfilter.js
new file mode 100644
index 0000000000000000000000000000000000000000..aca46b32c1631783b3e814ce8d755888f3e3788e
--- /dev/null
+++ b/app/controllers/tagfilter.js
@@ -0,0 +1,12 @@
+import Ember from 'ember';
+
+var TagfilterController = Ember.ArrayController.extend({
+ //sortProperties: ['quantity:desc'],
+ //sortedModel: Ember.computed.sort("model", "sortProperties"),
+
+ needs: 'tracks',
+ tagSelected: Ember.computed.alias('controllers.tracks.tag'),
+
+});
+
+export default TagfilterController;
diff --git a/app/controllers/tracks.js b/app/controllers/tracks.js
new file mode 100644
index 0000000000000000000000000000000000000000..8ea7af55c588011aa6dea189bc07a8655a53db9f
--- /dev/null
+++ b/app/controllers/tracks.js
@@ -0,0 +1,77 @@
+import Ember from 'ember';
+
+var TracksController = Ember.Controller.extend({
+ queryParams: ['tag','user','channel','date','page','design'],
+ tag: null,
+ date: '',
+ page: 1,
+ channel: null,
+ user: null,
+ totalPages: 1,
+ design: 'table',
+
+ resetPage: function() {
+ return this.set('page', 1);
+ }.observes('tag','channel', 'user', 'date'),
+
+ colorGridDesign: function() {
+ return this.get('design') === 'colorGrid';
+ }.property('design'),
+
+ tableDesign: function() {
+ return this.get('design') === 'table';
+ }.property('design'),
+
+ cassetteDesign: function() {
+ return this.get('design') === 'cassette';
+ }.property('design'),
+
+ //changeDesign: function() {
+ //reset cassette player informations
+ //player = null;
+ //}.observes('design'),
+
+ prevPage: function() {
+ return this.get('page') - 1;
+ }.property('page'),
+
+ nextPage: function() {
+ return this.get('page') + 1;
+ }.property('page'),
+
+ notFirstPage: function() {
+ return this.get('page') !== 1;
+ }.property('page'),
+
+ notSecondPage: function() {
+ return this.get('page') !== 2;
+ }.property('page'),
+
+ notLastPage: function() {
+ return (this.get('page') < this.get('totalPages'));
+ }.property('page', 'totalPages'),
+
+ dotsBefore: function() {
+ return (this.get('page') - 2 > 1);
+ }.property('page'),
+
+ dotsAfter: function() {
+ return (this.get('page') + 2 < this.get('totalPages'));
+ }.property('page','totalPages'),
+
+ pagesRange: function () {
+ var pagesList = Ember.A();
+ var minPage = Math.max(1, this.get('page') - 2);
+ var maxPage = Math.min(this.get('page') + 2, this.get('totalPages'));
+ for(var i = minPage; i <= maxPage; i++) {
+ pagesList.push(i);
+ }
+ return pagesList;
+ }.property('page','totalPages'),
+
+ currentPage: function() {
+ return this.get('page');
+ }.property('page'),
+});
+
+export default TracksController;
diff --git a/app/controllers/user.js b/app/controllers/user.js
new file mode 100644
index 0000000000000000000000000000000000000000..652de0ece18866a4860cd999370c43919d0e1b26
--- /dev/null
+++ b/app/controllers/user.js
@@ -0,0 +1,26 @@
+import Ember from 'ember';
+
+var UserController = Ember.Controller.extend({
+ weight: function() {
+ return Math.sqrt(this.get('model.quantity'));
+ }.property('quantity'),
+
+ category: function() {
+ if (this.get('weight') < 3) {
+ return 'user hided';
+ }
+ else {
+ return 'user';
+ }
+ }.property('quantity'),
+
+ info: function() {
+ return this.get('model.name')+" - "+this.get('model.quantity')+" tracks";
+ }.property('name'),
+
+ style: function() {
+ return ('width:'+this.get('weight')+'vw').htmlSafe();
+ }.property('quantity')
+});
+
+export default UserController;
diff --git a/app/controllers/userfilter.js b/app/controllers/userfilter.js
new file mode 100644
index 0000000000000000000000000000000000000000..573adcf04b8aaf9bec7d0c6218cf850bdfb5fd71
--- /dev/null
+++ b/app/controllers/userfilter.js
@@ -0,0 +1,8 @@
+import Ember from 'ember';
+
+var UserfilterController = Ember.Controller.extend({
+ needs: 'tracks',
+ userSelected: Ember.computed.alias('controllers.tracks.user'),
+});
+
+export default UserfilterController;
diff --git a/app/controllers/users.js b/app/controllers/users.js
new file mode 100644
index 0000000000000000000000000000000000000000..5985f1a5883daf7e89fe54eabcf5d78dc008053c
--- /dev/null
+++ b/app/controllers/users.js
@@ -0,0 +1,7 @@
+import Ember from 'ember';
+
+var UsersController = Ember.ArrayController.extend({
+ itemController: 'user'
+});
+
+export default UsersController;
diff --git a/app/index.html b/app/index.html
index 40842beb3fa1598fc2e1852fc815fd37f840fd72..3624921861e70c87a2b93bc7234a9ae0e86d4bdd 100644
--- a/app/index.html
+++ b/app/index.html
@@ -3,9 +3,10 @@
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
- <title>PlaybotWeb</title>
+ <title>Playbot</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
+ <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
{{content-for 'head'}}
@@ -14,12 +15,13 @@
{{content-for 'head-footer'}}
</head>
- <body>
+ <body class="preload">
{{content-for 'body'}}
+ <script src="https://w.soundcloud.com/player/api.js"></script>
+ <script src="https://www.youtube.com/iframe_api"></script>
<script src="assets/vendor.js"></script>
<script src="assets/playbot-web.js"></script>
-
{{content-for 'body-footer'}}
</body>
</html>
diff --git a/app/models/channel.js b/app/models/channel.js
new file mode 100644
index 0000000000000000000000000000000000000000..eee10114de43e88f80f11dc4fceaed7a8389374a
--- /dev/null
+++ b/app/models/channel.js
@@ -0,0 +1,6 @@
+import DS from "ember-data";
+
+export default DS.Model.extend({
+ name: DS.attr('string'),
+ quantity: DS.attr('string'),
+});
diff --git a/app/models/tag.js b/app/models/tag.js
new file mode 100644
index 0000000000000000000000000000000000000000..eee10114de43e88f80f11dc4fceaed7a8389374a
--- /dev/null
+++ b/app/models/tag.js
@@ -0,0 +1,6 @@
+import DS from "ember-data";
+
+export default DS.Model.extend({
+ name: DS.attr('string'),
+ quantity: DS.attr('string'),
+});
diff --git a/app/models/track.js b/app/models/track.js
new file mode 100644
index 0000000000000000000000000000000000000000..c99ebbe4ddd755d4aa9398b15931299a531ed26b
--- /dev/null
+++ b/app/models/track.js
@@ -0,0 +1,9 @@
+import DS from "ember-data";
+
+export default DS.Model.extend({
+ name: DS.attr('string'),
+ url: DS.attr('string'),
+ author: DS.attr('string'),
+ channel: DS.attr('string'),
+ provider: DS.attr('string'),
+});
diff --git a/app/models/user.js b/app/models/user.js
new file mode 100644
index 0000000000000000000000000000000000000000..eee10114de43e88f80f11dc4fceaed7a8389374a
--- /dev/null
+++ b/app/models/user.js
@@ -0,0 +1,6 @@
+import DS from "ember-data";
+
+export default DS.Model.extend({
+ name: DS.attr('string'),
+ quantity: DS.attr('string'),
+});
diff --git a/app/router.js b/app/router.js
index cef554b3d9ef2d6ce383a39637c14a7f254b9fed..0f6320018a567fed331d0f6caf38ff66d392d209 100644
--- a/app/router.js
+++ b/app/router.js
@@ -6,6 +6,14 @@ var Router = Ember.Router.extend({
});
Router.map(function() {
+ this.route('index', {path: '/'});
+ this.route('users');
+ this.resource('channels');
+ this.route('about');
+
+ this.resource('tracks', function() {
+ this.resource('track', {path: '/:track_id'});
+ });
});
export default Router;
diff --git a/app/routes/channels.js b/app/routes/channels.js
new file mode 100644
index 0000000000000000000000000000000000000000..576436b3d9aad6398c0af6c54efb6e41c900d5f7
--- /dev/null
+++ b/app/routes/channels.js
@@ -0,0 +1,9 @@
+import Ember from 'ember';
+
+var ChannelsRoute = Ember.Route.extend({
+ model: function() {
+ return this.store.find('channel');
+ }
+});
+
+export default ChannelsRoute;
diff --git a/app/routes/track.js b/app/routes/track.js
new file mode 100644
index 0000000000000000000000000000000000000000..4a66aa8c3451e71da6f1c188bad815131d948698
--- /dev/null
+++ b/app/routes/track.js
@@ -0,0 +1,14 @@
+import Ember from 'ember';
+
+var TrackRoute = Ember.Route.extend({
+ actions: {
+ didTransition: function() {
+ Ember.run.scheduleOnce('afterRender', this, function() {
+ var track = this.modelFor('track');
+ play(track);
+ });
+ }
+ }
+});
+
+export default TrackRoute;
diff --git a/app/routes/tracks.js b/app/routes/tracks.js
new file mode 100644
index 0000000000000000000000000000000000000000..acb3628a367be1db46538ee9b21f756f0db90491
--- /dev/null
+++ b/app/routes/tracks.js
@@ -0,0 +1,48 @@
+import Ember from 'ember';
+
+var TracksRoute = Ember.Route.extend({
+ activate: function() {
+ this.render('design', {outlet: 'design'});
+ },
+
+ queryParams: {
+ tag: { refreshModel: true },
+ channel: { refreshModel: true },
+ user: { refreshModel: true },
+ date: { refreshModel: true },
+ page: { refreshModel: true }
+ },
+
+ model: function(params) {
+ var query = {};
+ if(Ember.isPresent(params.page)) {
+ query.page = params.page;
+ }
+ if (Ember.isPresent(params.tag)) {
+ query.tag = params.tag;
+ }
+ if (Ember.isPresent(params.channel)) {
+ query.channel = params.channel;
+ }
+ if (Ember.isPresent(params.user)) {
+ query.user = params.user;
+ }
+ if (Ember.isPresent(params.date)) {
+ query.date = params.date;
+ }
+ return Ember.RSVP.hash({
+ tags: this.store.find('tag'),
+ channels: this.store.find('channel'),
+ users: this.store.find('user'),
+ tracks: this.store.find('track', query)
+ });
+ },
+
+ setupController: function(controller, model) {
+ this._super.apply(this, arguments);
+ controller.set('totalPages', model.tracks.get('meta.total_pages'));
+ }
+
+});
+
+export default TracksRoute;
diff --git a/app/routes/users.js b/app/routes/users.js
new file mode 100644
index 0000000000000000000000000000000000000000..c542d72c18630b3b9e4c89bf99a2fbdd06797570
--- /dev/null
+++ b/app/routes/users.js
@@ -0,0 +1,9 @@
+import Ember from 'ember';
+
+var UsersRoute = Ember.Route.extend({
+ model: function() {
+ return this.store.find('user');
+ }
+});
+
+export default UsersRoute;
diff --git a/app/styles/app.css b/app/styles/app.css
deleted file mode 100644
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..0000000000000000000000000000000000000000
diff --git a/app/styles/app.sass b/app/styles/app.sass
new file mode 100644
index 0000000000000000000000000000000000000000..2d0959ca458741729da09902388bfad4494a43c0
--- /dev/null
+++ b/app/styles/app.sass
@@ -0,0 +1,788 @@
+@import "bower_components/bourbon/app/assets/stylesheets/bourbon"
+@import "bower_components/neat/app/assets/stylesheets/neat"
+@import "bower_components/normalize.css/normalize"
+@import "bower_components/datedropper/datedropper"
+@import "bower_components/pace/themes/blue/pace-theme-minimal"
+
+@include font-face('wire','/assets/fonts/Electro')//string_and_wire
+@include font-face('marker','/assets/fonts/twin_marker') //colors_of_autumn')
+
+$standard_font: 'Helvetica Neue',Helvetica,Arial,sans-serif
+$standard_color: #333 //#4285f4
+$standard_light_color: #474747
+$standard_font_color: transparentize(white, 0.3)
+$standard_secondary_color: #2098d1
+
+html
+ font-family: $standard_font
+ font-size: 90% //82.5%
+ li
+ list-style: none
+ ul
+ margin: 0
+ padding: 0
+ a
+ text-decoration: none
+
+.everything //.ember-view
+ opacity: 1
+ @include transition(opacity 1s ease)
+
+.preload //.pace-running
+ height: 100vh
+ width: 100vw
+ //position: fixed
+ z-index: 9999
+ //top: 0
+ background: url('/assets/images/Nightiies.png') no-repeat center center
+ background-size: 50vh
+
+ //@include keyframes(appear)
+ //from
+ //top: 100vh
+ @include transform(scale(0))
+ //to
+ //top: 0
+ @include transform(scale(1))
+
+ //@include animation(appear 4s ease 1s 1 normal)
+
+ //.ember-view
+ .everything
+ opacity: 0
+
+.everything
+ @include display(flex)
+ overflow: hidden
+ //height: 100vh
+ //width: 100vw
+
+// -------------------------------------------------
+// New menu
+.menu-button
+ width: 40px//60px
+ height: 40px//60px
+ outline: none
+ position: fixed
+ margin: 5px
+ padding: 8px 9px 9px 9px //14px 15px 15px 15px
+ z-index: 999996
+ border: 2px solid $standard_secondary_color
+ border-radius: 50%
+ background: none //rgba(255,255,255,0.5)
+
+ i
+ font-size: 21px //30px
+ color: $standard_secondary_color
+
+
+.menu
+ $action-color: #477DCA !default
+ $dark-gray: #333 !default
+ $sliding-panel-border-color: $dark-gray
+ $sliding-panel-background: lighten($sliding-panel-border-color, 5%)
+ $sliding-panel-color: #fff
+ $sliding-panel-border: 1px solid $sliding-panel-border-color
+ $sliding-panel-background-hover: $action-color
+ $sliding-panel-color-hover: #fff
+ $sliding-panel-background-focus: lighten($sliding-panel-background, 5%)
+
+ @include position(fixed)
+ @include transform(translateY(-60px)) //X(-160px))
+ @include transition(all 0.25s linear)
+ background: $standard_color //$sliding-panel-background
+ z-index: 999998
+ width: 100%
+ li a
+ @include span-columns(1.5)
+ height: 50px
+ border-right: 1px solid #2e2e2e //border-bottom $sliding-panel-border
+ color: $sliding-panel-color
+ display: block
+ font-size: 1.1em
+ padding: 1em
+ text-decoration: none
+ overflow: hidden
+ //text-overflow: ellipsis
+ white-space: nowrap
+ @media screen and (max-device-width: 640px), screen and (max-width: 800px)
+ @include span-columns(2.6)
+ //span
+ display: none
+
+
+ &:focus, &.active
+ background-color: $standard_light_color //$sliding-panel-background-focus
+
+ &:hover
+ background-color: $sliding-panel-background-hover
+ color: $sliding-panel-color-hover
+
+
+ &.is-visible
+ @include transform(translateY(0))
+
+.fade-menu
+ @include position(fixed, 0px 0px 0px 0px)
+ @include transition
+ background: black
+ opacity: 0
+ visibility: hidden
+ z-index: 999997
+
+ &.is-visible
+ opacity: 0.4
+ visibility: visible
+
+// Track player
+
+@mixin grid-item-columns($columns)
+ width: (100% / 12) * $columns
+
+.player
+ @include flex-grow(0)
+ @include flex-shrink(0)
+ background-color: #474747 //$standard_color
+ ul
+ @include clearfix
+ @include row(table)
+
+ li
+ @include span-columns(1)
+ color: $standard_font_color
+ white-space: nowrap
+ overflow: hidden
+ vertical-align: middle
+
+ li.track_name
+ @include span-columns(6)
+ overflow: hidden
+ text-overflow: ellipsis
+ padding-left: 50px
+
+ //div
+ &:focus, &:hover
+ @include animation(scroll 5s ease infinite)
+
+ //@include keyframes(scroll)
+ from
+ @include transform(translateX(0%))
+ to
+ @include transform(translateX(-100%))
+
+ li.track_player
+ @include span-columns(6)
+
+ //width: 640px
+ line-height: 0px
+ height: 35px
+ iframe
+ display: inline-block
+
+.tracks-colorGrid
+
+ width: 100%
+ margin-right: calc(100% - 100Vw)
+
+ @include display(flex)
+ @include flex-direction(row)
+ @include flex-wrap(wrap)
+ @include align-content(flex-start)
+ @include justify-content(stretch)
+ @include align-items(stretch)
+ //height: 100vh
+
+
+ $base-accent-color: #477DCA !default
+ $base-background-color: white !default
+
+ p
+ line-height: 1.5em
+ a
+ text-decoration: none
+
+ $grid-items-background: $base-background-color
+ $grid-item-background: desaturate($base-accent-color, 30%)
+ $grid-item-colors: desaturate($base-accent-color, 30%), #3581A5, #F7C808, #5FBEBE, #98C79A, #D2315D, #A7A891, #389090, #F47E7D, #B5D045, #FB8335, #81C0C5, #E98813, #22B5BF, #8767A6, #88C134
+
+ .grid-item
+ @include flex-grow(1)
+ @include align-items(center)
+ @include justify-content(center)
+ @include flex-basis(500px)
+
+ @include transition (all 0.2s ease-in-out)
+ background: $grid-item-background
+ margin: 2px
+ cursor: pointer
+ padding: 2em
+ @extend .hvr-trim
+
+ @for $i from 1 through 51 //length($grid-item-colors)
+ &:nth-child(#{$i})
+ $background-from-list: nth($grid-item-colors, $i % 16 + 1)
+ $background-color: transparentize($background-from-list, 0.8)
+ background-color: $background-color
+
+ &:focus, &:hover, &.active
+ background-color: transparentize($background-from-list, 0.4)
+ //@extend .hvr-trim
+
+ .grid-item p
+ margin: auto
+ color: #595959 //rgb(180,180,180)
+
+ span.track_author
+ float: left
+
+ span.track_channel
+ float: right
+
+ span.track_name
+ font-size: 1.1em
+ color: black
+
+ .pagination
+ @include flex-grow(1)
+ width: 100vw
+ margin: 1em
+
+.tracks-table
+ width: 100% //100vw
+ margin-right: calc(100% - 100vw)
+ $base-border-color: gainsboro !default
+ $base-background-color: white !default
+ $base-line-height: 1.5em !default
+ $dark-gray: #333 !default
+ $base-font-color: $dark-gray !default
+
+ //background: url(records_edited.jpg)
+ //background-size: cover
+ //background-position: bottom
+
+ td
+ line-height: $base-line-height
+
+ $table-border-color: $base-border-color
+ $table-border: 1px solid $table-border-color
+ $table-background: $base-background-color
+ $table-hover-background: darken($table-background, 3)
+ $table-padding: 0.8em 1em
+ $table-font-light: rgba(0,0,0,0.6)
+
+ border-collapse: collapse//separate //collapse
+ border-spacing: 0
+
+ tbody
+ //background-color: $table-background
+ tr:hover > td, tr.active > td
+ background-color: $table-hover-background
+ //border-color: $standard_secondary_color
+ //border-bottom: 1px solid $standard_secondary_color
+ color: $standard_secondary_color
+
+ //tr:last-child td
+ border-bottom: 0px
+ td
+ border-bottom: 0px
+ border-top: 1px solid $table-border-color
+ padding: $table-padding
+ overflow: hidden
+
+ td.track_author
+ @include span-columns(2)
+ td.track_name
+ @include span-columns(6)
+ td.track_tags
+ @include span-columns(2)
+ td.track_channel
+ @include span-columns(2)
+ td
+ a
+ color: gray //$table-font-light
+
+
+.menu-placeholder
+ display: inline-block
+ height: 50px //70px
+ width: 50px //70px
+
+.filters-menu
+ @include flex-grow(0)
+ @include flex-shrink(0)
+ //$filter_color: #474747
+ background-color: $standard_color//$filter_color
+ color: $standard_font_color
+ white-space: nowrap
+
+ li
+ height: 50px //70px
+
+ select
+ background: $standard_color//$filter_color
+ border: none
+ outline: none
+ cursor: pointer
+ color: $standard_font_color
+ @include span-columns(2 of 4)
+ height: 25px //35px
+ //@include appearance(none)
+ option
+ width: 100px
+ color: $standard_font_color
+ &:hover, &:focus
+ color: $standard_secondary_color
+
+ input
+ @include span-columns(2 of 4)
+ height: 25px //35px
+ background: $standard_color //$filter_color
+ border: none
+ outline: none
+ color: $standard_font_color
+ &:hover, &:focus
+ color: $standard_secondary_color
+ @include placeholder
+ color: $standard_secondary_color
+
+ ul
+ display: inline-block
+ li
+ @include span-columns(4)
+ height: 25px //35px
+ .first-line
+ position: relative
+ top: -25px//-35px
+ .second-line
+ position: relative
+ left: -50%
+
+ .design
+ font-size: 2em
+ line-height: 50px //70px
+ float: right
+ padding: 0 10px
+ cursor: pointer
+ vertical-align: middle
+ &:hover, &.active
+ color: #2098d1
+
+
+.pagination
+
+ margin: 1em
+ //margin-bottom: 2em
+
+ $base-border-color: gainsboro !default
+ $base-border-radius: 3px !default
+ $base-spacing: 1.5em !default
+ $base-accent-color: #477DCA !default
+ $base-link-color: $base-accent-color !default
+ $dark-gray: #333 !default
+ $large-screen: em(860) !default
+ $base-font-color: $dark-gray !default
+
+ $pagination-border-color: $base-border-color
+ $pagination-border: 1px solid $pagination-border-color
+ $pagination-background: lighten($pagination-border-color, 10)
+ $pagination-hover-background: lighten($pagination-background, 5)
+ $pagination-color: $base-font-color
+
+ text-align: center
+
+ ul
+ display: inline
+ text-align: center
+ li
+ display: inline
+
+ ul li
+ display: none
+
+ &:nth-child(1),
+ &:nth-child(2),
+ &:nth-child(3)
+ display: inline
+
+ @include media($large-screen)
+ display: inline
+
+ li a
+ @include transition (all 0.2s ease-in-out)
+ background: $pagination-background
+ border-radius: $base-border-radius
+ border: $pagination-border
+ color: $pagination-color
+ outline: none
+ padding: ($base-spacing / 4) ($gutter / 2)
+
+ &:hover, &:focus
+ background: $pagination-hover-background
+ color: $base-link-color
+
+ a.current
+ background: $pagination-hover-background
+
+.tracks
+ @include display(flex)
+ @include flex-grow(1)
+ @include flex-basis(200px)
+ @include flex-direction(column)
+ @include flex-wrap(nowrap)
+ @include justify-content(flex-start)
+
+.presentation
+ height: 100vh
+ @include display(flex)
+ @include flex-grow(1)
+ @include flex-basis(200px)
+
+
+ background: url('/assets/images/vinyl_prog.jpg')
+ background-size: cover
+ background-position: bottom
+
+ .abstract
+ color: white
+ margin: auto
+ //padding: 3.5em
+ text-align: center
+ a
+ font-family: wire
+ text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black
+ @include filter(drop-shadow(1px 1px 1px rgba(0,0,0,0.9)))
+ font-size: 7em
+ font-weight: bold
+ color: #2098d1 //white
+ img
+ height: 30vh //10em
+ margin-bottom: 1em
+ p
+ text-align: center
+ font-size: 1em
+ margin-bottom: 0.5em
+
+
+.channels, .users
+ @include display(flex)
+ @include flex-direction(row)
+ @include flex-wrap(wrap)
+ @include flex-grow(1)
+ @include flex-basis(200px)
+ @include align-content(stretch)
+ @include justify-content(stretch)
+ @include align-items(stretch)
+ height: 100vh
+
+ $base-accent-color: #477DCA !default
+
+ $channel-colors: desaturate($base-accent-color, 30%), #3581A5, #F7C808, #5FBEBE, #98C79A, #D2315D, #A7A891, #389090, #F47E7D, #B5D045, #FB8335, #81C0C5, #E98813, #22B5BF, #8767A6, #88C134
+ //#E0C7A8,#BDCC97,#979EA0,
+
+ @include clearfix
+
+ .hided
+ color: transparent
+
+ .channel, .user
+ @include display(flex)
+ @include flex-grow(1)
+ @include align-items(center)
+ @include justify-content(center)
+ @include transition (all 0.2s ease-in-out)
+ //border-radius: 50%
+ cursor: pointer
+ overflow: hidden
+ //@include ellipsis()
+ white-space: nowrap
+
+ @for $i from 1 to 200//through 51 //length($grid-item-colors)
+ &:nth-child(#{$i})
+ $background-from-list: nth($channel-colors, $i % 16 + 1)
+ $background-color: transparentize($background-from-list, 0.8)
+ background-color: $background-color
+
+ &:focus, &:hover
+ background-color: transparentize($background-from-list, 0.4)
+ min-width: 150px
+ color: black
+
+// -------------------------------------------------------------
+// Design for pace plugin
+
+//--------------------------------------------------------------
+//I copy paste here the styles that I need from hover.css
+
+/* Trim */
+.hvr-trim
+ display: inline-block
+ vertical-align: middle
+ @include transform(translateZ(0))
+ box-shadow: 0 0 1px rgba(0, 0, 0, 0)
+ -webkit-backface-visibility: hidden
+ backface-visibility: hidden
+ -moz-osx-font-smoothing: grayscale
+ position: relative
+
+ &:before
+ content: ''
+ position: absolute
+ border: white solid 4px
+ top: 4px
+ left: 4px
+ right: 4px
+ bottom: 4px
+ opacity: 0
+ @include transition (opacity 0.3s)
+
+ &:hover:before, &:focus:before, &:active:before, &.active:before
+ opacity: 1
+
+// ---------------------------------------------------------------------------
+// Cassette design
+.cassette
+ background-image: url("/assets/images/cassette/mixtable_bw.jpg")
+ background-size: cover
+ background-position: center
+ height: 100vh
+ width: 100vw
+
+iframe.cassette
+ width: 0px
+ height: 0px
+ visibility: hidden
+ border: none
+
+/* Main container */
+.cassette-holder
+
+ /* Tape elements */
+ .tape
+ width: 586px
+ height: 379px
+ margin: auto //30px auto 0
+ position: relative
+ @include transition(all .4s ease-in-out)
+ //INFO
+ overflow: hidden
+ &:hover
+ .cassette-back, .cassette-front
+ @include filter(blur(3px) grayscale(90%))
+ @include transition(all, 0.5s ease-in-out)
+ //opacity: 0.9
+ .info-hover
+ @include transform(translate(0, -200%))
+
+ .info-hover
+ padding: 1em 2em
+ @include transition(all, 0.5s ease-in-out)
+ background: transparentize(#000, 0.7)
+ height: inherit
+ width: inherit
+ overflow: hidden
+ color: rgba(255, 255, 255, 0.7)
+
+ .vc-loader
+ position: absolute
+ width: 31px
+ height: 31px
+ bottom: 50px
+ left: 50%
+ margin: -15px 0 0 -15px
+ background: transparent url(images/cassette/ajax-loader.gif) no-repeat center center
+ display: none
+
+.cassette-back
+ width: 100%
+ height: 100%
+ position: relative
+ background: transparent url(images/cassette/cs_back.png) no-repeat center center //DESIGN
+
+ .wheels
+ width: 125px
+ height: 125px
+ position: absolute
+ top: 110px
+ background: transparent
+ border-radius: 50%
+
+ .left-wheel
+ left: 109px
+ box-shadow: 0 0 0 70px #000
+
+ .right-wheel
+ right: 113px //109px DESIGN
+
+//@include animation(scroll 5s ease infinite)
+
+@include keyframes(rotateLeft)
+ from
+ @include transform(rotate(0deg) translateZ(-1px))
+ to
+ @include transform(rotate(-360deg) translateZ(-1px))
+
+@include keyframes(rotateRight)
+ from
+ @include transform(rotate(0deg) translateZ(-1px))
+ to
+ @include transform(rotate(360deg) translateZ(-1px))
+
+.wheels div
+ width: 100%
+ height: 100%
+ background: transparent url(/assets/images/cassette/cs_wheel.png) no-repeat center center
+
+.spin
+ @include animation(rotateLeft 2s linear infinite forwards)
+
+.cassette-front
+ width: 100%
+ height: 100%
+ background: url(/assets/images/cassette/cs_front.png) no-repeat center center //transparent url(images/cassette/cassette_reduced_v4.png) no-repeat center
+ //top: 0px
+ //left: 0px
+ position: relative
+ top: -379px
+
+ span
+ color: rgba(0, 0, 0, 0.7)
+ position: absolute
+ top: 83px
+ left: 67px
+ font-family: Arial
+ font-weight: bold
+ font-size: 20px
+
+ .tape-name
+ position: absolute
+ top: 51px //60px DESIGN
+ left: 100px //90px DESIGN
+ font-family: marker
+ font-size: 25px
+ width: 370px //450px DESIGN
+ margin: 0
+ text-indent: 90px //DESIGN
+
+ //Second design try DESIGN
+ //text-align: left
+ //overflow: hidden
+ //white-space: nowrap
+ //text-overflow: ellipsis
+
+
+/* Controls list */
+ul.vc-controls
+ margin: 0 auto//10px auto DESIGN
+ height: 70px
+ width: 460px //440px
+ @include background(linear-gradient(top, rgba(170,170,170,0.35) 0%, rgba(255,255,255,0.44) 50%, rgba(255,255,255,0.53) 100%))
+ border: 1px solid rgba(0,0,0,0.1)
+ border-bottom-color: rgba(255,255,255,0.6)
+ padding: 8px
+ box-shadow: inset 0 1px 0px rgba(0,0,0,0.05), 0 1px 0 rgba(255,255,255,0.8), 0 -1px 0 rgba(255,255,255,0.4), inset 0 2px 19px rgba(0,0,0,0.05), 0 2px 1px rgba(0,0,0,0.06)
+ //@mixin box-sizing(content-box)
+ border-radius: 12px
+
+/* Controls list items */
+ul.vc-controls li
+ display: block
+ float: left
+ width: 80px
+ height: 50px
+ line-height: 55px
+ text-align: left
+ padding: 10px
+ margin: 0
+ cursor: pointer
+ background: #ddd url(/assets/images/cassette/metal.jpg) no-repeat center top
+ box-shadow: inset 0 0 0 1px rgba(0,0,0, 0.2), inset 0 0 1px 2px rgba(255,255,255,0.9), inset 0 -6px 5px rgba(0,0,0,0.1), 0 6px 7px rgba(0,0,0,0.3), 0 4px 1px rgba(0,0,0,0.5)
+ @include user-select(none)
+
+ul.vc-controls li:first-child
+ border-radius: 8px 0 0 8px
+
+ul.vc-controls li:last-child
+ border-radius: 0px 8px 8px 0px
+
+ul.vc-controls li.vc-control-play
+ width: 120px
+
+/* Control icons */
+ul.vc-controls li span:before
+ font-size: 16px
+ line-height: 50px
+ text-align: center
+ float: left
+ color: #444
+ font-family: 'playericons'
+ text-shadow: 1px 1px 1px rgba(255,255,255,0.9)
+ font-style: normal
+ font-weight: normal
+ text-transform: none
+ speak: none
+ display: inline-block
+ text-decoration: inherit
+ width: 1em
+ margin-right: 0.2em
+ text-align: center
+
+li.vc-control-volume-off span:before
+ content: 'ðŸâ€â€¡'
+li.vc-control-volume-down span:before
+ content: 'ðŸâ€â€°'
+li.vc-control-volume-up span:before
+ content: 'ðŸâ€Å '
+
+ul.vc-controls li:hover
+ box-shadow: inset 0 0 0 1px rgba(0,0,0, 0.2), inset 0 0 1px 2px rgba(255,255,255,0.9), inset 0 -10px 15px rgba(0,0,0,0.1), 0 6px 7px rgba(0,0,0,0.3), 0 4px 1px rgba(0,0,0,0.5)
+
+/* Pressed (active) */
+ul.vc-controls li.vc-control-active
+ height: 50px
+ margin-top: 2px
+ background-image: url(/assets/images/cassette/metal_dark.jpg)
+ box-shadow: inset 0 0 0 1px rgba(0,0,0, 0.18), inset 0 0 1px 2px rgba(255,255,255,0.5), inset 0 -6px 5px rgba(0,0,0,0.1), 0 6px 7px rgba(0,0,0,0.3), 0 2px 1px rgba(0,0,0,0.5)
+
+/* Activated */
+ul.vc-controls li.vc-control-pressed,
+ul.vc-controls li.vc-control-active.vc-control-pressed
+ height: 50px
+ background-image: url(/assets/images/cassette/metal_dark.jpg)
+ margin-top: 4px
+ box-shadow: inset 0 0 0 1px rgba(0,0,0, 0.2), inset 0 0 5px 1px rgba(255,255,255,0.5), inset 0 -10px 15px rgba(0,0,0,0.2), 0 7px 5px rgba(255,255,255,0.5)
+
+//Background for the volume knob
+//See knobKnob.css for the knob style
+.vc-volume-wrap
+ display: none
+ width: 118px
+ height: 118px
+ position: absolute
+ bottom: 0px
+ left: 50%
+ margin-left: -318px
+ @include background(linear-gradient(top, rgba(170,170,170,0.35) 0%, rgba(255,255,255,0.44) 50%, rgba(255,255,255,0.53) 100%))
+ border: 1px solid rgba(0,0,0,0.1)
+ border-radius: 50%
+ padding: 8px
+ box-shadow: inset 0 1px 0px rgba(0,0,0,0.05), 0 1px 0 rgba(255,255,255,0.6), 0 -1px 0 rgba(255,255,255,0.4), inset 0 2px 19px rgba(0,0,0,0.05), 0 2px 1px rgba(0,0,0,0.06)
+ //@mixin box-sizing(content-box)
+
+
+.vc-volume-wrap:after
+ content: 'Volume'
+ margin-top: 15px
+ display: block
+
+/* Text style for controls */
+ul.vc-controls li,
+.vc-volume-wrap:after
+ font-family: 'Aldrich'
+ font-size: 10px
+ font-weight: 300
+ text-transform: uppercase
+ letter-spacing: 1px
+ color: #666
+ text-shadow: 0 1px 1px rgba(255,255,255,0.8)
+
+
diff --git a/app/templates/about.hbs b/app/templates/about.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..07cc859f0c8a81407a4ce4f37c96456ed1145657
--- /dev/null
+++ b/app/templates/about.hbs
@@ -0,0 +1,3 @@
+<div class="about">
+ Soon : playbot informations.
+</div>
diff --git a/app/templates/application.hbs b/app/templates/application.hbs
index 05eb936cf4e4ab1582a9955676a82f4b1b7363d6..633886822eced12b61c9adfa4e80f8f72f92b23e 100644
--- a/app/templates/application.hbs
+++ b/app/templates/application.hbs
@@ -1,3 +1,4 @@
-<h2 id="title">Welcome to Ember.js</h2>
-
-{{outlet}}
+<div class="everything">
+ {{render 'navigation'}}
+ {{outlet}}
+</div>
diff --git a/app/templates/cassette.hbs b/app/templates/cassette.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..08efbf3bb1c10827affad266d6c07d7d8ab58106
--- /dev/null
+++ b/app/templates/cassette.hbs
@@ -0,0 +1,46 @@
+<iframe id="iframe" class="cassette" frameborder="no" src=""></iframe>
+<div id="vc-container" class="cassette-holder">
+ <div class="tape">
+ <div class="cassette-back">
+ <div class="wheels left-wheel"><div></div></div>
+ <div class="wheels right-wheel"><div></div></div>
+ </div>
+ <div class="cassette-front">
+ <span>A</span>
+ <p class="tape-name">{{track.name}}</p>
+ </div>
+ <div class="tape-info info-hover">
+ <p>{{track.id}}</p>
+ <p>{{track.name}}</p>
+ <p>{{track.channel}}</p>
+ <p>{{track.author}}</p>
+ <p>{{#each tag in track.tag}}
+ {{tag.name}}
+ {{/each}}</p>
+ </div>
+ </div>
+
+ <ul class="vc-controls">
+ <li class='vc-control-play' {{action "playButton"}}>
+ <i class='fa fa-play'></i> Play
+ </li>
+ <li class="vc-control-rewind">
+ <i class='fa fa-backward'></i> Rew
+ </li>
+ <li class="vc-control-fforward">
+ <i class='fa fa-forward'></i> FF
+ </li>
+ <li class="vc-control-stop" {{action "stopButton"}}>
+ <i class='fa fa-stop'></i> Stop
+ </li>
+ <li class="vc-control-switch" {{action "nextButton"}}>
+ Random
+ </li>
+ </ul>
+ <div class="vc-volume-wrap">
+ <div class="vc-volume-control">
+ <div class="vc-volume-knob"></div>
+ </div>
+ </div>
+</div>
+
diff --git a/app/templates/channelfilter.hbs b/app/templates/channelfilter.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..4cc4021597969c90dda7b571403745bd9a2f1b31
--- /dev/null
+++ b/app/templates/channelfilter.hbs
@@ -0,0 +1,9 @@
+{{view "select"
+ viewName='channelSelect'
+ classNames="channelfilter"
+ content=model
+ optionValuePath="content.name"
+ optionLabelPath="content.name"
+ value=channelSelected
+ prompt='Channels - all'
+}}
diff --git a/app/templates/channels.hbs b/app/templates/channels.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..16f08331d22e341fb1d49d6f9dcba7ee74eebb19
--- /dev/null
+++ b/app/templates/channels.hbs
@@ -0,0 +1,7 @@
+<div class="channels">
+ {{#each channel in controller}}
+ {{#link-to 'tracks' (query-params channel=channel.model.name) tagName='div' style=channel.style class=channel.category title=channel.info}}
+ {{channel.model.name}}
+ {{/link-to}}
+ {{/each}}
+</div>
diff --git a/app/templates/design.hbs b/app/templates/design.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..e7d9d29764c18dac1099e304b9daece4398829b5
--- /dev/null
+++ b/app/templates/design.hbs
@@ -0,0 +1,9 @@
+{{#link-to 'tracks' (query-params design="table") tagName='span' classNames='design'}}
+ <i class="fa fa-list"></i>
+{{/link-to}}
+{{#link-to 'tracks' (query-params design="colorGrid") tagName='span' classNames='design'}}
+ <i class="fa fa-th"></i>
+{{/link-to}}
+{{#link-to 'tracks' (query-params design="cassette") tagName='span' classNames='design'}}
+ <i class="fa fa-simplybuilt"></i>
+{{/link-to}}
diff --git a/app/templates/filtersmenu.hbs b/app/templates/filtersmenu.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..2c765ba8d2571441732c0e20f3a5ac2a421a8ee1
--- /dev/null
+++ b/app/templates/filtersmenu.hbs
@@ -0,0 +1,15 @@
+<ul class="filters-menu">
+ <li>
+ {{render "design"}}
+ <div class="menu-placeholder"></div>
+ <ul>
+ <li class="first-line">
+ {{render "tagfilter" model.tags}}{{render "channelfilter" model.channels}}
+ </li>
+ <li class="second-line">
+ {{render "userfilter" model.users}}
+ {{input type='text' value=date classNames='datefilter' placeholder=" Select a date"}}
+ </li>
+ </ul>
+ </li>
+</ul>
diff --git a/app/templates/index.hbs b/app/templates/index.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..ce3878003be1e628950e50953bbe74c3dc940c8d
--- /dev/null
+++ b/app/templates/index.hbs
@@ -0,0 +1,6 @@
+<div class="presentation">
+ <div class="abstract">
+ {{#link-to 'tracks' }}NIGHTIIES{{/link-to}}
+ <p>Welcome to PlayBot unofficial website. Listen to handpicked tracks.</p>
+ </div>
+</div>
diff --git a/app/templates/navigation.hbs b/app/templates/navigation.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..214ae9515d2f33a6e1600359680309848e83e370
--- /dev/null
+++ b/app/templates/navigation.hbs
@@ -0,0 +1,34 @@
+<ul class="menu" {{action 'menu'}}>
+ <li>
+ {{#link-to 'index'}}
+ <i class='logo fa fa-fw fa-bookmark-o'></i>
+ <span>Home</span>
+ {{/link-to}}
+ </li>
+ <li>
+ {{#link-to 'tracks' classNames='text'}}
+ <i class="fa fa-fw fa-music"></i>
+ <span>Tracks</span>
+ {{/link-to}}
+ </li>
+ <li>
+ {{#link-to 'users' classNames='text'}}
+ <i class="fa fa-fw fa-users"></i>
+ <span>Users</span>
+ {{/link-to}}
+ </li>
+ <li>
+ {{#link-to 'channels' classNames='text'}}
+ <i class="fa fa-fw fa-slack"></i>
+ <span>Channels</span>
+ {{/link-to}}
+ </li>
+ <li>
+ {{#link-to 'about' classNames="text"}}
+ <i class="fa fa-fw fa-info" ></i>
+ <span>About</span>
+ {{/link-to}}
+ </li>
+</ul>
+<button {{action 'menu'}} class="menu-button"><i class="fa fa-bars"></i></button>
+<div class="fade-menu" {{action 'menu'}}></div>
diff --git a/app/templates/pagination.hbs b/app/templates/pagination.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..21b2eb7099507c097d5f36a950acab67126cbde4
--- /dev/null
+++ b/app/templates/pagination.hbs
@@ -0,0 +1,27 @@
+<div class="pagination">
+ <ul>
+ {{#if notFirstPage}}
+ <li class="page-prev">{{#link-to (query-params page=1)}}First{{/link-to}}</li>
+ <li class="page-prev">{{#link-to (query-params page=prevPage)}}Previous{{/link-to}}</li>
+ {{/if}}
+ <li>
+ {{#if dotsBefore}}
+ <li> ... </li>
+ {{/if}}
+ <ul>
+ {{#each page in pagesRange}}
+ <li>{{#link-to (query-params page=page)}}{{page}}{{/link-to}}</li>
+ {{/each}}
+ {{!-- <li><a class="current">{{currentPage}}</a></li> --}}
+ </ul>
+ </li>
+ {{#if dotsAfter}}
+ <li> ... </li>
+ {{/if}}
+ {{#if notLastPage}}
+ <li class="page-next">{{#link-to (query-params page=nextPage)}}Next{{/link-to}}</li>
+ <li class="page-next">{{#link-to (query-params page=totalPages)}}Last ({{totalPages}}){{/link-to}}</li>
+ {{/if}}
+ </ul>
+</div>
+
diff --git a/app/templates/tagfilter.hbs b/app/templates/tagfilter.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..24343b99ee91f23aab8b77f842f5b3f4fc7a16b3
--- /dev/null
+++ b/app/templates/tagfilter.hbs
@@ -0,0 +1,9 @@
+{{view "select"
+ viewName='tagSelect'
+ classNames="tagfilter"
+ content=model
+ optionValuePath="content.name"
+ optionLabelPath="content.name"
+ value=tagSelected
+ prompt='Tags - all'
+}}
diff --git a/app/templates/track.hbs b/app/templates/track.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..4271f90e99b63b0854a35fd9e2f49bd8cbb8f1b8
--- /dev/null
+++ b/app/templates/track.hbs
@@ -0,0 +1,10 @@
+<div class="player">
+ <ul>
+ <li class='track_name'>
+ <span> [{{model.id}}] {{model.name}}</span>
+ </li>
+ <li class='track_player'>
+ <iframe id="iframe" width="1px" height="20px" scrolling="no" frameborder="no" src=""></iframe>
+ </li>
+ </ul>
+</div>
diff --git a/app/templates/tracks.hbs b/app/templates/tracks.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..856846e0f1a7038426cc5bc2013d2d0dce4e6801
--- /dev/null
+++ b/app/templates/tracks.hbs
@@ -0,0 +1,58 @@
+<div {{bind-attr class=":tracks design"}}>
+ {{render "filtersmenu" model}}
+
+ {{outlet}}
+ {{#if cassetteDesign}}
+ {{render "cassette" model}}
+ {{/if}}
+ {{#if tableDesign}}
+ <table class="tracks-table">
+ <tbody>
+ {{#each track in model.tracks}}
+ {{#link-to 'track' track tagName='tr' data-trackid=track.id}}
+ {{!--<td class='track_id'>{{track.id}}</td>--}}
+ <td class='track_author'>
+ {{#link-to 'tracks' (query-params user=track.author page=1) bubbles=false}}{{track.author}}{{/link-to}}
+ </td>
+ <td class='track_name'>{{track.name}}</td>
+ <td class='track_tags'>
+ {{#each tag in track.tag}}
+ {{#link-to 'tracks' (query-params tag=tag.name page=1) bubbles=false}}{{tag.name}}{{/link-to}}
+ {{/each}}
+ </td>
+ <td class='track_channel'>{{#link-to 'tracks' (query-params channel=track.channel page=1) bubbles=false}}{{track.channel}}{{/link-to}}</td>
+ {{/link-to}}
+ {{/each}}
+ </tbody>
+ </table>
+ {{partial "pagination"}}
+{{/if}}
+{{#if colorGridDesign}}
+<div class="tracks-colorGrid">
+ {{#each track in model.tracks}}
+ {{#link-to 'track' track class="grid-item" data-trackid=track.id}}
+ <p class='track'>
+ <span class="track_author">{{track.author}}</span>
+ <span class="track_channel">{{track.channel}}</span>
+ <br/>
+ </p>
+ <p>
+ <br/>
+ <span class="track_name">
+ {{track.name}}
+ </span>
+ </p>
+ <p class='track'>
+ <br/>
+ {{#each tag in track.tag}}
+ {{tag.name}}
+ {{/each}}
+ </p>
+ {{/link-to}}
+ {{/each}}
+ {{partial "pagination"}}
+ </div>
+
+ {{/if}}
+</div>
+
diff --git a/app/templates/userfilter.hbs b/app/templates/userfilter.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..2b36b6e5447dd0a4e8b7c30a8fc4128ba4eaa53f
--- /dev/null
+++ b/app/templates/userfilter.hbs
@@ -0,0 +1,9 @@
+{{view "select"
+ viewName='userSelect'
+ classNames="userfilter"
+ content=model
+ optionValuePath="content.name"
+ optionLabelPath="content.name"
+ value=userSelected
+ prompt='Users - all'
+}}
diff --git a/app/templates/users.hbs b/app/templates/users.hbs
new file mode 100644
index 0000000000000000000000000000000000000000..2283e6d00fd4de313bca8e044fda3ca881ba2afe
--- /dev/null
+++ b/app/templates/users.hbs
@@ -0,0 +1,5 @@
+<div class="users">
+ {{#each user in controller}} {{!itemController='user'}}
+ {{#link-to 'tracks' (query-params user=user.model.name) tagName='div' title=user.info style=user.style class=user.category}} {{user.model.name}} {{/link-to}}
+ {{/each}}
+</div>
diff --git a/app/views/application.js b/app/views/application.js
new file mode 100644
index 0000000000000000000000000000000000000000..74023e89acc6cf6cb809fcda1fb4a3f0db5d52a9
--- /dev/null
+++ b/app/views/application.js
@@ -0,0 +1,9 @@
+import Ember from 'ember';
+
+var ApplicationView = Ember.View.extend({
+ willInsertElement: function() {
+ $('body').removeClass('preload');
+ }
+});
+
+export default ApplicationView;
diff --git a/app/views/navigation.js b/app/views/navigation.js
new file mode 100644
index 0000000000000000000000000000000000000000..ad5deedc4815423d8b424fc13233e36c7ae7a360
--- /dev/null
+++ b/app/views/navigation.js
@@ -0,0 +1,7 @@
+import Ember from 'ember';
+
+var NavigationView = Ember.View.extend({
+ tagName: 'nav',
+});
+
+export default NavigationView;
diff --git a/app/views/tracks.js b/app/views/tracks.js
new file mode 100644
index 0000000000000000000000000000000000000000..2dbe2946c61f3a8276fe832eee1f6a4cd13e3377
--- /dev/null
+++ b/app/views/tracks.js
@@ -0,0 +1,10 @@
+import Ember from 'ember';
+
+var TracksView = Ember.View.extend({
+ didInsertElement: function() {
+ $('.datefilter').dateDropper({format: "Y-m-d", animation: "dropdown", color: "#2098d1", textColor: "#333000"});
+ $('.datefilter').prop('readonly',false);
+ }
+});
+
+export default TracksView;
diff --git a/bower.json b/bower.json
index dc0f3b318815236f0bafa1c10f428a8c29592ff1..ae8a8cebb1d92f42ff6c0c4468f2a489fcc69b90 100644
--- a/bower.json
+++ b/bower.json
@@ -11,6 +11,12 @@
"ember-resolver": "~0.1.15",
"jquery": "^1.11.1",
"loader.js": "ember-cli/loader.js#3.2.0",
- "qunit": "~1.17.1"
+ "qunit": "~1.17.1",
+ "bourbon": "~4.2.3",
+ "neat": "~1.7.2",
+ "datedropper": "*",
+ "pace": "~1.0.2",
+ "cheet.js": "~0.3.3",
+ "normalize.css": "~3.0.3"
}
}
diff --git a/config/environment.js b/config/environment.js
index 56a70cebefd03c33e42c6d9d5f8732941ebda4b1..1a2632312870128e909074b9531b7ae2d1590e5d 100644
--- a/config/environment.js
+++ b/config/environment.js
@@ -13,6 +13,16 @@ module.exports = function(environment) {
}
},
+ contentSecurityPolicy: {
+ 'default-src': "'none'",
+ 'script-src': "'self' 'unsafe-inline' 'unsafe-eval' w.soundcloud.com www.youtube.com s.ytimg.com",
+ 'font-src': "'self' maxcdn.bootstrapcdn.com",
+ 'connect-src': "'self' api-playbot.skizzk.fr soundcloud.com",
+ 'img-src': "'self'",
+ 'style-src': "'self' 'unsafe-inline' maxcdn.bootstrapcdn.com",
+ 'frame-src': "www.youtube.com w.soundcloud.com"
+ },
+
APP: {
// Here you can pass flags/options to your application instance
// when it is created
diff --git a/package.json b/package.json
index 422a46065d5e5bbbf8b0da194280ff0214d90047..df50e93f62698d165f3c4448945df8cc3a2a400b 100644
--- a/package.json
+++ b/package.json
@@ -29,6 +29,7 @@
"ember-cli-ic-ajax": "0.1.1",
"ember-cli-inject-live-reload": "^1.3.0",
"ember-cli-qunit": "0.3.13",
+ "ember-cli-sass": "4.0.0",
"ember-cli-uglify": "^1.0.1",
"ember-data": "1.0.0-beta.17",
"ember-disable-proxy-controllers": "^0.7.0",
diff --git a/public/assets/fonts/Electro.otf b/public/assets/fonts/Electro.otf
new file mode 100644
index 0000000000000000000000000000000000000000..5dc76096ed1d33dc3e4f55d9b5d5761a9bf096e1
Binary files /dev/null and b/public/assets/fonts/Electro.otf differ
diff --git a/public/assets/fonts/Electro.woff b/public/assets/fonts/Electro.woff
new file mode 100644
index 0000000000000000000000000000000000000000..1b893ab453e4482b366038985ddff93919ac7261
Binary files /dev/null and b/public/assets/fonts/Electro.woff differ
diff --git a/public/assets/fonts/colors_of_autumn.ttf b/public/assets/fonts/colors_of_autumn.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..19838bf9a350c77774de1342083e80c580330770
Binary files /dev/null and b/public/assets/fonts/colors_of_autumn.ttf differ
diff --git a/public/assets/fonts/marker_comp.ttf b/public/assets/fonts/marker_comp.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..f8df218451fd8257632d003f208005015f33d7bb
Binary files /dev/null and b/public/assets/fonts/marker_comp.ttf differ
diff --git a/public/assets/fonts/prometheus.ttf b/public/assets/fonts/prometheus.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..0274ac47977d8927f3adc5f2901cc634140ca0f3
Binary files /dev/null and b/public/assets/fonts/prometheus.ttf differ
diff --git a/public/assets/fonts/stasmic.ttf b/public/assets/fonts/stasmic.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..4df21d7d800965621efc9343e5d1fd1716118276
Binary files /dev/null and b/public/assets/fonts/stasmic.ttf differ
diff --git a/public/assets/fonts/string_and_wire.ttf b/public/assets/fonts/string_and_wire.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..ee91595f97d28fcda39cd008e30af7d445c5a26a
Binary files /dev/null and b/public/assets/fonts/string_and_wire.ttf differ
diff --git a/public/assets/fonts/string_and_wire.woff b/public/assets/fonts/string_and_wire.woff
new file mode 100644
index 0000000000000000000000000000000000000000..fc5fec06fcae903dba4a1491a618a183e7e68355
Binary files /dev/null and b/public/assets/fonts/string_and_wire.woff differ
diff --git a/public/assets/fonts/twin_marker.ttf b/public/assets/fonts/twin_marker.ttf
new file mode 100644
index 0000000000000000000000000000000000000000..f5e6ffdb1f8f83c36f0b2bb6c1d1c203472aa89e
Binary files /dev/null and b/public/assets/fonts/twin_marker.ttf differ
diff --git a/public/assets/icons/done.png b/public/assets/icons/done.png
new file mode 100644
index 0000000000000000000000000000000000000000..4606ef282ca559e5b2e1d44973ed993bed708fd5
Binary files /dev/null and b/public/assets/icons/done.png differ
diff --git a/public/assets/icons/done.svg b/public/assets/icons/done.svg
new file mode 100644
index 0000000000000000000000000000000000000000..0fd41dfaf71a50a0a6acbf580458a7bc59359a32
--- /dev/null
+++ b/public/assets/icons/done.svg
@@ -0,0 +1 @@
+<?xml version="1.0" ?><!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg enable-background="new 0 0 32 32" height="32px" id="Layer_1" version="1.1" viewBox="0 0 32 32" width="32px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M30.171,6.131l-0.858-0.858c-0.944-0.945-2.489-0.945-3.433,0L11.294,19.859l-5.175-5.174 c-0.943-0.944-2.489-0.944-3.432,0.001l-0.858,0.857c-0.943,0.944-0.943,2.489,0,3.433l7.744,7.75c0.944,0.945,2.489,0.945,3.433,0 L30.171,9.564C31.112,8.62,31.112,7.075,30.171,6.131z" fill="#f8f8f8"/></svg>
\ No newline at end of file
diff --git a/public/assets/icons/next.png b/public/assets/icons/next.png
new file mode 100644
index 0000000000000000000000000000000000000000..19f3e46f2ca8d2a163015bbfc23c872bad4fd7a3
Binary files /dev/null and b/public/assets/icons/next.png differ
diff --git a/public/assets/icons/next.svg b/public/assets/icons/next.svg
new file mode 100644
index 0000000000000000000000000000000000000000..412fec7778c9974eb1cbf0c71863ed11fe2ba11e
--- /dev/null
+++ b/public/assets/icons/next.svg
@@ -0,0 +1 @@
+<?xml version="1.0" ?><!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg enable-background="new 0 0 32 32" height="32px" id="Layer_1" version="1.1" viewBox="0 0 32 32" width="32px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M24.291,14.276L14.705,4.69c-0.878-0.878-2.317-0.878-3.195,0l-0.8,0.8c-0.878,0.877-0.878,2.316,0,3.194 L18.024,16l-7.315,7.315c-0.878,0.878-0.878,2.317,0,3.194l0.8,0.8c0.878,0.879,2.317,0.879,3.195,0l9.586-9.587 c0.472-0.471,0.682-1.103,0.647-1.723C24.973,15.38,24.763,14.748,24.291,14.276z" fill="#dddddd"/></svg>
\ No newline at end of file
diff --git a/public/assets/icons/prev.png b/public/assets/icons/prev.png
new file mode 100644
index 0000000000000000000000000000000000000000..a71df841c9548ef8c7fc2a2a7eb79a6c22714e07
Binary files /dev/null and b/public/assets/icons/prev.png differ
diff --git a/public/assets/icons/prev.svg b/public/assets/icons/prev.svg
new file mode 100644
index 0000000000000000000000000000000000000000..7fa892991cfb04c9adeaa7b7638a91a62d7bb13c
--- /dev/null
+++ b/public/assets/icons/prev.svg
@@ -0,0 +1 @@
+<?xml version="1.0" ?><!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg enable-background="new 0 0 32 32" height="32px" id="Layer_1" version="1.1" viewBox="0 0 32 32" width="32px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M7.701,14.276l9.586-9.585c0.879-0.878,2.317-0.878,3.195,0l0.801,0.8c0.878,0.877,0.878,2.316,0,3.194 L13.968,16l7.315,7.315c0.878,0.878,0.878,2.317,0,3.194l-0.801,0.8c-0.878,0.879-2.316,0.879-3.195,0l-9.586-9.587 C7.229,17.252,7.02,16.62,7.054,16C7.02,15.38,7.229,14.748,7.701,14.276z" fill="#dddddd"/></svg>
\ No newline at end of file
diff --git a/public/assets/images/Nightiies.png b/public/assets/images/Nightiies.png
new file mode 100644
index 0000000000000000000000000000000000000000..73e3fa3faa14c7fe903259e9057517066de6c7a4
Binary files /dev/null and b/public/assets/images/Nightiies.png differ
diff --git a/public/assets/images/cassette/AttributionsImages.txt b/public/assets/images/cassette/AttributionsImages.txt
new file mode 100644
index 0000000000000000000000000000000000000000..431066b6e3e2f4ab91e56b23b3ecec363393f085
--- /dev/null
+++ b/public/assets/images/cassette/AttributionsImages.txt
@@ -0,0 +1,2 @@
+
+Cassette Tape by Mauricio Estrella http://manicho.deviantart.com/art/Cassette-PSD-File-86548493
\ No newline at end of file
diff --git a/public/assets/images/cassette/ajax-loader.gif b/public/assets/images/cassette/ajax-loader.gif
new file mode 100644
index 0000000000000000000000000000000000000000..6d57ce470b6e1ed205b1c93dd5d1caf76ef0c1b3
Binary files /dev/null and b/public/assets/images/cassette/ajax-loader.gif differ
diff --git a/public/assets/images/cassette/cassette_reduced_v4.png b/public/assets/images/cassette/cassette_reduced_v4.png
new file mode 100644
index 0000000000000000000000000000000000000000..832f00927c4d3d430ac060960c6be630a2f77100
Binary files /dev/null and b/public/assets/images/cassette/cassette_reduced_v4.png differ
diff --git a/public/assets/images/cassette/cs_back.png b/public/assets/images/cassette/cs_back.png
new file mode 100644
index 0000000000000000000000000000000000000000..9264c5fb38a2833d461fc40cdf7a5c9bb3d8dc68
Binary files /dev/null and b/public/assets/images/cassette/cs_back.png differ
diff --git a/public/assets/images/cassette/cs_front.png b/public/assets/images/cassette/cs_front.png
new file mode 100644
index 0000000000000000000000000000000000000000..7c408227f66d688494c5a0eaf49f70f13ff71a43
Binary files /dev/null and b/public/assets/images/cassette/cs_front.png differ
diff --git a/public/assets/images/cassette/cs_front_backup.png b/public/assets/images/cassette/cs_front_backup.png
new file mode 100644
index 0000000000000000000000000000000000000000..83ad1eefac0902e410471cef6bf13944092ac3e1
Binary files /dev/null and b/public/assets/images/cassette/cs_front_backup.png differ
diff --git a/public/assets/images/cassette/cs_wheel.png b/public/assets/images/cassette/cs_wheel.png
new file mode 100644
index 0000000000000000000000000000000000000000..b33b4180e81fbe84199f1b71c8851f28d6c0dd23
Binary files /dev/null and b/public/assets/images/cassette/cs_wheel.png differ
diff --git a/public/assets/images/cassette/knob.jpg b/public/assets/images/cassette/knob.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..cbdb2b05de31e520f49cab0d5e53292818ee7783
Binary files /dev/null and b/public/assets/images/cassette/knob.jpg differ
diff --git a/public/assets/images/cassette/metal.jpg b/public/assets/images/cassette/metal.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..662a850689eff4b5b16caa73eac56913461547ea
Binary files /dev/null and b/public/assets/images/cassette/metal.jpg differ
diff --git a/public/assets/images/cassette/metal_dark.jpg b/public/assets/images/cassette/metal_dark.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..3672e8231428d58bc92ee82b852785c151a4d7bd
Binary files /dev/null and b/public/assets/images/cassette/metal_dark.jpg differ
diff --git a/public/assets/images/cassette/mixtable_bw.jpg b/public/assets/images/cassette/mixtable_bw.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..fa7bc8b631d590131df2506a375d20a28152eeae
Binary files /dev/null and b/public/assets/images/cassette/mixtable_bw.jpg differ
diff --git a/public/assets/images/vinyl_prog.jpg b/public/assets/images/vinyl_prog.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..103f3d46b43a756c8823df48fb1e1ed2895e6c9a
Binary files /dev/null and b/public/assets/images/vinyl_prog.jpg differ
diff --git a/public/assets/samples/Navi_Hey.wav b/public/assets/samples/Navi_Hey.wav
new file mode 100644
index 0000000000000000000000000000000000000000..ff01b030782fb42c7ef5fd6bb245f70f81b8f66b
Binary files /dev/null and b/public/assets/samples/Navi_Hey.wav differ
diff --git a/public/assets/samples/Navi_Listen.wav b/public/assets/samples/Navi_Listen.wav
new file mode 100644
index 0000000000000000000000000000000000000000..5bd8b785ef2e93fea70acc51a1becc034856636c
Binary files /dev/null and b/public/assets/samples/Navi_Listen.wav differ
diff --git a/public/assets/samples/l_balemboy.wav b/public/assets/samples/l_balemboy.wav
new file mode 100644
index 0000000000000000000000000000000000000000..08a473d65b9440581ef04ffd8526a42ece143cc9
Binary files /dev/null and b/public/assets/samples/l_balemboy.wav differ
diff --git a/public/assets/samples/non.mp3 b/public/assets/samples/non.mp3
new file mode 100644
index 0000000000000000000000000000000000000000..d1645843f3650338d37c24abbd82b18061d57531
Binary files /dev/null and b/public/assets/samples/non.mp3 differ
diff --git a/public/assets/samples/omg.ogg b/public/assets/samples/omg.ogg
new file mode 100644
index 0000000000000000000000000000000000000000..6850b458f2c6f35906d4d4a2e7bed6f73c311de5
Binary files /dev/null and b/public/assets/samples/omg.ogg differ
diff --git a/public/assets/samples/omg_long.ogg b/public/assets/samples/omg_long.ogg
new file mode 100644
index 0000000000000000000000000000000000000000..5ae73782ee427d23c8f8e4ffda3e8aec4e5e3365
Binary files /dev/null and b/public/assets/samples/omg_long.ogg differ
diff --git a/public/assets/samples/s_balemboy.wav b/public/assets/samples/s_balemboy.wav
new file mode 100644
index 0000000000000000000000000000000000000000..5b6f204dff3392c4b25eb1c5c2c17b25ff9d7e0b
Binary files /dev/null and b/public/assets/samples/s_balemboy.wav differ
diff --git a/vendor/boombox.js b/vendor/boombox.js
new file mode 100644
index 0000000000000000000000000000000000000000..904d6fc2bda27e6a04ae16036e7741dd7ed0a37e
--- /dev/null
+++ b/vendor/boombox.js
@@ -0,0 +1,141 @@
+var wheels;
+var player = null;
+var trackLength;
+var timeElapsed;
+// Cassette player --------------------
+function next_cassette() {
+ $(".vc-control-switch").click();
+ //__container__.lookup('controller:cassette').next();
+ //inject('controller', 'cassette', 'cassette:next');
+ //this.container.lookup("").format(date);
+ //CassetteController.send('next');
+ //this.get('controllers.cassette').send('next');
+}
+function play_cassette(track) {
+ $('.vc-control-play').addClass('vc-control-active');
+ if ( track.get('provider') == "youtube") {
+ youtube_cassette(track);
+ }
+ else if ( track.get('provider') == "soundcloud" ){
+ soundcloud_cassette(track);
+ }
+ else {
+ next_cassette();
+ }
+ //$('.tape-name').html(track.get('name'));
+ startWheels(track);
+}
+function onCassetteEnding(event) {
+ if (event.data == YT.PlayerState.ENDED) {
+ next_cassette();
+ }
+}
+function onCassetteError(event) {
+ next_cassette();
+}
+function youtube_cassette(track){
+ if (player == null) {
+ $('iframe').attr('id','youtubeIframe');
+
+ var youtube_id = track.get('url').replace(/.*(v=|be\/)/,'');
+ url = "https://www.youtube.com/embed/"+youtube_id+"?enablejsapi=1&autoplay=1&iv_load_policy=3&origin=https://playbot.skizzk.fr"; //theme=light
+ $('#youtubeIframe').attr('src',url);
+
+ player = new YT.Player('youtubeIframe', {
+ events: {
+ 'onError': onCassetteError,
+ 'onStateChange': onCassetteEnding,
+ }
+ });
+ }
+ else {
+ player.playVideo();
+ }
+}
+function soundcloud_cassette(track){
+ if (player == null) {
+ var url = track.get('url'); //.replace(/.*(v=|be\/)/,'');
+
+ $.getJSON(
+ "https://soundcloud.com/oembed?url=" + url + "&format=json",
+ function ( data ) {
+ player = data.html.replace('&show_artwork=true','&auto_play=true');
+ $('iframe').replaceWith(player);
+ $('iframe').attr('id','soundcloudIframe').addClass('cassette');
+ setTimeout(soundcloud_listener_cassette, 2000 );
+ }
+ ).fail(function() {
+ next_cassette();
+ });
+
+ }
+ else {
+ var widget = SC.Widget('soundcloudIframe');
+ widget.play();
+ }
+}
+function soundcloud_listener_cassette() {
+ var widget = SC.Widget('soundcloudIframe');
+ widget.bind(SC.Widget.Events.READY, function() {
+ widget.bind(SC.Widget.Events.FINISH, next_cassette );
+ });
+}
+function stop_cassette(track) {
+ $('.vc-control-stop').addClass('vc-control-active');
+ $('.vc-control-play').removeClass('vc-control-active');
+ stopWheels();
+ setTimeout(function() {$('.vc-control-stop').removeClass('vc-control-active');}, 100);
+ if ( track.get('provider') == "youtube" ) {
+ player.pauseVideo();
+ }
+ else if( track.get('provider') == "soundcloud" ) {
+ var widget = SC.Widget('soundcloudIframe');
+ widget.pause();
+ }
+}
+function duration(track) {
+ if ( track.get('provider') == "youtube" ) {
+ return player.getDuration();
+ }
+ else if ( track.get('provider') == "soundcloud" ) {
+ var widget = SC.Widget('soundcloudIframe');
+ widget.getDuration(function(length) {
+ trackLength = length;
+ });
+ return trackLength;
+ }
+}
+function currentTime(track) {
+ if ( track.get('provider') == "youtube" ) {
+ return player.getCurrentTime();
+ }
+ else if ( track.get('provider') == "soundcloud" ) {
+ var widget = SC.Widget('soundcloudIframe');
+ widget.getPosition(function(position) {
+ timeElapsed = position;
+ });
+ return timeElapsed;
+ }
+}
+function wheelWidthCalc(track) {
+ var trackLength = duration(track);
+ var current = currentTime(track);
+ var wheelWidth = {
+ left: ( -70 / trackLength ) * current + 70,
+ right: ( 70 / trackLength ) * current
+ };
+ return wheelWidth;
+}
+function wheelWidthUpdate(track) {
+ var wheelWidth = wheelWidthCalc(track);
+ $('.left-wheel').css({ 'box-shadow' : '0 0 0 '+ wheelWidth.left +'px black' });
+ $('.right-wheel').css({ 'box-shadow' : '0 0 0 '+ wheelWidth.right +'px black'});
+}
+function startWheels(track) {
+ $('.wheels').addClass('spin');
+ wheels = setInterval(function() {wheelWidthUpdate(track)}, 500);
+}
+function stopWheels() {
+ $('.wheels').removeClass('spin');
+ clearInterval(wheels);
+}
diff --git a/vendor/cheet-sounds.js b/vendor/cheet-sounds.js
new file mode 100644
index 0000000000000000000000000000000000000000..f84f0947341c92273cfed0ebb136e6e973532ff8
--- /dev/null
+++ b/vendor/cheet-sounds.js
@@ -0,0 +1,40 @@
+cheet('b a l e m b o y', function () {
+ if (Math.random() > 0.5) {
+ var audio = new Audio('/assets/samples/l_balemboy.wav');
+ }
+ else {
+ var audio = new Audio('/assets/samples/s_balemboy.wav');
+ }
+ audio.play();
+});
+cheet('n a v i', function () {
+ if (Math.random() > 0.5) {
+ var audio = new Audio('/assets/samples/Navi_Hey.wav');
+ }
+ else {
+ var audio = new Audio('/assets/samples/Navi_Listen.wav');
+ }
+ audio.play();
+});
+cheet('l i s t e n', function () {
+ var audio = new Audio('/assets/samples/Navi_Listen.wav');
+ audio.play();
+});
+cheet('h e y', function () {
+ var audio = new Audio('/assets/samples/Navi_Hey.wav');
+ audio.play();
+});
+cheet('n o n', function () {
+ var audio = new Audio('/assets/samples/non.mp3');
+ audio.play();
+});
+cheet('o m g', function () {
+ if (Math.random() > 0.5) {
+ var audio = new Audio('/assets/samples/omg.ogg');
+ }
+ else {
+ var audio = new Audio('/assets/samples/omg_long.ogg');
+ }
+ audio.play();
+});
+
diff --git a/vendor/turntables.js b/vendor/turntables.js
new file mode 100644
index 0000000000000000000000000000000000000000..c87c592811ef9bc4cd17789ba39ee1f3d9f1cb57
--- /dev/null
+++ b/vendor/turntables.js
@@ -0,0 +1,72 @@
+var track_id;
+var player = null;
+function next_track() {
+ $('iframe').attr('id','iframe');
+ if ($("a[data-trackid=\'"+track_id+"\']").length) {
+ next = $("a[data-trackid=\'"+track_id+"\']").next();
+ }
+ else {
+ next = $("tr[data-trackid=\'"+track_id+"\']").next();
+ }
+ next.click();
+}
+function soundcloud_listener() {
+ var widget = SC.Widget('soundcloudIframe');
+ widget.bind(SC.Widget.Events.READY, function() {
+ widget.bind(SC.Widget.Events.FINISH, next_track );
+ });
+}
+function onPlayerReady(event) {
+ event.target.playVideo();
+}
+function onPlayerStateChange(event) {
+ if (event.data == YT.PlayerState.ENDED) {
+ next_track();
+ }
+}
+function onPlayerError(event) {
+ next_track();
+}
+function youtube_turntable(track){
+ $('iframe').attr('id','youtubeIframe');
+
+ var youtube_id = track.get('url').replace(/.*(v=|be\/)/,'');
+ url = "https://www.youtube.com/embed/"+youtube_id+"?enablejsapi=1&autoplay=1&modestbranding=1&autohide=0&showinfo=0&color=white&iv_load_policy=3&origin=https://playbot.skizzk.fr"; //theme=light
+ $('#youtubeIframe').attr('width','100%').attr('height','35').attr('src',url); //640
+
+ player = new YT.Player('youtubeIframe', {
+ events: {
+ 'onError': onPlayerError,
+ 'onStateChange': onPlayerStateChange,
+ }
+ });
+}
+function soundcloud_turntable(track){
+ var url = track.get('url'); //.replace(/.*(v=|be\/)/,'');
+ var soundcloud_id;
+ $.getJSON(
+ "https://soundcloud.com/oembed?url=" + url + "&format=json",
+ function ( data ) {
+ player = data.html.replace('visual=true&','');
+ player = player.replace('&show_artwork=true','&show_artwork=true&color=a8a8a8&buying=false&sharing=false&auto_play=true&player_type=tiny');
+ $('iframe').replaceWith(player);
+ $('iframe').attr('width','100%').attr('height','20').attr('id','soundcloudIframe'); //640 120
+ setTimeout(soundcloud_listener, 2000 );
+ }
+ ).fail(function() {
+ next_track();
+ });
+}
+function play(track) {
+ track_id = track.get('id');
+ if ( track.get('provider') == "youtube") {
+ youtube_turntable(track);
+ }
+ else if ( track.get('provider') == "soundcloud" ){
+ soundcloud_turntable(track);
+ }
+ else {
+ next_track();
+ }
+}
+