Commit c788cbd487b4d61e9f55304560057ee1d41144ab
- Diff rendering mode:
- inline
- side by side
swtr/static/css/swtmaker.css
(3 / 1)
  | |||
149 | 149 | } | |
150 | 150 | #tag-cloud { | |
151 | 151 | display: none; | |
152 | height:768px; | ||
152 | } | ||
153 | #gallery { | ||
154 | margin-top: 10em; | ||
153 | 155 | } | |
154 | 156 | #tags-tag-cloud svg { | |
155 | 157 | position: absolute; |
swtr/static/js/main.js
(5 / 45)
  | |||
718 | 718 | }, | |
719 | 719 | userTagClicked: function(e) { | |
720 | 720 | var user = $(e.currentTarget).text(); | |
721 | console.log(user); | ||
722 | 721 | var swts = swtr.LDs.filter(function(swt) { | |
723 | 722 | if(swt.get('who') == user) { | |
724 | 723 | return swt; | |
… | … | ||
725 | 725 | }); | |
726 | 726 | swts = _.uniq(swts,'how'.src); | |
727 | 727 | this.setGalleryView(swts); | |
728 | $(this.el).hide(); | ||
728 | // $(this.el).hide(); | ||
729 | 729 | }, | |
730 | 730 | tagsTagClicked: function(e) { | |
731 | 731 | var tag = $(e.currentTarget).text(); | |
… | … | ||
737 | 737 | } | |
738 | 738 | }); | |
739 | 739 | this.setGalleryView(swts); | |
740 | $(this.el).hide(); | ||
740 | // $(this.el).hide(); | ||
741 | 741 | }, | |
742 | 742 | setGalleryView: function(swts) { | |
743 | 743 | if(this.galleryView) { | |
… | … | ||
760 | 760 | _.each(weights, function(weight, who) { | |
761 | 761 | $(this.user_tag_el).append(this.template({weight: weight, who: who})); | |
762 | 762 | }, this); | |
763 | // d3.layout.cloud().size([1000, 1000]) | ||
764 | // .words(words.map(function(d) { | ||
765 | // return {text: d, size: 5}; | ||
766 | // })) | ||
767 | // .padding(5) | ||
768 | // .font("Impact") | ||
769 | // .fontSize(function(d) { return d.size; }) | ||
770 | // .on("end", this.draw) | ||
771 | // .start(); | ||
772 | 763 | }, | |
773 | draw: function (words) { | ||
774 | var fill = d3.scale.category20(); | ||
775 | d3.select("#user-tag-cloud").append("svg") | ||
776 | .append("g") | ||
777 | .attr("transform", "translate(370,180)") | ||
778 | .selectAll("text") | ||
779 | .data(words) | ||
780 | .enter().append("text") | ||
781 | .style("font-size", function(d) { return "16px"; }) | ||
782 | .style("font-family", "Impact") | ||
783 | .style("fill", function(d, i) { return fill(i); }) | ||
784 | .attr("text-anchor", "middle") | ||
785 | .attr("transform", function(d) { | ||
786 | return "translate(" + [d.x, d.y] + ")";}) | ||
787 | .text(function(d) { return d.text; }); | ||
788 | }, | ||
789 | 764 | renderTagsTagCloud: function() { | |
790 | 765 | var sweetsWithTags = swtr.LDs.filter(function(k) { | |
791 | 766 | if(k.get('how').tags) { | |
… | … | ||
776 | 776 | $(this.tags_tag_el).append(this.template({weight: weight, who: who})); | |
777 | 777 | }, this); | |
778 | 778 | ||
779 | }, | ||
780 | drawTags: function(words) { | ||
781 | var fill = d3.scale.category20(); | ||
782 | d3.select("#tags-tag-cloud").append("svg") | ||
783 | .append("g") | ||
784 | .attr("transform", "translate(700,300)") | ||
785 | .selectAll("text") | ||
786 | .data(words) | ||
787 | .enter().append("text") | ||
788 | .style("font-size", function(d) { return "20px"; }) | ||
789 | .style("font-family", "Impact") | ||
790 | .style("fill", function(d, i) { return fill(i); }) | ||
791 | .attr("text-anchor", "middle") | ||
792 | .attr("transform", function(d) { | ||
793 | return "translate(" + [d.x, d.y] + ")"; | ||
794 | }) | ||
795 | .text(function(d) { return d.text; }); | ||
796 | 779 | } | |
797 | 780 | }); | |
798 | 781 | ||
… | … | ||
790 | 790 | _.each(this.collection, function(model) { | |
791 | 791 | $(this.el).append(this.template(model.toJSON())); | |
792 | 792 | }, this); | |
793 | $('html, body').animate({ | ||
794 | scrollTop: $("#gallery").offset().top | ||
795 | }, 1000); | ||
793 | 796 | }, | |
794 | 797 | setUp: function() { | |
795 | 798 | if(!$(this.el).is(':visible')) { |
swtr/templates/index.html
(24 / 20)
  | |||
162 | 162 | <div id="search-page" class="page"></div> | |
163 | 163 | ||
164 | 164 | <div id="linked-data-page" class="page"> | |
165 | <div id="tag-cloud" class="col-md-4"> | ||
165 | <div id="tag-cloud" class="row"> | ||
166 | 166 | <div class="panel-group" id="accordion"> | |
167 | <div class="panel panel-default"> | ||
168 | <div class="panel-heading"> | ||
169 | <h4 class="panel-title"> | ||
167 | <div class="col-md-6"> | ||
168 | <div class="panel panel-default"> | ||
169 | <div class="panel-heading"> | ||
170 | 170 | <a data-toggle="collapse" data-parent="#accordion" href="#tag-list"> | |
171 | Tags | ||
171 | <h4 class="panel-title"> | ||
172 | Tags | ||
173 | </h4> | ||
172 | 174 | </a> | |
173 | </h4> | ||
174 | </div> | ||
175 | <div id="tag-list" class="panel-collapse collapse in"> | ||
176 | <div class="panel-body"> | ||
177 | <ul class="list-group" id="tags-tag-cloud"></ul> | ||
178 | 175 | </div> | |
176 | <div id="tag-list" class="panel-collapse collapse in"> | ||
177 | <div class="panel-body"> | ||
178 | <ul class="list-group" id="tags-tag-cloud"></ul> | ||
179 | </div> | ||
180 | </div> | ||
179 | 181 | </div> | |
180 | 182 | </div> | |
181 | <div class="panel panel-default"> | ||
182 | <div class="panel-heading"> | ||
183 | <h4 class="panel-title"> | ||
183 | <div class="col-md-6"> | ||
184 | <div class="panel panel-default"> | ||
185 | <div class="panel-heading"> | ||
184 | 186 | <a data-toggle="collapse" data-parent="#accordion" href="#user-list"> | |
185 | User | ||
187 | <h4 class="panel-title"> | ||
188 | User | ||
189 | </h4> | ||
186 | 190 | </a> | |
187 | </h4> | ||
188 | </div> | ||
189 | <div id="user-list" class="panel-collapse collapse in"> | ||
190 | <div class="panel-body"> | ||
191 | <ul class="list-group" id="user-tag-cloud"></ul> | ||
192 | 191 | </div> | |
192 | <div id="user-list" class="panel-collapse collapse in"> | ||
193 | <div class="panel-body"> | ||
194 | <ul class="list-group" id="user-tag-cloud"></ul> | ||
195 | </div> | ||
196 | </div> | ||
193 | 197 | </div> | |
194 | 198 | </div> | |
195 | 199 | </div> | |
196 | 200 | </div> | |
197 | <div id="gallery"> | ||
201 | <div id="gallery" class="row"> | ||
198 | 202 | </div> | |
199 | 203 | </div> | |
200 | 204 |