app/views/cytoplasm/fonts/index.html.erb in cytoplasm-0.1.4 vs app/views/cytoplasm/fonts/index.html.erb in cytoplasm-0.1.5
- old
+ new
@@ -1,45 +1,62 @@
<h2>Cytoplasm Font Manager</h2>
<hr />
+<% if @enabled["fontsquirrel"].any? or @enabled["googlewebfonts"].any? %>
+ <h3>Enabled Fonts</h3>
+ <p>These fonts are loaded at runtime. Remember: <b>less is more!</b> Enabling lots of fonts can slow page loading times and clutter up layouts.</p>
+
+ <% {"fontsquirrel" => "FontSquirrel","googlewebfonts" => "Google Web Fonts"}.each do |dir,name| %>
+ <% if @enabled[dir].any? %>
+ <h6><%=name%></h6>
+ <ul>
+ <% @enabled[dir].each do |fam,f| %>
+ <%=render :partial => 'font_li', :locals => {:fam => fam, :f => f, :dir => dir} %>
+ <% end %>
+ </ul>
+ <% end %>
+ <% end %>
+
+ <hr />
+<% end %>
+
<% if @installed["fontsquirrel"].any? or @installed["googlewebfonts"].any? %>
<h3>Installed Fonts</h3>
+ <p>This includes all fonts that are currently installed into this Cytoplasm project.</p>
<% {"fontsquirrel" => "FontSquirrel","googlewebfonts" => "Google Web Fonts"}.each do |dir,name| %>
<% if @installed[dir].any? %>
<h6><%=name%></h6>
<ul>
<% @installed[dir].each do |fam,f| %>
- <li><%=fam%></li>
+ <%=render :partial => 'font_li', :locals => {:fam => fam, :f => f, :dir => dir} %>
<% end %>
</ul>
<% end %>
<% end %>
+
+ <hr />
<% end %>
-<hr />
-
<h3>Install New Fonts</h3>
<p>
<input type="radio" name="fonts_directory" data-label="Font Squirrel API" value="fontsquirrel" data-exclude="true" checked="checked" class="cytoRadio" />
<input type="radio" name="fonts_directory" data-label="Google Web Fonts" value="googlewebfonts" data-exclude="true" />
</p>
-
<p><select name="fonts_family" id="fontfamilyselect" data-exclude="true" class="cytoSelect"></select></p>
+<p><input type="checkbox" id="font_import_autoenable" data-exclude="true" checked="checked" /> Automatically enable this font after installing</p>
+<p><button id="font_import_button" class="cytoButton large">Install Font Family</button></p>
-<p><button id="font_import_button" class="cytoButton large">Import Font Family</button></p>
-
<script type="text/javascript">
(function($){
$.Cytoplasm("ready",function(){
$.cytoAjax("/cytoplasm/fonts/fetch_all",function(data){
- console.log(data);
- console.log(data.imported);
var fds = $('input[name=fonts_directory]');
var ffs = $('#fontfamilyselect');
+ var iae = $('#font_import_autoenable');
var ib = $('#font_import_button');
// Directory select
fds.cytoRadio("options",{
events:{
@@ -71,17 +88,17 @@
var dir = fds.cytoRadio("value");
var f = data[dir][$(this).cytoSelect("value")];
if (f!=null) switch (dir) {
case "fontsquirrel":
// Check if font has already been imported
- if (!$.isEmptyObject(data.imported[dir]) && data.imported[dir][f.family_urlname] != null) ib.addClass('active').html("Font Family Imported");
- else ib.removeClass('active').html("Import Font Family");
+ if (!$.isEmptyObject(data.imported[dir]) && data.imported[dir][f.family_urlname] != null) ib.addClass('active').html("Font Family Installed");
+ else ib.removeClass('active').html("Install Font Family");
break;
case "googlewebfonts":
console.log(data.imported[dir][f.family]);
- if (!$.isEmptyObject(data.imported[dir]) && data.imported[dir][f.family] != null) ib.addClass('active').html("Font Family Imported");
- else ib.removeClass('active').html("Import Font Family");
+ if (!$.isEmptyObject(data.imported[dir]) && data.imported[dir][f.family] != null) ib.addClass('active').html("Font Family Installed");
+ else ib.removeClass('active').html("Install Font Family");
break;
}
}
}
});
@@ -90,24 +107,68 @@
ib.css({"margin-top":10}).click(function(e){
e.preventDefault();
var dir = fds.cytoRadio("value");
var f = data[dir][ffs.cytoSelect("value")];
var name = (dir=="fontsquirrel") ? f.family_name : f.family;
+ var urlname = (dir=="fontsquirrel") ? f.family_urlname : f.family;
if (!ib.hasClass('active')) {
// Import font
- $.cytoAjax("/cytoplasm/fonts/import",{directory:dir,family:f},function(data){
- $.cytoAjaxResponse('Font "'+name+'" has been imported successfully.<br /><a href="#" onClick="window.location.reload();">You must reload to apply these changes.</a>');
- ib.addClass('active').html("Font Family Imported");
+ $.cytoAjax("/cytoplasm/fonts/import",{directory:dir,family:urlname},function(data){
+ if (!iae.prop("checked")) $.cytoAjaxResponse('Font "'+name+'" has been installed successfully.<br /><a href="#" onClick="window.location.reload();">You must reload to apply these changes.</a>');
+ else $.cytoAjax("/cytoplasm/fonts/enable",{family:urlname,directory:dir},function(data2){
+ $.cytoAjaxResponse('Font "'+name+'" has been enabled successfully.<br /><a href="#" onClick="window.location.reload();">You must reload to apply these changes.</a>');
+ });
+ ib.addClass('active').html("Font Family Installed");
});
} else {
// Remove font
- if (confirm("Are you sure you want to remove this font from your fonts library?")) $.cytoAjax("/cytoplasm/fonts/remove",{directory:dir,family:f},function(data){
- $.cytoAjaxResponse('Font "'+name+'" has been removed successfully.<br /><a href="#" onClick="window.location.reload();">You must reload to apply these changes.</a>');
- ib.removeClass('active').html("Import Font Family");
+ if (confirm("Are you sure you want to uninstall this font from your fonts library?")) $.cytoAjax("/cytoplasm/fonts/remove",{directory:dir,family:f},function(data){
+ $.cytoAjaxResponse('Font "'+name+'" has been uninstalled successfully.<br /><a href="#" onClick="window.location.reload();">You must reload to apply these changes.</a>');
+ ib.removeClass('active').html("Install Font Family");
});
}
});
+ });
+
+ });
+})(jQuery);
+</script>
+
+<script type="text/javascript">
+(function($){
+ $.Cytoplasm("ready",function(){
+ $('.font_enable_disable').click(function(e){
+ e.preventDefault();
+ var $this = $(this);
+ var li = $this.parents("li");
+ var fam = li.data('family');
+ var dir = li.data('directory');
+
+ if ($this.html()=="Enable") {
+ $.cytoAjax("/cytoplasm/fonts/enable",{family:fam,directory:dir},function(data){
+ $.cytoAjaxResponse('Font "'+fam+'" has been enabled successfully.<br /><a href="#" onClick="window.location.reload();">You must reload to apply these changes.</a>');
+ $this.html("Disable");
+ });
+ } else if ($this.html()=="Disable") {
+ $.cytoAjax("/cytoplasm/fonts/disable",{family:li.data('family'),directory:dir},function(data){
+ $.cytoAjaxResponse('Font "'+fam+'" has been disabled successfully.<br /><a href="#" onClick="window.location.reload();">You must reload to apply these changes.</a>');
+ $this.html("Enable");
+ });
+ } else return false;
+ });
+
+ $('.font_uninstall').click(function(e){
+ e.preventDefault();
+ var $this = $(this);
+ var li = $this.parents("li");
+ var fam = li.data('family');
+ var dir = li.data('directory');
+
+ if (confirm('Are you sure you want to uninstall this font?')) $.cytoAjax("/cytoplasm/fonts/remove",{family:fam,directory:dir},function(data){
+ $.cytoAjaxResponse('Font "'+fam+'" has been uninstalled successfully.<br /><a href="#" onClick="window.location.reload();">You must reload to apply these changes.</a>');
+ li.hide(400);
+ });
});
});
})(jQuery);
</script>
\ No newline at end of file