Skip to content

Commit

Permalink
Configuration file added, ESC key close the window
Browse files Browse the repository at this point in the history
  • Loading branch information
keremciu committed Jun 17, 2016
1 parent 361afa3 commit 62eb9c6
Show file tree
Hide file tree
Showing 11 changed files with 210 additions and 38 deletions.
29 changes: 29 additions & 0 deletions iconfont.sketchplugin/Contents/Resources/config.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
{
"icon" : {
"Color" : {
"value" : "#000000",
"type" : "string",
"hint" : "Default icon color"
},
"Replace" : {
"value" : "1",
"type" : "boolean",
"hint" : "When insert an icon replace the selected text"
},
"Centered" : {
"value" : "1",
"type" : "boolean",
"hint" : "When insert an icon put it to the center of the view"
},
"Size" : {
"value" : "20",
"type" : "string",
"hint" : "Inserted icon size"
},
"Zoom" : {
"value" : "0",
"type" : "boolean",
"hint" : "When insert an icon zoom to it"
}
}
}
2 changes: 1 addition & 1 deletion iconfont.sketchplugin/Contents/Sketch/add.js
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,7 @@ var onRun = function(context) {
name = matched.alias + ' - ' + selected_font
icon = Library.parse.escape('\\u' + matched.unicode)

Library.create.icon(doc,selection,selected_font,name,icon)
Library.create.icon(plugin,doc,selection,selected_font,name,icon)

} else {
// Show an error when user write a wrong icon name.
Expand Down
2 changes: 1 addition & 1 deletion iconfont.sketchplugin/Contents/Sketch/add_all.js
Original file line number Diff line number Diff line change
Expand Up @@ -180,7 +180,7 @@ var onRun = function(context) {

// if is the response is ok, add icon
if (response == NSOKButton) {
Library.create.icon(doc,selection,fontname,name,icon)
Library.create.icon(plugin,doc,selection,fontname,name,icon)
}

};
5 changes: 1 addition & 4 deletions iconfont.sketchplugin/Contents/Sketch/add_grid.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,9 +10,6 @@ var handleFont = function(context) {

var onRun = function(context,path,fontname) {

// check updates
tools.checkPluginUpdate(context)

var plugin = context.plugin
var doc = context.document
var selection = context.selection.firstObject()
Expand Down Expand Up @@ -127,7 +124,7 @@ var onRun = function(context,path,fontname) {

// if is the response is ok, add icon
if (response == NSOKButton) {
Library.create.icon(doc,selection,fontname,name,icon)
Library.create.icon(plugin,doc,selection,fontname,name,icon)
}

};
111 changes: 111 additions & 0 deletions iconfont.sketchplugin/Contents/Sketch/const/config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,111 @@
@import "library.js";

var onRun = function(context) {

// check updates
tools.checkPluginUpdate(context)

var plugin = context.plugin
var doc = context.document
var fileManager = NSFileManager.defaultManager()
var scriptFullPath = context.scriptPath
var directoryPlugin = [[scriptFullPath stringByDeletingLastPathComponent] stringByDeletingLastPathComponent]
var resources = [directoryPlugin stringByDeletingLastPathComponent] + "/Resources"

// 1. Create Window
var wrapper = Library.Widgets.window("Config", "Select your configuration")

// 2. Fetch fonts.json file
var json = Library.fetch.json("config.json",plugin)
var configs = [json objectForKey:@"icon"]
var configsCount = configs.count()
var configsArray = [NSMutableArray arrayWithCapacity:configsCount]

// 3. create a combobox to select font which wants to remove
for (config in configs) {
var i = Object.keys(configs).indexOf(config) +1;
var height = 20 + (i * 58);

subtitle = Library.Widgets.subtitle(config,18,NSColor.blackColor(),NSMakeRect(25, height, 150, 30))
wrapper.main.addSubview(subtitle)

hint = Library.Widgets.subtitle(configs[config].hint,11,NSColor.blackColor(),NSMakeRect(25, height-14, 350, 18))
wrapper.main.addSubview(hint)

// 8.1. build a input for the config
if (configs[config].type == "boolean") {
var config_input = [[NSButton alloc] initWithFrame:NSMakeRect(360, height-10, 150, 30)]
[config_input setButtonType:NSSwitchButton]
if (configs[config].value == 1)
[config_input setState:NSOnState]
else
[config_input setState:NSOffState]

[config_input setTitle:@""];
} else {
var config_input = [[NSTextField alloc] initWithFrame:NSMakeRect(360, height, 150, 30)]
config_input.setBezeled(true)
config_input.setBezelStyle(NSRoundedBezelStyle)
config_input.setFont(NSFont.systemFontOfSize(13))
config_input.setStringValue(configs[config].value)
}

[configsArray addObject:config_input]
wrapper.main.addSubview(config_input)
}

// 4. create a remove button
var submit = [[NSButton alloc] initWithFrame:NSMakeRect(395, 10, 200, 50)]
submit.setTitle("")
submit.setAction("callAction:")
submit.setWantsLayer(true)
submit.setCOSJSTargetFunction(function(sender) {
wrapper.window.orderOut(nil)
NSApp.stopModalWithCode(NSOKButton)
})

// 4.1. create a layer for remove button
var submit_text = CATextLayer.layer()
submit_text.setBackgroundColor(NSColor.blackColor())
submit_text.setForegroundColor(CGColorCreateGenericRGB(215/255, 159/255, 0/255, 1.0))
submit_text.setFontSize(18)
submit_text.contentsScale = NSScreen.mainScreen().backingScaleFactor()
submit_text.string = "👍 Submit"

submit.setLayer(submit_text)
wrapper.main.addSubview(submit)

var response = NSApp.runModalForWindow(wrapper.window)

// if is the response is ok, remove the font
if (response == NSOKButton) {

// write your configs to the config.json
properties = Library.fetch.json("config.json",plugin)
dict = [[NSMutableDictionary alloc] initWithDictionary:properties]
list = [[NSMutableDictionary alloc] initWithDictionary:[dict objectForKey:@"icon"]]

// find config values
for (x=0; x < configsCount; x++) {
var item = [configsArray objectAtIndex:x]
var name = Object.keys(configs)[x]
value = item.stringValue()
getlistitem = list[@""+name]
[getlistitem objectForKey:@"icon"]
property = {
"hint": [getlistitem objectForKey:@"hint"],
"value": value,
"type": [getlistitem objectForKey:@"type"]
}
list[@""+name] = property
}
dict[@"icon"] = list
// write new data to config file
Library.create.file(dict,resources + "/config.json")
doc.showMessage("Configuration has changed.")
}
};
80 changes: 57 additions & 23 deletions iconfont.sketchplugin/Contents/Sketch/const/library.js
Original file line number Diff line number Diff line change
Expand Up @@ -23,22 +23,34 @@ var Library = {
// Valid types for name is String
// Valid types for icon is String
//
"icon": function(doc, selection, fontname, name, icon) {
"icon": function(plugin, doc, selection, fontname, name, icon) {
var page = doc.currentPage()
var artboard = page.currentArtboard() || page

if (selection && selection.isKindOfClass(MSTextLayer)) {
// 2. Fetch fonts.json file
var json = Library.fetch.json("config.json", plugin)
var configs = [json objectForKey:@"icon"]
var zoom = configs["Zoom"].value
var fontsize = configs["Size"].value
var color = configs["Color"].value
var centered = configs["Centered"].value
var replace = configs["Replace"].value
color = MSColor.colorWithSVGString(color);


if (replace == 1 && selection && selection.isKindOfClass(MSTextLayer)) {
// set icon
selection.setStringValue(icon)
// set icon name
selection.setName(name)
} else {
// create a text layer contains the icon
selection = Library.create.textLayer(doc, artboard, {"text": icon, "name": name});
selection = Library.create.textLayer(doc, artboard, {"text": icon, "name": name, "zoom": zoom, "centered": centered});
}

// 8. set selected font
selection.setFont([NSFont fontWithName:@""+fontname size:20.0])
selection.setFont([NSFont fontWithName:@""+fontname size:fontsize])
selection.setTextColor(color)
},
//
// Create a layer
Expand Down Expand Up @@ -70,7 +82,7 @@ var Library = {
}
if (typeof(parameters.name) !== 'undefined') layer.name = parameters.name;
if (typeof(parameters.color) !== 'undefined') {
this.util.setFillColor(layer, parameters.color);
Library.util.setFillColor(layer, parameters.color);
}
return layer;
},
Expand All @@ -82,31 +94,42 @@ var Library = {
//
"textLayer": function (doc, container, parameters) {
var textLayer = Library.create.layer(container, "text", parameters);

// center function construct values
zoomValue = doc.zoomValue();
scrollOrigin = doc.scrollOrigin();
// view frame
var view = doc.currentView();
viewFrame = [view frame];
viewHeight = viewFrame.size.height;
viewWidth = viewFrame.size.width;

// textlayer vertically center
var midY = (viewHeight / 2 - scrollOrigin.y) / zoomValue;
var targetY = Math.ceil(midY - textLayer.frame().height() / 2);
textLayer.absoluteRect().setY(targetY);

// textlayer horizontally center
var midX = (viewWidth / 2 - scrollOrigin.x) / zoomValue;
var targetX = Math.ceil(midX - textLayer.frame().width() / 2);
textLayer.absoluteRect().setX(targetX);

if (parameters.centered == 1) {
// view frame
var view = doc.currentView();
viewFrame = [view frame];
viewHeight = viewFrame.size.height;
viewWidth = viewFrame.size.width;

// textlayer vertically center
var midY = (viewHeight / 2 - scrollOrigin.y) / zoomValue;
var targetY = Math.ceil(midY - textLayer.frame().height() / 2);
textLayer.absoluteRect().setY(targetY);

// textlayer horizontally center
var midX = (viewWidth / 2 - scrollOrigin.x) / zoomValue;
var targetX = Math.ceil(midX - textLayer.frame().width() / 2);
textLayer.absoluteRect().setX(targetX);
}

// deselect all selected layers
doc.currentPage().deselectAllLayers()

// select the text layer
[textLayer select:true byExpandingSelection:true];
// set the font-size
textLayer.fontSize = 24;

// deselect all selected layers
doc.currentPage().deselectAllLayers()
if (parameters.zoom == 1) {
// zoom to the icon
var view = doc.currentView();
view.zoomToSelection();
}

if (typeof(parameters.text) !== 'undefined') {
textLayer.stringValue = parameters.text;
Expand Down Expand Up @@ -207,6 +230,14 @@ var Library = {
return result
},
},
"util": {
// Sets the fill color for `layer` to `color` (MSColor)
"setFillColor": function(layer, color) {
var fill = layer.style().addStylePartOfType(0);
fill.setFillType(0);
fill.color = color;
}
},
"parse": {
"outline": function(layer) {
if(!layer.isKindOfClass(MSTextLayer)) return
Expand Down Expand Up @@ -356,8 +387,11 @@ var Library = {
var exit_icon = NSImage.imageNamed(NSImageNameStopProgressTemplate)

// build exit button
var userClickedCancel = false
var exit = Library.Widgets.button(exit_icon,NSMakeRect(556, 5, 36, 36))
[exit setKeyEquivalent:@"\033"]
exit.setCOSJSTargetFunction(function(sender) {
userClickedCancel = true
wrapper.orderOut(nil)
NSApp.stopModal()
})
Expand Down Expand Up @@ -497,7 +531,7 @@ var tools = {
checkPluginUpdate: function(context) {
var doc = context.document
var scriptFullPath = context.scriptPath
var directoryPlugin = [scriptFullPath stringByDeletingLastPathComponent]
var directoryPlugin = [[scriptFullPath stringByDeletingLastPathComponent] stringByDeletingLastPathComponent]

// 9. Fetch data of manifest.json
var manifestPath = directoryPlugin + "/manifest.json"
Expand Down
Loading

0 comments on commit 62eb9c6

Please sign in to comment.