Polymer core elements for Ruby on Rails project
License: MIT License
I am into Web and App Development (mobile/desktop), Cloud Computing and Mathine learning. Here's a summary of my tech stack!
I enjoy travelling and I make YouTube videos about countries and cities I visit. Also I talk a bit about shooting videos, editing and video equipment. Check out my channel here!
(not speak English)
Hello, I have a problem using "polymer-core-rails" in my rails project.
I have installed and configured the following
Gemfile
gem 'polymer-rails', '0.2.5'
gem 'polymer-core-rails', '0.2.0'
assets/components/application.html.erb
// = Require polymer / polymer
// = Require core-ajax / core-ajax
// = Require core-input / core-input
assets/javascripts/application.js
//= require polymer/webcomponents
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .
Only with this get the following error in the browser
SyntaxError: missing; before statement
{"version": 3, "file", "polymer.js", "sources": ["polymer.concat.js"], "name
Error: You tried to use polymer without loading it first. To load polymer,
... r === or && (window.Polymer = function () {throw new Error ('You tried to use polymer with ...
when I use "polymer-rails" alone without "polymer-core-rails" works fine polymer.
I am using Rails 3.2.x, polymer-rails v0.2.3 and polymer-core-rails v.0.2.0. When trying to precompile the assets, I come to discover that there are several missing referenced resources, and a few wrong references, spread among the following files:
core-animated-ages/demos/news.html
core-animated-pages/quiz1/quiz1.html
core-popup-menu/metadata.html
marked/test/browser/index.html
web-animations-js/test/test-runner.html
web-animations-js/tutorial/iframe-contents.html
web-animations-js/tutorial/sample-tutorial.html
This is blocking production deployment, of course.
Why core-elements are installed in 'app/assets/components'
It whould be better to add them to vendor/assets/components ....
What do you think ?
When using the core-drawer-panel, the drawer is no where to be seen narrow or full size. Even when you inspect the element its no where to be seen. When toggling the drawer it doesn't come into view. The main section shows up correctly and in the correct position and animated correctly. Any ideas where the drawer is?
It looks like the core-icons are missing.
Can you please add them?
Hi,
I'm testing this with a simple toolbar with a menu icon... but it doesn't appear:
I was trying two weeks ago and now again... upgraded the gem and nothing changes.
I'm comparing this to: http://www.polymer-project.org/components/core-toolbar/demo.html
and it's all the same in client code... so your internals must be doing something ... I noticed their core-icon src... looks different...
Here is my simple demo app:
https://gist.github.com/davidhq/1a3cceeb640de28daa03
thank you for hints if I'm doing something wrong...
david
I managed to precompile rails polymer assets but without polymer core:
This is working like charm:
gem 'polymer-rails'
#gem 'polymer-core-rails'
gem 'polymer-paper-rails', git: "https://github.com/alchapone/polymer-paper-rails.git"
This:
gem 'polymer-rails'
gem 'polymer-core-rails'
#or this gem 'polymer-core-rails', git: "https://github.com/alchapone/polymer-core-rails.git"
gem 'polymer-paper-rails', git: "https://github.com/alchapone/polymer-paper-rails.git"
Throws:
rake aborted!
URI::InvalidURIError: bad URI(is not URI?): http://fonts.googleapis.com/css?family=Roboto:400,300,500,700|Source+Code+Pro
(in /home/maty/.rvm/gems/ruby-2.0.0-p598/gems/polymer-core-rails-0.2.6/app/assets/components/core-doc-viewer/elements/core-doc-page.html)
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/polymer-rails-0.2.8/lib/polymer-rails/component.rb:54:in `is_external?'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/polymer-rails-0.2.8/lib/polymer-rails/component.rb:26:in `block in stylesheets'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/nokogiri-1.6.6.2/lib/nokogiri/xml/node_set.rb:187:in `block in each'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/nokogiri-1.6.6.2/lib/nokogiri/xml/node_set.rb:186:in `upto'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/nokogiri-1.6.6.2/lib/nokogiri/xml/node_set.rb:186:in `each'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/polymer-rails-0.2.8/lib/polymer-rails/component.rb:26:in `reject'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/polymer-rails-0.2.8/lib/polymer-rails/component.rb:26:in `stylesheets'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/polymer-rails-0.2.8/lib/polymer-rails/processors/components_processor.rb:35:in `inline_styles'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/polymer-rails-0.2.8/lib/polymer-rails/processors/components_processor.rb:13:in `process'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/polymer-rails-0.2.8/lib/polymer-rails/railtie.rb:20:in `block (2 levels) in <class:Railtie>'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/processor.rb:29:in `call'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/processor.rb:29:in `evaluate'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/tilt-1.4.1/lib/tilt/template.rb:103:in `render'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/context.rb:197:in `block in evaluate'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/context.rb:194:in `each'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/context.rb:194:in `evaluate'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/processed_asset.rb:12:in `initialize'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/base.rb:374:in `new'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/base.rb:374:in `block in build_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/base.rb:395:in `circular_call_protection'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/base.rb:373:in `build_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/index.rb:94:in `block in build_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/caching.rb:58:in `cache_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/index.rb:93:in `build_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/base.rb:287:in `find_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/index.rb:61:in `find_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/processed_asset.rb:111:in `block in resolve_dependencies'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/processed_asset.rb:105:in `each'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/processed_asset.rb:105:in `resolve_dependencies'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/processed_asset.rb:97:in `build_required_assets'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/processed_asset.rb:16:in `initialize'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/base.rb:374:in `new'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/base.rb:374:in `block in build_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/base.rb:395:in `circular_call_protection'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/base.rb:373:in `build_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/index.rb:94:in `block in build_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/caching.rb:58:in `cache_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/index.rb:93:in `build_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/base.rb:287:in `find_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/index.rb:61:in `find_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/bundled_asset.rb:16:in `initialize'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/base.rb:377:in `new'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/base.rb:377:in `build_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/index.rb:94:in `block in build_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/caching.rb:58:in `cache_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/index.rb:93:in `build_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/base.rb:287:in `find_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/index.rb:61:in `find_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/manifest.rb:211:in `block in find_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/manifest.rb:257:in `benchmark'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/manifest.rb:210:in `find_asset'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/manifest.rb:119:in `block in compile'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/manifest.rb:118:in `each'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/sprockets/manifest.rb:118:in `compile'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-rails-2.0.1/lib/sprockets/rails/task.rb:60:in `block (3 levels) in define'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-2.12.3/lib/rake/sprocketstask.rb:146:in `with_logger'
/home/maty/.rvm/gems/ruby-2.0.0-p598/gems/sprockets-rails-2.0.1/lib/sprockets/rails/task.rb:59:in `block (2 levels) in define'
Tasks: TOP => assets:precompile
(See full trace by running task with --trace)
When this will be available for Polymer 1.0 ?
How can I help?
Hi alchapone! We exchanged some tweets, figured it'd probably be best to file an issue.
I'm having trouble with core-drawer-panel. Here are some observations that might help debug the problem:
Using this as an example: https://www.polymer-project.org/components/core-drawer-panel/demo.html
Screenshot of the example (not of polymer-core-rails):
And implementing the exact code they have (including the blue/brown colors), here is my implementation using polymer-core-rails:
Take notice of the "Styles" tab in the Chrome Dev Tools! You'll notice that this particular CSS is never applied when using polymer-core-rails:
::content[select="[drawer]"] > * {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
box-sizing: border-box;
-moz-box-sizing: border-box;
}
I thought that maybe this was a problem with the core-drawer-panel CSS file not working at all except that div[main] (from the same file) is styled fine. I then compared those style declarations and found some subtle differences:
This is how the [main] styling was applied:
polyfill-next-selector { content: '#main > [main]'; }
::content[select="[main]"] > * {
height: 100%;
}
And this is how the [drawer] styling was applied:
polyfill-next-selector { content: ':host [drawer]'; }
::content[select="[drawer]"] > * {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
box-sizing: border-box;
-moz-box-sizing: border-box;
}
So I tried changing it to this (to no success):
`polyfill-next-selector { content: '#drawer > [drawer]'; }`
I also attempted adding the shadow-shim attribute in the HTML file (as I'd seen it in other components) (also to no success):
<link rel="stylesheet" href="core-drawer-panel.css" shim-shadowdom>
I'll update if I find any more information...
React
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
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
Django
The Web framework for perfectionists with deadlines.
Laravel
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.
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft
Open source projects and samples from Microsoft.
Google
Google ❤️ Open Source for everyone.
Alibaba
Alibaba Open Source for everyone
D3
Data-Driven Documents codes.
Tencent
China tencent open source team.