Git Product home page Git Product logo

tilt's People

Contributors

victorporof avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

tilt's Issues

Editor's window should have controls to move up/down in the DOM tree

  1. There should be a "Go Up" button.
  2. Double-clicking (or somehow else) on the child element's tag in the editor should "zoom in" to that element in the editor + maybe even "zoom in" the canvas to center on that element too. Centering on the element might be hard to do, since we need to face it from the front side. [And in the far future this action might gain smooth animations]
    I don't want to file a new issue, so I'll ask/request it here:
  3. Why do buttons "attributes/css/html" are up above? Shouldn't they be on the editor's window? Anyways they appear only if this window is shown.

.swf files

It would be good to see .swf animations not just the Youtube .avi formats.

Problems with FF7

I'm getting the following error message when I try to run Tilt:

Error: this.f is null
Source File: chrome://tilt/content/Tilt-content.js
Line: 96

My specs:
Windows 7(64bit)
Firefox 7.0a2
Tilt 0.1

Hotkeys

Since I have Stylish installed - the hotkey "CTRL+SHIFT+M" is occupied by it.
I know there is also a hotkey "CTRL+SHIFT+L" that opens Tilt, but I have to keep that hotkey in mind, as if I go to "Menu > Tools > Web developer > Tilt" - it shows me the CTRL+SHIFT+M hotkey.

As I'm not sure that it is an intentional duplication of used hotkes (M and L), or it is a bug/temporary solution - I am opening this issue to make things clear.
If this duplication is intentional, then a smart check like "Is CTRL+SHIFT+M hotkey occupied by another add-on? if yes - then show CTRL+SHIFT+L hotkey in the menu" would be nice, if possible.

How about making it useful? It definitely needs Attributes Inspector + inspect in DOMi

I use Attributes Inspector button for CustomButtons extension which is the great tool that show the info (in a tooltip) about the hovered element on the page and I can inspect it in DOMi if I middle-click (or ctrl+left-click) it.
But it's not working with Tilt. If Tilt is running then it just shows a single item (canvas) on the page and nothing else.
So could you please add a similar tool for inspecting the elements of the page by just pointing at them with a cursor and being able to send them to inspect in DOMi?
That would be totally awesome and I think even more useful then FireBug for writing/editing CSS styles.

Html Editing panel creates confusion

The panel on lower right (which opens up when we click on the rendering) is editable , creating a sense that we can edit the html of the page . I don't know if that is the case because even if we can change the html of the page , the rendering is not updated . And if we can't change the html of the clicked node, then the panel should not be editable.
Also the panel should have a title or something giving information about the node type, not just the content of node

Shows rotating cube - Your browser supports WebGL

Pressing Control Shift M gives a page stating:

Your browser supports WebGL
However, it indicates that support is experimental; you might see issues with some content.
You should see a spinning cube. If you do not, please visit the support site for your browser.

on Firefox 7.0.1 on Ubuntu

No option to progress to tilt.

Animation missing

Coming from the integrated Tilt feature of Firefox < 47.0 I am really missing one "feature": The animation.
Previously when accessing it it displayed a nice animation showing how to 2D website transforms into the 3D version and reverse. Now, with this addon, it just switches statically.

Flickering display and missing menu item.

Installed Tilt 0.9.1.7

Looked in Tools> and Tools>Web Developer for Tilt. Cannot find.
Looked in Tools>Add-ons and it is installed.
Used Ctrl+Shift+M to start, and it does start and it does display the Tilt DOM and I can manipulate it in 3D space.

So even though it can't be found in the menu, it can be used.

Unfortunately with Tilt installed the menu items now flicker terribly, to the point of being unusable. By this I mean I place the mouse cursor over the "Tools" menu item and press down. The word Tools vanishes and an empty drop down box flickers momentarily and then vanishes, leaving just a drop shadow outline. If I move the cursor down into the drop down box the information reappears, but its now very touchy. At various points the box will flicker, vanish then reappear. When the cursor moves over a menu item that has a ">" for expanding another drop down box, the selection highlight jumps upward one menu item, then back down. Sometimes the second drop down opens, sometimes it doesn't.

I have the web developer tool bar installed and the behavior here is affected as well. Basically it seems to happen to all the items in the menu bar.

If I remove Tilt, everything returns to normal (thank you for that). At this point the flickering unfortunately means I can not use this tool for the time being :(

I like Tilt and can see a tremendous benefit coming from it, particularly when you get it to the point that I can click on an item in the Tilt display and get its DOM trace, css etc. I will really help visualize the location of items for those of us learning Javascript for example.

My workspace:
Firefox 7.0.1 (latest release as of nov 14 2011)

Installed Add-ons

Adblock Plus 1.3.10
Adblock Plus Pop-up Addon 0.2.9
AlertCheck 1.1
BetterPrivacy 1.67
ColorZilla 2.6.2.1
Console² 0.8
Context Font 0.6
DOM Inspector 2.0.10
Firebug 1.8.3
Flagfox 4.1.8
Ghostery 2.6.0.1
Google Analytics Opt-out Browser Add-on 0.9.5
GridFox 2.0
Hostname in Titlebar 2.0.0
MeasureIt 0.4.10
Screengrab 0.96.3
ShowIP 1.0
Tilt 0.9.1.7
Web Developer 1.1.9

Exploded view

It would be just great to have control over exploded view, it would very handy to analyse the design in development. The control would be a slider that will space more or less all the elements on the image, something like the technical drawings exploded view: http://s18.postimage.org/7pkeqtexz/doc1292867197390.gif.

Wonderfull work, I waited years for this extension!

Integrate into dev tools

It would be nice to get the icon for starting Tilt back (as it was there in Firefox < 47 where Tilt was integrated) into the dev tools. I mean this part:
tiltbar

This way you can quickly access it.

FR: Draw margins/paddings for a selected element?

Could you please make Tilt draw the fields around the selected element to show where edges, paddings, margins and borders of this element are?

I often write styles for the usually visited sites with not so good appearance that I'd like to change. Sometimes I have to reposition its' elements, and I have to manually check every element's margins/paddings/borders/position values.
It would be way easier, if Tilt could draw colorful fields around the selected element, so I'd easily get know if any of the elements I need to reposition has any margin/padding/border/position non-zero values.

Context menu and "Esc" to exit

One suggestions , since it uses webgl on canvas . why is there not a context menu to save the image ? It would be very nice to have it , and also pressing Escape to hide Visualization

Do not draw text/images on background layers

As you see on the screenshot above - all the text is visually duplicated as it gets drawn on every background layers.
I'm not sure if it's possible, but could you make it not get drawn there? By HTML structure it takes place in some SINGLE element and not in any of it's ancestors.

p.s.: the same happens not only with text, but with images too.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.