harmsk / atom-html-preview Goto Github PK
View Code? Open in Web Editor NEWAtom HTML Live Preview Package
License: MIT License
Atom HTML Live Preview Package
License: MIT License
Call ::getActiveTextEditor instead
Workspace.getActiveEditor (/Applications/Atom.app/Contents/Resources/app/src/workspace.js:674:12)
Object.toggle (/Users/lifeiscontent/.atom/packages/atom-html-preview/lib/atom-html-preview.coffee:41:28)
Is there a tweak that will work / preview with inline Javascript?
Use ::paneForURI instead.
Workspace.paneForUri (/Applications/Atom.app/Contents/Resources/app/src/workspace.js:724:7)
<unknown> (/Users/lifeiscontent/.atom/packages/atom-html-preview/lib/atom-html-preview-view.coffee:68:28)
Steps to reproduce:
Expected: The preview can be made larger and smaller (dragging left and right).
Actual: The preview can only be made larger (dragging left).
I get the above error when running atom-html-preview
. Below the stack trace I get with the error:
TypeError: Cannot read property 'path' of undefined
at AtomHtmlPreviewView.module.exports.AtomHtmlPreviewView.renderHTMLCode (/Users/username/.atom/packages/atom-html-preview/lib/atom-html-preview-view.coffee:98:43)
at AtomHtmlPreviewView.module.exports.AtomHtmlPreviewView.renderHTML (/Users/username/.atom/packages/atom-html-preview/lib/atom-html-preview-view.coffee:95:8)
at /Users/username/.atom/packages/atom-html-preview/lib/atom-html-preview.coffee:44:25
at _fulfilled (/Applications/Atom.app/Contents/Resources/app/node_modules/q/q.js:794:54)
at self.promiseDispatch.done (/Applications/Atom.app/Contents/Resources/app/node_modules/q/q.js:823:30)
at Promise.promise.promiseDispatch (/Applications/Atom.app/Contents/Resources/app/node_modules/q/q.js:756:13)
at /Applications/Atom.app/Contents/Resources/app/node_modules/q/q.js:516:49
at flush (/Applications/Atom.app/Contents/Resources/app/node_modules/q/q.js:110:17)
at process._tickCallback (node.js:366:11)
Running Atom 0.187.0 with atom-html-preview
0.1.3.
This package cannot be used with Atom >=0.206 due to the deprecation of API.
Not sure how to get which API calls needs to be changed though.
This is a feature request:
Is there a way to mirror or track the current view of the editor with the html preview? For example when scrolling or changing the location of the cursor, the preview would also update to the new view.
Use Workspace::getTextEditors instead
Workspace.getEditors (/Applications/Atom.app/Contents/Resources/app/src/workspace.js:368:7)
AtomHtmlPreviewView.editorForId (/Users/lifeiscontent/.atom/packages/atom-html-preview/lib/atom-html-preview-view.coffee:60:4)
Call Workspace::addOpener instead
Workspace.registerOpener (/Applications/Atom.app/Contents/Resources/app/src/workspace.js:593:12)
Object.activate (/Users/lifeiscontent/.atom/packages/atom-html-preview/lib/atom-html-preview.coffee:22:19)
I was using this plugin to develop html page which includes JS code.
the moment i type 'for' loop
for(var y=0; y < 100)
.... it hangs
as it seems obvious, this plugin tries to refresh html page as there are changes made,it tries to execute for loop and it goes into infinite loop.
can we alt least provide an option to refresh the preview only when file get Saved (Ctrl + S) ?
My html document is long and preview always resets to top position while making changes. It should not show changes in realtime.
Would it be possible to be able to pull the preview into a new window (mac)
This would be rather awesome so you can code on monitor1 and preview live on monitor 2? (not really a bug but a feature request)
Great package.
Hi,
This plugin causes Atom Editor to crash when being used with simple HTML like
<li> <ul>
and css classes.
Using Atom 0.152.0 and Atom HTML preview 0.1.3 on Windows 7 x64 SP1 Ultimate Edition.
Let me know if you want more information and how I can grab it for you.
I often do minor tweaks to css, which basically leads to me to close and then reopen the preview to do updates.
I understand the figuring out how to watch for those kind of updates and reload based on that would be tricky, but a keystroke for refreshing the preview would basically cover my wants.
Any chance this could live reload whenever a file changes?
Use ::paneForURI instead.
Workspace.paneForUri (/Applications/Atom.app/Contents/Resources/app.asar/src/workspace.js:1003:7)
Object.toggle (/Users/yoshidajunya/.atom/packages/atom-html-preview/lib/atom-html-preview.coffee:46:33)
atom-workspace.subscriptions.add.atom.commands.add.atom-html-preview:toggle (/Users/yoshidajunya/.atom/packages/atom-html-preview/lib/atom-html-preview.coffee:20:91)
CommandRegistry.module.exports.CommandRegistry.handleCommandEvent (/Applications/Atom.app/Contents/Resources/app.asar/src/command-registry.js:238:29)
please show html title (as it would appear in browser tab) in preview tab instead of 'filename Preview'
thanks
As the title mentions, i can't resize the preview window on linux which is a problem because it opens up too small. Is this a bug or could I be overlooking something?
atom.workspaceView is no longer available.
In most cases you will not need the view. See the Workspace docs for
alternatives: https://atom.io/docs/api/latest/Workspace.
If you do need the view, please use atom.views.getView(atom.workspace)
,
which returns an HTMLElement.
Atom.Object.defineProperty.get (C:\Users\Andrew\AppData\Local\atom\app-0.187.0\resources\app\src\atom.js:54:11)
Object.activate (C:\Users\Andrew\.atom\packages\atom-html-preview\lib\atom-html-preview.coffee:9:9)
Live preview linking a stylesheet does not work but opening in chrome works fine.
atom.workspaceView is no longer available.
In most cases you will not need the view. See the Workspace docs for
alternatives: https://atom.io/docs/api/latest/Workspace.
If you do need the view, please use atom.views.getView(atom.workspace)
,
which returns an HTMLElement.
Atom.Object.defineProperty.get (/Applications/Atom.app/Contents/Resources/app/src/atom.js:53:11)
Object.activate (/Users/utilisateur/.atom/packages/atom-html-preview/lib/atom-html-preview.coffee:9:9)
atom.workspaceView is no longer available.
In most cases you will not need the view. See the Workspace docs for
alternatives: https://atom.io/docs/api/latest/Workspace.
If you do need the view, please use atom.views.getView(atom.workspace)
,
which returns an HTMLElement.
Atom.Object.defineProperty.get (/Applications/Atom.app/Contents/Resources/app/src/atom.js:53:11)
Object.activate (/Users/utilisateur/.atom/packages/atom-html-preview/lib/atom-html-preview.coffee:9:9)
In keymaps/atom-html-preview.cson: Use the atom-workspace
tag instead of the workspace
class.
Since the latest update to the package I find I can no longer drag the preview window into a Chrome browser. No errors are created, just an empty tab with html-preview://editor/8 in the location bar.
The Chrome Version is 41.0.2272.118 m
Pane item with class AtomHtmlPreviewView
should implement ::getURI
instead of ::getUri
.
wrappedOpener (/Applications/Atom.app/Contents/Resources/app/src/workspace.js:578:16)
Workspace.openURIInPane (/Applications/Atom.app/Contents/Resources/app/src/workspace.js:493:22)
Requiring $$$
from atom
is no longer supported.
Please require atom-space-pen-views
instead:
{$$$} = require 'atom-space-pen-views'
Add "atom-space-pen-views": "^2.0.3"
to your package dependencies.
Object.Object.defineProperty.get (/Applications/Atom.app/Contents/Resources/app/exports/atom.js:55:9)
Object.<anonymous> (/Users/lifeiscontent/.atom/packages/atom-html-preview/lib/atom-html-preview-view.coffee:2:4)
atom.workspaceView is no longer available.
In most cases you will not need the view. See the Workspace docs for
alternatives: https://atom.io/docs/api/latest/Workspace.
If you do need the view, please use atom.views.getView(atom.workspace)
,
which returns an HTMLElement.
Atom.Object.defineProperty.get (/Users/Daehli/Downloads/Atom.app/Contents/Resources/app/src/atom.js:54:11)
Object.activate (/Users/Daehli/.atom/packages/atom-html-preview/lib/atom-html-preview.coffee:9:9)
atom .089
css files linked do not affect preview. preview document is plain html.
seems relative paths to images don't display?
same as #1 with CSS files? i'll try putting them to a CDN for and using absolute paths.
The HTML preview does not seem to be able to play audio sources
<html>
<audio id="player" src="http://mp3.tom7.org/t7es/2013/iced-coffee.mp3" controls></audio>
</html>
The audio controls are visible but it is not possible to play the linked file.
I have this error when I try to see the preview of the html:
[Enter steps to reproduce below:]
Atom Version: 0.190.0
System: Mac OS X 10.9.5
Thrown From: atom-html-preview package, v0.1.6
Uncaught Error: Can't save buffer with no file path
At /Applications/Atom.app/Contents/Resources/app/node_modules/q/q.js:128
Error: Can't save buffer with no file path
at TextBuffer.module.exports.TextBuffer.saveAs (/Applications/Atom.app/Contents/Resources/app/node_modules/text-buffer/lib/text-buffer.js:904:15)
at TextBuffer.module.exports.TextBuffer.save (/Applications/Atom.app/Contents/Resources/app/node_modules/text-buffer/lib/text-buffer.js:899:19)
at TextEditor.module.exports.TextEditor.save (/Applications/Atom.app/Contents/Resources/app/src/text-editor.js:556:26)
at AtomHtmlPreviewView.module.exports.AtomHtmlPreviewView.renderHTMLCode (/Users/jeancarloperez/.atom/packages/atom-html-preview/lib/atom-html-preview-view.coffee:95:76)
at AtomHtmlPreviewView.module.exports.AtomHtmlPreviewView.renderHTML (/Users/jeancarloperez/.atom/packages/atom-html-preview/lib/atom-html-preview-view.coffee:92:8)
at /Users/jeancarloperez/.atom/packages/atom-html-preview/lib/atom-html-preview.coffee:54:25
at _fulfilled (/Applications/Atom.app/Contents/Resources/app/node_modules/q/q.js:794:54)
at self.promiseDispatch.done (/Applications/Atom.app/Contents/Resources/app/node_modules/q/q.js:823:30)
at Promise.promise.promiseDispatch (/Applications/Atom.app/Contents/Resources/app/node_modules/q/q.js:756:13)
at /Applications/Atom.app/Contents/Resources/app/node_modules/q/q.js:516:49
at flush (/Applications/Atom.app/Contents/Resources/app/node_modules/q/q.js:110:17)
at process._tickCallback (node.js:357:13)
-3:31.5 project-manager:toggle (atom-text-editor.editor)
-3:30.6 core:confirm (atom-text-editor.editor.mini)
2x -3:22.2 core:paste (atom-workspace.workspace.scrollbars-visible-always.theme-atom-dark-syntax.theme-atom-dark-ui.find-visible)
-0:37.0 grammar-selector:show (atom-text-editor.editor)
-0:36.0 core:confirm (atom-text-editor.editor.mini)
5x -0:28.1 core:copy (atom-text-editor.editor)
-0:27.2 application:new-file (atom-text-editor.editor)
-0:26.8 core:paste (atom-text-editor.editor)
-0:26.5 emmet:insert-formatted-line-break-only (atom-text-editor.editor)
-0:26.5 editor:newline (atom-text-editor.editor)
-0:25.4 core:undo (atom-text-editor.editor)
-0:24.2 grammar-selector:show (atom-text-editor.editor)
-0:22.9 core:confirm (atom-text-editor.editor.mini)
2x -0:20.8 find-and-replace:show (atom-text-editor.editor)
2x -0:11.5 core:move-left (atom-text-editor.editor.mini)
-0:01.1 atom-html-preview:toggle (atom-text-editor.editor)
{
"core": {
"themes": [
"atom-dark-ui",
"atom-dark-syntax"
]
}
}
# User
atom-html-preview, v0.1.6
autocomplete-paths, v1.0.2
autocomplete-plus, v2.7.1
emmet, v2.3.6
file-icons, v1.5.3
minimap, v4.7.5
project-manager, v1.15.5
# Dev
No dev packages
Requiring $
from atom
is no longer supported.
If you are using space-pen
, please require $
from atom-space-pen-views
. Otherwise require jquery
instead:
{$} = require 'atom-space-pen-views'
or
$ = require 'jquery'
Add "atom-space-pen-views": "^2.0.3"
to your package dependencies.
Or add "jquery": "^2"
to your package dependencies.
Object.Object.defineProperty.get (C:\Users\pkatariy\AppData\Local\atom\app-0.189.0\resources\app\exports\atom.js:43:9)
Object.<anonymous> (C:\Users\pkatariy\.atom\packages\atom-html-preview\lib\atom-html-preview-view.coffee:2:1)
atom.workspaceView is no longer available.
In most cases you will not need the view. See the Workspace docs for
alternatives: https://atom.io/docs/api/latest/Workspace.
If you do need the view, please use atom.views.getView(atom.workspace)
,
which returns an HTMLElement.
Atom.Object.defineProperty.get (/Applications/Atom.app/Contents/Resources/app/src/atom.js:53:11)
Object.activate (/Users/Yohann/.atom/packages/atom-html-preview/lib/atom-html-preview.coffee:9:9)
In keymaps\atom-html-preview.cson: Use the atom-workspace
tag instead of the workspace
class.
I'm running live preview for an HTML page with a linked css file.
The css is linked from "assets/css/main.css" in my project folder where HTML is at the root of my folder.
It's working fine for live preview but if I modify anything in the CSS file, changes aren't reloaded to the live preview unless I close and re-open it for my HTML document.
Couldn't it watch for changes in referenced files and reload preview with changes if detected ?
In the case of css changes, it could only refresh the styles without fully reloading the page (just as Brackets is doing for its live preview)
atom.workspaceView is no longer available.
In most cases you will not need the view. See the Workspace docs for
alternatives: https://atom.io/docs/api/latest/Workspace.
If you do need the view, please use atom.views.getView(atom.workspace)
,
which returns an HTMLElement.
Atom.Object.defineProperty.get (/opt/atom/resources/app/src/atom.js:54:11)
Object.activate (/home/mario/.atom/packages/atom-html-preview/lib/atom-html-preview.coffee:9:9)
Requiring ScrollView
from atom
is no longer supported.
Please require ScrollView
from atom-space-pen-view
instead:
{ScrollView} = require 'atom-space-pen-views'
Note that the API has changed slightly! Please read the docs at https://github.com/atom/atom-space-pen-views
Add "atom-space-pen-views": "^2.0.3"
to your package dependencies.
Object.Object.defineProperty.get (C:\Users\pkatariy\AppData\Local\atom\app-0.189.0\resources\app\exports\atom.js:79:9)
Object.<anonymous> (C:\Users\pkatariy\.atom\packages\atom-html-preview\lib\atom-html-preview-view.coffee:2:9)
Call Workspace::addOpener instead
Workspace.registerOpener (C:\Users\pkatariy\AppData\Local\atom\app-0.189.0\resources\app\src\workspace.js:593:12)
Object.activate (C:\Users\pkatariy\.atom\packages\atom-html-preview\lib\atom-html-preview.coffee:22:19)
In keymaps\atom-html-preview.cson: Use the atom-workspace
tag instead of the workspace
class.
Requiring $
from atom
is no longer supported.
If you are using space-pen
, please require $
from atom-space-pen-views
. Otherwise require jquery
instead:
{$} = require 'atom-space-pen-views'
or
$ = require 'jquery'
Add "atom-space-pen-views": "^2.0.3"
to your package dependencies.
Or add "jquery": "^2"
to your package dependencies.
Object.Object.defineProperty.get (/Applications/Atom.app/Contents/Resources/app/exports/atom.js:43:9)
Object.<anonymous> (/Users/lifeiscontent/.atom/packages/atom-html-preview/lib/atom-html-preview-view.coffee:2:1)
atom.workspaceView is no longer available.
In most cases you will not need the view. See the Workspace docs for
alternatives: https://atom.io/docs/api/latest/Workspace.
If you do need the view, please use atom.views.getView(atom.workspace)
,
which returns an HTMLElement.
Atom.Object.defineProperty.get (c:\Users\Kevin\AppData\Local\atom\app-0.176.0\resources\app\src\atom.js:53:11)
Object.activate (c:\Users\Kevin\.atom\packages\atom-html-preview\lib\atom-html-preview.coffee:9:9)
Requiring ScrollView
from atom
is no longer supported.
Please require ScrollView
from atom-space-pen-view
instead:
{ScrollView} = require 'atom-space-pen-views'
Note that the API has changed slightly! Please read the docs at https://github.com/atom/atom-space-pen-views
Add "atom-space-pen-views": "^2.0.3"
to your package dependencies.
Object.Object.defineProperty.get (/Applications/Atom.app/Contents/Resources/app/exports/atom.js:79:9)
Object.<anonymous> (/Users/lifeiscontent/.atom/packages/atom-html-preview/lib/atom-html-preview-view.coffee:2:9)
In keymaps/atom-html-preview.cson: Use the atom-workspace
tag instead of the workspace
class.
It´s possible implement JPS preview?
Use ::paneForURI instead.
Workspace.paneForUri (/Applications/Atom.app/Contents/Resources/app/src/workspace.js:724:7)
Object.toggle (/Users/lifeiscontent/.atom/packages/atom-html-preview/lib/atom-html-preview.coffee:46:33)
Requiring $$$
from atom
is no longer supported.
Please require atom-space-pen-views
instead:
{$$$} = require 'atom-space-pen-views'
Add "atom-space-pen-views": "^2.0.3"
to your package dependencies.
Object.Object.defineProperty.get (C:\Users\pkatariy\AppData\Local\atom\app-0.189.0\resources\app\exports\atom.js:55:9)
Object.<anonymous> (C:\Users\pkatariy\.atom\packages\atom-html-preview\lib\atom-html-preview-view.coffee:2:4)
Interferes with the default for quick goto shortcut in Atom.
Store package style sheets in the styles/
directory instead of stylesheets/
in the atom-html-preview
package
Package.getStylesheetsPath (C:\Users\pkatariy\AppData\Local\atom\app-0.189.0\resources\app\src\package.js:448:9)
Package.getStylesheetPaths (C:\Users\pkatariy\AppData\Local\atom\app-0.189.0\resources\app\src\package.js:459:32)
The atom buffer is unicode by default, but if you preview an HTML snippet containing unicode characters, they are not rendered properly.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.