As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
What is the best way to write a Safari extension? I've written a couple XUL extensions for Firefox, and now I'd like to write versions of them for Safari. Is there a way that would allow you to add buttons or forms to the browser UI, since this is not possible with an Input manager or Service menu?
Safari plugin development is non-trivial. The interface is written in Objective-C, and most of it is not even part of WebKit (so you can't see the source), but there's machinery to inspect and patch the object hierarchy of a running application. It requires understanding of Cocoa and Objective-C, but no lower.
Here's a high level overview I had in my bookmarks of the process http://livingcode.org/2006/tab-dumping-in-safari. It goes over creating Safari plugins using Python with working (probably outdated) code. Instead of Python you can use anything that has Objective-C bindings.
There are two major parts to it:
You need to attach your code to a running Safari. This is typically done with SIMBL http://www.culater.net/software/SIMBL/SIMBL.php.
Once you're inside, you need to figure what to patch. There's a tutorial on reversing Cocoa applications http://www.culater.net/wiki/moin.cgi/CocoaReverseEngineering, which links to the most important tool, class-dump http://www.codethecode.com/projects/class-dump/ (the link on wiki is broken). Class-dump gives you a complete hierarchy of Safari's classes, where you can guess by names what, specifically, you need to patch. This is a very trial and error mode.
Reading the links above will give you the scope of the project.
Things have changed recently. Apple now has an extensions API available as a part of Safari 5. You can find out more on Apple's site and by joining the Safari Developer Program.
Extensions to Safari have to be digitally signed, but you can get the signing certificate free from Apple. This is the legitimate way to get your extension into Safari without resorting to hacks that will likely break every time Apple updates Safari.
With the release of Safari 5.0, Apple released a new extension framework for developers to use. In features it looks similar to Firefox extension framework allowing to customize buttons, toolbars, context menus, injections using javascript and html 5
More at this link
https://developer.apple.com/documentation/safariextensions
Nobody seems to have even mentioned the fact that Safari actually does support true plugins, which input manager hacks most definitely are not.
"WebKit Plug-In Programming Topics"
http://developer.apple.com/documentation/InternetWeb/Conceptual/WebKit_PluginProgTopic/
This is how things like support for PDF and Flash content are implemented. Take a peek inside your /Library/Internet Plug-ins/ directory to see examples.
Of course, there are inherent limitations, and you may not be able to accomplish what you hope to as far as UI modification. Safari plug-ins can't do all the things that Input Manager hacks can, but they will work in WebKit anywhere, and in future versions of the OS. Note: Safari is 64-bit by default on Snow Leopard, so no Input Managers work. I'm missing Safari AdBlock already... :-( I would love to see it rewritten as a bonafide plugin.
Is there a way that would allow you to add buttons or forms to the browser UI, since this is not possible with an Input manager or Service menu?
Actually, with an InputManager, it would be possible. SIMBL, the common technique for Safari extensions, is simply a wrapper around InputManagers — it stands for Smart Input Manager Bundle Loader. You can add stuff to the menu bar, to the toolbar, dialogs, anywhere, simply by extending Safari's existing classes.
That said, writing extensions for Safari is not only non-trivial, as æon said, but also completely unsupported. There are some relatively popular ones out there, like Inquisitor (recently acquired by Yahoo!) and Google's Gears, but for the most part, it's very unlike Firefox's extensions, which are an officially-supported, widely used technique.
You also definitely want to take into consideration the special limitations of InputManagers on Leopard.
Also, to note - Apple has stated that InputManagers are being severely limited as of Leopard and will not run in 64-bit applications per Apple Leopard Release Notes. This is especially interesting considering most applications will be 64-bit in Snow Leopard (including presumably Safari). Apple is definitely trying to obliterate InputManager as a vector to overriding and extending functionality. Safari desperately needs an extension mechanism.
Safari Extensions do NOT need to be Approved by apple. You just have a developer cert (for free) to make them, but you can pass them around and although Apple is making the Extension Gallery, you don't have to distribute it through there. As you can see there are already quite a few extensions that you can try today. The cert just ensures that it hasn't been tampered with.
http://safariextensions.tumblr.com/
If you want to look at an existing extension to see how its done, download it or get it from your Safari extensions folder then change the .safariextz to .xar then open/extract with Pacifist to view the code and if you want add it to the Extension Builder app.
Related
VSCode has a very customizable UI with Activity Bar, Sidebar, Tabs, Status Bar etc (https://code.visualstudio.com/docs/getstarted/userinterface); customizable via extensions and seems to have been developed without any of the common web frameworks (https://github.com/microsoft/vscode/issues/99845).
It is well maintained, works in different OSes and has automatic updates.
Even if we remove the code-editor part, there is a lot of work in that.
This makes me wonder if it is possible to write a totally different app (not a code editor) on top of VSCode. For example a Slack-like messaging app, an Obsidian-like knowledge base app, etc.
Is it possible? Are there apps built on top of this code? Have I missed an important point that makes this idea unviable?
EDIT:
Some have pointed a very valid point. Some of what I mentioned here as VSCode features are really Electron features that VSCode inherits. Having developed an Electron app (5yrs ago) I see many things in VSCode that are not in Electron (but maybe my concept of Electron is wrong).
I want to emphasize that VSCode UI (bars, tabs, etc) + its extensibility seems to be a valid development framework. And I am ignorant of anything in this sense.
EDIT (jan/2023):
I guess we can add StackBlitz as a product that just did that.
I think your question is very valid and I was wondering the same thing, so thanks for asking it.
One thing that VS Code gives you that Electron doesn't is a distribution model - the marketplace and how new versions of your app can be detected and downloaded automatically etc. This is a big deal.
I think the disadvantages are that a very fancy UX may not be possible directly - but you have to "work around" by putting HTML within a Web View perhaps. This is just my guess and I haven't directly tried it.
To answer your question - the only one I am aware of is Thunder Client - so think of Postman - but as a VS Code plugin.
See also https://stackoverflow.com/a/67069697/314780 , which points to Eclipse Theia which uses parts from Visual Studio Code (i.e "Code - OSS") - https://theia-ide.org/ . The site links to a number of IDE-style apps built on top of it.
VS Code is an electron app. You might want to research what electron is – because you mention it: The Slack app is built on that same framework.
So, you've just invented something that already is done, very widely, in practice.
I have found that there are plenty of frameworks for browser plugins.
my first question:
which one of the following frameworks specified for plugins and which one is not specified for plugins:
FireBreath, OpenForge, Kango, BabelExt, Nixysa project, JUCE project, QtBrowserPlugin project .
my second question:
Is there another popular plugin's framework other than those mentioned?
my third question:
What is the main differences of these popular plugin's frameworks?
Indeed is there any comparison of these frameworks, the comparison could be in each of following terms:
usability (for a page as a NPAPI plug-in or for a browser as an
add-on extension),
simplicity (in developing),
speed (on execution),
extensibility (of developed add-on),
availability (in Windows 86x and 64x, Unix, Linux, mac and other
platforms and also mobile platforms specifically android, ios, ...),
flexibility (for new technologies),
reliability (in terms of security),
accessibility (open source or not),
portability (in Fire-fox, chrome, IE, Safari, Opera, ...),
applicability (in drawing, communicating, calling from external
server, threading, network accessing, etcetera),
stability (in changing the policies, for example in deprecating
NPAPI)
Also I have read Cross-Browser Extensions API? which I think it is about extension's framework (not plugin's framework)
I'll be honest -- this seems like something you should be able to answer with some google searching. I appreciate that you're at least trying to apply suggestions on how to better ask questions, though, so I'll respond on the few that I know something about.
FireBreath is a C++ framework for creating browser plugins, not extensions. It works as an NPAPI plugin for browsers supporting NPAPI plugins (previously this was all but IE, but Chrome dropped support for them this year and Firefox plans to at the end of 2016) or as an ActiveX control, giving it equivalent functionality to a browser plugin in Internet Explorer. FireBreath 2, which is working but poorly documented so far, changes the APIs from being synchronous between the browser and plugin to being asynchronous and adds an emulation layer to let them work with Google Chrome using Native Messaging. It's the most complete and up to date of the plugin frameworks, as far as I am aware. I am its primary author, so feel free to get your own confirmation of that.
Nixysa is a tool that takes definition files and outputs code for a NPAPI plugin. I haven't used it, so I can't tell you exactly what it's capabilities are. It hasn't been updated since 2012, when PPAPI support was added; this is unlikely to be useful, though, since PPAPI has changed significantly since then, and also since the only PPAPI plugins that can run without special command-line flags to chrome are ones specially blessed by the Chrome team.
JUCE is a GPL library with a commercial licence available which has some support for creating browser plugins. I have no idea as to how powerful it is these days; it seemed well written when I last looked at it, and takes a much more minimalistic approach than FireBreath does; FireBreath gives you a framework and tries to make everything Just Work, whereas JUCE seems (I could be wrong) to be more of a "provide the building blocks, but don't try to make everything look the same" type of thing.
QtBrowserPlugin is a defunct unmaintained project which at one time allowed creating browser plugins (probably just npapi, but not certain) with QT. Indications are that it probably doesn't work anymore.
I have no idea what the other projects are. If I were you, I'd try doing some research. Google is your friend.
I am looking to speed up time to develop website layouts. So I am wondering if using DreamWeaver for layouts is useful - efficient. I am looking at purchasing this software, so, I had a few questions.
I am very comfortable coding HTML, CSS and JavaScript(jQuery) by hand in either PHPDesigner or Notepad++. Most of the time for layouts I use FireFox and Firebug to see results in real time, and then check if it works across different browsers.
I want to know the opinion of people who have worked on the front-end:
I feel code validation is important but not the end of the world(as my priorities) - I do however like to change my code often by hand. Does the output from this software let you do this?(compare to the html/css that micorsoft word vomits - Does this software do a similar thing?)
Is this software used as a primary design tool by people who can code by hand and does it actually improve efficiency? or is it just for newbies?
I understand the Adobe family of products work really well with each other but I am trying to understand is if DreamWeaver really deserves to be in the front-end workflow(if you are proficient coding by hand).
Once you work with HTML/CSS/Javascript enough, it isn't difficult to "code by hand" but it is important to remember that front-end developers also code with their eyes, as well. There is a lot going on up front that depends entirely on the code that runs on the client and you want to use an editor that helps you organize your code and, more importantly, gives you visibility into the challenges presented by complicated CSS and adhering to web standards.
If front-end coding was nothing more than pushing around angle brackets then notepad and repeatedly pressing F5 would be enough. A great web editor will present the structure of your code in a meaningful way and all of your HTML, CSS, and Javascript takes on a complete feel.
You want a professional editor that will allow you to:
Understand CSS inheritance
Run visual diagnostics
Debug across different browsers
Create modern layouts/designs that are faithfully represented
I haven't used Dreamweaver in a few years but, these days, I'm really enjoying Microsoft Expression Web. It is not the FrontPage mess of yesteryears - it is a serious tool for web design and I urge you to take a close look. The code is clean and smart and it certainly gives you the option of using its tools to build a site or you can code everything 100% by hand. Don't forget, the key is not deciding which editor is best for coding by hand. The thing you should be looking for is which editor makes you a better developer.
Regardless of whether or not you're a Microsoft, LAMP, or other platform person, Expression Web is a great tool for front-end developers.
I've been using Dreamweaver for a few years now. While I initially used some of it's code generators, these days I pretty much spend my time in the code widow coding by hand and viewing the output in the browser. The design window is nice for simple coding as it will build the html for you. However, I did have problems getting the right insertion point to edit it. For example, it might place my update before and end tag when I wanted it to be after it. That led my to switch to the coding window to be sure.
I do like the fact that it opens all included files specified in the file you originally opened. I also use it's site views to synchronize my changes to the production server. I'm sure I could take advantage of other features if I bother to learn them. I haven't used any tools besides FrontPage so I can't compare.
Best thing that happened to me was learing about Eclipse and then after about Aptana. I was using notepad++ for everything, but now im doing everything with eclipse and aptana as plugin for eclipse. Just my 2 cents. Oh and its free.
Primarily I do use Adobe Dreamweaver when working on websites. It is a pretty nice tool to use along with Adobe Photoshop for any graphic designs that I create.
Also, I use Microsoft Visual Studio 2010 for Web Application Development (i.e Console apps, Web Apps, Silverlight, etc.). VS is a little different from DW but its still a nice tool for development projects.
Alison, I looked a preview of Expression Web and may check it out. It may aid as an impressive tool for my front-end dvelopment work. I also tried Microsoft Expression Blend when designing Silverlight applications. It does remind you of how Expression Web looks and feels
As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 11 years ago.
I've been using the FCK Editor for several of my client sites in the past. Recently due to some new browser security updates(I'm assuming) some of the functionality is now breaking.
I was planning on updating those sites to the most recent version, but sometimes I think the FCK is overly complex and tends to confuse my clients more than it helps them out.
What other HTML WYSIWYG (if there is such a thing) are good out there. A few of the items I really like about the FCK that I would want to keep:
Drop Down Styles based on CSS
Auto Inserted HTML templates
Auto Inserted HTML snippets
File uploader / browser
Thanks
Aloha Editor is a modern alternative to TinyMCE and CKEditor. It allows you to have common textbox style WYSIWYG Editor as replacement for textarea, but it also allows you to editing most of the DOM elements directly. This makes real WYSIWYG possible. It supports a lot a fancy new HTML5 and CSS3 functions.
Aloha Editor comes with a repository API, an autocomplete for file/images/other objects and a file/image/other object browser.
http://www.alohaeditor.org/
To get those features you're most likely going to end up with a solution that's just as bloated as FCKEditor. radEditor is the most bloated piece of crap I've ever been forced to work with. The latest version is not any better despite their claims of improvement. Cute is OK but costs money. YUI looks nice but I haven't played with it enough to know how extensible or fast it is.
The last versions of FCK (2.6+) have been much better. The dialogs are no longer popup windows so they work in more browsers. The plugin model is better than the others I have tried and it's easy to configure in one place (I may be wrong but I think TinyMCE requires the config embedded with every instance). They all generate less-than-ideal markup but FCK does the best job, especially in the latest versions. Customize the FCK toolbars down to just the essentials and I think your clients will like it a lot more. Mine do.
Yahoo Editor from Yahoo YUI
UPDATE:
Rolling up the other answers:
TinyMCE
CuteSoft
and, of course, Markdown which is the one you used to type the question in.
TinyMCE is my personal favorite. You'd have to shoehorn the rest in, however.
The next generation FCKEditor is available now in the form of CKEditor. I recently converted an application to use that having previously used FCKEditor and found it fairly straight forward.
CuteEditor (commercial versions for ASP, ASP.NET & PHP)
Are you talking controls that are free or paid? If paid, the only one I use is Telerik's radEditor. Ridiculously flexible and you can turn off basically anything and everything and make it look however you want (i.e. it's skinnable).
If you're already using jquery, then you may consider using markItUp! which is implemented as a jquery plug-in. It could be lighter than other editors with similar feature set which doesn't make use of any framework.
It supports HTML, Textile, Wiki Syntax, Markdown, BBcode. You can also use your custom syntax.
http://markitup.jaysalvat.com/
You might consider the Rich Text Editor in Flex. (Or Silverlight, for that matter.) It's a bit more of a controlled environment.
netEditr.com is based on TinyMCE as the default WYSIWYG XHTML designer. Go have a test run and see if it fits your needs.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 6 years ago.
Improve this question
I am looking for a program to make mockup screenshots with. I first found out I could do it with Visual Basic (uglier names I have yet to hear a programming language being called) from joelonsoftware.com. I don't want to start learning VB now, especially since I am still in the process of learning Java. I then found mockupscreens.com, with the searchstring "how to make mockup screenshots". But seeing as I am going to use this program quite infrequently, I don't think paying $80 for it is worth it.
The mockups I'd like to do would be mainly for Windows XP (perhaps also for GNOME, KDE and Mac OSX, but these are not top-priority).
Edit: Balsamiq is suggested, but this is also a non-free program.
Balsamiq
Visio works well, if you have it.
Personally, I like paper and a pen. Then I can't get bogged down in the LOOK of it, and go more for the usability and function. Same with websites.
Once you have the form infront of a customer, you have zero room to move - it you dont deliver it pixel-perfect, they get..... angry. :)
You don't have to learn the language to use the visual forms designer from Visual Studio to create mockups. Furthermore, the Express Edition of Visual Studio is freely available in several languages, namely VB, C# and C++. Take your pick. All ship with the same forms designer that generates backend code in one of the languages. But if you only need the designer, the code might not be relevant for you.
Microsoft Visio used to come with a template containing common Windows UI elements for this purpose. I don't know if it still does.
Jeff Attwood posted about this on CodingHorror - where he mentions Powerpoint prototyping
pen and paper, or if possible, whiteboard. Once you have something you personally think could work I'd go for as rough a computerized model as you can so you don't spend time agreeing font size before the workflow etc is done. The tool I have used here is my visual designer of Visual Studio (it doesn't look too good with screenshots, only good enough to convey what you'd like to build).
Pencil (runs within firefox)
As suggested, C# Express would be well for this, as like VB, it has a GUI designer, but it is also syntactically similar to Java, so - given what you are trying to learn and do with this, it might be a nice fit.
There is a pretty exhaustive list here:
http://c2.com/cgi/wiki?GuiPrototypingTools
Important point is whether the tool has "black&white" (or "hand-drawn") skin for your mockups, as already commented by others. Many of the tools (including my own, MockupScreens) do.
wxGlade would work as well, plus it's free software.
http://balsamiq.com/ was already mentioned, but I want to explain why I like it.
It will allow you to sketch up a screenshot, and it still looks like a pen and paper version, or a whiteboard discussion.
If you get to detailed on your screenshot, then the customer thinks you are "done" and does not understand whats taking you so long to finish the project. So this "sketchyness" serves as another layer of abstraction.
MockupUI is another one, but its mockups don't look like hand-drawn. They look like the real thing and with real data. It lets you draw wireframes as well as native widgets inheriting their appearance from your OS configuration (aka Windows visual style).
About high-fidelity mockups: The risk that a customer thinks that it's "already done" is minimal as long as you do your mockups during the design specification phase of your project (that's before starting to code). On the contrary, a sketch may be too abstract for the customer to digest, unless he is a software designer too. Sketches are for developers not customers.
Wireframes (or sketches) and mockups are not the same thing and they have different uses. One is to explain functionality, the other is a representation of what the product will look like. Check out Yisela's post about the difference between wireframes and mockups.
Your question was about mockup screenshot software, but you ended-up buying a pretty powerful wireframing software.