Skip to content

jquery-ui removal - using native only #2012

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
adumesny merged 1 commit into from
Aug 20, 2022
Merged

jquery-ui removal - using native only #2012

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion .eslintignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
dist/*
demo/*
spec/*
src/jq/*.js
31 changes: 14 additions & 17 deletions Gruntfile.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ module.exports = function(grunt) {
grunt.loadNpmTasks('grunt-sass');
grunt.loadNpmTasks('grunt-contrib-cssmin');
grunt.loadNpmTasks('grunt-contrib-copy');
grunt.loadNpmTasks('grunt-contrib-uglify');
// grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-eslint');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-protractor-runner');
Expand Down Expand Up @@ -45,21 +45,18 @@ module.exports = function(grunt) {
}
}
},
uglify: {
options: {
sourceMap: true,
output: {
comments: 'some'
}
},
dist: {
files: {
'dist/jq/jquery.js': 'src/jq/jquery.js',
'dist/jq/jquery-ui.js': 'src/jq/jquery-ui.js',
'dist/jq/jquery.ui.touch-punch.js': 'src/jq/jquery.ui.touch-punch.js',
}
}
},
// uglify: {
// options: {
// sourceMap: true,
// output: {
// comments: 'some'
// }
// },
// dist: {
// files: {
// }
// }
// },
eslint: {
target: ['*.js', 'src/*.js']
},
Expand Down Expand Up @@ -107,6 +104,6 @@ module.exports = function(grunt) {
});

grunt.registerTask('lint', ['eslint']);
grunt.registerTask('default', ['sass', 'cssmin', /*'eslint',*/ 'copy', 'uglify']);
grunt.registerTask('default', ['sass', 'cssmin', /*'eslint',*/ 'copy', /*'uglify'*/]);
grunt.registerTask('e2e-test', ['connect', 'protractor_webdriver', 'protractor']);
};
1 change: 0 additions & 1 deletion demo/angular-ngFor.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@
import { Component, AfterViewInit, OnChanges, SimpleChanges, Input, ChangeDetectionStrategy } from '@angular/core';

import { GridStack, GridStackWidget } from 'gridstack';
import 'gridstack/dist/h5/gridstack-dd-native';

@Component({
selector: 'app-angular-ng-for-test',
Expand Down
1 change: 0 additions & 1 deletion demo/angular.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@
import { Component, OnInit } from '@angular/core';

import { GridStack, GridStackWidget } from 'gridstack';
import 'gridstack/dist/h5/gridstack-dd-native';

@Component({
selector: 'app-angular-test',
Expand Down
2 changes: 1 addition & 1 deletion demo/anijs.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
<link rel="stylesheet" href="https://anijs.github.io/lib/anicollection/anicollection.css" />
<link rel="stylesheet" href="demo.css"/>

<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/AniJS/0.9.3/anijs.js"></script>
</head>
<body>
Expand Down
2 changes: 1 addition & 1 deletion demo/canvasJS.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<title>CanvasJS grid demo</title>

<link rel="stylesheet" href="demo.css"/>
<script src="../dist/gridstack-jq.js"></script>
<script src="https://cdn.jsdelivr.net/npm/gridstack@6.0.0-beta/dist/gridstack-jq.js"></script>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>

<style type="text/css">
Expand Down
2 changes: 1 addition & 1 deletion demo/cell-height.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<title>cell height demo</title>

<link rel="stylesheet" href="demo.css"/>
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>
<style type="text/css">
.container {
background-color: lightblue;
Expand Down
2 changes: 1 addition & 1 deletion demo/column.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@

<link rel="stylesheet" href="demo.css"/>
<link rel="stylesheet" href="../dist/gridstack-extra.css"/>
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>
</head>
<body>
<div class="container-fluid">
Expand Down
4 changes: 2 additions & 2 deletions demo/custom-engine.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<title>Custom Engine</title>

<link rel="stylesheet" href="demo.css"/>
<!-- <script src="../dist/gridstack-h5.js"></script> -->
<!-- <script src="../dist/gridstack-all.js"></script> -->
<script src="events.js"></script>
</head>
<body>
Expand All @@ -24,7 +24,7 @@ <h1>Custom Engine</h1>

<script type="module" > // so we can use import
// get CORS error in Chrome...need to have http://localhost/ URL - see https://stackoverflow.com/questions/50197495/javascript-modules-and-cors
import { GridStack, GridStackEngine } from '../dist/gridstack-h5.js';
import { GridStack, GridStackEngine } from '../dist/gridstack-all.js';

/**
* Custom engine class that only allows vertical movement and resizing
Expand Down
1 change: 0 additions & 1 deletion demo/drag-and-drop-dataTransfer-angular.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@
import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { GridStack, GridStackWidget, GridStackNode } from 'gridstack';
import { DDElement } from "gridstack/dist/h5/dd-element";
import 'gridstack/dist/h5/gridstack-dd-native';

@Component({
selector: 'grid-stack-test',
Expand Down
2 changes: 1 addition & 1 deletion demo/drag-and-drop-dataTransfer.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
<link rel="stylesheet" href="demo.css" />
<link rel="stylesheet" href="../dist/gridstack-extra.css" />

<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>
</head>

<body>
Expand Down
2 changes: 1 addition & 1 deletion demo/float.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<title>Float grid demo</title>

<link rel="stylesheet" href="demo.css"/>
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>

</head>
<body>
Expand Down
6 changes: 6 additions & 0 deletions demo/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,5 +31,11 @@ <h1>Demos</h1>
<li><a href="web1.html">Website demo 1</a></li>
<li><a href="web2.html">Website demo 2</a></li>
</ul>
<h1>Old v5.1.1 Jquery Demos</h1>
Note: those are no longer supported, and use a old version of the lib.
<ul>
<li><a href="two-jq.html">Two grids</a></li>
<li><a href="nested-jq.html">Nested grids</a></li>
</ul>
</body>
</html>
2 changes: 1 addition & 1 deletion demo/knockout.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
<link rel="stylesheet" href="demo.css"/>

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.5.0/knockout-debug.js"></script>
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>
</head>
<body>
<div class="container-fluid">
Expand Down
2 changes: 1 addition & 1 deletion demo/locked.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<title>Locked demo</title>

<link rel="stylesheet" href="demo.css"/>
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>
</style>
</head>
<body>
Expand Down
2 changes: 1 addition & 1 deletion demo/mobile.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@

<link rel="stylesheet" href="demo.css"/>
<link rel="stylesheet" href="../dist/gridstack-extra.css"/>
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>

</head>
<body>
Expand Down
4 changes: 2 additions & 2 deletions demo/nested-jq.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,10 @@
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Nested JQuery grids demo (ES6)</title>
<title>Nested JQuery grids demo (old v5.1.1) which never worked fully</title>
<link rel="stylesheet" href="demo.css"/>
<link rel="stylesheet" href="../dist/gridstack-extra.min.css"/>
<script src="../dist/gridstack-jq.js"></script>
<script src="https://cdn.jsdelivr.net/npm/gridstack@5.1.1/dist/gridstack-jq.js"></script>
<style type="text/css">
/* make nested grids have slightly darker bg */
.grid-stack.grid-stack-nested {
Expand Down
2 changes: 1 addition & 1 deletion demo/nested.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<title>Nested grids demo (ES6)</title>
<link rel="stylesheet" href="demo.css"/>
<link rel="stylesheet" href="../dist/gridstack-extra.min.css"/>
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>
<style type="text/css">
/* make nested grids have slightly darker bg */
.grid-stack.grid-stack-nested {
Expand Down
2 changes: 1 addition & 1 deletion demo/nested_advanced.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<title>Nested grids demo (ES6)</title>
<link rel="stylesheet" href="demo.css"/>
<link rel="stylesheet" href="../dist/gridstack-extra.min.css"/>
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>
<style type="text/css">
.grid-stack.grid-stack-nested {
background: rgba(255, 255, 255, 0.3);
Expand Down
2 changes: 1 addition & 1 deletion demo/react-hooks.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Gridstack.js React integration example</title>
<link rel="stylesheet" href="demo.css" />
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>

<!-- Scripts to use react inside html -->
<script src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
Expand Down
2 changes: 1 addition & 1 deletion demo/react.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Gridstack.js React integration example</title>
<link rel="stylesheet" href="demo.css" />
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>

<!-- Scripts to use react inside html -->
<script src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
Expand Down
2 changes: 1 addition & 1 deletion demo/responsive.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@

<link rel="stylesheet" href="demo.css"/>
<link rel="stylesheet" href="../dist/gridstack-extra.css"/>
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>
<style type="text/css">
body { margin: 8px 0; } /* make grid take entire vw so we have correct square cells */
</style>
Expand Down
2 changes: 1 addition & 1 deletion demo/right-to-left(rtl).html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
</style>

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.5.0/knockout-min.js"></script>
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>
</head>
<body>
<div class="container-fluid">
Expand Down
2 changes: 1 addition & 1 deletion demo/serialization.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<title>Serialization demo</title>

<link rel="stylesheet" href="demo.css"/>
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>
</head>
<body>
<div class="container-fluid">
Expand Down
2 changes: 1 addition & 1 deletion demo/static.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<title>Static Grid</title>

<link rel="stylesheet" href="demo.css"/>
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>

</head>
<body>
Expand Down
4 changes: 2 additions & 2 deletions demo/two-jq.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,11 +10,11 @@
<link rel="stylesheet" href="demo.css"/>
<link rel="stylesheet" href="../dist/gridstack-extra.css"/>

<script src="../dist/gridstack-jq.js"></script>
<script src="https://cdn.jsdelivr.net/npm/gridstack@5.1.1/dist/gridstack-jq.js"></script>
</head>
<body>
<div class="container-fluid">
<h1>Two grids demo (Jquery version)</h1>
<h1>Two grids demo (old v5.1.1 Jquery version)</h1>

<div class="row">
<div class="col-md-3">
Expand Down
2 changes: 1 addition & 1 deletion demo/two.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
<link rel="stylesheet" href="demo.css"/>
<link rel="stylesheet" href="../dist/gridstack-extra.css"/>

<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>
</head>
<body>
<div class="container-fluid">
Expand Down
2 changes: 1 addition & 1 deletion demo/two_vertical.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
<title>Two vertical grids demo</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<link rel="stylesheet" href="demo.css"/>
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>
</head>
<body>
<div class="container-fluid">
Expand Down
2 changes: 1 addition & 1 deletion demo/vue2js.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Gridstack.js Vue integration example</title>
<link rel="stylesheet" href="demo.css"/>
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>
</head>
<body>
<main id="app">
Expand Down
2 changes: 1 addition & 1 deletion demo/vue3js.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Gridstack.js Vue integration example</title>
<link rel="stylesheet" href="demo.css"/>
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>
</head>
<body>
<main id="app">
Expand Down
2 changes: 1 addition & 1 deletion demo/web-comp.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<!-- Polyfills only needed for Firefox and Edge. -->
<script src="https://unpkg.com/@webcomponents/webcomponentsjs@latest/webcomponents-loader.js"></script>
<link rel="stylesheet" href="demo.css"/>
<script src="../dist/gridstack-h5.js"></script>
<script src="../dist/gridstack-all.js"></script>
</head>
<body>
<h1>LitElement Web Component</h1>
Expand Down
2 changes: 1 addition & 1 deletion demo/web1.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@

<!-- support for IE -->
<script src="../dist/es5/gridstack-poly.js"></script>
<script src="../dist/es5/gridstack-jq.js"></script>
<script src="../dist/es5/gridstack.js"></script>
</head>

<body>
Expand Down
2 changes: 1 addition & 1 deletion demo/web2.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@

<!-- support for IE -->
<script src="../dist/es5/gridstack-poly.js"></script>
<script src="../dist/es5/gridstack-jq.js"></script>
<script src="../dist/es5/gridstack.js"></script>

<style type="text/css">
.grid-stack-item-removing {
Expand Down
4 changes: 2 additions & 2 deletions demo/website.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

<!-- ES5 support for IE -->
<script src="../dist/es5/gridstack-poly.js"></script>
<script src="../dist/es5/gridstack-jq.js"></script>
<script src="../dist/es5/gridstack.js"></script>

<script src="https://getbootstrap.com/docs/4.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-xrRywqdh3PHs8keKZN+8zzc5TX0GRTLCcmivcbNJWm2rs5C8PRhcEn3czEjhAO9o" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@9.16.2/build/highlight.min.js"></script>
Expand Down Expand Up @@ -197,7 +197,7 @@ <h3>Code</h3>
<pre>
<code class="html">npm install gridstack</code>
<p class="text-white">then in html:</p>
<code class="html">&lt;script src="../dist/gridstack-h5.js"&gt;&lt;/script&gt;
<code class="html">&lt;script src="../dist/gridstack-all.js"&gt;&lt;/script&gt;
&lt;link href="../dist/gridstack.min.css" rel="stylesheet"/&gt;
&lt;style type="text/css"&gt;
.grid-stack { background: #FAFAD2; }
Expand Down
7 changes: 4 additions & 3 deletions doc/CHANGES.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ Change log
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
**Table of Contents** *generated with [DocToc](http://doctoc.herokuapp.com/)*

- [TBD](#tbd)
- [6.0.0-beta (TBD)](#600-beta-tbd)
- [5.1.1 (2022-06-16)](#511-2022-06-16)
- [5.1.0 (2022-05-21)](#510-2022-05-21)
- [5.0.0 (2022-01-10)](#500-2022-01-10)
Expand Down Expand Up @@ -69,8 +69,9 @@ Change log

<!-- END doctoc generated TOC please keep comment here to allow auto update -->

## TBD
* converted previous HTML5 `draggable=true` based code to simple mouse move/enter/leave events for dragging in preparation of mobile support.
## 6.0.0-beta (TBD)
* converted previous HTML5 `draggable=true` based code to simple Mouse Events and Touch mobile support for drag&Drop.
* removed all jquery-ui related code, and D7D plugging as we only support native events now
* changed `commit()` to be `batchUpdate(false)` to make it easier to turn batch on/off. updated doc. old API remains for now

## 5.1.1 (2022-06-16)
Expand Down
Loading